.ai-page{background:var(--bg);color:var(--ink)}
.ai-hero{min-height:auto;display:flex;align-items:center;padding:clamp(104px,11vw,138px) 0 clamp(54px,7vw,82px);overflow:hidden;background:radial-gradient(ellipse at 12% 8%,rgba(47,107,255,.24),transparent 42%),radial-gradient(ellipse at 82% 22%,rgba(139,92,255,.20),transparent 44%),linear-gradient(180deg,rgba(12,18,51,.98) 0%,rgba(17,24,64,.94) 100%)}
.ai-hero-grid{display:grid;grid-template-columns:minmax(0,1.15fr) 380px;gap:clamp(32px,6vw,76px);align-items:center}
.ai-kicker{display:inline-flex;align-items:center;gap:10px;padding:8px 14px;border:1px solid var(--border-blue);border-radius:999px;background:rgba(255,255,255,.82);color:var(--accent);font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;box-shadow:var(--shadow-sm)}
.ai-kicker::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--success);box-shadow:0 0 0 4px rgba(14,159,110,.14)}
.ai-h1{margin:24px 0 22px;font-size:clamp(42px,7vw,82px);line-height:.98;letter-spacing:-.04em;color:var(--ink)}
.ai-h1 em,.ai-h2 em{font-family:var(--font-serif);font-weight:400;font-style:italic;background:var(--gradient-text);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
.ai-lead{max-width:720px;font-size:clamp(17px,2vw,21px);line-height:1.62;color:var(--ink-3)}
.ai-bullets{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:30px 0 34px;max-width:760px;list-style:none}
.ai-bullets li{display:flex;align-items:center;gap:10px;padding:12px 14px;border:1px solid var(--border);border-radius:14px;background:rgba(255,255,255,.84);box-shadow:var(--shadow-xs);color:var(--ink-3);font-weight:600;font-size:14px}
.ai-bullets li::before{content:"";width:14px;height:8px;border-left:2px solid var(--success);border-bottom:2px solid var(--success);transform:rotate(-45deg);flex:0 0 auto}
.ai-actions{display:flex;flex-wrap:wrap;gap:12px}
.ai-actions-center{justify-content:center}
.ai-hero-panel{border:1px solid var(--border-blue);border-radius:28px;background:rgba(255,255,255,.9);box-shadow:var(--shadow-xl);padding:26px}
.ai-panel-top{display:flex;align-items:center;gap:14px;margin-bottom:20px}
.ai-panel-mark{width:52px;height:52px;border-radius:16px;display:grid;place-items:center;background:var(--gradient-main);color:#fff;font-size:24px;box-shadow:0 14px 32px rgba(47,107,255,.22)}
.ai-panel-title{font-weight:800;color:var(--ink);letter-spacing:-.02em}
.ai-panel-sub{font-size:13px;color:var(--ink-4)}
.ai-panel-list{list-style:none;display:grid;gap:12px}
.ai-panel-list li{display:flex;justify-content:space-between;gap:16px;padding:13px 0;border-top:1px solid var(--border-soft);font-size:14px}
.ai-panel-list span:first-child{color:var(--ink-4);font-weight:700;text-transform:uppercase;font-size:11px;letter-spacing:.08em}
.ai-panel-list span:last-child{color:var(--ink);font-weight:700;text-align:right}
.ai-proof{padding:0 0 clamp(64px,8vw,96px)}
.ai-proof-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.ai-proof-item{padding:24px;border:1px solid var(--border);border-radius:22px;background:#fff;box-shadow:var(--shadow-md);text-align:center}
.ai-proof-value{font-size:clamp(34px,4vw,52px);line-height:1;font-weight:850;letter-spacing:-.04em;background:var(--gradient-text);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
.ai-proof-label{margin-top:8px;font-size:12px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--ink)}
.ai-proof-copy{margin-top:4px;color:var(--ink-4);font-size:14px}
.ai-section{padding:clamp(76px,9vw,112px) 0}
.ai-section-alt{background:linear-gradient(180deg,#fff 0%,var(--bg-section-2) 100%)}
.ai-head{max-width:760px;margin:0 auto 44px;text-align:center}
.ai-head .ai-kicker{margin-bottom:18px}
.ai-h2{font-size:clamp(32px,5vw,56px);line-height:1.06;letter-spacing:-.035em;color:var(--ink)}
.ai-head p,.ai-muted{margin:16px auto 0;max-width:680px;color:var(--ink-3);font-size:clamp(16px,1.8vw,19px);line-height:1.7}
.ai-split{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.ai-card{border:1px solid var(--border);border-radius:24px;background:#fff;padding:clamp(22px,3vw,32px);box-shadow:var(--shadow-md)}
.ai-card h3{margin-bottom:18px;font-size:22px;letter-spacing:-.02em;color:var(--ink)}
.ai-list{list-style:none;display:grid;gap:14px}
.ai-list li{position:relative;padding-left:28px;color:var(--ink-3);line-height:1.55}
.ai-list li::before{position:absolute;left:0;top:0;font-weight:800}
.ai-list.bad li::before{content:"×";color:var(--error)}
.ai-list.good li::before{content:"✓";color:var(--success)}
.ai-list strong{color:var(--ink)}
.ai-agents{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.ai-agent{display:flex;flex-direction:column;gap:16px;border:1px solid var(--border);border-radius:24px;background:#fff;padding:26px;box-shadow:var(--shadow-md);transition:transform .24s var(--ease),box-shadow .24s var(--ease),border-color .24s var(--ease)}
.ai-agent:hover{transform:translateY(-4px);border-color:var(--border-blue);box-shadow:var(--shadow-xl)}
.ai-agent:nth-child(2){grid-column:span 2}
.ai-agent-icon{width:46px;height:46px;border-radius:14px;display:grid;place-items:center;background:var(--gradient-soft);border:1px solid var(--border-blue);font-size:22px}
.ai-agent h3{font-size:21px;line-height:1.15;letter-spacing:-.02em;color:var(--ink)}
.ai-agent h3 span{display:block;margin-top:8px;font-size:16px;font-weight:700;color:var(--ink-3)}
.ai-agent p{color:var(--ink-3);line-height:1.65}
.ai-agent-meta{display:grid;gap:10px;margin-top:auto}
.ai-agent-meta p{margin:0;padding-top:10px;border-top:1px solid var(--border-soft);font-size:14px}
.ai-note{margin:30px auto 0;max-width:820px;border:1px solid var(--border-blue);border-radius:22px;background:var(--surface-blue);padding:20px 24px;color:var(--ink-3);line-height:1.65}
.ai-note a{color:var(--accent);font-weight:800;text-decoration:underline;text-underline-offset:3px}
.ai-timeline{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.ai-step{position:relative;border:1px solid var(--border);border-radius:22px;background:#fff;padding:24px;box-shadow:var(--shadow-md)}
.ai-step-num{display:inline-flex;margin-bottom:18px;padding:8px 12px;border-radius:999px;background:var(--gradient-main);color:#fff;font-weight:800;font-size:12px;letter-spacing:.08em}
.ai-step h3{font-size:19px;color:var(--ink);letter-spacing:-.02em}
.ai-step p{margin-top:12px;color:var(--ink-3);line-height:1.62;font-size:15px}
.ai-pricing{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;align-items:stretch}
.ai-price{position:relative;display:flex;flex-direction:column;border:1px solid var(--border);border-radius:24px;background:#fff;padding:28px;box-shadow:var(--shadow-md)}
.ai-price.featured{border:2px solid var(--accent);box-shadow:var(--shadow-xl)}
.ai-badge{position:absolute;top:-14px;left:24px;border-radius:999px;background:var(--gradient-main);color:#fff;padding:7px 12px;font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.ai-price h3{font-size:22px;color:var(--ink)}
.ai-price-value{margin:14px 0 4px;font-size:clamp(34px,4.4vw,50px);font-weight:850;letter-spacing:-.04em;color:var(--ink)}
.ai-price-sub{color:var(--ink-3);font-weight:700}
.ai-price ul{margin:22px 0;list-style:none;display:grid;gap:12px;flex:1}
.ai-price li{position:relative;padding-left:24px;color:var(--ink-3);line-height:1.5}
.ai-price li::before{content:"";position:absolute;left:0;top:7px;width:13px;height:7px;border-left:2px solid var(--success);border-bottom:2px solid var(--success);transform:rotate(-45deg)}
.ai-legal{margin:24px auto 0;max-width:840px;color:var(--ink-4);font-size:14px;line-height:1.65;text-align:center}
.ai-cases{display:grid;gap:18px}
.ai-case{display:grid;grid-template-columns:220px 1fr;gap:20px;align-items:start;border:1px solid var(--border);border-radius:24px;background:#fff;padding:24px;box-shadow:var(--shadow-md)}
.ai-case h3{color:var(--ink);font-size:20px}
.ai-case p{color:var(--ink-3);line-height:1.62}
.ai-faq{max-width:880px;margin:0 auto;display:grid;gap:12px}
.ai-faq-item{border:1px solid var(--border);border-radius:18px;background:#fff;box-shadow:var(--shadow-xs);overflow:hidden}
.ai-faq-q{width:100%;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:20px 22px;text-align:left;font-weight:800;color:var(--ink)}
.ai-faq-q::after{content:"+";font-size:24px;font-weight:400;color:var(--accent)}
.ai-faq-item.open .ai-faq-q::after{transform:rotate(45deg)}
.ai-faq-a{max-height:0;overflow:hidden;transition:max-height .26s var(--ease)}
.ai-faq-item.open .ai-faq-a{max-height:260px}
.ai-faq-a p{padding:0 22px 20px;color:var(--ink-3);line-height:1.65}
.ai-final{padding:clamp(80px,10vw,120px) 0}
.ai-final-card{max-width:920px;margin:0 auto;text-align:center;border:1px solid var(--border-blue);border-radius:30px;background:linear-gradient(135deg,#101830 0%,#1A2350 55%,#281E55 100%);padding:clamp(34px,6vw,64px);box-shadow:var(--shadow-2xl);color:#fff}
.ai-final-card h2{color:#fff;font-size:clamp(32px,5vw,56px);line-height:1.06;letter-spacing:-.035em}
.ai-final-card h2 em{font-family:var(--font-serif);font-style:italic;font-weight:400;color:#BFD0FF}
.ai-final-card p{max-width:620px;margin:16px auto 28px;color:#C8D1F0;font-size:18px;line-height:1.65}
.ai-final-card .btn-ghost{background:rgba(255,255,255,.08);color:#fff;border-color:rgba(255,255,255,.24)}
.ai-final-card .btn-ghost:hover{background:rgba(255,255,255,.16);color:#fff}
@media (max-width:980px){.ai-hero-grid,.ai-split,.ai-pricing{grid-template-columns:1fr}.ai-hero-panel,.ai-hero-phone{max-width:520px;margin:0 auto}.ai-proof-grid,.ai-timeline{grid-template-columns:repeat(2,1fr)}.ai-agents{grid-template-columns:1fr 1fr}.ai-agent:nth-child(2){grid-column:auto}.ai-case{grid-template-columns:1fr}}
@media (max-width:640px){.ai-hero{min-height:auto}.ai-bullets,.ai-proof-grid,.ai-agents,.ai-timeline{grid-template-columns:1fr}.ai-actions .btn{width:100%}.ai-card,.ai-agent,.ai-price,.ai-case{border-radius:18px}.ai-hero-panel{padding:20px}.ai-panel-list li{flex-direction:column;gap:4px}.ai-panel-list span:last-child{text-align:left}}

/* ============================================================================
   V11 — ENRICHISSEMENT VISUEL
   ============================================================================ */

/* ---- VISUEL #1 : Hero phone WhatsApp ---- */
.ai-hero-phone{position:relative;justify-self:end;width:100%;max-width:340px}
.phone-frame{position:relative;width:100%;aspect-ratio:9/19;background:#0E1521;border-radius:44px;padding:10px;box-shadow:0 30px 60px -20px rgba(18,33,51,.35),0 12px 28px -8px rgba(47,107,255,.28),inset 0 0 0 1.5px rgba(255,255,255,.08);z-index:2}
.phone-notch{position:absolute;top:14px;left:50%;transform:translateX(-50%);width:96px;height:24px;background:#0E1521;border-radius:0 0 18px 18px;z-index:3}
.phone-screen{position:relative;width:100%;height:100%;background:linear-gradient(180deg,#ECE5DD 0%,#E8E1D7 100%);border-radius:34px;overflow:hidden;display:flex;flex-direction:column}
.phone-glow{position:absolute;inset:-30px;background:radial-gradient(60% 50% at 50% 30%,rgba(47,107,255,.18),transparent 70%),radial-gradient(50% 40% at 80% 80%,rgba(14,159,110,.14),transparent 70%);filter:blur(20px);z-index:1;pointer-events:none}
.wa-header{display:flex;align-items:center;gap:10px;padding:34px 12px 10px;background:#075E54;color:#fff}
.wa-avatar{width:36px;height:36px;border-radius:50%;background:#1A8378;display:grid;place-items:center;color:#fff;flex:0 0 auto}
.wa-meta{flex:1;min-width:0}
.wa-name{font-size:13px;font-weight:700;line-height:1.2;color:#fff}
.wa-status{display:flex;align-items:center;gap:6px;font-size:11px;color:#CFE9E5;margin-top:2px}
.wa-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:#25D366;box-shadow:0 0 0 3px rgba(37,211,102,.22);animation:waPulse 2s ease-in-out infinite}
@keyframes waPulse{0%,100%{box-shadow:0 0 0 3px rgba(37,211,102,.22)}50%{box-shadow:0 0 0 6px rgba(37,211,102,0)}}
.wa-actions{color:#CFE9E5}
.wa-chat{flex:1;padding:14px 12px 6px;overflow:hidden;display:flex;flex-direction:column;gap:8px;background-image:radial-gradient(rgba(0,0,0,.04) 1px,transparent 1px);background-size:14px 14px}
.wa-msg{max-width:78%;padding:8px 11px 6px;font-size:12.5px;line-height:1.38;border-radius:10px;position:relative;opacity:0;transform:translateY(6px) scale(.96);animation:waIn .35s cubic-bezier(.4,0,.2,1) forwards;color:#202C33;box-shadow:0 1px 1px rgba(0,0,0,.08)}
@keyframes waIn{to{opacity:1;transform:translateY(0) scale(1)}}
.wa-msg.client{align-self:flex-end;background:#DCF8C6;border-bottom-right-radius:2px}
.wa-msg.agent{align-self:flex-start;background:#fff;border-bottom-left-radius:2px}
.wa-msg .wa-time{display:block;text-align:right;font-size:9px;color:#7A8A95;margin-top:3px}
.wa-typing{display:none;align-self:flex-start;margin:0 12px 8px;padding:8px 12px;background:#fff;border-radius:10px;border-bottom-left-radius:2px;box-shadow:0 1px 1px rgba(0,0,0,.08)}
.wa-typing.on{display:flex;gap:3px}
.wa-typing span{width:6px;height:6px;border-radius:50%;background:#90A0A8;animation:waType 1.2s ease-in-out infinite}
.wa-typing span:nth-child(2){animation-delay:.2s}
.wa-typing span:nth-child(3){animation-delay:.4s}
@keyframes waType{0%,60%,100%{transform:translateY(0);opacity:.4}30%{transform:translateY(-3px);opacity:1}}
.wa-inputbar{display:flex;align-items:center;gap:8px;padding:8px 10px 14px;background:#F0F0F0;color:#7A8A95}
.wa-input-fake{flex:1;background:#fff;border-radius:18px;padding:8px 12px;font-size:11.5px;color:#90A0A8}

/* ---- VISUEL #2 : Proof bar icons ---- */
.ai-proof-icon{display:flex;justify-content:center;color:var(--accent);margin-bottom:8px}
.ai-proof-icon-pulse svg circle:last-child{transform-origin:center;animation:proofPulse 2.4s ease-in-out infinite}
@keyframes proofPulse{0%,100%{opacity:.25;transform:scale(1)}50%{opacity:.5;transform:scale(1.06)}}

/* ---- VISUEL #3 : Comparatif émotionnel ---- */
.ai-split-emotional .ai-card{padding-top:0;overflow:hidden}
.ai-emo-illu{position:relative;background:linear-gradient(180deg,#F5F0EE 0%,#EDE5E1 100%);margin:-1px -1px 22px;padding:18px 18px 14px;border-bottom:1px solid #DDCFC9}
.ai-emo-illu-good{background:linear-gradient(180deg,#EAF5EE 0%,#D9EEDF 100%);border-bottom:1px solid #B4D5C0}
.ai-emo-clock{display:inline-flex;align-items:center;gap:6px;padding:5px 10px;background:#fff;border-radius:999px;font-size:11px;font-weight:700;color:#7A6A66;box-shadow:var(--shadow-xs)}
.ai-emo-clock-good{color:#0E5A36}
.ai-emo-live{width:7px;height:7px;border-radius:50%;background:#0E9F6E;box-shadow:0 0 0 3px rgba(14,159,110,.22);animation:waPulse 2s ease-in-out infinite}
.ai-emo-svg{display:block;width:100%;max-width:100%;height:auto;margin-top:8px}
.ai-emo-phone-ring{transform-origin:17px 25px}
.in-view .ai-emo-phone-ring{animation:phoneShake .8s ease-in-out 3}
@keyframes phoneShake{0%,100%{transform:rotate(0)}20%{transform:rotate(-15deg)}40%{transform:rotate(15deg)}60%{transform:rotate(-10deg)}80%{transform:rotate(10deg)}}
.ai-emo-wave{opacity:0}
.in-view .ai-emo-wave{animation:waveOn 1.6s ease-out 3}
@keyframes waveOn{0%,100%{opacity:0}40%,60%{opacity:1}}
.ai-emo-counter{margin-top:10px;font-size:12px;font-weight:700;color:#7A4848;display:inline-block;padding:4px 8px;border-radius:8px;background:#fff;box-shadow:var(--shadow-xs)}
.ai-emo-counter-good{color:#0E5A36}
.ai-card-bad h3{color:#7A4848}
.ai-card-good h3{color:#0E5A36}

/* ---- VISUEL #4 : Mockups produits agents ---- */
.ai-mockup{position:relative;background:linear-gradient(180deg,#F6F8FB 0%,#EEF3F8 100%);border:1px solid var(--border);border-radius:16px;padding:12px;margin-bottom:6px;font-size:12px;color:var(--ink-2);box-shadow:inset 0 1px 0 rgba(255,255,255,.6)}
.mk-header{display:flex;align-items:center;gap:8px;padding-bottom:10px;border-bottom:1px solid var(--border-soft);margin-bottom:10px}
.mk-header-icon{width:24px;height:24px;border-radius:6px;background:#fff;display:grid;place-items:center;border:1px solid var(--border)}
.mk-header-icon-wa{background:#25D366;border-color:#25D366}
.mk-header-title{flex:1;font-weight:700;color:var(--ink);font-size:12px;letter-spacing:-.01em}
.mk-header-stat{font-size:10.5px;font-weight:800;color:var(--accent);background:rgba(46,88,122,.08);padding:3px 8px;border-radius:999px}
.mk-header-wa{padding:8px 10px;border-radius:8px;background:#075E54;border-color:#075E54;margin:-12px -12px 10px}
.mk-header-wa .mk-header-title,.mk-header-wa .mk-header-stat{color:#fff}
.mk-header-wa .mk-header-stat{background:rgba(255,255,255,.18)}
/* Google reviews mockup */
.mk-review{padding:10px;background:#fff;border:1px solid var(--border-soft);border-radius:10px;margin-bottom:8px}
.mk-review-mini{padding:8px 10px;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.mk-rev-stars{color:#F4B400;font-size:11px;letter-spacing:1px;font-weight:700}
.mk-rev-stars-bad{color:#A8B2C2}
.mk-rev-name{font-size:10.5px;color:var(--ink-4);margin-top:2px}
.mk-review-mini .mk-rev-name{margin-top:0}
.mk-rev-body{font-size:11.5px;color:var(--ink-2);margin-top:5px;line-height:1.4}
.mk-reply-draft{margin-top:8px;padding:8px;background:#F6F8FB;border-radius:8px;border:1px dashed var(--border-blue)}
.mk-tag{display:inline-block;font-size:9px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:var(--accent);background:rgba(46,88,122,.1);padding:2px 6px;border-radius:4px}
.mk-tag-warn{color:#B45309;background:rgba(180,83,9,.1)}
.mk-reply-draft p{margin:5px 0 6px;color:var(--ink-3);font-size:11px;line-height:1.4}
.mk-reply-actions{display:flex;align-items:center;gap:8px}
.mk-btn-validate{font-size:10px;font-weight:800;color:#fff;background:#0E9F6E;border:0;border-radius:6px;padding:4px 9px;cursor:default}
.mk-btn-edit{font-size:10px;color:var(--ink-4);font-weight:600}
.mk-footer-stat{margin-top:8px;font-size:10.5px;font-weight:700;color:var(--ink-4);text-align:center;padding-top:8px;border-top:1px dashed var(--border-soft)}
/* WhatsApp mockup */
.mk-conv{display:flex;align-items:flex-start;gap:8px;padding:8px;border-radius:10px;background:#fff;border:1px solid var(--border-soft);margin-bottom:6px}
.mk-conv-escalade{border-color:#E5484D;background:rgba(229,72,77,.04)}
.mk-conv-avatar{width:26px;height:26px;border-radius:50%;background:#5870FF;color:#fff;display:grid;place-items:center;font-size:10px;font-weight:800;flex:0 0 auto}
.mk-conv-avatar-red{background:#E5484D}
.mk-conv-body{flex:1;min-width:0}
.mk-conv-name{font-size:11px;font-weight:700;color:var(--ink);display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.mk-conv-msg{font-size:10.5px;color:var(--ink-3);margin-top:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mk-badge-red,.mk-badge-auto{font-size:8.5px;font-weight:800;text-transform:uppercase;letter-spacing:.05em;padding:2px 5px;border-radius:4px}
.mk-badge-red{background:#E5484D;color:#fff}
.mk-badge-auto{background:rgba(14,159,110,.14);color:#0A7C56}
/* Calendar mockup */
.mk-cal{display:grid;gap:4px}
.mk-cal-row{display:flex;align-items:center;gap:8px}
.mk-cal-time{font-size:10px;color:var(--ink-4);font-weight:700;width:24px;flex:0 0 auto}
.mk-cal-slot{flex:1;padding:5px 8px;border-radius:6px;font-size:10.5px;font-weight:700;color:var(--ink-2)}
.mk-cal-slot-blue{background:rgba(46,88,122,.12);border-left:3px solid var(--accent);color:var(--ink)}
.mk-cal-slot-now{background:rgba(46,88,122,.22);box-shadow:0 0 0 2px rgba(46,88,122,.18)}
.mk-cal-sms{margin-top:8px;padding:6px 8px;background:#fff;border-radius:8px;border:1px solid var(--border-soft)}
.mk-sms-bubble{font-size:10px;color:var(--ink-3);font-style:italic}
/* Mail mockup */
.mk-mail{display:grid;gap:5px}
.mk-mail-row{display:grid;grid-template-columns:auto auto 1fr auto;align-items:center;gap:6px;padding:5px 7px;background:#fff;border-radius:6px;font-size:10px;border:1px solid var(--border-soft)}
.mk-mail-row-faded{opacity:.5}
.mk-mail-tag{font-size:9px;font-weight:800;padding:2px 5px;border-radius:3px;color:#fff}
.mk-mail-tag-red{background:#E5484D}
.mk-mail-tag-blue{background:#5870FF}
.mk-mail-tag-green{background:#0E9F6E}
.mk-mail-tag-grey{background:#A8B2C2}
.mk-mail-from{font-weight:700;color:var(--ink);font-size:10px;white-space:nowrap}
.mk-mail-snippet{color:var(--ink-4);font-size:10px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.mk-mail-action{font-size:9.5px;color:var(--ink-4);font-weight:700;white-space:nowrap}
.mk-mail-action-auto{color:#0A7C56}
/* Reels mockup */
.mk-reels{display:grid;grid-template-columns:repeat(2,1fr);gap:6px}
.mk-reel{display:flex;gap:6px;padding:5px;background:#fff;border-radius:8px;border:1px solid var(--border-soft);align-items:center;min-width:0}
.mk-reel-thumb{width:32px;height:46px;border-radius:5px;overflow:hidden;flex:0 0 auto}
.mk-reel-thumb svg{width:100%;height:100%;display:block}
.mk-reel-meta{font-size:9.5px;line-height:1.3;min-width:0}
.mk-reel-meta strong{display:block;color:var(--ink);font-size:10px;font-weight:800}
.mk-reel-meta span{color:var(--ink-4);overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}

/* ---- VISUEL #5 : Pictogrammes pour qui / pas pour qui ---- */
.ai-list-pic li{padding-left:0;display:flex;align-items:flex-start;gap:12px}
.ai-list-pic li::before{display:none}
.ai-pic{flex:0 0 auto;width:32px;height:32px;border-radius:9px;display:grid;place-items:center;background:rgba(14,159,110,.1);color:#0E9F6E}
.ai-pic-bad{background:rgba(229,72,77,.08);color:#A8B2C2}

/* ---- VISUEL #6 : Timeline avec mini-mockups ---- */
.ai-timeline{position:relative;padding-top:34px}
.ai-timeline-track{position:absolute;left:8%;right:8%;top:16px;height:3px;background:var(--border-soft);border-radius:999px;z-index:0;overflow:hidden}
.ai-timeline-fill{height:100%;width:0;background:linear-gradient(90deg,#2E587A,#5870FF);border-radius:999px;transition:width 1.4s cubic-bezier(.4,0,.2,1)}
.ai-step{position:relative;z-index:1}
.ai-step-marker{position:absolute;top:-18px;left:50%;transform:translateX(-50%);width:32px;height:32px;border-radius:50%;background:#fff;border:3px solid var(--border-soft);display:grid;place-items:center;font-size:13px;font-weight:800;color:var(--ink-4);z-index:3;transition:all .4s ease}
.ai-step.in-view .ai-step-marker{background:linear-gradient(135deg,#2E587A,#5870FF);border-color:#fff;color:#fff;box-shadow:0 0 0 4px rgba(47,107,255,.18),var(--shadow-md)}
.ai-step-mini{margin-top:14px;padding:10px;background:linear-gradient(180deg,#F6F8FB 0%,#EEF3F8 100%);border:1px solid var(--border-soft);border-radius:12px;min-height:72px;display:flex;align-items:center;justify-content:center}
.mini-zoom{display:flex;flex-direction:column;gap:4px;width:100%}
.mini-zoom-tile{display:flex;align-items:center;gap:8px;padding:4px 6px;background:#1B2A40;border-radius:5px;color:#fff;font-size:10px;font-weight:700}
.mini-zoom-avatar{width:18px;height:18px;border-radius:50%;display:grid;place-items:center;font-size:9px;font-weight:800}
.mz-a{background:#5870FF}.mz-b{background:#0E9F6E}
.mini-zoom-bar{display:flex;gap:4px;justify-content:center;margin-top:2px}
.mini-zoom-bar span{width:14px;height:14px;border-radius:4px;background:#1B2A40;display:grid;place-items:center}
.mini-zoom-bar .mini-mic{background:#E5484D}
.mini-config{display:grid;gap:6px;width:100%;font-size:10px;color:var(--ink-3);font-weight:700}
.mini-config-row{display:flex;align-items:center;justify-content:space-between;gap:8px}
.mini-slider{flex:1;max-width:60px;height:4px;background:var(--border);border-radius:999px;position:relative}
.mini-slider-thumb{position:absolute;top:50%;width:10px;height:10px;border-radius:50%;background:var(--accent);transform:translate(-50%,-50%);box-shadow:var(--shadow-xs)}
.mini-slider-thumb-65{left:65%}
.mini-slider-thumb-80{left:80%}
.mini-toggle{width:24px;height:14px;border-radius:999px;background:var(--border);position:relative;flex:0 0 auto}
.mini-toggle span{position:absolute;top:1.5px;left:1.5px;width:11px;height:11px;border-radius:50%;background:#fff;transition:left .2s ease;box-shadow:var(--shadow-xs)}
.mini-toggle-on{background:#0E9F6E}
.mini-toggle-on span{left:11.5px}
.mini-chat{display:flex;flex-direction:column;gap:4px;width:100%}
.mini-bubble{font-size:10px;padding:5px 8px;border-radius:8px;max-width:80%}
.mini-bubble-in{align-self:flex-start;background:#fff;border:1px solid var(--border-soft);color:var(--ink-3)}
.mini-bubble-out{align-self:flex-end;background:#DCF8C6;color:#0E5A36}
.mini-prod{display:flex;flex-direction:column;align-items:center;gap:4px}
.mini-prod-label{font-size:10px;font-weight:800;letter-spacing:.05em;color:#0E9F6E}

/* ---- VISUEL #7 : Cards prix enrichies ---- */
.ai-price{padding-top:0;overflow:hidden}
.ai-price-illu{margin:-1px -28px 18px;padding:14px 0 10px;background:linear-gradient(180deg,#F6F8FB 0%,#EAF1F8 100%);border-bottom:1px solid var(--border-soft);min-height:128px;display:flex;align-items:center;justify-content:center}
.ai-price.featured .ai-price-illu{background:linear-gradient(180deg,#EAF1F8 0%,#DBE6F4 100%);border-bottom-color:var(--border-blue)}
.ai-price.featured .ai-badge{top:14px;right:18px;left:auto;font-size:11px;padding:8px 14px;box-shadow:0 6px 18px rgba(47,107,255,.32)}
.ai-price{padding-left:28px;padding-right:28px;padding-bottom:28px}

/* ---- VISUEL #8 : Cas dashboards ---- */
.ai-case{grid-template-columns:280px 1fr;gap:24px}
.ai-case-chart{padding:14px;background:linear-gradient(180deg,#F6F8FB 0%,#EEF3F8 100%);border:1px solid var(--border-soft);border-radius:14px}
.ai-chart-title{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:var(--ink-4);margin-bottom:10px;text-align:center}
.ai-chart-bars{display:grid;gap:8px}
.ai-bar-row{display:grid;grid-template-columns:54px 1fr;align-items:center;gap:8px}
.ai-bar-label{font-size:11px;font-weight:700;color:var(--ink-3)}
.ai-bar{height:22px;background:#fff;border-radius:6px;overflow:hidden;border:1px solid var(--border-soft);position:relative}
.ai-bar-fill{height:100%;width:0;display:flex;align-items:center;justify-content:flex-end;padding-right:8px;font-size:11px;font-weight:800;color:#fff;transition:width 1.4s cubic-bezier(.4,0,.2,1);min-width:24px;border-radius:6px 0 0 6px}
.ai-bar-fill-grey{background:linear-gradient(90deg,#A8B2C2,#7A8AA0)}
.ai-bar-fill-green{background:linear-gradient(90deg,#0E9F6E,#0A7C56)}
.ai-chart-stars{margin-top:10px;display:flex;align-items:center;gap:6px;flex-wrap:wrap;font-size:11px;font-weight:700}
.ai-stars-label{color:var(--ink-4);font-size:10px;text-transform:uppercase;letter-spacing:.06em;width:100%}
.ai-stars-old{color:var(--ink-4)}
.ai-stars-arrow{color:var(--accent);font-weight:800}
.ai-stars-new{color:#F4B400;font-weight:800;font-size:13px}
.in-view .ai-stars-new{animation:starsPop .6s cubic-bezier(.4,1.6,.6,1)}
@keyframes starsPop{0%{transform:scale(.8)}50%{transform:scale(1.2)}100%{transform:scale(1)}}
.ai-donut-wrap{display:flex;align-items:center;gap:14px}
.ai-donut circle:nth-child(2){transition:stroke-dashoffset 1.4s cubic-bezier(.4,0,.2,1)}
.ai-donut-legend{font-size:11px;display:grid;gap:5px;font-weight:700;color:var(--ink-3)}
.ai-donut-legend>div{display:flex;align-items:center;gap:6px}
.ai-dot{width:10px;height:10px;border-radius:3px;flex:0 0 auto}
.ai-dot-green{background:#0E9F6E}
.ai-dot-blue{background:#5870FF}
.ai-donut-stat{margin-top:4px;color:#0E9F6E;font-weight:800}
.ai-area{width:100%;height:90px;display:block;margin-top:4px}
.ai-area-line,.ai-area-fill{stroke-dasharray:300;stroke-dashoffset:300;transition:stroke-dashoffset 1.6s cubic-bezier(.4,0,.2,1),opacity 1.6s ease}
.ai-area-fill{stroke:none;opacity:0}
.in-view .ai-area-line{stroke-dashoffset:0}
.in-view .ai-area-fill{opacity:1}
.ai-area-stats{display:flex;gap:14px;margin-top:8px;justify-content:center}
.ai-area-stats>div{text-align:center;font-size:10px;color:var(--ink-4);font-weight:700}
.ai-area-stats strong{display:block;font-size:18px;color:var(--ink);font-weight:850;letter-spacing:-.02em}

/* Counter animation utility */
.ai-emo-num{display:inline-block;min-width:1ch;font-variant-numeric:tabular-nums}

/* prefers-reduced-motion */
@media (prefers-reduced-motion:reduce){
  .wa-msg,.ai-emo-phone-ring,.ai-emo-wave,.ai-bar-fill,.ai-donut circle:nth-child(2),.ai-area-line,.ai-area-fill,.wa-dot,.ai-emo-live,.ai-proof-icon-pulse svg circle:last-child{animation:none!important;transition:none!important}
  .ai-bar-fill{width:var(--bar-final,100%)!important}
  .ai-donut circle:nth-child(2){stroke-dashoffset:90!important}
  .ai-area-line,.ai-area-fill{stroke-dashoffset:0!important;opacity:1!important}
  .ai-timeline-fill{width:100%!important;transition:none!important}
}

/* Mobile responsive */
@media (max-width:980px){
  .ai-hero-phone{max-width:300px}
  .ai-case{grid-template-columns:1fr}
  .ai-case-chart{max-width:380px}
  .ai-timeline-track{display:none}
  .ai-step-marker{position:relative;top:0;left:0;transform:none;margin-bottom:12px}
  .ai-step{padding-top:0}
}
@media (max-width:640px){
  .ai-hero-phone{max-width:280px}
  .phone-frame{border-radius:34px;padding:8px}
  .phone-screen{border-radius:26px}
  .phone-notch{width:78px;height:20px}
  .wa-header{padding-top:28px}
  .ai-mockup{font-size:11px}
  .ai-emo-counter{font-size:11px}
  .ai-price-illu{margin-left:-18px;margin-right:-18px}
  .ai-price{padding-left:18px;padding-right:18px}
  .ai-bar-row{grid-template-columns:46px 1fr}
  .ai-donut-wrap{flex-direction:column;align-items:center}
}

/* V15 rescue — keep this page readable after local CSS overrides the global dark theme. */
.ai-section,
.ai-section-alt {
  background:
    radial-gradient(ellipse at 12% 8%, rgba(47,107,255,.18), transparent 42%),
    radial-gradient(ellipse at 82% 22%, rgba(139,92,255,.14), transparent 44%),
    linear-gradient(180deg, rgba(12,18,51,.96) 0%, rgba(17,24,64,.94) 100%);
}

.ai-kicker,
.ai-bullets li,
.ai-card,
.ai-agent,
.ai-step,
.ai-price,
.ai-case,
.ai-faq-item,
.ai-proof-item,
.ai-note,
.ai-mockup,
.ai-step-mini,
.ai-price-illu,
.ai-case-chart {
  background: linear-gradient(180deg, rgba(44,60,120,.78), rgba(26,36,82,.90));
  border-color: rgba(255,255,255,.12);
  color: var(--ink-2);
  box-shadow: 0 14px 34px rgba(0,0,0,.28);
}

.ai-kicker,
.ai-agent h3 span,
.ai-agent p,
.ai-card p,
.ai-list li,
.ai-step p,
.ai-price li,
.ai-case p,
.ai-faq-a p,
.ai-head p,
.ai-muted,
.ai-proof-copy,
.ai-price-sub,
.ai-legal {
  color: var(--ink-2);
}

.ai-h1,
.ai-h2,
.ai-card h3,
.ai-agent h3,
.ai-step h3,
.ai-price h3,
.ai-price-value,
.ai-case h3,
.ai-faq-q,
.ai-proof-label,
.ai-list strong {
  color: var(--ink);
}

.ai-h1 {
  font-size: clamp(2.35rem, 7.8vw, 4.9rem);
  line-height: 1.02;
  overflow-wrap: anywhere;
}

.ai-section {
  padding-top: clamp(54px, 7vw, 86px);
  padding-bottom: clamp(54px, 7vw, 86px);
}

@media (max-width:640px) {
  .ai-hero {
    padding: 96px 0 52px;
  }

  .ai-h1 {
    font-size: clamp(2.15rem, 11vw, 3.25rem);
    line-height: 1.04;
  }

  .ai-section {
    padding-top: 50px;
    padding-bottom: 50px;
  }
}

/* ============================================================================
   PREMIUM IA PATCH — subtle futuristic finish scoped to /automatisations-ia
   ============================================================================ */
.ai-page {
  --bg-main: #070c24;
  --bg-section: #0b1230;
  --bg-card: rgba(15, 24, 58, .88);
  --bg-card-soft: rgba(25, 38, 84, .72);
  --glass-dark: rgba(12, 19, 48, .72);
  --glass-border: rgba(182, 204, 255, .18);
  --text-main: #f7f9ff;
  --text-muted: #c9d4f2;
  --text-soft: #9fadd3;
  --accent-blue: #6f9cff;
  --accent-violet: #b481ff;
  --accent-cyan: #6ee7ff;
  --glow-blue: 0 24px 70px rgba(79, 126, 255, .24);
  --glow-violet: 0 24px 76px rgba(180, 129, 255, .20);
  background:
    radial-gradient(circle at 10% 4%, rgba(93, 140, 255, .24), transparent 32rem),
    radial-gradient(circle at 88% 14%, rgba(180, 129, 255, .18), transparent 30rem),
    linear-gradient(180deg, var(--bg-main), #0a102c 38%, #080d25 100%);
  overflow-x: hidden;
}

.ai-hero {
  position: relative;
  background:
    radial-gradient(circle at 18% 16%, rgba(110, 231, 255, .20), transparent 26rem),
    radial-gradient(circle at 82% 8%, rgba(180, 129, 255, .24), transparent 30rem),
    linear-gradient(180deg, rgba(7, 12, 36, .98), rgba(12, 18, 51, .96));
}

.ai-hero::before,
.ai-hero::after {
  content: "";
  position: absolute;
  pointer-events: none;
}

.ai-hero::before {
  inset: 0;
  background:
    linear-gradient(rgba(155, 181, 255, .055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(155, 181, 255, .055) 1px, transparent 1px),
    linear-gradient(115deg, transparent 0 38%, rgba(110, 231, 255, .12) 39%, transparent 41% 100%);
  background-size: 42px 42px, 42px 42px, 220px 220px;
  mask-image: radial-gradient(ellipse 86% 62% at 52% 32%, #000, transparent 78%);
  -webkit-mask-image: radial-gradient(ellipse 86% 62% at 52% 32%, #000, transparent 78%);
}

.ai-hero::after {
  width: min(520px, 74vw);
  height: min(520px, 74vw);
  right: -9%;
  top: 9%;
  border-radius: 50%;
  background:
    conic-gradient(from 190deg, transparent, rgba(110, 231, 255, .16), rgba(180, 129, 255, .18), transparent),
    radial-gradient(circle, rgba(110, 231, 255, .10), transparent 58%);
  filter: blur(4px);
  opacity: .72;
  animation: aiSignalDrift 16s ease-in-out infinite alternate;
}

@keyframes aiSignalDrift {
  from { transform: translate3d(0, 0, 0) rotate(0deg); opacity: .52; }
  to { transform: translate3d(-18px, 10px, 0) rotate(14deg); opacity: .78; }
}

.ai-hero-grid,
.ai-section > .wrap,
.ai-proof > .wrap {
  position: relative;
  z-index: 1;
}

.ai-kicker,
.ai-bullets li,
.ai-card,
.ai-agent,
.ai-step,
.ai-price,
.ai-case,
.ai-faq-item,
.ai-proof-item,
.ai-note {
  background:
    linear-gradient(145deg, rgba(255, 255, 255, .078), rgba(255, 255, 255, .026)),
    rgba(15, 24, 58, .88);
  border-color: rgba(182, 204, 255, .18);
  box-shadow: 0 24px 70px rgba(79, 126, 255, .18), inset 0 1px 0 rgba(255, 255, 255, .08);
}

.ai-agent,
.ai-step,
.ai-price {
  overflow: hidden;
}

.ai-agent::before,
.ai-step::before,
.ai-price::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 18% 0%, rgba(110, 231, 255, .12), transparent 32%),
    linear-gradient(120deg, transparent, rgba(255, 255, 255, .045), transparent);
  opacity: .88;
  pointer-events: none;
}

.ai-agent > *,
.ai-step > *,
.ai-price > * {
  position: relative;
  z-index: 1;
}

.ai-agent:hover,
.ai-step:hover,
.ai-price:hover {
  border-color: rgba(110, 231, 255, .34);
  box-shadow: 0 28px 84px rgba(79, 126, 255, .24), 0 24px 76px rgba(180, 129, 255, .16), inset 0 1px 0 rgba(255, 255, 255, .12);
}

.ai-h1 {
  color: var(--text-main);
  text-wrap: balance;
}

.ai-h1 em,
.ai-h2 em {
  background: linear-gradient(100deg, var(--accent-cyan), var(--accent-blue) 45%, var(--accent-violet));
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.ai-lead,
.ai-bullets li,
.ai-agent p,
.ai-agent h3 span,
.ai-agent-meta p,
.ai-step p,
.ai-price li,
.ai-price-sub,
.ai-head p,
.ai-note,
.ai-legal,
.ai-proof-copy {
  color: var(--text-muted);
}

.ai-agent h3,
.ai-step h3,
.ai-price h3,
.ai-price-value,
.ai-proof-label {
  color: var(--text-main);
}

.ai-agent-icon,
.ai-step-num,
.ai-step-marker,
.ai-badge {
  background: linear-gradient(135deg, rgba(110, 231, 255, .92), rgba(111, 156, 255, .9) 48%, rgba(180, 129, 255, .92));
  color: #fff;
  border-color: rgba(255, 255, 255, .22);
  box-shadow: 0 14px 34px rgba(79, 126, 255, .24);
}

.ai-mockup,
.ai-step-mini,
.ai-price-illu,
.ai-case-chart {
  background:
    linear-gradient(180deg, rgba(10, 17, 43, .82), rgba(16, 27, 64, .78)),
    rgba(8, 14, 36, .72);
  border-color: rgba(182, 204, 255, .16);
  color: var(--text-muted);
}

.ai-timeline-track {
  background: rgba(182, 204, 255, .12);
}

.ai-timeline-fill {
  width: 100%;
  background: linear-gradient(90deg, var(--accent-cyan), var(--accent-blue), var(--accent-violet));
  box-shadow: 0 0 24px rgba(110, 231, 255, .44);
}

.ai-price.featured {
  border-color: rgba(110, 231, 255, .52);
}

.phone-frame {
  box-shadow:
    0 30px 72px -22px rgba(0, 0, 0, .62),
    0 0 0 1px rgba(182, 204, 255, .20),
    0 0 62px rgba(110, 231, 255, .16);
}

@media (prefers-reduced-motion: reduce) {
  .ai-hero::after {
    animation: none !important;
  }
}

@media (max-width: 640px) {
  .ai-h1 {
    font-size: clamp(2.05rem, 10.4vw, 3.05rem);
    line-height: 1.06;
    letter-spacing: 0;
  }

  .ai-hero::after {
    width: 340px;
    height: 340px;
    right: -42%;
    top: 8%;
  }

  .ai-agent,
  .ai-step,
  .ai-price {
    border-radius: 18px;
  }
}