/* FEUILLE DÉRIVÉE — ne pas modifier à la main (PRODUIT, 10/11/2026 ; GO LEAD 17:3x, gabarit des pages outils).
   Écrite par tools/produit-gabarit-outil/poser.mjs depuis les feuilles que charge site/handoff-v4/index.html : seules les règles écrites sur
   #handoff (le hero du gabarit), réécrites sur #intro (le hero des pages posées). Les autres règles du gabarit
   s'appliquent déjà telles quelles : les pages posées chargent les mêmes feuilles. --check rougit si cette feuille dérive. */
/* ── depuis /handoff-v4/layout-2348.css ── */
.hf3>#intro{scroll-margin-top:var(--header)}
/* ── depuis /handoff-v4/hero-0114.css ── */
#intro{height:auto;min-height:0;overflow:visible}
#intro .hero-grid{height:auto;display:block;padding:32px 0 28px}
#intro .hero-copy{text-align:center;max-width:940px;margin:0 auto}
#intro .tool-label{display:flex;align-items:center;justify-content:center;gap:10px;font:600 24px/1.3 DM,Arial,sans-serif;color:var(--blue);margin:0 0 18px}
#intro .tool-label svg{width:26px;height:26px;flex:0 0 auto}
#intro .tool-label .uck-pastille svg{width:22px;height:22px}
#intro .hero-title{font:700 64px/1.1 Jakarta,Arial,sans-serif;letter-spacing:-.05em;max-width:20ch;color:var(--blue);margin:0 auto 22px}
#intro .lede{font-size:18px;line-height:1.55;max-width:67ch;margin:0 auto 24px}
#intro .hero-action{display:flex;flex-direction:column;align-items:center;gap:12px}
#intro .hero-action .allowance{font-size:12px;line-height:1.5;max-width:none}
@media(max-width:1000px) and (min-width:761px){
  #intro .hero-title{font-size:54px}
  #intro .lede{font-size:17px}
}
@media(max-width:760px){
  #intro .hero-grid{padding:24px 0 24px}
  #intro .tool-label{font-size:20px;gap:8px;margin-bottom:16px}
  #intro .tool-label svg{width:23px;height:23px}
  #intro .hero-title{font-size:38px;line-height:1.13;max-width:18ch;margin-bottom:18px}
  #intro .lede{font-size:15px;line-height:1.55;max-width:36ch;margin-bottom:22px}
  #intro .hero-action{gap:12px}
  #intro .hero-action .allowance{font-size:12px;max-width:32ch}
}
/* ── depuis /handoff-v4/refonte-1110.css ── */
.hf3 #intro .hero-action .button{transition:background-color .2s ease,transform .2s ease,box-shadow .2s ease;box-shadow:0 10px 22px -16px #4458acee}
.hf3 #intro .hero-action .button span{transition:transform .2s ease}
.hf3 #intro .hero-action .button:hover{background:var(--hr-blue-d);transform:translateY(-2px);box-shadow:0 18px 30px -16px #4458acf2}
.hf3 #intro .hero-action .button:hover span{transform:translate(2px,-2px)}
.hf3 #intro .hero-action .button:focus-visible{outline:3px solid var(--hr-blue);outline-offset:4px}
@media (prefers-reduced-motion:reduce){
  .hf3 #intro .hero-action .button,.hf3 #intro .hero-action .button span{transition:none}
  .hf3 #intro .hero-action .button:hover{transform:none}
  .hf3 #intro .hero-action .button:hover span{transform:none}
}
/* ── depuis site/handoff-v4/index.html <style id="site-v1-handoff-mobile-cta"> ── */
@media (max-width: 760px){
  #intro .hero-grid{padding-block: 14px 20px;}
  #intro .tool-label{margin-bottom: 8px;}
  #intro .hero-title{max-width: none;
    margin-bottom: 12px;
    font-size: 33px;
    line-height: 1.1;}
  #intro .lede{margin-bottom: 14px;}
}