/* Ajustements d'interface communs à toutes les pages (chargé en dernier) */

/* Entrée de menu active : rouge */
.menu>li>a.is-current{background:#B01A1A!important;color:#fff!important;box-shadow:0 6px 16px rgba(176,26,26,.28)}
.menu>li>a.is-current:hover{background:#9A1515!important}
.menu>li.has-panel:has(>a.is-current)>.chev{color:#B01A1A}
.d-row[aria-current="page"]{color:#B01A1A!important}

/* Bouton Espace client / Connexion */
.btn-login{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:2px solid var(--brand);color:var(--brand);background:transparent;font-weight:700;border-radius:999px;transition:background .2s,color .2s,border-color .2s,box-shadow .2s,transform .15s}
.btn-login:hover{background:var(--brand);color:var(--brand-ink,#fff);transform:translateY(-1px)}
.btn-login svg{width:19px;height:19px;flex:none}
@media(min-width:1380px){
  .btn-login .t{display:inline!important}
  .btn-login{width:auto!important;min-width:0!important;padding:0 18px!important}
}
@media(max-width:1379px) and (min-width:761px){
  .btn-login{width:44px!important;min-width:44px!important;padding:0!important}
  .btn-login .t{display:none!important}
}
.btn-login.is-current,.btn-login.is-current:hover{background:#B01A1A!important;border-color:#B01A1A!important;color:#fff!important;box-shadow:0 8px 20px rgba(176,26,26,.35)}
.btn-account.is-current{background:#B01A1A!important;border-color:#B01A1A!important;color:#fff!important}

/* Mobile : l'en-tête se masque quand on descend, revient quand on remonte */
header.site{transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .3s,background .3s}
@media(max-width:760px){
  header.site.hdr-hide{transform:translateY(calc(-100% - 8px));box-shadow:none}
}
@media(prefers-reduced-motion:reduce){header.site{transition:none}}

/* Récapitulatifs d'inscription : [hidden] respecté et libellé du total toujours visible */
.su-line[hidden],.sm-sum [hidden]{display:none!important}
.sm-sum .su-total .muted,.su-sum .su-total .muted{display:inline!important}

/* Cartes de forfaits (fenêtre d'inscription et page inscription) : mise en page nette sur mobile */
@media(max-width:640px){
  .su-plans .su-plan .box{display:grid!important;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"nm pr" "ft ft";align-items:center!important;gap:4px 12px!important;padding:16px 46px 14px 16px!important;flex-wrap:nowrap!important}
  .su-plans .su-plan .nm{grid-area:nm;text-align:left;align-self:center}
  .su-plans .su-plan .pr{grid-area:pr;margin:0!important;font-size:1.6rem!important;white-space:nowrap;text-align:right}
  .su-plans .su-plan .ft{grid-area:ft;flex-basis:auto!important;white-space:normal!important;overflow-wrap:break-word!important;word-break:normal;min-width:0;padding-top:4px;border-top:1px dashed var(--line,#D5DCDF);margin-top:4px}
  .su-plans .su-plan .tag{left:16px;right:auto;top:-9px}
  .su-plans .su-plan .ok{top:14px;right:14px}
}
.su-plans .su-plan .ft{white-space:normal;overflow-wrap:break-word}

/* Bandeau titre des pages : image de fond sous voile sombre, texte clair */
.page-head{position:relative;isolation:isolate;overflow:hidden;color:#fff;border-bottom:0!important;
  background:#1A2F37 url(hero-bg.svg) 70% center/cover no-repeat!important;padding-block:clamp(44px,7vw,84px) clamp(34px,5vw,56px)!important}
.page-head::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:linear-gradient(95deg,rgba(14,26,31,.90) 0%,rgba(14,26,31,.58) 48%,rgba(14,26,31,.10) 100%)}
.page-head h1{color:#fff!important;text-shadow:0 2px 18px rgba(0,0,0,.25)}
.page-head .lead{color:rgba(255,255,255,.86)!important;max-width:60ch}
.page-head .crumbs,.page-head .crumbs a{color:rgba(255,255,255,.72)!important}
.page-head .crumbs a:hover{color:#fff!important}
.page-head .btn-ghost{background:rgba(255,255,255,.08);color:#fff;border-color:rgba(255,255,255,.55)}
.page-head .btn-ghost:hover{background:rgba(255,255,255,.18)}
.page-head .cs-hchips li{background:rgba(255,255,255,.10);border-color:rgba(255,255,255,.28);color:#fff}
@media(max-width:760px){.page-head{background-position:62% center!important}.page-head::before{background:linear-gradient(180deg,rgba(14,26,31,.80),rgba(14,26,31,.56))}}
/* Accueil : même image sous le dégradé existant */
.hero-dark{background-image:linear-gradient(160deg,rgba(22,34,40,.88),rgba(14,22,25,.92)),url(hero-bg.svg)!important;background-size:cover!important;background-position:center!important}

/* ---- Smartphone : bouton Plus en haut, lune masquée, Contact dans la barre du bas ---- */
#plus-btn{display:none}
@media (max-width:760px){
  header.site #theme-btn{display:none!important}
  #plus-btn{display:grid!important}
  .ptab [data-ptab="more"]{display:none!important}
  .ptab:not(:has(a.on)) .bubble{opacity:0!important}
}

/* ---- Accueil : engagements. Ordinateur : une seule ligne pleine largeur. Mobile/tablette : défilement animé ---- */
.hd-strip{position:relative;z-index:2;margin-top:26px;padding-bottom:clamp(26px,3.5vw,44px)}
.hd-strip .hd-checks{display:flex!important;flex-wrap:nowrap;justify-content:space-between;gap:10px!important;margin:0!important;max-width:none!important;padding:0;list-style:none}
.hd-strip .hd-checks li{flex:0 1 auto;white-space:nowrap;padding:9px 13px!important;font-size:clamp(.72rem,.9vw,.8rem)!important;gap:8px!important;border-radius:14px;animation:none!important;opacity:1!important;transform:none!important}
.hd-strip .hd-checks svg{width:22px!important;height:22px!important;padding:4px!important;border-radius:8px!important;flex:none}
.hd-car,.hd-dots{display:none!important}
.hd-grid>div{min-width:0}
@media (max-width:1100px){
  .hd-strip{display:none}
  .hd-car{display:flex!important;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;-webkit-overflow-scrolling:touch;gap:0!important;width:100%;max-width:520px;margin-top:22px!important}
  .hd-car::-webkit-scrollbar{display:none}
  .hd-car li{flex:0 0 100%;scroll-snap-align:center;white-space:normal;font-size:clamp(.95rem,4.2vw,1.08rem)!important;padding:14px 16px!important;animation:none!important;opacity:1!important;transform:none!important;box-sizing:border-box}
  .hd-car svg{width:32px!important;height:32px!important;padding:7px!important}
  .hd-dots{display:flex!important;justify-content:flex-start;gap:7px;margin-top:12px}
  .hd-dots i{width:7px;height:7px;border-radius:50%;background:rgba(255,255,255,.28);transition:width .3s,background .3s}
  .hd-dots i.on{width:22px;border-radius:7px;background:#6FCF9E}
}

/* ---- Tiret sous chaque titre de section ---- */
main section>.wrap>h2::after,
.sec-head h2::after,.prose h2::after,.cta-band h2::after{content:"";display:block;width:44px;height:4px;border-radius:4px;background:#B01A1A;margin-top:14px}
.cta-band h2::after{background:rgba(255,255,255,.7)}
.sec-head[style*="center"] h2::after,.sec-head.center h2::after,.center h2::after,.ta-c h2::after{margin-inline:auto}

/* ---- Mention de création (pied de page) ---- */
.f-credit{opacity:.9}
.f-credit a{color:inherit;font-weight:600;text-decoration:underline;text-underline-offset:3px}
.f-credit a:hover{color:#fff}

/* En-tête : adresse à gauche, téléphone à droite */
.topbar .wrap{justify-content:space-between!important}
.topbar .tb-addr,.topbar .tb-tel{display:inline-flex!important;align-items:center;gap:8px;font-size:.86rem;color:inherit;text-decoration:none}
.topbar .tb-addr svg,.topbar .tb-tel svg{opacity:.85;flex:none}
.topbar .tb-tel{font-weight:700;letter-spacing:.01em}
.topbar .tb-tel:hover{text-decoration:underline}

/* Barre du haut : adresse · horaires (ouvert/fermé) · téléphone */
.topbar .tb-open{display:inline-flex;align-items:center;gap:8px;font-size:.84rem;color:#D3DEE1;white-space:nowrap}
.topbar .tb-open[hidden]{display:none!important}
.topbar .tb-open i{width:8px;height:8px;border-radius:50%;background:#62C68D;box-shadow:0 0 0 0 rgba(98,198,141,.6);flex:none}
.topbar .tb-open b{color:#fff;font-weight:700}
.topbar .tb-open.closed i{background:#E7A94B;box-shadow:none}
.topbar .tb-open .tb-h{opacity:.8}
.topbar .tb-open .tb-h::before{content:"·";margin-right:8px;opacity:.6}
@media (prefers-reduced-motion:no-preference){.topbar .tb-open:not(.closed) i{animation:tbpulse 2.4s ease-out infinite}.topbar{animation:tbin .5s ease-out both}}
@keyframes tbpulse{0%{box-shadow:0 0 0 0 rgba(98,198,141,.55)}70%,100%{box-shadow:0 0 0 7px rgba(98,198,141,0)}}
@keyframes tbin{from{opacity:0;transform:translateY(-100%)}to{opacity:1;transform:none}}
@media (max-width:1020px){.topbar .tb-open .tb-h{display:none}}
@media (max-width:760px){
  .topbar{display:block!important}
  .topbar .wrap{min-height:34px!important}
  .topbar .tb-addr{display:none!important}
  .topbar .tb-open{font-size:.8rem}
  .topbar .tb-open .tb-h{display:inline}
  .topbar .tb-tel{font-size:0!important;gap:0!important;width:30px;height:30px;justify-content:center;border-radius:50%;background:rgba(255,255,255,.14)}
  .topbar .tb-tel svg{width:15px;height:15px;opacity:1}
  .topbar .tb-tel span{display:none}
}
@media (max-width:420px){.topbar .tb-open .tb-h{display:none}}

/* ===== SEO : blocs de contenu enrichi (étapes, tableaux, zone, liens) ===== */
.seo-sec{padding-block:clamp(40px,6vw,76px)}
.seo-sec .sec-head p{color:var(--muted);max-width:64ch;margin:10px 0 0}
.seo-sec .prose h3{margin:26px 0 8px;font-size:1.12rem}
.seo-sec .prose ul{margin:8px 0 0 1.1em}
.seo-ico{width:48px;height:48px;border-radius:14px;background:var(--surface-2);color:var(--brand);display:grid;place-items:center;flex:none}
.seo-ico svg{width:24px;height:24px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.seo-steps{list-style:none;margin:30px 0 0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:16px}
.seo-steps li{position:relative;background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:22px 20px;transition:transform .25s,box-shadow .25s}
.seo-steps li:hover{transform:translateY(-3px);box-shadow:0 14px 30px -18px rgba(27,36,40,.35)}
.seo-steps .seo-ico{margin-bottom:14px}
.seo-steps .n{position:absolute;top:14px;right:18px;font-weight:800;font-size:2rem;line-height:1;color:var(--surface-2)}
.seo-steps h3{margin:0 0 6px;font-size:1.04rem}
.seo-steps p{margin:0;color:var(--muted);font-size:.94rem;line-height:1.55}
.seo-tablewrap{overflow-x:auto;border:1px solid var(--line);border-radius:16px;background:var(--surface);margin-top:24px;-webkit-overflow-scrolling:touch}
.seo-table{width:100%;border-collapse:collapse;min-width:560px;font-size:.95rem}
.seo-table th,.seo-table td{padding:13px 16px;text-align:left;border-bottom:1px solid var(--line);vertical-align:top}
.seo-table tbody tr:last-child th,.seo-table tbody tr:last-child td{border-bottom:0}
.seo-table thead th{background:#E4EDEF;color:var(--brand);font-weight:700;white-space:nowrap;border-bottom:2px solid var(--brand)}
.seo-table tbody th{font-weight:600}
.seo-table td.y{color:#1F7A4D;font-weight:800;font-size:1.1rem}
.seo-table td.no{color:#9AA7AC}
.seo-table tbody tr:nth-child(even){background:rgba(233,238,239,.45)}
.seo-zone{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:28px;margin-top:26px;align-items:start}
.seo-fact{display:flex;gap:14px;align-items:center;background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:14px 16px;margin-bottom:12px}
.seo-fact strong{display:block;font-size:1rem}.seo-fact span:not(.seo-ico){display:block;color:var(--muted);font-size:.9rem}
.seo-chips{list-style:none;margin:16px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.seo-chips li{padding:7px 14px;border-radius:999px;background:var(--surface);border:1px solid var(--line);font-size:.9rem;font-weight:600;color:var(--brand)}
.seo-more{padding-block:0 clamp(32px,5vw,56px)}
.seo-h{font-size:1.15rem;margin:0 0 14px}
.seo-links{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:10px}
.seo-links a{display:inline-flex;align-items:center;gap:8px;padding:10px 16px;border-radius:999px;background:var(--surface);border:1px solid var(--line);font-weight:600;font-size:.94rem;color:var(--brand);text-decoration:none;transition:background .2s,border-color .2s}
.seo-links a::after{content:"→";color:var(--accent)}
.seo-links a:hover{background:var(--surface-2);border-color:var(--slate)}
@media (max-width:760px){.seo-zone{grid-template-columns:1fr}.seo-steps{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){.seo-steps li{transition:none}.seo-steps li:hover{transform:none}}

/* ===== Thème clair unique (le site ne suit plus le mode sombre du téléphone) ===== */
:root:root:root{--bg:#F5F8F8;--surface:#FFFFFF;--surface-2:#EAF0F1;--fg:#1B2428;--muted:#56646A;--line:#D8E0E3;--brand:#2E4852;--brand-ink:#FFFFFF;--accent:#B01A1A;--accent-ink:#FFFFFF;
  --footer-bg:#E6EDEF;--footer-fg:#1B2428;--footer-muted:#56646A;--shadow:0 1px 2px rgba(20,35,40,.06),0 8px 24px rgba(20,35,40,.08);color-scheme:light}
[data-theme-toggle],.theme-btn,#theme-btn,button[aria-label*="hème"],button[aria-label*="sombre"]{display:none!important}
/* Barre du haut */
.topbar{background:#E3EBEE!important;color:#2E4852!important}
.topbar .tb-open{color:#40545C}.topbar .tb-open b{color:#1B2428}
.topbar .tb-tel{color:#1B2428}
@media(max-width:760px){.topbar .tb-tel{background:rgba(46,72,82,.12)!important}}
/* Accueil */
.hero-dark{background:linear-gradient(160deg,#F7FAFA 0%,#E6EEF0 100%)!important;color:var(--fg)!important}
.hero-dark::before{background:radial-gradient(circle at 85% 18%,rgba(176,26,26,.07),transparent 55%),radial-gradient(circle at 8% 92%,rgba(127,154,163,.22),transparent 55%)!important}
.hero-dark .eyebrow{color:#1C7A46!important}
.hero-dark h1{color:var(--fg)!important}.hero-dark h1 em{color:#B01A1A!important}
.hero-dark .lead,.hero-dark p{color:var(--muted)}
.hero-dark .btn-ghost{border-color:var(--brand)!important;color:var(--brand)!important}
.hero-dark .btn-ghost:hover{background:var(--brand)!important;color:#fff!important}
.hd-price{background:#fff!important;border-color:var(--line)!important;box-shadow:var(--shadow)}
.hd-price b{color:var(--fg)!important}.hd-price b i{color:#B01A1A!important}
.hd-price span,.hd-price small{color:var(--muted)}
.hd-checks li{color:var(--fg)!important;background:#fff!important;border-color:var(--line)!important}
.hd-proof,.hd-proof span{color:var(--muted)}
.hd-badge{box-shadow:0 14px 34px rgba(20,35,40,.16)}
/* Bandeau de titre des pages */
.page-head{background:#EEF3F4 url(hero-bg-light.svg) 70% center/cover no-repeat!important;color:var(--fg)!important;border-bottom:1px solid var(--line)!important}
.page-head::before{display:none!important}
.page-head h1{color:var(--fg)!important;text-shadow:none!important}
.page-head .lead{color:var(--muted)!important}
.page-head .crumbs,.page-head .crumbs a{color:var(--muted)!important}.page-head .crumbs a:hover{color:var(--brand)!important}
.page-head .btn-ghost{background:#fff;color:var(--brand);border-color:var(--brand)}.page-head .btn-ghost:hover{background:var(--brand);color:#fff}
.page-head .cs-hchips li{background:#fff;border-color:var(--line);color:var(--brand)}
/* Bandeaux d'appel et défilant */
.cta-band{background:linear-gradient(135deg,#E4EDEF,#F3F7F8)!important;color:var(--fg)!important;border:1px solid var(--line)}
.cta-band h2::after{background:#B01A1A!important}
.cta-band .btn-ghost{color:var(--brand)!important;border-color:var(--brand)!important}.cta-band .btn-ghost:hover{background:var(--brand);color:#fff!important}
.marquee{background:#E4EDEF!important;color:var(--brand)!important}
/* Pied de page */
footer.site{background:#E6EDEF!important;color:var(--fg)!important;border-top:0}
footer .logo b{color:var(--brand)!important}
footer a{color:var(--fg)}
.news input{border-color:var(--line)!important;background:#fff!important;color:var(--fg)!important}
.f-bottom{border-top-color:var(--line)!important}
.f-big{color:rgba(46,72,82,.06)!important}
/* Avis Google */
#avis{background:linear-gradient(160deg,#EEF3F4,#E2EBED)!important}
#avis h2,#avis-score .score-num,#avis .review figcaption b{color:var(--fg)!important}
#avis-score{background:#fff!important;border-color:var(--line)!important}
#avis-score .score-count,#avis .review figcaption{color:var(--muted)!important}
#avis .review{background:#fff!important;border-color:var(--line)!important;color:var(--fg)!important}
#avis .review blockquote{color:var(--fg)!important}
#avis .review figcaption{border-top-color:var(--line)!important}
/* Barre mobile du bas */
.ptab{background:rgba(255,255,255,.95)!important;border:1px solid var(--line);box-shadow:0 10px 30px rgba(20,35,40,.16)!important}
.ptab a{color:#56646A!important}.ptab .on,.ptab a.on{color:#fff!important}
.ptab a.acct svg,.ptab #tab-account svg{background:rgba(46,72,82,.1)!important;box-shadow:0 6px 16px rgba(20,35,40,.14)!important}

/* ===== Forfaits : nouveau design (cartes « médaille », mêmes informations) ===== */
.plans{gap:22px!important;align-items:stretch!important}
.plan{--pc:#B87B4B;--pt:#FCF3EC;--pg:linear-gradient(135deg,#E0B089,#B87B4B);position:relative;overflow:visible!important;border-radius:28px!important;
  border:1px solid color-mix(in srgb,var(--pc) 30%,#fff)!important;background:linear-gradient(180deg,var(--pt) 0,#fff 230px)!important;box-shadow:0 20px 44px -30px rgba(20,35,40,.45)!important}
.plan.argent{--pc:#5E7882;--pt:#EEF4F6;--pg:linear-gradient(135deg,#B7C8CE,#5E7882);border:2px solid #B01A1A!important;transform:translateY(-10px);box-shadow:0 30px 60px -30px rgba(176,26,26,.5)!important}
.plan.or{--pc:#B8902F;--pt:#FFF7E0;--pg:linear-gradient(135deg,#F4D983,#B8902F)}
.plan:hover{transform:translateY(-6px)!important;box-shadow:0 26px 54px -28px rgba(20,35,40,.5)!important}
.plan.argent:hover{transform:translateY(-16px)!important}
.plan-head{background:none!important;color:var(--fg)!important;padding:28px 26px 0!important;text-align:left!important;display:flex;align-items:center;gap:12px;font:700 .8rem var(--f-mono)!important;letter-spacing:.16em;text-transform:uppercase}
.plan-head::before{content:"";width:36px;height:36px;border-radius:50%;background:var(--pg);box-shadow:inset 0 0 0 3px rgba(255,255,255,.55),0 8px 16px -6px var(--pc);flex:none}
.plan .price{text-align:left!important;padding:18px 26px 6px!important;display:flex;flex-wrap:wrap;align-items:flex-start;gap:0 4px}
.plan .price b{font-size:4.4rem!important;line-height:.95;color:var(--fg)}
.plan .price sup{top:.55rem!important;font-size:1.5rem!important;color:var(--pc)!important;margin-left:2px}
.plan .price small{flex:1 1 100%;margin-top:8px!important;display:block}
.plan .feat{margin:12px 26px 0!important}
.plan .feat li{padding:11px 0!important;border-top:1px dashed color-mix(in srgb,var(--pc) 28%,#D8E0E3)!important;font-size:.95rem!important;align-items:center!important}
.plan .feat li:first-child{border-top:1px dashed color-mix(in srgb,var(--pc) 28%,#D8E0E3)!important}
.plan .feat svg{color:var(--pc)!important;margin-top:0!important}
.plan .feat li.no{opacity:1!important;color:#8B979C!important}
.plan .feat li.no span{text-decoration:line-through;text-decoration-color:rgba(139,151,156,.55)}
.plan .feat li.no svg{color:#B6C0C4!important}
.plan.argent .feat li:nth-child(7),.plan.or .feat li:nth-child(n+7){font-weight:700;color:var(--fg);background:color-mix(in srgb,var(--pc) 11%,transparent);border-radius:12px;padding-inline:10px!important;margin-inline:-10px;border-top-color:transparent!important}
.plan-foot{padding:20px 26px 26px!important}
.plan-q{display:block;margin-top:12px;text-align:center;font-size:.86rem;color:var(--muted)}
.plan .ribbon{position:absolute;top:0!important;left:50%!important;right:auto!important;width:auto!important;height:auto!important;overflow:visible!important;transform:translate(-50%,-50%)}
.plan .ribbon span{position:static!important;transform:none!important;width:auto!important;display:inline-block;padding:7px 18px!important;border-radius:999px;background:#B01A1A!important;color:#fff;letter-spacing:.12em!important;box-shadow:0 10px 20px -8px rgba(176,26,26,.7);animation:none!important;white-space:nowrap}
.plan .ribbon span::before{content:"★ "}
@media (max-width:760px){.plan.argent,.plan.argent:hover,.plan:hover{transform:none!important}.plan .price b{font-size:3.9rem!important}}

/* ===== Navigation : barre de chargement immédiate ===== */
#navbar{position:fixed;left:0;top:0;right:0;height:3px;z-index:99999;pointer-events:none}
#navbar i{display:block;height:100%;width:0;background:linear-gradient(90deg,#B01A1A,#E0554F);box-shadow:0 0 10px rgba(176,26,26,.55);border-radius:0 3px 3px 0;transition:width 2.6s cubic-bezier(.1,.75,.2,1)}
#navbar.go i{width:84%}
html.navigating main{opacity:.6;transition:opacity .2s .06s}
.ptab a:active,.menu a:active{transform:scale(.96)}
.hd-price>span,.hd-price small{color:#56646A!important}
.hd-proof .hd-stars,.hd-stars{color:#F3B13B!important}

/* ===== Paiement annuel (2 mois offerts) ===== */
.plan .price .pyear{flex:1 1 100%;display:block;margin-top:10px;font:600 .9rem/1.3 var(--f-body,inherit);color:var(--fg,#17303a)}
.plan .price .pyear em{font-style:normal;font-weight:700;font-size:.74rem;letter-spacing:.04em;text-transform:uppercase;color:#fff;background:var(--pc,#B01A1A);padding:3px 9px;border-radius:999px;display:inline-block;margin-left:6px;white-space:nowrap}
.bill-opt{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:16px}
.bill-opt label{position:relative;display:block;cursor:pointer}
.bill-opt input{position:absolute;opacity:0;pointer-events:none}
.bill-opt .bx{display:flex;flex-direction:column;gap:2px;height:100%;padding:14px 16px;border:2px solid var(--line,#d8e2e6);border-radius:16px;background:var(--surface,#fff);transition:border-color .2s,box-shadow .25s,background .2s}
.bill-opt .bx b{font-size:.98rem}
.bill-opt .bx small{color:var(--muted,#5b6f77);font-size:.84rem}
.bill-opt .tag{position:absolute;top:-10px;right:12px;background:var(--accent,#B01A1A);color:#fff;font:700 .64rem var(--f-body,inherit);letter-spacing:.08em;padding:4px 9px;border-radius:999px}
.bill-opt input:checked+.bx{border-color:var(--brand,#2E4852);background:color-mix(in srgb,var(--brand,#2E4852) 7%,var(--surface,#fff));box-shadow:0 8px 22px color-mix(in srgb,var(--brand,#2E4852) 14%,transparent)}
.bill-opt input:focus-visible+.bx{outline:3px solid color-mix(in srgb,var(--brand,#2E4852) 40%,transparent);outline-offset:2px}
@media (max-width:640px){.bill-opt{grid-template-columns:1fr}}
.su-logged{display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px;margin:0 0 18px;padding:14px 18px;border-radius:16px;background:#EAF4EE;border:1px solid #BFDDC9;color:#1D4B30;font-size:.95rem;line-height:1.45}
.su-logged .btn{margin-left:auto}
input.is-locked{background:#F1F5F6!important;color:#4a5d65;cursor:not-allowed}