@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&family=Sora:wght@600;700;800;900&display=swap');
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
:root{--blue:#40bef9;--yellow:#fdd204;--orange:#fe8b02;--deep:#fd6a01;--g4:#6e6e73;--ink:#1d1d1f;
  --flow:linear-gradient(95deg,#2aa8ea,#3fb6c9 26%,#e7b800 55%,#fe8b02 80%,#fd6a01 100%);
  --pad:clamp(20px,5vw,64px);--vh:100svh;}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{background:#fff;color:var(--ink);font-family:'Inter',-apple-system,sans-serif;-webkit-font-smoothing:antialiased;overflow-x:hidden}
.bg{position:fixed;inset:0;z-index:-2;background:#fff}
.bg-flow{position:fixed;inset:0;z-index:-1;pointer-events:none;filter:saturate(1.04);transition:background .8s ease;background:
  radial-gradient(58% 44% at 18% 10%, rgba(64,190,249,.18), transparent 60%),
  radial-gradient(60% 42% at 50% 54%, rgba(253,210,4,.12), transparent 62%),
  radial-gradient(66% 50% at 84% 96%, rgba(254,139,2,.16), transparent 62%)}
.flowtext{background:var(--flow);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}

nav{position:fixed;top:0;left:0;right:0;z-index:999;min-height:54px;background:rgba(255,255,255,.72);backdrop-filter:saturate(180%) blur(20px);-webkit-backdrop-filter:saturate(180%) blur(20px);display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px clamp(14px,4vw,28px);border-bottom:1px solid rgba(0,0,0,.06);padding-top:max(8px,env(safe-area-inset-top))}
.nav-logo{display:flex;align-items:center;gap:9px;text-decoration:none}
.nav-logo img{height:clamp(22px,5vw,28px)}
.nav-logo b{font-family:'Sora';font-weight:800;font-size:clamp(.9rem,2.5vw,1.05rem);letter-spacing:-.02em}
nav ul{display:flex;gap:clamp(12px,3vw,22px);list-style:none;align-items:center}
nav a{color:rgba(29,29,31,.66);text-decoration:none;font-size:clamp(.72rem,2vw,.82rem);font-weight:500;transition:color .2s}
nav a:hover{color:#000}
.nav-cta{padding:7px clamp(12px,3vw,18px);border-radius:980px;background:linear-gradient(90deg,var(--yellow),var(--orange));color:#fff!important;font-weight:700!important}
.nav-toggle{display:none;background:none;border:none;font-size:1.5rem;color:var(--ink);cursor:pointer;line-height:1;padding:4px 8px}
@media(max-width:880px){
  .nav-toggle{display:block}
  nav ul{position:fixed;top:54px;left:0;right:0;flex-direction:column;align-items:flex-start;gap:0;background:rgba(255,255,255,.96);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-bottom:1px solid rgba(0,0,0,.08);padding:8px 0;max-height:0;overflow:hidden;transition:max-height .35s ease;box-shadow:0 20px 40px -20px rgba(0,0,0,.2)}
  nav ul.open{max-height:80vh}
  nav ul li{width:100%}
  nav ul a{display:block;padding:13px clamp(14px,4vw,28px);font-size:.95rem;width:100%}
  .nav-cta{margin:8px clamp(14px,4vw,28px);display:inline-block;width:auto}
}

.band{min-height:60vh;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:clamp(70px,12vh,110px) var(--pad)}
.band-eyebrow{font-size:clamp(.7rem,2vw,.78rem);font-weight:700;letter-spacing:.18em;text-transform:uppercase;margin-bottom:14px}
.band h2{font-family:'Sora';font-weight:900;font-size:clamp(2rem,6vw,4rem);letter-spacing:-.04em;line-height:1.02;max-width:16ch}
.band p{color:var(--g4);font-weight:300;margin-top:14px;font-size:clamp(1rem,2.6vw,1.25rem);max-width:48ch;line-height:1.5}

#hero,.hero-sec{min-height:var(--vh);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:clamp(110px,16vh,150px) var(--pad) clamp(50px,9vh,80px)}
.hero-eyebrow{font-size:clamp(.68rem,2vw,.78rem);font-weight:700;letter-spacing:.18em;text-transform:uppercase;margin-bottom:clamp(14px,3vh,22px)}
.hero-h1{font-family:'Sora';font-size:clamp(2.1rem,7vw,5.4rem);font-weight:900;letter-spacing:-.04em;line-height:1;max-width:15ch;margin-bottom:clamp(14px,3vh,22px)}
.hero-sub{font-size:clamp(1rem,3vw,1.4rem);font-weight:300;color:var(--g4);max-width:54ch;line-height:1.5}
.hero-sub b{font-weight:500;color:var(--ink)}
.hero-cta{margin-top:clamp(26px,5vh,38px);display:flex;gap:14px;flex-wrap:wrap;justify-content:center}
.btn{padding:clamp(11px,2vw,14px) clamp(22px,5vw,32px);border-radius:980px;font-size:clamp(.88rem,2.2vw,.95rem);font-weight:600;text-decoration:none;display:inline-block;transition:transform .2s;cursor:pointer;border:none;font-family:inherit}
.btn:hover{transform:scale(1.04)}
.btn-grad{background:var(--flow);color:#fff;font-weight:700}
.btn-ghost{border:1px solid rgba(0,0,0,.2);color:var(--ink);background:transparent}
.hu{opacity:0;transform:translateY(24px);animation:hu .9s cubic-bezier(.2,.7,.3,1) forwards}
.d1{animation-delay:.1s}.d2{animation-delay:.25s}.d3{animation-delay:.4s}.d4{animation-delay:.55s}
@keyframes hu{to{opacity:1;transform:none}}

.flow-sec{min-height:var(--vh);display:flex;align-items:center;justify-content:center;padding:clamp(70px,10vh,100px) 0;overflow:hidden}
.fs-inner{width:100%;max-width:860px;margin-inline:auto;padding-inline:var(--pad);display:flex;flex-direction:column;align-items:center;text-align:center}
.t-logo{width:clamp(84px,16vw,148px);height:clamp(84px,16vw,148px);display:flex;align-items:center;justify-content:center;margin-bottom:clamp(24px,4vh,36px);opacity:0;will-change:transform,opacity;filter:drop-shadow(0 24px 40px rgba(0,0,0,.16))}
.naked-img{width:100%;height:100%;object-fit:contain}.naked-svg{width:92%;height:92%}
.naked-glyph{font-size:clamp(4rem,12vw,9rem);line-height:1;background:var(--flow);-webkit-background-clip:text;-webkit-text-fill-color:transparent}
.pj-index{font-family:'Sora';font-weight:900;font-size:clamp(4rem,15vw,10rem);line-height:.85;letter-spacing:-.05em;margin-bottom:clamp(18px,3vh,30px);opacity:0;will-change:transform,opacity}
.t-logo[data-traj="overshoot"],.pj-index[data-traj="overshoot"]{transform:scale(2.3) translateY(-5vh)}
.t-logo[data-traj="spin"],.pj-index[data-traj="spin"]{transform:translateX(-115%) rotate(-155deg) scale(.42)}
.t-logo[data-traj="zoom"],.pj-index[data-traj="zoom"]{transform:scale(.16)}
.in .t-logo,.in .pj-index{opacity:1;transform:scale(1) translate(0,0) rotate(0);transition:transform 1.05s cubic-bezier(.34,1.62,.42,1),opacity .5s ease}
.t-cat{font-size:clamp(.68rem,2vw,.78rem);font-weight:700;letter-spacing:.16em;text-transform:uppercase;margin-bottom:clamp(10px,2vh,16px);opacity:0;transform:translateY(18px);transition:opacity .5s ease .3s,transform .5s ease .3s}
.t-head{font-family:'Sora';font-weight:800;font-size:clamp(1.7rem,5.4vw,3.3rem);letter-spacing:-.03em;line-height:1.05;margin-bottom:clamp(12px,2.2vh,18px);max-width:17ch}
.t-body{font-size:clamp(.98rem,2.6vw,1.2rem);font-weight:300;line-height:1.6;max-width:50ch;margin-bottom:clamp(22px,4vh,30px);color:var(--g4)}
.t-head .w,.t-body .w{color:#d6d7db;transition:color .4s ease}
.in .t-cat{opacity:1;transform:none}
.t-phrases{display:flex;flex-direction:column;gap:clamp(3px,1vh,6px);margin-bottom:clamp(24px,4vh,38px)}
.ph{font-family:'Sora';font-weight:700;font-size:clamp(1.05rem,3.2vw,1.6rem);letter-spacing:-.02em;color:#dcdde1;opacity:0;transform:translateY(16px);transition:opacity .5s ease,transform .5s cubic-bezier(.34,1.5,.4,1),color .5s ease}
.in .ph{opacity:1;transform:none;color:var(--ink)}
.in .ph:nth-child(1){transition-delay:.45s}.in .ph:nth-child(2){transition-delay:.6s}.in .ph:nth-child(3){transition-delay:.75s}
.in .ph:last-child{color:var(--c)}
.pj-stack{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-bottom:clamp(24px,4vh,34px);opacity:0;transform:translateY(16px);transition:opacity .5s ease .82s,transform .5s ease .82s}
.in .pj-stack{opacity:1;transform:none}
.pj-tag{font-size:.74rem;font-weight:500;color:#3a3a3e;background:rgba(0,0,0,.05);border-radius:980px;padding:6px 14px}
.t-viz-row{display:flex;align-items:center;gap:clamp(24px,6vw,48px);flex-wrap:wrap;justify-content:center;opacity:0;transform:translateY(20px);transition:opacity .6s ease .95s,transform .6s ease .95s}
.in .t-viz-row{opacity:1;transform:none}
.viz{width:clamp(140px,40vw,220px)}
.viz-bar{display:flex;align-items:flex-end;gap:clamp(5px,1.5vw,8px);height:clamp(90px,18vh,120px)}
.vbar{flex:1;background:linear-gradient(180deg,#57d2fc,var(--c));border-radius:5px 5px 0 0;height:var(--h);transform:scaleY(0);transform-origin:bottom}
.in .vbar{transform:scaleY(1);transition:transform .8s cubic-bezier(.2,.7,.3,1)}
.in .vbar:nth-child(2){transition-delay:.06s}.in .vbar:nth-child(3){transition-delay:.12s}.in .vbar:nth-child(4){transition-delay:.18s}.in .vbar:nth-child(5){transition-delay:.24s}.in .vbar:nth-child(6){transition-delay:.3s}
.viz-line svg{width:100%;height:clamp(90px,18vh,120px)}
.vline{fill:none;stroke-width:3.5;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:600;stroke-dashoffset:600}
.in .vline{stroke-dashoffset:0;transition:stroke-dashoffset 1.4s ease .95s}
.viz-donut{display:flex;justify-content:center}.viz-donut svg{width:clamp(100px,20vw,120px);height:clamp(100px,20vw,120px)}
.vdonut{stroke-dasharray:301;stroke-dashoffset:301}
.in .vdonut{stroke-dashoffset:90;transition:stroke-dashoffset 1.3s cubic-bezier(.2,.7,.3,1) .95s}
.impact{text-align:left}
.impact-num{font-family:'Sora';font-weight:900;font-size:clamp(2.2rem,7vw,4.4rem);letter-spacing:-.04em;line-height:.9}
.impact-lbl{font-size:clamp(.76rem,2vw,.84rem);color:var(--g4);margin-top:8px}

#contact{min-height:var(--vh);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:clamp(90px,14vh,130px) var(--pad)}
#contact h2{font-family:'Sora';font-weight:900;font-size:clamp(2rem,6vw,3.6rem);letter-spacing:-.04em;margin-bottom:14px;max-width:16ch}
#contact .sub{color:var(--g4);font-weight:300;margin-bottom:clamp(28px,5vh,40px);font-size:clamp(1rem,2.6vw,1.2rem)}
.form{width:100%;max-width:520px;display:flex;flex-direction:column;gap:14px;text-align:left}
.form label{font-size:.78rem;font-weight:600;color:var(--g4);margin-bottom:5px;display:block}
.form input,.form textarea{width:100%;padding:13px 16px;border:1px solid rgba(0,0,0,.14);border-radius:14px;font-family:inherit;font-size:1rem;background:rgba(255,255,255,.7);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);transition:border-color .2s,box-shadow .2s;color:var(--ink)}
.form input:focus,.form textarea:focus{outline:none;border-color:var(--orange);box-shadow:0 0 0 3px rgba(254,139,2,.15)}
.form textarea{resize:vertical}
.form-note{font-size:.85rem;text-align:center;min-height:1.2em;margin-top:4px}
.form-note.ok{color:#1a9d4a}.form-note.err{color:#d4341f}
.contact-alt{margin-top:30px;display:flex;gap:12px;align-items:center;flex-wrap:wrap;justify-content:center;font-size:.9rem}
.contact-alt a{color:var(--g4);text-decoration:none;transition:color .2s}.contact-alt a:hover{color:var(--ink)}
.contact-alt span{color:#c4c4c8}

footer{padding:clamp(24px,5vh,30px) var(--pad) max(24px,env(safe-area-inset-bottom));text-align:center;border-top:1px solid rgba(0,0,0,.06);display:flex;flex-direction:column;gap:10px;align-items:center}
footer img{height:clamp(20px,5vw,24px)}footer span{font-size:clamp(.7rem,2vw,.74rem);color:var(--g4)}

@media(max-width:560px){.t-viz-row{flex-direction:column;gap:22px}.impact{text-align:center}}
@media(min-width:1600px){.fs-inner{max-width:920px}}
@media(max-height:640px) and (min-width:561px){.flow-sec,#hero,.hero-sec,#contact{min-height:auto;padding-top:clamp(80px,16vh,110px);padding-bottom:clamp(50px,12vh,80px)}}
@media(hover:none){.btn:hover{transform:none}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:opacity .3s!important}.t-logo,.pj-index{transform:none!important;opacity:1!important}}
