/* =========================================================
   Atelier Stelaris : pages marque et modèle (complète home.css)
   ========================================================= */
.hdr__nav a[aria-current="page"]{opacity:1}
.hdr__nav a[aria-current="page"]::after{transform:scaleX(1)}
.crumbs{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px;margin-bottom:20px;font-size:.86rem;color:var(--slate)}
.crumbs a{transition:color .2s}
.crumbs a:hover{color:var(--graphite)}
.crumbs .ic{width:14px;height:14px}
.crumbs [aria-current]{color:var(--graphite);font-weight:600}

/* ---------- haut de page ---------- */
.bhero{position:relative;overflow:hidden;background:var(--mist);padding:calc(var(--hdr-h) + clamp(28px,4vw,56px)) 0 clamp(48px,6vw,84px)}
.bhero::before,.bhero::after{content:"";position:absolute;border-radius:50%;pointer-events:none}
.bhero::before{width:720px;height:720px;right:-220px;top:-180px;background:radial-gradient(circle,rgba(233,30,140,.16),rgba(233,30,140,0) 64%)}
.bhero::after{width:600px;height:600px;left:-260px;bottom:-300px;background:radial-gradient(circle,rgba(106,43,217,.13),rgba(106,43,217,0) 64%)}
.bhero__in{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1fr);gap:clamp(32px,5vw,72px);align-items:center}
.bhero--photo .bhero__in{grid-template-columns:minmax(0,6fr) minmax(0,5fr)}
.bhero__text{animation:fadeUp .8s var(--ease) .05s backwards}
.brand-tag{display:inline-flex;align-items:center;gap:9px;margin-bottom:18px;padding:6px 13px;border-radius:999px;background:rgba(255,255,255,.78);border:1px solid rgba(255,255,255,.95);font-size:.82rem;font-weight:650;color:var(--graphite-2)}
.brand-tag::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--trace)}
.page-title{margin:0;font-stretch:125%;font-weight:800;font-size:clamp(2.05rem,1.2rem + 2.5vw,3.3rem);line-height:1.04;letter-spacing:-.026em;max-width:21ch;text-wrap:balance}
.page-sub{margin-top:18px;font-size:clamp(1.02rem,.98rem + .3vw,1.16rem);line-height:1.6;color:var(--slate);max-width:60ch}
.bfacts{display:flex;flex-wrap:wrap;gap:8px;margin-top:24px}
.bfacts li{display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border-radius:999px;background:rgba(255,255,255,.74);border:1px solid rgba(255,255,255,.95);font-size:.86rem;font-weight:620;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
.bfacts .ic{width:18px;height:18px;color:var(--magenta-ink)}
.bhero__visual{margin:0;animation:fadeUp .9s var(--ease) .25s backwards}
.hero-photo{aspect-ratio:4/3;border-radius:26px;overflow:hidden;background:#0e0c14;box-shadow:var(--shadow-2)}
.hero-photo img{width:100%;height:100%;object-fit:cover}
.hero-caption{margin-top:12px;font-size:.86rem;color:var(--slate);text-align:center}

/* ---------- corps de page ---------- */
.bbody{padding-block:clamp(44px,6vw,84px)}
.bcols{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(24px,4vw,56px);align-items:start}
.bcols__aside{position:sticky;top:calc(var(--hdr-h) + 24px);display:grid;gap:12px}
.bflow{display:grid;gap:16px;min-width:0}
.bflow > *{min-width:0}
.bbody > .bflow{max-width:920px}

/* panneaux */
.panel{padding:clamp(22px,2.6vw,32px);border-radius:24px;background:#fff;border:1px solid var(--hair)}
.panel > * + *{margin-top:14px}
.panel h2{font-stretch:114%;font-weight:750;font-size:clamp(1.22rem,1.08rem + .5vw,1.5rem);line-height:1.2;letter-spacing:-.012em}
.panel h3{margin-top:24px;font-size:1rem}
.panel p{color:var(--slate);line-height:1.65;max-width:none}
.panel strong{color:var(--graphite)}
.panel a:not(.cta-btn){color:var(--magenta-ink);font-weight:600}
.panel-photo{border-radius:18px;overflow:hidden;border:1px solid var(--hair);background:var(--mist)}
.panel-photo img{width:100%;height:auto}

/* compatibilité */
.compat-list{border-top:1px solid var(--hair)}
.compat-row{display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding:11px 0;border-bottom:1px solid var(--hair);font-size:.95rem}
.compat-row .model{font-weight:650}
.compat-row .years{color:var(--slate);white-space:nowrap;font-variant-numeric:tabular-nums}
.compat-tags{display:flex;flex-wrap:wrap;gap:8px}
.compat-tags span{padding:6px 12px;border-radius:10px;background:var(--mist);font-size:.9rem;font-weight:650}
.version-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:6px}
.version-list > div{padding:8px 12px;border-radius:10px;background:var(--mist);font-size:.84rem;font-weight:600;font-stretch:88%;letter-spacing:.01em;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}

/* listes */
.check-list{display:grid;gap:10px}
.check-item{position:relative;padding-left:34px;font-size:.97rem;line-height:1.5}
.ck{position:absolute;left:0;top:1px;width:22px;height:22px;border-radius:50%;display:grid;place-items:center;background:rgba(233,30,140,.1);color:var(--magenta-ink)}
.ck .ic{width:13px;height:13px;stroke-width:2.4}
.check-item.cross{color:var(--slate)}
.check-item.cross .ck{background:rgba(23,21,31,.07);color:var(--slate)}
.req-list{display:grid;gap:10px}
.req-item{display:flex;align-items:flex-start;gap:12px;font-size:.97rem;line-height:1.5}
.req-item .dot{flex-shrink:0;width:8px;height:8px;margin-top:8px;border-radius:50%;background:var(--trace)}
.steps-list{display:grid;gap:14px}
.step-row{display:grid;grid-template-columns:36px minmax(0,1fr);gap:14px;align-items:start}
.step-row .n{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:var(--graphite);color:#fff;font-stretch:125%;font-weight:800;font-size:.92rem}
.step-row .t{padding-top:6px;line-height:1.55}

/* encadrés */
.warn-box,.remote-box{padding:20px 22px;border-radius:20px}
.warn-box{background:#fff7ec;border:1px solid #f3dcb8}
.warn-box .wt{margin-bottom:6px;font-weight:700;color:#8a4b0f}
.warn-box p{color:#6b4a2b;line-height:1.6}
.remote-box{background:rgba(106,43,217,.06);border:1px solid rgba(106,43,217,.16)}
.remote-box .rt{margin-bottom:8px;font-weight:700;color:var(--violet)}
.remote-box > * + *{margin-top:10px}

/* tarifs */
.price-box{padding:20px 22px;border-radius:20px;background:var(--mist);border:1px solid var(--hair)}
.price-box .top{display:flex;justify-content:space-between;align-items:baseline;gap:16px}
.price-box .lbl{font-weight:650;line-height:1.35}
.price-box .val{font-stretch:125%;font-weight:800;font-size:1.65rem;letter-spacing:-.02em;white-space:nowrap}
.price-box .desc{margin-top:8px;font-size:.88rem;line-height:1.5;color:var(--slate)}
.price-box .check-list{margin-top:14px}
.price-box.bundle{background:#fff;border-color:rgba(233,30,140,.35);box-shadow:0 12px 30px -22px rgba(233,30,140,.6)}
.panel .price-box + .price-box{margin-top:10px}

/* FAQ (ouverture au clic, déjà gérée par la page) */
.faq-item{border-bottom:1px solid var(--hair);cursor:pointer}
.faq-q{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:16px 0;font-weight:650;line-height:1.4}
.faq-q .plus{width:28px;height:28px;flex-shrink:0;border-radius:50%;border:1px solid var(--hair-2);display:grid;place-items:center;transition:transform .3s var(--ease),background-color .3s,color .3s,border-color .3s}
.faq-q .plus .ic{width:14px;height:14px}
.faq-item.open .plus{transform:rotate(45deg);background:var(--graphite);border-color:var(--graphite);color:#fff}
.faq-a{display:none;padding:0 40px 16px 0;color:var(--slate);line-height:1.65}
.faq-item.open .faq-a{display:block;animation:fadeUp .3s var(--ease)}

/* repères de section */
.era-divider{display:flex;align-items:center;gap:16px;margin:36px 0 6px}
.era-divider .line{flex:1;height:2px;border-radius:2px;background:var(--mist-2)}
.era-divider .line:first-child{flex:0 0 36px;background:var(--trace);box-shadow:0 0 10px rgba(233,30,140,.45)}
.era-divider .label{font-stretch:118%;font-weight:800;font-size:clamp(1.25rem,1.05rem + .8vw,1.7rem);letter-spacing:-.015em;line-height:1.2}
.bflow > .era-divider:first-child{margin-top:0}
.section-label{margin-top:10px;font-size:1.05rem;font-weight:700}

/* liens vers les modèles */
.mlinks{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-bottom:12px}
.model-link{display:grid;grid-template-columns:88px minmax(0,1fr) auto;align-items:center;gap:16px;padding:12px;border-radius:20px;background:#fff;border:1px solid var(--hair);transition:transform .3s var(--ease),box-shadow .3s,border-color .3s}
.model-link:hover{transform:translateY(-2px);border-color:var(--hair-2);box-shadow:var(--shadow-1)}
.model-link .thumb{width:88px;height:88px;border-radius:14px;overflow:hidden;background:var(--mist)}
.model-link .thumb img{width:100%;height:100%;object-fit:cover}
.model-link .info{display:grid;gap:2px;min-width:0}
.model-link .info strong{font-weight:700;font-stretch:108%;line-height:1.3}
.model-link .info span{font-size:.86rem;line-height:1.4;color:var(--slate)}
.model-link .arrow{padding-right:6px;color:var(--slate-2);transition:color .2s,transform .3s var(--ease)}
.model-link .arrow .ic,.choice-arrow .ic{width:20px;height:20px}
.model-link:hover .arrow{color:var(--magenta-ink);transform:translateX(3px)}

/* choix de formule */
.choices{display:grid;gap:12px}
.choice-btn{display:grid;grid-template-columns:48px minmax(0,1fr) auto;align-items:center;gap:16px;padding:18px 20px;border-radius:22px;background:#fff;border:1px solid var(--hair);transition:transform .3s var(--ease),box-shadow .3s,border-color .3s}
.choice-btn:hover{transform:translateY(-2px);border-color:var(--hair-2);box-shadow:var(--shadow-1)}
.choice-num{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;background:var(--graphite);color:#fff;font-stretch:125%;font-weight:800}
.choice-text strong{display:block;font-size:1.05rem;font-weight:700}
.choice-text span{display:block;font-size:.9rem;color:var(--slate)}
.choice-arrow{color:var(--slate-2);transition:color .2s,transform .3s var(--ease)}
.choice-btn:hover .choice-arrow{color:var(--magenta-ink);transform:translateX(3px)}

/* formulaire de commande */
.order-form{padding:clamp(24px,2.8vw,32px);border-radius:28px;background:rgba(255,255,255,.86);border:1px solid rgba(255,255,255,.95);box-shadow:var(--shadow-2);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px)}
.order-form h2{font-stretch:118%;font-weight:800;font-size:1.5rem;letter-spacing:-.015em}
.order-form .sub{margin-top:6px;font-size:.93rem;line-height:1.5;color:var(--slate)}
.order-form label{display:block;margin:18px 0 8px;font-size:.88rem;font-weight:650}
.order-form select,.order-form input{width:100%;height:52px;padding:0 16px;border-radius:14px;border:1px solid var(--hair-2);background:#fff;font-size:.98rem;transition:border-color .2s,box-shadow .2s}
.order-form select{appearance:none;-webkit-appearance:none;padding-right:44px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%2317151f' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 18px center}
.order-form select:focus,.order-form input:focus{outline:none;border-color:var(--violet);box-shadow:0 0 0 4px rgba(106,43,217,.12)}
.send-btn{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;min-height:54px;margin-top:22px;border-radius:999px;background:var(--magenta-btn);color:#fff;font-size:1rem;font-weight:650;box-shadow:0 10px 24px -12px rgba(209,20,124,.7);transition:background-color .25s,transform .25s var(--ease)}
.send-btn:hover{background:var(--magenta-btn-2);transform:translateY(-1px)}
.send-btn .ic{width:20px;height:20px}
.hint{margin-top:10px;text-align:center;font-size:.82rem;color:var(--slate)}

/* bouton d'appel à l'action */
.cta-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:56px;padding:0 30px;border-radius:999px;background:var(--magenta-btn);color:#fff;font-weight:650;box-shadow:0 10px 24px -12px rgba(209,20,124,.7);transition:background-color .25s,transform .25s var(--ease);justify-self:start}
.cta-btn:hover{background:var(--magenta-btn-2);transform:translateY(-2px)}
.cta-btn .ic{width:20px;height:20px}
.bflow > .cta-btn{margin-top:12px}

/* ---------- responsive ---------- */
@media (max-width:980px){
  .bhero--photo .bhero__in,.bcols{grid-template-columns:minmax(0,1fr)}
  .bcols__aside{position:static}
  .hero-photo{max-width:560px}
  .mlinks{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:640px){
  .panel{border-radius:20px}
  .model-link{grid-template-columns:64px minmax(0,1fr) auto;gap:12px}
  .model-link .thumb{width:64px;height:64px;border-radius:12px}
  .price-box .top{flex-direction:column;gap:4px}
  .compat-row{flex-direction:column;gap:2px}
  .compat-row .years{white-space:normal}
  .faq-a{padding-right:0}
  .choice-btn{grid-template-columns:40px minmax(0,1fr) auto;padding:16px}
  .choice-num{width:40px;height:40px}
  .cta-btn{width:100%}
}

/* ---------- formulaire : note de déplacement ---------- */
.order-form .form-note{margin-top:8px;font-size:.82rem;line-height:1.5;color:var(--slate)}
.order-form .form-note a{color:var(--magenta-ink);font-weight:650;white-space:nowrap}
.order-form .form-note a::after{content:" →"}
