@import url('https://fonts.googleapis.com/css2?family=Arapey:ital@1&family=DM+Mono&family=IBM+Plex+Mono:wght@400;500&family=Manrope:wght@200;300;400;500;600;700;800&family=Urbanist:wght@400;500&display=swap');

:root { --bg:#0b0d0d; --panel:#101212; --text:#f5f5f2; --muted:#9a9e9d; --line:rgba(245,245,242,.16); --red:#f41616; --accent:#2f7cff; --accent-soft:rgba(47,124,255,.18); --sans:Manrope,Arial,sans-serif; --mono:"DM Mono",monospace; }
* { box-sizing:border-box; } html { scroll-behavior:smooth; background:var(--bg); } body { margin:0; background:var(--bg); color:var(--text); font-family:var(--sans); } a { color:inherit; text-decoration:none; } img { max-width:100%; display:block; } .page { overflow:hidden; } .site-cursor { position:fixed; z-index:10000; top:0; left:0; width:26px; height:26px; border-radius:50%; background:#fff; mix-blend-mode:difference; pointer-events:none; opacity:0; transform:translate3d(-100px,-100px,0); will-change:transform,opacity; transition:opacity .1s linear; } .site-header { position:absolute; z-index:4; inset:0 0 auto; width:100%; height:92px; padding:10px clamp(12px,1.35vw,22px); background:#000; } .site-header__inner { width:100%; height:72px; margin:0; padding:10px clamp(14px,1.3vw,20px); display:flex; align-items:center; justify-content:space-between; border-radius:999px; background:#050505; } .wordmark { width:190px; height:44px; overflow:hidden; } .wordmark img { filter:invert(1); width:100%; height:100%; object-fit:cover; object-position:center 44%; } .footer-mark { filter:invert(1); mix-blend-mode:screen; object-fit:cover; object-position:center 44%; } nav { margin-left:auto; display:flex; gap:18px; font-size:13px; } nav a { min-width:116px; padding:12px 22px; border:1px solid rgba(255,255,255,.2); border-radius:999px; background:linear-gradient(180deg,rgba(255,255,255,.09),rgba(255,255,255,.025)); color:#f3f3f1; text-align:center; text-transform:uppercase; transition:background .2s,border-color .2s,box-shadow .2s; } nav a:hover { color:white; border-color:var(--accent); background:var(--accent-soft); box-shadow:0 0 24px rgba(47,124,255,.2); }
@media (pointer:coarse),(prefers-reduced-motion:reduce) { .site-cursor { display:none; } }
@media print { .site-cursor { display:none; } }
.grid-bg { background-color:#111211; background-image:radial-gradient(circle at 0 0,rgba(222,226,223,.34) 0 1.2px,transparent 1.5px),linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px); background-size:60px 60px; background-position:center; } .hero { min-height:146.6svh; padding:0 clamp(20px,5vw,84px); position:relative; isolation:isolate; } .hero-mesh { position:absolute; inset:0; z-index:1; pointer-events:none; } @media (pointer:fine) and (prefers-reduced-motion:no-preference) { .hero.grid-bg,.about-hero.grid-bg { background-image:none; } } .hero-copy { position:absolute; z-index:2; top:calc(100svh + 34px); left:clamp(20px,5vw,84px); right:clamp(20px,5vw,84px); display:grid; grid-template-columns:minmax(0,1fr) auto; grid-template-areas:"thin thin" "title cta"; column-gap:32px; align-items:end; } .hero-thin { grid-area:thin; white-space:nowrap; font-size:clamp(48px,7.2vw,112px); font-weight:300; letter-spacing:-.075em; margin:0; line-height:.9; } h1,h2,h3,p { margin-top:0; } .hero h1 { grid-area:title; white-space:nowrap; font-size:clamp(52px,6.7vw,106px); line-height:.95; letter-spacing:-.085em; margin:20px 0 0; } .hero-copy>.button { grid-area:cta; justify-self:end; align-self:end; margin-bottom:-18px; } .button { border:1px solid rgba(255,255,255,.44); border-radius:999px; display:inline-flex; padding:13px 23px; gap:20px; align-items:center; font-size:15px; background:rgba(255,255,255,.06); transition:background .2s,transform .2s,box-shadow .2s; color:var(--text); cursor:pointer; } .button:hover { background:var(--accent); border-color:var(--accent); box-shadow:0 9px 30px rgba(47,124,255,.28); transform:translateY(-3px); } .button span { font-size:20px; line-height:12px; }
.hero-mark { --logo-tilt-x:0deg; --logo-tilt-y:0deg; --logo-scale:1; --logo-glint-x:50%; --logo-glint-y:50%; position:absolute; z-index:2; left:50%; top:58svh; width:min(58vw,760px); user-select:none; cursor:pointer; transform:translate(-50%,-50%) perspective(950px) rotateX(var(--logo-tilt-x)) rotateY(var(--logo-tilt-y)) scale3d(var(--logo-scale),var(--logo-scale),var(--logo-scale)); transform-style:preserve-3d; transform-origin:center; will-change:transform; filter:drop-shadow(0 18px 28px rgba(0,0,0,.22)); } .hero-mark::after { content:""; position:absolute; z-index:3; inset:5% 4%; border-radius:45%; pointer-events:none; opacity:0; transform:translateZ(34px); background:radial-gradient(circle at var(--logo-glint-x) var(--logo-glint-y),rgba(255,255,255,.42),rgba(255,255,255,0) 38%); mix-blend-mode:screen; transition:opacity .18s ease; } .hero-mark img { position:relative; z-index:0; width:100%; height:auto; object-fit:contain; opacity:1; transform:translateZ(18px); transition:opacity .04s linear,filter .25s ease; } .hero-mark-pixels { position:absolute; z-index:1; inset:0; width:100%; height:100%; pointer-events:none; opacity:0; transform:translateZ(30px); transition:opacity .04s linear; } .hero-mark:hover { filter:drop-shadow(0 34px 46px rgba(0,0,0,.5)); } .hero-mark:hover::after { opacity:.82; } .hero-mark:hover img { opacity:0; } .hero-mark:hover .hero-mark-pixels { opacity:1; }
@media (prefers-reduced-motion:reduce) { .hero-mark { transform:translate(-50%,-50%); filter:drop-shadow(0 18px 28px rgba(0,0,0,.22)); } .hero-mark::after { display:none; } .hero-mark img,.hero-mark-pixels { transform:none; } }
.section-kicker,.eyebrow { font:11px var(--mono); letter-spacing:.1em; color:var(--muted); }.what-we-do { display:grid; grid-template-columns:21% 72%; align-items:start; padding:90px clamp(24px,5vw,72px); background:linear-gradient(180deg,#1f1f1f 0%,rgba(31,31,31,0) 100%); }.what-we-do .section-kicker { display:flex; align-items:center; gap:12px; margin:5px 0 0; color:#fff; font:500 20px/1.2 Urbanist,var(--sans); letter-spacing:0; }.what-we-do .section-kicker::before { content:""; flex:0 0 16px; width:16px; height:10px; background:repeating-linear-gradient(90deg,currentColor 0 1px,transparent 1px 3px); }.manifesto { width:100%; max-width:none; margin:0; text-align:left; font:400 48px/60px Urbanist,var(--sans); letter-spacing:-2px; }.manifesto-visual { display:flex; flex-wrap:wrap; }.manifesto-word { display:inline-flex; white-space:nowrap; }.manifesto-char { color:#666; transition:color .06s linear; }.manifesto-char.is-filled { color:#fff; }.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }.proof-section { padding:58px clamp(38px,4.15vw,64px) 0; background:var(--bg); color:var(--text); }.proof-section h2 { width:100%; margin:0 0 27px; font-family:"Arapey","Times New Roman",serif; font-style:italic; font-weight:400; font-size:clamp(54px,6.667vw,96px); letter-spacing:-.04em; line-height:1; }.proof-section > p { margin:0; width:min(100%,1080px); line-height:1.45; font-size:clamp(14px,1.25vw,19px); letter-spacing:-.02em; }.services-section { padding:74px clamp(38px,4.15vw,64px) 120px; } .services { border-top:0; } .service { min-height:148px; padding:27px 0; border-bottom:1px solid var(--line); display:grid; grid-template-columns:1fr minmax(230px,33%) 30px; align-items:center; gap:20px; cursor:default; transition:padding .25s,color .25s; } .service div { display:flex; align-items:center; gap:25px; } .service span { display:none; } .service h3 { margin:0; color:#aaa; font-size:clamp(50px,5.65vw,85px); letter-spacing:-.065em; line-height:.92; font-weight:200; } .service p { margin:0; color:var(--muted); font-size:14px; line-height:1.45; opacity:0; transition:opacity .2s; } .service b { font-size:24px; font-weight:400; }.service.is-active,.service:hover,.service:focus { padding-left:18px; color:var(--red); outline:none; }.service.is-active h3,.service:hover h3,.service:focus h3 { color:var(--text); }.service.is-active p,.service:hover p,.service:focus p { opacity:1; }
.services { border-top:1px solid var(--line); }
.service { position:relative; height:112px; min-height:0; padding:0; display:block; border-bottom:1px solid var(--line); overflow:hidden; outline:none; }
.service-heading { height:100%; display:flex; align-items:center; opacity:1; transition:opacity .18s ease; }
.service h3 { margin:0; color:transparent; background:linear-gradient(90deg,#fff 0%,#c7c7c7 43%,#666 100%); -webkit-background-clip:text; background-clip:text; font-size:clamp(52px,4.55vw,68px); letter-spacing:-.055em; line-height:1; font-weight:200; }
.service-reveal { position:absolute; inset:0; display:grid; height:100%; overflow:hidden; align-items:center; opacity:0; transform:scale(1.015); transition:opacity .2s ease,transform .42s cubic-bezier(.22,1,.36,1); }
.service-reveal::after { content:""; position:absolute; inset:0; background:linear-gradient(90deg,rgba(0,0,0,.12),transparent 70%); }
.service-reveal img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.service-reveal p { position:relative; z-index:1; margin:0; padding:0 clamp(24px,4vw,60px); color:#fff; font-size:clamp(29px,3.2vw,48px); font-weight:300; line-height:1.05; letter-spacing:-.05em; white-space:nowrap; opacity:1; text-shadow:0 2px 10px rgba(0,0,0,.3); }
.service.is-active,.service:hover,.service:focus { padding-left:0; color:inherit; }
.service.is-active .service-heading,.service:hover .service-heading,.service:focus-visible .service-heading { opacity:0; }
.service.is-active .service-reveal,.service:hover .service-reveal,.service:focus-visible .service-reveal { height:100%; opacity:1; transform:scale(1); }
.work-section { padding:120px clamp(20px,5vw,84px); background:#eee; color:#0c0c0c; } .work-section h2 { font-size:clamp(45px,6.4vw,100px); letter-spacing:-.09em; line-height:.9; font-weight:600; margin:20px 0 70px; } .work-section h2 em { font-weight:300; } .work-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; align-items:start; } .work-card { margin:0; background:#171717; min-height:180px; overflow:hidden; position:relative; } .work-card:nth-child(2),.work-card:nth-child(5) { transform:translateY(70px); } .work-card:nth-child(3) { transform:translateY(24px); } .work-card img { width:100%; aspect-ratio:1/1.25; object-fit:cover; transition:transform .4s; }.work-card:hover img { transform:scale(1.04); }.work-card figcaption { position:absolute; bottom:0; width:100%; padding:11px; font:10px var(--mono); color:white; background:linear-gradient(transparent,rgba(0,0,0,.8)); }.work-placeholder { display:grid; place-items:center; aspect-ratio:1/1.25; color:#aaa; font:13px var(--mono); text-align:center; }
.footer { padding:95px clamp(20px,5vw,84px) 30px; min-height:480px; background:#090909; display:grid; grid-template-columns:1fr 1fr; gap:60px; align-content:space-between; }.footer-email { display:block; font-size:clamp(25px,4vw,58px); letter-spacing:-.065em; margin:17px 0 8px; }.footer-phone { color:var(--muted); }.footer-links { display:grid; grid-template-columns:1fr 1fr; gap:30px; }.footer-links div { display:grid; align-content:start; gap:12px; }.footer-links a { color:#bbb; font-size:14px; }.footer-links a:hover { color:var(--accent); }.footer-mark { grid-column:1/-1; width:250px; height:64px; justify-self:end; background:#000; }
.about-hero,.contact-hero { min-height:100svh; padding:150px clamp(20px,8vw,130px) 80px; display:flex; flex-direction:column; justify-content:center; }.about-hero { min-height:78svh; position:relative; isolation:isolate; align-items:center; text-align:center; overflow:hidden; }.about-hero::after { content:""; position:absolute; z-index:1; left:50%; top:49%; width:min(86vw,1180px); height:300px; transform:translate(-50%,-50%); background:radial-gradient(ellipse,rgba(5,6,6,.94) 0%,rgba(5,6,6,.72) 45%,rgba(5,6,6,0) 76%); pointer-events:none; }.about-hero > :not(.hero-mesh) { position:relative; z-index:2; }.about-hero h1 { width:min(100%,1120px); min-height:2.6em; margin:0 0 28px; font-family:"IBM Plex Mono",var(--mono); font-size:clamp(34px,3.6vw,54px); font-weight:500; line-height:1.28; letter-spacing:-.025em; text-align:center; text-wrap:balance; text-shadow:0 2px 18px #000; }.type-target::after { content:""; display:inline-block; width:3px; height:.92em; margin-left:3px; background:currentColor; vertical-align:-.08em; animation:type-caret .75s steps(1,end) infinite; }.about-cta { align-self:center; padding:10px 18px; gap:14px; font-size:14px; }.about-cta span { font-size:17px; }.characters { padding:125px clamp(20px,5vw,84px); display:grid; grid-template-columns:.75fr 1.25fr; gap:70px; }.character-copy h2,.vision h2 { font-size:clamp(38px,4.3vw,65px); line-height:.98; letter-spacing:-.075em; margin:20px 0; }.character-copy > p:last-child,.vision p { color:var(--muted); line-height:1.6; max-width:410px; }.character-grid { display:grid; grid-template-columns:1fr 1fr; gap:15px; }.character { min-height:440px; position:relative; overflow:hidden; transition:background .3s; }.character.bee { background:#f2c72c; }.character.bae { background:#d61414; }.character img { position:absolute; width:86%; max-height:91%; object-fit:contain; bottom:0; left:7%; transform-origin:bottom center; transition:transform .46s cubic-bezier(.2,.8,.2,1); }.character:hover img { transform:translateY(-1.5%) scale(1.16); }.character.bee:hover { background:#ffdb45; }.character.bae:hover { background:#ef3b32; }.character div { position:absolute; z-index:1; left:20px; top:18px; color:#0c0c0c; }.character p { font:10px var(--mono); margin-bottom:3px; }.character h3 { font-size:34px; letter-spacing:-.08em; margin:0; }.statement-banner { background:var(--red); padding:70px 20px; overflow:hidden; }.statement-banner p { margin:0; color:#101010; text-align:center; font-weight:800; font-size:clamp(42px,8.6vw,145px); letter-spacing:-.09em; white-space:nowrap; }.vision { padding:135px clamp(20px,9vw,145px); display:grid; grid-template-columns:.85fr 1.15fr; gap:80px; align-items:center; }.vision img { width:100%; max-height:620px; object-fit:cover; }
.characters { padding:78px clamp(24px,5.5vw,88px) 150px; display:block; overflow:hidden; background:#050505; }
.characters-intro .section-kicker { margin:0; color:#fff; font-size:clamp(18px,1.7vw,26px); font-weight:700; letter-spacing:-.035em; }
.characters-intro .section-kicker::before { content:""; display:inline-block; width:.35em; height:.35em; margin:0 .42em .13em 0; border-radius:50%; background:#ff2720; }
.characters-intro h2 { margin:clamp(78px,8vw,120px) auto clamp(98px,10vw,150px); color:#fff; text-align:center; font-size:clamp(43px,4.1vw,64px); font-weight:600; line-height:1.12; letter-spacing:-.06em; }
.character-stack { display:grid; grid-template-columns:1fr 1fr; gap:18px; align-items:stretch; }
.character { position:relative; min-height:520px; padding:38px 34px; display:flex; align-items:flex-start; overflow:hidden; border-radius:25px; background:#151515!important; outline:none; transition:background-color .38s cubic-bezier(.22,1,.36,1),box-shadow .38s ease; }
.character-content { position:relative!important; z-index:4; left:auto!important; top:auto!important; width:64%; color:#fff!important; }
.character h3 { margin:0 0 18px; font-size:clamp(42px,3.8vw,56px); font-weight:700; line-height:.9; letter-spacing:-.075em; transition:color .3s ease; }
.character.bee h3 { color:#ffc400; }
.character.bae h3 { color:#ff3029; }
.character p { margin:0; font-family:var(--sans); }
.character .character-role { color:#f3f3f3; font-size:clamp(18px,1.45vw,23px); font-weight:350; line-height:1.15; letter-spacing:-.035em; transition:color .3s ease; }
.character .character-description { max-width:410px; margin-top:16px!important; color:#8a8a8a; font-size:clamp(14px,1.05vw,16px); font-weight:400; line-height:1.48; letter-spacing:-.025em; transition:color .3s ease; }
.character.bae .character-content { margin-left:auto; text-align:right; }
.character img { position:absolute; z-index:3; width:auto; height:clamp(300px,26vw,365px); max-height:none; object-fit:contain; bottom:-72px; transform-origin:center bottom; transition:transform .48s cubic-bezier(.16,1,.3,1); }
.character.bee img { right:-155px; left:auto; }
.character.bae img { left:-155px; }
.character:hover img,.character:focus-visible img { transform:translateY(-3%) scale(1.09); }
.character.bee:hover,.character.bee:focus-visible { background:#ffbd28!important; box-shadow:0 22px 70px rgba(255,189,40,.13); }
.character.bae:hover,.character.bae:focus-visible { background:#f12822!important; box-shadow:0 22px 70px rgba(241,40,34,.14); }
.character:hover h3,.character:focus-visible h3,.character:hover .character-role,.character:focus-visible .character-role,.character:hover .character-description,.character:focus-visible .character-description { color:#090909; }
.character:focus-visible { outline:3px solid var(--accent); outline-offset:4px; }
.statement-section { padding:110px clamp(24px,7vw,110px); background:#050505; }
.statement-card { position:relative; min-height:322px; padding:clamp(34px,3.5vw,52px) 38% clamp(31px,3vw,46px) clamp(38px,4.2vw,64px); border-radius:40px; overflow:hidden; display:flex; flex-direction:column; justify-content:space-between; background:#f4c900; color:#090909; }
.statement-copy { position:relative; z-index:1; min-width:0; height:100%; display:flex; flex-direction:column; justify-content:space-between; }
.statement-card h2 { margin:0; font-size:clamp(32px,3.15vw,48px); font-weight:800; line-height:.95; letter-spacing:-.075em; white-space:nowrap; }
.statement-card h2 > span { display:inline; }
.statement-rotator { min-height:.95em; margin-left:.12em; transition:opacity .2s ease,transform .2s cubic-bezier(.22,1,.36,1); }
.statement-rotator.is-changing { opacity:0; transform:translateY(.28em); }
.statement-card p { margin:clamp(50px,7vw,96px) 0 0; max-width:600px; font-size:clamp(16px,1.35vw,21px); font-weight:550; line-height:1.14; letter-spacing:-.035em; }
.statement-card .sr-only { position:absolute; }
.statement-card img { position:absolute; z-index:0; right:-1.5%; top:50%; width:40%; height:106%; max-height:none; object-fit:contain; transform:translateY(-50%) scale(1.06); transform-origin:center; }
@keyframes type-caret { 50% { opacity:0; } }
.framer-contact { position:relative; min-height:100svh; padding:104px clamp(22px,5vw,76px) 96px; overflow:hidden; background:#050505; }
.framer-contact::before { content:""; position:absolute; inset:92px 0 0; background:linear-gradient(180deg,rgba(4,7,12,.2),rgba(4,7,12,.7) 76%,#050505),url('./public/assets/service-strategy.png') center top/cover fixed; filter:blur(18px) brightness(.42) saturate(.5); transform:scale(1.09); opacity:.86; }
.connect-title { position:relative; z-index:1; margin:18px 0 36px; color:transparent; background:linear-gradient(#e1e1df 12%,#6b6d6c 58%,rgba(5,5,5,.1)); background-clip:text; -webkit-background-clip:text; font-size:clamp(82px,13vw,205px); letter-spacing:-.11em; line-height:.74; text-align:center; white-space:nowrap; }
.booking-section,.contact-secondary { position:relative; z-index:2; max-width:1420px; margin:0 auto; }
.booking-section { padding:0; }
.booking-card { position:relative; min-height:710px; padding:clamp(40px,5vw,76px); display:grid; grid-template-columns:minmax(0,1fr) minmax(470px,.92fr); gap:clamp(48px,7vw,105px); align-items:center; }
.booking-copy { position:relative; z-index:2; max-width:670px; }
.booking-kicker { margin:0 0 32px; display:flex; align-items:center; gap:12px; color:#d1d3d1; font:500 12px var(--mono); letter-spacing:.08em; text-transform:uppercase; }
.booking-kicker span { width:9px; height:9px; border-radius:50%; background:var(--accent); box-shadow:0 0 22px rgba(47,124,255,.8); animation:booking-pulse 1.8s ease-in-out infinite; }
.booking-copy h2 { margin:0; font-size:clamp(58px,6vw,94px); font-weight:600; line-height:.9; letter-spacing:-.085em; }
.booking-description { max-width:620px; margin:30px 0 0; color:#bbbebb; font-size:clamp(15px,1.3vw,19px); line-height:1.55; letter-spacing:-.025em; }
.booking-copy ul { margin:27px 0 0; padding:0; display:flex; flex-wrap:wrap; gap:9px; list-style:none; }
.booking-copy li { padding:8px 13px; border:1px solid rgba(255,255,255,.15); border-radius:999px; color:#dbdddb; background:rgba(5,5,5,.2); font-size:11px; backdrop-filter:blur(10px); }
.booking-visual { position:relative; min-height:650px; display:grid; place-items:center; perspective:1200px; }
.calendar-orbit { position:absolute; width:min(38vw,530px); aspect-ratio:1; border:1px solid rgba(91,146,255,.25); border-radius:50%; animation:booking-orbit 18s linear infinite; }
.calendar-orbit::before,.calendar-orbit::after { content:""; position:absolute; border:1px solid rgba(91,146,255,.13); border-radius:50%; inset:13%; }.calendar-orbit::after { inset:29%; }
.orbit-dot { position:absolute; width:14px; height:14px; border-radius:50%; background:var(--accent); box-shadow:0 0 28px rgba(47,124,255,.8); }.orbit-dot--one { left:8%; top:22%; }.orbit-dot--two { right:3%; top:52%; width:9px; height:9px; background:#fff; }.orbit-dot--three { left:40%; bottom:-6px; width:11px; height:11px; background:#ffc928; box-shadow:0 0 26px rgba(255,201,40,.7); }
.scheduler-card { position:relative; z-index:2; width:min(36vw,470px); min-height:650px; padding:29px; border:1px solid rgba(255,255,255,.23); border-radius:34px; transform:rotateY(-5deg) rotateX(3deg) rotateZ(1deg); background:linear-gradient(145deg,rgba(35,42,58,.92),rgba(11,14,20,.9)); backdrop-filter:blur(20px); box-shadow:-28px 42px 90px rgba(0,0,0,.5),inset 0 1px rgba(255,255,255,.18); animation:booking-float 4.6s ease-in-out infinite; transition:transform .45s cubic-bezier(.22,1,.36,1); }
.scheduler-card:focus-within,.scheduler-card:hover { transform:rotateY(0) rotateX(0) rotateZ(0) translateY(-7px); animation-play-state:paused; }
.scheduler-heading { display:flex; justify-content:space-between; align-items:flex-start; gap:20px; }
.scheduler-heading > div { display:flex; align-items:flex-start; gap:13px; }.scheduler-heading > div span { margin-top:4px; padding:6px 9px; border-radius:999px; color:#c9d8ff; background:rgba(47,124,255,.2); font:500 11px var(--mono); }.scheduler-heading > div strong { font-size:74px; line-height:.72; letter-spacing:-.1em; }
.scheduler-heading p { margin:2px 0 0; text-align:right; }.scheduler-heading p b,.scheduler-heading p span { display:block; }.scheduler-heading p b { font-size:18px; }.scheduler-heading p span { margin-top:4px; color:#959b9c; font:10px var(--mono); text-transform:uppercase; letter-spacing:.08em; }
.booking-date-field { margin-top:32px; display:grid; gap:8px; }.booking-date-field > span,.booking-identity label > span { color:#aeb2b1; font:10px var(--mono); letter-spacing:.07em; text-transform:uppercase; }
.booking-date-field input { width:100%; min-height:48px; padding:0 14px; border:1px solid rgba(255,255,255,.14); border-radius:13px; color:#fff; color-scheme:dark; background:rgba(255,255,255,.045); font:500 13px var(--mono); outline:none; }.booking-date-field input:focus { border-color:var(--accent); box-shadow:0 0 0 3px rgba(47,124,255,.14); }
.booking-times { margin:14px 0 18px; }
.booking-times-meta { margin-bottom:10px; display:flex; align-items:center; justify-content:space-between; gap:12px; color:#848b91; font:600 9px var(--mono); letter-spacing:.075em; text-transform:uppercase; }
.booking-times-meta > span:first-child { display:flex; align-items:center; gap:7px; color:#c9d8ff; }
.booking-times-meta > span:first-child i { width:7px; height:7px; border-radius:50%; background:#7ce9a2; box-shadow:0 0 13px rgba(124,233,162,.75); }
.booking-time-grid { max-height:188px; padding:2px 4px 7px 2px; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; overflow-y:auto; overscroll-behavior:contain; scrollbar-width:thin; scrollbar-color:rgba(107,153,255,.5) transparent; }
.booking-time { position:relative; min-height:58px; padding:10px 9px 9px; border:1px solid rgba(255,255,255,.105); border-radius:15px; display:grid; grid-template-columns:1fr auto; align-items:end; column-gap:4px; color:#e5e8ea; background:linear-gradient(145deg,rgba(255,255,255,.065),rgba(255,255,255,.018)); cursor:pointer; overflow:hidden; text-align:left; box-shadow:inset 0 1px rgba(255,255,255,.055); transition:transform .25s cubic-bezier(.22,1,.36,1),border-color .25s,background .25s,box-shadow .25s; }
.booking-time::after { content:""; position:absolute; inset:auto -25% -80% 10%; height:75%; border-radius:50%; background:var(--accent); filter:blur(19px); opacity:0; transition:opacity .25s; }
.booking-time > * { position:relative; z-index:1; }
.booking-time > i { position:absolute; top:10px; right:10px; width:5px; height:5px; border-radius:50%; background:#5a6268; transition:background .25s,box-shadow .25s; }
.booking-time strong { font:600 15px var(--mono); letter-spacing:-.06em; }
.booking-time span { padding-bottom:1px; color:#7f878d; font:700 8px var(--mono); letter-spacing:.08em; }
.booking-time:hover { transform:translateY(-3px); border-color:rgba(101,158,255,.58); background:linear-gradient(145deg,rgba(72,126,235,.18),rgba(255,255,255,.025)); box-shadow:0 10px 24px rgba(0,0,0,.22); }
.booking-time:hover > i { background:#85aeff; box-shadow:0 0 12px rgba(74,139,255,.9); }
.booking-time.is-selected { border-color:#79a6ff; background:linear-gradient(145deg,#3d85ff,#1f57ce); box-shadow:0 12px 28px rgba(27,89,215,.36),inset 0 1px rgba(255,255,255,.3); }
.booking-time.is-selected::after { opacity:.52; }
.booking-time.is-selected > i { background:#fff; box-shadow:0 0 14px rgba(255,255,255,.9); }
.booking-time.is-selected span { color:#dce8ff; }
.booking-times-message { grid-column:1/-1; min-height:40px; display:grid; place-items:center; color:#929795; font:500 11px var(--mono); text-align:center; }
.booking-identity { margin-bottom:18px; display:grid; grid-template-columns:1fr 1fr; gap:9px; }.booking-identity label { min-width:0; display:grid; gap:7px; }.booking-identity input { width:100%; min-width:0; height:42px; padding:0 11px; border:1px solid rgba(255,255,255,.13); border-radius:11px; color:#fff; background:rgba(255,255,255,.035); outline:none; font:12px var(--sans); }.booking-identity input:focus { border-color:var(--accent); }.booking-identity input::placeholder { color:#777d7c; }
.booking-email-field { grid-column:1/-1; }
.phone-input { display:flex; align-items:center; border:1px solid rgba(255,255,255,.13); border-radius:11px; background:rgba(255,255,255,.035); }.phone-input:focus-within { border-color:var(--accent); }.phone-input b { padding-left:10px; color:#aeb2b1; font:11px var(--mono); }.phone-input input { border:0; background:transparent; }
.booking-button { width:100%; min-height:53px; padding:9px 10px 9px 20px; border:0; display:flex; align-items:center; justify-content:space-between; gap:22px; border-radius:999px; color:#07111f; background:#f2f2ef; cursor:pointer; font:700 14px var(--sans); transition:transform .25s,background .25s,box-shadow .25s; }
.booking-button b { width:35px; height:35px; display:grid; place-items:center; border-radius:50%; background:var(--accent); color:white; font-size:18px; font-weight:400; }.booking-button:hover { transform:translateY(-3px); color:#fff; background:var(--accent); box-shadow:0 16px 45px rgba(47,124,255,.32); }.booking-button:hover b { background:white; color:var(--accent); }
.booking-button:disabled { cursor:wait; opacity:.72; transform:none; }
.booking-status { min-height:16px; margin:12px 0 0; color:#929795; text-align:center; font-size:10px; }
.booking-status.is-success { color:#78e5a0; }
.booking-status.is-error { color:#ffb1ab; }
.contact-secondary { margin-top:60px; padding-top:68px; border-top:1px solid rgba(255,255,255,.14); }
.contact-card { min-height:540px; padding:clamp(35px,5.5vw,82px); border-radius:38px; background:rgba(5,5,5,.25); backdrop-filter:blur(6px); display:grid; grid-template-columns:1fr 1fr; gap:clamp(45px,9vw,160px); align-items:center; }
.contact-pitch h2 { margin-bottom:24px; font-family:Arapey,Georgia,serif; font-style:italic; font-weight:400; font-size:clamp(52px,5.7vw,88px); letter-spacing:-.05em; line-height:1; }.contact-pitch p { color:#d0d0d0; font-size:14px; }
.contact-card form { display:grid; gap:23px; }.contact-card label { display:grid; gap:8px; color:#ececec; font-family:Arapey,Georgia,serif; font-style:italic; font-size:17px; }.contact-card input,.contact-card textarea { color:#fff; border:0; border-bottom:1px solid rgba(255,255,255,.34); background:transparent; padding:8px 0 10px; font:14px var(--sans); outline:0; resize:vertical; }.contact-card input::placeholder,.contact-card textarea::placeholder { color:rgba(255,255,255,.48); }.contact-card input:focus,.contact-card textarea:focus { border-color:var(--accent); }.contact-card button { min-height:44px; border:0; border-radius:999px; background:#ececec; color:#151515; font:14px var(--sans); cursor:pointer; transition:transform .2s,background .2s,box-shadow .2s; }.contact-card button:hover { transform:translateY(-2px); background:var(--accent); box-shadow:0 9px 30px rgba(47,124,255,.28); color:white; }.contact-card .form-status { min-height:17px; color:white; margin:0; font-size:13px; }
@keyframes booking-orbit { to { transform:rotate(360deg); } }
@keyframes booking-float { 50% { transform:rotateY(-5deg) rotateX(2deg) rotateZ(-1deg) translateY(-12px); } }
@keyframes booking-pulse { 50% { transform:scale(.65); opacity:.6; } }
@media (min-width:701px) {
  .hero {
    --hero-logo-visible-top:203px;
    --hero-logo-visible-height:min(31.98vw,419px);
    --hero-logo-top-half:min(17.0207vw,223.03px);
    --hero-copy-top:calc(var(--hero-logo-visible-top) + var(--hero-logo-visible-height) + 116px);
    --hero-thin-line:clamp(43.2px,6.48vw,100.8px);
    --hero-title-line:clamp(49.4px,6.365vw,100.7px);
    min-height:calc(var(--hero-copy-top) + var(--hero-thin-line) + var(--hero-title-line) + 98px);
  }
  .hero-mark { top:calc(var(--hero-logo-visible-top) + var(--hero-logo-top-half)); }
  .hero-copy { top:var(--hero-copy-top); }
  .hero-copy>.button { padding:10.5px 19px; gap:16px; font-size:14px; }
}
@media (max-width:700px) { .site-header { height:80px; padding:10px 14px; }.site-header__inner { width:100%; height:60px; padding:8px 15px; justify-content:center; }.wordmark { width:175px; height:38px; }nav { display:none; }.grid-bg { background-size:52px 52px; }.hero { padding:0 30px; min-height:112svh; }.hero-mark { top:45svh; width:94vw; }.hero-copy { top:72svh; left:30px; right:30px; display:flex; flex-direction:column; align-items:flex-start; }.hero h1 { font-size:clamp(34px,10vw,43px); margin:8px 0 0; }.hero-thin { font-size:clamp(33px,10vw,43px); }.hero-copy>.button { align-self:flex-end; margin-top:23px; margin-bottom:0; }.what-we-do { display:block; padding:72px 20px 92px; }.what-we-do .section-kicker { margin:0 0 46px; font-size:15px; }.manifesto { font-size:34px; line-height:1.18; letter-spacing:-1.3px; }.work-section { padding:80px 20px; }.proof-section { padding:70px 20px 0; }.proof-section h2 { width:100%; margin-bottom:22px; font-size:47px; line-height:1.08; }.proof-section > p { font-size:13px; }.services-section { padding:58px 20px 80px; }.service { min-height:102px; grid-template-columns:1fr 24px; padding:18px 0; }.service h3 { font-size:46px; }.service p { grid-column:1/-1; margin-left:0; font-size:13px; }.service div { gap:14px; }.work-grid { grid-template-columns:1fr 1fr; gap:9px; }.work-card:nth-child(2),.work-card:nth-child(5) { transform:translateY(30px); }.work-card:nth-child(3) { transform:translateY(0); }.work-section h2 { margin-bottom:42px; }.footer { padding:70px 20px 22px; min-height:420px; grid-template-columns:1fr; gap:45px; }.footer-links { grid-row:1; }.footer-mark { width:180px; height:46px; justify-self:start; }.about-hero,.contact-hero { padding:125px 25px 55px; min-height:70svh; }.about-hero h1 { min-height:3.5em; }.characters,.vision { padding:80px 20px; grid-template-columns:1fr; gap:38px; }.character { min-height:330px; }.statement-banner { padding:38px 0; }.vision img { max-height:400px; }.framer-contact { padding:38px 14px 14px; }.connect-title { font-size:76px; margin-top:34px; }.contact-card { min-height:auto; margin-top:12px; padding:42px 28px; grid-template-columns:1fr; gap:35px; border-radius:26px; }.contact-pitch h2 { font-size:50px; }.contact-card form { gap:19px; } }
@media (max-width:700px) {
  .service { height:88px; min-height:0; padding:0; display:block; }
  .service-heading { height:100%; min-height:0; }
  .service h3 { font-size:42px; }
  .service-reveal p { margin:0; padding:0 18px; color:#fff; font-size:clamp(24px,7.2vw,31px); line-height:1.08; white-space:normal; opacity:1; }
  .service.is-active .service-reveal,.service:hover .service-reveal,.service:focus-visible .service-reveal { height:100%; }
}
.work-section { position:relative; height:690px; min-height:690px; padding:0; overflow:hidden; display:grid; place-items:center; background:#000; color:#fff; isolation:isolate; }
.work-section h2 { position:relative; z-index:2; width:min(1120px,88vw); margin:0; color:#fff; text-align:center; white-space:nowrap; font-size:clamp(42px,5.25vw,76px); font-weight:700; font-style:normal; line-height:.94; letter-spacing:-.065em; }
.work-section h2 span { font-weight:700; font-style:normal; }
.work-orbit { position:absolute; z-index:1; inset:0; }
.orbit-ring { position:absolute; left:50%; top:50%; width:1120px; height:1120px; margin:-560px 0 0 -560px; will-change:transform; }
.orbit-ring--outer { --orbit-radius:clamp(380px,39vw,560px); --card-size:clamp(74px,6.8vw,98px); animation:orbit-clockwise 52s linear infinite; }
.orbit-ring--middle { --orbit-radius:clamp(285px,30vw,430px); --card-size:clamp(68px,6.2vw,90px); animation:orbit-counter-clockwise 38s linear infinite; }
.orbit-ring--inner { --orbit-radius:clamp(190px,20.5vw,295px); --card-size:clamp(58px,5.4vw,78px); animation:orbit-clockwise 27s linear infinite reverse; }
.orbit-card { position:absolute; left:50%; top:50%; width:var(--card-size); aspect-ratio:4/5; margin:0; overflow:hidden; background:#111; opacity:.72; transform:translate(-50%,-50%) rotate(var(--angle)) translateX(var(--orbit-radius)) rotate(var(--tilt)); }
.orbit-ring--middle .orbit-card { opacity:.64; }
.orbit-ring--inner .orbit-card { opacity:.52; }
.orbit-card:nth-child(3n) { width:calc(var(--card-size) * .88); aspect-ratio:1/1; }
.orbit-card:nth-child(4n) { width:calc(var(--card-size) * 1.08); }
.orbit-card img { width:100%; height:100%; object-fit:cover; }
.clients-marquee { position:relative; height:160px; overflow:hidden; border-top:1px solid #1d1d1d; border-bottom:1px solid #1d1d1d; background:#000; }
.clients-track { display:flex; width:max-content; height:100%; animation:clients-slide 28s linear infinite; will-change:transform; }
.clients-group { display:flex; flex:none; height:100%; }
.client-logo { flex:0 0 clamp(190px,18vw,270px); height:100%; margin:0; display:grid; place-items:center; }
.client-logo img { display:block; width:72%; height:76px; object-fit:contain; }
@keyframes orbit-clockwise { to { transform:rotate(360deg); } }
@keyframes orbit-counter-clockwise { to { transform:rotate(-360deg); } }
@keyframes clients-slide { to { transform:translateX(-50%); } }
@media (max-width:700px) {
  .work-section { height:520px; min-height:520px; padding:0; }
  .work-section h2 { width:96vw; font-size:clamp(27px,7.45vw,31px); line-height:.96; }
  .orbit-ring--outer { --orbit-radius:315px; --card-size:64px; }
  .orbit-ring--middle { --orbit-radius:235px; --card-size:55px; }
  .orbit-ring--inner { --orbit-radius:155px; --card-size:46px; }
  .clients-marquee { height:126px; }
  .client-logo { flex-basis:170px; }
  .client-logo img { width:70%; height:62px; }
  .clients-track { animation-duration:22s; }
}
.footer { min-height:0; padding:76px clamp(24px,4.2vw,64px) 22px; display:block; background:#000; color:#f4f4f4; }
.footer-main { display:grid; grid-template-columns:minmax(320px,1.7fr) repeat(3,minmax(130px,.72fr)); gap:clamp(38px,5vw,82px); align-items:start; }
.footer-contact { display:flex; flex-direction:column; gap:7px; }
.footer-contact a { width:max-content; color:#f4f4f4; font-size:clamp(17px,1.45vw,22px); font-weight:600; line-height:1.25; }
.footer-column h2 { margin:0 0 18px; color:#f4f4f4; font-size:clamp(19px,1.65vw,25px); line-height:1; letter-spacing:-.04em; }
.footer-column ul { margin:0; padding:0; list-style:none; }
.footer-column li,.footer-nav a { display:block; margin:0 0 9px; color:#d8d8d8; font-size:15px; line-height:1.2; }
.footer-nav a { width:max-content; transition:color .2s ease; }
.footer-contact a { transition:color .2s ease; }
.footer-contact a:hover,.footer-nav a:hover { color:var(--accent); }
.footer-wordmark { height:clamp(170px,18vw,275px); margin-top:48px; overflow:hidden; border-bottom:1px solid #343434; }
.footer-wordmark img { display:block; width:100%; height:100%; object-fit:cover; object-position:center 44%; filter:invert(1); }
.footer-bottom { padding-top:18px; display:flex; justify-content:space-between; gap:24px; color:#777; font-size:13px; }
@media (max-width:700px) {
  .footer { padding:60px 20px 20px; }
  .footer-main { grid-template-columns:1fr 1fr; gap:42px 24px; }
  .footer-contact { grid-column:1/-1; }
  .footer-column h2 { margin-bottom:15px; font-size:18px; }
  .footer-column li,.footer-nav a { font-size:14px; }
  .footer-wordmark { height:106px; margin-top:54px; }
  .footer-bottom { padding-top:14px; flex-direction:column; gap:5px; font-size:11px; }
  .framer-contact { padding:86px 14px 62px; }
  .framer-contact::before { inset:80px 0 0; background-attachment:scroll; filter:blur(23px) brightness(.4) saturate(.48); transform:scale(1.16); }
  .connect-title { margin:24px 0 36px; font-size:74px; }
  .booking-card { min-height:0; padding:0 10px; grid-template-columns:1fr; gap:42px; }
  .booking-kicker { margin-bottom:25px; font-size:10px; }
  .booking-copy h2 { font-size:clamp(48px,14vw,62px); }
  .booking-description { margin-top:25px; font-size:15px; line-height:1.5; }
  .booking-copy ul { margin:22px 0 0; }
  .booking-copy li { padding:8px 11px; font-size:10px; }
  .booking-visual { min-height:630px; }
  .calendar-orbit { width:390px; }
  .scheduler-card { width:100%; min-height:630px; padding:22px 18px; border-radius:26px; transform:none; animation:none; }
  .scheduler-heading > div strong { font-size:64px; }
  .scheduler-heading p b { font-size:16px; }
  .booking-date-field { margin-top:28px; }
  .booking-times { margin-top:12px; }
  .booking-times-meta { align-items:flex-end; font-size:8px; }
  .booking-time-grid { grid-template-columns:repeat(3,minmax(0,1fr)); max-height:205px; gap:7px; }
  .booking-time { min-height:56px; padding:9px 8px 8px; border-radius:14px; }
  .booking-time strong { font-size:14px; }
  .booking-identity { grid-template-columns:1fr; gap:10px; }
  .booking-email-field { grid-column:auto; }
  .booking-button { width:100%; min-width:0; }
  .contact-secondary { margin-top:68px; padding-top:55px; }
  .contact-card { min-height:0; padding:38px 22px; grid-template-columns:1fr; gap:40px; border-radius:26px; }
  .contact-pitch h2 { font-size:48px; }
}
@media (max-width:700px) {
  .characters { padding:64px 16px 105px; }
  .characters-intro .section-kicker { font-size:17px; }
  .characters-intro h2 { margin:65px auto 90px; font-size:38px; line-height:1.08; }
  .character-stack { grid-template-columns:1fr; gap:86px; }
  .character { min-height:500px; padding:30px 24px 245px; align-items:flex-start; border-radius:22px; }
  .character-content,.character.bae .character-content { width:100%; margin:0; text-align:left; }
  .character h3 { margin-bottom:15px; font-size:48px; }
  .character .character-role { font-size:20px; }
  .character .character-description { margin-top:14px!important; font-size:14px; line-height:1.45; }
  .character img { height:350px; bottom:-78px; }
  .character.bee img { right:50%; left:auto; transform:translateX(50%); }
  .character.bae img { left:50%; transform:translateX(-50%); }
  .character:hover img,.character:focus-visible img { transform:translateY(-3%) scale(1.08); }
  .character.bee:hover img,.character.bee:focus-visible img { transform:translateX(50%) translateY(-3%) scale(1.08); }
  .character.bae:hover img,.character.bae:focus-visible img { transform:translateX(-50%) translateY(-3%) scale(1.08); }
  .statement-section { padding:62px 16px; }
  .statement-card { min-height:410px; padding:30px 22px 0; display:block; border-radius:28px; }
  .statement-card h2 { font-size:clamp(18px,5.35vw,23px); line-height:1; letter-spacing:-.06em; }
  .statement-card p { margin-top:28px; max-width:92%; font-size:14px; line-height:1.2; }
  .statement-card img { position:absolute; right:4%; top:auto; bottom:-5px; width:92%; height:250px; transform:none; }
}
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto!important; transition:none!important; animation:none!important; } }
.whatsapp-button { position:fixed; z-index:9000; right:24px; bottom:24px; min-height:54px; padding:8px 18px 8px 10px; display:flex; align-items:center; gap:10px; border:1px solid rgba(255,255,255,.25); border-radius:999px; background:#25d366; color:#07170d; font-weight:700; font-size:14px; box-shadow:0 12px 36px rgba(0,0,0,.38); transition:transform .2s ease,box-shadow .2s ease,background .2s ease; }
.whatsapp-button svg { display:block; width:30px; height:30px; flex:none; fill:currentColor; overflow:hidden; }
.whatsapp-button:hover { color:#07170d; background:#4be07f; transform:translateY(-3px); box-shadow:0 16px 44px rgba(37,211,102,.3); }
.whatsapp-button:focus-visible { outline:3px solid var(--accent); outline-offset:3px; }
@media (max-width:700px) { .whatsapp-button { right:14px; bottom:14px; width:52px; min-height:52px; padding:11px; justify-content:center; }.whatsapp-button span { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }.whatsapp-button svg { width:30px; height:30px; } }
@media print { .whatsapp-button { display:none; } }

/* About page — document-driven narrative */
.about-hero { min-height:88svh; padding:132px clamp(24px,5vw,76px) 82px; }
.about-hero::after { top:51%; width:min(92vw,1300px); height:430px; background:radial-gradient(ellipse,rgba(5,6,6,.97) 0%,rgba(5,6,6,.82) 48%,rgba(5,6,6,0) 78%); }
.about-hero-copy { width:min(100%,1240px); display:flex; flex-direction:column; align-items:center; }
.about-hero h1 { width:100%; min-height:2.5em; margin:0; font-family:"IBM Plex Mono",var(--mono); font-size:clamp(34px,4.25vw,65px); font-weight:600; line-height:1.18; letter-spacing:-.055em; text-wrap:balance; text-shadow:0 3px 22px #000; }
.typewriter-prefix,.typewriter-dynamic { display:inline; }
.typewriter-dynamic { color:#ffc928; }
.about-hero-copy > p { width:min(100%,820px); margin:30px 0 32px; color:#c2c5c3; font-size:clamp(15px,1.35vw,20px); line-height:1.5; letter-spacing:-.025em; text-wrap:balance; }
.about-philosophy { position:relative; padding:110px clamp(24px,5vw,76px) 145px; display:grid; grid-template-columns:22% minmax(0,1fr); gap:clamp(34px,5vw,80px); overflow:hidden; background:radial-gradient(circle at 85% 14%,rgba(47,124,255,.13),transparent 26%),linear-gradient(180deg,#1b1c1b 0,#0b0c0c 330px,#050505 100%); }
.about-philosophy .section-kicker,.about-services .section-kicker { margin:10px 0 0; color:#fff; font:600 13px var(--mono); letter-spacing:.08em; }
.about-philosophy-copy { position:relative; z-index:1; width:min(100%,980px); margin:0; padding-top:26px; border-top:1px solid rgba(255,255,255,.2); font-size:clamp(28px,2.55vw,39px); font-weight:350; line-height:1.23; letter-spacing:-.038em; }
.about-philosophy .manifesto-char { color:#555856; }
.about-philosophy .manifesto-char.is-filled { color:#fff; }
.about-philosophy-cta { position:relative; z-index:1; grid-column:2; max-width:760px; margin:48px 0 0; padding-top:22px; border-top:1px solid rgba(255,201,40,.55); color:#fff; font-family:"Arapey",Georgia,serif; font-size:clamp(30px,3vw,46px); font-style:italic; font-weight:400; line-height:1.03; letter-spacing:-.035em; }
.about .characters { position:relative; padding-top:102px; background:radial-gradient(circle at 74% 14%,rgba(47,124,255,.1),transparent 25%),#050505; }
.about .characters::before { content:"×"; position:absolute; right:5vw; top:12px; color:rgba(255,255,255,.035); font:300 clamp(170px,22vw,330px)/1 var(--sans); pointer-events:none; }
.about .characters-intro { position:relative; z-index:1; }
.about .characters-intro .section-kicker { padding-bottom:20px; border-bottom:1px solid #292b2a; }
.characters-intro-layout { margin:72px 0 96px; display:grid; grid-template-columns:minmax(0,1.3fr) minmax(330px,.7fr); gap:clamp(60px,8vw,130px); align-items:end; }
.about .characters-intro h2 { max-width:830px; margin:0; text-align:left; font-size:clamp(50px,5.4vw,82px); font-weight:650; line-height:.91; letter-spacing:-.075em; }
.about .characters-intro h2 em { display:block; margin-top:.08em; color:#ffc928; font-family:"Arapey",Georgia,serif; font-size:1.12em; font-weight:400; line-height:.86; letter-spacing:-.045em; }
.characters-intro-aside { padding-top:25px; border-top:1px solid #343635; }
.characters-intro-aside > p { margin:26px 0 0; color:#a1a4a2; font-size:clamp(15px,1.25vw,18px); line-height:1.55; letter-spacing:-.02em; }
.engine-tags { display:flex; align-items:center; gap:11px; flex-wrap:wrap; }
.engine-tags span { padding:8px 12px; border:1px solid rgba(255,255,255,.18); border-radius:999px; color:#d8dad8; font:500 10px var(--mono); letter-spacing:.03em; text-transform:uppercase; }
.engine-tags b { color:var(--accent); font-size:22px; font-weight:400; }
.about.page { overflow:visible; overflow-x:clip; }
.about-stats { position:relative; min-height:720px; padding:72px clamp(24px,5.5vw,88px) 126px; overflow:hidden; background:#050505; border-top:1px solid #242625; }
.about-story-heading { padding:10px 0 54px; }
.about-story-heading .section-kicker { margin:0; color:#a6aaa7; font:600 13px var(--mono); letter-spacing:.08em; }
.about-story-lines { width:100%; display:grid; }
.about-story-line { width:100%; margin:0; padding:15px 0 21px; border-bottom:1px solid #242625; font-size:clamp(66px,8.2vw,126px); font-weight:620; line-height:.8; letter-spacing:-.082em; white-space:nowrap; }
.about-story-line:first-child { border-top:1px solid #242625; }
.about-story-line .manifesto-char { color:#303231; transition:color .07s linear; }
.about-story-line .manifesto-char.is-filled { color:#f4f5f2; }
.about-services { position:relative; padding:122px 0 0; background:#e9e5da; color:#0a0b0b; }
.about-services-heading { margin:0 clamp(24px,5vw,76px) 92px; display:grid; grid-template-columns:22% minmax(0,1fr); gap:clamp(34px,5vw,80px); align-items:start; }
.about-services .section-kicker { color:#101111; }
.about-services-heading h2 { margin:0; font-size:clamp(50px,6vw,92px); font-weight:650; line-height:.88; letter-spacing:-.08em; }
.about-services-stack { position:relative; padding-bottom:clamp(100px,11vw,170px); }
.about-service-panel { position:sticky; top:calc(92px + (var(--panel-index) * 72px)); z-index:calc(var(--panel-index) + 1); height:420px; min-height:420px; margin:0; border-top:1px solid #656762; display:grid; grid-template-columns:minmax(330px,41%) minmax(0,59%); overflow:clip; background:#f2f0e9; box-shadow:0 -12px 28px rgba(26,27,24,.07); }
.about-service-copy { min-width:0; padding:24px clamp(28px,4vw,62px) 42px; display:flex; flex-direction:column; justify-content:flex-start; }
.about-service-title { display:flex; align-items:baseline; gap:18px; }
.about-service-title > span { color:var(--panel-accent); font:600 12px var(--mono); letter-spacing:.04em; }
.about-service-panel h3 { margin:0; font-size:clamp(45px,5vw,76px); font-weight:580; line-height:1; letter-spacing:-.075em; }
.about-service-panel ul { margin:24px 0 0 34px; padding:0; list-style:none; }
.about-service-panel li { position:relative; margin-top:8px; color:#30322f; font-size:clamp(14px,1.2vw,18px); line-height:1.3; letter-spacing:-.025em; }
.about-service-panel li::before { content:""; position:absolute; left:-21px; top:.56em; width:7px; height:7px; border-radius:50%; background:var(--panel-accent); }
.about-service-panel figure { min-width:0; height:419px; min-height:0; margin:0; overflow:hidden; background:#111; }
.about-service-panel img { display:block; width:100%; height:100%; min-height:0; object-fit:cover; transform:scale(1.025); transition:transform .8s cubic-bezier(.16,1,.3,1),filter .4s ease; }
.about-service-panel:hover img { transform:scale(1.06); }
.about-closing { padding:128px clamp(24px,5vw,76px) 42px; background:radial-gradient(circle at 83% 22%,rgba(47,124,255,.25),transparent 28%),#050505; }
.about-closing-lede > p { margin:0 0 35px; color:#929694; font-size:clamp(17px,1.6vw,24px); }
.about-closing h2 { max-width:1150px; margin:0; font-size:clamp(65px,9vw,140px); font-weight:650; line-height:.84; letter-spacing:-.09em; }
.about-closing-contact { margin-top:80px; padding:28px 0 64px; border-top:1px solid #2d2e2d; border-bottom:1px solid #2d2e2d; display:grid; grid-template-columns:minmax(220px,.8fr) minmax(300px,1.2fr); gap:28px; align-items:end; font-style:normal; }
.about-closing-contact > a { min-height:58px; display:grid; align-content:center; gap:8px; }
.about-closing-contact span { color:#777b79; font:500 10px var(--mono); letter-spacing:.08em; text-transform:uppercase; }
.about-closing-contact > a { width:max-content; color:#e5e7e5; font-size:clamp(17px,1.6vw,24px); letter-spacing:-.025em; transition:color .2s ease; }
.about-closing-contact > a:hover { color:var(--accent); }

@media (max-width:900px) {
  .about-stats { min-height:700px; }
}

@media (max-width:700px) {
  .about-hero { min-height:78svh; padding:116px 20px 62px; }
  .about-hero::after { height:390px; }
  .about-hero h1 { min-height:4.8em; font-size:clamp(29px,8.2vw,38px); line-height:1.2; letter-spacing:-.05em; }
  .about-hero-copy > p { margin:20px 0 25px; font-size:14px; line-height:1.5; }
  .about-philosophy { padding:76px 20px 100px; grid-template-columns:1fr; gap:44px; }
  .about-philosophy-copy { padding-top:21px; font-size:28px; line-height:1.22; letter-spacing:-.035em; }
  .about-philosophy-cta { grid-column:1; margin-top:10px; padding-top:18px; font-size:30px; }
  .about .characters { padding-top:72px; }
  .about .characters::before { top:58px; font-size:160px; }
  .about .characters-intro .section-kicker { padding-bottom:16px; }
  .characters-intro-layout { margin:52px 0 78px; grid-template-columns:1fr; gap:45px; }
  .about .characters-intro h2 { margin:0; font-size:42px; line-height:.94; }
  .characters-intro-aside { padding-top:20px; }
  .characters-intro-aside > p { margin-top:22px; font-size:15px; }
  .about-stats { min-height:560px; padding:58px 20px 88px; }
  .about-story-heading { padding:0 0 42px; }
  .about-story-line { padding:16px 0 19px; font-size:clamp(36px,10.8vw,48px); line-height:.86; letter-spacing:-.072em; }
  .about-services { padding:82px 0 0; }
  .about-services-heading { margin:0 20px 58px; grid-template-columns:1fr; gap:38px; }
  .about-services-heading h2 { font-size:52px; }
  .about-services-stack { padding-bottom:82px; }
  .about-service-panel { top:calc(80px + (var(--panel-index) * 52px)); height:555px; min-height:555px; grid-template-columns:1fr; grid-template-rows:319px 235px; }
  .about-service-copy { min-height:0; padding:16px 20px 28px; }
  .about-service-title { gap:11px; }
  .about-service-title > span { font-size:10px; }
  .about-service-panel h3 { font-size:clamp(37px,10vw,48px); white-space:nowrap; }
  .about-service-panel ul { margin:22px 0 0 25px; }
  .about-service-panel li { margin-top:7px; font-size:14px; }
  .about-service-panel figure,.about-service-panel img { height:235px; min-height:0; }
  .about-closing { padding:92px 20px 28px; }
  .about-closing h2 { font-size:57px; line-height:.88; }
  .about-closing-contact { margin-top:58px; padding:24px 0 32px; grid-template-columns:1fr; gap:24px; align-items:start; }
  .about-closing-contact > a { width:100%; min-height:56px; overflow-wrap:anywhere; }
}

@media (prefers-reduced-motion:reduce) {
  .about-service-panel { position:relative; top:auto; }
  .about-service-panel img { transform:none; }
}

/* Shared vector arrow: avoids platform emoji rendering. */
.link-arrow { display:block; width:18px; height:18px; flex:none; overflow:visible; fill:none; stroke:currentColor; stroke-width:1.55; stroke-linecap:round; stroke-linejoin:round; }
.button > span { font-size:inherit; line-height:inherit; }
.button .link-arrow { width:19px; height:19px; }
.footer-nav { display:grid; justify-items:start; gap:9px; }
.footer-nav a { display:inline-flex; align-items:center; gap:7px; margin:0; }
.footer-nav .link-arrow { width:15px; height:15px; }
.booking-button b .link-arrow { width:18px; height:18px; }
.menu-toggle { display:none; }
.mobile-menu-intro,.mobile-menu-meta { display:none; }
.mobile-menu-links { display:flex; gap:18px; }
.mobile-menu-copy { display:contents; }
.mobile-menu-description,.mobile-menu-preview { display:none; }
.mobile-menu-link strong { font:inherit; }
.mobile-menu-index,.mobile-menu-link .link-arrow { display:none; }

@media (pointer:coarse) and (prefers-reduced-motion:no-preference) {
  .hero-mark { touch-action:pan-y; }
  .hero-mark.is-mobile-active { filter:drop-shadow(0 26px 38px rgba(0,0,0,.46)); }
  .hero-mark.is-mobile-active::after { display:block; opacity:.72; }
  .hero-mark.is-mobile-active img { opacity:0; }
  .hero-mark.is-mobile-active .hero-mark-pixels { opacity:1; }
}

@media (max-width:700px) {
  body.mobile-menu-open { overflow:hidden; }
  .site-header { position:fixed; z-index:9500; height:72px; padding:8px 10px; }
  .site-header__inner { position:relative; height:56px; padding:7px 9px 7px 12px; justify-content:space-between; }
  .wordmark { width:146px; height:35px; }
  .menu-toggle { width:42px; height:42px; padding:0; border:1px solid rgba(255,255,255,.18); border-radius:50%; display:grid; place-content:center; gap:4px; color:#fff; background:rgba(255,255,255,.055); cursor:pointer; }
  .menu-toggle span { width:17px; height:1.5px; display:block; border-radius:99px; background:currentColor; transform-origin:center; transition:transform .25s ease,opacity .2s ease; }
  .site-header.is-menu-open .menu-toggle span:nth-child(1) { transform:translateY(5.5px) rotate(45deg); }
  .site-header.is-menu-open .menu-toggle span:nth-child(2) { opacity:0; }
  .site-header.is-menu-open .menu-toggle span:nth-child(3) { transform:translateY(-5.5px) rotate(-45deg); }
  .site-header nav { position:fixed; z-index:9499; top:72px; left:0; right:0; height:calc(100dvh - 72px); min-height:0; margin:0; padding:clamp(18px,4vh,34px) 18px max(20px,env(safe-area-inset-bottom)); display:grid; grid-template-rows:auto minmax(0,1fr) auto; gap:14px; overflow:hidden auto; border:0; border-top:1px solid rgba(255,255,255,.11); border-radius:0 0 28px 28px; background-color:#080a0a; background-image:radial-gradient(circle at 0 0,rgba(210,216,212,.2) 0 1px,transparent 1.4px),linear-gradient(rgba(255,255,255,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.055) 1px,transparent 1px); background-size:52px 52px; box-shadow:0 28px 80px rgba(0,0,0,.66); opacity:0; visibility:hidden; pointer-events:none; transform:translateY(-24px); transform-origin:top; transition:opacity .25s ease,transform .42s cubic-bezier(.16,1,.3,1),visibility .25s; isolation:isolate; }
  .site-header nav::before { content:""; position:absolute; z-index:-1; width:310px; height:310px; right:-125px; top:14%; border-radius:50%; background:radial-gradient(circle,rgba(47,124,255,.52),rgba(47,124,255,.14) 44%,transparent 70%); filter:blur(10px); animation:mobile-menu-orbit 7s ease-in-out infinite alternate; }
  .site-header nav::after { content:""; position:absolute; z-index:-1; width:230px; height:230px; left:-115px; bottom:2%; border-radius:50%; background:radial-gradient(circle,rgba(255,201,40,.25),transparent 68%); filter:blur(12px); animation:mobile-menu-orbit 8.5s ease-in-out infinite alternate-reverse; }
  .site-header.is-menu-open nav { opacity:1; visibility:visible; pointer-events:auto; transform:none; }
  .mobile-menu-intro { position:relative; z-index:1; display:block; }
  .mobile-menu-intro > span { color:#8d9290; font:500 9px var(--mono); letter-spacing:.11em; }
  .mobile-menu-intro p { margin:9px 0 0; color:#f4f5f2; font-size:clamp(29px,8.8vw,39px); font-weight:650; line-height:.9; letter-spacing:-.07em; }
  .mobile-menu-intro em { color:#ffc928; font-family:"Arapey",Georgia,serif; font-size:1.08em; font-weight:400; }
  .mobile-menu-links { position:relative; z-index:1; min-height:0; display:flex; flex-direction:column; justify-content:center; gap:11px; }
  .site-header nav .mobile-menu-link { position:relative; width:100%; min-width:0; min-height:clamp(120px,17.5vh,146px); padding:11px 10px; border:1px solid rgba(255,255,255,.15); border-radius:22px; display:grid; grid-template-columns:27px minmax(0,1fr) min(24vw,96px) 27px; align-items:center; gap:7px; overflow:hidden; color:#f3f4f1; background:linear-gradient(115deg,rgba(255,255,255,.07),rgba(255,255,255,.025)); box-shadow:none; text-align:left; text-transform:none; opacity:0; transform:translateY(24px); transition:opacity .32s ease,transform .5s cubic-bezier(.16,1,.3,1),border-color .24s ease,background .24s ease; }
  .site-header nav .mobile-menu-link::before { content:""; position:absolute; z-index:-1; inset:0; background:radial-gradient(circle at 80% 50%,rgba(47,124,255,.2),transparent 48%); opacity:.45; transition:opacity .25s ease; }
  .site-header nav .mobile-menu-link--contact::before { background:radial-gradient(circle at 80% 50%,rgba(255,201,40,.2),transparent 48%); }
  .site-header.is-menu-open .mobile-menu-link { opacity:1; transform:none; }
  .site-header.is-menu-open .mobile-menu-link:nth-child(2) { transition-delay:.07s; }
  .site-header nav .mobile-menu-link:hover,.site-header nav .mobile-menu-link:focus-visible,.site-header nav .mobile-menu-link:active { padding:11px 10px; border-color:rgba(255,255,255,.42); color:#fff; background:linear-gradient(115deg,rgba(255,255,255,.11),rgba(255,255,255,.04)); box-shadow:none; transform:scale(.985); }
  .site-header nav .mobile-menu-link:hover::before,.site-header nav .mobile-menu-link:focus-visible::before,.site-header nav .mobile-menu-link:active::before { opacity:1; }
  .mobile-menu-index { color:#8e9491; font:500 10px var(--mono); transition:color .2s; }
  .mobile-menu-index { display:block; }
  .mobile-menu-copy { min-width:0; display:grid; gap:8px; align-content:center; }
  .mobile-menu-description { display:block; color:#8f9492; font:500 9px/1.35 var(--mono); letter-spacing:-.025em; text-transform:none; transition:color .2s ease; }
  .mobile-menu-link strong { font-family:var(--sans); font-size:clamp(29px,8vw,36px); font-weight:500; line-height:.9; letter-spacing:-.07em; }
  .mobile-menu-preview { position:relative; width:min(24vw,96px); height:calc(100% - 4px); max-height:118px; display:block; overflow:hidden; border:1px solid rgba(255,255,255,.16); border-radius:17px; transform:rotate(2deg); transition:transform .45s cubic-bezier(.16,1,.3,1),filter .3s ease; }
  .mobile-menu-preview--about { background:linear-gradient(145deg,#236dff,#08162c 78%); }
  .mobile-menu-preview--about img { position:absolute; width:190%; max-width:none; height:auto; bottom:-8%; object-fit:contain; filter:drop-shadow(0 8px 10px rgba(0,0,0,.38)); }
  .mobile-menu-bee { left:-26%; }
  .mobile-menu-bae { left:-64%; }
  .mobile-menu-preview--contact { background:linear-gradient(145deg,#ffc928,#ff6a3c); }
  .mobile-menu-preview--contact img { position:absolute; width:128%; max-width:none; left:50%; top:50%; transform:translate(-50%,-47%) rotate(-5deg); }
  .mobile-menu-link .link-arrow { width:25px; height:25px; display:block; justify-self:end; stroke-width:1.2; transform:rotate(0); transition:transform .35s cubic-bezier(.16,1,.3,1); }
  .mobile-menu-link:hover .link-arrow,.mobile-menu-link:focus-visible .link-arrow,.mobile-menu-link:active .link-arrow { transform:rotate(45deg); }
  .mobile-menu-link:hover .mobile-menu-index,.mobile-menu-link:focus-visible .mobile-menu-index,.mobile-menu-link:active .mobile-menu-index { color:currentColor; }
  .mobile-menu-link:hover .mobile-menu-description,.mobile-menu-link:focus-visible .mobile-menu-description,.mobile-menu-link:active .mobile-menu-description { color:#d9dcda; }
  .mobile-menu-link:hover .mobile-menu-preview,.mobile-menu-link:focus-visible .mobile-menu-preview,.mobile-menu-link:active .mobile-menu-preview { transform:rotate(-2deg) scale(1.07); }
  .site-header.is-menu-open .mobile-menu-preview--about img { animation:mobile-menu-character 2.8s ease-in-out infinite alternate; }
  .site-header.is-menu-open .mobile-menu-bae { animation-delay:-1.25s; }
  .site-header.is-menu-open .mobile-menu-preview--contact img { animation:mobile-menu-berry 4s ease-in-out infinite alternate; }
  .mobile-menu-link[aria-current="page"] .mobile-menu-index::after { content:""; width:6px; height:6px; margin:8px 0 0; display:block; border-radius:50%; background:#ffc928; box-shadow:0 0 13px #ffc928; }
  .mobile-menu-meta { position:relative; z-index:1; padding-top:17px; border-top:1px solid rgba(255,255,255,.14); display:grid; grid-template-columns:minmax(0,1.3fr) minmax(112px,.7fr); gap:18px; }
  .mobile-menu-meta > div { min-width:0; display:grid; align-content:start; gap:7px; }
  .mobile-menu-meta span { color:#7f8582; font:500 9px var(--mono); letter-spacing:.08em; text-transform:uppercase; }
  .site-header nav .mobile-menu-meta a { width:max-content; max-width:100%; min-width:0; padding:0; border:0; border-radius:0; color:#d8dbd8; background:none; box-shadow:none; text-align:left; text-transform:none; font-size:11px; overflow-wrap:anywhere; }
  .mobile-menu-meta p { margin:0; display:flex; flex-wrap:wrap; gap:5px 10px; }

  .hero-copy { align-items:center; text-align:center; }
  .hero-copy > .button { align-self:center; justify-self:center; margin-top:25px; }
  .hero-mark { touch-action:pan-y; }

  .footer { padding-bottom:74px; }
  .footer-bottom { padding-top:16px; display:grid; grid-template-columns:1fr auto; gap:8px 16px; align-items:center; font-size:10px; }
  .footer-bottom span:first-child { grid-column:1/-1; padding-bottom:10px; border-bottom:1px solid #242424; color:#aaa; font-size:12px; }
  .footer-bottom span:last-child { margin-right:58px; text-align:right; }

  .characters { padding:58px 16px 74px; }
  .characters-intro-layout { margin-bottom:54px; gap:32px; }
  .character-stack { gap:34px; }
  .character { min-height:410px; padding:24px 20px 186px; border-radius:20px; }
  .character h3 { margin-bottom:11px; font-size:40px; }
  .character .character-role { font-size:17px; }
  .character .character-description { margin-top:11px!important; font-size:13px; line-height:1.4; }
  .character img { height:282px; bottom:-62px; }
  .character.bee.is-in-view { background:#ffbd28!important; box-shadow:0 18px 46px rgba(255,189,40,.12); }
  .character.bae.is-in-view { background:#f12822!important; box-shadow:0 18px 46px rgba(241,40,34,.13); }
  .character.is-in-view h3,.character.is-in-view .character-role,.character.is-in-view .character-description { color:#090909; }
  .character.bee.is-in-view img { transform:translateX(50%) translateY(-2%) scale(1.055); }
  .character.bae.is-in-view img { transform:translateX(-50%) translateY(-2%) scale(1.055); }

  .about-service-panel { height:395px; min-height:395px; grid-template-rows:180px 215px; }
  .about-service-copy { padding:14px 20px 18px; }
  .about-service-panel ul { margin-top:13px; }
  .about-service-panel figure,.about-service-panel img { height:215px; }

  .scheduler-card { min-width:0; overflow:hidden; }
  .booking-date-field { min-width:0; max-width:100%; overflow:hidden; }
  .booking-date-field input { display:block; width:100%; min-width:0; max-width:100%; padding-inline:12px; font-size:16px; -webkit-min-logical-width:0; }
  .booking-date-field input::-webkit-date-and-time-value { min-width:0; margin:0; text-align:left; }
}

@keyframes mobile-menu-orbit { to { transform:translate3d(-30px,34px,0) scale(1.12); } }
@keyframes mobile-menu-character { to { transform:translateY(-7%) scale(1.06); } }
@keyframes mobile-menu-berry { to { transform:translate(-50%,-47%) rotate(5deg) scale(1.08); } }
@media (prefers-reduced-motion:reduce) {
  .site-header nav::before,.site-header nav::after,.site-header.is-menu-open .mobile-menu-preview img { animation:none; }
}
