*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:#dfe5e2}
a{color:inherit;text-decoration:none}
a:hover{color:var(--accent,#1a897c)}
::selection{background:#1a897c;color:#fff}
@keyframes fadeUp{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@keyframes scanY{0%{transform:translateY(2px);opacity:0}12%{opacity:.9}86%{opacity:.9}100%{transform:translateY(150px);opacity:0}}
@keyframes blink{0%,100%{opacity:1}50%{opacity:.25}}
/* Archivo 400 — latin-ext */
@font-face {font-family: 'Archivo';
font-style: normal;
font-weight: 400;
font-stretch: 100%;
font-display: swap;
src: url(fonts/Archivo-400-latin-ext.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;}
/* Archivo 400 — latin */
@font-face {font-family: 'Archivo';
font-style: normal;
font-weight: 400;
font-stretch: 100%;
font-display: swap;
src: url(fonts/Archivo-400-latin.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;}
/* Archivo 600 — latin-ext */
@font-face {font-family: 'Archivo';
font-style: normal;
font-weight: 600;
font-stretch: 100%;
font-display: swap;
src: url(fonts/Archivo-600-latin-ext.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;}
/* Archivo 600 — latin */
@font-face {font-family: 'Archivo';
font-style: normal;
font-weight: 600;
font-stretch: 100%;
font-display: swap;
src: url(fonts/Archivo-600-latin.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;}
/* Archivo 700 — latin-ext */
@font-face {font-family: 'Archivo';
font-style: normal;
font-weight: 700;
font-stretch: 100%;
font-display: swap;
src: url(fonts/Archivo-700-latin-ext.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;}
/* Archivo 700 — latin */
@font-face {font-family: 'Archivo';
font-style: normal;
font-weight: 700;
font-stretch: 100%;
font-display: swap;
src: url(fonts/Archivo-700-latin.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;}
/* Archivo 800 — latin-ext */
@font-face {font-family: 'Archivo';
font-style: normal;
font-weight: 800;
font-stretch: 100%;
font-display: swap;
src: url(fonts/Archivo-800-latin-ext.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;}
/* Archivo 800 — latin */
@font-face {font-family: 'Archivo';
font-style: normal;
font-weight: 800;
font-stretch: 100%;
font-display: swap;
src: url(fonts/Archivo-800-latin.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;}
/* IBM Plex Mono 400 — latin-ext */
@font-face {font-family: 'IBM Plex Mono';
font-style: normal;
font-weight: 400;
font-display: swap;
src: url(fonts/IBMPlexMono-400-latin-ext.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;}
/* IBM Plex Mono 400 — latin */
@font-face {font-family: 'IBM Plex Mono';
font-style: normal;
font-weight: 400;
font-display: swap;
src: url(fonts/IBMPlexMono-400-latin.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;}
/* IBM Plex Mono 600 — latin-ext */
@font-face {font-family: 'IBM Plex Mono';
font-style: normal;
font-weight: 600;
font-display: swap;
src: url(fonts/IBMPlexMono-600-latin-ext.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;}
/* IBM Plex Mono 600 — latin */
@font-face {font-family: 'IBM Plex Mono';
font-style: normal;
font-weight: 600;
font-display: swap;
src: url(fonts/IBMPlexMono-600-latin.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;}
/* FAQ native — pliage sans JavaScript (remplace le runtime du générateur) */
.faq > summary { list-style: none; cursor: pointer; }
.faq > summary::-webkit-details-marker { display: none; }
.faq > summary::marker { content: ''; }
.faq-sign::after { content: '+'; }
.faq[open] > summary .faq-sign::after { content: '\2013'; }
/* En-tête responsive — l'export ne gérait pas le mobile (menu chevauché,
baseline du logo cassée sur 4 lignes). Sur petit écran on garde logo + CTA ;
les sections restent accessibles en faisant défiler la page. */
@media (max-width: 720px) {
header nav > a:not(:last-child) { display: none; }
header nav { gap: 0; flex: 0 0 auto; }
header a[href="#top"] { gap: 8px; flex: 0 1 auto; min-width: 0; }
/* La baseline est plus large que le nom : elle poussait le CTA hors de l'écran. */
header a[href="#top"] span span:last-child { display: none; }
header nav > a:last-child { padding: 8px 11px !important; font-size: 12.5px !important; white-space: nowrap; }
header > div { padding: 11px 16px !important; gap: 10px !important; }
header a[href="#top"] span span:first-child { font-size: 15px; }
}
/* Très petits écrans : on ne garde que le monogramme, le nom passerait à la ligne. */
@media (max-width: 390px) {
header a[href="#top"] span { display: none; }
}
/* Survols (convertis depuis les attributs propriétaires de l'export) */
.hv1:hover{color:var(--accent,#1a897c)}
.hv2:hover{color:var(--accent,#1a897c)}
.hv3:hover{color:var(--accent,#1a897c)}
.hv4:hover{background:var(--accent,#1a897c);border-color:var(--accent,#1a897c);color:#fff}
.hv5:hover{background:var(--accent,#1a897c);border-color:var(--accent,#1a897c);color:#fff}
.hv6:hover{border-color:var(--accent,#1a897c);color:var(--accent,#1a897c)}
.hv7:hover{background:var(--accent,#1a897c)}
.hv8:hover{background:#fff}
.hv9:hover{background:#fff}
.hv10:hover{background:#fff}
.hv11:hover{background:#fff}
.hv12:hover{border-color:var(--line-strong)}
.hv13:hover{border-color:var(--line-strong)}
.hv14:hover{color:var(--accent,#1a897c);border-color:var(--accent,#1a897c)}
.hv15:hover{color:var(--accent,#1a897c)}
.hv16:hover{color:var(--accent,#1a897c)}
.hv17:hover{background:var(--accent,#1a897c);border-color:var(--accent,#1a897c);color:#fff}
.hv18:hover{color:var(--accent,#1a897c)}
.hv19:hover{border-color:var(--accent,#1a897c);color:var(--accent,#1a897c)}
.hv20:hover{border-color:var(--accent,#1a897c);color:var(--accent,#1a897c)}
.hv21:hover{border-color:var(--accent,#1a897c);color:var(--accent,#1a897c)}
.hv22:hover{color:var(--accent,#1a897c)}
.hv23:hover{background:var(--accent,#1a897c);border-color:var(--accent,#1a897c);color:#fff}
.hv24:hover{color:#fff}
.hv25:hover{color:#fff}
.hv26:hover{color:#fff}
.hv27:hover{color:#fff}
.hv28:hover{color:#fff}
:root{
--ink:#1e3049; --paper:#f2f4f3; --mut:#5c6b78; --panel:#e6ece9;
--line:rgba(31,49,74,.14); --line-strong:rgba(31,49,74,.30); --accent:#1a897c;
--font-sans:'Helvetica Neue','Archivo',Helvetica,Arial,sans-serif;
--font-mono:'IBM Plex Mono',ui-monospace,SFMono-Regular,monospace;
}
body{font-family:var(--font-sans);color:var(--ink);background:var(--paper);-webkit-font-smoothing:antialiased}
.skipLink{position:absolute;left:-9999px}
.skipLink:focus{left:12px;top:12px;background:var(--ink);color:var(--paper);padding:10px 14px;z-index:100}
/* ---- Pages de contenu (légal) ---------------------------------------- */
.legalPage{max-width:1240px;margin:0 auto;padding:clamp(44px,6vw,84px) clamp(24px,6vw,88px) clamp(60px,7vw,104px)}
.legalPage article{max-width:74ch}
.legalPage h1{margin:0 0 clamp(22px,3vw,38px);font-size:clamp(34px,5.2vw,64px);line-height:1.02;letter-spacing:-.03em;font-weight:800}
.legalPage h2{margin:clamp(34px,4vw,54px) 0 14px;padding-top:clamp(22px,3vw,30px);border-top:1px solid var(--line);
font-size:clamp(19px,2.2vw,26px);line-height:1.15;letter-spacing:-.015em;font-weight:700}
.legalPage h2:first-of-type{border-top:none;padding-top:0;margin-top:0}
.legalPage p,.legalPage li{font-size:16px;line-height:1.65;color:var(--mut)}
.legalPage p{margin:0 0 14px}
.legalPage ul{margin:0 0 18px;padding-left:20px}
.legalPage li{margin-bottom:7px}
.legalPage strong{color:var(--ink);font-weight:600}
.legalPage a{color:var(--accent);border-bottom:1px solid var(--line-strong)}
.legalPage a:hover{border-color:var(--accent)}
.legalPage .lead{font-size:clamp(17px,1.9vw,21px);line-height:1.5;color:var(--mut);max-width:62ch}
/* ---- Page tarifs ------------------------------------------------------ */
.pricePage{max-width:1240px;margin:0 auto;padding:clamp(44px,6vw,84px) clamp(24px,6vw,88px) clamp(60px,7vw,104px)}
.sectionHead{max-width:66ch;margin-bottom:clamp(30px,3.5vw,48px)}
.sectionHead h1,.sectionHead h2{margin:0 0 14px;font-size:clamp(30px,4.6vw,58px);line-height:1.02;letter-spacing:-.03em;font-weight:800}
.sectionHead p{margin:0;font-size:clamp(16px,1.8vw,19px);line-height:1.55;color:var(--mut)}
.priceGrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:18px;margin-bottom:26px}
.priceCard{border:1px solid var(--line);background:#fff;padding:clamp(24px,2.6vw,34px);display:flex;flex-direction:column}
.priceCard.featured{border-color:var(--ink);box-shadow:0 1px 0 var(--ink)}
.pricePill{display:inline-block;font-family:var(--font-mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;
color:var(--accent);margin-bottom:14px}
.priceCard h3{margin:0 0 6px;font-size:19px;font-weight:700;letter-spacing:-.01em}
.priceTag{font-size:clamp(30px,3.4vw,42px);font-weight:800;letter-spacing:-.03em;line-height:1;margin:10px 0 4px}
.priceTag small{font-size:14px;font-weight:500;color:var(--mut);letter-spacing:0}
.priceCard ul{list-style:none;margin:18px 0 22px;padding:0}
.priceCard li{font-size:15px;line-height:1.5;color:var(--mut);padding:7px 0;border-bottom:1px solid var(--line)}
.priceCard li:last-child{border-bottom:none}
.priceNote{font-family:var(--font-mono);font-size:11.5px;color:var(--mut);margin:0}
.btn{display:inline-flex;align-items:center;gap:9px;background:var(--ink);color:var(--paper);
padding:11px 18px;font-size:14.5px;font-weight:600;border:1px solid var(--ink);margin-top:auto;align-self:flex-start}
.btn:hover{background:var(--accent);border-color:var(--accent);color:#fff}
.btn.ghost{background:none;color:var(--ink)}
.btn.ghost:hover{background:none;color:var(--accent);border-color:var(--accent)}
/* FAQ facturation — natif, sans JavaScript */
.faq{border-top:1px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:20px;
padding:20px 4px;border-bottom:1px solid var(--line);font-size:clamp(16px,1.5vw,19px);font-weight:600;letter-spacing:-.01em}
.faq summary::-webkit-details-marker{display:none}
.faq summary::marker{content:''}
.faq summary::after{content:'+';font-family:var(--font-mono);font-size:21px;color:var(--accent);line-height:1}
.faq[open] summary::after{content:'\2013'}
.faq summary:hover{color:var(--accent)}
.faq > p,.faq > div,.faq > ul{padding:18px 4px 24px;max-width:70ch;font-size:16px;line-height:1.6;color:var(--mut);margin:0}
@media (max-width:720px){
.priceGrid{grid-template-columns:1fr}
}