/* =====================================================================
   Version mobile (720 px et moins), chargée après charte-v2.css.
   - Navigation au pouce : un dock en bas d'écran remplace la barre de
     timecode du haut, le bouton « haut de page » et le bouton collant.
     Son bord haut est la timeline (repères de chapitres, tête de lecture),
     le bouton de gauche ouvre la liste des chapitres, celui de droite
     lance la Vidéo Découverte.
   - Moins de densité : cartes en bandes à faire défiler, listes de prix
     repliées après 4 lignes, FAQ repliée après 5 questions, marges
     resserrées. Rien n'est retiré de la page (indexation mobile) : tout
     reste lisible en un geste.
   Le rendu ordinateur et tablette n'est pas touché. Comportements :
   mobile.js. Changer ce fichier = incrémenter ?v= dans les pages.
   ===================================================================== */

/* Éléments propres au mobile : invisibles au-dessus de 720 px */
.m-dock,.m-sheet,.m-only,.m-dots,.m-more{display:none}

@media(max-width:720px){

  .m-hide{display:none !important}

  /* ---------- Barre du haut : logo seul, cachée en descendant ---------- */
  .topbar{padding:10px 16px;transition:transform .3s cubic-bezier(.16,1,.3,1)}
  html.m-top-hidden .topbar{transform:translateY(-100%)}
  .tc-bar,.cta-sticky,.to-top{display:none !important}

  /* ---------- Hero : promesse, preuve, une action, dans le premier écran ---------- */
  .hero{padding:80px 20px 24px}
  .hero-kicker{display:none}
  .hero .hero-rating{margin-bottom:18px}
  .hero-grid{gap:20px}
  .hero-left{gap:18px}
  .hero-left > .hero-title{order:0}
  .hero-left > .hero-subtitle{order:1}
  .hero-left > .hero-ctas{order:2}
  .hero-left > .spot-video{order:3;margin:6px 0 0}
  .hero-left > .ba-section{order:3;padding:6px 0 0}
  .hero .hero-title{font-size:clamp(31px,9.6vw,38px);line-height:1.02;margin-bottom:0}
  .hero-title-rest{display:block;margin-top:14px;font-size:.5em;line-height:1.32;letter-spacing:-.015em;font-weight:500;color:var(--cream-dim)}
  .hero-title-rest .strike::after{height:2px}
  .hero .hero-subtitle{font-size:15px;line-height:1.55;max-width:none}
  .hero-ctas{gap:10px}
  .hero-ctas .m-only{display:flex}
  .hero-ctas .btn{justify-content:center;min-height:54px;padding:15px 20px;font-size:16px}
  .hero-ctas .hero-cta-note{font-size:12.5px !important;text-align:center;line-height:1.45}

  /* Avant / après (déplacé en fin de hero par le script de la page) : côte à côte */
  .hero .ba-section{padding:20px 0 0}
  .hero .ba-title{font-size:24px}
  .hero .ba-sub{font-size:14px;margin-bottom:16px}
  .ba-grid{gap:10px}
  .ba-label{font-size:12.5px;margin-top:8px;line-height:1.35}
  .ba-photos{font-size:14px;padding:12px 14px;margin-top:18px}

  /* Bandeau de réassurance : une ligne de 4 chiffres */
  .trust-bar{padding:16px 10px;margin-bottom:0}
  .trust-bar-inner{grid-template-columns:repeat(4,1fr) !important;gap:6px !important}
  .trust-stat-num{font-size:23px !important;line-height:1.1}
  .trust-stat-label{font-size:11px !important;line-height:1.25;margin-top:4px}

  /* ---------- Rythme des sections ---------- */
  .section{padding:48px 20px}
  .section-tag{margin-bottom:18px !important;max-width:100%}
  /* Le timecode passe dans le dock : l'étiquette CLIP tient sur une ligne */
  .section-tag > .tag-body{flex-wrap:nowrap;min-width:0}
  .section-tag > .tag-body > span:last-child{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .section-tag .tc{display:none}
  .section-title{font-size:29px !important;line-height:1.06 !important;margin-bottom:14px}
  .section-intro{font-size:15.5px;line-height:1.55;margin-bottom:24px}
  .section .spot-video{margin:0 0 24px}
  .sim-section{padding:44px 20px 24px}
  .sim-section .ba-title{font-size:26px}
  .sim-section .ba-sub{font-size:14.5px;margin-bottom:20px}
  .simulator{padding:52px 18px 20px !important}
  .simulator .sim-tag::after{display:none}
  .simulator .sim-cta{justify-content:center;text-align:center;min-height:54px}
  .sim-compare{gap:8px}
  .sim-box{padding:14px 12px}
  .sim-box-num{font-size:24px !important;white-space:nowrap;letter-spacing:-.03em}
  .sim-box-label{font-size:12px !important}
  .sim-result{padding:14px 16px}
  .sim-result-num{font-size:30px !important}
  /* Curseurs : 36 px de hauteur tactile, piste de 3 px dessinée au centre */
  .simulator input[type=range]{height:36px;background:linear-gradient(var(--ink-3),var(--ink-3)) center / 100% 3px no-repeat;border-radius:0}
  .simulator input[type=range]::-webkit-slider-thumb{width:26px;height:26px}
  .simulator input[type=range]::-moz-range-thumb{width:20px;height:20px}
  /* Points des avis : zone tactile de 24 px autour de chaque point */
  .proof-dots{gap:16px}
  .proof-dot{position:relative}
  .proof-dot::after{content:'';position:absolute;inset:-9px}

  /* ---------- Bandes à faire défiler (constat, rendus, tarifs) ---------- */
  .problem-grid,.shorts-grid,.pricing-grid{
    display:flex !important;gap:12px;
    overflow-x:auto;overflow-y:hidden;overscroll-behavior-x:contain;
    scroll-snap-type:x mandatory;scroll-padding-inline:20px;
    margin-left:-20px;margin-right:-20px;padding:2px 20px 6px;
    scrollbar-width:none;-webkit-overflow-scrolling:touch;
  }
  .problem-grid::-webkit-scrollbar,.shorts-grid::-webkit-scrollbar,.pricing-grid::-webkit-scrollbar{display:none}
  .pricing-grid.hidden-grid{display:none !important}
  .problem-grid > *,.shorts-grid > *,.pricing-grid > *{scroll-snap-align:start;flex-shrink:0}
  .problem-grid > .reveal,.shorts-grid > .reveal,.pricing-grid > .reveal{opacity:1 !important;transform:none !important}

  .problem-grid{background:none;border:0;border-radius:0}
  .problem-cell{flex-basis:84%;padding:22px 20px;border:1px solid var(--line-strong);border-radius:12px !important}
  .problem-num{margin-bottom:14px}
  .problem-cell h3{font-size:19px;margin-bottom:10px}
  .problem-cell p{font-size:14.5px;line-height:1.55}

  .showcase{padding:48px 20px}
  .shorts-grid{margin-top:20px;margin-bottom:0}
  .reel-card{flex-basis:62%}
  .reel-card:hover{transform:none}

  /* Repères sous chaque bande */
  .m-dots{display:flex;justify-content:center;gap:0;margin-top:8px}
  .m-dots button{width:24px;height:24px;padding:0;border:0;background:none;display:grid;place-items:center;cursor:pointer}
  .m-dots button::before{content:'';width:6px;height:6px;border-radius:3px;background:var(--line-strong);transition:width .25s,background-color .25s}
  .m-dots button[aria-current="true"]::before{width:18px;background:var(--orange)}
  .m-dots button:focus-visible{outline:2px solid var(--orange);outline-offset:-4px;border-radius:6px}
  .pricing-grid.hidden-grid + .m-dots{display:none}

  /* ---------- Tarifs : Découverte en tête, détail replié ---------- */
  .pricing-pin .pricing-section{padding:0}
  .pricing-toggle{margin-bottom:20px}
  .pricing-grid{margin-top:0;align-items:flex-start}
  .price-card{flex-basis:86%;padding:24px 20px}
  .price-amount{margin-bottom:16px;padding-bottom:16px}
  .price-list{margin-bottom:8px}
  .price-list li{padding:7px 0}
  .price-list.m-clamp:not(.m-open) li:nth-child(n+5){display:none}
  .price-cta{margin-top:12px}
  .price-note{font-size:13.5px;line-height:1.55}

  /* Bouton « voir tout le détail » (listes de prix, FAQ) */
  .m-more{display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:0;border:0;background:none;cursor:pointer;
    font-family:'Geist',sans-serif;font-size:14px;font-weight:500;color:var(--cream);
    text-decoration:underline;text-decoration-color:var(--orange);text-underline-offset:4px}
  .m-more:focus-visible{outline:2px solid var(--orange);outline-offset:2px;border-radius:4px}

  /* ---------- Studio partenaire, inclus, podcast, long format ---------- */
  .partner{padding:48px 20px}
  .partner-score{padding:12px 16px}
  .features{grid-template-columns:1fr 1fr !important;margin-top:20px}
  .feature-cell{flex-direction:column;gap:8px;padding:16px 14px}
  .feature-content h4{font-size:15px;line-height:1.25}
  .feature-content p{font-size:13px;line-height:1.45}
  .podcast-section{padding:8px 20px 40px}
  .podcast-title{font-size:29px !important;line-height:1.06 !important}
  .podcast-sub{font-size:15px;line-height:1.55}
  .podcast-offers{grid-template-columns:repeat(3,1fr) !important;gap:8px;margin-bottom:20px}
  .podcast-offer{padding:12px 10px;border-radius:10px}
  .podcast-offer strong{font-size:12.5px;line-height:1.25}
  .podcast-offer .po-price{font-size:17px;white-space:nowrap}
  .podcast-offer .po-unit{font-size:10.5px;line-height:1.35}
  .podcast-cta-row{flex-direction:column;align-items:stretch;gap:10px}
  .podcast-cta-row .btn{justify-content:center}
  .youtube-section-title{font-size:26px}

  /* ---------- Fondateur, preuve, méthode ---------- */
  .founder{padding:48px 20px}
  .founder-inner{gap:28px}
  .founder-shorts{max-width:230px}
  .founder .btn{width:100%;justify-content:center}
  .social-proof{padding:40px 20px 28px}
  .proof-big-num{font-size:64px !important}

  .process{padding:48px 20px}
  .process-steps{margin-top:24px;gap:0 !important}
  .process-steps .step{padding:0 0 22px 54px}
  .process-steps .step::after{content:'';position:absolute;left:18px;top:42px;bottom:6px;width:1px;background:var(--line-strong)}
  .process-steps .step:last-child::after{display:none}
  .process-steps .step-num{position:absolute;left:0;top:0;width:37px;height:37px;margin:0;border:1px solid var(--line-strong);border-radius:50%;
    display:flex;align-items:center;justify-content:center;font-family:'Geist Mono',monospace;font-size:13px;letter-spacing:0;color:var(--orange)}
  .process-steps .step h4{font-size:17px;margin:7px 0 6px}
  .process-steps .step p{font-size:14px;line-height:1.55}

  /* ---------- Page Agences ---------- */
  .hero-v2{padding:80px 20px 28px;gap:24px}
  .hero-v2 .kicker{display:none}
  .hero-v2 h1{font-size:clamp(31px,9.4vw,38px);line-height:1.04;margin-bottom:16px}
  .hero-v2 .hero-badge{margin:0 0 16px}
  .hero-v2 .hero-subtitle{font-size:15px;line-height:1.55;max-width:none}
  .hero-v2 .hero-ctas{margin-top:20px;flex-direction:column;align-items:stretch}
  .capfiche{max-width:none;padding:20px 18px}
  .capfiche-row{padding:8px 0}
  .capfiche .btn{min-height:50px}

  /* Comment ça marche : étapes reliées par un fil, comme la méthode de l'accueil */
  .workflow-pin .workflow{padding:48px 20px}
  .workflow-steps{margin-top:24px;gap:0 !important}
  .workflow-step{position:relative;padding:0 0 22px 54px;border:0;background:none;box-shadow:none;transform:none !important}
  .workflow-step:hover{transform:none;border:0;background:none}
  .workflow-step::after{content:'';position:absolute;left:18px;top:42px;bottom:6px;width:1px;background:var(--line-strong)}
  .workflow-step:last-child::after{display:none}
  .workflow-step-num{position:absolute;left:0;top:0;width:37px;height:37px;margin:0;border:1px solid var(--line-strong);border-radius:50%;background:none;
    display:flex;align-items:center;justify-content:center;font-family:'Geist Mono',monospace;font-size:13px;letter-spacing:0;color:var(--orange)}
  html.light .workflow-step-num{color:var(--orange)}
  .workflow-step h4{font-size:17px;margin:7px 0 6px}
  .workflow-step p{font-size:14px;line-height:1.55}

  /* Tarif grossiste : chaque palier sur deux lignes, le total se déduit */
  .pricing-inner{padding:0}
  .pricing-section{padding:48px 20px}
  .pricing-table-wrapper,.pricing-secondary{padding:18px 16px;margin-bottom:16px;overflow:visible}
  .pricing-table-header,.pricing-secondary-header{flex-direction:column;align-items:flex-start;gap:8px;margin-bottom:12px}
  .pricing-table-title,.pricing-secondary-title{font-size:21px}
  .pricing-table,.pricing-table tbody{display:block;width:100%;min-width:0}
  .pricing-table thead{display:none}
  .pricing-table tbody tr{display:grid;grid-template-columns:1fr auto;grid-template-areas:"name price" "vol save";gap:2px 12px;align-items:baseline;padding:12px 10px;border-radius:8px}
  .pricing-table td{padding:0 !important;border:0 !important;text-align:left !important;background:none !important}
  .pricing-table td:nth-child(1){grid-area:name}
  .pricing-table td.volume{grid-area:vol;font-size:13px}
  .pricing-table td:nth-child(3){grid-area:price;text-align:right !important;font-size:20px;white-space:nowrap}
  .pricing-table td:nth-child(4){display:none}
  .pricing-table td.savings{grid-area:save;text-align:right !important;font-size:12.5px}
  .pricing-table-footer{font-size:12px;line-height:1.55;padding-top:12px}
  .brand-note{font-size:14px;line-height:1.55}

  .calculator{padding:48px 20px}
  .calc-box{padding:20px 16px}
  .calc-grid{gap:24px}
  .calc-slider-wrapper{padding:4px 0 8px}
  .calc-slider{height:36px;background:linear-gradient(var(--ink-3),var(--ink-3)) center / 100% 6px no-repeat;border-radius:0}
  .calc-slider-value{font-size:26px}
  .calc-results{padding:18px 16px;gap:14px}
  .calc-result-row{gap:12px;padding-bottom:12px}
  .calc-result-label{font-size:11.5px;line-height:1.35}
  .calc-result-value{white-space:nowrap;font-size:24px !important;text-align:right}
  .calc-result-row.highlight .calc-result-value{font-size:30px !important}
  .pricing-table-footer{text-align:left}

  /* Garanties : bande à faire défiler */
  .guarantees{padding:48px 20px}
  .guarantees-grid{
    display:flex !important;gap:12px;
    overflow-x:auto;overflow-y:hidden;overscroll-behavior-x:contain;
    scroll-snap-type:x mandatory;scroll-padding-inline:20px;
    margin-left:-20px;margin-right:-20px;padding:2px 20px 6px;
    scrollbar-width:none;-webkit-overflow-scrolling:touch;
  }
  .guarantees-grid::-webkit-scrollbar{display:none}
  .guarantees-grid{margin-top:24px}
  .guarantees-grid > .reveal{opacity:1 !important;transform:none !important}
  .guarantee-card{flex:0 0 84%;scroll-snap-align:start;padding:22px 20px;flex-direction:column;gap:14px}
  .guarantee-card:hover{transform:none}

  /* ---------- Page Podcast ---------- */
  .brief{margin-top:32px;padding:0 20px}
  .brief-in{padding:20px 18px}
  .section .pod-how .spot-video{max-width:230px}
  .pod-how{gap:24px}
  .pod-steps li{grid-template-columns:34px minmax(0,1fr);gap:10px;padding:18px 0}
  .pod-steps h3{font-size:17px;margin-bottom:4px}
  .pod-steps p{font-size:14px;line-height:1.55}
  .pod-example{font-size:14px;line-height:1.55}
  .price-clips{margin-bottom:14px;padding:12px 14px}
  .price-clips strong{font-size:19px}
  /* Comparatif : une carte par critère, chaque option sur sa ligne avec son nom */
  .cmp-wrap{overflow:visible;border:0;background:none;box-shadow:none}
  .cmp,.cmp tbody,.cmp tr,.cmp th,.cmp td{display:block;width:auto;min-width:0}
  .cmp thead,.cmp-hint{display:none !important}
  .cmp tr{margin-bottom:10px;border:1px solid var(--line);border-radius:12px;background:var(--ink-2);overflow:hidden}
  .cmp tbody th{width:auto;padding:12px 14px 8px;font-size:15px;border-bottom:0}
  .cmp td{display:grid;grid-template-columns:38% minmax(0,1fr);gap:10px;padding:8px 14px;font-size:13.5px;line-height:1.45;border-bottom:0;border-top:1px solid var(--line)}
  .cmp td::before{content:attr(data-l);font-size:12px;font-weight:500;color:var(--muted)}
  .cmp td.us::before{color:var(--orange)}
  .cmp tbody tr:last-child td{border-top:1px solid var(--line)}
  .cmp-note{margin-top:16px;font-size:14.5px;line-height:1.6}

  /* ---------- FAQ : 5 questions, la suite en un geste ---------- */
  .faq{padding:48px 20px}
  .faq > div{margin-top:12px !important}
  .faq-item{padding:0}
  .faq-question{font-size:16.5px;line-height:1.35;margin:0;padding:16px 0;min-height:56px;align-items:center;gap:16px}
  .faq-toggle{font-size:22px}
  .faq-answer{font-size:15px;line-height:1.6}
  .faq-item.open .faq-answer{padding:0 0 18px}
  .m-faq-collapsed .m-faq-extra{display:none}
  .faq .m-more{display:flex;width:100%;justify-content:center;margin-top:12px;min-height:50px;border:1px solid var(--line-strong);border-radius:8px;text-decoration:none;background:var(--ink-2)}

  /* ---------- Appel final, formulaire, pied de page ---------- */
  .final-cta{padding:56px 20px}
  .final-cta-tag{margin-bottom:16px}
  .final-cta h2{font-size:31px;margin-bottom:24px}
  .final-cta-actions{flex-direction:column;gap:10px;margin-bottom:20px}
  .final-cta-actions .btn{justify-content:center;min-height:54px}
  .final-cta-note{line-height:1.7}
  .form-section{padding:48px 16px}
  .form-title{font-size:26px}
  .form-subtitle{margin-bottom:24px}
  .form-card{padding:20px 16px}
  /* 16 px minimum : iOS ne zoome plus sur le champ touché */
  .form-field input,.form-field textarea,.form-field select{font-size:16px}
  footer{padding:32px 20px calc(112px + env(safe-area-inset-bottom))}

  /* Bandeau cookies : compact, boutons à la taille du pouce */
  #cns-consent{left:10px;right:10px;bottom:10px;padding:14px 16px;font-size:12.5px;line-height:1.5}
  #cns-consent p{margin-bottom:10px}
  #cns-consent button{min-height:44px}

  /* ================== DOCK DU POUCE ================== */
  .m-dock{
    display:flex;gap:6px;padding:6px;
    position:fixed;left:10px;right:10px;bottom:max(10px,env(safe-area-inset-bottom));z-index:150;
    background:color-mix(in srgb,var(--ink-2) 90%,transparent);
    -webkit-backdrop-filter:saturate(1.4) blur(14px);backdrop-filter:saturate(1.4) blur(14px);
    border:1px solid var(--line-strong);border-radius:14px;box-shadow:var(--shadow-md);
    transform:translateY(calc(100% + 24px));visibility:hidden;
    transition:transform .35s cubic-bezier(.16,1,.3,1),visibility 0s linear .35s;
  }
  .m-dock.show{transform:none;visibility:visible;transition:transform .35s cubic-bezier(.16,1,.3,1),visibility 0s}
  /* Clavier ouvert, bandeau cookies ou liste des chapitres affichés : le dock s'efface */
  html.m-kbd .m-dock,#cns-consent.show ~ .m-dock,html.m-sheet-open .m-dock{
    transform:translateY(calc(100% + 24px));visibility:hidden;
    transition:transform .35s cubic-bezier(.16,1,.3,1),visibility 0s linear .35s;
  }

  /* Bord haut = timeline : repères des chapitres et tête de lecture */
  .m-dock-track{position:absolute;left:14px;right:14px;top:-1px;height:2px;border-radius:2px;background:var(--line-strong);pointer-events:none}
  .m-dock-fill{position:absolute;inset:0;border-radius:2px;background:var(--orange);transform-origin:left center;transform:scaleX(0)}
  .m-dock-tick{position:absolute;top:-2px;width:1px;height:6px;background:var(--muted)}

  .m-dock-chap{
    flex:0 0 41%;min-width:0;min-height:50px;padding:7px 10px;
    display:grid;grid-template-columns:1fr auto;align-items:center;column-gap:6px;row-gap:2px;text-align:left;
    background:var(--ink-3);border:1px solid var(--line);border-radius:9px;color:var(--cream);cursor:pointer;
    font-family:'Geist',sans-serif;
  }
  .m-dock-tc{grid-column:1;display:flex;align-items:center;gap:5px;white-space:nowrap;
    font-family:'Geist Mono',monospace;font-size:9.5px;letter-spacing:1.2px;text-transform:uppercase;color:var(--muted)}
  .m-dock-tc b{color:var(--violet);font-weight:700}
  .m-rec{flex:none;width:6px;height:6px;border-radius:50%;background:#e5484d;animation:dotPulse 1.4s infinite}
  .m-dock-name{grid-column:1;font-size:13.5px;font-weight:500;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .m-dock-chap svg{grid-column:2;grid-row:1 / 3;width:16px;height:16px;color:var(--muted)}
  .m-dock-cta{
    flex:1;min-width:0;min-height:50px;display:flex;align-items:center;justify-content:center;gap:8px;
    background:var(--orange);color:#fff;border-radius:9px;text-decoration:none;
    font-family:'Geist',sans-serif;font-size:15px;font-weight:600;white-space:nowrap;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.12);
  }
  .m-dock-cta:active,.m-dock-chap:active{transform:scale(.98)}
  .m-dock-chap:focus-visible,.m-dock-cta:focus-visible{outline:none;box-shadow:0 0 0 3px var(--accent-ring)}

  /* ================== LISTE DES CHAPITRES (feuille du bas) ================== */
  .m-sheet{display:block;position:fixed;inset:0;z-index:250}
  .m-sheet[hidden]{display:none}
  .m-sheet-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.55);opacity:0;transition:opacity .3s}
  .m-sheet.open .m-sheet-backdrop{opacity:1}
  .m-sheet-panel{
    position:absolute;left:0;right:0;bottom:0;max-height:88vh;overflow-y:auto;overscroll-behavior:contain;
    padding:8px 16px calc(16px + env(safe-area-inset-bottom));
    background:var(--ink-2);border-top:1px solid var(--line-strong);border-radius:18px 18px 0 0;
    box-shadow:0 -12px 40px rgba(0,0,0,.35);
    transform:translateY(100%);transition:transform .38s cubic-bezier(.32,.72,0,1);
  }
  .m-sheet.open .m-sheet-panel{transform:none}
  .m-sheet-grab{width:38px;height:4px;border-radius:2px;background:var(--line-strong);margin:2px auto 6px}
  .m-sheet-head{display:flex;align-items:center;justify-content:space-between;touch-action:none}
  .m-sheet-title{margin:0;font-family:'Geist Mono',monospace;font-size:11px;letter-spacing:2px;text-transform:uppercase;color:var(--muted)}
  .m-sheet-close{width:44px;height:44px;margin-right:-10px;display:grid;place-items:center;border:0;background:none;color:var(--cream);cursor:pointer;border-radius:8px}
  .m-sheet-close svg{width:20px;height:20px}
  .m-sheet-list{list-style:none;margin:4px 0 0;padding:0;border-top:1px solid var(--line)}
  .m-sheet-list a{
    display:grid;grid-template-columns:30px 1fr auto;align-items:center;gap:10px;min-height:52px;padding:0 4px;
    border-bottom:1px solid var(--line);color:var(--cream);text-decoration:none;font-size:16px;font-weight:500;position:relative;
  }
  .m-sheet-list .n,.m-sheet-list .tc{font-family:'Geist Mono',monospace;font-size:11px;letter-spacing:1px;color:var(--muted)}
  .m-sheet-list a[aria-current="true"]{color:var(--violet)}
  .m-sheet-list a[aria-current="true"] .n{color:var(--violet)}
  .m-sheet-list a[aria-current="true"]::before{content:'';position:absolute;left:-16px;top:12px;bottom:12px;width:3px;border-radius:0 3px 3px 0;background:var(--orange)}
  .m-sheet-links{display:flex;flex-wrap:wrap;gap:8px;margin:16px 0}
  .m-sheet-links a,.m-sheet-links button{
    min-height:44px;padding:0 14px;display:inline-flex;align-items:center;
    border:1px solid var(--line-strong);border-radius:8px;background:var(--ink-3);color:var(--cream);
    font-family:'Geist',sans-serif;font-size:14px;font-weight:500;text-decoration:none;cursor:pointer;
  }
  .m-sheet-ctas{display:grid;gap:8px}
  .m-sheet-ctas .btn{justify-content:center;min-height:52px;padding:14px 20px}
  .m-sheet a:focus-visible,.m-sheet button:focus-visible{outline:none;box-shadow:0 0 0 3px var(--accent-ring)}
  html.m-sheet-open,html.m-sheet-open body{overflow:hidden}
}

@media(max-width:720px) and (prefers-reduced-motion:reduce){
  .topbar,.m-dock,.m-sheet-backdrop,.m-sheet-panel,.m-dots button::before{transition:none !important}
  .m-rec{animation:none}
  html.m-top-hidden .topbar{transform:none}
}
