/* ============================================================
   Vokai — feuille de style (refonte « SaaS institutionnel net »)
   Voir DESIGN.md. Thème clair uniquement. Zéro ressource tierce.
   ============================================================ */

/* --- Polices auto-hébergées (CSP : font-src 'self') --- */
@font-face{font-family:"Plus Jakarta Sans";src:url("/assets/fonts/plus-jakarta-sans-latin.woff2") format("woff2");font-weight:200 800;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+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Plus Jakarta Sans";src:url("/assets/fonts/plus-jakarta-sans-latin-ext.woff2") format("woff2");font-weight:200 800;font-style:normal;font-display:swap;unicode-range:U+0100-02AF,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}

/* --- Tokens --- */
:root{
  color-scheme:light;
  --bg:#FFFFFF;--bg-subtle:#F5F7FE;--bg-sunken:#EEF2FD;--bg-deep:#0E1533;--bg-deep-2:#1A2450;
  --ink:#141A33;--ink-2:#3D486A;--muted:#5C6A8A;--on-deep:#EEF1FF;--on-deep-muted:#AAB4E0;
  --line:#E4E8F5;--line-strong:#CBD4EC;
  --brand:#4C6EF5;--brand-ink:#3A54D6;--brand-strong:#2C3EB0;--brand-weak:#EDF0FE;--brand-weak-bd:#D4DCFB;
  --brand-glow:rgba(76,110,245,.14);
  --grad:linear-gradient(96deg,#4C6EF5 0%,#6B5CF6 52%,#8E7BFF 100%);
  --success:#0E7A46;--danger:#B42318;
  --warn-bg:#FFF6D9;--warn-ink:#6B4E00;--warn-bd:#DAC98E;
  --focus:#14183A;
  --shadow-xs:0 1px 2px rgba(16,24,64,.06);
  --shadow-sm:0 2px 8px rgba(16,24,64,.06),0 1px 2px rgba(16,24,64,.04);
  --shadow-md:0 14px 34px -10px rgba(20,26,58,.16),0 4px 12px -4px rgba(20,26,58,.08);
  --shadow-lg:0 36px 68px -18px rgba(20,26,58,.24),0 12px 24px -10px rgba(20,26,58,.12);
  --shadow-brand:0 10px 26px -8px rgba(76,110,245,.42);
  --r-sm:10px;--r-md:13px;--r-lg:20px;--r-xl:28px;--r-pill:999px;--radius:var(--r-lg);
  /* alias hérités */
  --primary:var(--brand);--primary-dark:var(--brand-ink);--bg2:var(--bg-subtle);--field:var(--line-strong);--green:var(--success)
}

/* --- Reset / base --- */
*,*::before,*::after{box-sizing:border-box}
html{scroll-padding-top:110px}
@media(prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
body{margin:0;background:var(--bg);color:var(--ink-2);font-family:"Plus Jakarta Sans",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;font-size:1rem;line-height:1.65;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}
h1,h2,h3,p,ul,dl{margin-top:0}
h1,h2,h3{color:var(--ink);line-height:1.15;letter-spacing:-.025em;text-wrap:balance}
h1{font-size:clamp(2.5rem,1.8rem + 3vw,3.85rem);font-weight:800;letter-spacing:-.03em;line-height:1.08;margin-bottom:24px}
h2{font-size:clamp(1.85rem,1.15rem + 2.2vw,2.6rem);font-weight:780;letter-spacing:-.025em}
h3{font-size:1.16rem;font-weight:700;letter-spacing:-.01em;line-height:1.35}
p{text-wrap:pretty}
a{color:var(--brand);text-underline-offset:.2em;text-decoration-thickness:1px}
a:hover{color:var(--brand-ink);text-decoration-thickness:2px}
button,input,textarea,select{font:inherit}
button,a,input,summary{touch-action:manipulation}
button{cursor:pointer}
button:disabled{cursor:default}
img{max-width:100%;height:auto}
button,a{-webkit-tap-highlight-color:transparent}
[hidden]{display:none!important}
:focus-visible{outline:3px solid var(--focus);outline-offset:3px;box-shadow:0 0 0 2px #fff}
section[id],h2[id]{scroll-margin-top:110px}
main:focus{outline:none}
.container{max-width:1180px;padding-inline:28px;margin-inline:auto}
.gradient-text{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
.skip-link{position:fixed;top:12px;left:12px;transform:translateY(-200%);z-index:1000;background:#fff;color:var(--ink);padding:12px 20px;border:2px solid var(--brand);border-radius:var(--r-sm);font-weight:600}
.skip-link:focus{transform:none}
.review-notice{margin:0;padding:10px 24px;text-align:center;background:var(--warn-bg);color:var(--warn-ink);font-size:.875rem;border-bottom:1px solid var(--warn-bd)}

/* --- Icônes SVG inline --- */
svg[data-i]{fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}
svg[data-i] [data-fill]{fill:currentColor;stroke:none}

/* --- Navbar --- */
.navbar{position:sticky;top:0;z-index:100;background:rgba(255,255,255,.88);background:color-mix(in srgb,var(--bg) 88%,transparent);-webkit-backdrop-filter:blur(10px) saturate(1.4);backdrop-filter:blur(10px) saturate(1.4);border-bottom:1px solid transparent;transition:border-color .2s ease,box-shadow .2s ease}
.navbar.scrolled{border-bottom-color:var(--line);box-shadow:var(--shadow-sm)}
.navbar-inner{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:80px}
.navbar-logo,.footer-logo{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink);font-size:1.15rem;font-weight:800;letter-spacing:.01em}
.navbar-logo img,.footer-logo img{width:30px;height:30px;object-fit:contain}
.navbar-links{display:flex;gap:22px;list-style:none;padding:0;margin:0}
.navbar-links a{position:relative;font-size:.9rem;text-decoration:none;color:var(--muted);font-weight:600}
.navbar-links a::after{content:"";position:absolute;left:0;right:100%;bottom:-6px;height:2px;background:var(--brand);transition:right .18s ease}
.navbar-links a:hover{color:var(--ink)}
.navbar-links a:hover::after{right:0}
.navbar-right{display:flex;align-items:center;gap:14px}
.lang-toggle{display:flex;border:1px solid var(--line-strong);border-radius:var(--r-sm);overflow:hidden}
.lang-btn{border:0;background:transparent;min-width:44px;min-height:44px;color:var(--muted);font-size:.875rem;font-weight:700;transition:background-color .15s ease,color .15s ease}
.lang-btn:hover{background:var(--bg-subtle);color:var(--ink)}
.lang-btn.active{background:var(--brand);color:#fff}
.lang-btn:focus-visible{outline-offset:-5px;outline-color:var(--ink)}
.nav-toggle{display:none;border:1px solid var(--line-strong);border-radius:var(--r-sm);background:#fff;width:44px;height:44px;padding:10px}
.nav-toggle:hover{background:var(--bg-subtle)}
.nav-toggle span{display:block;height:2px;background:var(--ink);margin:4px 0;border-radius:2px}
.mobile-nav{padding:12px 24px 16px;background:#fff;border-bottom:1px solid var(--line);position:sticky;top:80px;z-index:99}
.mobile-nav a{display:block;padding:12px;font-weight:600;color:var(--ink);text-decoration:none;border-radius:var(--r-sm)}
.mobile-nav a:hover{background:var(--bg-subtle)}
.mobile-nav .mobile-nav-cta{margin-top:8px;color:#fff}
.mobile-nav .mobile-nav-cta:hover{background:var(--brand-ink)}

/* --- Boutons --- */
.btn-primary,.btn-ghost,.btn-outline,.form-submit,.mobile-nav-cta{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:46px;padding:12px 22px;border-radius:var(--r-md);border:1px solid transparent;text-decoration:none;line-height:1.4;font-size:.9375rem;font-weight:700;text-align:center;white-space:normal;transition:transform .16s ease,box-shadow .16s ease,background-color .16s ease,border-color .16s ease}
.btn-primary,.form-submit,.featured-btn,.mobile-nav-cta{background:var(--brand);color:#fff;box-shadow:var(--shadow-brand)}
.btn-primary:hover,.form-submit:hover,.featured-btn:hover,.mobile-nav-cta:hover{background:var(--brand-ink);color:#fff;transform:translateY(-1px);box-shadow:var(--shadow-md)}
.btn-primary:active,.form-submit:active,.featured-btn:active,.mobile-nav-cta:active{transform:translateY(0);box-shadow:var(--shadow-xs)}
.btn-ghost,.btn-outline{background:transparent;color:var(--ink);border-color:var(--line-strong)}
.btn-ghost:hover,.btn-outline:hover{background:var(--bg-subtle);color:var(--ink);border-color:var(--brand-weak-bd)}
.btn-ghost:active,.btn-outline:active{background:var(--bg-sunken)}
.btn-outline{width:100%}
.btn-outline.featured-btn{background:var(--brand);border-color:var(--brand);color:#fff}
.btn-outline.featured-btn:hover{background:var(--brand-ink);border-color:var(--brand-ink)}
.form-submit{width:100%}
.btn-primary:disabled,.form-submit:disabled,.btn-ghost:disabled,.btn-outline:disabled{opacity:.55;box-shadow:none;transform:none}
.text-button{padding:8px 0;background:none;border:0;text-decoration:underline;text-underline-offset:.2em;color:var(--brand);font-size:inherit;font-weight:600}
.text-button:hover{color:var(--brand-ink)}

/* --- Héro --- */
.hero{position:relative;padding:clamp(56px,7vw,92px) 0 clamp(68px,9vw,108px);overflow:hidden}
.hero::before{content:"";position:absolute;inset:0;background:radial-gradient(60% 55% at 12% 0%,var(--brand-glow),transparent 70%);pointer-events:none}
.hero>.container{position:relative}
.hero-inner{display:grid;grid-template-columns:1.15fr 1fr;gap:clamp(36px,5vw,72px);align-items:center}
.hero-eyebrow{display:inline-flex;gap:8px;align-items:center;color:var(--brand-strong);background:var(--brand-weak);padding:7px 14px;border:1px solid var(--brand-weak-bd);border-radius:var(--r-pill);font-size:.8125rem;font-weight:600;margin-bottom:24px}
.hero-eyebrow svg{width:15px;height:15px;color:var(--brand);flex:none}
.hero h1{margin-bottom:22px}
.hero-sub{font-size:1.15rem;color:var(--ink-2);max-width:540px;margin-bottom:24px;line-height:1.6}
.hero-badges,.hero-buttons{display:flex;gap:14px 22px;flex-wrap:wrap;margin-top:24px}
.hero-badge{font-size:.875rem;color:var(--muted);display:inline-flex;gap:7px;align-items:center}
.hero-badge svg{width:15px;height:15px;color:var(--brand);flex:none}
.call-card{position:relative;background:linear-gradient(160deg,var(--bg-deep-2),var(--bg-deep) 62%);color:var(--on-deep);padding:32px;border-radius:var(--r-xl);box-shadow:var(--shadow-lg);border:1px solid rgba(255,255,255,.09);min-height:346px;overflow:hidden}
.call-card::before{content:"";position:absolute;inset:0;background:radial-gradient(58% 45% at 14% 0%,rgba(76,110,245,.38),transparent 72%);pointer-events:none}
.call-card>*{position:relative}
.call-status{display:flex;gap:10px;align-items:center;font-size:.875rem;color:var(--on-deep-muted);margin-bottom:28px}
.status-dot{height:8px;width:8px;background:var(--success);border-radius:50%;box-shadow:0 0 0 0 rgba(14,122,70,.5);animation:dotPulse 2.4s ease-out infinite}
.call-step-icon{margin-bottom:16px;width:44px;height:44px;display:grid;place-items:center;border-radius:var(--r-md);background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);color:#fff}
.call-step-icon svg{width:22px;height:22px}
.call-step-label{color:#C1CAFF;font-size:.875rem;font-weight:700;margin-bottom:8px;letter-spacing:.02em}
.call-step-title{font-size:1.4rem;font-weight:700;line-height:1.3;margin-bottom:12px;color:#fff}
.call-step-sub{color:var(--on-deep-muted);font-size:1rem;min-height:80px;line-height:1.55}
.call-step{animation:stepIn .35s ease}
.demo-controls{display:flex;gap:12px;justify-content:space-between;margin-top:22px}
.demo-controls button{min-height:44px;border:1px solid rgba(255,255,255,.22);color:#fff;background:transparent;border-radius:var(--r-sm);padding:8px 12px;font-size:.875rem;transition:background-color .15s ease}
.demo-controls button:hover{background:rgba(255,255,255,.1)}
.demo-controls button:focus-visible{outline-color:#fff;box-shadow:none}

/* --- Sections --- */
.section,.savings-section,.automation-section{padding:clamp(60px,8vw,96px) 0}
.alt-bg{background:var(--bg-subtle)}
.section-header{margin-bottom:38px;max-width:720px}
.section-header.centered{text-align:center;margin-left:auto;margin-right:auto;margin-bottom:44px}
.section-eyebrow{font-size:.8125rem;letter-spacing:.09em;text-transform:uppercase;color:var(--brand);font-weight:700;margin-bottom:14px}
.section-eyebrow::before{content:"— "}
.section-title{margin-bottom:16px}
.section-sub{font-size:1.0625rem;color:var(--ink-2);margin-bottom:0}

/* --- Cartes / grilles --- */
.problem-grid,.features-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.features-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
.prob-card,.feat-card,.hiw-card,.price-card{border:1px solid var(--line);border-radius:var(--r-lg);padding:28px;background:var(--bg);box-shadow:var(--shadow-sm);transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}
.feat-card{padding:24px}
.prob-card:hover,.feat-card:hover,.hiw-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-md);border-color:var(--brand-weak-bd)}
.prob-icon,.feat-icon{width:44px;height:44px;display:grid;place-items:center;border-radius:var(--r-md);background:var(--brand-weak);border:1px solid var(--brand-weak-bd);color:var(--brand);margin-bottom:16px}
.prob-icon svg,.feat-icon svg{width:22px;height:22px}
.prob-title,.feat-title,.hiw-title{margin-bottom:10px;color:var(--ink)}
.prob-desc,.feat-desc,.hiw-desc,.price-desc{color:var(--ink-2)}
.hiw-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.hiw-badge,.automation-simple-number{width:44px;height:44px;display:grid;place-items:center;border:1px solid var(--brand-weak-bd);border-radius:var(--r-md);background:var(--brand-weak);color:var(--brand-strong);font-weight:800;font-size:.95rem;margin-bottom:22px}
.automation-simple-list{border-top:1px solid var(--line)}
.automation-simple-item{display:grid;grid-template-columns:64px 1fr;gap:20px;padding:28px 0;border-bottom:1px solid var(--line)}
.automation-simple-number{margin:0}
.automation-simple-title{margin-bottom:10px;color:var(--ink)}
.automation-simple-desc{color:var(--ink-2);margin:0;max-width:820px}
.automation-note{margin:24px 0 0;color:var(--muted);font-size:.9375rem}

/* --- Marquee industries --- */
.marquee-wrapper{-webkit-mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent)}
.marquee-row{overflow:hidden}
.marquee-row+.marquee-row{margin-top:12px}
.marquee-track{display:flex;gap:12px;width:max-content;animation:marquee 42s linear infinite}
.marquee-track.track-r{animation-direction:reverse}
.marquee-row:hover .marquee-track,.marquee-track:focus-within{animation-play-state:paused}
.marquee-item{display:flex;align-items:center;gap:10px;padding:11px 18px;border:1px solid var(--line);border-radius:var(--r-pill);background:var(--bg);font-size:.9375rem;font-weight:600;color:var(--ink-2);white-space:nowrap}
.mi-name{white-space:nowrap}

/* --- Table comparative --- */
.table-scroll{overflow:auto;border:1px solid var(--line);border-radius:var(--r-md);background:var(--bg)}
.comp-table{width:100%;border-collapse:collapse;min-width:540px;text-align:left}
.comp-table caption{text-align:left;padding:18px 22px;color:var(--muted);font-size:.9375rem}
.comp-table th,.comp-table td{padding:16px 22px;border-top:1px solid var(--line);vertical-align:top}
.comp-table thead th{background:var(--bg-sunken);color:var(--ink);font-weight:700;border-top:0}
.comp-table th[scope=row]{color:var(--ink);font-weight:600}
.comp-table td{color:var(--ink-2)}

/* --- Tarifs --- */
.pricing-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.price-card{display:flex;flex-direction:column}
.price-card.featured{background:var(--brand-weak);border:1.5px solid var(--brand);box-shadow:var(--shadow-md)}
.price-plan{font-size:1.5rem;margin:0 0 14px;color:var(--ink)}
.price-badge{font-size:.8125rem;font-weight:650;color:#fff;background:var(--brand);align-self:flex-start;padding:5px 14px;border-radius:var(--r-pill);margin-bottom:20px}
.price-features{padding-left:20px;color:var(--ink-2);flex:1;margin:0}
.price-features li{margin:10px 0}
.price-features li::marker{color:var(--brand)}
.price-card .btn-outline{margin-top:16px}
.pricing-note{margin:24px 0 0;color:var(--muted);font-size:.9375rem}

/* --- FAQ --- */
.faq-list{max-width:840px;margin:auto}
.faq-item{border:1px solid var(--line);background:var(--bg);border-radius:var(--r-md);margin-bottom:12px;transition:border-color .15s ease,background-color .15s ease}
.faq-item[open]{border-color:var(--brand-weak-bd);background:var(--brand-weak)}
.faq-q{list-style:none;display:flex;gap:20px;justify-content:space-between;padding:20px 22px;font-weight:650;color:var(--ink);cursor:pointer}
.faq-q::-webkit-details-marker{display:none}
.faq-arrow{font-size:1.5rem;line-height:1;flex-shrink:0;color:var(--brand);transition:transform .2s ease}
.faq-item[open] .faq-arrow{transform:rotate(45deg)}
.faq-a{padding:0 22px 20px;color:var(--ink-2)}
.faq-a-inner{animation:faqIn .2s ease}

/* --- Calculateur --- */
.savings-shell{padding:clamp(22px,3vw,32px);border:1px solid var(--line);border-radius:var(--r-lg);background:var(--bg-subtle)}
.savings-controls{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 40px}
.saving-label-row{display:flex;justify-content:space-between;gap:16px;margin-bottom:8px}
.saving-label-row label{font-weight:600;color:var(--ink)}
.saving-label-row output{color:var(--brand-strong);font-weight:750;white-space:nowrap}
.saving-range{width:100%;min-height:44px;accent-color:var(--brand);cursor:pointer}
.savings-metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin:32px 0}
.saving-metric{padding:24px;background:var(--bg);border:1px solid var(--line);border-radius:var(--r-md);box-shadow:var(--shadow-xs)}
.saving-value{font-size:clamp(2rem,1.4rem + 1.8vw,2.6rem);color:var(--brand-strong);font-weight:780;line-height:1.15;letter-spacing:-.02em;margin-bottom:10px;font-variant-numeric:tabular-nums}
.saving-label{color:var(--muted);font-size:.9375rem}
.savings-note,.savings-formula{font-size:.9375rem;color:var(--muted)}
.savings-note{border-left:3px solid var(--brand);padding-left:16px}
.savings-formula{margin-bottom:0}

/* --- CTA + formulaires --- */
.cta-section{padding:clamp(60px,8vw,96px) 0;background:linear-gradient(var(--bg),var(--bg-subtle))}
.cta-section>.container>div:first-child{text-align:center}
.cta-title{max-width:760px;margin:0 auto 18px}
.cta-sub{max-width:660px;margin:0 auto 24px;font-size:1.0625rem;color:var(--ink-2)}
.trust-strip{display:flex;justify-content:center;gap:10px 20px;flex-wrap:wrap;color:var(--muted);font-size:.9375rem;margin-bottom:32px}
.contact-form{max-width:720px;margin:auto;padding:32px;background:var(--bg);border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--shadow-sm)}
.form-group{margin-bottom:22px}
.form-label{display:block;font-weight:650;margin-bottom:8px;color:var(--ink)}
.form-input{display:block;width:100%;min-height:48px;padding:12px 14px;color:var(--ink);background:var(--bg);border:1px solid var(--line-strong);border-radius:var(--r-sm);transition:border-color .15s ease,box-shadow .15s ease}
.form-input::placeholder{color:var(--muted)}
.form-input:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-weak)}
textarea.form-input{resize:vertical}
.form-input[aria-invalid=true]{border-color:var(--danger);box-shadow:0 0 0 3px rgba(180,35,24,.12)}
.field-error{color:var(--danger);font-weight:600;font-size:.9375rem;margin:8px 0 0}
.field-error:empty{display:none}
.field-hint,.form-note{font-size:.9375rem;color:var(--muted);margin:8px 0 0}
.form-note{margin-bottom:22px}
.consent-label{display:grid;grid-template-columns:22px 1fr;gap:14px;align-items:start;cursor:pointer}
.consent-label input{width:22px;height:22px;margin:3px 0;accent-color:var(--brand)}
.form-status{margin:16px 0 0;color:var(--muted)}
.form-actions{display:flex;gap:12px;flex-wrap:wrap;margin:20px 0}
.form-actions>*{flex:1}
#email-preview>p{color:var(--ink-2)}
#email-draft{margin-top:8px}

/* --- Footer --- */
.footer{padding:60px 0 28px;background:var(--bg-subtle);border-top:1px solid var(--line)}
.footer-inner{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:44px;margin-bottom:36px}
.footer-logo{margin-bottom:16px}
.footer-desc{max-width:330px;color:var(--ink-2)}
.footer-col-title{font-weight:750;margin-bottom:16px;color:var(--ink)}
.footer-links{padding:0;list-style:none;margin:0}
.footer-links li{margin:8px 0}
.footer-links a,.footer-contact-item{font-size:.9375rem;color:var(--muted);text-decoration:none}
.footer-links a:hover{color:var(--ink)}
.footer-contact-item{display:flex;align-items:center;gap:7px;margin-bottom:12px}
.footer-contact-item svg{width:15px;height:15px;color:var(--brand);flex:none}
.policy-links{display:flex;gap:12px 24px;flex-wrap:wrap;padding:20px 0;border-top:1px solid var(--line);align-items:center;font-size:.9375rem}
.policy-links a{color:var(--muted);text-decoration:none}
.policy-links a:hover{color:var(--ink)}
.policy-links a,.policy-links button{padding-block:8px}
.footer-bottom{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;padding-top:24px;border-top:1px solid var(--line);font-size:.875rem;color:var(--muted)}
.canada-badge{display:inline-flex;align-items:center;gap:7px}
.canada-badge svg{width:15px;height:16px;color:var(--brand);flex:none}

/* --- Dialog --- */
dialog{width:min(680px,calc(100% - 32px));max-height:calc(100dvh - 48px);padding:28px;border:1px solid var(--line-strong);border-radius:var(--r-lg);color:var(--ink-2);overflow:auto;background:var(--bg);box-shadow:var(--shadow-lg)}
dialog::backdrop{background:rgba(14,21,51,.55)}
.dialog-header{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}
.dialog-header h2{font-size:1.6rem;margin-bottom:24px}
.dialog-header button{min-height:44px;padding:9px 14px}
.privacy-categories{display:grid;grid-template-columns:1fr 1fr;gap:12px;border-block:1px solid var(--line);padding:20px 0}
.privacy-categories dt{font-weight:700;color:var(--ink)}
.privacy-categories dd{margin:0;color:var(--ink-2)}
#privacy-status{font-weight:600;color:var(--success)}

/* --- Pages légales --- */
.legal-main{padding:56px 0 90px}
.legal-layout{display:grid;grid-template-columns:230px minmax(0,760px);gap:64px;justify-content:center}
.legal-nav{position:sticky;top:112px;align-self:start;display:flex;flex-direction:column;gap:4px}
.legal-nav a{padding:10px 12px;font-size:.9375rem;border-radius:var(--r-sm);text-decoration:none;color:var(--muted)}
.legal-nav a:hover{background:var(--bg-subtle);color:var(--ink)}
.legal-nav a[aria-current=page]{background:var(--brand-weak);color:var(--brand-strong);font-weight:700}
.legal-content h1{font-size:clamp(2rem,4vw,3.1rem);margin-bottom:18px}
.legal-content h2{font-size:1.4rem;margin:2.4rem 0 14px}
.legal-content h3{margin:22px 0 12px}
.legal-content p,.legal-content li{color:var(--ink-2)}
.legal-content li{margin:10px 0}
.legal-content a{overflow-wrap:anywhere}
.legal-date{font-size:.9375rem;color:var(--muted)}
.legal-draft{background:var(--warn-bg);border:1px solid var(--warn-bd);padding:18px;border-radius:var(--r-md);color:var(--warn-ink)!important}
.business-data{display:grid;grid-template-columns:180px 1fr;gap:16px;margin:28px 0}
.business-data dt{font-weight:750;color:var(--ink)}
.business-data dd{margin:0;color:var(--ink-2)}
.legal-toc{padding:20px 24px;background:var(--bg-subtle);border:1px solid var(--line);border-radius:var(--r-md)}
.legal-toc a{display:block;padding:5px 0}
.legal-solo{max-width:760px;margin-inline:auto}
.breadcrumb{font-size:.875rem;color:var(--muted);margin-bottom:20px;display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.breadcrumb a{color:var(--muted)}
.breadcrumb a:hover{color:var(--ink)}
.breadcrumb span[aria-hidden]{color:var(--line-strong)}

/* --- Réservation appel découverte --- */
.booking-card{max-width:720px;margin:0 auto 24px;padding:32px;background:var(--bg);border:1px solid var(--line);border-top:4px solid var(--brand);border-radius:var(--r-lg);box-shadow:var(--shadow-sm);text-align:left}
.booking-card h3{font-size:1.35rem;margin-bottom:14px;color:var(--ink)}
.booking-card h4{font-size:1.2rem;margin:0 0 16px;color:var(--ink)}
.booking-intro{color:var(--ink-2);margin-bottom:28px}
.booking-fields{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.booking-fields .form-group{margin-bottom:0}
.booking-card .form-group{margin-bottom:22px}
.booking-card .form-submit{margin-top:4px}
.booking-card #booking-next{border-top:1px solid var(--line);padding-top:24px}
.booking-card #booking-email-draft{margin-top:8px}
.contact-alternative{max-width:720px;margin:28px auto 0;border:1px solid var(--line);border-radius:var(--r-md);background:var(--bg)}
.contact-alternative>summary{cursor:pointer;padding:20px 24px;color:var(--ink);font-weight:650}
.contact-alternative .contact-form{box-shadow:none;border:0;border-top:1px solid var(--line);border-radius:0 0 var(--r-md) var(--r-md)}
.booking-followup{margin-top:28px;padding-top:24px;border-top:1px solid var(--line)}
.booking-followup .btn-primary{width:100%}

/* --- Utilitaires / animations d'entrée --- */
.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.js .reveal,.js .hero-animate-left,.js .hero-animate-right{opacity:0}
.js .reveal{transform:translateY(16px);transition:opacity .5s ease,transform .5s ease}
.js .hero-animate-left,.js .hero-animate-right{transform:translateY(14px);transition:opacity .6s ease,transform .6s ease}
.js .hero-animate-right{transition-delay:.08s}
.js .reveal.is-visible,.js .hero-animate-left.is-visible,.js .hero-animate-right.is-visible{opacity:1;transform:none}
.js .reveal.d1{transition-delay:.06s}
.js .reveal.d2{transition-delay:.12s}
.js .reveal.d3{transition-delay:.18s}
.js .reveal.d4{transition-delay:.24s}

@keyframes marquee{to{transform:translateX(calc(-50% - 6px))}}
@keyframes stepIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@keyframes faqIn{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
@keyframes dotPulse{0%{box-shadow:0 0 0 0 rgba(14,122,70,.5)}70%{box-shadow:0 0 0 7px rgba(14,122,70,0)}100%{box-shadow:0 0 0 0 rgba(14,122,70,0)}}

/* --- Responsive --- */
@media(max-width:1080px){
 .navbar-links{gap:14px}
 .navbar-right .btn-primary{display:none}
 .hero-inner{gap:36px}
 .features-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .pricing-grid{gap:16px}
 .price-card{padding:24px}
 .legal-layout{gap:32px}
}
@media(min-width:1081px){.price-card.featured{transform:scale(1.03)}}
@media(max-width:768px){
 html{scroll-padding-top:100px}
 .container{padding-inline:20px}
 .navbar-inner{min-height:72px;gap:12px}
 .navbar-links{display:none}
 .nav-toggle{display:block;margin-left:auto}
 .navbar-right{gap:10px}
 .mobile-nav{top:72px}
 .hero{padding:52px 0 64px}
 .hero-inner{grid-template-columns:1fr;gap:40px}
 .hero-right{width:100%;max-width:530px}
 .section,.savings-section,.automation-section,.cta-section{padding:56px 0}
 .hiw-row,.pricing-grid,.problem-grid{grid-template-columns:1fr}
 .features-grid{gap:16px}
 .price-card{padding:26px}
 .footer-inner{grid-template-columns:1fr 1fr;gap:24px}
 .footer-inner>div:first-child{grid-column:1/-1}
 .savings-controls{grid-template-columns:1fr;gap:20px}
 .savings-metrics{grid-template-columns:1fr;gap:12px}
 .contact-form{padding:24px}
 .legal-layout{grid-template-columns:1fr}
 .legal-nav{position:static;flex-direction:row;flex-wrap:wrap;gap:6px}
 .legal-nav a{font-size:.875rem;padding:8px 10px}
 .legal-main{padding-top:32px}
 .business-data{grid-template-columns:1fr;gap:8px}
 .business-data dd{margin-bottom:12px}
}
@media(max-width:420px){
 .container{padding-inline:16px}
 .hero-buttons>*{width:100%}
 .features-grid{grid-template-columns:1fr}
 .call-card{padding:24px}
 .demo-controls{flex-direction:column}
 .navbar-logo-text{font-size:1rem}
 .navbar-logo{gap:6px}
 .navbar-logo img{width:26px;height:26px}
 .lang-btn{min-width:40px}
 .contact-form{padding:20px}
 .form-actions{flex-direction:column}
 .footer-inner{grid-template-columns:1fr}
 .footer-inner>div:first-child{grid-column:auto}
 .review-notice{padding:10px 16px}
 .privacy-categories{grid-template-columns:1fr}
 dialog{padding:20px}
 .dialog-header{flex-wrap:wrap}
 .automation-simple-item{grid-template-columns:44px 1fr;gap:16px}
 .booking-fields{grid-template-columns:1fr;gap:0}
}
@media(prefers-reduced-motion:reduce){
 html{scroll-behavior:auto}
 *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;transition-delay:0ms!important}
 .marquee-track{animation:none;flex-wrap:wrap;width:auto}
 .marquee-item[data-dup]{display:none}
 .js .reveal,.js .hero-animate-left,.js .hero-animate-right{opacity:1;transform:none}
}
@media(forced-colors:active){
 .btn-primary,.form-submit,.mobile-nav-cta{border:2px solid ButtonText}
 .gradient-text{color:CanvasText;-webkit-text-fill-color:CanvasText;background:none}
 .call-card{border:1px solid CanvasText}
 .status-dot{background:CanvasText}
 .prob-icon,.feat-icon,.call-step-icon,.hiw-badge,.automation-simple-number{border:1px solid CanvasText}
}
@media print{
 .navbar,.mobile-nav,.review-notice,.legal-nav,dialog,.demo-controls,.marquee-wrapper{display:none!important}
 .legal-layout{display:block}
 .legal-main{padding:0}
 .container{padding:0}
 .footer{background:#fff}
 .legal-content a{color:inherit}
 .call-card{color:#000;background:#fff}
 .call-step-sub,.call-status,.call-step-label,.call-step-title{color:#000}
}
