/* Daawati homepage V22 — plum → rose → coral */
:root{
  --plum:#2A1238;--plum2:#4A1F5C;--rose:#C2457A;--coral:#F28C6B;--peach:#FFC9A8;--gold:#E7C27D;
  --cream:#FFF8F3;--paper:#FFFFFF;--ink:#24112F;--soft:#6E5A78;--line:rgba(74,31,92,.12);
  --grad:linear-gradient(120deg,#4A1F5C 0%,#C2457A 52%,#F28C6B 100%);
  --grad-soft:linear-gradient(135deg,#FCE7EF 0%,#FFF1E8 100%);
  --r:22px;--shadow:0 30px 60px -28px rgba(74,31,92,.45);
  --ff:'IBM Plex Sans Arabic',system-ui,sans-serif;--fd:'El Messiri','Playfair Display',serif;
}
html[lang=fr],html[lang=en]{--fd:'Playfair Display','El Messiri',serif}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:84px;overflow-x:clip}
body.hm{margin:0;overflow-x:clip;background:var(--cream);color:var(--ink);font-family:var(--ff);line-height:1.7;overflow-x:hidden;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
.hm-shell{width:min(1200px,100% - 32px);margin-inline:auto}
.dwi{display:block}
[data-ic]{display:inline-flex;font-style:normal}

/* ambient background */
.hm-bg{position:fixed;inset:0;z-index:-1;pointer-events:none;overflow:hidden}
.hm-bg i{position:absolute;border-radius:50%;filter:blur(90px);opacity:.42;animation:drift 22s ease-in-out infinite alternate}
.hm-bg .b1{width:620px;height:620px;background:#F4B6CB;top:-220px;inset-inline-end:-160px}
.hm-bg .b2{width:520px;height:520px;background:#FFD2B8;top:40vh;inset-inline-start:-220px;animation-delay:-8s}
.hm-bg .b3{width:460px;height:460px;background:#D9C2EC;bottom:-200px;inset-inline-end:20%;animation-delay:-14s}
@keyframes drift{to{transform:translate3d(60px,40px,0) scale(1.12)}}

/* header */
.hm-head{position:sticky;top:0;z-index:40;transition:background .3s,box-shadow .3s}
.hm-head.solid{background:rgba(255,248,243,.82);backdrop-filter:blur(16px) saturate(1.4);-webkit-backdrop-filter:blur(16px) saturate(1.4);box-shadow:0 1px 0 var(--line)}
.hm-nav{height:74px;display:flex;align-items:center;gap:24px}
.hm-brand{display:flex;align-items:center;gap:10px;text-decoration:none;font-family:var(--fd);font-weight:700;font-size:21px}
.hm-brand img{height:var(--logo-h,54px);width:auto;max-width:260px;object-fit:contain}
.hm-foot .hm-brand img{height:var(--logo-h-f,72px)}
.hm-links{display:flex;gap:26px;margin-inline:auto}
.hm-links a{text-decoration:none;font-size:14.5px;font-weight:500;color:var(--soft);position:relative;padding:6px 0;transition:color .2s}
.hm-links a::after{content:'';position:absolute;inset-inline:0;bottom:0;height:2px;border-radius:2px;background:var(--grad);transform:scaleX(0);transition:transform .3s}
.hm-links a:hover{color:var(--ink)}.hm-links a:hover::after{transform:scaleX(1)}
.hm-acts{display:flex;align-items:center;gap:12px}
.hm-langs{display:flex;background:rgba(74,31,92,.06);border-radius:999px;padding:3px}
.hm-langs a{text-decoration:none;font-size:12.5px;font-weight:600;padding:5px 10px;border-radius:999px;color:var(--soft)}
.hm-langs a.on{background:#fff;color:var(--ink);box-shadow:0 2px 8px rgba(74,31,92,.12)}
.hm-login{text-decoration:none;font-weight:600;font-size:14.5px}
.hm-burger{display:none;width:42px;height:42px;border:0;border-radius:12px;background:rgba(74,31,92,.07);cursor:pointer;flex-direction:column;align-items:center;justify-content:center;gap:6px}
.hm-burger i{width:18px;height:2px;background:var(--ink);border-radius:2px;transition:transform .3s}
.hm-burger[aria-expanded=true] i:first-child{transform:translateY(4px) rotate(45deg)}
.hm-burger[aria-expanded=true] i:last-child{transform:translateY(-4px) rotate(-45deg)}

/* buttons */
.hm-btn{--bg:var(--grad);display:inline-flex;align-items:center;justify-content:center;gap:10px;height:54px;padding:0 28px;border-radius:999px;border:0;cursor:pointer;
  background:var(--bg);background-size:160% 100%;color:#fff;font:600 16px var(--ff);text-decoration:none;box-shadow:0 14px 30px -12px rgba(194,69,122,.65);
  transition:transform .25s,box-shadow .25s,background-position .5s}
.hm-btn:hover{transform:translateY(-2px);background-position:100% 0;box-shadow:0 20px 38px -12px rgba(194,69,122,.75)}
.hm-btn:focus-visible,.tabs button:focus-visible,.demo-shot:focus-visible{outline:3px solid var(--coral);outline-offset:3px}
.hm-btn.sm{height:42px;padding:0 18px;font-size:14px}
.hm-btn.ghost{background:#fff;color:var(--ink);box-shadow:0 0 0 1px var(--line),0 10px 24px -14px rgba(74,31,92,.35)}
.hm-btn.light{background:#fff;color:var(--plum2);box-shadow:0 14px 30px -12px rgba(0,0,0,.35)}
.hm-btn.outline{background:transparent;color:#fff;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.6)}
.hm-btn .dwi{width:20px;height:20px}
.play{width:26px;height:26px;border-radius:50%;background:var(--grad);position:relative;flex:none}
.play::after{content:'';position:absolute;top:50%;left:54%;transform:translate(-50%,-50%);border-style:solid;border-width:5px 0 5px 8px;border-color:transparent transparent transparent #fff}

/* hero */
.hm-hero{position:relative;padding:40px 0 0}
.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:40px;align-items:center;min-height:calc(100vh - 160px)}
.eyebrow{display:inline-flex;align-items:center;gap:8px;padding:7px 16px 7px 12px;border-radius:999px;background:#fff;box-shadow:0 0 0 1px var(--line);font-size:13.5px;font-weight:600;color:var(--plum2)}
[dir=rtl] .eyebrow{padding:7px 12px 7px 16px}
.eyebrow .dwi{width:20px;height:20px}
.hm-hero h1{font-family:var(--fd);font-weight:700;font-size:clamp(36px,4.4vw,62px);line-height:1.18;margin:22px 0 18px;letter-spacing:-.01em}
.hm-hero h1 em{font-style:normal;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;background-size:200% 100%;animation:shine 8s ease-in-out infinite alternate}
html[lang=fr] .hm-hero h1,html[lang=en] .hm-hero h1{letter-spacing:-.025em;line-height:1.05}
html[lang=fr] .hm-hero h1 em,html[lang=en] .hm-hero h1 em{font-style:italic}
@keyframes shine{to{background-position:100% 0}}
.lead{font-size:18px;color:var(--soft);max-width:560px;margin:0 0 30px}
.hero-cta{display:flex;flex-wrap:wrap;gap:14px}
.hero-stats{list-style:none;padding:0;margin:40px 0 0;display:flex;gap:34px}
.hero-stats b{display:block;font-family:var(--fd);font-size:36px;line-height:1;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.hero-stats span{font-size:13.5px;color:var(--soft)}

.hero-stage{position:relative;display:grid;place-items:center;min-height:640px}
.ring{position:absolute;border-radius:50%;border:1px dashed rgba(194,69,122,.35)}
.ring.r1{width:520px;height:520px;animation:spin 60s linear infinite}
.ring.r2{width:660px;height:660px;border-color:rgba(242,140,107,.25);animation:spin 90s linear infinite reverse}
@keyframes spin{to{transform:rotate(360deg)}}
.hero-stage::before{content:'';position:absolute;width:420px;height:420px;border-radius:50%;background:var(--grad);opacity:.9;filter:blur(2px);
  box-shadow:0 0 120px 40px rgba(242,140,107,.35)}
.phone{display:block;position:relative;width:300px;aspect-ratio:390/760;border-radius:44px;padding:10px;background:linear-gradient(145deg,#3a2348,#160a1f);
  box-shadow:0 0 0 1.5px rgba(255,255,255,.12) inset,0 40px 80px -30px rgba(42,18,56,.75),0 18px 30px -18px rgba(42,18,56,.6)}
.phone img,.phone iframe{position:absolute;inset:10px;width:calc(100% - 20px);height:calc(100% - 20px);border-radius:34px;object-fit:cover;border:0;background:#f5efe6}
.phone-notch{position:absolute;top:18px;left:50%;transform:translateX(-50%);width:84px;height:22px;border-radius:20px;background:#120819;z-index:3}
.hero-phone{transform:rotate(-3deg);animation:float 7s ease-in-out infinite}
[dir=rtl] .hero-phone{transform:rotate(3deg)}
.hero-phone img{opacity:0;transform:scale(1.04);transition:opacity .9s ease,transform 1.6s ease}
.hero-phone img.on{opacity:1;transform:none}
@keyframes float{50%{translate:0 -14px}}
.chip{position:absolute;z-index:5;display:flex;align-items:center;gap:12px;padding:12px 16px;border-radius:18px;background:rgba(255,255,255,.88);
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);box-shadow:var(--shadow);min-width:210px;animation:float 6s ease-in-out infinite}
.chip>i{width:40px;height:40px;border-radius:12px;background:var(--grad-soft);color:var(--rose);display:grid;place-items:center;flex:none}
.chip>i .dwi{width:26px;height:26px}
.chip b{display:block;font-size:14px}.chip span{font-size:12.5px;color:var(--soft)}
.chip .ok{text-decoration:none;margin-inline-start:auto;width:24px;height:24px;border-radius:50%;background:#2E9E6A;color:#fff;display:grid;place-items:center;font-size:13px}
.chip.c1{top:12%;inset-inline-start:-4%;animation-delay:-1s}
.chip.c2{bottom:24%;inset-inline-end:-6%;animation-delay:-3s}
.chip.c3{bottom:6%;inset-inline-start:2%;animation-delay:-4.5s}
.hero-steps{position:absolute;bottom:-6px;list-style:none;display:flex;gap:6px;padding:0;margin:0}
.hero-steps li{width:8px;height:8px;border-radius:8px;background:rgba(74,31,92,.18);transition:width .4s,background .4s}
.hero-steps li.on{width:26px;background:var(--rose)}

.marquee{margin-top:60px;padding:22px 0;background:var(--plum);color:#fff;overflow:hidden;-webkit-mask:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.marquee .track{display:flex;gap:56px;width:max-content;animation:marq 38s linear infinite}
[dir=rtl] .marquee .track{animation-name:marqR}
.marquee span{display:flex;align-items:center;gap:12px;font-family:var(--fd);font-size:22px;white-space:nowrap;opacity:.92}
.marquee .dwi{width:30px;height:30px}
@keyframes marq{to{transform:translateX(-50%)}}@keyframes marqR{to{transform:translateX(50%)}}

/* sections */
.hm-sec{padding:120px 0}
.sec-head{text-align:center;max-width:720px;margin:0 auto 54px}
.kicker{display:inline-block;font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.sec-head h2{font-family:var(--fd);font-weight:700;font-size:clamp(32px,4vw,52px);line-height:1.2;margin:10px 0 14px}
.sec-head p{color:var(--soft);font-size:17px;margin:0}
.sec-head.light .kicker{background:linear-gradient(90deg,var(--peach),var(--gold));-webkit-background-clip:text;background-clip:text}
.sec-head.light h2{color:#fff}.sec-head.light p{color:rgba(255,255,255,.72)}
.center{text-align:center;margin-top:48px}

/* demos */
.tabs{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-bottom:44px}
.tabs button{display:inline-flex;align-items:center;gap:8px;height:46px;padding:0 18px;border-radius:999px;border:0;background:#fff;color:var(--soft);
  font:600 14.5px var(--ff);cursor:pointer;box-shadow:0 0 0 1px var(--line);transition:all .25s}
.tabs button .dwi{width:22px;height:22px}
.tabs button:hover{color:var(--ink);transform:translateY(-1px)}
.tabs button[aria-selected=true]{background:var(--grad);color:#fff;box-shadow:0 12px 26px -12px rgba(194,69,122,.7)}
.demo-row[hidden]{display:none}
.demo-row{display:grid;grid-template-columns:repeat(3,1fr);gap:30px}
.demo-row:not([hidden]) .demo{animation:rise .7s cubic-bezier(.2,.8,.2,1) both;animation-delay:calc(var(--d) * .1s)}
@keyframes rise{from{opacity:0;transform:translateY(30px)}}
.demo{background:#fff;border-radius:28px;padding:22px 22px 18px;box-shadow:0 0 0 1px var(--line),0 24px 50px -36px rgba(74,31,92,.5);transition:transform .35s,box-shadow .35s}
.demo:hover{transform:translateY(-6px);box-shadow:0 0 0 1px rgba(194,69,122,.25),0 34px 60px -34px rgba(194,69,122,.55)}
.demo-shot{all:unset;cursor:pointer;display:block;width:100%;box-sizing:border-box;position:relative;border-radius:22px;padding:26px 0 10px;background:var(--grad-soft);overflow:hidden}
.demo-shot .phone.mini{width:62%;margin:auto;border-radius:30px;padding:7px;transition:transform .5s cubic-bezier(.2,.8,.2,1)}
.demo-shot .phone.mini img{inset:7px;width:calc(100% - 14px);height:calc(100% - 14px);border-radius:24px}
.demo:hover .phone.mini{transform:translateY(-8px) scale(1.03)}
.demo-play{position:absolute;inset-inline:0;bottom:22px;margin:auto;width:max-content;display:flex;align-items:center;gap:8px;padding:8px 16px 8px 10px;border-radius:999px;
  background:rgba(255,255,255,.94);font-weight:600;font-size:14px;box-shadow:0 10px 24px -10px rgba(74,31,92,.5);opacity:0;transform:translateY(10px);transition:all .3s}
.demo:hover .demo-play,.demo-shot:focus-visible .demo-play{opacity:1;transform:none}
.demo-meta{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;margin-top:16px}
.demo-meta h3{margin:0;font-family:var(--fd);font-size:21px;line-height:1.3}
.demo-meta p{margin:2px 0 0;color:var(--soft);font-size:13.5px}
.badge{flex:none;font-size:11.5px;font-weight:700;padding:4px 10px;border-radius:999px;color:#7a4b0c;background:linear-gradient(135deg,#FBE7B9,#E7C27D)}
.demo-use{display:inline-flex;gap:6px;margin-top:10px;font-weight:600;font-size:14px;text-decoration:none;color:var(--rose)}
.demo-use:hover{text-decoration:underline}

/* journey */
.journey{background:radial-gradient(1000px 600px at 80% 0%,rgba(194,69,122,.35),transparent 60%),radial-gradient(800px 600px at 0% 100%,rgba(242,140,107,.25),transparent 60%),var(--plum);color:#fff;border-radius:48px;margin-inline:16px}
.jr{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:56px;align-items:center}
.jr-phone{display:grid;place-items:center;position:relative}
.jr-phone::before{content:'';position:absolute;width:380px;height:380px;border-radius:50%;background:radial-gradient(circle,rgba(242,140,107,.45),transparent 70%);filter:blur(10px)}
.jr-phone .phone{width:min(310px,100%)}
.jr-phone .phone img{opacity:0;transform:translateY(16px) scale(.98);transition:opacity .6s,transform .8s cubic-bezier(.2,.8,.2,1)}
.jr-phone .phone img.on{opacity:1;transform:none}
.jr-steps{list-style:none;margin:0;padding:0;display:grid;gap:8px;order:-1}
.jr-step{position:relative;border-radius:20px;overflow:hidden;transition:background .4s}
.jr-step button{all:unset;box-sizing:border-box;cursor:pointer;display:flex;gap:16px;align-items:flex-start;width:100%;padding:14px 18px}
.jr-step button:focus-visible{outline:2px solid var(--peach);outline-offset:-2px;border-radius:20px}
.jr-step:hover{background:rgba(255,255,255,.04)}
.jr-step.on{background:rgba(255,255,255,.08);box-shadow:inset 0 0 0 1px rgba(255,255,255,.12)}
.jr-ic{flex:none;width:52px;height:52px;border-radius:16px;display:grid;place-items:center;background:rgba(255,255,255,.08);box-shadow:inset 0 0 0 1px rgba(255,255,255,.14);transition:background .4s}
.jr-step.on .jr-ic{background:linear-gradient(135deg,rgba(242,140,107,.45),rgba(194,69,122,.45))}
.jr-ic .dwi{width:32px;height:32px}
.jr-txt{display:grid;gap:2px;padding-top:2px}
.jr-txt small{color:var(--peach);font-weight:700;letter-spacing:.1em;font-size:12px}
.jr-txt b{font-family:var(--fd);font-size:21px;font-weight:600;line-height:1.3;color:rgba(255,255,255,.62);transition:color .3s}
.jr-step.on .jr-txt b{color:#fff}
.jr-p{display:block;color:rgba(255,255,255,.74);font-size:15.5px;line-height:1.7;max-height:0;opacity:0;overflow:hidden;transition:max-height .5s ease,opacity .5s ease,margin .5s}
.jr-step.on .jr-p{max-height:140px;opacity:1;margin-top:4px}
.jr-bar{position:absolute;bottom:0;inset-inline-start:0;height:2px;width:0;background:linear-gradient(90deg,var(--coral),var(--peach))}
.jr-step.on .jr-bar{animation:jrbar var(--jr-dur,5s) linear forwards}
.jr.paused .jr-step.on .jr-bar{animation-play-state:paused}
@keyframes jrbar{to{width:100%}}

/* features bento */
.bento{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:minmax(190px,auto);gap:20px;grid-auto-flow:dense}
.tile{position:relative;overflow:hidden;background:#fff;border-radius:var(--r);padding:28px;box-shadow:0 0 0 1px var(--line);transition:transform .35s,box-shadow .35s}
.tile:hover{transform:translateY(-4px);box-shadow:0 0 0 1px rgba(194,69,122,.2),0 30px 50px -34px rgba(194,69,122,.55)}
.tile.wide{grid-column:span 2}
.tile.tall{grid-row:span 2;background:var(--plum);color:#fff}
.tile.tall p{color:rgba(255,255,255,.72)}
.tile:first-child{grid-row:span 2;background:var(--grad);color:#fff;padding-bottom:0;display:flex;flex-direction:column}
.tile:first-child p{color:rgba(255,255,255,.85)}
.t-ic{width:56px;height:56px;border-radius:16px;display:grid;place-items:center;background:var(--grad-soft);margin-bottom:18px}
.tile:first-child .t-ic,.tile.tall .t-ic{background:rgba(255,255,255,.14)}
.t-ic .dwi{width:34px;height:34px}
.tile h3{margin:0 0 6px;font-family:var(--fd);font-size:21px;line-height:1.3}
.tile p{margin:0;color:var(--soft);font-size:15px}
.t-shot{margin-top:auto;width:100%;max-height:270px;object-fit:cover;object-position:top;border-radius:16px 16px 0 0;box-shadow:0 -10px 40px rgba(42,18,56,.35);transform:translateY(24px);transition:transform .6s}
.tile:first-child:hover .t-shot{transform:translateY(8px)}
.qr{position:relative;display:grid;grid-template-columns:repeat(7,1fr);gap:4px;width:150px;margin:30px auto 0;padding:12px;background:#fff;border-radius:14px}
.qr i{aspect-ratio:1;background:var(--plum);border-radius:2px}
.qr .scan{position:absolute;inset-inline:6px;top:8px;height:3px;border-radius:3px;background:var(--coral);box-shadow:0 0 18px 4px rgba(242,140,107,.8);animation:scan 2.4s ease-in-out infinite}
@keyframes scan{50%{top:calc(100% - 11px)}}

/* steps */
.steps{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(4,1fr);gap:24px;counter-reset:s;position:relative}
.steps::before{content:'';position:absolute;top:34px;inset-inline:12%;height:2px;background:linear-gradient(90deg,transparent,rgba(194,69,122,.35),transparent)}
.steps li{position:relative;text-align:center;padding:0 10px}
.steps b{width:68px;height:68px;margin:0 auto 18px;border-radius:50%;display:grid;place-items:center;font:700 26px var(--fd);color:#fff;background:var(--grad);box-shadow:0 0 0 8px var(--cream),0 14px 30px -10px rgba(194,69,122,.7);position:relative}
.steps h3{margin:0 0 6px;font-family:var(--fd);font-size:20px}
.steps p{margin:0;color:var(--soft);font-size:15px}

/* pricing */
.plans{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:22px;align-items:stretch}
.plan{position:relative;display:flex;flex-direction:column;background:#fff;border-radius:26px;padding:32px 28px;box-shadow:0 0 0 1px var(--line)}
.plan.hot{background:linear-gradient(#fff,#fff) padding-box,var(--grad) border-box;border:2px solid transparent;box-shadow:0 30px 60px -30px rgba(194,69,122,.6);transform:translateY(-10px)}
.ribbon{position:absolute;top:-14px;inset-inline-start:24px;padding:5px 14px;border-radius:999px;background:var(--grad);color:#fff;font-size:12.5px;font-weight:700}
.plan h3{margin:0;font-family:var(--fd);font-size:22px}
.price{display:flex;align-items:baseline;gap:8px;margin:12px 0 4px}
.price b{font:700 48px/1 var(--fd)}
.price span{color:var(--soft);font-size:14px}
.annual{margin:0;color:var(--soft);font-size:13.5px}
.plan ul{list-style:none;padding:0;margin:20px 0 26px;display:grid;gap:10px;flex:1}
.plan li{position:relative;padding-inline-start:28px;font-size:15px}
.plan li::before{content:'';position:absolute;inset-inline-start:0;top:6px;width:18px;height:18px;border-radius:50%;background:var(--grad-soft)}
.plan li::after{content:'';position:absolute;inset-inline-start:6px;top:9px;width:5px;height:9px;border:solid var(--rose);border-width:0 2px 2px 0;transform:rotate(45deg)}
.plan .hm-btn{width:100%}

/* final */
.final{padding:0 16px 100px}
.final-in{position:relative;overflow:hidden;text-align:center;color:#fff;border-radius:48px;padding:90px 24px;background:var(--grad)}
.final-in::before,.final-in::after{content:'';position:absolute;border-radius:50%;border:1px solid rgba(255,255,255,.18)}
.final-in::before{width:600px;height:600px;top:-300px;inset-inline-start:-200px}
.final-in::after{width:420px;height:420px;bottom:-240px;inset-inline-end:-120px}
.final-in .seal{width:86px;height:86px;margin:0 auto 22px;border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle at 35% 30%,#d4566f,#8c1f3a 70%);box-shadow:inset 0 -6px 12px rgba(0,0,0,.3),0 16px 30px -10px rgba(0,0,0,.45);animation:float 5s ease-in-out infinite}
.final-in .seal .dwi{width:46px;height:46px}
.final-in h2{font-family:var(--fd);font-size:clamp(30px,4vw,50px);margin:0 auto 12px;max-width:760px;line-height:1.2}
.final-in p{margin:0 0 30px;font-size:17px;opacity:.88}
.final-in .hero-cta{justify-content:center}

.hm-foot{padding:34px 0 46px;border-top:1px solid var(--line)}
.foot-in{display:flex;flex-wrap:wrap;align-items:center;gap:20px 34px}
.foot-in nav{display:flex;gap:22px;margin-inline-start:auto}
.foot-in nav a{text-decoration:none;color:var(--soft);font-size:14.5px}
.foot-in>span{font-size:13.5px;color:var(--soft)}

/* live modal */
dialog.live{border:0;padding:0;background:transparent;max-width:none;max-height:none;width:100%;height:100%;overflow:auto}
dialog.live::backdrop{background:rgba(26,10,36,.72);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
dialog.live[open]{display:grid;place-items:center}
.live-in{display:flex;flex-direction:column;align-items:center;gap:14px;padding:20px 16px;animation:pop .45s cubic-bezier(.2,.9,.3,1.2)}
@keyframes pop{from{opacity:0;transform:scale(.92) translateY(20px)}}
.live-bar{display:flex;align-items:center;gap:14px;color:#fff;width:min(400px,100%)}
.live-bar b{font-family:var(--fd);font-size:19px;margin-inline-end:auto}
.live-bar a{color:var(--peach);font-size:14px}
.live-bar button{width:40px;height:40px;border-radius:50%;border:0;background:rgba(255,255,255,.14);color:#fff;font-size:16px;cursor:pointer}
.phone.big{width:min(380px,calc((100vh - 140px) * 390 / 760),100%)}
.live-note{margin:0;color:rgba(255,255,255,.7);font-size:13.5px;text-align:center}

/* reveal on scroll */
.rv{opacity:0;transform:translateY(34px);transition:opacity .9s cubic-bezier(.2,.8,.2,1),transform .9s cubic-bezier(.2,.8,.2,1);transition-delay:calc(var(--d,0) * .08s)}
.rv.in{opacity:1;transform:none}
.no-js .rv{opacity:1;transform:none}

/* responsive */
@media (max-width:1100px){
  .hm-links{gap:18px}
  .bento{grid-template-columns:repeat(2,1fr)}
  .tile:first-child{grid-column:span 2}
}
@media (max-width:960px){
  .hm-burger{display:flex}
  .hm-links{position:fixed;top:74px;inset-inline:12px;flex-direction:column;gap:0;background:#fff;border-radius:20px;padding:10px 18px;box-shadow:var(--shadow);
    opacity:0;pointer-events:none;transform:translateY(-10px);transition:all .25s}
  .hm-links.open{opacity:1;pointer-events:auto;transform:none}
  .hm-links a{padding:12px 0;border-bottom:1px solid var(--line);font-size:16px}
  .hm-links a:last-child{border:0}
  .hm-login{display:none}
  .hero-grid{grid-template-columns:1fr;text-align:center;min-height:0;gap:20px}
  .hero-copy{display:flex;flex-direction:column;align-items:center}
  .lead{margin-inline:auto}
  .hero-cta{justify-content:center}
  .hero-stats{justify-content:center}
  .hero-stage{min-height:600px}
  .demo-row{grid-template-columns:1fr;max-width:420px;margin:auto}
  .jr{grid-template-columns:1fr;gap:28px}
  .jr-phone .phone{width:250px}
  .jr-phone::before{width:280px;height:280px}
  .jr-steps{order:0}
  .steps{grid-template-columns:1fr 1fr;row-gap:40px}
  .steps::before{display:none}
  .plan.hot{transform:none}
}
@media (max-width:620px){
  .hm-sec{padding:80px 0}
  .hm-langs a{padding:5px 8px;font-size:12px}
  .hm-acts{gap:8px}
  .hm-acts .hm-btn.sm{display:none}
  .hm-brand span{display:none}
  .hm-brand img{height:var(--logo-h-m,46px)}
  .hm-btn{height:50px;padding:0 22px;font-size:15px}
  .hero-stage{min-height:520px;transform:scale(.9)}
  .ring.r1{width:400px;height:400px}.ring.r2{width:500px;height:500px}
  .hero-stage::before{width:300px;height:300px}
  .phone{width:250px}
  .chip{min-width:0;padding:10px 12px}
  .chip.c1{inset-inline-start:-6%}.chip.c2{inset-inline-end:-8%}
  .chip.c3{display:none}
  .hero-stats{gap:22px}
  .bento{grid-template-columns:1fr}
  .tile.wide,.tile:first-child{grid-column:auto}
  .tile.tall{grid-row:auto}
  .steps{grid-template-columns:1fr}
  .journey,.final-in{border-radius:32px}
  .foot-in nav{margin-inline-start:0}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
  .rv{opacity:1;transform:none}
}

/* WhatsApp support */
.dw-wa-float{position:fixed;z-index:45;bottom:calc(20px + env(safe-area-inset-bottom,0px));inset-inline-end:20px;width:58px;height:58px;border-radius:50%;display:grid;place-items:center;background:#25D366;color:#fff;box-shadow:0 14px 30px -10px rgba(37,211,102,.7);animation:wapulse 2.8s ease-in-out infinite;transition:transform .2s}
.dw-wa-float:hover{transform:scale(1.07)}
@keyframes wapulse{50%{box-shadow:0 14px 30px -10px rgba(37,211,102,.7),0 0 0 14px rgba(37,211,102,0)}}