/* COMPARACLIMA - stile pagine SEO (coerente col comparatore, layout articolo) */

body.seo { background: #f6f7f9; }

.s-wrap { max-width: 1080px; margin: 0 auto; padding: 0 24px; }

.s-top { background: #fff; border-bottom: 1px solid #dde2e8; }
.s-top .s-wrap { display: flex; align-items: center; gap: 22px; padding-top: 13px; padding-bottom: 13px; }
.s-logo { font-size: 18px; font-weight: 800; color: #12406e; text-decoration: none; letter-spacing: .2px; }
.s-nav { display: flex; gap: 16px; flex-wrap: wrap; align-items: center; }
.s-nav a { color: #40506a; text-decoration: none; font-size: 13.5px; }
.s-nav a:hover { color: #12406e; text-decoration: underline; }
.s-nav .s-cta {
  background: #12406e; color: #fff; padding: 6px 12px; border-radius: 4px; font-weight: 600;
}
.s-nav .s-cta:hover { text-decoration: none; background: #0d3357; }

.s-crumbs { padding-top: 12px; font-size: 12px; color: #5a6572; }
.s-crumbs a { color: #12406e; text-decoration: none; }
.s-crumbs a:hover { text-decoration: underline; }
.s-crumbs .sep { margin: 0 6px; }

main.s-wrap { padding-top: 8px; padding-bottom: 44px; }
main h1 { font-size: 27px; line-height: 1.25; margin: 14px 0 10px; letter-spacing: -.3px; }
main h2 { font-size: 19px; margin: 28px 0 10px; }
.s-sub { color: #5a6572; margin: 0 0 14px; }
.s-intro { font-size: 15.5px; line-height: 1.6; color: #2a3442; max-width: 820px; }
.s-mut { color: #8a94a2; font-size: 12px; }
.s-def { font-size: 16px; line-height: 1.65; background: #eef4fa; border-left: 3px solid #12406e; padding: 12px 16px; border-radius: 0 6px 6px 0; }

.s-kpis {
  display: flex; flex-wrap: wrap; gap: 12px; margin: 16px 0 6px;
}
.s-kpis > div {
  background: #fff; border: 1px solid #dde2e8; border-radius: 6px;
  padding: 10px 16px; min-width: 118px;
}
.s-kpis b { display: block; font-size: 19px; font-family: Consolas, monospace; color: #12406e; }
.s-kpis span { font-size: 10.5px; text-transform: uppercase; letter-spacing: .5px; color: #5a6572; }

.s-tablewrap { overflow-x: auto; margin: 10px 0 16px; }
.s-table {
  width: 100%; border-collapse: collapse; background: #fff;
  border: 1px solid #dde2e8; font-size: 13.2px;
}
.s-table th, .s-table td { padding: 8px 11px; border-bottom: 1px solid #edf0f3; text-align: left; }
.s-table thead th {
  background: #eef1f5; font-size: 11px; text-transform: uppercase; letter-spacing: .4px; color: #5a6572;
}
.s-table .num { text-align: right; font-family: Consolas, monospace; }
.s-table a { color: #12406e; text-decoration: none; font-weight: 550; }
.s-table a:hover { text-decoration: underline; }
.s-table tbody tr:nth-child(even) { background: #fafbfc; }
.s-spec th { width: 40%; font-weight: 600; color: #40506a; background: #fafbfc; }
.s-vs td.s-win { background: #e9f5ee; font-weight: 700; color: #1e6b41; }
/* Colonne prodotto: divisori verticali veri e valori TUTTI allineati a destra */
.s-vs td, .s-vs thead th + th { border-left: 1px solid #dde2e8; text-align: right; }
.s-vs td { font-variant-numeric: tabular-nums; }
.s-score {
  display: inline-block; min-width: 30px; text-align: center; color: #fff;
  background: #2c8a43; border-radius: 9px; padding: 1px 6px; font-size: 11px; font-weight: 700;
}

.s-btn {
  display: inline-block; background: #12406e; color: #fff !important; text-decoration: none;
  padding: 10px 18px; border-radius: 5px; font-size: 14px; font-weight: 600; margin: 6px 0;
}
.s-btn:hover { background: #0d3357; }

.s-links { list-style: none; padding: 0; margin: 8px 0; }
.s-links li { padding: 5px 0; border-bottom: 1px dashed #e6e9ee; }
.s-links a { color: #12406e; text-decoration: none; }
.s-links a:hover { text-decoration: underline; }
.s-links-big li { padding: 9px 0; font-size: 15px; }

.s-verdict {
  background: #fff; border: 1px solid #dde2e8; border-left: 4px solid #2c8a43;
  border-radius: 6px; padding: 6px 18px 12px; margin: 18px 0;
}

.s-cols { display: grid; grid-template-columns: repeat(auto-fit, minmax(340px, 1fr)); gap: 20px; }

.s-brandgrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 10px; margin-top: 16px; }
.s-brandcard {
  background: #fff; border: 1px solid #dde2e8; border-radius: 6px; padding: 12px 14px;
  text-decoration: none; color: inherit; transition: border-color .15s, transform .15s;
}
.s-brandcard:hover { border-color: #12406e; transform: translateY(-1px); }
.s-brandcard b { display: block; color: #12406e; }
.s-brandcard span { font-size: 12px; color: #5a6572; }

.s-faq details {
  background: #fff; border: 1px solid #dde2e8; border-radius: 6px;
  padding: 0 16px; margin-bottom: 8px;
}
.s-faq summary { cursor: pointer; font-weight: 650; padding: 11px 0; font-size: 14.5px; }
.s-faq p { margin: 0 0 12px; line-height: 1.6; color: #2a3442; }
.s-faq a { color: #12406e; }

.s-guide { max-width: 820px; }
.s-guide p, .s-guide li { line-height: 1.7; font-size: 15px; color: #2a3442; }
.s-guide ul { padding-left: 22px; }
.s-guide a { color: #12406e; }

.s-foot { background: #101828; color: #c3ccd8; margin-top: 30px; }
.s-foot-grid {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: 26px; padding-top: 30px; padding-bottom: 34px;
}
.s-foot h4 { color: #fff; font-size: 12px; text-transform: uppercase; letter-spacing: .8px; margin: 0 0 10px; }
.s-foot a { display: block; color: #c3ccd8; text-decoration: none; font-size: 13px; padding: 3px 0; }
.s-foot a:hover { color: #fff; text-decoration: underline; }
.s-foot-note { font-size: 11.5px; color: #8a94a2; line-height: 1.5; }