:root{
  --t:#5bb8b0;  --td:#3a9e96;  --tl:#c5eae7;  --txl:#eaf7f6;  --txx:#f4fbfa;
  --p:#7b5ea7;  --pd:#5c4280;  --pl:#d8cff0;  --pxl:#f0ecf9;
  --pk:#e84393; --pkd:#c42d79; --pkl:#f5b8d8; --pkxl:#fdeef7;
  --g:linear-gradient(135deg,#5bb8b0 0%,#7b5ea7 52%,#e84393 100%);
  --gh:linear-gradient(90deg,#7b5ea7 0%,#e84393 100%);
  --gt:linear-gradient(90deg,#5bb8b0 0%,#7b5ea7 100%);
  --gd:linear-gradient(180deg,#5bb8b0,#7b5ea7,#e84393);
  --w:#ffffff; --off:#f7f8fc; --off2:#f2f4fa;
  --tx:#080615; --tx2:#1a1630; --mu:#66607a; --mu2:#aaa6bc;
  --ln:rgba(0,0,0,.07); --lnt:rgba(91,184,176,.18); --lnp:rgba(123,94,167,.14);
  --sh:0 2px 20px rgba(123,94,167,.08); --shm:0 8px 40px rgba(123,94,167,.12);
  --shl:0 24px 72px rgba(123,94,167,.15);
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{font-family:'Bricolage Grotesque',sans-serif;background:#fff;color:var(--tx);overflow-x:hidden;}

/* CURSOR */
*,a,button{cursor:none!important;}
#c1{position:fixed;width:10px;height:10px;background:var(--t);border-radius:50%;pointer-events:none;z-index:9999;transform:translate(-50%,-50%);transition:background .2s,transform .15s;}
#c2{position:fixed;width:36px;height:36px;border:1.5px solid var(--p);border-radius:50%;pointer-events:none;z-index:9998;transform:translate(-50%,-50%);opacity:.5;transition:all .28s;}
body:has(a:hover) #c1,body:has(button:hover) #c1{background:var(--pk);transform:translate(-50%,-50%) scale(1.4);}
body:has(a:hover) #c2,body:has(button:hover) #c2{width:54px;height:54px;opacity:.9;border-color:var(--pk);}

/* ══════════════════════════════
   HERO — magazine split
══════════════════════════════ */
.hero{min-height:100vh;
background:#fff;
display:grid;
grid-template-columns:55% 45%;
position:relative;
overflow:hidden;}

/* soft background wash */
.hero-wash{position:absolute;
inset:0;
pointer-events:none;
background:
    radial-gradient(ellipse 60% 70% at 80% 20%,rgba(91,184,176,.08) 0%,transparent 60%),
    radial-gradient(ellipse 50% 60% at 90% 90%,rgba(232,67,147,.06) 0%,transparent 60%),
    radial-gradient(ellipse 40% 50% at 5% 70%,rgba(123,94,167,.05) 0%,transparent 60%);}

/* very subtle line texture */
.hero-lines{position:absolute;
inset:0;
pointer-events:none;
background-image:repeating-linear-gradient(
    0deg,transparent,transparent 39px,rgba(123,94,167,.03) 39px,rgba(123,94,167,.03) 40px
  );}

.hero-left{padding:5.5rem 4rem 5.5rem 7rem;
display:flex;
flex-direction:column;
justify-content:center;
position:relative;
z-index:3;}

/* eyebrow */
.ew{display:inline-flex;
align-items:center;
gap:12px;
margin-bottom:2rem;
opacity:0;
animation:rise .7s .05s ease forwards;}
.ew-badge{font-size:.65rem;
font-weight:700;
letter-spacing:.2em;
text-transform:uppercase;
background:var(--g);
color: #fff !important;
padding:5px 16px;
border-radius:100px;
font-family:'Bricolage Grotesque',sans-serif;}
.ew-loc{font-size:.72rem;
font-weight:600;
color:var(--mu);
display:flex;
align-items:center;
gap:6px;}
.ew-dot{width:6px;height:6px;border-radius:50%;background:var(--t);animation:pulse 2s infinite;}
@keyframes pulse{0%,100%{opacity:1;transform:scale(1);}50%{opacity:.3;transform:scale(.7);}}

/* HERO HEADLINE — mixed fonts */
.hero-h{margin-bottom:2rem;
opacity:0;
animation:rise .9s .15s ease forwards;}
.hero-h .sans{font-family:'Bricolage Grotesque',sans-serif;
font-size:clamp(2.8rem,5.5vw,6rem);
font-weight:800;
line-height:.96;
letter-spacing:-.03em;
color:var(--tx);
display:block;}
.hero-h .serif{font-family:'Lora',serif;
font-size:clamp(3.2rem,6vw,6.8rem);
font-weight:400;
font-style:italic;
line-height:.94;
letter-spacing:-.02em;
display:block;
background:var(--g);
-webkit-background-clip:text;
-webkit-text-fill-color:transparent;
background-clip:text;}
.hero-h .muted{font-family:'Bricolage Grotesque',sans-serif;
font-size:clamp(1.6rem,3vw,3rem);
font-weight:300;
color:var(--mu);
line-height:1;
display:block;
margin-top:.2rem;}

.hero-desc{font-size:1rem;
color:var(--mu);
line-height:1.8;
max-width:430px;
font-weight:400;
margin-bottom:2.5rem;
opacity:0;
animation:rise .9s .28s ease forwards;}

/* icon pill row */
.icon-pills{display:flex;
gap:9px;
flex-wrap:wrap;
margin-bottom:2.5rem;
opacity:0;
animation:rise .9s .38s ease forwards;}
.ipill{display:inline-flex;
align-items:center;
gap:7px;
padding:8px 18px;
border-radius:100px;
font-size:.74rem;
font-weight:600;
background:#fff;
border:1px solid var(--lnp);
color:var(--tx2);
box-shadow:var(--sh);
transition:all .22s;}
.ipill:hover{background:var(--pxl);
border-color:var(--pl);
color:var(--pd);
transform:translateY(-2px);}

/* BUTTONS */
.hero-btns{display:flex;
gap:12px;
flex-wrap:wrap;
margin-bottom:2.8rem;
opacity:0;
animation:rise .9s .48s ease forwards;}
.btn1{background:var(--g);
color: #fff !important;
padding:15px 32px;
border-radius:12px;
font-family:'Bricolage Grotesque',sans-serif;
font-weight:700;
font-size:.86rem;
letter-spacing:.03em;
text-decoration:none;
border:none;
display:inline-flex;
align-items:center;
gap:9px;
box-shadow:0 6px 28px rgba(123,94,167,.28);
transition:transform .22s,box-shadow .22s;}
.btn1:hover{transform:translateY(-3px);box-shadow:0 14px 44px rgba(123,94,167,.38);}
.btn2{background:#fff;
color:var(--p);
padding:15px 32px;
border-radius:12px;
font-family:'Bricolage Grotesque',sans-serif;
font-weight:700;
font-size:.86rem;
letter-spacing:.03em;
text-decoration:none;
border:2px solid var(--p);
display:inline-flex;
align-items:center;
gap:9px;
transition:all .22s;}
.btn2:hover{background:var(--p);color: #fff !important;}
.btn3{background:var(--t);
color: #fff !important;
padding:15px 32px;
border-radius:12px;
font-family:'Bricolage Grotesque',sans-serif;
font-weight:700;
font-size:.86rem;
letter-spacing:.03em;
text-decoration:none;
border:none;
display:inline-flex;
align-items:center;
gap:9px;
box-shadow:0 6px 28px rgba(91,184,176,.28);
transition:transform .22s,box-shadow .22s;}
.btn3:hover{transform:translateY(-3px);box-shadow:0 14px 44px rgba(91,184,176,.4);}

/* stat pills inline */
.stat-pills{display:flex;
gap:10px;
flex-wrap:wrap;
opacity:0;
animation:rise .9s .58s ease forwards;}
.sp{display:flex;
align-items:center;
gap:8px;
padding:9px 18px;
border-radius:100px;
background:var(--off);
border:1px solid var(--ln);
font-size:.76rem;
font-weight:600;
color:var(--mu);}
.sp-num{font-family:'Lora',serif;
font-style:italic;
font-size:1.1rem;
font-weight:600;
background:var(--g);
-webkit-background-clip:text;
-webkit-text-fill-color:transparent;
background-clip:text;}

/* HERO RIGHT — stacked portrait style */
.hero-right{position:relative;
z-index:2;
overflow:hidden;
background:var(--off);}

/* large main portrait */
.hr-img{position:absolute;
width:72%;
height:78%;
object-fit:cover;
top:8%;
left:12%;
border-radius:32px 8px 32px 32px;
box-shadow:var(--shl);
opacity:0;
animation:imgIn .9s .3s ease forwards;}

/* small overlay card */
.hr-sm{position:absolute;
width:40%;
height:36%;
object-fit:cover;
bottom:4%;
right:3%;
border-radius:8px 32px 8px 32px;
border:5px solid #fff;
box-shadow:0 16px 48px rgba(0,0,0,.12);
opacity:0;
animation:imgIn .9s .55s ease forwards;}

/* floating info chips */
.hfc{position:absolute;
z-index:8;
background:rgba(255,255,255,.95);
backdrop-filter:blur(14px);
border-radius:16px;
padding:.9rem 1.2rem;
box-shadow:var(--shm);
border:1px solid var(--ln);}
.hfc1{top:5%;left:2%;animation:fup 5.5s ease-in-out infinite;}
.hfc2{bottom:6%;left:6%;animation:fup 5.5s 1.3s ease-in-out infinite;}
@keyframes fup{0%,100%{transform:translateY(0);}50%{transform:translateY(-9px);}}
.hfc-tag{font-size:.57rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--td);margin-bottom:3px;}
.hfc-val{font-size:.88rem;font-weight:700;color:var(--tx);line-height:1.2;}
.hfc-sub{font-size:.66rem;color:var(--mu);margin-top:2px;}
.hfc-stars{color:#f59e0b;font-size:.82rem;letter-spacing:2px;}

/* color blob decoration */
.hr-blob{position:absolute;
width:220px;
height:220px;
border-radius:50%;
background:radial-gradient(circle,rgba(91,184,176,.15) 0%,transparent 70%);
top:-60px;
right:-60px;
pointer-events:none;}

@keyframes rise{from{opacity:0;transform:translateY(22px);}to{opacity:1;transform:translateY(0);}}
@keyframes imgIn{from{opacity:0;transform:scale(.93);}to{opacity:1;transform:scale(1);}}

/* ══════════════════════════════
   TICKER
══════════════════════════════ */
.ticker{background:var(--g);padding:13px 0;overflow:hidden;}
.tk{display:flex;gap:2.5rem;width:max-content;animation:tkr 28s linear infinite;}
.ti{display:flex;align-items:center;gap:8px;color: rgba(255,255,255,.9) !important;font-size:.73rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;white-space:nowrap;}
.tsep{color: rgba(255,255,255,.3) !important;}
@keyframes tkr{0%{transform:translateX(0);}100%{transform:translateX(-50%);}}

/* ══════════════════════════════
   SECTIONS
══════════════════════════════ */
.s{padding:6rem 7rem;}
.sw{background:#fff;}
.soff{background:var(--off);}
.stl{background:var(--txx);}
.spp{background:var(--pxl);}
.spk{background:var(--pkxl);}

.stag{display:inline-flex;
align-items:center;
gap:8px;
font-size:.63rem;
font-weight:700;
letter-spacing:.2em;
text-transform:uppercase;
color:var(--td);
margin-bottom:.9rem;}
.stag::before{content:'';width:22px;height:2px;background:var(--gt);border-radius:2px;}

.sh{font-size:clamp(2.2rem,3.5vw,3.8rem);
font-weight:800;
line-height:1.04;
letter-spacing:-.025em;
margin-bottom:1rem;
color:var(--tx);}
.sh .ser{font-family:'Lora',serif;
font-style:italic;
font-weight:400;
background:var(--g);
-webkit-background-clip:text;
-webkit-text-fill-color:transparent;
background-clip:text;}
.sh .col{background:var(--gh);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}
.ssub{color:var(--mu);font-size:.96rem;line-height:1.78;max-width:520px;font-weight:400;}

/* ══════════════════════════════
   STEPS — icon card row
══════════════════════════════ */
.step-row{display:grid;
grid-template-columns:repeat(4,1fr);
gap:1.5rem;
margin-top:3.5rem;}

.scard{background:#fff;
border:1px solid var(--ln);
border-radius:20px;
padding:2rem 1.6rem;
position:relative;
overflow:hidden;
transition:all .3s;}
.scard:hover{border-color:var(--lnt);
box-shadow:0 12px 40px rgba(91,184,176,.12);
transform:translateY(-5px);}
/* gradient left accent */
.scard::before{content:'';
position:absolute;
left:0;
top:20%;
bottom:20%;
width:3px;
border-radius:0 3px 3px 0;
background:var(--gd);
transform:scaleY(0);
transform-origin:center;
transition:transform .3s;}
.scard:hover::before{transform:scaleY(1);}

.scard-num{position:absolute;
top:12px;
right:16px;
font-family:'Lora',serif;
font-style:italic;
font-size:3.5rem;
font-weight:600;
line-height:1;
color:rgba(91,184,176,.1);
pointer-events:none;
transition:color .3s;}
.scard:hover .scard-num{color:rgba(91,184,176,.22);}

.scard-ico{width:52px;
height:52px;
border-radius:14px;
display:flex;
align-items:center;
justify-content:center;
font-size:1.4rem;
margin-bottom:1.2rem;
border:1px solid var(--ln);
background:#fff;
transition:all .3s;
position:relative;
z-index:1;}
.scard:nth-child(1) .scard-ico{background:var(--txx);}
.scard:nth-child(2) .scard-ico{background:var(--pxl);}
.scard:nth-child(3) .scard-ico{background:var(--pkxl);}
.scard:nth-child(4) .scard-ico{background:var(--txx);}
.scard:hover .scard-ico{transform:scale(1.1);}

.scard h4{font-weight:700;font-size:.92rem;margin-bottom:.5rem;color:var(--tx);position:relative;z-index:1;}
.scard p{font-size:.79rem;color:var(--mu);line-height:1.6;position:relative;z-index:1;}

/* ══════════════════════════════
   SOCIAL SCENE SHOWCASE
══════════════════════════════ */
/* Large asymmetric photo + text layout */
.scene-wrap{display:grid;
grid-template-columns:1.1fr 1fr;
gap:4rem;
align-items:center;
margin-top:3.5rem;}

.scene-imgs{position:relative;}
.si-main{width:100%;
height:520px;
object-fit:cover;
border-radius:28px;
box-shadow:var(--shl);
filter:brightness(.92) saturate(1.1);}

/* overlapping second image */
.si-over{position:absolute;
width:48%;
height:42%;
object-fit:cover;
bottom:-24px;
right:-24px;
border-radius:20px;
border:5px solid #fff;
box-shadow:0 16px 50px rgba(0,0,0,.12);
animation:fup 5s ease-in-out infinite;}

/* gradient corner accent */
.scene-imgs::before{content:'';
position:absolute;
top:-12px;
left:-12px;
width:100px;
height:100px;
background:radial-gradient(circle,rgba(91,184,176,.2) 0%,transparent 70%);
border-radius:50%;
pointer-events:none;}

.scene-list{display:flex;flex-direction:column;gap:.9rem;}
.sl-card{display:flex;
align-items:center;
gap:1.2rem;
padding:1.3rem 1.6rem;
border-radius:14px;
background:#fff;
border:1px solid var(--ln);
transition:all .28s;}
.sl-card:hover{border-color:var(--lnt);
background:var(--txx);
transform:translateX(7px);
box-shadow:0 6px 24px rgba(91,184,176,.1);}
.sl-num{font-family:'Lora',serif;
font-style:italic;
font-size:1.8rem;
font-weight:600;
color:rgba(91,184,176,.2);
min-width:36px;
line-height:1;
transition:color .28s;}
.sl-card:hover .sl-num{color:var(--t);}
.sl-ico{font-size:1.2rem;flex-shrink:0;}
.sl-info h4{font-weight:700;font-size:.9rem;margin-bottom:2px;color:var(--tx);}
.sl-info p{font-size:.75rem;color:var(--mu);font-weight:400;}
.sl-tag{margin-left:auto;
padding:3px 13px;
border-radius:100px;
font-size:.62rem;
font-weight:700;
letter-spacing:.08em;
text-transform:uppercase;
background:var(--txx);
color:var(--td);
border:1px solid var(--tl);
white-space:nowrap;
flex-shrink:0;}

/* ══════════════════════════════
   PHOTO MOSAIC — 5 cell grid
══════════════════════════════ */
.mosaic{display:grid;
grid-template-columns:1.4fr 1fr 1fr;
grid-template-rows:230px 230px;
gap:10px;
margin-top:3rem;
border-radius:24px;
overflow:hidden;}
.mc{position:relative;overflow:hidden;border-radius:12px;}
.mc:first-child{grid-row:span 2;border-radius:12px;}
.mc img{width:100%;
height:100%;
object-fit:cover;
display:block;
filter:brightness(.88) saturate(1.1);
transition:transform .55s ease,filter .4s;}
.mc:hover img{transform:scale(1.06);filter:brightness(.78) saturate(1.3);}
/* teal tint on hover */
.mc::after{content:'';
position:absolute;
inset:0;
background:rgba(91,184,176,0);
transition:background .4s;
border-radius:inherit;}
.mc:hover::after{background:rgba(91,184,176,.07);}

/* ══════════════════════════════
   WHY SOCIAL COMPANION
══════════════════════════════ */
.why-layout{display:grid;grid-template-columns:1fr 1fr;gap:5rem;align-items:center;}

.why-vis{position:relative;}
.wy-img{width:100%;
height:560px;
object-fit:cover;
border-radius:24px;
box-shadow:var(--shl);
filter:brightness(.9) saturate(1.1);}
.wy-card{position:absolute;
background:#fff;
border-radius:16px;
padding:1.1rem 1.5rem;
box-shadow:0 12px 40px rgba(0,0,0,.1);
border:1px solid var(--ln);}
.wy-c1{bottom:-20px;left:-20px;animation:wf1 5s ease-in-out infinite;min-width:150px;}
.wy-c2{top:20px;right:-24px;animation:wf2 5s 1.3s ease-in-out infinite;min-width:145px;}
@keyframes wf1{0%,100%{transform:translateY(0);}50%{transform:translateY(-10px);}}
@keyframes wf2{0%,100%{transform:translateY(0);}50%{transform:translateY(-8px);}}
.wc-ico{font-size:1.5rem;display:block;margin-bottom:4px;}
.wc-n{font-family:'Lora',serif;
font-style:italic;
font-size:1.7rem;
font-weight:600;
line-height:1;
background:var(--g);
-webkit-background-clip:text;
-webkit-text-fill-color:transparent;
background-clip:text;}
.wc-l{font-size:.6rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--mu);}

/* dashed corner frame */
.why-vis::after{content:'';
position:absolute;
bottom:-14px;
right:-14px;
width:60%;
height:60%;
border:2px dashed rgba(91,184,176,.25);
border-radius:20px;
pointer-events:none;
z-index:-1;}

/* features */
.feat{display:flex;flex-direction:column;gap:0;margin-top:2.5rem;border-radius:18px;overflow:hidden;border:1px solid var(--ln);}
.fr{display:flex;
align-items:flex-start;
gap:1.2rem;
padding:1.4rem 1.6rem;
background:#fff;
border-bottom:1px solid var(--ln);
transition:all .25s;}
.fr:last-child{border-bottom:none;}
.fr:hover{background:var(--txx);}
.fr-ico{width:44px;
height:44px;
border-radius:12px;
display:flex;
align-items:center;
justify-content:center;
font-size:1.1rem;
flex-shrink:0;
border:1px solid var(--ln);
transition:all .25s;}
.fr:nth-child(1) .fr-ico{background:var(--txx);border-color:var(--tl);}
.fr:nth-child(2) .fr-ico{background:var(--pxl);border-color:var(--pl);}
.fr:nth-child(3) .fr-ico{background:var(--pkxl);border-color:var(--pkl);}
.fr:nth-child(4) .fr-ico{background:var(--txx);border-color:var(--tl);}
.fr:hover .fr-ico{transform:scale(1.08);}
.fr-tx h4{font-weight:700;font-size:.9rem;margin-bottom:3px;color:var(--tx);}
.fr-tx p{font-size:.78rem;color:var(--mu);line-height:1.55;}
.fr-ar{margin-left:auto;color:var(--mu2);font-size:1rem;padding-top:2px;transition:all .25s;flex-shrink:0;}
.fr:hover .fr-ar{color:var(--td);transform:translateX(5px);}

/* ══════════════════════════════
   COMPANION TYPES
══════════════════════════════ */
.ctype-grid{display:grid;
grid-template-columns:repeat(3,1fr);
gap:1.2rem;
margin-top:3rem;}
.ct{border-radius:20px;
overflow:hidden;
background:#fff;
border:1px solid var(--ln);
transition:all .32s;
position:relative;}
/* gradient stripe bottom */
.ct::after{content:'';
position:absolute;
bottom:0;
left:0;
right:0;
height:3px;
background:var(--g);
transform:scaleX(0);
transform-origin:center;
transition:transform .32s;}
.ct:hover::after{transform:scaleX(1);}
.ct:hover{transform:translateY(-7px);
box-shadow:0 20px 56px rgba(123,94,167,.13);
border-color:var(--lnp);}
.ct-img{width:100%;height:190px;object-fit:cover;display:block;transition:transform .5s;}
.ct:hover .ct-img{transform:scale(1.05);}
.ct-body{padding:1.4rem;}
.ct-body h4{font-weight:700;font-size:.92rem;margin-bottom:5px;color:var(--tx);}
.ct-body p{font-size:.78rem;color:var(--mu);line-height:1.55;}
.ct-pill{display:inline-flex;
align-items:center;
gap:5px;
margin-top:11px;
padding:4px 14px;
border-radius:100px;
font-size:.62rem;
font-weight:700;
letter-spacing:.09em;
text-transform:uppercase;}
.ct:nth-child(1) .ct-pill{background:var(--txx);color:var(--td);}
.ct:nth-child(2) .ct-pill{background:var(--pxl);color:var(--pd);}
.ct:nth-child(3) .ct-pill{background:var(--pkxl);color:var(--pkd);}
.ct:nth-child(4) .ct-pill{background:var(--txx);color:var(--td);}
.ct:nth-child(5) .ct-pill{background:var(--pxl);color:var(--pd);}
.ct:nth-child(6) .ct-pill{background:var(--pkxl);color:var(--pkd);}

/* ══════════════════════════════
   MARQUEE
══════════════════════════════ */
.mqs{padding:2.5rem 0;
overflow:hidden;
background:#fff;
border-top:1px solid var(--ln);
border-bottom:1px solid var(--ln);}
.mqi{display:flex;width:max-content;animation:mqr 22s linear infinite;}
.mw{font-family:'Lora',serif;
font-style:italic;
font-size:5.5rem;
font-weight:400;
padding:0 1.5rem;
white-space:nowrap;
color:transparent;
-webkit-text-stroke:1.2px rgba(123,94,167,.16);
line-height:1;}
.mw.on{-webkit-text-stroke:0;
background:var(--g);
-webkit-background-clip:text;
-webkit-text-fill-color:transparent;
background-clip:text;}
.msep{font-size:2rem;line-height:5.5rem;padding:0 .5rem;color:var(--t);}
@keyframes mqr{0%{transform:translateX(0);}100%{transform:translateX(-50%);}}

/* ══════════════════════════════
   STATS BAND
══════════════════════════════ */
.stats-band{display:grid;
grid-template-columns:repeat(4,1fr);
border-top:1px solid var(--ln);
border-bottom:1px solid var(--ln);
background:#fff;
margin-top:4rem;}
.sb{padding:2.4rem 1.5rem;
border-right:1px solid var(--ln);
text-align:center;
transition:background .3s;}
.sb:last-child{border-right:none;}
.sb:hover{background:var(--txx);}
.sb-n{font-family:'Lora',serif;
font-style:italic;
font-size:3.2rem;
font-weight:600;
line-height:1;
background:var(--g);
-webkit-background-clip:text;
-webkit-text-fill-color:transparent;
background-clip:text;
margin-bottom:.3rem;
display:block;}
.sb h4{font-weight:700;font-size:.86rem;margin-bottom:.3rem;color:var(--tx);}
.sb p{font-size:.71rem;color:var(--mu);line-height:1.45;}

/* ══════════════════════════════
   CTA
══════════════════════════════ */
.cta-s{padding:6rem 7rem;background:var(--off);}
.cta-box{border-radius:28px;
overflow:hidden;
position:relative;
display:grid;
grid-template-columns:1fr 1fr;
min-height:440px;
background:#fff;
border:1px solid var(--lnt);
box-shadow:var(--shl);}
/* top gradient border */
.cta-box::before{content:'';position:absolute;top:0;left:0;right:0;height:4px;background:var(--g);}
/* dot pattern */
.cta-box::after{content:'';
position:absolute;
inset:0;
background-image:radial-gradient(circle,rgba(91,184,176,.08) 1px,transparent 1px);
background-size:24px 24px;
-webkit-mask-image:radial-gradient(ellipse 80% 90% at 32% 50%,black 20%,transparent 72%);
mask-image:radial-gradient(ellipse 80% 90% at 32% 50%,black 20%,transparent 72%);
pointer-events:none;}
.cta-left{padding:4.5rem;
position:relative;
z-index:2;
display:flex;
flex-direction:column;
justify-content:center;}
.cta-left h2{font-size:3rem;
font-weight:800;
line-height:1.0;
letter-spacing:-.025em;
color:var(--tx);
margin-bottom:.9rem;}
.cta-left h2 .ser{font-family:'Lora',serif;
font-style:italic;
font-weight:400;
font-size:1.15em;
background:var(--g);
-webkit-background-clip:text;
-webkit-text-fill-color:transparent;
background-clip:text;}
.cta-left p{color:var(--mu);font-size:.96rem;font-weight:400;margin-bottom:2rem;line-height:1.72;max-width:380px;}
.cta-btns{display:flex;gap:12px;flex-wrap:wrap;}
.cta-right{position:relative;overflow:hidden;}
.cta-right img{width:100%;height:100%;object-fit:cover;display:block;filter:brightness(.87) saturate(1.15);}
.cta-right::before{content:'';position:absolute;inset:0;z-index:1;background:linear-gradient(to right,#fff 0%,transparent 42%);}

/* ══════════════════════════════
   SCROLL REVEAL
══════════════════════════════ */
.rev{opacity:0;transform:translateY(28px);transition:opacity .78s ease,transform .78s ease;}
.rev.on{opacity:1;transform:translateY(0);}
.rev.d1{transition-delay:.1s;}.rev.d2{transition-delay:.2s;}.rev.d3{transition-delay:.3s;}

/* ══════════════════════════════
   RESPONSIVE
══════════════════════════════ */
@media(max-width:1100px){
  .hero{grid-template-columns:1fr;min-height:auto;}
  .hero-left{padding:5rem 3rem 3rem;}
  .hero-right{height:420px;}
  .s,.cta-s{padding:4rem 3rem;}
  .step-row{grid-template-columns:repeat(2,1fr);}
  .scene-wrap{grid-template-columns:1fr;}
  .why-layout{grid-template-columns:1fr;}
  .ctype-grid{grid-template-columns:repeat(2,1fr);}
  .stats-band{grid-template-columns:repeat(2,1fr);}
  .cta-box{grid-template-columns:1fr;}
  .cta-right{height:260px;}
}
@media(max-width:640px){
  .hero-left{padding:4rem 1.5rem 2.5rem;}
  .hero-right{height:320px;}
  .s,.cta-s{padding:3rem 1.5rem;}
  .step-row,.ctype-grid,.stats-band{grid-template-columns:1fr;}
  .mosaic{grid-template-columns:1fr 1fr;grid-template-rows:180px 180px;}
  .mosaic .mc:first-child{grid-row:span 1;}
  .mosaic .mc:nth-child(n+4){display:none;}
  .stats-band .sb{border-right:none;border-bottom:1px solid var(--ln);}
  #c1,#c2{display:none;}
}