/* Layout: the Novia lotus logo is the identity — its real petals bloom on load and with the scroll; a giant gold hourglass keeps pouring ("almost time"); one cinematic look inside the clinic; opening gifts. Warm sunrise accents (amber, orange, coral) around the logo gold, on bright cream. Single committed light look. */
:root{
  --cream:#fffaf2;
  --sand:#fbf0e1;
  --peach:#ffe7d4;
  --gold:#c9a15a;
  --gold-deep:#8a6224;
  --amber:#f2b33d;
  --orange:#ec7a2a;
  --coral:#dc4f35;
  --ink:#30201a;
  --ink-soft:#5b4334;
  --line:rgba(91,67,52,.15);
  --warm:linear-gradient(90deg,#dc4f35,#ec7a2a 50%,#f2b33d);
  --f-head:"Alexandria","Almarai",Tahoma,sans-serif;
  --f-body:"Almarai","Alexandria",Tahoma,sans-serif;
  --f-ruqaa:"Aref Ruqaa","Amiri","Times New Roman",serif;
  --f-lat:"Marcellus","Didot",Georgia,serif;
  --gut-l:max(16px,env(safe-area-inset-left,0px));
  --gut-r:max(16px,env(safe-area-inset-right,0px));
  color-scheme:light;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--cream);color:var(--ink);font-family:var(--f-body);font-size:17px;line-height:1.9;overflow-x:hidden;-webkit-font-smoothing:antialiased}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:60;background:var(--cream)}
a{color:inherit}
:focus-visible{outline:2px solid var(--orange);outline-offset:3px;border-radius:6px}
.wrap{width:100%;max-width:1160px;margin-inline:auto;padding-left:var(--gut-l);padding-right:var(--gut-r)}
.lat{font-family:var(--f-lat);letter-spacing:.2em;direction:ltr;unicode-bidi:isolate}
.coral{color:var(--coral)}
.gold{color:var(--gold-deep)}
.lotus-img{background:url(../img/lotus.webp) center/contain no-repeat;aspect-ratio:900/567;max-width:100%}
.wordmark-img{background:url(../img/wordmark.webp) center/contain no-repeat;aspect-ratio:1000/348;max-width:100%}

/* reveal on scroll (only for elements below the fold at load) */
.rv-pre{opacity:0;transform:translateY(40px) scale(.98)}
.rv-in{opacity:1;transform:none;transition:opacity .9s ease,transform 1s cubic-bezier(.2,.8,.2,1);transition-delay:var(--rd,0s)}

/* header */
.top{position:fixed;top:env(safe-area-inset-top,0px);inset-inline:0;z-index:50;transition:background .4s,box-shadow .4s}
.top.solid{background:rgba(255,250,242,.88);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);box-shadow:0 1px 0 var(--line)}
.top .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-block:12px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none}
.brand .lotus-img{width:46px}
.brand .lat{font-size:.82rem;color:var(--ink)}
.nav{display:flex;gap:4px;align-items:center}
.nav a{text-decoration:none;font-family:var(--f-head);font-size:.95rem;padding:8px 14px;border-radius:999px;color:var(--ink-soft)}
.nav a:hover{color:var(--ink);background:var(--sand)}
.nav a.cta{background:var(--coral);color:#fff}
.nav a.cta:hover{background:var(--orange)}
.nav .short{display:none}
.brand .lat{white-space:nowrap}
@media (max-width:760px){.nav a:not(.cta){display:none}.nav .long{display:none}.nav .short{display:inline}.brand .lat{font-size:.7rem;letter-spacing:.14em}}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:15px 30px;border-radius:999px;text-decoration:none;font-family:var(--f-head);font-weight:700;font-size:1.02rem;line-height:1.4;transition:transform .3s,box-shadow .3s;border:0;cursor:pointer;position:relative;overflow:hidden}
.btn-warm{background:linear-gradient(135deg,var(--orange),var(--coral));color:#fff;box-shadow:0 14px 30px -14px rgba(220,79,53,.85)}
.btn-warm::after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.45) 50%,transparent 70%);transform:translateX(-120%);animation:btnShine 3.5s ease-in-out infinite}
@keyframes btnShine{0%,55%{transform:translateX(-120%)}100%{transform:translateX(120%)}}
.btn-warm:hover{transform:translateY(-3px)}
.btn-line{background:#fff;color:var(--ink);border:1.5px solid rgba(201,161,90,.6)}
.btn-line:hover{transform:translateY(-3px);border-color:var(--gold)}
.btn svg{width:20px;height:20px;flex:none}

/* ---------- hero ---------- */
.hero{position:relative;overflow:hidden;isolation:isolate;padding-block:118px 80px;background:radial-gradient(55% 45% at 50% 30%,#fff 0%,rgba(255,255,255,0) 70%),linear-gradient(180deg,#fffaf2 0%,var(--peach) 100%)}
.rays{position:absolute;left:50%;top:26%;width:1700px;height:1700px;margin:-850px 0 0 -850px;z-index:-2;background:repeating-conic-gradient(from 0deg,rgba(242,179,61,.22) 0deg 5deg,rgba(242,179,61,0) 5deg 15deg);-webkit-mask:radial-gradient(circle,#000 0,transparent 60%);mask:radial-gradient(circle,#000 0,transparent 60%);animation:spin 90s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
#dust{position:absolute;inset:0;width:100%;height:100%;z-index:-1;pointer-events:none}
.hero-in{display:flex;flex-direction:column;align-items:center;text-align:center;gap:16px}
.lotus-bloom{position:relative;aspect-ratio:900/567;max-width:100%}
.lotus-bloom::before{content:"";position:absolute;inset:-25% -12% -12%;background:radial-gradient(closest-side,rgba(242,179,61,.42),rgba(236,122,42,.12) 55%,transparent);z-index:-1;animation:glowPulse 4.5s ease-in-out infinite}
@keyframes glowPulse{50%{opacity:.55;transform:scale(1.08)}}
.lotus-bloom i{position:absolute;inset:0;background-position:center;background-size:contain;background-repeat:no-repeat;transform-origin:50% 84.5%;will-change:transform,opacity;transform:scale(.6);opacity:0}
.lp1{background-image:url(../img/lp1.webp)}
.lp2{background-image:url(../img/lp2.webp)}
.lp3{background-image:url(../img/lp3.webp)}
.lp4{background-image:url(../img/lp4.webp)}
.lp5{background-image:url(../img/lp5.webp)}
.lp6{background-image:url(../img/lp6.webp)}
.lp7{background-image:url(../img/lp7.webp)}
.lp8{background-image:url(../img/lp8.webp)}
.lp9{background-image:url(../img/lp9.webp)}
.lp10{background-image:url(../img/lp10.webp)}
.lp11{background-image:url(../img/lp11.webp)}
.lp12{background-image:url(../img/lp12.webp)}
.hero .lotus-bloom{width:min(290px,62vw)}
.hero .wordmark-img{width:min(300px,66vw);animation:up 1s ease 1.6s both}
.soon-badge{display:inline-flex;align-items:center;gap:12px;background:var(--warm);color:#fff;font-family:var(--f-lat);font-size:clamp(1rem,2.4vw,1.2rem);letter-spacing:.26em;padding:10px 24px 10px 20px;border-radius:999px;box-shadow:0 14px 30px -14px rgba(220,79,53,.9);direction:ltr;text-decoration:none;animation:pop 1s cubic-bezier(.2,.9,.3,1.3) 1.9s both,badgePulse 2.6s ease-in-out 3s infinite}
.soon-badge b{font-family:var(--f-head);letter-spacing:0;font-weight:700}
.soon-badge svg{width:18px;height:18px}
.soon-badge .sand{animation:sandBlink 1.2s linear infinite}
@keyframes sandBlink{50%{opacity:.3}}
@keyframes badgePulse{50%{box-shadow:0 14px 40px -8px rgba(220,79,53,.95)}}
@keyframes pop{from{opacity:0;transform:scale(.5)}to{opacity:1;transform:none}}
@keyframes up{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}
.hello{font-family:var(--f-ruqaa);font-weight:700;font-size:clamp(2.5rem,7.5vw,5rem);line-height:1.75;margin:0;color:var(--coral);padding-block:.05em}
.hello span,.h1w span{display:inline-block;animation:up .9s cubic-bezier(.2,.8,.2,1) both;animation-delay:calc(2s + var(--i)*.13s)}
.h1w span{animation-delay:calc(2.6s + var(--i)*.05s)}
.hero h1{font-family:var(--f-head);font-weight:700;font-size:clamp(1.2rem,3vw,1.9rem);line-height:1.75;margin:0;max-width:30ch;text-wrap:balance}
.gift-strip{display:inline-flex;align-items:center;gap:10px;background:#fff;border:1.5px dashed rgba(220,79,53,.45);border-radius:16px;padding:10px 18px;font-family:var(--f-head);font-weight:600;font-size:clamp(.95rem,2.2vw,1.05rem);color:var(--coral);animation:up 1s ease 3.3s both}
.gift-strip svg{width:24px;height:24px;flex:none;animation:wiggle 2.2s ease-in-out infinite}
@keyframes wiggle{0%,100%{transform:rotate(0)}10%{transform:rotate(-12deg)}20%{transform:rotate(10deg)}30%{transform:rotate(-6deg)}40%{transform:rotate(0)}}
.ctas{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin-top:4px;animation:up 1s ease 3.5s both}

/* marquee */
.marquee{overflow:hidden;padding-block:15px;background:var(--warm);color:#fff}
.marquee-track{display:flex;width:max-content;animation:mq 32s linear infinite;direction:ltr}
.marquee span{display:flex;align-items:center;gap:34px;padding-inline:17px;font-family:var(--f-head);font-weight:700;font-size:clamp(1.05rem,2.6vw,1.45rem);line-height:1.6;white-space:nowrap}
.marquee span em{font-family:var(--f-lat);font-style:normal;letter-spacing:.1em;font-weight:400}
.marquee span b{width:9px;height:14px;border-radius:50%/70% 70% 30% 30%;background:#fff;opacity:.9}
@keyframes mq{to{transform:translateX(-50%)}}

/* ---------- hourglass ---------- */
.hg-sec{position:relative;overflow:hidden;padding-block:clamp(70px,9vw,110px);background:radial-gradient(45% 50% at 50% 45%,#fff3df 0%,rgba(255,243,223,0) 70%),linear-gradient(180deg,var(--cream),var(--sand))}
.hg-stage{display:flex;align-items:center;justify-content:center;gap:clamp(10px,2.4vw,40px);direction:ltr;padding-left:var(--gut-l);padding-right:var(--gut-r)}
.hg-word{display:flex;font-family:var(--f-lat);font-size:clamp(3rem,8vw,8.4rem);line-height:1.15;letter-spacing:.02em;color:var(--coral);white-space:nowrap}
.hg-word span{display:inline-block;background:linear-gradient(180deg,#ec7a2a,#dc4f35);-webkit-background-clip:text;background-clip:text;color:transparent;padding-block:.06em;animation:letter 3.6s ease-in-out infinite;animation-delay:calc(var(--i)*.14s)}
@keyframes letter{0%,100%{transform:translateY(0)}20%{transform:translateY(-12px)}40%{transform:translateY(0)}}
#hourglass{height:min(72svh,660px);aspect-ratio:.62;flex:none;max-width:76vw}
.hg-copy{display:grid;justify-items:center;text-align:center;gap:10px;margin-top:clamp(14px,3vw,26px)}
.hg-copy .ar-soon{font-family:var(--f-ruqaa);font-weight:700;font-size:clamp(2.6rem,7vw,4.4rem);line-height:1.7;margin:0;color:var(--coral)}
.hg-copy p{margin:0;font-family:var(--f-head);font-weight:500;font-size:clamp(1.05rem,2.4vw,1.35rem);line-height:1.8;color:var(--ink);max-width:38ch}
@media (max-width:900px){
  .hg-stage{flex-direction:column;gap:4px}
  .hg-word{font-size:clamp(3.2rem,18vw,6.6rem)}
  #hourglass{height:min(54svh,500px)}
}

/* ---------- bloom story ---------- */
.story{position:relative;height:300vh}
.story-stick{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;background:linear-gradient(180deg,var(--bg1,#fffbee),#fff5e6)}
.story-stick::before{content:"";position:absolute;left:30%;top:52%;width:70vmin;height:70vmin;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(circle,rgba(242,179,61,.28),transparent 65%)}
.story-copy{position:absolute;inset:0;display:grid;align-items:center}
.story-copy .wrap{display:grid;grid-template-columns:1fr 1fr;gap:30px;align-items:center}
.story-text{display:grid;gap:22px;align-content:center;min-width:0}
.story-text h2{font-family:var(--f-head);font-weight:800;font-size:clamp(1.8rem,4.4vw,3.2rem);line-height:1.55;margin:0;text-wrap:balance}
.stage{display:grid;grid-template-columns:auto 1fr;gap:16px;align-items:start;opacity:.5;transition:opacity .5s,transform .5s;transform:translateX(-10px)}
.stage.on{opacity:1;transform:none}
.stage .sw{width:14px;height:54px;border-radius:10px;background:var(--c)}
.stage h3{font-family:var(--f-head);font-weight:700;font-size:clamp(1.15rem,2.4vw,1.55rem);margin:0;line-height:1.6}
.stage p{margin:2px 0 0;color:var(--ink-soft);font-size:1rem;line-height:1.8}
.story-lotus{display:grid;place-items:center;min-width:0}
.story-lotus .lotus-bloom{width:min(520px,100%)}
@media (max-width:820px){
  .story-copy{align-items:start}
  .story-copy .wrap{grid-template-columns:1fr;padding-top:104px;gap:12px}
  .story-text h2{font-size:1.7rem}
  .story-text{gap:12px;text-align:center;justify-items:center}
  .stage{display:none;transform:none;text-align:start}
  .stage.on{display:grid}
  .story-lotus .lotus-bloom{width:min(320px,80vw)}
  .story-stick::before{left:50%;top:70%}
}

/* ---------- first look (the one image) ---------- */
.look{position:relative;height:220vh;background:var(--sand)}
.look-stick{position:sticky;top:0;height:100vh;height:100svh;display:grid;place-items:center;overflow:hidden}
.look-frame{position:relative;width:min(1200px,94vw);height:min(74svh,680px);margin-top:60px;overflow:hidden;clip-path:inset(var(--ci,8%) var(--cs,30%) 0 var(--cs,30%) round var(--cr,999px) var(--cr,999px) 28px 28px);box-shadow:0 40px 90px -40px rgba(91,67,52,.6);max-width:100%}
.look-frame img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 40%;transform:scale(var(--z,1.25));transform-origin:50% 40%}
.look-frame::before{content:"";position:absolute;inset:0;z-index:2;background:linear-gradient(110deg,transparent 35%,rgba(255,236,200,.38) 50%,transparent 65%);background-size:300% 100%;animation:sweepLight 5s ease-in-out infinite}
@keyframes sweepLight{0%{background-position:140% 0}60%,100%{background-position:-40% 0}}
.look-frame::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(48,32,26,0) 55%,rgba(48,32,26,.72))}
.look-cap{position:absolute;inset:auto 0 0;z-index:3;padding:clamp(18px,4vw,40px);color:#fff;display:grid;gap:4px;text-align:center;opacity:var(--co,0);transform:translateY(calc((1 - var(--co,0))*20px))}
.look-cap .k{font-family:var(--f-lat);letter-spacing:.3em;font-size:.8rem;color:#ffdca8}
.look-cap h2{font-family:var(--f-head);font-weight:700;font-size:clamp(1.4rem,3.6vw,2.4rem);line-height:1.55;margin:0}
.look-cap p{margin:0;font-size:clamp(.95rem,2vw,1.1rem);color:#ffeedd}
.look-title{position:absolute;top:calc(env(safe-area-inset-top,0px) + 86px);z-index:4;inset-inline:0;text-align:center;font-family:var(--f-head);font-weight:800;font-size:clamp(1.5rem,4vw,2.6rem);line-height:1.5;opacity:calc(1 - var(--co,0))}

/* ---------- sections ---------- */
section.pad{padding-block:clamp(80px,10vw,130px)}
.head{display:grid;gap:12px;justify-items:center;text-align:center;max-width:760px;margin:0 auto clamp(40px,6vw,64px)}
.head h2{font-family:var(--f-head);font-weight:800;font-size:clamp(1.9rem,5vw,3.1rem);line-height:1.55;margin:0;text-wrap:balance}
.head p{margin:0;color:var(--ink-soft);font-size:1.08rem;line-height:1.85;max-width:56ch}
.tag{display:inline-block;font-family:var(--f-head);font-weight:700;font-size:.92rem;color:var(--coral);background:rgba(220,79,53,.08);padding:4px 16px;border-radius:999px;line-height:1.7}

/* services */
.care{background:var(--cream)}
.cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:26px;max-width:960px;margin-inline:auto}
@media (max-width:820px){.cards{grid-template-columns:1fr;max-width:520px}}
.card{position:relative;background:#fff;border-radius:30px;overflow:hidden;display:flex;flex-direction:column;box-shadow:0 30px 60px -38px rgba(220,79,53,.45);border:1px solid var(--line);transition:transform .5s cubic-bezier(.2,.7,.2,1);min-width:0}
.card:hover{transform:translateY(-8px)}
.card .art{position:relative;aspect-ratio:16/9;background:var(--c);display:grid;place-items:center;overflow:hidden}
.card .art svg{width:46%;height:auto;overflow:visible}
.card .art::after{content:"";position:absolute;inset:auto 0 -1px;height:34px;background:#fff;border-radius:50% 50% 0 0/100% 100% 0 0}
.card .body{padding:8px 28px 30px;display:grid;gap:10px}
.card .ttl{display:flex;align-items:baseline;justify-content:space-between;gap:10px;flex-wrap:wrap}
.card h3{font-family:var(--f-head);font-weight:800;font-size:1.65rem;line-height:1.5;margin:0}
.card .lat{font-size:.72rem;color:var(--ink-soft)}
.card p{margin:0;color:var(--ink-soft);font-size:1rem;line-height:1.85}
.card ul{list-style:none;padding:0;margin:6px 0 0;display:flex;flex-wrap:wrap;gap:8px}
.card li{background:var(--sand);border-radius:999px;padding:4px 14px;font-size:.92rem;line-height:1.7}
.drop{animation:float 4s ease-in-out infinite;transform-box:fill-box;transform-origin:center}
@keyframes float{50%{transform:translateY(-10px)}}
.rip{transform-box:fill-box;transform-origin:center;animation:rip 3s ease-out infinite}
.rip:nth-of-type(2){animation-delay:1s}.rip:nth-of-type(3){animation-delay:2s}
@keyframes rip{from{opacity:.9;transform:scale(.3)}to{opacity:0;transform:scale(1.35)}}
.spark{transform-box:fill-box;transform-origin:center;animation:twinkle 2.4s ease-in-out infinite}
.spark:nth-of-type(2){animation-delay:.8s}.spark:nth-of-type(3){animation-delay:1.6s}
@keyframes twinkle{0%,100%{opacity:0;transform:scale(.3)}50%{opacity:1;transform:scale(1) rotate(45deg)}}
.beam{animation:sweep 3.2s ease-in-out infinite alternate}
@keyframes sweep{from{transform:translateX(-60px)}to{transform:translateX(60px)}}

/* offers */
.offers{position:relative;overflow:hidden;background:radial-gradient(60% 60% at 50% 0%,#fff,transparent 70%),linear-gradient(180deg,var(--peach),#ffd9c0)}
.offer-wrap{display:grid;grid-template-columns:.9fr 1.1fr;gap:40px;align-items:center}
@media (max-width:860px){.offer-wrap{grid-template-columns:1fr;text-align:center}}
.gift{width:min(340px,70vw);margin-inline:auto;aspect-ratio:1;position:relative}
.gift svg{width:100%;height:100%;overflow:visible}
.lid{animation:lid 2.8s cubic-bezier(.3,1.4,.5,1) infinite;transform-box:fill-box;transform-origin:50% 100%}
@keyframes lid{0%,30%,100%{transform:translateY(0) rotate(0)}45%{transform:translateY(-34px) rotate(-8deg)}60%{transform:translateY(-26px) rotate(5deg)}75%{transform:translateY(0) rotate(0)}}
.burstp{transform-box:fill-box;transform-origin:center;animation:burstp 2.8s ease-out infinite}
@keyframes burstp{0%,35%{opacity:0;transform:translate(0,0) scale(.3)}50%{opacity:1}85%,100%{opacity:0;transform:translate(var(--x),var(--y)) scale(1) rotate(120deg)}}
.offer-text h2{font-family:var(--f-head);font-weight:800;font-size:clamp(2rem,5vw,3.3rem);line-height:1.5;margin:10px 0 8px;text-wrap:balance}
.offer-text>p{margin:0 0 22px;color:var(--ink-soft);font-size:1.1rem;line-height:1.85}
.perks{display:grid;gap:14px;margin-bottom:26px}
.perk{display:grid;grid-template-columns:auto 1fr;gap:16px;align-items:center;background:rgba(255,255,255,.85);border-radius:20px;padding:16px 18px;text-align:start;box-shadow:0 18px 30px -26px rgba(220,79,53,.7)}
.perk .ic{width:52px;height:52px;border-radius:16px;display:grid;place-items:center;background:var(--c)}
.perk .ic svg{width:26px;height:26px;stroke:#fff;fill:none;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.perk h3{font-family:var(--f-head);font-weight:700;font-size:1.15rem;line-height:1.6;margin:0}
.perk p{margin:0;color:var(--ink-soft);font-size:.96rem;line-height:1.7}

/* doctors */
.elite{background:var(--cream)}
.docs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px;max-width:640px;margin-inline:auto}
@media (max-width:560px){.docs{gap:14px}}
.doc{display:grid;gap:10px;justify-items:center;text-align:center;min-width:0}
.doc .frame{position:relative;width:100%;aspect-ratio:3/3.9;border-radius:999px 999px 26px 26px;overflow:hidden;border:3px solid transparent;background-image:linear-gradient(180deg,#fff,var(--sand)),linear-gradient(160deg,var(--amber),var(--coral));background-origin:border-box;background-clip:padding-box,border-box;max-width:100%}
.doc .frame svg{position:absolute;inset:auto 0 0;width:100%;height:78%}
.doc .frame::after{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 35%,rgba(255,255,255,.8) 50%,transparent 65%);background-size:300% 100%;animation:shimmer 3.6s ease-in-out infinite;animation-delay:var(--d,0s)}
@keyframes shimmer{0%{background-position:150% 0}60%,100%{background-position:-60% 0}}
.doc .q{position:absolute;top:13%;left:50%;transform:translateX(-50%);font-family:var(--f-lat);font-size:clamp(2.2rem,6vw,3.6rem);line-height:1;color:var(--coral);animation:bob 3s ease-in-out infinite}
@keyframes bob{50%{transform:translate(-50%,-8px)}}
.doc h3{font-family:var(--f-head);font-weight:700;font-size:clamp(1rem,2.4vw,1.2rem);margin:0;line-height:1.6}
.doc span{font-family:var(--f-head);font-size:.9rem;color:var(--coral);font-weight:600}

/* join */
.join{background:var(--sand)}
.join-box{display:grid;grid-template-columns:1fr 1fr;gap:36px;align-items:center;background:#fff;border-radius:36px;padding:clamp(24px,4vw,48px);box-shadow:0 40px 80px -50px rgba(220,79,53,.5);position:relative;overflow:hidden}
.join-box::before{content:"";position:absolute;inset:0 0 auto;height:6px;background:var(--warm)}
@media (max-width:860px){.join-box{grid-template-columns:1fr}}
.join-box h2{font-family:var(--f-head);font-weight:800;font-size:clamp(1.8rem,4.4vw,2.7rem);line-height:1.55;margin:10px 0;text-wrap:balance}
.join-box p{margin:0;color:var(--ink-soft);line-height:1.85}
form{display:grid;gap:14px;min-width:0}
label{font-family:var(--f-head);font-size:.92rem;color:var(--ink);display:grid;gap:6px;line-height:1.6}
input,select{font:inherit;font-family:var(--f-body);padding:13px 16px;border-radius:14px;border:1px solid rgba(91,67,52,.25);background:var(--cream);color:var(--ink);width:100%;line-height:1.5}
input:focus,select:focus{outline:2px solid var(--orange);outline-offset:1px}
.form-msg{font-size:.95rem;color:var(--coral);min-height:1.6em;line-height:1.7}
.contact-row{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin-top:22px}
.mail{display:flex;align-items:center;gap:8px;border:1px solid var(--line);border-radius:999px;padding:6px 6px 6px 16px;direction:ltr;background:var(--cream)}
.mail code{font-family:var(--f-lat);letter-spacing:.03em;color:var(--ink);user-select:all}
.mail button{border:0;border-radius:999px;padding:7px 14px;background:var(--ink);color:#fff;font-family:var(--f-head);cursor:pointer}
.socials{display:flex;gap:10px}
.soc{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;color:#fff;background:var(--c);transition:transform .3s}
.soc:hover{transform:translateY(-3px) rotate(-6deg)}
.soc svg{width:20px;height:20px}

/* finale */
.finale{text-align:center;padding-block:clamp(80px,10vw,130px) 50px;background:linear-gradient(180deg,var(--cream),var(--peach))}
.finale .wrap{display:grid;justify-items:center;gap:16px}
.finale .lotus-bloom{width:min(220px,50vw)}
.finale .soon{font-family:var(--f-ruqaa);font-weight:700;font-size:clamp(3.4rem,12vw,8rem);line-height:1.6;margin:0;color:var(--coral)}
.finale p{margin:0;font-family:var(--f-head);font-size:clamp(1.05rem,2.6vw,1.35rem);line-height:1.8}
.finale .wordmark-img{width:min(230px,58vw);margin-top:6px}
footer{background:var(--ink);color:#f3dcc4;font-size:.88rem;padding-block:22px calc(22px + env(safe-area-inset-bottom,0px))}
footer .wrap{display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px}
#confetti{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;z-index:70}

@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;animation-delay:0s!important;transition:none!important}.rv-pre{opacity:1;transform:none}}

/* base reset */
html{-webkit-text-size-adjust:100%}
body{margin:0}
img{max-width:100%;height:auto}
[hidden]{display:none!important}
.hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}
.admin-bar .top{top:32px}
@media (max-width:782px){.admin-bar .top{top:46px}}
button[disabled]{opacity:.7;cursor:wait}

/* language switch */
.nav a.lang{border:1.5px solid rgba(201,161,90,.6);color:var(--ink);font-family:var(--f-lat);letter-spacing:.08em;padding:6px 14px}
.nav a.lang[lang="ar"]{font-family:var(--f-head);letter-spacing:0}
@media (max-width:760px){.nav a.lang{display:inline-flex}}

/* English (LTR) */
html[lang="en"] body{font-family:var(--f-head);font-weight:400;line-height:1.75}
html[lang="en"] .hello,html[lang="en"] .hg-copy .ar-soon,html[lang="en"] .finale .soon{font-family:var(--f-lat);font-weight:400;letter-spacing:.01em}
html[lang="en"] .hello{font-size:clamp(2.4rem,7vw,4.6rem);line-height:1.3}
html[lang="en"] .hg-copy .ar-soon{line-height:1.3}
html[lang="en"] .finale .soon{line-height:1.2}
html[lang="en"] .story-stick::before{left:70%}
html[lang="en"] .stage{transform:translateX(10px)}
html[lang="en"] .stage.on{transform:none}
html[lang="en"] .head h2,html[lang="en"] .story-text h2,html[lang="en"] .offer-text h2,html[lang="en"] .join-box h2{line-height:1.3}
@media (max-width:820px){html[lang="en"] .story-stick::before{left:50%}}