:root {
  --ink: #0d1821;
  --ink-soft: #24323d;
  --night: #07131c;
  --night-2: #0b2028;
  --paper: #f3efe4;
  --paper-2: #e8e0cf;
  --solar: #ff7a3d;
  --solar-2: #ffb454;
  --mint: #69e6c2;
  --sky: #79b9ff;
  --line: rgba(13, 24, 33, .15);
  --white-line: rgba(255,255,255,.13);
  --shadow: 0 24px 70px rgba(7,19,28,.16);
  --radius-xl: 34px;
  --radius-lg: 24px;
  --radius-md: 18px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  color:var(--ink);
  background:var(--paper);
  font-family:"Avenir Next","Segoe UI",Tahoma,sans-serif;
  line-height:1.55;
  overflow-x:hidden;
}
body::before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  opacity:.25;
  background-image:radial-gradient(rgba(13,24,33,.14) .7px,transparent .7px);
  background-size:17px 17px;
  mask-image:linear-gradient(to bottom,black,transparent 65%);
  z-index:10;
}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
button,a{ -webkit-tap-highlight-color:transparent }
.container{width:min(1180px,calc(100% - 40px));margin:0 auto}

.site-header{
  position:fixed;
  top:18px;
  left:0;
  right:0;
  z-index:100;
  pointer-events:none;
}
.nav-shell{
  pointer-events:auto;
  min-height:66px;
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  gap:28px;
  padding:10px 12px 10px 18px;
  border:1px solid rgba(255,255,255,.18);
  border-radius:999px;
  background:rgba(7,19,28,.88);
  color:#fff;
  box-shadow:0 16px 46px rgba(7,19,28,.24);
  backdrop-filter:blur(16px);
}
.brand{display:flex;align-items:center;gap:12px;font-weight:800;letter-spacing:-.03em;white-space:nowrap}
.brand-mark{width:39px;height:39px;display:grid;place-items:center;border-radius:50%;background:var(--solar);position:relative;box-shadow:inset 0 0 0 1px rgba(255,255,255,.45)}
.brand-mark::before{content:"";width:15px;height:15px;border:3px solid var(--night);border-radius:50%}
.brand-mark::after{content:"";position:absolute;width:28px;height:2px;background:var(--night);transform:rotate(-24deg);border-radius:4px}
.nav-links{display:flex;justify-content:center;gap:8px}
.nav-links a{padding:10px 13px;border-radius:999px;color:rgba(255,255,255,.72);font-size:.92rem;transition:.25s ease}
.nav-links a:hover{color:#fff;background:rgba(255,255,255,.09)}
.nav-cta{display:inline-flex;align-items:center;gap:10px;padding:12px 18px;border-radius:999px;background:var(--mint);color:var(--night);font-weight:800;transition:transform .2s ease,box-shadow .2s ease}
.nav-cta:hover{transform:translateY(-2px);box-shadow:0 10px 30px rgba(105,230,194,.22)}
.menu-toggle{display:none;background:transparent;border:0;color:white;font-size:1.5rem;padding:8px;cursor:pointer}

.hero{
  min-height:100vh;
  display:flex;
  align-items:center;
  background:
    radial-gradient(circle at 85% 18%,rgba(105,230,194,.18),transparent 26%),
    radial-gradient(circle at 68% 74%,rgba(255,122,61,.19),transparent 32%),
    var(--night);
  color:#fff;
  padding:150px 0 88px;
  position:relative;
  overflow:hidden;
}
.orbit{position:absolute;border:1px solid rgba(255,255,255,.08);border-radius:50%;pointer-events:none}
.orbit.o1{width:660px;height:660px;right:-180px;top:-130px;animation:spin 25s linear infinite}
.orbit.o2{width:420px;height:420px;right:20%;bottom:-250px;animation:spin 20s linear infinite reverse}
.orbit::after{content:"";position:absolute;width:10px;height:10px;background:var(--solar-2);border-radius:50%;top:14%;left:10%;box-shadow:0 0 22px var(--solar-2)}
.hero-grid{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(420px,.92fr);gap:76px;align-items:center;position:relative;z-index:2}
.eyebrow{display:inline-flex;align-items:center;gap:10px;text-transform:uppercase;letter-spacing:.14em;font-weight:800;font-size:.77rem;color:var(--mint);margin-bottom:25px}
.eyebrow::before{content:"";width:35px;height:2px;background:currentColor}
h1,h2,h3{font-family:Georgia,"Times New Roman",serif;font-weight:700;line-height:.98;letter-spacing:-.045em;margin:0}
.hero h1{font-size:clamp(3.7rem,7vw,7.3rem);max-width:800px}
.hero h1 em{font-style:normal;color:var(--solar)}
.hero-copy{font-size:1.16rem;color:rgba(255,255,255,.7);max-width:630px;margin:27px 0 34px}
.hero-actions{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;border-radius:999px;padding:15px 21px;font-weight:800;border:1px solid transparent;transition:.25s ease}
.btn-primary{background:var(--solar);color:var(--night)}
.btn-primary:hover{transform:translateY(-3px);box-shadow:0 14px 34px rgba(255,122,61,.25)}
.btn-ghost{border-color:rgba(255,255,255,.24);color:#fff;background:rgba(255,255,255,.04)}
.btn-ghost:hover{background:rgba(255,255,255,.09)}
.hero-note{margin-top:32px;display:flex;gap:24px;color:rgba(255,255,255,.5);font-size:.88rem}
.hero-note strong{color:#fff;font-weight:700}

.hero-art{position:relative;min-height:600px;display:grid;place-items:center}
.hero-card{position:absolute;border-radius:28px;box-shadow:0 30px 80px rgba(0,0,0,.35);overflow:hidden}
.hero-card.main{width:72%;right:3%;top:6%;transform:rotate(3deg);animation:float 7s ease-in-out infinite}
.hero-card.secondary{width:46%;left:0;bottom:4%;transform:rotate(-7deg);animation:float 8.5s 1s ease-in-out infinite}
.hero-card img{width:100%;height:auto}
.hero-badge{position:absolute;top:5%;left:4%;width:135px;height:135px;border-radius:50%;background:var(--paper);display:grid;place-items:center;padding:19px;box-shadow:0 20px 50px rgba(0,0,0,.24);animation:pulse 5s ease-in-out infinite}
.hero-badge img{border-radius:26px}
.hero-label{position:absolute;right:5%;bottom:5%;padding:13px 16px;border:1px solid rgba(255,255,255,.16);border-radius:17px;background:rgba(7,19,28,.76);backdrop-filter:blur(12px);font-size:.82rem;color:rgba(255,255,255,.68)}
.hero-label b{display:block;color:#fff;font-size:1rem}

.strip{background:var(--solar);color:var(--night);overflow:hidden;border-top:1px solid rgba(0,0,0,.09);border-bottom:1px solid rgba(0,0,0,.09)}
.strip-track{display:flex;width:max-content;animation:marquee 28s linear infinite;padding:14px 0;font-weight:900;text-transform:uppercase;letter-spacing:.1em;font-size:.78rem}
.strip-track span{display:flex;align-items:center;gap:26px;margin-right:26px}
.strip-track span::after{content:"✦"}

section{padding:110px 0}
.section-head{display:grid;grid-template-columns:.72fr 1fr;gap:80px;align-items:end;margin-bottom:55px}
.kicker{font-size:.8rem;text-transform:uppercase;letter-spacing:.16em;font-weight:900;color:var(--solar);margin-bottom:13px}
.section-head h2{font-size:clamp(3rem,5.5vw,5.7rem)}
.section-head p{font-size:1.07rem;color:#5e655f;max-width:610px;margin:0}

.services{background:var(--paper)}
.service-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:18px}
.service-card{position:relative;min-height:270px;border:1px solid var(--line);border-radius:var(--radius-xl);padding:30px;background:#fff;overflow:hidden;transition:transform .3s ease,box-shadow .3s ease}
.service-card:hover{transform:translateY(-7px);box-shadow:var(--shadow)}
.service-card:nth-child(1){grid-column:span 5;background:var(--night);color:#fff}
.service-card:nth-child(2){grid-column:span 7;background:#dce9dc}
.service-card:nth-child(3){grid-column:span 7;background:#f8cfad}
.service-card:nth-child(4){grid-column:span 5;background:#dbe7f4}
.service-index{display:inline-flex;width:43px;height:43px;border-radius:50%;align-items:center;justify-content:center;border:1px solid currentColor;opacity:.75;font-weight:800}
.service-card h3{font-size:2.05rem;margin:60px 0 12px}
.service-card p{margin:0;color:inherit;opacity:.67;max-width:480px}
.service-arrow{position:absolute;top:30px;right:30px;font-size:1.5rem;transition:transform .3s ease}
.service-card:hover .service-arrow{transform:translate(4px,-4px)}

.product{background:var(--night);color:#fff;position:relative;overflow:hidden}
.product::before{content:"";position:absolute;width:640px;height:640px;border-radius:50%;background:radial-gradient(circle,rgba(121,185,255,.22),transparent 66%);left:-180px;bottom:-220px}
.product-top{display:grid;grid-template-columns:.7fr 1.3fr;gap:70px;align-items:center;margin-bottom:66px}
.app-lockup{display:flex;align-items:center;gap:19px}
.app-lockup img{width:92px;border-radius:24px;box-shadow:0 15px 40px rgba(0,0,0,.28)}
.app-lockup h2{font-size:clamp(3rem,5vw,5.8rem)}
.product-intro{color:rgba(255,255,255,.66);font-size:1.08rem;max-width:620px;margin-left:auto}
.product-intro strong{color:#fff}
.product-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:20px;align-items:stretch}
.product-banner{border-radius:var(--radius-xl);overflow:hidden;min-height:430px;background:#101d27;position:relative}
.product-banner img{width:100%;height:100%;object-fit:cover}
.product-banner::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 45%,rgba(7,19,28,.75));pointer-events:none}
.product-facts{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.fact{min-height:205px;border-radius:var(--radius-xl);border:1px solid var(--white-line);padding:28px;background:rgba(255,255,255,.04);display:flex;flex-direction:column;justify-content:space-between}
.fact:nth-child(1){background:var(--mint);color:var(--night);border-color:transparent}
.fact:nth-child(4){background:var(--solar);color:var(--night);border-color:transparent}
.fact small{font-size:.78rem;text-transform:uppercase;letter-spacing:.12em;font-weight:900;opacity:.72}
.fact b{font-family:Georgia,"Times New Roman",serif;font-size:2rem;line-height:1.02;letter-spacing:-.035em}
.screens{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:70px;align-items:start}
.screen-card{position:relative}
.screen-card:nth-child(2){margin-top:70px}
.screen-card img{border-radius:32px;box-shadow:0 32px 70px rgba(0,0,0,.42);border:1px solid rgba(255,255,255,.13);transition:transform .45s cubic-bezier(.2,.8,.2,1)}
.screen-card:hover img{transform:translateY(-12px) rotate(-1deg)}
.screen-card span{display:block;color:rgba(255,255,255,.55);font-size:.8rem;text-transform:uppercase;letter-spacing:.1em;margin:14px 0 0 10px}

.process{background:#efe7d6}
.process-line{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.process-step{padding:36px 25px 42px;border-right:1px solid var(--line);min-height:260px;position:relative}
.process-step:last-child{border-right:0}
.process-step::before{content:attr(data-step);position:absolute;top:-17px;left:22px;background:var(--paper-2);padding:3px 9px;border-radius:999px;border:1px solid var(--line);font-weight:900;font-size:.77rem}
.process-step h3{font-size:1.8rem;margin:36px 0 12px}
.process-step p{margin:0;color:#60645f;font-size:.95rem}

.studio{background:var(--paper)}
.studio-grid{display:grid;grid-template-columns:1fr .85fr;gap:75px;align-items:start}
.studio h2{font-size:clamp(3.5rem,6vw,6.6rem)}
.studio-copy{font-size:1.13rem;color:#5c625d;margin:28px 0 0;max-width:700px}
.principles{display:grid;gap:12px}
.principle{display:grid;grid-template-columns:auto 1fr;gap:18px;align-items:start;padding:22px 0;border-bottom:1px solid var(--line)}
.principle:last-child{border-bottom:0}
.principle i{width:12px;height:12px;border-radius:50%;background:var(--solar);margin-top:7px;box-shadow:0 0 0 7px rgba(255,122,61,.12)}
.principle b{display:block;margin-bottom:4px}
.principle span{color:#6c716d;font-size:.93rem}

.contact{padding-top:0;background:var(--paper)}
.contact-card{border-radius:44px;background:var(--night);color:#fff;padding:65px;display:grid;grid-template-columns:1fr .92fr;gap:80px;position:relative;overflow:hidden}
.contact-card::after{content:"";position:absolute;width:420px;height:420px;border:1px solid rgba(255,255,255,.1);border-radius:50%;right:-160px;top:-180px;box-shadow:0 0 0 70px rgba(255,255,255,.025),0 0 0 140px rgba(255,255,255,.02)}
.contact h2{font-size:clamp(3.5rem,5vw,5.7rem);position:relative;z-index:1}
.contact p{color:rgba(255,255,255,.62);max-width:500px;position:relative;z-index:1}
.contact-list{display:grid;gap:0;position:relative;z-index:1}
.contact-row{padding:18px 0;border-bottom:1px solid rgba(255,255,255,.12)}
.contact-row:last-child{border-bottom:0}
.contact-row small{display:block;color:var(--mint);text-transform:uppercase;font-size:.7rem;letter-spacing:.14em;font-weight:900;margin-bottom:4px}
.contact-row a,.contact-row span{font-size:1.03rem;color:#fff;word-break:break-word}

.footer{background:var(--night);color:#fff;padding:28px 0 42px}
.footer-inner{display:grid;grid-template-columns:1fr auto;align-items:end;gap:30px;border-top:1px solid rgba(255,255,255,.12);padding-top:30px}
.footer-brand .brand{margin-bottom:12px}
.footer-brand p{margin:0;color:rgba(255,255,255,.46);font-size:.84rem}
.footer-links{display:flex;gap:22px;align-items:center;font-size:.87rem;color:rgba(255,255,255,.58)}
.footer-links a:hover{color:#fff}

.reveal{opacity:0;transform:translateY(28px);transition:opacity .8s ease,transform .8s cubic-bezier(.2,.8,.2,1)}
.reveal.in{opacity:1;transform:none}

.policy-page{background:var(--paper);color:var(--ink)}
.policy-hero{background:var(--night);color:white;padding:140px 0 80px;position:relative;overflow:hidden}
.policy-hero::after{content:"";position:absolute;width:520px;height:520px;border:1px solid rgba(255,255,255,.07);border-radius:50%;right:-150px;top:-240px;box-shadow:0 0 0 80px rgba(255,255,255,.025)}
.policy-hero h1{font-size:clamp(3.5rem,7vw,7rem);position:relative;z-index:1}
.policy-hero p{max-width:660px;color:rgba(255,255,255,.62);font-size:1.05rem;position:relative;z-index:1}
.policy-back{display:inline-flex;align-items:center;gap:10px;margin-bottom:38px;color:var(--mint);font-weight:800;position:relative;z-index:1}
.policy-content{padding:80px 0 120px}
.policy-layout{display:grid;grid-template-columns:280px minmax(0,760px);gap:80px;justify-content:center;align-items:start}
.policy-toc{position:sticky;top:110px;border:1px solid var(--line);border-radius:22px;padding:20px;background:#fff}
.policy-toc b{display:block;margin-bottom:10px}
.policy-toc a{display:block;padding:8px 0;color:#6c716d;font-size:.88rem}
.policy-toc a:hover{color:var(--ink)}
.policy-article h2{font-size:2rem;margin:48px 0 12px;letter-spacing:-.025em}
.policy-article h2:first-child{margin-top:0}
.policy-article p{color:#5f655f;margin:0 0 18px}
.policy-note{padding:20px 22px;border-left:4px solid var(--solar);background:#fff5ec;border-radius:0 16px 16px 0;margin:30px 0}

.not-found{min-height:100vh;background:var(--night);color:#fff;display:grid;place-items:center;text-align:center;padding:40px}
.not-found h1{font-size:clamp(5rem,15vw,12rem);color:var(--solar);line-height:.8}
.not-found h2{font-size:2rem;margin:30px 0 12px}
.not-found p{color:rgba(255,255,255,.6);max-width:520px}

@keyframes float{0%,100%{transform:translateY(0) rotate(3deg)}50%{transform:translateY(-16px) rotate(2deg)}}
@keyframes pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.045)}}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes marquee{to{transform:translateX(-50%)}}

@media (max-width: 960px){
  .nav-links{display:none;position:absolute;top:76px;left:20px;right:20px;flex-direction:column;padding:14px;border-radius:22px;background:rgba(7,19,28,.97);border:1px solid rgba(255,255,255,.13)}
  .nav-links.open{display:flex}
  .nav-links a{padding:13px 14px}
  .menu-toggle{display:block}
  .nav-shell{grid-template-columns:auto 1fr auto auto}
  .nav-cta{font-size:.85rem;padding:10px 14px}
  .hero-grid{grid-template-columns:1fr;gap:60px}
  .hero-art{min-height:560px;max-width:720px;width:100%;margin:0 auto}
  .hero-card.main{width:61%;right:8%}.hero-card.secondary{width:39%;left:6%}
  .section-head,.product-top,.studio-grid,.contact-card{grid-template-columns:1fr;gap:30px}
  .service-card:nth-child(n){grid-column:span 6}
  .product-grid{grid-template-columns:1fr}
  .product-banner{min-height:auto}
  .process-line{grid-template-columns:1fr 1fr}
  .process-step:nth-child(2){border-right:0}.process-step:nth-child(-n+2){border-bottom:1px solid var(--line)}
  .policy-layout{grid-template-columns:1fr}.policy-toc{display:none}
}

@media (max-width: 680px){
  .container{width:min(100% - 26px,1180px)}
  .site-header{top:10px}.nav-shell{padding-left:14px;gap:8px;min-height:58px}.brand span{font-size:.83rem}.brand-mark{width:34px;height:34px}.nav-cta{display:none}
  .hero{padding:125px 0 70px}.hero h1{font-size:clamp(3.1rem,16vw,4.8rem)}.hero-copy{font-size:1rem}.hero-note{flex-direction:column;gap:7px}
  .hero-art{min-height:430px}.hero-card.main{width:65%;right:2%}.hero-card.secondary{width:43%;left:0}.hero-badge{width:92px;height:92px;padding:12px}.hero-label{font-size:.72rem}
  section{padding:78px 0}.section-head{gap:20px;margin-bottom:34px}.section-head h2{font-size:3.2rem}
  .service-card:nth-child(n){grid-column:span 12}.service-card{min-height:240px}.service-card h3{margin-top:50px}
  .product-top{margin-bottom:40px}.app-lockup{align-items:flex-start}.app-lockup img{width:70px;border-radius:18px}.product-facts{grid-template-columns:1fr}.fact{min-height:160px}.screens{grid-template-columns:1fr 1fr;gap:13px;margin-top:45px}.screen-card:nth-child(2){margin-top:35px}.screen-card:nth-child(3){grid-column:1 / -1;width:58%;margin:0 auto}.screen-card img{border-radius:20px}
  .process-line{grid-template-columns:1fr}.process-step{border-right:0;border-bottom:1px solid var(--line)!important}.process-step:last-child{border-bottom:0!important}
  .contact-card{padding:37px 25px;border-radius:30px}.contact h2{font-size:3.2rem}
  .footer-inner{grid-template-columns:1fr}.footer-links{justify-content:space-between;gap:10px;flex-wrap:wrap}
  .policy-hero{padding:120px 0 60px}.policy-content{padding:55px 0 80px}
}

@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}
  .reveal{opacity:1;transform:none}
}