/* home-vars.css — trois propositions de Home (A/B/C), pages /home-a /home-b /home-c.
   Chargée UNIQUEMENT par ces trois pages : rien ici ne peut casser le site.
   Elle complète la charte hextech-or (tokens, .display, .bt2, .gate, .hxt…),
   elle ne la redéfinit jamais. */

/* ───────── commun aux trois ───────── */
.hv-switch{display:flex;gap:8px;align-items:center;margin:0 0 22px}
.hv-switch .lb{font:600 9.5px Inter;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);margin-right:4px}
.hv-switch a{display:inline-flex;align-items:center;gap:7px;padding:7px 15px;font:600 11px Inter;letter-spacing:.06em;color:rgba(255,255,255,.8);text-decoration:none;background:rgba(255,255,255,.06);box-shadow:inset 0 1px 0 rgba(255,255,255,.18);clip-path:polygon(9px 0,calc(100% - 9px) 0,100% 50%,calc(100% - 9px) 100%,9px 100%,0 50%)}
.hv-switch a em{font-style:normal;font-family:'Noto Serif KR',serif;font-size:10px;opacity:.6}
.hv-switch a.on{position:relative;isolation:isolate;background:linear-gradient(115deg,#8A6A2F 0 18%,#F7EFDC 34%,#C8AA6E 52%,#E4CE9B 74%,#8A6A2F 92%);color:#E8C77E}
.hv-switch a.on::before{content:'';position:absolute;inset:1px;z-index:-1;background:#101626;clip-path:polygon(8.4px 0,calc(100% - 8.4px) 0,100% 50%,calc(100% - 8.4px) 100%,8.4px 100%,0 50%)}
.hv-switch a:hover{background:rgba(255,255,255,.1)}
.hv-switch a.on:hover{background:linear-gradient(115deg,#8A6A2F 0 18%,#F7EFDC 34%,#C8AA6E 52%,#E4CE9B 74%,#8A6A2F 92%)}

/* bouton principal or (encre sombre sur or, aucun arrondi) */
.hv-cta{display:inline-flex;align-items:center;gap:10px;padding:15px 30px;font:800 italic 15px 'Inter Tight',Inter,sans-serif;letter-spacing:.01em;color:#0B0E1A;text-decoration:none;background:linear-gradient(115deg,#8A6A2F 0 12%,#F7EFDC 32%,#C8AA6E 54%,#E4CE9B 76%,#8A6A2F 94%);clip-path:polygon(15px 0,calc(100% - 15px) 0,100% 50%,calc(100% - 15px) 100%,15px 100%,0 50%)}
.hv-cta i{font-size:15px}
.hv-cta:hover{filter:brightness(1.09)}
.hv-cta.ghost{position:relative;isolation:isolate;color:#F2F4FA;font-weight:600;font-style:normal;background:rgba(255,255,255,.2)}
.hv-cta.ghost::before{content:'';position:absolute;inset:1px;z-index:-1;background:#0E1424;clip-path:polygon(14px 0,calc(100% - 14px) 0,100% 50%,calc(100% - 14px) 100%,14px 100%,0 50%)}
.hv-cta.ghost:hover{background:rgba(255,255,255,.34)}

.hv-rail{height:3px;background:rgba(255,255,255,.1);overflow:hidden}
.hv-rail i{display:block;height:100%;background:linear-gradient(90deg,#785A28,#C8AA6E 55%,#F0E6D2)}

/* ═══════════ A · Pratiquer aujourd'hui ═══════════ */
.hva-hero{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);gap:34px;align-items:center;margin-top:14px}
.hva-hero .eyebrow{display:flex;align-items:center;gap:11px;font:600 10px Inter;letter-spacing:.2em;text-transform:uppercase;color:var(--muted)}
.hva-hero .eyebrow b{color:#C8AA6E;font-weight:600}
.hva-hero .eyebrow s{width:5px;height:5px;transform:rotate(45deg);background:rgba(255,255,255,.3);text-decoration:none}
.hva-hero h1{margin:14px 0 0;font-family:'GT Sectra Display',Georgia,serif;font-weight:700;font-style:italic;font-size:clamp(38px,5.4vw,68px);line-height:1.02;color:#F2F4FA}
.hva-hero h1 span{display:block;color:#E4CE9B}
.hva-hero .lead{margin:15px 0 0;font:500 15px Inter;line-height:1.6;color:rgba(255,255,255,.72);max-width:52ch}
.hva-prog{display:flex;align-items:center;gap:14px;margin-top:20px;max-width:400px}
.hva-prog .hv-rail{flex:1}
.hva-prog .n{font:700 italic 13px 'Inter Tight',Inter,sans-serif;color:#E4CE9B;font-variant-numeric:tabular-nums}
.hva-acts{display:flex;flex-wrap:wrap;gap:12px;margin-top:26px}
.hva-shot{position:relative;aspect-ratio:1/1.14;overflow:hidden;clip-path:polygon(26px 0,calc(100% - 26px) 0,100% 50%,calc(100% - 26px) 100%,26px 100%,0 50%)}
.hva-shot img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:brightness(.72) saturate(.95)}
.hva-shot::after{content:'';position:absolute;inset:0;box-shadow:inset 0 2px 0 rgba(255,255,255,.28),inset 0 -2px 0 rgba(255,255,255,.1);background:linear-gradient(0deg,rgba(8,12,22,.8),transparent 55%)}
.hva-shot .ko{position:absolute;left:0;right:0;bottom:20px;z-index:2;text-align:center;font-family:'Noto Serif KR',serif;font-size:30px;color:rgba(255,255,255,.9);letter-spacing:.14em}

.hva-nums{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:38px}
.hva-num{display:flex;align-items:center;gap:16px;padding:18px 22px;background:linear-gradient(150deg,rgba(255,255,255,.075),rgba(255,255,255,.028));box-shadow:inset 0 1.4px 0 rgba(255,255,255,.24),inset 0 -1.4px 0 rgba(255,255,255,.08);clip-path:polygon(15px 0,calc(100% - 15px) 0,100% 50%,calc(100% - 15px) 100%,15px 100%,0 50%);text-decoration:none}
.hva-num i{font-size:26px;color:#C8AA6E;opacity:.9}
.hva-num .v{font:700 italic 30px 'Inter Tight',Inter,sans-serif;color:#F2F4FA;line-height:1;font-variant-numeric:tabular-nums}
.hva-num .v small{font-size:14px;font-weight:600;color:var(--muted);margin-left:4px}
.hva-num .l{display:block;margin-top:5px;font:600 9.5px Inter;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}

.hva-steps{display:flex;flex-direction:column;gap:8px;margin-top:8px}
.hva-step{display:flex;align-items:center;gap:18px;padding:17px 22px;background:linear-gradient(150deg,rgba(255,255,255,.06),rgba(255,255,255,.022));box-shadow:inset 0 1.2px 0 rgba(255,255,255,.2),inset 0 -1.2px 0 rgba(255,255,255,.06);clip-path:polygon(13px 0,calc(100% - 13px) 0,100% 50%,calc(100% - 13px) 100%,13px 100%,0 50%);text-decoration:none}
.hva-step:hover{background:linear-gradient(150deg,rgba(255,255,255,.1),rgba(255,255,255,.04))}
.hva-step .n{flex:0 0 34px;font:700 italic 22px 'Inter Tight',Inter,sans-serif;color:rgba(255,255,255,.28);font-variant-numeric:tabular-nums}
.hva-step.on .n{color:#E4CE9B}
.hva-step .tx{flex:1;min-width:0}
.hva-step .tx b{display:block;font:600 15px Inter;color:#F2F4FA}
.hva-step .tx span{font:500 11.5px Inter;color:var(--muted)}
.hva-step .st{font:600 9.5px Inter;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);white-space:nowrap}
.hva-step.on .st{color:#C8AA6E}
.hva-step i.go{font-size:13px;color:var(--muted)}

/* ═══════════ B · Trouver en dix secondes ═══════════ */
/* Le héros respire : de l'air AU DESSUS du titre, puis beaucoup d'air entre le
   titre, la recherche et les trois portes. Les trois blocs sont trois temps de
   lecture, ils ne doivent pas se toucher (Jason 04/09). */
.hvb-head{text-align:center;padding:clamp(44px,7vh,96px) 0 0}
.hvb-head h1{margin:0;font-family:'GT Sectra Display',Georgia,serif;font-weight:700;font-style:italic;font-size:clamp(36px,5vw,60px);line-height:1.05;color:#F2F4FA}
.hvb-head p{margin:12px auto 0;max-width:66ch;font:500 14px Inter;line-height:1.6;color:var(--muted)}
.hvb-search{position:relative;max-width:760px;margin:30px auto 0}
.hvb-field{position:relative;isolation:isolate;display:flex;align-items:center;gap:14px;padding:19px 26px;background:linear-gradient(115deg,#8A6A2F 0 18%,#F7EFDC 34%,#C8AA6E 52%,#E4CE9B 74%,#8A6A2F 92%)}
.hvb-field::before{content:'';position:absolute;inset:1.5px;z-index:-1;background:#0E1424;clip-path:polygon(16.5px 0,calc(100% - 16.5px) 0,100% 50%,calc(100% - 16.5px) 100%,16.5px 100%,0 50%)}
.hvb-field{clip-path:polygon(18px 0,calc(100% - 18px) 0,100% 50%,calc(100% - 18px) 100%,18px 100%,0 50%)}
.hvb-field i{font-size:20px;color:#C8AA6E}
.hvb-field input{flex:1;min-width:0;background:none;border:0;outline:0;font:500 16px Inter;color:#F2F4FA}
.hvb-field input::placeholder{color:rgba(255,255,255,.36)}
.hvb-field kbd{font:600 10px Inter;letter-spacing:.1em;color:var(--muted);padding:4px 9px;background:rgba(255,255,255,.07);box-shadow:inset 0 1px 0 rgba(255,255,255,.16)}
.hvb-res{margin-top:10px;background:#0E1424;box-shadow:inset 0 0 0 1px rgba(255,255,255,.13);max-height:340px;overflow:auto}
.hvb-res:empty{display:none}
.hvb-res a{display:flex;align-items:center;gap:14px;padding:12px 22px;text-decoration:none;border-bottom:1px solid rgba(255,255,255,.06)}
.hvb-res a:last-child{border-bottom:0}
.hvb-res a:hover{background:rgba(255,255,255,.05)}
.hvb-res .kd{flex:0 0 84px;font:600 9px Inter;letter-spacing:.14em;text-transform:uppercase;color:#C8AA6E}
.hvb-res b{font:600 14px Inter;color:#F2F4FA}
.hvb-res .ko{margin-left:auto;font-family:'Noto Serif KR',serif;font-size:13px;color:var(--muted)}
.hvb-hint{margin-top:12px;display:flex;flex-wrap:wrap;gap:8px;justify-content:center}

/* …et beaucoup d'air APRÈS la recherche : les trois portes sont un second
   temps de lecture, elles ne doivent pas coller au champ. */
.hvb-intents{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:clamp(64px,9.5vh,124px)}
.hvb-intent{position:relative;display:flex;flex-direction:column;gap:9px;padding:26px 26px 24px;background:linear-gradient(150deg,rgba(255,255,255,.08),rgba(255,255,255,.03));box-shadow:inset 0 1.4px 0 rgba(255,255,255,.26),inset 0 -1.4px 0 rgba(255,255,255,.08);clip-path:polygon(16px 0,calc(100% - 16px) 0,100% 50%,calc(100% - 16px) 100%,16px 100%,0 50%);text-decoration:none;overflow:hidden}
.hvb-intent:hover{background:linear-gradient(150deg,rgba(255,255,255,.12),rgba(255,255,255,.05))}
.hvb-intent i.ic{font-size:26px;color:#C8AA6E}
.hvb-intent b{font:italic 700 20px 'GT Sectra Display',Georgia,serif;color:#F2F4FA;line-height:1.2}
.hvb-intent span{font:500 12px Inter;line-height:1.55;color:var(--muted)}
.hvb-intent em{position:absolute;right:-6px;bottom:-16px;font-style:normal;font-family:'Noto Serif KR',serif;font-size:64px;color:rgba(255,255,255,.045)}

.hvb-grid{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:9px;margin-top:8px}
.hvb-p{position:relative;aspect-ratio:1/1.3;overflow:hidden;clip-path:polygon(11px 0,calc(100% - 11px) 0,100% 50%,calc(100% - 11px) 100%,11px 100%,0 50%);text-decoration:none}
.hvb-p img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:brightness(.55) saturate(.9);transition:filter .25s,transform .35s}
.hvb-p:hover img{filter:brightness(.78);transform:scale(1.05)}
.hvb-p .ov{position:absolute;inset:0;z-index:2;display:flex;flex-direction:column;justify-content:flex-end;gap:2px;padding:11px 12px;background:linear-gradient(0deg,rgba(8,12,22,.85),transparent 62%)}
.hvb-p .ov b{font:600 12px Inter;color:#F2F4FA;line-height:1.2}
.hvb-p .ov span{font-family:'Noto Serif KR',serif;font-size:10.5px;color:rgba(255,255,255,.55)}
.hvb-p .nm{position:absolute;top:9px;left:11px;z-index:2;font:700 italic 12px 'Inter Tight',Inter,sans-serif;color:rgba(255,255,255,.5)}

.hvb-fams{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;margin-top:8px}
.hvb-fam{display:flex;flex-direction:column;gap:6px;padding:20px 20px;background:linear-gradient(150deg,rgba(255,255,255,.06),rgba(255,255,255,.022));box-shadow:inset 0 1.2px 0 rgba(255,255,255,.2),inset 0 -1.2px 0 rgba(255,255,255,.06);clip-path:polygon(13px 0,calc(100% - 13px) 0,100% 50%,calc(100% - 13px) 100%,13px 100%,0 50%);text-decoration:none}
.hvb-fam:hover{background:linear-gradient(150deg,rgba(255,255,255,.1),rgba(255,255,255,.04))}
.hvb-fam .n{font:700 italic 26px 'Inter Tight',Inter,sans-serif;color:#E4CE9B;line-height:1;font-variant-numeric:tabular-nums}
.hvb-fam b{font:600 14px Inter;color:#F2F4FA}
.hvb-fam span{font-family:'Noto Serif KR',serif;font-size:11.5px;color:var(--muted)}

.hvb-foot{display:flex;flex-wrap:wrap;gap:10px;margin-top:8px}
.hvb-foot a{flex:1;min-width:200px;display:flex;align-items:center;gap:12px;padding:14px 18px;background:rgba(255,255,255,.045);box-shadow:inset 0 1px 0 rgba(255,255,255,.16);clip-path:polygon(12px 0,calc(100% - 12px) 0,100% 50%,calc(100% - 12px) 100%,12px 100%,0 50%);text-decoration:none}
.hvb-foot a:hover{background:rgba(255,255,255,.08)}
.hvb-foot i{font-size:18px;color:#C8AA6E}
.hvb-foot b{font:600 13px Inter;color:#F2F4FA;display:block}
.hvb-foot span{font:500 11px Inter;color:var(--muted)}

/* ═══════════ C · Suivre la voie ═══════════ */
.hvc-ladder{display:flex;align-items:flex-end;gap:0;margin-top:22px;padding:0 2px}
.hvc-st{flex:1;display:flex;flex-direction:column;align-items:center;gap:9px;text-decoration:none;position:relative}
.hvc-st .bar{width:100%;height:9px;background:var(--c,rgba(255,255,255,.14));opacity:.42;transition:opacity .2s,height .2s}
.hvc-st .lb{font:600 9.5px Inter;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);white-space:nowrap}
.hvc-st.done .bar{opacity:.8}
.hvc-st.now .bar{height:20px;opacity:1;box-shadow:0 0 16px rgba(200,170,110,.45)}
.hvc-st.now .lb{color:#E4CE9B}
.hvc-st.now::after{content:'';position:absolute;top:-13px;left:50%;margin-left:-4px;width:8px;height:8px;transform:rotate(45deg);background:linear-gradient(180deg,#F0E6D2,#C8AA6E 45%,#785A28)}
.hvc-st+.hvc-st{margin-left:3px}
.hvc-st:hover .bar{opacity:1}

.hvc-head{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:36px;align-items:end;margin-top:40px}
.hvc-head .k{font:600 10px Inter;letter-spacing:.2em;text-transform:uppercase;color:var(--muted)}
.hvc-head h1{margin:12px 0 0;font-family:'GT Sectra Display',Georgia,serif;font-weight:700;font-style:italic;font-size:clamp(40px,5.6vw,72px);line-height:1;color:#F2F4FA}
.hvc-head h1 em{font-style:italic;color:#E4CE9B}
.hvc-head p{margin:14px 0 0;max-width:48ch;font:500 14.5px Inter;line-height:1.6;color:rgba(255,255,255,.7)}
.hvc-pct{text-align:right}
.hvc-pct .v{font:700 italic 62px 'Inter Tight',Inter,sans-serif;color:#E4CE9B;line-height:.9;font-variant-numeric:tabular-nums}
.hvc-pct .l{font:600 9.5px Inter;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);margin-top:8px}
.hvc-acts{display:flex;flex-wrap:wrap;gap:12px;margin-top:26px}

.hvc-cards{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr) minmax(0,1fr);gap:12px;margin-top:8px}
.hvc-card{position:relative;display:flex;flex-direction:column;padding:22px 24px;min-height:250px;background:linear-gradient(150deg,rgba(255,255,255,.075),rgba(255,255,255,.028));box-shadow:inset 0 1.4px 0 rgba(255,255,255,.24),inset 0 -1.4px 0 rgba(255,255,255,.08);clip-path:polygon(16px 0,calc(100% - 16px) 0,100% 50%,calc(100% - 16px) 100%,16px 100%,0 50%);text-decoration:none;overflow:hidden}
.hvc-card.img>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:brightness(.44)}
.hvc-card.img::after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,rgba(8,12,22,.9),rgba(8,12,22,.15))}
.hvc-card.img>*:not(img){position:relative;z-index:2}
.hvc-card .k{font:600 9.5px Inter;letter-spacing:.18em;text-transform:uppercase;color:#C8AA6E}
.hvc-card h3{margin:auto 0 0;font:italic 700 30px 'GT Sectra Display',Georgia,serif;color:#F2F4FA;line-height:1.05}
.hvc-card .ko{font-family:'Noto Serif KR',serif;font-size:14px;color:rgba(255,255,255,.55);margin-top:6px}
.hvc-card ul{list-style:none;margin:16px 0 0;padding:0;display:flex;flex-direction:column;gap:0}
.hvc-card li{display:flex;align-items:center;gap:11px;padding:9px 0;border-bottom:1px solid rgba(255,255,255,.07);font:500 13px Inter;color:rgba(255,255,255,.85)}
.hvc-card li:last-child{border-bottom:0}
.hvc-card li s{flex:0 0 5px;width:5px;height:5px;transform:rotate(45deg);background:rgba(200,170,110,.8);text-decoration:none}
.hvc-card li em{margin-left:auto;font-style:normal;font-family:'Noto Serif KR',serif;font-size:11.5px;color:var(--muted)}
.hvc-card .go{margin-top:auto;padding-top:16px;font:600 10px Inter;letter-spacing:.14em;text-transform:uppercase;color:#C8AA6E;display:inline-flex;align-items:center;gap:7px}
.hvc-card:hover .go{color:#F0E6D2}

.hvc-next{display:flex;align-items:center;gap:22px;margin-top:8px;padding:20px 26px;background:rgba(255,255,255,.035);box-shadow:inset 0 1px 0 rgba(255,255,255,.14);clip-path:polygon(15px 0,calc(100% - 15px) 0,100% 50%,calc(100% - 15px) 100%,15px 100%,0 50%);text-decoration:none}
.hvc-next .dm{width:12px;height:12px;transform:rotate(45deg);border:1px solid rgba(255,255,255,.35)}
.hvc-next .tx b{display:block;font:italic 700 18px 'GT Sectra Display',Georgia,serif;color:#F2F4FA}
.hvc-next .tx span{font:500 12px Inter;color:var(--muted)}
.hvc-next .go{margin-left:auto;font:600 10px Inter;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}

/* choix de ceinture (visiteur sans grade) */
.hvc-pick{display:flex;flex-wrap:wrap;gap:8px;margin-top:20px}
.hvc-pick button{display:flex;align-items:center;gap:9px;padding:10px 16px;font:600 12px Inter;color:rgba(255,255,255,.82);background:rgba(255,255,255,.055);box-shadow:inset 0 1px 0 rgba(255,255,255,.16);clip-path:polygon(10px 0,calc(100% - 10px) 0,100% 50%,calc(100% - 10px) 100%,10px 100%,0 50%);border:0;cursor:pointer}
.hvc-pick button:hover{background:rgba(255,255,255,.1)}
.hvc-pick button s{width:16px;height:7px;background:var(--c);text-decoration:none}

/* ───────── responsive ───────── */
@media (max-width:1100px){
  .hvb-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
  .hvb-fams{grid-template-columns:repeat(3,minmax(0,1fr))}
  .hvc-cards{grid-template-columns:1fr 1fr}
}
@media (max-width:860px){
  .hva-hero{grid-template-columns:1fr}
  .hva-shot{aspect-ratio:16/10;order:-1}
  .hva-nums{grid-template-columns:1fr}
  .hvb-head{padding-top:clamp(28px,5vh,52px)}
  .hvb-intents{grid-template-columns:1fr;margin-top:clamp(44px,7vh,72px)}
  .hvb-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .hvb-fams{grid-template-columns:1fr 1fr}
  .hvc-cards{grid-template-columns:1fr}
  .hvc-head{grid-template-columns:1fr}
  .hvc-pct{text-align:left}
  .hvc-ladder{overflow-x:auto;padding-bottom:8px}
  .hvc-st{min-width:56px}
}

/* ligne « grade de démonstration » (C, visiteur sans grade réel) */
.hvc-demo{display:flex;align-items:center;gap:10px;margin-top:14px;font:500 11.5px Inter;color:var(--muted)}
.hvc-demo button{border:0;background:none;padding:0;font:600 10px Inter;letter-spacing:.14em;text-transform:uppercase;color:#C8AA6E;cursor:pointer;border-bottom:1px solid rgba(200,170,110,.45)}
.hvc-demo button:hover{color:#F0E6D2}
.hvc-ladder{margin-top:34px}
.hvc-ask{grid-template-columns:1fr;margin-top:30px}

/* glass-site.css habille TOUS les input (fond .05 + bordure) : ici le contour
   est déjà porté par le cadre doré, l'input doit être nu. */
/* glass-site.css cible input:not(...):not(...):not(...) : spécificité (0,3,1) et
   !important. Il faut donc passer AU-DESSUS, pas seulement après. */
.gk-v3-home .hvb-search .hvb-field input[type="search"]{-webkit-appearance:none;appearance:none;background:transparent!important;border:0!important;border-radius:0!important;box-shadow:none!important;padding:0!important;height:auto!important;font:500 16px Inter!important;color:#F2F4FA!important}
.hvb-field input::-webkit-search-decoration,
.hvb-field input::-webkit-search-cancel-button{-webkit-appearance:none;appearance:none}
