/* ==========================================================================
   Inspirate Media — styles.css
   Units: 1rem = 1 design px ÷ 10.
   · Mobile (< 1024px): root scales 10px @390 → 13px @1023 (fluid tablet)
   · Desktop (≥ 1024px): root = min(100vw, 1440px) / 144 → exact 1440 artboard
   ========================================================================== */

/* ---------- Fonts ---------- */
@font-face{font-family:'Clash Display';src:url(../fonts/ClashDisplay-Medium.woff2) format('woff2');font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:'Clash Display';src:url(../fonts/ClashDisplay-Semibold.woff2) format('woff2');font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:'Clash Display';src:url(../fonts/ClashDisplay-Bold.woff2) format('woff2');font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:'General Sans';src:url(../fonts/GeneralSans-Regular.woff2) format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'General Sans';src:url(../fonts/GeneralSans-Medium.woff2) format('woff2');font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:'General Sans';src:url(../fonts/GeneralSans-Semibold.woff2) format('woff2');font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:'Instrument Serif';src:url(../fonts/InstrumentSerif-Italic.woff2) format('woff2');font-weight:400;font-style:italic;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Instrument Serif';src:url(../fonts/InstrumentSerif-Italic-ext.woff2) format('woff2');font-weight:400;font-style:italic;font-display:swap;unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Instrument Serif';src:url(../fonts/InstrumentSerif-Regular.woff2) format('woff2');font-weight:400;font-style:normal;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Instrument Serif';src:url(../fonts/InstrumentSerif-Regular-ext.woff2) format('woff2');font-weight:400;font-style:normal;font-display:swap;unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}

/* ---------- Tokens ---------- */
:root{
  --ink:#0B0B10; --cream:#F4EFE6; --surface:#15151C; --surface-2:#18181F; --surface-3:#1D1D25; --surface-4:#22222B;
  --muted-d:#B8B2A8; --muted-c:#5B5750; --ph:#8E897F; --line-c:#E4DED4;
  --c06:rgba(244,239,230,.06); --c10:rgba(244,239,230,.1); --c12:rgba(244,239,230,.12); --c20:rgba(244,239,230,.2); --c35:rgba(244,239,230,.35);
  --grad:linear-gradient(135deg,#FF5A36,#E6007E 55%,#7B3FF2);
  --grad-text:linear-gradient(95deg,#FF5A36,#E6007E 55%,#7B3FF2);
  --grad-btn:linear-gradient(100deg,#FF5A36,#E6007E 45%,#7B3FF2 90%);
  --grad-hl:linear-gradient(100deg,#FF5A36,#E6007E 55%,#7B3FF2);
  --grad-border:linear-gradient(120deg,#FF5A36,#E6007E,#7B3FF2);
  --fd:'Clash Display',ui-sans-serif,system-ui,-apple-system,'Segoe UI',sans-serif;
  --fs:'Instrument Serif',Georgia,'Times New Roman',serif;
  --fb:'General Sans',ui-sans-serif,system-ui,-apple-system,'Segoe UI',sans-serif;
  --ease:cubic-bezier(.2,.8,.2,1);
  --ease-soft:cubic-bezier(.2,.7,.2,1);
  --glow:0 0 0 4px rgba(230,0,126,.35),0 14px 40px -10px rgba(230,0,126,.7);
  --ring:0 0 0 4px rgba(255,90,54,.22);
  --shadow-photo:0 4rem 8rem -3rem rgba(0,0,0,.85),0 0 0 1px var(--c10);
  --pad:2rem;
  --header-h:7.2rem;
}
html{font-size:clamp(9px,calc(10px + 3 * (100vw - 390px) / 633),13px);-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:var(--header-h)}
@media (min-width:1024px){
  html{font-size:calc(min(100vw,1440px) / 144)}
  :root{--pad:4.8rem;--header-h:9.6rem}
}

/* ---------- Base ---------- */
*,*::before,*::after{box-sizing:border-box}
body{margin:0;background:var(--ink);color:var(--cream);font-family:var(--fb);font-size:max(1.6rem,15px);line-height:1.5;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:clip;text-rendering:optimizeLegibility}
img,svg{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit;color:inherit}
h1,h2,h3,p,ul,ol,dl,dd{margin:0}
ul,ol{padding:0;list-style:none}
input::placeholder,textarea::placeholder{color:var(--ph);opacity:1}
:focus-visible{outline:2px solid #FF5A36;outline-offset:3px;border-radius:6px}
.faq :focus-visible,.why :focus-visible{outline-color:#C4003F}
.ic{width:1em;height:1em;fill:currentColor;flex:none}
.ic-arrow{transition:transform .35s var(--ease)}
a:hover .ic-arrow,button:hover .ic-arrow{transform:translate(2px,-2px)}
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip-link{position:fixed;left:1.6rem;top:1.2rem;z-index:300;padding:1.2rem 1.8rem;border-radius:999px;background:var(--cream);color:var(--ink);font-weight:600;transform:translateY(-200%);transition:transform .3s}
.skip-link:focus{transform:none}
.hp{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}
[hidden]{display:none!important}
.bd,.bd-inline{display:none}
.line{display:block}
.serif{font-family:var(--fs);font-style:italic;font-weight:400}
.grad-text{background:var(--grad-text);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
@media (min-width:1024px){
  .bm{display:none}
  .bd{display:inline}
  .bd-inline{display:inline}
}

/* Eyebrow */
.eyebrow{display:flex;align-items:center;gap:.8rem;font:500 max(1.3rem,12px)/1 var(--fb);color:var(--muted-d)}
.eyebrow--cream{color:var(--muted-c)}
.dot{width:.7rem;height:.7rem;border-radius:50%;background:var(--dot,#FF5A36);flex:none}
@media (min-width:1024px){
  .eyebrow{gap:1rem;font-size:max(1.4rem,12px);letter-spacing:.02em}
  .dot{width:.8rem;height:.8rem}
}

/* Headlines */
.h2{margin-top:2.2rem;font:600 5.4rem/.92 var(--fd);letter-spacing:-.045em}
.h2--xl{font-size:4.8rem}
.h2--xl .serif{display:inline-block;font-size:1.14em;line-height:.9;letter-spacing:-.02em;padding-right:.06em}
.hl{position:relative;display:inline-block;isolation:isolate;margin-top:.4rem;font:italic 400 1.14em/.9 var(--fs);letter-spacing:-.02em}
.hl::before{content:"";position:absolute;z-index:-1;left:-.04em;right:-.06em;bottom:.08em;height:.36em;border-radius:.1em;background:var(--grad-hl);transform:rotate(-1.5deg)}
.hl--thin{margin-top:.2rem}
.hl--thin::before{height:.34em}
@media (min-width:1024px){
  .h2{margin-top:2.8rem;font-size:10.4rem;line-height:.9}
  .h2--xl{font-size:12rem}
  .h2--xl .serif{font-size:1.12em}
  .hl{margin-top:.6rem}
  .hl--thin{margin-top:.4rem}
}

/* ---------- Logo ---------- */
.logo{display:inline-flex;align-items:center;font:600 2.3rem/1 var(--fd);letter-spacing:-.045em;white-space:nowrap;min-height:44px}
.logo__i{position:relative;display:inline-block;width:.27em;height:.74em;margin:0 .035em 0 .01em}
.logo__i::before{content:"";position:absolute;left:.025em;top:0;width:.22em;height:.22em;border-radius:50%;background:var(--grad)}
.logo__i::after{content:"";position:absolute;left:0;bottom:0;width:.27em;height:.48em;border-radius:.07em;background:currentColor}
.logo__m{font:italic 400 1.1em/1 var(--fs);letter-spacing:-.01em;margin-left:.12em}
.logo--footer{font-size:2.5rem}
@media (min-width:1024px){
  .logo{font-size:2.6rem}
  .logo--footer{font-size:3.1rem}
}

/* ---------- Buttons ---------- */
.btn-cream{display:inline-flex;align-items:center;gap:1.4rem;height:max(5.2rem,44px);padding:0 .6rem 0 2.2rem;border-radius:999px;background:var(--cream);color:var(--ink);font:600 max(1.5rem,14px)/1 var(--fb);white-space:nowrap;transition:box-shadow .35s,transform .35s}
.btn-cream:hover{box-shadow:var(--glow);transform:translateY(-1px)}
.btn-cream__dot{width:max(4rem,34px);height:max(4rem,34px);border-radius:50%;display:grid;place-items:center;background:var(--grad);color:#fff;font-size:max(1.8rem,16px)}

.btn-grad{position:relative;display:flex;align-items:center;justify-content:space-between;gap:1.8rem;height:6.2rem;padding:0 .7rem 0 2.6rem;border:0;border-radius:999px;background:var(--grad-btn);background-size:170% 100%;background-position:0% 0;color:#fff;font:600 1.9rem/1 var(--fb);white-space:nowrap;cursor:pointer;box-shadow:0 1.8rem 4.4rem -1.8rem rgba(230,0,126,.8);transition:background-position .7s var(--ease),box-shadow .4s,transform .4s}
.btn-grad:hover{background-position:100% 0;box-shadow:0 2.4rem 6rem -1.4rem rgba(230,0,126,.95);transform:translateY(-2px)}
.btn-grad__dot{width:4.8rem;height:4.8rem;flex:none;border-radius:50%;background:#fff;color:var(--ink);display:grid;place-items:center;font-size:2.1rem}
.btn-grad--xl{height:6.4rem}
.btn-grad--xl .btn-grad__dot{width:5rem;height:5rem;font-size:2.2rem}

.btn-outline{display:flex;align-items:center;justify-content:center;gap:1rem;height:6.2rem;padding:0 3rem;border-radius:999px;border:1.5px solid rgba(244,239,230,.4);font:500 1.8rem/1 var(--fb);white-space:nowrap;transition:background .3s,color .3s,border-color .3s}
.btn-outline .ic{font-size:2.1rem}
.btn-outline:hover{background:var(--cream);color:var(--ink);border-color:var(--cream)}

@media (min-width:1024px){
  .btn-grad{justify-content:flex-start;height:6.8rem;padding:0 .8rem 0 3.2rem;font-size:max(1.9rem,15px);box-shadow:0 1.8rem 5rem -1.8rem rgba(230,0,126,.75)}
  .btn-grad__dot{width:5.2rem;height:5.2rem;font-size:2.2rem}
  .btn-grad--xl{height:8.8rem;padding:0 1rem 0 4rem;gap:2.2rem;font-size:max(2.4rem,17px);box-shadow:0 2.4rem 7rem -2rem rgba(230,0,126,.8)}
  .btn-grad--xl:hover{transform:translateY(-3px) scale(1.02);box-shadow:0 3rem 8rem -1.6rem rgba(230,0,126,1)}
  .btn-grad--xl .btn-grad__dot{width:6.8rem;height:6.8rem;font-size:2.8rem}
  .btn-outline{height:6.8rem;gap:1.2rem;font-size:max(1.9rem,15px)}
  .btn-outline .ic{font-size:2.2rem}
}

/* ---------- Header ---------- */
.header{position:fixed;z-index:50;top:0;left:0;right:0;border-bottom:1px solid transparent;transition:background-color .4s,border-color .4s,-webkit-backdrop-filter .4s,backdrop-filter .4s}
.header.is-scrolled{background:rgba(11,11,16,.62);-webkit-backdrop-filter:blur(18px) saturate(140%);backdrop-filter:blur(18px) saturate(140%);border-bottom-color:rgba(244,239,230,.08)}
.header__in{max-width:144rem;margin:0 auto;height:var(--header-h);padding:0 var(--pad);display:flex;align-items:center;justify-content:space-between}
.nav,.header__cta{display:none}
.burger{width:4.8rem;height:4.8rem;min-width:44px;min-height:44px;padding:0;border-radius:50%;border:1px solid rgba(244,239,230,.22);background:var(--c06);display:grid;place-items:center;cursor:pointer;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}
.burger span{display:grid;gap:6px}
.burger i{display:block;width:20px;height:1.5px;background:var(--cream);transition:transform .3s var(--ease)}
.burger i+i{width:13px;margin-left:7px}
.burger:hover i+i{transform:translateX(-7px)}
@media (min-width:1024px){
  .header__in{display:grid;grid-template-columns:1fr auto 1fr}
  .header .logo{justify-self:start}
  .burger{display:none}
  .nav{display:flex;gap:2px;padding:6px;border-radius:999px;background:var(--c06);border:1px solid var(--c12);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}
  .nav a{padding:12px clamp(12px,1.8rem,18px);border-radius:999px;font:500 max(1.5rem,14px)/1 var(--fb);transition:background .25s}
  .nav a:hover,.nav a.is-active{background:var(--c12)}
  .header__cta{display:inline-flex;justify-self:end}
}

/* ---------- Mobile menu ---------- */
.menu{position:fixed;inset:0;z-index:60;background:var(--ink);display:flex;flex-direction:column;padding:0 var(--pad) calc(2.8rem + env(safe-area-inset-bottom));overflow-y:auto;overscroll-behavior:contain}
.menu[hidden]{display:none}
.menu__top{height:var(--header-h);flex:none;display:flex;align-items:center;justify-content:space-between}
.menu__close{width:4.8rem;height:4.8rem;min-width:44px;min-height:44px;padding:0;border:0;border-radius:50%;background:var(--cream);color:var(--ink);font-size:2.2rem;display:grid;place-items:center;cursor:pointer}
.menu__nav{margin-top:3.2rem;display:flex;flex-direction:column}
.menu__nav a{display:flex;align-items:baseline;justify-content:space-between;padding:1.6rem 0;border-bottom:1px solid var(--c12);font:600 4.4rem/1 var(--fd);letter-spacing:-.04em}
.menu__n{font:500 max(1.3rem,12px)/1 var(--fb);letter-spacing:0;color:var(--ph)}
.menu__foot{margin-top:auto;padding-top:3.2rem;display:grid;gap:2.2rem}
.menu__row{display:flex;align-items:center;justify-content:space-between;gap:1.2rem;flex-wrap:wrap}
.menu__mail{font:500 max(1.5rem,14px)/1 var(--fb);color:var(--muted-d);padding:1.2rem 0}
@media (min-width:1024px){.menu{display:none!important}}

/* ---------- Hero ---------- */
.hero{position:relative;overflow:hidden;padding-top:10rem}
.hero__frame{position:relative;max-width:144rem;margin:0 auto}
.hero__glow{position:absolute;right:-24rem;top:36rem;width:68rem;height:68rem;border-radius:50%;background:radial-gradient(closest-side,rgba(230,0,126,.24),rgba(123,63,242,.1) 60%,transparent);pointer-events:none}
.hero__text{position:relative;padding:0 var(--pad)}
.hero__eyebrow .dot{box-shadow:var(--ring)}
.hero__title{position:relative;z-index:5;margin:1.3rem 0 0 -.2rem;font:600 5rem/.94 var(--fd);letter-spacing:-.045em}
.kin{display:inline-block;font:italic 400 1.2em/.86 var(--fs);letter-spacing:-.02em;padding:0 .08em 0 .02em;background:var(--grad-text);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;will-change:transform,opacity,filter}
.hero__sub{margin-top:2.9rem;max-width:34rem;font:400 1.7rem/1.5 var(--fb);color:var(--muted-d);text-wrap:pretty}
.hero__ctas{margin-top:2.9rem;display:grid;gap:1rem}
@media (min-width:600px) and (max-width:1023px){
  .hero__ctas{display:flex;flex-wrap:wrap;gap:1.2rem}
  .hero__ctas .btn-grad{gap:1.8rem}
  .hero__sub{max-width:48rem}
}

.collage{pointer-events:none}
.collage .card{pointer-events:auto}
.collage--d{display:none}
.collage--m{position:relative;width:39rem;height:36rem;margin:3.4rem auto 0}

/* Social proof */
.proof{position:relative;margin:4.8rem var(--pad) 0;display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem;padding-top:1.8rem;border-top:1px solid var(--c12);font:500 max(1.4rem,13px)/1.2 var(--fb);color:var(--muted-d)}
.proof li{display:flex;flex-direction:column;gap:.6rem}
.proof b{display:block;font:600 3rem/1 var(--fd);letter-spacing:-.03em;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
.proof .g1{background-image:linear-gradient(95deg,#FF5A36,#E6007E)}
.proof .g2{background-image:linear-gradient(95deg,#E6007E,#B02AB8)}
.proof .g3{background-image:linear-gradient(95deg,#B02AB8,#7B3FF2)}
.proof__sep{display:none!important}
@media (min-width:600px) and (max-width:1023px){.proof{max-width:60rem}}

/* Creator cards */
.card{position:absolute;overflow:hidden;aspect-ratio:9/16;border-radius:2.2rem;background:var(--bg,#22222B);box-shadow:var(--shadow-photo);transform:rotate(var(--r,0deg));transition:translate .8s var(--ease-soft),scale .5s var(--ease)}
.card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.card__bars{position:absolute;left:1.2rem;right:1.2rem;top:1.2rem;display:flex;gap:.4rem;pointer-events:none}
.card__bars i{flex:1;height:max(.3rem,2px);border-radius:3px;background:var(--c35);overflow:hidden}
.card__bars i.is-full{background:var(--cream)}
.card__bars b{display:block;height:100%;background:var(--cream);transform-origin:left;transform:scaleX(.6)}
.card__prev{position:absolute;left:1.2rem;top:2.4rem;opacity:0;transition:opacity .3s;pointer-events:none;display:flex;align-items:center;gap:.6rem;padding:.6rem 1rem;border-radius:999px;background:rgba(11,11,16,.6);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);font:600 1.1rem/1 var(--fb);color:#fff}
.card__prev::before{content:"";width:.6rem;height:.6rem;border-radius:50%;background:#FF5A36}
.card__meta{position:absolute;left:0;right:0;bottom:0;padding:5.6rem 1.4rem 1.4rem;display:flex;align-items:flex-end;justify-content:space-between;gap:.8rem;background:linear-gradient(transparent,rgba(11,11,16,.88));pointer-events:none}
.card__h{display:flex;align-items:center;gap:.5rem;font:600 1.4rem/1.2 var(--fb);color:#fff}
.card__h .ic{font-size:1.5rem}
.card__s{font:500 1.2rem/1.4 var(--fb);color:var(--line-c)}
.card__p{width:3rem;height:3rem;flex:none;border-radius:50%;display:grid;place-items:center;background:rgba(11,11,16,.55);color:#fff;font-size:1.5rem}
.card--l{border-radius:2.4rem}
.card--l .card__h{font-size:1.5rem}
.card--l .card__p{width:3.2rem;height:3.2rem;font-size:1.6rem}
.card--xl{border-radius:2.8rem;box-shadow:0 5rem 9rem -3rem rgba(0,0,0,.9),0 0 0 1px var(--c12)}
.card--xl .card__bars{left:1.4rem;right:1.4rem;top:1.4rem}
.card--xl .card__prev{left:1.4rem;top:2.8rem}
.card--xl .card__meta{padding:6.4rem 1.6rem 1.6rem}
.card--xl .card__h{font-size:1.6rem}
.card--xl .card__s{font-size:1.3rem}
.card--xl .card__p{width:3.4rem;height:3.4rem;font-size:1.7rem}
.card--s{border-radius:2rem}
.card--s .card__meta{padding:4.4rem 1.2rem 1.2rem;gap:.6rem}
.card--s .card__h{font-size:1.3rem}
.card--s .card__s{font-size:1.1rem}
.card--s .card__p{width:2.6rem;height:2.6rem;font-size:1.3rem}
.collage--m .card{box-shadow:0 3rem 6rem -2.4rem rgba(0,0,0,.85),0 0 0 1px var(--c10);border-radius:2rem}
.collage--m .card--xs .card__meta{padding:4rem 1.2rem 1.2rem}
.collage--m .card--xs .card__h{font-size:1.2rem}
.collage--m .card--xs .card__s{font-size:1.1rem}
.collage--m .card--m{border-radius:2.4rem;box-shadow:0 4rem 7rem -2.4rem rgba(0,0,0,.9),0 0 0 1px var(--c12)}
.collage--m .card--m .card__meta{padding:4.8rem 1.4rem 1.4rem}
.collage--m .card--m .card__p{width:2.8rem;height:2.8rem;font-size:1.4rem}
[data-cursor="play"]:hover{scale:1.05}
[data-cursor="play"]:hover .card__prev,.card.is-previewing .card__prev{opacity:1}

/* Floating badges */
.badge-views,.badge-eng,.badge-likes{position:absolute;white-space:nowrap;transform:rotate(var(--r,0deg));transition:translate .8s var(--ease-soft)}
.badge-views{display:flex;align-items:center;gap:1rem;padding:.7rem 1.8rem .7rem .7rem;border-radius:999px;background:var(--cream);color:var(--ink);box-shadow:0 1.8rem 3.6rem -1.4rem rgba(0,0,0,.7)}
.badge-views__ic{width:3.8rem;height:3.8rem;border-radius:50%;display:grid;place-items:center;background:var(--ink);color:var(--cream);font-size:1.7rem}
.badge-views b{display:block;font:600 2.2rem/1 var(--fd);letter-spacing:-.03em}
.badge-views b+span{display:block;font:500 1.2rem/1.3 var(--fb);color:var(--muted-c)}
.badge-eng{padding:1.1rem 1.5rem 1.2rem;border-radius:1.6rem;background:linear-gradient(160deg,#FF5A36 0%,#E6007E 45%,#7B3FF2 100%);color:#fff;box-shadow:0 1.8rem 4rem -1.4rem rgba(230,0,126,.8)}
.badge-eng b{display:block;font:600 2.7rem/1 var(--fd);letter-spacing:-.03em}
.badge-eng span{display:block;margin-top:.3rem;font:600 1.3rem/1.2 var(--fb)}
.badge-likes{display:flex;align-items:center;gap:.8rem;padding:1.1rem 1.6rem;border-radius:999px;background:rgba(21,21,28,.78);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border:1px solid rgba(244,239,230,.16);font:600 1.5rem/1 var(--fb)}
.badge-likes .ic{color:#FF5A36;font-size:1.8rem}

/* Marquee */
.marquee{position:relative;margin-top:4.3rem;height:9.2rem;border-top:1px solid var(--c12);overflow:hidden;color:#CFC9BE;font-size:.72rem;-webkit-mask-image:linear-gradient(90deg,transparent,#000 14%,#000 86%,transparent);mask-image:linear-gradient(90deg,transparent,#000 14%,#000 86%,transparent)}
.marquee__track{display:flex;width:max-content;height:100%;align-items:center;will-change:transform}
.marquee__run{display:flex;align-items:center;gap:10em;padding-right:10em;white-space:nowrap}
.lg{font-size:1em;line-height:1}
.lg-1{font:italic 400 3.8em/1 var(--fs)}
.lg-2{font:600 2.2em/1 var(--fd);letter-spacing:.16em}
.lg-3{font:600 3.2em/1 var(--fb);letter-spacing:-.04em}
.lg-4{font:500 2.8em/1 var(--fd);letter-spacing:-.02em}
.lg-5{font:500 1.7em/1 var(--fb);letter-spacing:.28em}
.lg-6{font:700 3.6em/1 var(--fd);letter-spacing:-.06em}
.lg-7{font:400 4em/1 var(--fs);letter-spacing:.02em}
.lg-8{font:600 1.9em/1 var(--fb);letter-spacing:.12em}
.lg-9{font:italic 400 3.4em/1 var(--fs)}
.lg-10{font:700 2.6em/1 var(--fd);letter-spacing:.3em}

@media (min-width:1024px){
  .hero{height:111rem;padding-top:0}
  .hero__frame{height:100%}
  .hero__glow{right:-20rem;top:2rem;width:98rem;height:98rem;background:radial-gradient(closest-side,rgba(230,0,126,.2),rgba(123,63,242,.09) 55%,transparent)}
  .hero__text{position:static;padding:0}
  .hero__eyebrow{position:absolute;left:4.8rem;top:16.8rem}
  .hero__title{position:absolute;left:4.2rem;top:20rem;margin:0;font-size:12.8rem;line-height:.9}
  .kin{font-size:1.1em;line-height:.8}
  .hero__sub{position:absolute;left:4.8rem;top:59.6rem;margin:0;width:52rem;max-width:none;font-size:max(2rem,15px)}
  .hero__ctas{position:absolute;z-index:6;left:4.8rem;top:69.4rem;margin:0;display:flex;gap:1.2rem}
  .collage--d{display:block;position:absolute;inset:0}
  .collage--m{display:none}
  .badge-views{gap:1.2rem;padding:.9rem 2.2rem .9rem .9rem;box-shadow:0 2.2rem 4.4rem -1.6rem rgba(0,0,0,.65)}
  .badge-views__ic{width:4.6rem;height:4.6rem;font-size:2rem}
  .badge-views b{font-size:2.7rem}
  .badge-views b+span{font-size:1.3rem}
  .badge-eng{padding:1.4rem 2rem 1.5rem;border-radius:2rem;box-shadow:0 2.2rem 5rem -1.6rem rgba(230,0,126,.75)}
  .badge-eng b{font-size:3.6rem}
  .badge-eng span{margin-top:.5rem;font-size:1.5rem}
  .proof{position:absolute;left:4.8rem;top:83rem;margin:0;padding:0;border:0;display:flex;align-items:center;gap:1.8rem;font:500 max(1.6rem,13px)/1 var(--fb)}
  .proof li{flex-direction:row;align-items:baseline;gap:.7rem}
  .proof b{font-size:2.4rem;letter-spacing:-.02em}
  .proof__sep{display:block!important;width:4px;height:4px;border-radius:50%;background:var(--muted-c);align-self:center}
  .marquee{position:absolute;left:0;right:0;bottom:0;margin:0;height:12rem;font-size:1rem;-webkit-mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent);mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent)}
  .marquee__run{gap:9.6em;padding-right:9.6em}
}

/* ---------- Why us ---------- */
.why{background:var(--cream);color:var(--ink)}
.why__in{max-width:144rem;margin:0 auto;padding:9.6rem var(--pad) 7.2rem}
.pillars{margin-top:4.8rem}
.pillar{display:grid;grid-template-columns:7.2rem minmax(0,1fr);gap:1.2rem;padding:2.6rem 0 2.8rem;border-top:1px solid rgba(11,11,16,.16);transition:padding .45s var(--ease),background .3s}
.pillar__n{font:600 5rem/.8 var(--fd);letter-spacing:-.05em;color:transparent;-webkit-text-stroke:1.2px var(--ink)}
.pillar h3{font:600 2.4rem/1.06 var(--fd);letter-spacing:-.03em}
.pillar__s{display:block;margin-top:.3rem;font:italic 400 2.4rem/1.1 var(--fs);color:var(--muted-c)}
.tags{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:1.4rem}
.tags li{padding:.9rem 1.3rem;border-radius:999px;border:1px solid rgba(11,11,16,.22);font:500 max(1.3rem,12px)/1 var(--fb)}
@media (min-width:1024px){
  .why__in{padding:16rem var(--pad) 12rem;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:2.4rem;align-items:start}
  .why__head{grid-column:1 / span 6}
  .pillars{grid-column:7 / span 6;margin-top:.8rem}
  .pillar{grid-template-columns:13.2rem minmax(0,1fr);gap:2.4rem;padding:3.6rem 0 4rem}
  .pillar:hover{padding-left:1.4rem;background:linear-gradient(90deg,rgba(11,11,16,.04),transparent)}
  .pillar__n{font-size:8.8rem;-webkit-text-stroke-width:1.5px}
  .pillar h3{font-size:3.8rem;line-height:1.04}
  .pillar__s{margin-top:.4rem;font-size:4rem;line-height:1.05;letter-spacing:-.01em}
  .tags{gap:.8rem;margin-top:2.2rem}
  .tags li{padding:1.1rem 1.8rem;font-size:max(1.5rem,13px)}
}

/* ---------- Benefits ---------- */
.benefits{background:var(--ink)}
.benefits__in{max-width:144rem;margin:0 auto;padding:9.6rem var(--pad) 8.8rem}
.bento{margin-top:4rem;display:grid;gap:1.2rem}
.bcard{position:relative;overflow:hidden;padding:2.4rem;border-radius:2.6rem;border:1px solid transparent;background:linear-gradient(var(--surface),var(--surface)) padding-box,linear-gradient(var(--c10),var(--c10)) border-box;display:flex;flex-direction:column;transition:transform .5s var(--ease)}
@media (hover:hover){
  .bcard:hover{transform:translateY(-6px);background:linear-gradient(var(--surface-2),var(--surface-2)) padding-box,var(--grad-border) border-box}
}
.bcard__foot{margin-top:auto;padding-top:2rem}
.bcard h3{font:600 2.4rem/1.04 var(--fd);letter-spacing:-.03em}
.bcard__foot p{margin-top:.8rem;font:400 max(1.5rem,14px)/1.5 var(--fb);color:var(--muted-d);text-wrap:pretty}
.bcard--case h3{font-size:2.6rem}

/* case study */
.case__top{display:flex;align-items:center;gap:1rem;font:500 max(1.3rem,12px)/1 var(--fb);color:var(--muted-d)}
.case__chip{display:none;padding:.7rem 1.1rem;border-radius:999px;background:rgba(255,90,54,.16);color:#FF8A6E;font-weight:600}
.case__num{display:inline-block;align-self:flex-start;margin-top:1.4rem;font:600 6.4rem/.85 var(--fd);letter-spacing:-.05em;white-space:nowrap;font-variant-numeric:tabular-nums;padding-right:.04em}
.case__lab{margin-top:1rem;font:400 max(1.5rem,14px)/1.4 var(--fb);color:var(--muted-d)}
.story{position:absolute;right:2rem;top:2.2rem;width:9.2rem;aspect-ratio:9/16;border-radius:1.4rem;overflow:hidden;transform:rotate(var(--r));background:linear-gradient(165deg,#F6CE8C,#D07A4A 55%,#40202A);box-shadow:0 2rem 4rem -1.6rem rgba(0,0,0,.8),0 0 0 1px var(--c12)}
.story img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.story__bars{position:absolute;left:.7rem;right:.7rem;top:.7rem;display:flex;gap:.3rem}
.story__bars i{flex:1;height:2px;border-radius:3px;background:var(--c35)}
.story__bars i.is-full{background:var(--cream)}
.story__views{position:absolute;left:.7rem;bottom:.7rem;display:flex;align-items:center;gap:.4rem;padding:.4rem .7rem;border-radius:999px;background:rgba(11,11,16,.6);font:600 1rem/1 var(--fb);color:#fff}
.chart{margin-top:2.6rem;height:9.6rem;display:flex;align-items:flex-end;gap:.6rem}
.chart i{flex:1;border-radius:.6rem;background:var(--c,rgba(244,239,230,.1));transform-origin:bottom}

/* ugc */
.thumbs{position:relative;height:10rem}
.thumb{position:absolute;overflow:hidden;border-radius:1rem;box-shadow:0 1.2rem 3rem -1rem rgba(0,0,0,.8);display:grid;place-items:center;color:#fff}
.thumb img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.thumb .ic{position:relative;font-size:1.8rem;filter:drop-shadow(0 2px 8px rgba(0,0,0,.6))}
.thumb--1{left:0;top:.8rem;width:5.2rem;height:9.2rem;transform:rotate(-8deg);background:linear-gradient(165deg,#F5C3B8,#C0707F 60%,#3B1F2E)}
.thumb--2{left:4.4rem;top:0;width:5.6rem;height:9.8rem;z-index:1;background:linear-gradient(165deg,#B9C77E,#5E7A45 60%,#1F2A1C)}
.thumb--3{left:9.2rem;top:.8rem;width:5.2rem;height:9.2rem;z-index:2;transform:rotate(8deg);background:linear-gradient(165deg,#C3B4F0,#5C4CB0 60%,#1B1535)}
.sticker{position:absolute;right:0;top:1rem;z-index:3;display:flex;align-items:center;gap:.6rem;padding:.8rem 1.1rem;border-radius:999px;background:var(--cream);color:var(--ink);font:600 max(1.2rem,11px)/1 var(--fb);transform:rotate(4deg);white-space:nowrap}

/* engagement */
.comments{display:grid;gap:.8rem}
.comment{display:flex;align-items:center;gap:1rem}
.comment__av{width:2.8rem;height:2.8rem;border-radius:50%;flex:none;background:var(--bg)}
.comment__b{padding:.9rem 1.2rem;border-radius:1.4rem 1.4rem 1.4rem .4rem;background:var(--surface-4);font:500 max(1.4rem,13px)/1.2 var(--fb)}
.comment .ic{margin-left:auto;font-size:1.6rem}
.quality{margin-top:1.6rem}
.quality__row{display:flex;justify-content:space-between;font:500 max(1.3rem,12px)/1 var(--fb);color:var(--muted-d)}
.quality__row b{color:var(--cream);font-weight:600}
.quality__bar{margin-top:.8rem;height:.8rem;border-radius:.8rem;background:var(--c12);overflow:hidden}
.quality__bar i{display:block;width:100%;height:100%;border-radius:.8rem;background:linear-gradient(90deg,#FF5A36,#E6007E 55%,#7B3FF2);transform-origin:left}

/* network */
.net__top{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:1.2rem 2.4rem}
.avatars{display:flex}
.avatars span{width:4.8rem;height:4.8rem;border-radius:50%;display:grid;place-items:center;border:2px solid var(--surface);background:var(--bg);font:600 1.7rem/1 var(--fd)}
.avatars span+span{margin-left:-1.2rem}
.avatars .avatars__more{background:var(--cream);color:var(--ink);font-size:2.2rem}
.net__check{display:flex;align-items:center;gap:.8rem;font:500 max(1.4rem,13px)/1 var(--fb);color:var(--muted-d)}
.net__check .ic{font-size:2rem;color:#E6007E}
.chips{margin-top:1.6rem;display:flex;flex-wrap:wrap;gap:.6rem}
.chips li{padding:.9rem 1.3rem;border-radius:999px;border:1px solid var(--c20);font:500 max(1.3rem,12px)/1 var(--fb)}
.chips li.is-on{background:var(--cream);color:var(--ink);border-color:var(--cream);font-weight:600}

/* multi-market */
.langs{display:grid;gap:.8rem}
.lang{display:flex;align-items:center;gap:1rem;padding:1.1rem 1.2rem;border-radius:1.4rem;background:var(--surface-3)}
.lang:nth-child(2){margin-left:1.4rem}
.lang:nth-child(3){margin-left:2.8rem}
.lang b{width:3.2rem;height:2.6rem;flex:none;display:grid;place-items:center;border-radius:.7rem;background:var(--cream);color:var(--ink);font:600 1.1rem/1 var(--fb)}
.lang b.is-grad{background:linear-gradient(120deg,#E6007E,#7B3FF2);color:#fff}
.lang span{font:500 max(1.4rem,13px)/1.2 var(--fb)}

@media (min-width:640px) and (max-width:1023px){
  .bento{grid-template-columns:1fr 1fr}
  .bcard--case,.bcard--net,.bcard--mkt{grid-column:1 / -1}
}
@media (min-width:1024px){
  .benefits__in{padding:16rem var(--pad)}
  .bento{margin-top:8rem;grid-template-columns:repeat(12,minmax(0,1fr));grid-template-rows:minmax(34rem,auto) minmax(34rem,auto) minmax(25rem,auto);gap:2.4rem}
  .bcard{padding:3.2rem;border-radius:3.2rem}
  .bcard h3{font-size:3.4rem;line-height:1.02}
  .bcard__foot{padding-top:2.4rem}
  .bcard__foot p{margin-top:1.2rem;max-width:46rem;font-size:max(1.6rem,14px)}
  .bcard--ugc,.bcard--eng{padding:2.8rem}
  .bcard--ugc h3,.bcard--eng h3{font-size:2.6rem;line-height:1.04}
  .bcard--ugc .bcard__foot p,.bcard--eng .bcard__foot p{margin-top:1rem;font-size:max(1.5rem,13px);line-height:1.45}
  .bcard--case{grid-column:1 / span 5;grid-row:1 / span 2}
  .bcard--case .bcard__foot p{max-width:40rem}
  .bcard--ugc{grid-column:6 / span 3;grid-row:1}
  .bcard--eng{grid-column:9 / span 4;grid-row:1}
  .bcard--net{grid-column:6 / span 7;grid-row:2}
  .bcard--mkt{grid-column:1 / -1;grid-row:3;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:4.8rem;align-items:end}
  .bcard--mkt .bcard__foot{padding-top:0}
  .case__top{font-size:max(1.4rem,12px)}
  .case__chip{display:block}
  .case__num{margin-top:1.8rem;font-size:10.4rem}
  .story{right:3rem;top:4rem;width:14.8rem;border-radius:2rem;box-shadow:0 3rem 6rem -2rem rgba(0,0,0,.8),0 0 0 1px var(--c12)}
  .story__bars{left:1rem;right:1rem;top:1rem}
  .story__bars i{height:2.5px}
  .story__views{left:1rem;bottom:1rem;gap:.6rem;padding:.6rem .9rem;font-size:1.1rem}
  .chart{margin-top:3.4rem;height:21rem;gap:.9rem}
  .chart i{border-radius:.8rem}
  .thumbs{height:11.8rem}
  .thumb{border-radius:1.2rem}
  .thumb .ic{font-size:2.2rem}
  .thumb--1{top:1rem;width:6.2rem;height:10.8rem}
  .thumb--2{left:5.2rem;width:6.6rem;height:11.6rem}
  .thumb--3{left:10.8rem;top:1rem;width:6.2rem;height:10.8rem}
  .sticker{top:.4rem}
  .comment__av{width:3rem;height:3rem}
  .comment__b{padding:.9rem 1.3rem;border-radius:1.6rem 1.6rem 1.6rem .4rem}
  .quality{margin-top:2rem}
  .quality__bar{margin-top:.9rem}
  .avatars span{width:6.4rem;height:6.4rem;border-width:3px;font-size:2.2rem}
  .avatars span+span{margin-left:-1.6rem}
  .avatars .avatars__more{font-size:2.8rem}
  .chips{margin-top:2.2rem;gap:.8rem}
  .chips li{padding:1rem 1.5rem;font-size:max(1.4rem,12px)}
  .lang{gap:1.2rem;padding:1.2rem 1.4rem;border-radius:1.6rem}
  .lang:nth-child(2){margin-left:2.4rem}
  .lang:nth-child(3){margin-left:4.8rem}
  .lang b{width:3.6rem;height:2.8rem;border-radius:.8rem;font-size:1.2rem}
  .lang span{font-size:max(1.5rem,13px)}
}

/* ---------- FAQ ---------- */
.faq{background:var(--cream);color:var(--ink)}
.faq__in{max-width:144rem;margin:0 auto;padding:9.6rem var(--pad) 8.8rem;display:flex;flex-direction:column}
.acc{margin-top:4rem;border-bottom:1px solid rgba(11,11,16,.16)}
.acc__item{border-top:1px solid rgba(11,11,16,.16)}
.acc__h{font-size:inherit;font-weight:inherit}
.acc__btn{appearance:none;border:0;background:none;margin:0;width:100%;min-height:7.2rem;cursor:pointer;display:grid;grid-template-columns:minmax(0,1fr) 4.4rem;align-items:center;gap:1.4rem;padding:1.6rem 0;text-align:left;color:var(--ink);transition:color .25s}
.acc__n{display:none;font:500 max(1.4rem,12px)/1 var(--fb);opacity:.7}
.acc__q{font:500 1.9rem/1.25 var(--fd);letter-spacing:-.02em}
.acc__ic{width:4.4rem;height:4.4rem;min-width:44px;min-height:44px;border-radius:50%;border:1.5px solid var(--ink);display:grid;place-items:center;font-size:2.1rem;transition:background .35s,color .35s}
.acc__ic .ic{transition:transform .45s var(--ease)}
.acc__btn[aria-expanded="true"] .acc__ic{background:var(--ink);color:var(--cream)}
.acc__btn[aria-expanded="true"] .acc__ic .ic{transform:rotate(45deg)}
.acc__panel{display:grid;grid-template-rows:0fr;transition:grid-template-rows .5s var(--ease)}
.acc__panel>div{overflow:hidden;visibility:hidden;transition:visibility 0s .5s}
.acc__panel p{padding:0 4.4rem 2.2rem 0;font:400 max(1.6rem,15px)/1.55 var(--fb);color:#3E3A34;opacity:0;transition:opacity .4s;text-wrap:pretty}
.acc__panel.is-open{grid-template-rows:1fr}
.acc__panel.is-open>div{visibility:visible;transition-delay:0s}
.acc__panel.is-open p{opacity:1}

.talk{margin-top:3.2rem;padding:2.4rem;border-radius:2.6rem;background:var(--ink);color:var(--cream);display:grid;gap:2rem}
.talk__who{display:flex;align-items:center;gap:1rem;font:500 max(1.3rem,12px)/1.35 var(--fb);color:var(--muted-d)}
.talk__avs{display:flex}
.talk__avs span,.talk__avs img{width:4rem;height:4rem;border-radius:50%;border:2px solid var(--ink);background:var(--bg);object-fit:cover}
.talk__avs>*+*{margin-left:-1rem}
.talk__t{font:600 3rem/1 var(--fd);letter-spacing:-.03em}
.talk__t .serif{font-size:3.4rem;line-height:1;letter-spacing:-.01em;padding-right:.06em}
.talk__actions{display:grid;gap:.8rem}
.talk__btn{display:flex;align-items:center;justify-content:center;gap:1rem;height:5.6rem;min-height:44px;padding:0 2.2rem;border-radius:999px;background:var(--cream);color:var(--ink);font:600 max(1.6rem,15px)/1 var(--fb);white-space:nowrap;transition:transform .3s,box-shadow .3s}
.talk__btn:hover{transform:translateY(-2px);box-shadow:0 0 0 4px rgba(230,0,126,.35)}
.talk__mail{justify-self:center;padding:1.2rem 0;font:500 max(1.5rem,14px)/1 var(--fb);color:var(--line-c)}

@media (min-width:1024px){
  .faq__in{padding:16rem var(--pad);display:grid;grid-template-columns:repeat(12,minmax(0,1fr));grid-template-rows:auto 1fr;column-gap:2.4rem;align-items:start}
  .faq__head{grid-column:1 / span 5;grid-row:1}
  .h2--faq{font-size:9.6rem}
  .talk{grid-column:1 / span 5;grid-row:2;margin-top:6.4rem;width:43.2rem;padding:3rem;border-radius:2.8rem;gap:2.4rem}
  .acc{grid-column:7 / span 6;grid-row:1 / span 2;margin-top:0}
  .acc__btn{grid-template-columns:4.4rem minmax(0,1fr) 5.2rem;gap:1.6rem;padding:2.4rem 0;min-height:0}
  .acc__btn:hover{color:#6B2FE0}
  .acc__n{display:block}
  .acc__q{font-size:2.6rem;line-height:1.2}
  .acc__ic{width:5.2rem;height:5.2rem;font-size:2.4rem}
  .acc__panel p{padding:0 6.8rem 3rem 6rem;font-size:max(1.8rem,15px)}
  .talk__who{gap:1.2rem;font-size:max(1.4rem,12px)}
  .talk__avs span,.talk__avs img{width:4.8rem;height:4.8rem}
  .talk__avs>*+*{margin-left:-1.2rem}
  .talk__t{font-size:3.6rem}
  .talk__t .serif{font-size:4rem}
  .talk__actions{display:flex;align-items:center;gap:1.6rem;flex-wrap:wrap}
  .talk__btn{height:max(5.2rem,44px)}
  .talk__mail{padding:0 0 .4rem;border-bottom:1px solid var(--c35);transition:border-color .3s}
  .talk__mail:hover{border-bottom-color:#FF5A36}
}

/* ---------- Closing CTA ---------- */
.cta{position:relative;overflow:hidden;background:var(--ink)}
.cta__in{position:relative;max-width:144rem;margin:0 auto;padding:11.2rem var(--pad) 9.6rem}
.cta__glow{position:absolute;left:-12rem;top:20rem;width:64rem;height:52rem;border-radius:50%;background:radial-gradient(closest-side,rgba(230,0,126,.22),rgba(123,63,242,.1) 55%,transparent);pointer-events:none}
.cta__card{display:none}
.cta__title{position:relative;font:600 4.8rem/.92 var(--fd);letter-spacing:-.05em}
.cta__title .serif{font-size:1.12em;line-height:.8;letter-spacing:-.02em;padding-right:.06em}
.cta__row{position:relative;margin-top:4rem}
.cta__row .btn-grad{width:100%}
.cta__mail{margin-top:2rem;text-align:center;font:400 max(1.5rem,14px)/1.5 var(--fb);color:var(--muted-d)}
.cta__mail a{color:var(--cream);border-bottom:1px solid var(--c35);transition:border-color .3s}
.cta__mail a:hover{border-bottom-color:#FF5A36}
@media (min-width:600px) and (max-width:1023px){.cta__row .btn-grad{width:auto;display:inline-flex}.cta__mail{text-align:left}}
@media (min-width:1024px){
  .cta__in{padding:18rem var(--pad) 17rem}
  .cta__glow{left:38rem;top:26rem;width:120rem;height:76rem;background:radial-gradient(closest-side,rgba(230,0,126,.2),rgba(123,63,242,.1) 55%,transparent)}
  .cta__card{display:block;right:6.4rem;top:12rem;width:17rem;border-radius:2.2rem;box-shadow:0 4rem 8rem -3rem rgba(0,0,0,.85),0 0 0 1px var(--c12)}
  .card__meta--sm{padding:4.8rem 1.4rem 1.4rem}
  .cta__title{font-size:14.8rem;line-height:.88}
  .cta__indent{padding-left:22.8rem}
  .cta__row{margin-top:6.4rem;display:flex;align-items:center;gap:3.2rem}
  .cta__row .btn-grad{width:auto}
  .cta__mail{margin:0;text-align:left;font-size:max(1.7rem,14px)}
}

/* ---------- Footer ---------- */
.footer{position:relative;overflow:hidden;background:var(--ink)}
.footer__in{max-width:144rem;margin:0 auto;padding:0 var(--pad)}
.footer__grid{border-top:1px solid var(--c12);padding-top:5.6rem;display:grid;gap:4.4rem;grid-template-areas:"brand" "news" "cols" "hello"}
.footer__brand{grid-area:brand;display:grid;gap:2rem;justify-items:start}
.footer__tag{font:600 3rem/1.04 var(--fd);letter-spacing:-.03em}
.footer__tag .serif{font-size:3.3rem;line-height:1;letter-spacing:-.01em;color:var(--line-c)}
.footer__cols{grid-area:cols}
.footer__hello{grid-area:hello}
.footer__news{grid-area:news}
.flabel{margin:0 0 1.4rem;font:500 max(1.2rem,12px)/1 var(--fb);color:var(--ph);letter-spacing:.08em;text-transform:uppercase}
.footer__cols ul{display:grid}
.footer__cols a{display:inline-flex;align-items:center;min-height:44px;font:500 max(1.5rem,14px)/1.3 var(--fb);color:var(--line-c);transition:color .2s}
.footer__cols a:hover{color:#FF8A6E}
.footer__mail{display:inline-block;font:600 2.6rem/1 var(--fd);letter-spacing:-.03em;padding-bottom:.5rem;border-bottom:2px solid var(--c20);transition:border-color .3s;overflow-wrap:anywhere}
.footer__mail:hover{border-bottom-color:#E6007E}
.footer__newsp{margin:-.2rem 0 1.4rem;font:400 max(1.5rem,14px)/1.5 var(--fb);color:var(--muted-d)}
.news__box{display:grid;gap:.8rem}
.news input[type=email]{width:100%;height:5.6rem;min-height:44px;padding:0 2rem;border-radius:999px;border:1px solid rgba(244,239,230,.22);background:rgba(244,239,230,.04);color:var(--cream);font:500 max(1.6rem,16px)/1 var(--fb);outline:none;transition:border-color .25s,box-shadow .25s}
.news input[type=email]:focus{border-color:#FF5A36;box-shadow:var(--ring)}
.news input[aria-invalid=true]{border-color:#FF8A6E}
.news__btn{height:5.6rem;min-height:44px;padding:0 2.4rem;border:0;border-radius:999px;background:var(--cream);color:var(--ink);font:600 max(1.6rem,15px)/1 var(--fb);cursor:pointer;transition:background .3s,color .3s}
.news__btn:hover{background:#E6007E;color:#fff}
.news__btn[disabled]{opacity:.6;cursor:progress}
.form-msg{min-height:1.5em;margin-top:1rem;font:500 max(1.4rem,13px)/1.4 var(--fb)}
.form-msg.is-error{color:#FF8A6E}
.form-msg.is-success{color:#9FE3B0}
.footer__bar{margin-top:4.8rem;padding:1.2rem 0;border-top:1px solid var(--c12);display:flex;justify-content:space-between;align-items:center;gap:1.6rem;font:500 max(1.3rem,12px)/1 var(--fb);color:var(--ph)}
.footer__top{display:flex;align-items:center;gap:.6rem;min-height:44px;color:var(--line-c)}
.footer__top .ic{transition:transform .3s var(--ease)}
.footer__top:hover .ic{transform:translateY(-3px)}
.footer__giant{display:flex;justify-content:center;margin:0 -7.7vw -6.67vw;white-space:nowrap;font:600 23.6vw/.8 var(--fd);letter-spacing:-.06em;color:var(--cream);pointer-events:none;user-select:none}
@media (min-width:1024px){
  .footer__grid{padding-top:9.6rem;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:2.4rem;row-gap:8rem;grid-template-areas:none}
  .footer__brand{grid-column:1 / span 4;grid-row:1;gap:2.8rem}
  .footer__tag{font-size:4rem;line-height:1.02}
  .footer__tag .serif{font-size:4.4rem}
  .footer__cols{grid-column:7 / span 6;grid-row:1}
  .footer__hello{grid-column:1 / span 6;grid-row:2}
  .footer__news{grid-column:7 / span 6;grid-row:2}
  .flabel{margin-bottom:2.2rem;font-size:max(1.3rem,12px)}
  .footer__hello .flabel,.footer__news .flabel{margin-bottom:0}
  .footer__cols ul{gap:1.4rem}
  .footer__cols a{min-height:0;font-size:max(1.6rem,14px)}
  .footer__mail{margin-top:1.8rem;font-size:4.8rem;letter-spacing:-.035em;padding-bottom:.6rem}
  .footer__newsp{margin:1.8rem 0 0;font-size:max(1.7rem,14px)}
  .news__box{margin-top:2rem;display:flex;align-items:center;gap:.8rem;height:max(6.4rem,54px);padding:.6rem .6rem .6rem 2.4rem;border-radius:999px;border:1px solid rgba(244,239,230,.22);background:rgba(244,239,230,.04);transition:border-color .25s,box-shadow .25s}
  .news__box:focus-within{border-color:#FF5A36;box-shadow:var(--ring)}
  .news input[type=email]{flex:1;min-width:0;height:100%;padding:0;border:0;background:transparent;box-shadow:none!important}
  .news__btn{height:100%;min-height:0}
  .news.has-error .news__box{border-color:#FF8A6E}
  .footer__bar{margin-top:9.6rem;padding:2.4rem 0;font-size:max(1.4rem,12px)}
  .footer__top{gap:.8rem;min-height:0}
  .footer__giant{margin:0 -5.56vw calc(min(22.92vw,440px) * -.279);font-size:min(22.92vw,440px)}
}

/* ---------- Contact modal ---------- */
.modal{width:min(68rem,calc(100vw - 2.4rem));max-width:none;max-height:calc(100dvh - 2.4rem);padding:0;border:0;background:transparent;color:var(--cream);overflow:visible}
.modal::backdrop{background:rgba(11,11,16,.72);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.modal__box{position:relative;max-height:calc(100dvh - 2.4rem);overflow-y:auto;overscroll-behavior:contain;padding:2.8rem 2.2rem 2.4rem;border-radius:2.6rem;border:1px solid var(--c10);background:var(--surface);box-shadow:0 4rem 10rem -3rem rgba(0,0,0,.9)}
.modal__close{position:absolute;right:1.4rem;top:1.4rem;width:44px;height:44px;border-radius:50%;border:1px solid var(--c20);background:transparent;color:var(--cream);display:grid;place-items:center;font-size:20px;cursor:pointer;transition:background .25s,color .25s}
.modal__close:hover{background:var(--cream);color:var(--ink)}
.modal__title{margin-top:1.8rem;padding-right:4rem;font:600 3.6rem/.95 var(--fd);letter-spacing:-.04em}
.modal__title .serif{font-size:1.1em;letter-spacing:-.02em;padding-right:.06em}
.modal__intro{margin-top:1.2rem;font:400 max(1.5rem,14px)/1.5 var(--fb);color:var(--muted-d)}
.cform{margin-top:2.4rem}
.cform__grid{display:grid;gap:1.4rem}
.field label{display:block;margin-bottom:.8rem;font:500 max(1.3rem,13px)/1 var(--fb);color:var(--muted-d)}
.field input,.field select,.field textarea{width:100%;height:5.2rem;min-height:44px;padding:0 1.8rem;border-radius:1.4rem;border:1px solid rgba(244,239,230,.18);background:rgba(244,239,230,.04);color:var(--cream);font:500 max(1.6rem,16px)/1.3 var(--fb);outline:none;transition:border-color .25s,box-shadow .25s}
.field select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23B8B2A8'%3E%3Cpath d='M12 15.0006L7.75732 10.758L9.17154 9.34375L12 12.1722L14.8284 9.34375L16.2426 10.758L12 15.0006Z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 1.2rem center;background-size:22px;padding-right:4.4rem}
.field select option{background:var(--surface);color:var(--cream)}
.field textarea{height:auto;min-height:12rem;padding:1.4rem 1.8rem;resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{border-color:#FF5A36;box-shadow:var(--ring)}
.field [aria-invalid=true]{border-color:#FF8A6E}
.field__err{min-height:0;margin-top:.6rem;font:500 max(1.3rem,13px)/1.3 var(--fb);color:#FF8A6E}
.field__err:empty{display:none}
.cform__foot{margin-top:2.4rem;display:grid;gap:.4rem}
.cform__foot .btn-grad[disabled]{opacity:.7;cursor:progress}
@media (min-width:640px){
  .cform__grid{grid-template-columns:1fr 1fr}
  .field--full{grid-column:1 / -1}
  .cform__foot{display:flex;align-items:center;gap:2rem;flex-wrap:wrap}
  .cform__foot .form-msg{margin:0}
}
@media (min-width:1024px){
  .modal__box{padding:4.4rem 4.4rem 4rem;border-radius:3.2rem}
  .modal__close{right:2rem;top:2rem}
  .modal__title{font-size:5.2rem}
}

/* ---------- Grain & cursor ---------- */
.grain{position:fixed;inset:0;z-index:80;pointer-events:none;opacity:.06;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");background-size:220px 220px}
.cur-dot,.cur-ring{display:none}
.has-cc .cur-dot{display:block;position:fixed;left:0;top:0;z-index:201;width:8px;height:8px;margin:-4px 0 0 -4px;border-radius:50%;background:#fff;mix-blend-mode:difference;pointer-events:none;opacity:0;transition:opacity .2s}
.has-cc .cur-ring{display:block;position:fixed;left:0;top:0;z-index:200;pointer-events:none;opacity:0;mix-blend-mode:difference;transition:opacity .2s}
.cur-ring__c{position:absolute;left:0;top:0;width:40px;height:40px;transform:translate(-50%,-50%);border-radius:50%;border:1.5px solid rgba(255,255,255,.7);display:grid;place-items:center;transition:width .35s var(--ease),height .35s var(--ease),background .3s,border-color .3s}
.cur-ring__c span{font:600 14px/1 var(--fb);color:#fff;letter-spacing:.02em}
.cur-ring.is-link .cur-ring__c{width:68px;height:68px;background:rgba(255,255,255,.14);border-color:#fff}
.cur-ring.is-play,.cur-ring.is-view{mix-blend-mode:normal}
.cur-ring.is-play .cur-ring__c{width:104px;height:104px;background:linear-gradient(120deg,#FF5A36,#E6007E 50%,#7B3FF2);border-color:transparent}
.cur-ring.is-view .cur-ring__c{width:104px;height:104px;background:var(--cream);border-color:transparent}
.cur-ring.is-view .cur-ring__c span{color:var(--ink)}
.cur-dot.is-hidden{opacity:0!important}
.has-cc,.has-cc *{cursor:none!important}
.has-cc input,.has-cc textarea,.has-cc select{cursor:text!important}
.has-cc select{cursor:pointer!important}

/* ---------- Reveal (JS-enhanced) ---------- */
.js [data-reveal],.js [data-stagger]>*{opacity:0}
.js .is-shown[data-reveal],.js [data-stagger]>.is-shown{opacity:1}

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .js [data-reveal],.js [data-stagger]>*{opacity:1}
  *,*::before,*::after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}
  [data-cursor="play"]:hover{scale:1}
}

/* ---------- 404 ---------- */
.nf{min-height:100dvh;display:grid;place-items:center;padding:12rem var(--pad) 6rem;position:relative;overflow:hidden;text-align:center}
.nf__code{font:600 min(40vw,32rem)/.8 var(--fd);letter-spacing:-.06em}
.nf__t{margin-top:2.4rem;font:600 4.4rem/.95 var(--fd);letter-spacing:-.045em}
.nf__p{margin:1.6rem auto 0;max-width:44rem;color:var(--muted-d)}
.nf .btn-grad{display:inline-flex;margin-top:3.2rem}


/* ---------- Legal page (privacy.html) & form notes ---------- */
.header--solid{position:sticky;background:var(--ink);border-bottom-color:rgba(244,239,230,.08)}
.header--solid .header__in{display:flex;justify-content:space-between}
.legal-back{display:inline-flex;align-items:center;gap:.8rem;min-height:44px;padding:0 1.8rem;border-radius:999px;border:1px solid var(--c12);background:var(--c06);font:500 max(1.5rem,14px)/1 var(--fb);white-space:nowrap;transition:background .25s}
.legal-back:hover{background:var(--c12)}
.legal-back .ic{transform:rotate(-90deg);font-size:1.6rem}
.legal{background:var(--cream);color:var(--ink)}
.legal__in{max-width:88rem;margin:0 auto;padding:6.4rem var(--pad) 9.6rem}
.legal__title{margin-top:2.2rem;font:600 5.4rem/.92 var(--fd);letter-spacing:-.045em}
.legal__meta{margin-top:1.6rem;font:500 max(1.4rem,13px)/1.4 var(--fb);color:var(--muted-c)}
.legal__body{margin-top:4rem;border-top:1px solid rgba(11,11,16,.16)}
.legal__body section{padding:3.2rem 0;border-bottom:1px solid rgba(11,11,16,.16)}
.legal__body h2{font:600 2.6rem/1.1 var(--fd);letter-spacing:-.03em}
.legal__body p,.legal__body li{font:400 max(1.6rem,15px)/1.65 var(--fb);color:#3E3A34;text-wrap:pretty}
.legal__body p{margin-top:1.2rem}
.legal__body ul{margin-top:1.2rem;display:grid;gap:1rem}
.legal__body li{position:relative;padding-left:2.2rem}
.legal__body li::before{content:"";position:absolute;left:0;top:.72em;width:.8rem;height:.8rem;border-radius:50%;background:var(--grad)}
.legal__body strong{font-weight:600;color:var(--ink)}
.legal__body a{color:var(--ink);text-decoration:underline;text-decoration-color:#E6007E;text-underline-offset:3px;overflow-wrap:anywhere}
.legal-footer{background:var(--ink);color:var(--ph)}
.legal-footer__in{max-width:88rem;margin:0 auto;padding:2.4rem var(--pad);display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.8rem 2.4rem;font:500 max(1.4rem,13px)/1.4 var(--fb)}
.legal-footer a{display:inline-flex;align-items:center;min-height:44px;color:var(--line-c)}
.form-legal{margin-top:.8rem;font:400 max(1.3rem,12px)/1.5 var(--fb);color:var(--muted-d)}
.form-legal a{color:var(--cream);text-decoration:underline;text-underline-offset:3px;white-space:nowrap}
.footer__bar{flex-wrap:wrap}
.footer__legal{display:inline-flex;align-items:center;min-height:44px;color:var(--line-c);transition:color .2s}
.footer__legal:hover{color:#FF8A6E}
@media (min-width:1024px){
  .legal__in{padding:10rem var(--pad) 14rem}
  .legal__title{font-size:9.6rem;line-height:.9}
  .legal__body section{padding:4rem 0}
  .legal__body h2{font-size:3.2rem}
  .legal__body p,.legal__body li{font-size:max(1.7rem,15px)}
  .footer__legal{min-height:0}
}