/* ---------- Polices de la référence ----------
     Spartan pour les titres (fichiers du modèle Educeet, assets/fonts) et
     Open Sans pour le texte, comme --it-ff-heading / --it-ff-body de la
     référence. Open Sans est le fichier variable 300 à 800 de
     @fontsource-variable/open-sans 5.3.0 (SIL OFL 1.1), auto-hébergé comme
     Roboto : la référence le chargeait depuis Google Fonts, que ce site
     s'interdit.
     La famille s'appelle « Open Sans UI » et non « Open Sans » : les modèles
     de CV déclarent déjà une « Open Sans » (400/700, avec les .woff que
     js/export-pdf-apercu.js incorpore au PDF). Deux familles de même nom
     mêleraient les fichiers de l'interface à ceux du document. */
  @font-face{font-family:'Spartan';font-style:normal;font-weight:400;font-display:swap;src:url('../libs/fonts/spartan-regular.woff2') format('woff2');}
  @font-face{font-family:'Spartan';font-style:normal;font-weight:500;font-display:swap;src:url('../libs/fonts/spartan-medium.woff2') format('woff2');}
  @font-face{font-family:'Spartan';font-style:normal;font-weight:600;font-display:swap;src:url('../libs/fonts/spartan-semibold.woff2') format('woff2');}
  @font-face{font-family:'Spartan';font-style:normal;font-weight:700;font-display:swap;src:url('../libs/fonts/spartan-bold.woff2') format('woff2');}
  @font-face{font-family:'Open Sans UI';font-style:normal;font-weight:300 800;font-display:swap;src:url('../libs/fonts/open-sans-latin-wght-normal.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
  @font-face{font-family:'Open Sans UI';font-style:normal;font-weight:300 800;font-display:swap;src:url('../libs/fonts/open-sans-latin-ext-wght-normal.woff2') format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
  @font-face{font-family:'Open Sans UI';font-style:italic;font-weight:300 800;font-display:swap;src:url('../libs/fonts/open-sans-latin-wght-italic.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
  @font-face{font-family:'Open Sans UI';font-style:italic;font-weight:300 800;font-display:swap;src:url('../libs/fonts/open-sans-latin-ext-wght-italic.woff2') format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
  :root{
    /* Texte de l'interface (remplace Roboto) et titres (Spartan). Le
       document garde --doc-sans / --doc-serif et les polices des modèles. */
    --ui-sans:'Open Sans UI',system-ui,-apple-system,'Segoe UI',sans-serif;
    --da-heading:'Spartan','League Spartan',system-ui,sans-serif;
  }

  /* =====================================================================
     Direction artistique de la référence, étendue à toute l'application :
     Mon CV (éditeur et page de choix des modèles), Test ATS, Lettre de
     motivation, en-tête et navigation.
     Seul l'habillage change : aucun champ, aucun identifiant, rien de ce que
     lisent les scripts. Le DOCUMENT (aperçu du CV, page de la lettre) n'est
     pas touché : il doit rester identique au PDF exporté.
     css/ats.css est chargé à la demande, après ce fichier : ses règles sont
     donc surpassées par spécificité (#atsSection), pas par l'ordre.
     ===================================================================== */

  /* ---------- En-tête et navigation ---------- */
  .brandbar h1{font-family:var(--da-heading);font-weight:700;letter-spacing:-.01em;}
  .app-nav button{font-family:var(--ui-sans);font-size:13.5px;font-weight:500;letter-spacing:0;}

  /* ---------- Boutons : casse normale, Roboto, comme la référence ----------
     La chasse fixe en capitales espacées était la signature de l'ancienne
     interface ; la référence emploie une sans-serif en casse normale. */
  .btn{
    font-family:var(--ui-sans);font-size:13.5px;font-weight:600;letter-spacing:0;text-transform:none;
    border-radius:8px;
  }
  .btn.primary:hover{background:var(--grad-2);opacity:1;}
  /* Les boutons d'action forts du parcours passent au doré. */
  #dlToggle.btn.primary,
  #atsSection .ats-drop-btn.btn.primary{background:var(--gold);border-color:var(--gold);color:#12203a;}
  #dlToggle.btn.primary:hover{background:#e6ad62;color:#12203a;}

  /* ---------- Cartes du formulaire (éditeur, lettre) ----------
     Titre en League Spartan, casse normale ; le liseré bleu pleine largeur
     devient un court trait doré, comme sur les cartes de cours de la référence. */
  .section h2{
    font-family:var(--da-heading);font-size:17px;font-weight:700;
    text-transform:none;letter-spacing:-.005em;color:var(--ink);margin-bottom:16px;
  }
  .section::before{right:auto;left:20px;width:48px;height:3px;border-radius:0 0 3px 3px;background:var(--gold);opacity:1;}
  .section:hover{border-color:rgba(217,155,74,.55);}
  label{
    font-family:var(--ui-sans);font-size:12.5px;font-weight:500;text-transform:none;letter-spacing:0;
    color:var(--ink-2);
  }
  input[type=text]:focus,input[type=email]:focus,input[type=tel]:focus,input[type=url]:focus,
  input[type=month]:focus,textarea:focus,select:focus{border-color:var(--gold);box-shadow:0 0 0 3px var(--gold-soft);}

  /* ---------- Étapes du CV (Remplir, Modèle, Télécharger) ---------- */
  .cv-step-name{font-family:var(--da-heading);font-weight:700;}

  /* ---------- En-têtes de page : étiquette + titre + pinceau ---------- */
  .da-head{margin:0 0 30px;}
  .da-pill,
  #atsSection .ats-kicker,
  .tpl-chooser-kicker{
    display:inline-block;margin:0 0 14px;padding:4px 16px;border-radius:99px;
    font-family:var(--ui-sans);font-size:13px;font-weight:500;letter-spacing:0;text-transform:none;
    color:var(--brand-ink);background:rgba(27,58,92,.07);border:1px solid rgba(27,58,92,.22);
  }
  .da-title,
  #atsSection .ats-head h2,
  .tpl-chooser-title{
    font-family:var(--da-heading);font-weight:700;letter-spacing:-.015em;line-height:1.12;
    color:var(--ink);text-wrap:balance;
  }
  .da-title,#atsSection .ats-head h2{font-size:44px;margin:0 0 14px;}
  .tpl-chooser-title{font-size:36px;}
  .da-lede{margin:0;max-width:44em;font-size:15px;line-height:1.65;color:var(--muted);}
  @media (max-width: 900px){
    .da-title,#atsSection .ats-head h2{font-size:32px;}
    .tpl-chooser-title{font-size:28px;}
  }
  @media (max-width: 600px){
    .da-title,#atsSection .ats-head h2{font-size:27px;}
    .tpl-chooser-title{font-size:24px;}
  }
  :root[data-theme="dark"] :is(.da-pill,#atsSection .ats-kicker,.tpl-chooser-kicker){background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.22);}
  @media (prefers-color-scheme: dark){
    :root:not([data-theme="light"]) :is(.da-pill,#atsSection .ats-kicker,.tpl-chooser-kicker){background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.22);}
  }

  /* ---------- Test ATS ---------- */
  #atsSection .ats-drop{border-radius:16px;border-width:2px;transition:border-color .2s ease,background-color .2s ease,transform .25s ease,box-shadow .25s ease;}
  #atsSection .ats-drop:hover{border-color:var(--gold);transform:translateY(-3px);box-shadow:0 16px 32px rgba(18,42,64,.1);}
  #atsSection .ats-layers{border-radius:16px;}
  #atsSection .ats-layers-title{font-family:var(--da-heading);font-size:17px;font-weight:700;text-transform:none;letter-spacing:0;color:var(--ink);}
  #atsSection .ats-layer-n{font-family:var(--da-heading);font-weight:700;color:var(--gold-ink);}
  #atsSection .ats-layer-txt b,#atsSection .ats-layer-txt strong{font-family:var(--da-heading);font-size:15.5px;}
  #atsSection .ats-layer{transition:transform .25s ease;}
  #atsSection .ats-layer:hover{transform:translateX(4px);}
  #atsSection .ats-layer:hover .ats-layer-ic{animation:rxIconBounce .8s 1;}
  #atsSection .ats-job summary{font-family:var(--da-heading);font-weight:700;font-size:15px;}

  /* ---------- Lettre ---------- */
  #letterSection .da-head{max-width:1040px;margin-inline:auto;}

  /* ---------- Page de choix des modèles ---------- */
  .tpl-card{border-radius:16px;transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease;}
  .tpl-card:hover{border-color:var(--gold);transform:translateY(-4px);box-shadow:0 18px 36px rgba(18,42,64,.12);}
  .tpl-card.active{border-color:var(--gold);box-shadow:0 0 0 3px var(--gold-soft);}
  .tpl-card h3,.tpl-card-name{font-family:var(--da-heading);}

  /* ---------- Apparitions au défilement hors accueil ----------
     Même mécanique que l'accueil (js/accueil-anim.js), plus discrète : un
     fondu court, pour ne pas gêner quelqu'un qui travaille. */
  .rx-anim .rv-soft{opacity:0;}
  .rx-anim .rv-soft.is-in{animation:rxUp .7s cubic-bezier(.2,.7,.2,1) var(--rv-delay,0s) both;}

  /* ---------- Libellés d'interface : Roboto au lieu de la chasse fixe ----------
     La chasse fixe ne reste que là où elle sert : codes couleur, pourcentage
     du zoom, filigrane de l'aperçu, compteurs. */
  .brandbar .tag,
  .mode-toggle button,.lang-toggle button,.view-tabs button,
  .color-target-select,.cp-btn,.add-btn,.sel-clear,
  .paywall-badge,.photo-row .ph,.pm-preview,.privacy-title,
  .home-link-btn,.examples > summary{
    font-family:var(--ui-sans);letter-spacing:0;
  }
  .mode-toggle button,.lang-toggle button,.view-tabs button,.add-btn,.home-link-btn,.cp-btn{
    text-transform:none;font-size:13px;font-weight:600;
  }
  .pt-label{font-family:var(--ui-sans);font-weight:600;letter-spacing:.06em;}
  .paywall-badge{font-size:12px;font-weight:600;}
  .home-eyebrow{font-family:var(--ui-sans);font-size:13px;font-weight:600;letter-spacing:0;text-transform:none;padding:5px 14px;}
  .home-soon-tag,.nav-soon{font-family:var(--ui-sans);font-weight:700;}

  /* Retour en haut : totalement retiré quand il n'est pas affiché. */
  .rx-top:not(.open){visibility:hidden;transition:bottom .6s cubic-bezier(.2,.7,.2,1),visibility 0s .6s;}
  /* Spartan est plus large que Roboto : titres de page un peu moins grands. */
  .da-title,#atsSection .ats-head h2{font-size:42px;}
  #atsSection .ats-head h2{max-width:none;}
  @media (max-width: 900px){ .da-title,#atsSection .ats-head h2{font-size:31px;} }
  @media (max-width: 600px){ .da-title,#atsSection .ats-head h2{font-size:26px;} }

  /* Nom de marque JobCV : « CV » en or, comme la plume du logo. --gold-ink
     sur fond clair (contraste suffisant), éclairci en mode sombre. */
  .brand-cv{color:var(--gold-ink);}
  .rx-loader-brand .brand-cv,.rx-footer-brand .brand-cv{color:var(--gold-ink);}