/* GoFactoX : de la charge à l'apaisement.
   Feuille commune du site (accueil, guides, pages légales, 404).
   Police : Onest (SIL OFL 1.1, voir fonts/LICENSE-onest.txt), auto-hébergée ; le fichier latin est préchargé dans chaque page.
   Jetons : repli hex, puis OKLCH quand le navigateur le comprend. Mouvement : transform, opacity, clip-path seulement. */

@font-face{font-family:"Onest";src:url(fonts/onest-latin-wght-normal.woff2) format("woff2");font-weight:100 900;font-style:normal;font-display:swap;
  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:"Onest";src:url(fonts/onest-latin-ext-wght-normal.woff2) format("woff2");font-weight:100 900;font-style:normal;font-display:swap;
  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{
  --champ:#5ED2D6; --haut-fond:#A0E6E8; --encre:#052A35; --ardoise:#3B5E6A; --courant:#19484A;
  --lagon:#006B6F; --lagon-p:#005D60; --algue:#BFEDEA; --soleil:#F9D869; --soleil-levant:#F1B638;
  --ecume:#F0FCFB; --eau:#CFF6F5; --eau-2:#BBECED; --filet:#DCE7EA; --blanc:#FFFFFF;
  --nuit:#052A35; --nuit-2:#0B3642; --nuit-3:#144143; --nuit-txt:#E6F1F1; --nuit-mut:#86CCCE;
  --ombre:5 42 53;
  --sh-1:0 1px 1px rgb(var(--ombre)/.06),0 2px 2px rgb(var(--ombre)/.05),0 4px 4px rgb(var(--ombre)/.05);
  --sh-2:0 1px 1px rgb(var(--ombre)/.05),0 2px 2px rgb(var(--ombre)/.05),0 4px 4px rgb(var(--ombre)/.05),0 8px 8px rgb(var(--ombre)/.05),0 16px 16px rgb(var(--ombre)/.06),0 32px 32px rgb(var(--ombre)/.07);
  --sh-3:0 2px 2px rgb(var(--ombre)/.07),0 4px 4px rgb(var(--ombre)/.07),0 8px 8px rgb(var(--ombre)/.07),0 16px 16px rgb(var(--ombre)/.08),0 32px 32px rgb(var(--ombre)/.1),0 48px 64px rgb(var(--ombre)/.12);
  --ease:cubic-bezier(0.2,0,0,1);
  --t-press:140ms; --t-1:200ms; --t-2:320ms; --t-3:480ms;
  --r-s:10px; --r-m:16px; --r-l:24px;
  --gutter:clamp(16px,4vw,40px); --maxw:1200px;
  --sec:clamp(72px,9vw,124px);
  --font:"Onest",ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
  --mono:ui-monospace,SFMono-Regular,Menlo,Consolas,"Liberation Mono",monospace;
  color-scheme:light;
}
@supports (color:oklch(0 0 0)){
  :root{
    --champ:oklch(79.9% .104 198); --haut-fond:oklch(88% .07 198); --encre:oklch(26.6% .045 222); --ardoise:oklch(46% .045 222); --courant:oklch(37% .05 200);
    --lagon:oklch(47.9% .082 199); --lagon-p:oklch(43% .08 199); --algue:oklch(90.1% .05 188); --soleil:oklch(88.9% .135 93); --soleil-levant:oklch(81% .15 82);
    --ecume:oklch(98.2% .013 191); --eau:oklch(94.5% .04 195); --eau-2:oklch(91% .05 198); --filet:oklch(92% .012 215);
    --nuit:oklch(26.6% .045 222); --nuit-2:oklch(30.5% .045 218); --nuit-3:oklch(34.5% .048 200); --nuit-txt:oklch(95.2% .01 196); --nuit-mut:oklch(80% .07 198);
  }
}

/* ---------- Base ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:88px;background:var(--blanc)}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--blanc);color:var(--encre);font:400 1.0625rem/1.6 var(--font);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility;caret-color:var(--lagon);overflow-x:clip}
::selection{background:var(--soleil);color:var(--encre)}
img,svg{display:block;max-width:100%}
img{height:auto}
a{color:var(--lagon);text-decoration-thickness:1.5px;text-underline-offset:.22em}
@media (hover:hover) and (pointer:fine){a:hover{color:var(--lagon-p);text-decoration-thickness:2px}}
:focus-visible{outline:3px solid var(--lagon);outline-offset:3px;border-radius:6px}
.sec-nuit :focus-visible{outline-color:var(--soleil)}
h1,h2,h3,h4{margin:0;text-wrap:balance;font-weight:720;color:inherit}
p{margin:0;text-wrap:pretty}
ul,ol{margin:0;padding:0}
sup{font-size:.62em;line-height:0;vertical-align:.55em}
small{font-size:inherit}
.sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;margin:-1px;padding:0;border:0}
.nw{white-space:nowrap}
.sprite{position:absolute;width:0;height:0;overflow:hidden}
.ico{width:1.15em;height:1.15em;flex:none;fill:currentColor}
.sym .i{fill:var(--encre)}.sym .s{fill:var(--sun-logo,var(--soleil-levant))}
code{font:500 .88em/1.4 var(--mono);background:var(--eau);color:var(--encre);padding:.08em .35em;border-radius:5px}
.muted{color:var(--ardoise)}
.wrap{width:100%;max-width:calc(var(--maxw) + 2 * var(--gutter));margin-inline:auto;padding-inline:var(--gutter)}
/* lien d'évitement : caché au-dessus de la page quelle que soit sa hauteur (texte agrandi compris) */
.skip{position:absolute;left:12px;bottom:calc(100% + 8px);z-index:100;background:var(--encre);color:var(--blanc);padding:10px 16px;border-radius:999px;text-decoration:none;font-weight:650}
.skip:focus{top:12px;bottom:auto}
#contenu:focus{outline:none}
html{scrollbar-color:var(--haut-fond) transparent}

/* ---------- Boutons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.55em;min-height:48px;padding:.8em 1.45em;border-radius:999px;border:0;font:650 1rem/1.15 var(--font);letter-spacing:-.005em;text-decoration:none;cursor:pointer;white-space:nowrap;transition:transform var(--t-press) var(--ease)}
.btn:active{transform:scale(.97)}
.btn-ink{background:var(--encre);color:var(--blanc)}
.btn-lg{min-height:56px;padding:1em 1.7em;font-size:1.0625rem}
.btn-line{background:var(--blanc);color:var(--lagon);box-shadow:inset 0 0 0 2px var(--lagon)}
.btn-sun{background:var(--soleil);color:var(--encre)}
@media (hover:hover) and (pointer:fine){
  .btn{transition:transform var(--t-1) var(--ease)}
  .btn:hover{transform:translateY(-2px)}
  .btn:active{transform:scale(.97);transition-duration:var(--t-press)}
  .btn-ink:hover{background:var(--nuit-2);color:var(--blanc)}
  .btn-line:hover{background:var(--ecume);color:var(--lagon-p)}
  .btn-sun:hover{background:#FBE08A;color:var(--encre)}
}
.link-cta{display:inline-flex;align-items:center;gap:.4em;font-weight:650;color:var(--encre);text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:.3em}
.link-cta .ico{transition:transform var(--t-1) var(--ease)}
@media (hover:hover) and (pointer:fine){.link-cta:hover{color:var(--encre)}.link-cta:hover .ico{transform:translateX(3px)}}

/* ---------- En-tête ---------- */
.site-head{position:sticky;top:0;z-index:50;background:var(--head-bg,var(--blanc));isolation:isolate}
.page-home .site-head{--head-bg:var(--champ)}
.site-head::before{content:"";position:absolute;inset:0;z-index:-1;background:var(--blanc);opacity:0;transition:opacity var(--t-2) var(--ease)}
.site-head::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--filet);opacity:0;transition:opacity var(--t-2) var(--ease)}
.site-head.is-stuck::before,.site-head.is-stuck::after{opacity:1}
.page-text .site-head::after{opacity:1}
.head-in{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:8px clamp(16px,3vw,36px);min-height:76px;padding-block:6px}
/* texte agrandi (jusqu'à 200 %) : ce qui ne tient plus passe à la ligne, calé à droite, au lieu de sortir de l'écran */
.brand{display:inline-flex;color:var(--encre);border-radius:8px;flex:none}
.head-in>.brand{margin-right:auto}
.lockup{height:34px;width:auto}
.lockup .i{fill:currentColor}.lockup .s{fill:var(--sun-logo,var(--soleil-levant))}
/* sur le champ, le soleil jaune ne tient que par la teinte (1,29:1) : un liseré encre de 2 px, quelle que soit la taille, le dessine */
.lockup .r,.sym .r{fill:none;stroke:var(--encre);stroke-width:2px;vector-effect:non-scaling-stroke;stroke-linejoin:round;opacity:var(--ring,0);transition:opacity var(--t-2) var(--ease)}
.hero,.install,.site-foot,.page-home .site-head:not(.is-stuck),.page-404 .site-head{--sun-logo:var(--soleil);--ring:1}
.sec-nuit,.plan-pro{--ring:0}
/* petit plaisir : au survol du logo, son soleil se lève de 3 unités (sur 64) */
@media (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
  .brand .lockup .s,.brand .lockup .r{transition:transform var(--t-2) var(--ease),opacity var(--t-2) var(--ease)}
  .brand:hover .lockup .s,.brand:hover .lockup .r{transform:translateY(-3px)}
}
.nav{display:flex;gap:clamp(18px,2.4vw,32px);margin-left:auto;font-weight:550;font-size:1rem}
.nav a{position:relative;color:var(--encre);text-decoration:none;padding:6px 2px}
.nav a::after{content:"";position:absolute;left:2px;right:2px;bottom:1px;height:2px;border-radius:2px;background:var(--encre);transform:scaleX(0);transform-origin:0 50%;transition:transform var(--t-1) var(--ease)}
@media (hover:hover) and (pointer:fine){.nav a:hover{color:var(--encre)}.nav a:hover::after{transform:none}}
.btn-head{position:relative;min-height:44px;padding:.65em 1.2em;font-size:.95rem}
.btn-head .sm{display:none}
.menu{display:none;position:relative}
.menu summary{list-style:none;display:grid;place-items:center;width:44px;height:44px;border-radius:999px;cursor:pointer;color:var(--encre);background:rgb(255 255 255/.55)}
.menu summary::-webkit-details-marker{display:none}
.menu .ico{width:22px;height:22px}
.menu:not([open]) .menu-panel{display:none}
.menu-panel{position:absolute;right:0;top:calc(100% + 10px);min-width:220px;display:grid;padding:8px;background:var(--blanc);border-radius:var(--r-m);box-shadow:var(--sh-3)}
.menu-panel a{padding:12px 14px;border-radius:10px;color:var(--encre);text-decoration:none;font-weight:600}
.menu-panel a:active{background:var(--ecume)}
@media (max-width:900px){
  .nav{display:none}
  .menu{display:block}
  .btn-head{margin-left:auto}
}
/* libellé court jusqu'à 500 px (le long ne tient qu'à partir de 500 px) ; le long reste lu par les lecteurs d'écran, le court est aria-hidden */
@media (max-width:500px){
  .btn-head .lg{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.btn-head .sm{display:inline}
}
@media (max-width:440px){
  .lockup{height:28px}
  .head-in{gap:10px;min-height:66px}
}
/* très petits écrans (320 px) : logo, bouton et menu tiennent sur la ligne */
@media (max-width:350px){.site-head .lockup{height:24px}.btn-head{padding-inline:1em}}

/* ---------- Hero ---------- */
.hero{background:var(--champ);color:var(--encre);padding:clamp(20px,3vw,40px) 0 clamp(40px,5vw,64px);position:relative}
.hero-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.04fr);gap:clamp(32px,5vw,72px);align-items:center}
.hero h1{font-size:clamp(3rem,1.7rem + 4.1vw,5rem);line-height:.98;letter-spacing:-.04em;font-weight:730}
.h1-a{display:block;font-size:max(1.5rem,.4em);line-height:1.2;letter-spacing:-.022em;font-weight:700;margin-bottom:.32em;max-width:19em}
.h1-b{display:block}
.h1-sun{position:relative;white-space:nowrap;display:inline-block}
.h1-sun::after{content:"";position:absolute;left:.02em;right:.32em;bottom:-.02em;height:.13em;border-radius:999px;background:var(--soleil)}
.hero-lead{margin-top:clamp(20px,2.4vw,28px);font-size:clamp(1.125rem,1rem + .4vw,1.3rem);line-height:1.5;color:var(--courant);max-width:34em}
.cta-row{display:flex;flex-wrap:wrap;align-items:center;gap:14px 28px;margin-top:clamp(26px,3vw,36px)}
.deadline{display:flex;gap:12px;align-items:flex-start;margin-top:clamp(28px,3.4vw,40px);padding-top:20px;border-top:2px solid rgb(5 42 53/.14);max-width:34em;font-size:.97rem;line-height:1.5;color:var(--encre)}
.deadline .ico{width:26px;height:26px;color:var(--encre);margin-top:-1px}
.deadline a{color:var(--encre);font-weight:600;white-space:nowrap}
.hero-fig{margin:0}

/* scène du hero : le symbole devenu paysage. Ciel libre (le soleil entier), horizon = ruban des statuts, mer = lignes du symbole */
.scene{position:relative;container-type:inline-size}
.sc-hero{display:grid;width:100%}
.sh-skyrow{position:relative;display:grid;grid-template-columns:minmax(0,48cqw) 1fr;padding:1cqw 0 3cqw}
.sh-sky{position:absolute;left:0;right:0;top:-2cqw;bottom:-6cqw;overflow:hidden;pointer-events:none}
.sh-sun{position:absolute;right:1cqw;bottom:9cqw;width:54cqw;aspect-ratio:2/1;border-radius:999px 999px 0 0;background:var(--soleil)}
.sh-col{position:relative;z-index:2;display:grid;align-content:start;justify-items:stretch}
.ui-card{position:absolute;background:var(--blanc);border-radius:clamp(12px,2.6cqw,18px);box-shadow:var(--sh-2);color:var(--encre)}
.uc-top{display:flex;justify-content:space-between;align-items:flex-start;gap:8px}
.uc-title{display:block;font-size:max(12.5px,2.6cqw);font-weight:680;letter-spacing:-.01em;line-height:1.25}
.uc-top small{display:block;font-size:max(11px,2.05cqw);color:var(--ardoise);margin-top:2px}
.chip{display:inline-flex;align-items:center;gap:5px;font-size:max(11px,1.95cqw);font-weight:650;line-height:1;padding:.5em .85em;border-radius:999px;white-space:nowrap}
.chip-ok{background:#D6F3E6;color:#0B5A3C}
.chip-wait{background:#EDF1F2;color:var(--ardoise)}
.chip-fx{background:var(--eau);color:var(--lagon-p)}
.swap{display:grid}.swap>*{grid-area:1/1;justify-self:end}
.swap .chip-wait{opacity:0}
.sh-order{position:relative;z-index:2;padding:3.2cqw 3.4cqw 3cqw}
.uc-lines{list-style:none;margin:2.4cqw 0 0;display:grid;gap:1.2cqw;font-size:max(11px,2.08cqw);color:var(--ardoise)}
.uc-lines li{display:flex;justify-content:space-between;gap:10px}
.uc-lines span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.uc-lines b{font-weight:550;color:var(--encre);font-variant-numeric:tabular-nums;white-space:nowrap}
.uc-total{display:flex;justify-content:space-between;align-items:baseline;margin-top:2cqw;padding-top:1.8cqw;border-top:1px solid var(--filet);font-size:max(11px,2.1cqw);color:var(--ardoise)}
.uc-total b{font-size:max(14px,2.9cqw);color:var(--encre);font-weight:720;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
/* la facture sort de dessous la commande (translateY dans une fenêtre qui coupe) : un tiers du visuel au plus */
.sh-inv-clip{position:relative;z-index:1;margin:-3cqw -3cqw 0;padding:3cqw 5cqw 4cqw;overflow:hidden}
.sh-inv{display:flex;align-items:center;gap:1.4cqw;padding:2.1cqw 2.6cqw;background:var(--blanc);border-radius:0 0 max(10px,2.2cqw) max(10px,2.2cqw);box-shadow:var(--sh-1);font-size:max(11.5px,2.2cqw)}
.sh-inv b{font-weight:650;white-space:nowrap;letter-spacing:-.005em}
.sh-inv .ico{width:1.25em;height:1.25em;color:var(--lagon)}
.sh-inv .chip{margin-left:auto}
.sk{display:block;height:max(7px,1.3cqw);border-radius:999px;background:#E6F0F1;margin-top:1.6cqw}
.sk:first-of-type{margin-top:2.6cqw}
.sk-b{width:68%}
.sh-toast{justify-self:start;display:inline-flex;align-items:center;gap:1.6cqw;margin-top:-1.4cqw;padding:1.8cqw 2.6cqw;border-radius:999px;background:var(--encre);color:var(--blanc);font-size:max(11px,2.1cqw);font-weight:600;white-space:nowrap;box-shadow:var(--sh-2)}
.sh-toast i{flex:none;width:max(8px,1.5cqw);aspect-ratio:1;border-radius:50%;background:var(--soleil)}
.sh-ribbon{position:relative;z-index:3;height:12cqw;list-style:none;display:flex;align-items:center;padding:0 3.6cqw;background:var(--blanc);border-radius:999px;box-shadow:var(--sh-2)}
.st{display:flex;align-items:center;gap:1.4cqw;font-size:max(11px,2.25cqw);font-weight:650;white-space:nowrap;letter-spacing:-.005em}
.rb{flex:1;height:max(3px,.55cqw);margin:0 1.8cqw;border-radius:999px;background:var(--eau);overflow:hidden;list-style:none}
.rb i{display:block;height:100%;background:var(--lagon);transform-origin:0 50%}
.dot{position:relative;display:grid;place-items:center;width:max(20px,4.6cqw);aspect-ratio:1;border-radius:50%;background:var(--ecume);box-shadow:inset 0 0 0 2px var(--eau)}
.dot .on{position:absolute;inset:0;display:grid;place-items:center;border-radius:50%;background:var(--lagon);color:var(--blanc)}
.dot .ico{width:62%;height:62%}
.st-sun .dot .on{background:var(--soleil);color:var(--encre)}
.st-sun .dot .ico{width:70%;height:70%}
/* la mer : les deux lignes du symbole (libellé et montant), à ses proportions exactes, en encre */
.sh-sea{position:relative;height:16cqw}
.sh-sea i{position:absolute;height:2.6cqw;border-radius:999px;background:var(--lagon);opacity:.42}
.sh-sea i:nth-child(1){left:0;width:64.29cqw;top:3.2cqw}
.sh-sea i:nth-child(2){left:78.57cqw;width:21.43cqw;top:3.2cqw}
.sh-sea i:nth-child(3){left:0;width:42.86cqw;top:9cqw}
.sh-sea i:nth-child(4){left:64.29cqw;width:35.71cqw;top:9cqw}

/* rivage : les lignes du symbole (horizon, puis libellé et montant) qui sortent du bord de la page, en traits fins lagon */
.shore{position:relative;height:56px;pointer-events:none}
.shore i{position:absolute;left:0;height:5px;border-radius:0 999px 999px 0;background:var(--lagon)}
.shore i:nth-child(1){top:14px;width:min(64%,920px)}
.shore i:nth-child(2){top:28px;width:min(41.1%,591px)}
.shore i:nth-child(3){top:28px;left:min(50.3%,723px);width:min(13.7%,197px);border-radius:999px}
.shore i:nth-child(4){top:42px;width:min(27.4%,394px)}
.shore i:nth-child(5){top:42px;left:min(41.1%,591px);width:min(22.9%,329px);border-radius:999px}
.shore-nuit{height:64px;margin:calc(-1 * var(--sec)) 0 calc(var(--sec) - 64px)}
.shore-nuit i{background:rgb(94 210 214/.45)}
.shore-nuit i:nth-child(1){top:22px}.shore-nuit i:nth-child(2),.shore-nuit i:nth-child(3){top:36px}.shore-nuit i:nth-child(4),.shore-nuit i:nth-child(5){top:50px}

/* ---------- Preuves ---------- */
.proofs{padding:clamp(8px,2vw,24px) 0 clamp(48px,6vw,72px)}
.proof-list{list-style:none;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}
.proof-list li{display:grid;gap:4px;padding-left:22px;position:relative;font-size:.95rem;line-height:1.4;color:var(--ardoise)}
.proof-list li::before{content:"";position:absolute;left:0;top:.45em;width:12px;height:6px;border-radius:6px 6px 0 0;background:var(--lagon)}
.proof-list b{color:var(--encre);font-weight:680;font-size:1.03rem}
@media (max-width:900px){.proof-list{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:480px){.proof-list{grid-template-columns:1fr;gap:16px}}

/* ---------- Sections ---------- */
.sec{padding-block:var(--sec)}
.sec-ecume{background:var(--ecume)}
.sec-head{max-width:780px;margin-bottom:clamp(40px,5vw,64px)}
.sec-head-center{text-align:center;margin-inline:auto}
.sec-head-row{display:flex;justify-content:space-between;align-items:end;gap:20px;max-width:none}
.sec h2,.install h2{font-size:clamp(2rem,1.35rem + 2.1vw,3.1rem);line-height:1.06;letter-spacing:-.03em}
.sec-lead{margin-top:18px;font-size:clamp(1.0625rem,1rem + .25vw,1.2rem);line-height:1.6;color:var(--ardoise);max-width:37em}
.sec-head-center .sec-lead{margin-inline:auto}
h3{font-size:1.3rem;line-height:1.25;letter-spacing:-.015em;font-weight:680}

/* Gratuit */
.feat{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(32px,6vw,88px);align-items:center}
.feat+.feat{margin-top:clamp(64px,9vw,120px)}
.feat-rev{grid-template-columns:minmax(0,7fr) minmax(0,5fr)}
.feat-rev .feat-copy{order:2}
.feat-copy h3{font-size:clamp(1.45rem,1.2rem + .8vw,1.85rem);line-height:1.15;letter-spacing:-.025em;font-weight:720;margin-bottom:16px}
.feat-copy p+p{margin-top:14px}
.feat-copy p{color:var(--ardoise)}
.feat-fig{margin:0}
.link-dl{display:inline-flex;align-items:center;gap:8px;font-weight:650}
.link-dl .ico{width:20px;height:20px}

.sc-fields,.sc-xml{background:var(--eau);border-radius:var(--r-l);overflow:hidden}
.sc-fields{aspect-ratio:600/520}
.co{left:4cqw;top:5cqw;width:54cqw;padding:3.2cqw 3.4cqw 3.6cqw}
.co-head b{display:block;font-size:max(12.5px,2.6cqw);font-weight:680}
.co-head small{display:block;font-size:max(11px,2cqw);color:var(--ardoise);margin-top:2px}
.fld{display:grid;gap:.8cqw;margin-top:2.2cqw}
.fld-row{display:grid;grid-template-columns:1fr 1fr;gap:2cqw}
.fl{font-size:max(11px,1.9cqw);font-weight:600;color:var(--ardoise)}
.fi{display:flex;align-items:center;height:max(30px,6cqw);padding:0 1.6cqw;border-radius:max(7px,1.4cqw);box-shadow:inset 0 0 0 1.5px var(--filet);font-size:max(11.5px,2.1cqw);font-variant-numeric:tabular-nums;white-space:nowrap;overflow:hidden}
.fv{display:inline-block}
.co-btn{display:flex;align-items:center;justify-content:center;margin-top:3cqw;height:max(32px,6.4cqw);border-radius:999px;background:var(--lagon);color:var(--blanc);font-size:max(11.5px,2.2cqw);font-weight:650}
.ivc{right:4cqw;top:34cqw;width:41cqw;padding:3cqw 3.2cqw 3.4cqw;font-size:max(11px,2cqw);z-index:1}
.ivc .uc-title{white-space:nowrap;font-size:max(12px,2.3cqw)}
.ivc-k{margin-top:2.6cqw;font-size:max(11px,1.75cqw);font-weight:650;color:var(--ardoise)}
.ivc-name{font-weight:680;font-size:max(12px,2.2cqw);margin-top:.6cqw}
.ivc-p{color:var(--ardoise)}
.ivc-v{display:flex;gap:1.2cqw;margin-top:.9cqw;align-items:center}
.ivc-l{color:var(--ardoise);flex:none}
.tv{position:relative;display:inline-grid;font-variant-numeric:tabular-nums;font-weight:600}
.tv>*{grid-area:1/1}
.tsk{align-self:center;height:max(7px,1.3cqw);border-radius:999px;background:var(--eau);opacity:0}
.fly{position:absolute;left:0;top:0;padding:.55em .9em;border-radius:999px;background:var(--lagon);color:var(--blanc);font-size:max(11px,2cqw);font-weight:650;font-variant-numeric:tabular-nums;white-space:nowrap;opacity:0;box-shadow:var(--sh-2);pointer-events:none}

.sc-xml{aspect-ratio:600/400}
.xml-pane{position:absolute;left:33cqw;right:3cqw;top:4.5cqw;background:var(--encre);border-radius:max(12px,2.4cqw);overflow:hidden;box-shadow:var(--sh-2)}
.xp-bar{display:flex;align-items:center;gap:1.6cqw;padding:1.8cqw 2.6cqw 1.8cqw 7cqw;font-size:max(11px,1.85cqw);font-weight:600;color:var(--nuit-mut);border-bottom:1px solid rgb(255 255 255/.08)}
.xp-dots{display:inline-flex;gap:.8cqw}.xp-dots i{width:max(6px,1.1cqw);aspect-ratio:1;border-radius:50%;background:rgb(255 255 255/.18)}
.xp-code{margin:0;padding:1.8cqw 0;-webkit-mask-image:linear-gradient(90deg,#000 88%,transparent);mask-image:linear-gradient(90deg,#000 88%,transparent);font:500 max(11px,1.74cqw)/1.68 var(--mono);color:#CFE3E5;white-space:normal;overflow:hidden}
.xp-code code{font:inherit;display:block;background:none;color:inherit;padding:0;border-radius:0}
.xl{position:relative;display:block;padding:0 2cqw 0 7.4cqw;isolation:isolate;white-space:pre}
.xd{color:var(--nuit-mut)}
.hl{position:absolute;inset:0;z-index:-1;background:rgb(94 210 214/.2);transform-origin:0 50%}
.xl .hl{left:6.2cqw;right:0}
.pdf{left:3cqw;top:8cqw;width:35cqw;padding:3cqw 3.2cqw 3.4cqw;font-size:max(11px,1.95cqw);z-index:2}
.pdf-head{display:flex;align-items:center;gap:1.4cqw}
.pdf-head b{display:block;font-size:max(12px,2.2cqw);font-weight:680;line-height:1.2}
.pdf-head small{display:block;font-size:max(11px,1.6cqw);color:var(--ardoise)}
.pdf-logo{width:max(18px,3.6cqw);aspect-ratio:1;border-radius:50%;box-shadow:inset 0 0 0 2px var(--encre);position:relative;overflow:hidden;flex:none}
.pdf-logo::after{content:"";position:absolute;left:18%;right:18%;bottom:18%;height:32%;border-radius:0 0 999px 999px;background:#5B7E78}
.pdf-title{display:flex;align-items:center;gap:1.4cqw;margin:2.4cqw 0 1.4cqw;font-size:max(14px,3cqw);font-weight:720;color:var(--lagon);letter-spacing:-.01em}
.pdf-row{display:flex;justify-content:space-between;gap:8px;padding:.5cqw 0;color:var(--ardoise)}
.pv{position:relative;isolation:isolate;color:var(--encre);font-weight:600;font-variant-numeric:tabular-nums;padding:0 .2em;margin:0 -.2em}
.pv .hl{inset:-.08em 0;border-radius:4px;background:var(--algue)}
.pdf-line{display:grid;grid-template-columns:1fr auto auto;gap:1.6cqw;margin-top:1.6cqw;padding:1.4cqw 0;border-block:1px solid var(--filet)}
.pdf-line>span:last-child{font-variant-numeric:tabular-nums}
.pdf-total{display:flex;justify-content:space-between;margin-top:1.6cqw;font-weight:650}

@container (max-width:520px){
  .sh-skyrow{grid-template-columns:minmax(0,60cqw) 1fr;padding-bottom:3.4cqw}
  .sh-sun{right:0;width:46cqw}
  .uc-lines{display:none}
  .uc-top>div{min-width:0}
  .uc-total{margin-top:2.4cqw}
  .sh-inv-clip{margin-inline:-2cqw;padding-inline:4cqw}
  .sh-inv b{font-size:max(11px,2cqw)}
  .sh-inv .chip{display:none}
  .sh-toast{white-space:normal;border-radius:max(12px,3cqw);align-items:flex-start;line-height:1.3;margin-top:-1cqw}
  .sh-toast i{margin-top:.3em}
  .sh-ribbon{padding:0 2.6cqw}
  .rb{margin:0 1cqw}
  .st{gap:1cqw}
  .sh-sea{height:15cqw}
  .sh-sea i{height:2.4cqw}
  .sh-sea i:nth-child(1),.sh-sea i:nth-child(2){top:3cqw}
  .sh-sea i:nth-child(3),.sh-sea i:nth-child(4){top:8.4cqw}
  .co{left:4cqw;width:76cqw;top:4cqw}
  .ivc{right:4cqw;top:auto;bottom:4cqw;width:66cqw}
  .pdf{width:70cqw;top:4cqw;left:4cqw}
  .xml-pane{top:auto;bottom:4cqw;left:4cqw;right:4cqw}
  .xp-code{-webkit-mask-image:linear-gradient(90deg,#000 80%,transparent);mask-image:linear-gradient(90deg,#000 80%,transparent)}
  .xl{padding-left:3cqw}
  .xl .hl{left:1.6cqw}
  .xp-bar{padding-left:2.6cqw}
}
@media (max-width:560px){
  .sc-fields{aspect-ratio:358/560}
  .sc-xml{aspect-ratio:358/560}
  .mo{grid-template-columns:minmax(0,1fr) auto;gap:4px 10px;padding:12px 14px}
  .mo-f{grid-column:1/-1}
}

.also{margin-top:clamp(64px,8vw,104px);padding-top:clamp(32px,4vw,44px);border-top:1px solid var(--filet)}
.also h3{margin-bottom:22px}
.sun-list{list-style:none;columns:2;column-gap:56px}
.sun-list li{position:relative;padding-left:26px;break-inside:avoid;margin-bottom:12px;color:var(--ardoise)}
.sun-list li::before{content:"";position:absolute;left:0;top:.62em;width:14px;height:7px;border-radius:7px 7px 0 0;background:var(--lagon)}
@media (max-width:760px){.sun-list{columns:1}.feat{grid-template-columns:1fr}.feat-rev .feat-copy{order:0}}

/* Pro : bento */
.bento{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-flow:row;gap:16px}
.bc{position:relative;display:flex;flex-direction:column;gap:10px;padding:26px 26px 24px;border-radius:var(--r-l);background:var(--ecume);isolation:isolate;transition:transform var(--t-1) var(--ease)}
.bc::after{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:var(--sh-2);opacity:0;transition:opacity var(--t-1) var(--ease);z-index:-1}
@media (hover:hover) and (pointer:fine){.bc:hover{transform:translateY(-4px)}.bc:hover::after{opacity:1}}
.bc h3{font-size:1.18rem;padding-right:64px}
.bc p{font-size:.97rem;color:var(--ardoise);line-height:1.5}
.bc-big{grid-column:span 2;grid-row:span 2;background:var(--eau)}
.bc-wide{grid-column:span 2}
.bc-big h3{font-size:clamp(1.4rem,1.2rem + .6vw,1.7rem);letter-spacing:-.025em}
.bc-business{background:var(--encre);color:var(--nuit-txt)}
.bc-business p{color:var(--nuit-mut)}
.badge-offre{position:absolute;top:22px;right:22px;font-size:.75rem;font-weight:700;letter-spacing:.01em;padding:5px 10px;border-radius:999px;background:var(--blanc);color:var(--lagon);box-shadow:inset 0 0 0 1.5px var(--algue)}
.badge-bus{background:transparent;color:var(--algue);box-shadow:inset 0 0 0 1.5px var(--algue)}
.mini{margin-top:auto;padding-top:14px}
.mini-orders{display:grid;gap:10px;margin-block:auto;padding-top:20px}
.mo{display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:12px;padding:15px 16px;border-radius:14px;background:var(--blanc);box-shadow:var(--sh-1);font-size:.92rem}
.mo-c{font-weight:620}
.bc .chip{font-size:.75rem}
.mini .sk{height:8px}
.mo-wait{box-shadow:none;background:rgb(255 255 255/.5)}
.mo-f.mo-none{color:var(--ardoise);font-weight:500;font-size:.85rem}
.mo-f{display:inline-flex;align-items:center;gap:6px;font-weight:650;color:var(--lagon);font-variant-numeric:tabular-nums;font-size:.88rem}
.mini-mail{position:relative;padding:14px 16px;border-radius:14px;background:var(--blanc);box-shadow:var(--sh-1);display:grid;gap:0}
.mm-h{display:flex;gap:8px;align-items:baseline;font-size:.88rem}.mm-h span{color:var(--ardoise)}
.mini-mail .sk{margin-top:10px}.mini-mail .sk:first-of-type{margin-top:12px}
.mm-att{display:inline-flex;width:fit-content;align-items:center;gap:6px;margin-top:12px;padding:6px 10px;border-radius:8px;background:var(--ecume);box-shadow:inset 0 0 0 1px var(--eau);font-size:.82rem;font-weight:620;color:var(--lagon-p)}
.mini-credit{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.mc-doc{position:relative;display:block;width:140px;height:88px;padding:12px 14px;border-radius:10px;background:var(--blanc);box-shadow:var(--sh-1);overflow:hidden;font-size:.78rem}
.mc-doc b{position:relative;z-index:1;display:block;font-weight:650;font-variant-numeric:tabular-nums}
.mc-doc i{position:absolute;right:10px;bottom:9px;font-style:normal;font-weight:800;font-size:1.4rem;line-height:1;letter-spacing:.08em;color:var(--eau);transform:rotate(-8deg);transform-origin:100% 100%}
.mini-qr{display:flex;align-items:center;gap:14px;font-size:.85rem;color:var(--ardoise)}
.mini-qr b{color:var(--encre);font-size:1rem;font-variant-numeric:tabular-nums}
.qr-ico{width:64px;height:64px;padding:6px;border-radius:10px;background:var(--blanc);box-shadow:var(--sh-1);flex:none}
.mini-dash{display:flex;align-items:center;gap:14px 22px;flex-wrap:wrap}
.md-docs{list-style:none;display:grid;gap:6px;flex:1 1 220px;min-width:0}
.md-docs li{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 10px 8px 12px;border-radius:10px;background:var(--blanc);box-shadow:var(--sh-1);font-size:.85rem}
.md-n{font-weight:650;font-variant-numeric:tabular-nums}
.chip-sun{background:var(--eau);color:var(--lagon-p)}.chip-sun .ico{width:1.35em;height:1.35em;color:var(--soleil-levant)}
.chip-lag{background:var(--eau);color:var(--lagon-p)}
.md-btn{display:inline-flex;align-items:center;gap:8px;margin-left:auto;padding:10px 14px;border-radius:999px;background:var(--lagon);color:var(--blanc);font-size:.85rem;font-weight:620}
.md-btn-soft{margin-left:0;white-space:nowrap;font-size:.8rem;background:var(--blanc);color:var(--lagon);box-shadow:inset 0 0 0 1.5px var(--algue)}
.bc-also{grid-column:1/-1;flex-direction:row;align-items:center;gap:20px 40px;padding-block:22px}
.bc-also h3{flex:none;padding-right:0;font-size:1.18rem}
.bc-also .badge-offre{top:50%;transform:translateY(-50%)}
.also-list{list-style:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px 28px;flex:1;margin:0;padding-right:72px}
.also-list li{display:flex;align-items:flex-start;gap:12px;font-size:.93rem;line-height:1.45;color:var(--ardoise)}
.also-list b{display:block;color:var(--encre);font-weight:650;font-size:.97rem}
.also-ico{flex:none;display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:var(--blanc);box-shadow:var(--sh-1);color:var(--lagon)}
.also-ico .ico{width:17px;height:17px}
@media (max-width:980px){.bc-also{flex-direction:column;align-items:flex-start}.bc-also .badge-offre{top:22px;transform:none}.also-list{grid-template-columns:1fr;padding-right:0}}
@media (max-width:980px){.bento{grid-template-columns:repeat(2,minmax(0,1fr))}.bc-big{grid-row:auto}}
@media (max-width:600px){.bento{grid-template-columns:minmax(0,1fr)}.bc-big,.bc-wide{grid-column:auto}.md-btn{margin-left:0}}

/* Transmission : la nuit sur la mer */
.sec-nuit{background:var(--nuit);color:var(--nuit-txt)}
.sec-nuit .sec-lead{color:var(--nuit-mut)}
.sec-nuit a{color:var(--soleil)}
.route{position:relative;margin-bottom:clamp(40px,5vw,64px);--g:clamp(16px,3vw,40px)}
.rt-nodes{list-style:none;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--g);position:relative;z-index:1;padding:34px 0 104px}
.rt-node{position:relative;padding:18px 20px;border-radius:var(--r-m);background:var(--nuit-2);box-shadow:inset 0 0 0 1px rgb(255 255 255/.08)}
.rt-node b{display:block;font-weight:680;line-height:1.25}
.rt-node small{display:block;color:var(--nuit-mut);font-size:.88rem;margin-top:4px}
.rt-node::before{content:"";position:absolute;left:50%;top:-20px;height:20px;width:2px;transform:translateX(-1px);background:rgb(94 210 214/.35)}
.rt-gx{background:var(--nuit-3)}
.rt-port{position:absolute;left:50%;top:-34px;width:18px;height:18px;margin-left:-9px;border-radius:50%;background:var(--nuit);box-shadow:inset 0 0 0 2.5px var(--champ)}
.rt-port::after{content:"";position:absolute;inset:4.5px;border-radius:50%;background:var(--champ);opacity:var(--lit,1)}
.rt-adm{display:block;position:absolute;left:0;right:0;top:calc(100% + 30px);padding:12px 16px;border-radius:12px;box-shadow:inset 0 0 0 1px rgb(255 255 255/.16)}
.rt-adm::before{content:"";position:absolute;left:50%;top:-30px;height:30px;width:2px;background:rgb(94 210 214/.35);transform:translateX(-1px)}
.rt-adm b{font-size:.95rem}
.rt-line{position:absolute;left:calc((100% - 3 * var(--g)) / 8);right:calc((100% - 3 * var(--g)) / 8);top:7.5px;height:3px;border-radius:999px;background:rgb(255 255 255/.12);overflow:hidden}
.rt-line i{display:block;height:100%;background:var(--champ);transform-origin:0 50%;transform:scaleX(var(--p,1))}
.rt-dot{position:absolute;left:0;top:0;width:14px;height:14px;margin:-7px 0 0 -7px;border-radius:50%;background:var(--soleil);z-index:2;opacity:0}
.road-grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:clamp(28px,5vw,72px);align-items:start}
.status-card{padding:clamp(22px,3vw,32px);border-radius:var(--r-l);background:var(--nuit-2)}
.status-card h3{margin-bottom:18px}
.stlist{list-style:none;display:grid}
.stlist li{display:grid;grid-template-columns:3.2em 1fr auto;align-items:center;gap:12px;padding:11px 0;border-bottom:1px solid rgb(255 255 255/.07)}
.stlist li:last-child{border-bottom:0}
.sc{font-variant-numeric:tabular-nums;color:var(--nuit-mut);font-size:.9rem}
.sl{font-weight:600}
.sd{position:relative;width:24px;height:24px;border-radius:50%;box-shadow:inset 0 0 0 2px rgb(255 255 255/.18)}
.sd i{position:absolute;inset:0;border-radius:50%;background:var(--champ);display:grid;place-items:center;color:var(--encre)}
.stlist .is-sun .sl{color:var(--soleil)}
.stlist .is-sun .sd i{background:var(--soleil)}
.sd .ico{width:15px;height:15px}
.sc-note{margin-top:16px;color:var(--nuit-mut);font-size:.95rem}
.claim{font-size:clamp(1.45rem,1.2rem + .9vw,2rem);line-height:1.3;font-weight:700;letter-spacing:-.02em;color:var(--nuit-txt)}
.facts-nuit{list-style:none;display:grid;gap:18px;margin-top:28px}
.facts-nuit li{color:var(--nuit-mut);padding-left:26px;position:relative}
.facts-nuit li::before{content:"";position:absolute;left:0;top:.5em;width:14px;height:7px;border-radius:7px 7px 0 0;background:var(--champ)}
.facts-nuit b{display:block;color:var(--nuit-txt);font-weight:650}
.dgfip{margin:36px auto 0;width:240px}
.dgfip img{display:block;width:240px;height:auto;border-radius:10px;box-shadow:none;filter:none}
@media (max-width:900px){
  .road-grid{grid-template-columns:1fr}
  .rt-nodes{grid-template-columns:1fr;gap:14px;padding:0 0 0 38px}
  .rt-node::before{left:-20px;top:50%;width:20px;height:2px;transform:translateY(-1px)}
  .rt-port{left:-38px;top:50%;margin:-9px 0 0 0}
  .rt-adm{position:relative;top:auto;margin-top:14px}
  .rt-adm::before{display:none}
  .rt-line{left:7.5px;right:auto;top:40px;bottom:58px;width:3px;height:auto}
  .rt-line i{width:100%;height:100%;transform-origin:50% 0;transform:scaleY(var(--p,1))}
}

/* Tarifs */
.pr{text-align:left}
.seg{position:relative;display:grid;grid-template-columns:1fr 1fr;width:fit-content;margin:0 auto clamp(40px,5vw,56px);padding:5px;border:0;border-radius:999px;background:var(--eau);isolation:isolate}
.seg input{position:absolute;opacity:0;pointer-events:none}
.seg label{position:relative;z-index:1;display:flex;gap:8px;align-items:center;justify-content:center;padding:12px 22px;font-weight:650;font-size:.98rem;color:var(--courant);cursor:pointer;border-radius:999px;white-space:nowrap}
.seg label i{font-style:normal;font-size:.75rem;font-weight:720;background:var(--soleil);color:var(--encre);padding:5px 9px;border-radius:999px;transition:transform var(--t-2) var(--ease)}
.thumb{position:absolute;z-index:0;top:5px;bottom:5px;left:5px;width:calc(50% - 5px);background:var(--blanc);border-radius:999px;box-shadow:var(--sh-1);transition:transform var(--t-2) var(--ease)}
.pr:has(#p-a:checked) .thumb{transform:translateX(100%)}
.pr:has(#p-m:checked) label[for=p-m],.pr:has(#p-a:checked) label[for=p-a]{color:var(--encre)}
.pr:has(#p-a:checked) label[for=p-a] i{transform:scale(1.04)}
.seg input:focus-visible+label{outline:3px solid var(--lagon);outline-offset:2px}
/* téléphone : « Annuel » et son badge ne tiennent pas dans une moitié de la bascule (le curseur, large de 50 %, chevauchait le libellé) ;
   le badge se pose sur le bord haut, les deux moitiés redeviennent égales */
@media (max-width:480px){
  .seg{width:min(100%,320px);margin-top:14px}
  .seg label{padding-inline:12px}
  .seg label i{position:absolute;top:-15px;left:50%;translate:-50% 0;padding:4px 8px;white-space:nowrap;box-shadow:0 0 0 3px var(--blanc)}
}
.plans{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;align-items:stretch}
.plan{position:relative;display:flex;flex-direction:column;padding:30px 28px 28px;border-radius:var(--r-l);background:var(--blanc);box-shadow:var(--sh-2),inset 0 0 0 1px var(--filet)}
.plan h3{font-size:1.4rem;letter-spacing:-.02em}
.plan-for{margin:4px 0 20px;color:var(--ardoise);font-size:.97rem}
@media (min-width:901px){.plan-for{min-height:3.2em}.plan-pro .plan-for{padding-right:52px}}
.price{display:grid;min-height:96px}
.price>div{grid-area:1/1;display:flex;flex-direction:column;gap:8px;transition:opacity var(--t-2) var(--ease),transform var(--t-2) var(--ease)}
.pm{opacity:0;transform:translateY(-10px);pointer-events:none;visibility:hidden}
.pr:has(#p-m:checked) .pm{opacity:1;transform:none;pointer-events:auto;visibility:visible}
.pr:has(#p-m:checked) .pa:not(.pm-same){opacity:0;transform:translateY(10px);pointer-events:none;visibility:hidden}
.price>div{transition:opacity var(--t-2) var(--ease),transform var(--t-2) var(--ease),visibility 0s linear var(--t-2)}
.pr:has(#p-m:checked) .pm,.pr:has(#p-a:checked) .pa{transition-delay:0s}
.amount{display:flex;align-items:baseline;gap:8px;font-size:3.25rem;line-height:1;font-weight:720;letter-spacing:-.04em}
.amount small{font-size:.95rem;font-weight:500;letter-spacing:0;color:var(--ardoise)}
.psub{font-size:.9rem;color:var(--ardoise);display:flex;flex-wrap:wrap;gap:4px 10px;align-items:center;line-height:1.35}
.psub s{text-decoration-thickness:1.5px;font-variant-numeric:tabular-nums}
.save{color:var(--lagon);font-weight:720}
.checks{list-style:none;display:grid;gap:11px;margin:22px 0 28px;font-size:.98rem;line-height:1.4}
.checks li{display:grid;grid-template-columns:20px 1fr;gap:10px}
.checks .ico{width:20px;height:20px;color:var(--lagon);margin-top:1px}
.checks .all{font-weight:700}
.plan .btn{margin-top:auto;width:100%}
.plan-pro{background:var(--lagon);color:var(--blanc);box-shadow:var(--sh-3);transform:translateY(-12px)}
.plan-pro .plan-for,.plan-pro .amount small,.plan-pro .psub{color:var(--algue)}
.plan-pro .save{color:var(--algue);font-weight:760}
.plan-pro .checks .ico{color:var(--algue)}
.plan-tag{position:absolute;top:-14px;left:28px;padding:7px 13px;border-radius:999px;background:var(--soleil);color:var(--encre);font-size:.8rem;font-weight:720}
.plan-pro .sym{position:absolute;top:24px;right:24px;width:46px;height:46px}
.plan-pro .sym .i{fill:var(--algue)}.plan-pro .sym .s{fill:var(--soleil)}
@media (hover:hover) and (pointer:fine){
  .plan{transition:transform var(--t-1) var(--ease)}
  .plan:not(.plan-pro):hover{transform:translateY(-4px)}
  .plan-pro:hover{transform:translateY(-16px)}
}
@media (max-width:900px){.plans{grid-template-columns:1fr;max-width:520px;margin-inline:auto}.plan-pro{transform:none;margin-top:10px}.plan-pro:hover{transform:translateY(-4px)}}
.compare{margin:40px auto 0;max-width:980px;border-radius:var(--r-m);background:var(--ecume)}
.compare summary{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 22px;font-weight:650;cursor:pointer;list-style:none;border-radius:var(--r-m)}
.compare summary::-webkit-details-marker{display:none}
.compare-body{padding:0 22px 24px}
/* ombre au bord quand le tableau défile : les caches (local) suivent le contenu, les ombres (scroll) restent aux bords */
.table-wrap{--tw-bg:var(--blanc);overflow-x:auto;-webkit-overflow-scrolling:touch;border-radius:12px;
  background:linear-gradient(to right,var(--tw-bg) 40%,rgb(255 255 255/0)) left center/28px 100% no-repeat local,
    linear-gradient(to left,var(--tw-bg) 40%,rgb(255 255 255/0)) right center/28px 100% no-repeat local,
    radial-gradient(farthest-side at 0 50%,rgb(var(--ombre)/.22),rgb(var(--ombre)/0)) left center/14px 100% no-repeat scroll,
    radial-gradient(farthest-side at 100% 50%,rgb(var(--ombre)/.22),rgb(var(--ombre)/0)) right center/14px 100% no-repeat scroll;
  background-color:var(--tw-bg)}
.compare .table-wrap{--tw-bg:var(--ecume)}
table{width:100%;border-collapse:collapse;font-size:.95rem;min-width:560px}
th,td{text-align:left;padding:12px 14px;border-bottom:1px solid var(--filet);vertical-align:top}
thead th{font-size:.82rem;font-weight:700;color:var(--ardoise);border-bottom:2px solid var(--filet)}
tbody th{font-weight:600}
td.num{font-variant-numeric:tabular-nums}
/* téléphone : les tableaux tiennent dans la largeur (colonnes Pro et Business visibles) ;
   à partir de 5 colonnes, ils défilent avec l'ombre de bord */
@media (max-width:600px){
  table,.prose table{min-width:0;font-size:.8rem}
  th,td{padding:10px 6px;-webkit-hyphens:auto;hyphens:auto}
  th:first-child,td:first-child{width:34%;padding-left:2px}
  thead th{font-size:.72rem;-webkit-hyphens:manual;hyphens:manual}
  table:has(tr>:nth-child(5)){min-width:600px}
  table:has(tr>:nth-child(5)) :is(th,td){width:auto;-webkit-hyphens:manual;hyphens:manual}
  .compare summary{padding:16px 14px}
  .compare-body{padding:0 12px 18px}
}
.tech-h{font-size:1.05rem;margin:26px 0 10px}
.tech{list-style:none;display:grid;gap:8px;font-size:.93rem;color:var(--ardoise)}
.tech li{padding-left:22px;position:relative}
.tech li::before{content:"";position:absolute;left:0;top:.6em;width:12px;height:6px;border-radius:6px 6px 0 0;background:var(--lagon)}
.fine{margin:28px auto 0;max-width:38em;text-align:center;font-size:.875rem;color:var(--ardoise)}
.fine-more{margin-top:10px;font-size:.95rem}

/* marqueur « + » qui devient une ligne d'horizon, avec un soleil qui se lève */
.pm-ico{position:relative;width:24px;height:24px;flex:none}
.pm-ico::before,.pm-ico::after{content:"";position:absolute;left:3px;right:3px;top:15px;height:2.5px;border-radius:2px;background:var(--lagon)}
.pm-ico::after{transform:rotate(90deg);transition:transform var(--t-2) var(--ease)}
.pm-ico b{position:absolute;left:7px;top:7px;width:10px;height:5px;border-radius:5px 5px 0 0;background:var(--soleil-levant);opacity:0;transform:translateY(4px);transition:opacity var(--t-2) var(--ease),transform var(--t-2) var(--ease)}
details[open]>summary .pm-ico::after{transform:rotate(0)}
details[open]>summary .pm-ico b{opacity:1;transform:none}

/* FAQ */
.faq{max-width:860px}
.faq h2{margin-bottom:clamp(28px,4vw,44px)}
.faq-list details{border-bottom:1px solid var(--filet)}
.faq-list details:first-child{border-top:1px solid var(--filet)}
.faq-list summary{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:22px 4px;font-size:1.14rem;font-weight:650;letter-spacing:-.01em;cursor:pointer;list-style:none;border-radius:8px}
.faq-list summary::-webkit-details-marker{display:none}
.faq-a{padding:0 48px 24px 4px;color:var(--ardoise)}
.faq-a p{max-width:35em}
@media (hover:hover) and (pointer:fine){.faq-list summary:hover{color:var(--lagon)}}

/* Guides */
.guides{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:clamp(24px,4vw,48px);align-items:start}
.guide-star{display:grid;border-radius:var(--r-l);overflow:hidden;background:var(--ecume);color:var(--encre);text-decoration:none;isolation:isolate;transition:transform var(--t-1) var(--ease);position:relative}
.guide-star::after{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:var(--sh-2);opacity:0;transition:opacity var(--t-1) var(--ease);z-index:-1}
@media (hover:hover) and (pointer:fine){.guide-star:hover{transform:translateY(-4px);color:var(--encre)}.guide-star:hover::after{opacity:1}}
.gs-art{position:relative;display:block;aspect-ratio:16/8;background:var(--champ);overflow:hidden}
.gs-sun{position:absolute;left:50%;bottom:30%;width:34%;aspect-ratio:2/1;border-radius:999px 999px 0 0;background:var(--soleil);transform:translateX(-50%)}
.gs-art i{position:absolute;height:9%;border-radius:999px;background:var(--haut-fond)}
.gs-art i:nth-of-type(1){left:8%;right:8%;bottom:19%;background:var(--blanc)}
.gs-art i:nth-of-type(2){left:8%;width:54%;bottom:7%}.gs-art i:nth-of-type(3){left:70%;width:22%;bottom:7%}
.gs-art i:nth-of-type(4){left:8%;width:36%;bottom:-5%}.gs-art i:nth-of-type(5){left:62%;width:30%;bottom:-5%}
.gs-body{display:grid;gap:8px;padding:24px 26px 28px}
.gs-kind{font-size:.85rem;font-weight:650;color:var(--lagon)}
.gs-title{font-size:1.45rem;line-height:1.3;letter-spacing:-.02em;font-weight:720}
.gs-meta{font-size:.9rem;color:var(--ardoise)}
.guide-list{list-style:none}
.guide-list a{display:grid;gap:4px;padding:18px 4px;border-bottom:1px solid var(--filet);text-decoration:none;color:var(--encre)}
.guide-list li:first-child a{padding-top:4px}
.guide-list b{font-weight:640;line-height:1.35}
.guide-list a>span{font-size:.88rem;color:var(--ardoise)}
@media (hover:hover) and (pointer:fine){.guide-list a:hover b{color:var(--lagon);text-decoration:underline;text-decoration-thickness:1.5px;text-underline-offset:.2em}}
@media (max-width:860px){.guides{grid-template-columns:1fr}.sec-head-row{align-items:start;flex-direction:column}}

/* Installer et pied de page : le jour est levé */
.install{position:relative;background:var(--champ);padding:0 0 clamp(56px,7vw,96px);margin-top:clamp(40px,6vw,80px)}
.shore-top{height:56px;margin-top:-56px;background:var(--blanc);transform:scaleX(-1)}
.install-in{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:clamp(32px,5vw,72px);align-items:center;padding-top:clamp(48px,6vw,80px)}
.install h2{max-width:14em}
.steps{list-style:none;display:flex;flex-wrap:wrap;gap:10px;margin:26px 0 30px;counter-reset:s}
.steps li{counter-increment:s;display:inline-flex;align-items:center;gap:10px;padding:10px 16px 10px 10px;border-radius:999px;background:rgb(255 255 255/.6);font-weight:620}
.steps li::before{content:counter(s);display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--encre);color:var(--blanc);font-size:.85rem;font-weight:700}
.install-sun{position:relative;aspect-ratio:5/3.4;width:100%}
.inst-sun{position:absolute;left:18%;right:18%;top:0;aspect-ratio:2/1;border-radius:999px 999px 0 0;background:var(--soleil)}
.install-sun i{position:absolute;height:10.5%;border-radius:999px;background:var(--encre)}
.install-sun i:nth-of-type(1){left:0;right:0;top:39%}.install-sun i:nth-of-type(2){left:0;width:64.29%;top:55.5%}.install-sun i:nth-of-type(3){left:78.57%;width:21.43%;top:55.5%}.install-sun i:nth-of-type(4){left:0;width:42.86%;top:72%}.install-sun i:nth-of-type(5){left:64.29%;width:35.71%;top:72%}
.site-foot{background:var(--champ);color:var(--encre);padding:0 0 40px}
.foot-in{display:grid;grid-template-columns:auto 1fr;gap:18px 40px;align-items:center;padding-top:32px;border-top:2px solid rgb(5 42 53/.12)}
.brand-foot .lockup{height:30px}
.foot-pub{font-size:.92rem;color:var(--courant)}
.foot-nav{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:8px 26px;font-weight:600}
.foot-nav a{color:var(--encre);text-decoration:none}
@media (hover:hover) and (pointer:fine){.foot-nav a:hover{text-decoration:underline;color:var(--encre)}}
.site-foot a:focus-visible,.install a:focus-visible,.hero a:focus-visible,.site-head a:focus-visible{outline-color:var(--encre)}
@media (max-width:860px){.install-in{grid-template-columns:1fr}.install-sun{max-width:360px}.foot-in{grid-template-columns:1fr}}

/* Hero : mobile. La scène remonte entre le titre et le chapeau : le premier écran montre le soleil, pas un mur de texte. */
@media (max-width:900px){
  .hero-grid{grid-template-columns:1fr;row-gap:0}
  .hero-copy{display:contents}
  .hero h1{order:1}
  .hero-fig{order:2;max-width:600px;width:100%;margin:clamp(20px,4vw,32px) auto 0}
  .hero-lead{order:3}
  .cta-row{order:4}
  .deadline{order:5}
}

/* ---------- Mouvement (amélioration progressive) ---------- */
@media (prefers-reduced-motion:no-preference){
  .js:not(.motion-off) .rv{opacity:0;transform:translateY(16px);transition:opacity var(--t-3) var(--ease),transform var(--t-3) var(--ease);transition-delay:calc(var(--i,0) * 50ms)}
  .js:not(.motion-off) .rv.in{opacity:1;transform:none}
  .js:not(.motion-off) .plan.rv.in{transition:opacity var(--t-3) var(--ease),transform var(--t-1) var(--ease)}
  .js:not(.motion-off) .plan-pro.rv.in{transform:translateY(-12px)}
  @media (max-width:900px){.js:not(.motion-off) .plan-pro.rv.in{transform:none}}
  /* états de départ des scènes, identiques à t = 0 du moteur, pour éviter un éclair de l'état final avant le script */
  .js:not(.motion-off) .sc-hero:not(.mounted) [data-k=order],
  .js:not(.motion-off) .sc-hero:not(.mounted) [data-k=toast],
  .js:not(.motion-off) .sc-hero:not(.mounted) [data-k=done],
  .js:not(.motion-off) .sc-hero:not(.mounted) .dot .on{opacity:0}
  .js:not(.motion-off) .sc-hero:not(.mounted) [data-k=sun]{transform:translateY(140%)}
  .js:not(.motion-off) .sc-hero:not(.mounted) [data-k=inv]{transform:translateY(-180%)}
  .js:not(.motion-off) .sc-hero:not(.mounted) .rb i{transform:scaleX(0)}
  details[open] .faq-a,details[open] .compare-body,.toc-m[open] nav{animation:ouvre var(--t-2) var(--ease)}
  @keyframes ouvre{from{opacity:0;transform:translateY(-8px)}}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}
}
@media print{
  .site-head{position:static}
  .scene *,.rv{opacity:1!important;transform:none!important;clip-path:none!important}
  .menu,.skip{display:none!important}
  .hero,.install,.site-foot,.sec-nuit{background:#fff!important;color:#000!important}
}

/* ---------- 404 : le soleil couché sur l'horizon ---------- */
.page-404 .site-head{--head-bg:var(--champ)}
.e404{padding-block:clamp(48px,8vw,120px) clamp(72px,10vw,140px)}
.e404-in{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:clamp(32px,6vw,88px);align-items:center}
.e404 .h1-a{margin-bottom:.4em}
.e404-sun{position:relative;aspect-ratio:5/3.4;width:100%}
.e404-sky{position:absolute;left:0;right:0;top:0;height:46%;overflow:hidden}
.e404-sky span{position:absolute;left:18%;width:64%;top:58%;aspect-ratio:2/1;border-radius:999px 999px 0 0;background:var(--soleil)}
.e404-sun i{position:absolute;height:10.5%;border-radius:999px;background:var(--encre)}
.e404-sun i:nth-of-type(1){left:0;right:0;top:39%}.e404-sun i:nth-of-type(2){left:0;width:64.29%;top:55.5%}.e404-sun i:nth-of-type(3){left:78.57%;width:21.43%;top:55.5%}.e404-sun i:nth-of-type(4){left:0;width:42.86%;top:72%}.e404-sun i:nth-of-type(5){left:64.29%;width:35.71%;top:72%}
@media (max-width:860px){.e404-in{grid-template-columns:1fr}.e404-sun{max-width:360px}}

/* ---------- Pages de lecture (article) ---------- */
.page-text{background:var(--blanc)}
.art-head{background:var(--ecume);padding:clamp(28px,4vw,52px) 0 clamp(36px,5vw,60px);border-bottom:1px solid var(--filet)}
.crumb{display:flex;flex-wrap:wrap;align-items:center;gap:10px;font-size:.92rem;color:var(--ardoise);list-style:none}
.crumb li{display:inline-flex;align-items:center;gap:10px}
.crumb li+li::before{content:"";width:10px;height:5px;border-radius:5px 5px 0 0;background:var(--lagon);display:inline-block}
.crumb a{color:var(--lagon);font-weight:600}
.art-head h1{margin-top:18px;max-width:20em;font-size:clamp(2.1rem,1.5rem + 2.3vw,3.4rem);line-height:1.06;letter-spacing:-.032em}
.art-meta{margin-top:18px;color:var(--ardoise);font-size:1rem}
.art-meta b{color:var(--encre);font-weight:620}
.art-layout{display:grid;grid-template-columns:240px minmax(0,660px);justify-content:center;gap:clamp(32px,5vw,72px);padding-block:clamp(36px,5vw,64px) var(--sec)}
.toc{position:sticky;top:104px;align-self:start;font-size:.92rem}
.toc-h{font-weight:700;font-size:.92rem;margin-bottom:12px}
.toc ol{list-style:none;display:grid;gap:2px;border-left:2px solid var(--filet)}
.toc a{position:relative;display:block;padding:7px 0 7px 18px;color:var(--ardoise);text-decoration:none;line-height:1.35}
.toc a::before{content:"";position:absolute;left:-7px;top:.95em;width:12px;height:6px;border-radius:6px 6px 0 0;background:var(--soleil-levant);opacity:0;transform:translateY(3px);transition:opacity var(--t-1) var(--ease),transform var(--t-1) var(--ease)}
.toc a[aria-current=true]{color:var(--encre);font-weight:620}
.toc a[aria-current=true]::before{opacity:1;transform:none}
@media (hover:hover) and (pointer:fine){.toc a:hover{color:var(--lagon)}}
.prose{font-size:1.09rem;line-height:1.7;color:var(--encre)}
.prose>*+*{margin-top:1.15em}
.prose h2{margin-top:2.1em;font-size:clamp(1.5rem,1.25rem + .9vw,1.95rem);line-height:1.15;letter-spacing:-.025em;scroll-margin-top:96px}
.prose h3{margin-top:1.8em;font-size:1.2rem}
.prose h2+*,.prose h3+*{margin-top:.7em}
.prose ol,.prose ul{padding-left:1.4em;display:grid;gap:.5em}
.prose ul{list-style:none;padding-left:0}
.prose ul>li{position:relative;padding-left:26px}
.prose ul>li::before{content:"";position:absolute;left:0;top:.72em;width:13px;height:6.5px;border-radius:7px 7px 0 0;background:var(--lagon)}
.prose ol>li::marker{color:var(--lagon);font-weight:700}
.prose strong{font-weight:680}
.summary{position:relative;padding:24px 26px 24px 26px;border-radius:var(--r-m);background:var(--eau);color:var(--encre)}
.summary-h{display:flex;align-items:center;gap:10px;font-weight:720;margin-bottom:8px}
.summary-h .ico{width:26px;height:26px;color:var(--lagon)}
.summary p{font-size:1.03rem;line-height:1.6}
.prose .table-wrap{margin-block:1.6em;border-radius:0}
.prose table{font-size:.95rem}
.shot{margin:2em 0}
.shot-frame{position:relative;border-radius:14px;overflow:hidden;box-shadow:var(--sh-2),0 0 0 1px var(--filet);background:var(--blanc)}
.shot-frame img{width:100%}
.mark{position:absolute;display:grid;place-items:center;width:30px;height:30px;margin:-15px 0 0 -15px;border-radius:50%;background:var(--lagon);color:var(--blanc);font-weight:720;font-size:.9rem;box-shadow:0 0 0 3px var(--blanc),var(--sh-1)}
.shot figcaption{margin-top:12px;font-size:.9rem;color:var(--ardoise);line-height:1.5;max-width:40em}
.shot-legend{list-style:none!important;padding:0!important;display:grid;gap:6px!important;margin-top:12px}
.shot-legend li{display:flex!important;gap:10px;align-items:baseline;padding-left:0!important;font-size:.95rem;color:var(--ardoise)}
.shot-legend li::before{display:none}
.shot-legend b{display:inline-grid;place-items:center;flex:none;width:22px;height:22px;border-radius:50%;background:var(--lagon);color:var(--blanc);font-size:.75rem}
.related{margin-top:3em;padding-top:2em;border-top:1px solid var(--filet)}
.related h2{margin-top:0}
.related-list{list-style:none!important;padding:0!important;display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px!important}
.related-list li{padding:0!important}
.related-list li::before{display:none}
.related-list a{display:grid;gap:6px;height:100%;padding:18px;border-radius:var(--r-m);background:var(--ecume);color:var(--encre);text-decoration:none;font-weight:620;line-height:1.35;font-size:.98rem;transition:transform var(--t-1) var(--ease)}
.related-list a>span:first-child{font-weight:400;font-size:.85rem;color:var(--lagon)}
.related-list .nw{color:inherit;font:inherit}
@media (hover:hover) and (pointer:fine){.related-list a:hover{transform:translateY(-3px);color:var(--encre)}}
.end-cta{margin-top:3em;padding:clamp(24px,3vw,36px);border-radius:var(--r-l);background:var(--champ);display:grid;gap:18px}
.end-cta p{font-size:1.1rem;font-weight:550;max-width:36em}
.end-cta .cta-row{margin-top:0}
.sources{font-size:.95rem}
.toc-m{display:none}
@media (max-width:980px){
  .art-layout{grid-template-columns:minmax(0,660px)}
  .toc{display:none}
  .toc-m{display:block;border-radius:var(--r-m);background:var(--ecume)}
  .toc-m summary{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 20px;font-weight:700;cursor:pointer;list-style:none;border-radius:var(--r-m)}
  .toc-m summary::-webkit-details-marker{display:none}
  .prose .toc-m ol{list-style:none;padding:0 20px 18px;display:grid;gap:2px;font-size:.95rem}
  .prose .toc-m ol>li::marker{content:none}
  .toc-m a{display:block;padding:7px 0;color:var(--ardoise);text-decoration:none;line-height:1.35}
}
@media (max-width:640px){.related-list{grid-template-columns:1fr}.mark{width:22px;height:22px;margin:-11px 0 0 -11px;font-size:.72rem;box-shadow:0 0 0 2px var(--blanc)}}
.art-head-in{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:40px;align-items:end}
.art-meta b{font-weight:620}
.art-sun{position:relative;width:220px;aspect-ratio:5/3.4;margin-bottom:6px}
.art-sun span{position:absolute;left:18%;right:18%;top:0;aspect-ratio:2/1;border-radius:999px 999px 0 0;background:var(--soleil)}
.art-sun i{position:absolute;height:10.5%;border-radius:999px;background:var(--champ)}
.art-sun i:nth-of-type(1){left:0;right:0;top:39%}.art-sun i:nth-of-type(2){left:0;width:64.29%;top:55.5%}.art-sun i:nth-of-type(3){left:78.57%;width:21.43%;top:55.5%}.art-sun i:nth-of-type(4){left:0;width:42.86%;top:72%}.art-sun i:nth-of-type(5){left:64.29%;width:35.71%;top:72%}
.shot-side{display:grid;grid-template-columns:280px minmax(0,1fr);gap:24px;align-items:start}
.shot-side figcaption{margin-top:0}
.prose .sources{font-size:.95rem}
.crumb span{color:var(--ardoise)}
@media (max-width:760px){.art-sun{display:none}.art-head-in{grid-template-columns:1fr}.shot-side{grid-template-columns:minmax(0,1fr)}.shot-side .shot-frame{max-width:300px}}
.related-list b{font-weight:620}
.page-text .site-foot{padding-top:12px}
.page-text .foot-in{border-top:0}

/* ---------- Pages légales : même lecture que l'article, une colonne alignée sur le titre ---------- */
.legal-layout{display:grid;grid-template-columns:minmax(0,660px);justify-content:start;padding-block:clamp(36px,5vw,64px) var(--sec)}
.prose-legal h2{margin-top:1.9em;font-size:clamp(1.25rem,1.1rem + .5vw,1.5rem);line-height:1.2;letter-spacing:-.018em}
.prose-legal h2:first-child{margin-top:0}
.prose-legal hr{height:0;margin:2.6em 0;border:0;border-top:1px solid var(--filet)}

/* Tarifs puis FAQ sur le même fond : un seul espacement entre les deux */
#pricing{padding-bottom:calc(var(--sec) * .55)}
#pricing + #faq{padding-top:calc(var(--sec) * .55)}

/* ---------- Sélecteur de langue (accueil FR et EN) : FR | EN, discret ----------
   Dernier élément de la navigation au-dessus de 900 px, dernière ligne du menu en dessous (l'en-tête mobile ne bouge pas).
   Langue en cours : encre et gras ; l'autre : courant, soulignée au survol comme la navigation.
   De 901 à 1023 px, seul le lien vers l'autre langue reste : la ligne de l'en-tête (bouton « Installer gratuitement » compris) ne tient pas sinon. */
.lang{display:flex;align-items:center;font-size:.9rem;letter-spacing:.02em}
.lang i{flex:none;width:1.5px;height:1em;margin:0 2px;border-radius:2px;background:currentColor;opacity:.3}
.lang a{font-weight:550;color:var(--courant)}
.lang a[aria-current]{font-weight:750;color:var(--encre)}
.nav .lang a{padding:6px 5px}
.nav .lang a[aria-current]::after{content:none}
@media (min-width:901px) and (max-width:1023px){.nav .lang a[aria-current],.nav .lang i{display:none}.nav .lang a{padding-inline:2px}}
.menu-panel .lang-m{margin-top:4px;padding-top:4px;border-top:1px solid var(--filet);color:var(--encre)}
.menu-panel .lang-m a{padding:12px 14px;font-weight:550;color:var(--courant)}
.menu-panel .lang-m a[aria-current]{font-weight:750;color:var(--encre)}