/* =====================================================================
   Calcolo Bollo Auto — shared stylesheet
   Sections: variables → reset → layout → components → utilities → responsive
   Design system is LOCKED. Do not introduce colors/spacing outside the tokens.
   ===================================================================== */

/* ============================ VARIABLES ============================ */
:root{
  /* Brand colors */
  --navy:#10213a;
  --navy-deep:#12213a;
  --hero-a:#0b1a2f;
  --hero-b:#13294b;
  --cream:#efeae0;
  --brass:#b08430;
  --brass-light:#ddbe79;
  --brass-deep:#8a6620;
  --green:#25603e;
  --red:#a03b33;
  --white:#ffffff;
  --muted:#55637a;
  --muted-2:#8a93a3;

  /* Surfaces & ink (derived) */
  --bg:#faf9f6;
  --ink:#1f2c3d;
  --ink-strong:#16233a;
  --panel:#ffffff;
  --panel-cream:#f3f0e8;
  --line:#e8e2d4;
  --line-soft:#efeae0;
  --link:#24558f;

  /* Accent tints used by badges/callouts */
  --tint-blue-bg:#eaf1f8;
  --tint-blue-fg:#2c4a6e;
  --tint-blue-border:#24558f;
  --tint-gold-bg:#fbf3dc;
  --tint-gold-fg:#6b5320;
  --tint-green-bg:#e9f3eb;
  --tint-green-fg:#25603e;
  --tint-red-bg:#fbebe8;
  --tint-red-fg:#8e332c;

  /* Fonts */
  --serif:"Newsreader",Georgia,"Times New Roman",serif;
  --sans:"Hanken Grotesk","Helvetica Neue",Arial,sans-serif;

  /* Spacing scale — ONLY these values */
  --s4:4px;  --s8:8px;   --s12:12px; --s16:16px; --s24:24px;
  --s32:32px; --s48:48px; --s64:64px; --s96:96px;

  /* Layout */
  --wrap:1160px;
  --wrap-narrow:860px;
  --wrap-calc:920px;
  --radius:14px;
  --radius-lg:18px;
}

/* ============================== RESET ============================== */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;
  background:var(--bg);
  color:var(--ink);
  font-family:var(--sans);
  font-size:16.5px;
  line-height:1.7;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4,h5,h6,p,ul,ol,figure{margin:0}
ul,ol{padding:0;list-style:none}
img{max-width:100%;height:auto;display:block}
a{color:var(--link);text-decoration:none}
a:hover{color:var(--brass-deep)}
button{font-family:inherit}
table{border-collapse:collapse}
::selection{background:#ebddbc}

/* Accessibility */
:focus-visible{outline:3px solid var(--brass);outline-offset:2px}
.skip-link{
  position:absolute;left:var(--s8);top:-60px;z-index:200;
  background:var(--white);color:var(--navy);
  padding:var(--s12) var(--s16);border-radius:8px;font-weight:700;
  transition:top .15s ease;
}
.skip-link:focus{top:var(--s8)}
.sr-only{
  position:absolute;width:1px;height:1px;padding:0;margin:-1px;
  overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;
}

/* ============================== LAYOUT ============================= */
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 var(--s24)}
.wrap-narrow{max-width:var(--wrap-narrow);margin:0 auto;padding:0 var(--s24)}
.section{padding:var(--s64) 0}
.section--tight{padding:var(--s32) 0}
.section--cream{background:var(--panel-cream);border-top:1px solid #eae5d8;border-bottom:1px solid #eae5d8}
.section--white{background:var(--white);border-top:1px solid var(--line-soft);border-bottom:1px solid var(--line-soft)}

/* Section eyebrow + titles */
.eyebrow{
  font-size:12px;font-weight:800;letter-spacing:2.5px;text-transform:uppercase;
  color:var(--brass-deep);margin-bottom:var(--s12);
}
h1,h2,h3{font-family:var(--serif);color:var(--navy-deep);line-height:1.15}
.h1{font-weight:600;font-size:clamp(38px,6vw,64px);line-height:1.08;letter-spacing:-.5px}
.h2{font-style:italic;font-weight:600;font-size:clamp(28px,3.6vw,42px);margin-bottom:var(--s16)}
.h3{font-style:italic;font-weight:600;font-size:clamp(22px,2.6vw,29px);margin:var(--s32) 0 var(--s12)}
.h4{font-family:var(--sans);font-size:17.5px;font-weight:800;color:var(--ink-strong);margin:var(--s24) 0 var(--s8)}
.lead{max-width:820px;color:#4a5a70;margin-bottom:var(--s32)}
.prose p{margin:0 0 var(--s16);color:#3a4a60}
.prose p.tight{margin-bottom:var(--s8)}
.note-fine{color:var(--muted-2);font-size:13.5px;margin-top:var(--s16)}

/* ============================ COMPONENTS =========================== */

/* --- Header + nav --- */
.site-header{
  position:sticky;top:0;z-index:50;
  background:var(--hero-a);
  border-bottom:1px solid rgba(255,255,255,.08);
}
.site-header .wrap{
  height:66px;display:flex;align-items:center;justify-content:space-between;gap:var(--s24);
}
.brand{display:flex;align-items:center;gap:var(--s8);color:var(--white)}
.brand:hover{color:var(--white)}
.brand__mark{
  width:30px;height:30px;border-radius:8px;flex:none;
  background:linear-gradient(135deg,var(--brass),var(--brass-light));
  display:flex;align-items:center;justify-content:center;
  color:var(--hero-a);font-weight:800;font-size:14px;letter-spacing:.5px;
}
.brand__mark img{width:30px;height:30px;border-radius:8px}
.brand__name{font-weight:700;font-size:17px;letter-spacing:.2px;color:#f5f2ea}
.main-nav{display:flex;align-items:center;gap:clamp(14px,2.5vw,32px)}
.main-nav > ul{display:flex;align-items:center;gap:clamp(14px,2.5vw,32px)}
.main-nav a{color:#c7d2e1;font-size:15px;font-weight:600}
.main-nav a:hover{color:var(--white)}
.has-dropdown{position:relative}
.has-dropdown > a::after{content:" ⌄";color:#8da0b8}
.dropdown-toggle{
  background:none;border:none;color:#c7d2e1;font-size:15px;font-weight:600;
  cursor:pointer;padding:0;display:inline-flex;align-items:center;gap:var(--s4);
}
.dropdown-toggle:hover{color:var(--white)}
.dropdown{
  position:absolute;left:0;top:calc(100% + 10px);min-width:250px;
  background:var(--white);border:1px solid var(--line);border-radius:12px;
  box-shadow:0 18px 40px -18px rgba(8,20,40,.5);
  padding:var(--s8);display:none;flex-direction:column;gap:2px;
  max-height:70vh;overflow:auto;
}
.dropdown a{color:var(--ink);font-size:14.5px;font-weight:600;padding:var(--s8) var(--s12);border-radius:8px}
.dropdown a:hover{background:#f6f2e7;color:var(--brass-deep)}
.has-dropdown:hover .dropdown,
.has-dropdown:focus-within .dropdown,
.dropdown.open{display:flex}
.nav-toggle{
  display:none;background:none;border:1px solid rgba(255,255,255,.25);
  border-radius:8px;color:#f5f2ea;padding:var(--s8) var(--s12);
  font-size:14px;font-weight:700;cursor:pointer;min-height:44px;
}

/* --- Hero + calculator wrapper --- */
.hero{
  background:linear-gradient(160deg,var(--hero-a) 0%,var(--hero-b) 100%);
  padding:var(--s64) 0 0;
}
.hero__inner{max-width:var(--wrap-calc);margin:0 auto;padding:0 var(--s24);text-align:center}
.hero__badge{
  display:inline-flex;align-items:center;gap:var(--s8);padding:var(--s8) var(--s16);
  border:1px solid rgba(217,182,106,.35);border-radius:999px;
  color:#e4ce9a;font-size:12.5px;font-weight:700;letter-spacing:2px;text-transform:uppercase;
}
.hero h1{color:#fbf8f1;margin:var(--s24) 0 var(--s16)}
.hero h1 em{font-style:italic;color:var(--brass-light)}
.hero__sub{color:#a9b8cc;font-size:clamp(16px,2vw,19px);margin:0 auto;max-width:560px}
.calc-shell{max-width:var(--wrap-calc);margin:var(--s48) auto 0;padding:0 var(--s16)}

/* --- Stat cards --- */
.grid-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:var(--s16)}
.stat{
  background:var(--white);border:1px solid var(--line);border-top:3px solid var(--brass);
  border-radius:var(--radius);padding:var(--s24);
  box-shadow:0 6px 18px -12px rgba(20,32,54,.18);
}
.stat--red{border-top-color:var(--red)}
.stat--green{border-top-color:#2e7d4f}
.stat--blue{border-top-color:#24558f}
.stat__label{font-size:11.5px;font-weight:800;letter-spacing:1.6px;text-transform:uppercase;color:#7b8699;min-height:30px}
.stat__value{font-family:var(--serif);font-weight:700;font-size:clamp(24px,2.6vw,30px);color:var(--navy-deep);margin-top:var(--s8);line-height:1.15}
.stat__sub{color:var(--muted-2);font-size:13.5px;margin-top:var(--s4)}

/* --- Tables --- */
.table-card{
  background:var(--white);border:1px solid #e5dfd0;border-radius:var(--radius);
  overflow:auto;box-shadow:0 8px 24px -16px rgba(20,32,54,.2);max-height:540px;
}
.table-card table{width:100%;min-width:640px;font-size:15px}
.table-card th{
  position:sticky;top:0;z-index:2;background:var(--navy);color:#b9c6d8;text-align:left;
  font-size:11.5px;font-weight:800;letter-spacing:1.4px;text-transform:uppercase;padding:var(--s12) var(--s16);
}
.table-card td{padding:var(--s12) var(--s16);border-top:1px solid var(--line-soft);color:#3a4a60}
.table-card tbody tr:nth-child(even){background:#fbfaf6}
.table-card tbody tr:hover{background:#f6f2e7}
.td-strong{font-weight:700;color:var(--ink-strong)}
.td-num{color:#9aa3b2;font-weight:600}
.td-region{font-weight:600;color:#24344c}
.pill{display:inline-block;padding:var(--s4) var(--s12);border-radius:999px;font-size:12.5px;font-weight:800}
.pill--good{background:#e3f1e6;color:#256b43}
.pill--mid{background:#eaf0f6;color:#44586f}
.pill--warn{background:#f9f0d8;color:var(--brass-deep)}
.pill--bad{background:#f9e5e2;color:var(--red)}

/* --- Callouts --- */
.callout{padding:var(--s16) var(--s24);border-radius:0 12px 12px 0;margin:0 0 var(--s16)}
.callout__title{font-weight:800;margin-bottom:var(--s4)}
.callout p{margin:0;font-size:15px}
.callout p + p{margin-top:var(--s8)}
.callout--blue{background:var(--tint-blue-bg);border-left:3px solid var(--tint-blue-border);color:var(--tint-blue-fg)}
.callout--blue .callout__title{color:#1e3a5c}
.callout--gold{background:var(--tint-gold-bg);border-left:3px solid var(--brass);color:var(--tint-gold-fg)}
.callout--gold .callout__title{color:var(--tint-gold-fg)}
.callout--green{background:var(--tint-green-bg);border-left:3px solid #2e7d4f;color:#2e5b42}
.callout--green .callout__title{color:var(--green)}
.callout--red{background:var(--tint-red-bg);border-left:3px solid #b4443c;color:#8e4038}
.callout--red .callout__title{color:var(--tint-red-fg)}

/* --- Arrow lists / numbered steps --- */
.arrow-list{display:flex;flex-direction:column;gap:var(--s8);margin:0 0 var(--s16)}
.arrow-list li{display:flex;gap:var(--s12);align-items:baseline;color:var(--ink)}
.arrow-list li::before{content:"→";color:var(--brass);font-weight:800;flex:none}
.step-list{display:flex;flex-direction:column;gap:var(--s12);margin:0 0 var(--s24);counter-reset:step}
.step-list li{display:flex;gap:var(--s12);align-items:baseline}
.step-list li::before{
  counter-increment:step;content:counter(step);flex:none;
  width:26px;height:26px;border-radius:50%;background:#16335e;color:#f2e9d4;
  display:inline-flex;align-items:center;justify-content:center;font-size:13px;font-weight:800;
}
.subhead{font-weight:800;color:var(--ink-strong);margin:0 0 var(--s8)}

/* --- Region cards --- */
.region-group{margin-top:var(--s32)}
.region-group__head{display:flex;align-items:center;gap:var(--s16);margin-bottom:var(--s16)}
.region-group__label{font-size:12px;font-weight:800;letter-spacing:2.2px;text-transform:uppercase;color:#7b8699}
.region-group__rule{flex:1;height:1px;background:#e3ddce}
.grid-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:var(--s16)}
.region-card{
  background:var(--white);border:1px solid var(--line);border-radius:var(--radius);
  padding:var(--s24) var(--s24) var(--s16);
  box-shadow:0 4px 14px -10px rgba(20,32,54,.15);
  transition:transform .15s ease,box-shadow .15s ease,border-color .15s ease;
}
.region-card:hover{transform:translateY(-2px);box-shadow:0 12px 26px -12px rgba(20,32,54,.28);border-color:#d9cfb6}
.region-card__title{font-weight:800;font-size:16px;color:#16335e;display:inline-flex;align-items:baseline;gap:var(--s8)}
.region-card__title span{color:var(--brass)}
.region-card__title:hover{color:var(--brass-deep)}
.region-card__desc{color:#5a6880;font-size:14px;margin:var(--s8) 0 0;line-height:1.55}

/* --- Superbollo highlighted card --- */
.superbollo-card{
  background:linear-gradient(150deg,#fffdf6,#fbf3dc);
  border:1px solid #e4c97e;border-radius:var(--radius-lg);
  padding:var(--s32);box-shadow:0 14px 34px -20px rgba(143,106,36,.4);
}
.superbollo-card .callout{background:rgba(255,255,255,.7);margin-bottom:var(--s16)}

/* --- Cost cards --- */
.grid-cost{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:var(--s16);margin-bottom:var(--s48)}
.cost-card{
  background:var(--white);border:1px solid var(--line);border-radius:var(--radius);
  padding:var(--s24) var(--s16);text-align:center;box-shadow:0 4px 14px -10px rgba(20,32,54,.15);
}
.cost-card--free{background:#f2f8f1;border-color:#bfdcc2}
.cost-card__name{font-weight:800;font-size:15px;color:var(--ink-strong);line-height:1.3}
.cost-card__spec{color:var(--muted-2);font-size:12.5px;margin:var(--s4) 0 var(--s12)}
.cost-card__price{font-family:var(--serif);font-weight:700;font-size:30px;color:var(--navy-deep);line-height:1}
.cost-card--free .cost-card__price{color:#256b43}
.cost-card__unit{font-size:10.5px;font-weight:800;letter-spacing:1.6px;text-transform:uppercase;color:#9aa3b2;margin:var(--s8) 0}
.cost-card__year{border-top:1px solid var(--line-soft);padding-top:var(--s8);font-size:13px;color:var(--muted-2);font-weight:500}
.cost-card--free .cost-card__year{color:#256b43;font-weight:800}

/* --- Savings columns --- */
.grid-savings{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:var(--s16);margin-bottom:var(--s32)}
.savings-col{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);padding:var(--s24);box-shadow:0 6px 18px -12px rgba(20,32,54,.18)}
.savings-col__title{font-weight:800;font-size:16.5px;color:var(--ink-strong);margin-bottom:var(--s16)}
.savings-row{display:flex;align-items:baseline;justify-content:space-between;gap:var(--s8);padding:var(--s8) 0;border-top:1px solid #f0ebe0;flex-wrap:wrap}
.savings-row .p{font-weight:700;color:#3a4a60;font-size:14px;white-space:nowrap}
.savings-row .v{color:var(--muted-2);font-size:13.5px}
.savings-row .s{color:var(--green);font-weight:800;font-size:14px;white-space:nowrap}

/* --- Big highlight banner --- */
.banner-dark{
  background:linear-gradient(150deg,var(--hero-a),var(--hero-b));
  border-radius:var(--radius-lg);padding:var(--s48);text-align:center;margin-bottom:var(--s32);
}
.banner-dark__label{font-size:12px;font-weight:800;letter-spacing:2.4px;text-transform:uppercase;color:#9fb2ca}
.banner-dark__value{font-family:var(--serif);font-weight:700;font-size:clamp(56px,8vw,84px);line-height:1.05;color:var(--brass-light);margin:var(--s8) 0}
.banner-dark__sub{color:#a9b8cc;font-size:15.5px}

/* --- FAQ --- */
.faq-list{display:flex;flex-direction:column;gap:var(--s16)}
.faq{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);padding:var(--s24);box-shadow:0 4px 14px -10px rgba(20,32,54,.15)}
.faq h3{font-family:var(--sans);font-weight:800;font-size:17px;color:var(--ink-strong);margin:0 0 var(--s8)}
.faq p{margin:0 0 var(--s12);color:#4a5a70;font-size:15.5px}
.faq p:last-child{margin:0}

/* --- CTA --- */
.cta{
  max-width:var(--wrap);margin:0 auto;
  background:linear-gradient(150deg,var(--hero-a),var(--hero-b));
  border-radius:22px;padding:var(--s64) var(--s48);text-align:center;
}
.cta h2{color:#fbf8f1;margin-bottom:var(--s16)}
.cta p{max-width:520px;margin:0 auto var(--s24);color:#a9b8cc;font-size:16.5px}

/* --- Buttons --- */
.btn-gold{
  display:inline-block;padding:var(--s16) var(--s32);border:none;border-radius:12px;cursor:pointer;
  background:linear-gradient(135deg,var(--brass-light),var(--brass));
  color:#241a05;font-family:var(--sans);font-size:16.5px;font-weight:800;letter-spacing:.3px;
  box-shadow:0 14px 30px -12px rgba(221,190,121,.5);min-height:44px;
}
.btn-gold:hover{filter:brightness(1.07);color:#241a05}

/* --- Pills row (Pagine Importanti) --- */
.pill-row{display:flex;flex-wrap:wrap;gap:var(--s8)}
.pill-link{
  display:inline-block;padding:var(--s8) var(--s16);background:var(--white);
  border:1px solid #e3dccb;border-radius:999px;color:#16335e;font-size:14.5px;font-weight:700;min-height:44px;line-height:26px;
}
.pill-link:hover{border-color:var(--brass);color:var(--brass-deep);background:#fdfbf4}

/* --- Author box --- */
.author{
  background:var(--white);border:1px solid var(--line);border-radius:16px;padding:var(--s24);
  display:flex;gap:var(--s16);align-items:flex-start;flex-wrap:wrap;box-shadow:0 4px 14px -10px rgba(20,32,54,.15);
}
.author__avatar{
  flex:none;width:60px;height:60px;border-radius:50%;
  background:linear-gradient(135deg,#16335e,var(--hero-a));color:var(--brass-light);
  display:flex;align-items:center;justify-content:center;font-family:var(--serif);font-weight:700;font-size:22px;
}
.author__body{flex:1;min-width:240px}
.author__name{font-weight:800;font-size:17px;color:var(--ink-strong)}
.author__bio{margin:var(--s8) 0;color:#4a5a70;font-size:15px}
.author__meta{color:var(--muted-2);font-size:13.5px}
.author__meta a{text-decoration:underline}

/* --- Breadcrumb --- */
.breadcrumb{padding:var(--s12) 0}
.breadcrumb ol{display:flex;flex-wrap:wrap;gap:var(--s8);font-size:13.5px;color:var(--muted)}
.breadcrumb li{display:flex;gap:var(--s8);align-items:center}
.breadcrumb li+li::before{content:"/";color:var(--muted-2)}

/* --- Footer --- */
.site-footer{background:var(--hero-a);color:#a9b8cc;padding:var(--s64) 0 0}
.footer-grid{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:var(--s32) var(--s24);
  padding-bottom:var(--s48);border-bottom:1px solid rgba(255,255,255,.1);
}
.footer-brand__row{display:flex;align-items:center;gap:var(--s8);margin-bottom:var(--s12)}
.footer-brand__mark{
  width:28px;height:28px;border-radius:7px;
  background:linear-gradient(135deg,var(--brass),var(--brass-light));
  display:flex;align-items:center;justify-content:center;color:var(--hero-a);font-weight:800;font-size:13px;
}
.footer-brand__name{font-weight:800;font-size:16px;color:#f5f2ea}
.footer-brand p{margin:0;font-size:14.5px;line-height:1.65;color:#8da0b8}
.footer-col__title{font-size:11.5px;font-weight:800;letter-spacing:2px;text-transform:uppercase;color:#6e82a0;margin-bottom:var(--s12)}
.footer-col ul{display:flex;flex-direction:column;gap:var(--s8);font-size:14.5px}
.footer-col a{color:#b9c6d8}
.footer-col a:hover{color:var(--white)}
.footer-social{display:flex;gap:var(--s12);margin-top:var(--s12)}
.footer-social a{color:#b9c6d8;display:inline-flex;min-width:44px;min-height:44px;align-items:center;justify-content:center}
.footer-social a:hover{color:var(--white)}
.footer-bottom{text-align:center;padding:var(--s24) 0;font-size:13.5px;color:#6e82a0}

/* --- Calculator widget (cba26) --- */
.cba26{
  background:var(--white);border-radius:var(--radius-lg) var(--radius-lg) 0 0;
  box-shadow:0 24px 60px -20px rgba(8,20,40,.45);overflow:hidden;
}
.cba26 *{box-sizing:border-box}
.cba26-tr{position:absolute;opacity:0;width:0;height:0;pointer-events:none}
.cba26-ts{display:flex;border-bottom:1px solid #e9e4d8;background:#f6f3eb}
.cba26-tl{
  flex:1;padding:var(--s16) var(--s12);text-align:center;font-weight:700;font-size:15.5px;
  color:#7b8699;cursor:pointer;border-bottom:3px solid transparent;margin-bottom:-1px;
  line-height:1.3;transition:all .2s;display:block;user-select:none;min-height:44px;
}
.cba26-tl:hover{color:var(--navy-deep);background:#f1ede2}
#cba26-r1:checked~.cba26-ts .cba26-t1,
#cba26-r3:checked~.cba26-ts .cba26-t3{color:var(--navy-deep);border-bottom-color:var(--brass);background:var(--white)}
.cba26-bd{padding:var(--s32);background:var(--white)}
.cba26-pn{display:none}
#cba26-r1:checked~.cba26-bd .cba26-p1,
#cba26-r3:checked~.cba26-bd .cba26-p3{display:block}
.cba26-gr{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:var(--s24)}
.cba26-fw{grid-column:1/-1}
.cba26-lb{font-size:12px;font-weight:800;color:var(--muted);text-transform:uppercase;letter-spacing:1.5px;display:block;margin-bottom:var(--s8)}
.cba26-lb em{color:var(--red);font-style:normal}
.cba26-in{
  width:100%;padding:var(--s12);border:1.5px solid #dcd6c8;border-radius:10px;
  font-size:15.5px;font-family:var(--sans);background:#fdfcf9;color:var(--ink);
  appearance:none;-webkit-appearance:none;transition:border-color .2s,box-shadow .2s,background .2s;
}
.cba26-in:focus{outline:none;border-color:var(--brass);box-shadow:0 0 0 3px rgba(176,132,48,.15);background:var(--white)}
.cba26-in.err{border-color:var(--red)!important;background:#fff1f2!important;box-shadow:0 0 0 3px rgba(160,59,51,.12)!important}
.cba26-rds{display:grid;grid-template-columns:1fr 1fr;gap:var(--s8)}
.cba26-rl{
  display:flex;align-items:center;gap:var(--s8);padding:var(--s12);border:1.5px solid #dcd6c8;
  border-radius:10px;cursor:pointer;font-size:14.5px;font-weight:700;color:var(--muted);
  transition:all .2s;min-height:44px;
}
.cba26-rl:has(input:checked){border-color:var(--brass);background:#fbf5e6;color:var(--tint-gold-fg)}
.cba26-rl input{accent-color:var(--brass);flex-shrink:0;width:16px;height:16px}
.cba26-btn{
  grid-column:1/-1;width:100%;margin-top:var(--s4);padding:var(--s16) var(--s24);
  background:linear-gradient(135deg,var(--brass),#8f6a24);color:#fff9ec;font-size:17px;font-weight:800;
  letter-spacing:.3px;border:none;border-radius:12px;cursor:pointer;
  box-shadow:0 10px 24px -10px rgba(143,106,36,.55);transition:filter .2s;min-height:44px;
}
.cba26-btn:hover{filter:brightness(1.06)}
.cba26-errmsg{
  grid-column:1/-1;background:var(--tint-red-bg);border:1px solid #ebc5c0;border-radius:10px;
  padding:var(--s12) var(--s16);font-size:14.5px;color:var(--red);font-weight:600;display:none;
}
.cba26-errmsg.show{display:block}
.cba26-rs{
  grid-column:1/-1;display:none;margin-top:var(--s4);border-radius:var(--radius);overflow:hidden;
  background:linear-gradient(160deg,var(--hero-a),var(--hero-b));animation:cba26fade .3s ease;
}
@keyframes cba26fade{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}
.cba26-rh{padding:var(--s24);display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:var(--s12)}
.cba26-rh h4{color:#d9be7c;font-weight:800;font-size:12px;letter-spacing:2px;text-transform:uppercase;margin:0}
.cba26-ra{font-family:var(--serif);font-weight:700;font-size:clamp(32px,5vw,44px);color:var(--white);line-height:1}
.cba26-rb{background:rgba(255,255,255,.04);padding:var(--s24);border-top:1px solid rgba(255,255,255,.14)}
.cba26-rr{display:flex;justify-content:space-between;align-items:center;padding:var(--s8) 0;border-bottom:1px solid rgba(255,255,255,.1);font-size:14.5px;gap:var(--s8)}
.cba26-rr:last-child{border:none}
.cba26-rk{color:#a9b8cc;font-weight:500}
.cba26-rv{color:#f2e9d4;font-weight:700;text-align:right}
.cba26-rv strong,.cba26-rk strong{color:#fff}
.cba26-rn{font-size:12.5px;color:#8da0b8;margin-top:var(--s12);line-height:1.6}
.calc-how{background:var(--white);border-top:1px solid var(--line-soft);padding:var(--s24) var(--s32)}
.calc-how h2{font-family:var(--sans);font-style:normal;font-weight:800;font-size:16px;color:var(--ink-strong);margin:0 0 var(--s4)}
.calc-how p{font-size:15.5px;color:var(--muted);margin:0}

@media (max-width:768px){
  .cba26-bd{padding:var(--s16)}
  .cba26-gr{grid-template-columns:1fr}
  .cba26-tl{font-size:14px}
  .calc-how{padding:var(--s16)}
}

/* ============================ UTILITIES =========================== */
.mt-32{margin-top:var(--s32)}
.mb-0{margin-bottom:0}
.center{text-align:center}
strong{color:var(--ink-strong)}
.section .lead strong,.callout strong,.arrow-list strong,.faq strong{color:inherit}

/* ============================ RESPONSIVE ========================== */
@media (max-width:768px){
  body{font-size:16px}
  .section{padding:var(--s48) 0}
  .cta{padding:var(--s48) var(--s24)}
  .banner-dark{padding:var(--s32)}
  .superbollo-card{padding:var(--s24)}

  .nav-toggle{display:inline-flex;align-items:center}
  .main-nav{
    display:none;position:absolute;left:0;right:0;top:66px;
    background:var(--hero-a);border-bottom:1px solid rgba(255,255,255,.1);
    flex-direction:column;align-items:stretch;gap:0;padding:var(--s12) var(--s24) var(--s24);
    max-height:80vh;overflow:auto;
  }
  .main-nav.open{display:flex}
  .main-nav > ul{flex-direction:column;align-items:stretch;gap:0}
  .main-nav > ul > li{border-bottom:1px solid rgba(255,255,255,.08)}
  .main-nav a,.dropdown-toggle{display:block;width:100%;padding:var(--s12) 0;min-height:44px}
  .has-dropdown > a::after{display:none}
  .dropdown{
    position:static;box-shadow:none;border:none;background:transparent;
    padding:0 0 var(--s8) var(--s16);min-width:0;max-height:none;
  }
  .dropdown a{color:#b9c6d8;padding:var(--s8) 0}
  .dropdown a:hover{background:transparent;color:var(--white)}
  .has-dropdown:hover .dropdown,.has-dropdown:focus-within .dropdown{display:none}
  .dropdown.open{display:flex}
}