@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@400;500;600;700;800&family=DM+Sans:wght@500;600;700&display=swap');

:root{--ink:#102b24;--paper:#f3f0e8;--sand:#e8dfce;--lime:#c8e45b;--orange:#ed7856;--white:#fffdf8;--muted:#64756f;--line:rgba(16,43,36,.14)}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:"Noto Sans SC",system-ui,sans-serif;line-height:1.65;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
button{font:inherit}
.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}
.topbar{position:fixed;z-index:20;top:0;left:0;right:0;height:76px;padding:0 max(24px,5vw);display:flex;align-items:center;justify-content:space-between;background:rgba(243,240,232,.86);backdrop-filter:blur(18px);border-bottom:1px solid rgba(16,43,36,.08)}
.brand{display:flex;align-items:center;gap:11px;font-family:"DM Sans",sans-serif;font-weight:700;letter-spacing:-.02em}
.brand-mark{width:36px;height:36px;display:grid;place-items:center;background:var(--ink);color:var(--lime);border-radius:50%;font-size:12px;letter-spacing:.04em}
nav{display:flex;gap:30px;font-size:14px;font-weight:600}
nav a{position:relative}
nav a:after{content:"";position:absolute;left:0;bottom:-5px;width:0;height:2px;background:var(--orange);transition:.25s}
nav a:hover:after,nav a:focus-visible:after{width:100%}
.menu-button{display:none;background:none;border:0;width:42px;height:42px;padding:9px;cursor:pointer}
.menu-button span:not(.sr-only){display:block;height:2px;background:var(--ink);margin:5px 0;transition:.25s}
.hero{min-height:100svh;padding:150px max(24px,8vw) 75px;display:grid;grid-template-columns:1.08fr .92fr;align-items:center;gap:6vw;position:relative;overflow:hidden}
.hero:before{content:"";position:absolute;width:44vw;height:44vw;right:-18vw;top:-16vw;border-radius:50%;background:var(--lime);opacity:.18;filter:blur(3px)}
.eyebrow,.tag,.section-no{font-family:"DM Sans",sans-serif;font-size:11px;font-weight:700;letter-spacing:.17em;text-transform:uppercase}
.eyebrow{display:flex;align-items:center;gap:12px;margin:0 0 28px;color:var(--muted)}
.eyebrow:before{content:"";width:36px;height:2px;background:var(--orange)}
h1{font-size:clamp(46px,6.3vw,94px);line-height:1.08;letter-spacing:-.065em;margin:0;max-width:850px}
h1 em{font-style:normal;color:var(--orange)}
.hero-lead{max-width:640px;margin:30px 0 38px;font-size:clamp(17px,1.5vw,21px);color:#405a52}
.hero-actions{display:flex;flex-wrap:wrap;gap:12px}
.button{display:inline-flex;align-items:center;justify-content:center;gap:24px;min-height:52px;padding:0 22px;border:1px solid var(--ink);font-weight:700;font-size:14px;transition:.2s}
.button.primary{background:var(--ink);color:var(--white)}
.button.primary:hover{background:#174236;transform:translateY(-2px)}
.button.ghost:hover{background:var(--white)}
.hero-visual{position:relative;aspect-ratio:1;max-width:560px;width:100%;justify-self:center}
.orbit{position:absolute;border:1px solid rgba(16,43,36,.24);border-radius:50%;inset:12%}
.orbit-two{inset:27%;border-style:dashed;animation:spin 24s linear infinite}
.core{position:absolute;inset:36%;border-radius:50%;display:grid;place-content:center;text-align:center;background:var(--ink);color:var(--lime);box-shadow:0 22px 80px rgba(16,43,36,.22)}
.core span{font-family:"DM Sans";font-weight:700;font-size:clamp(34px,4.3vw,64px);line-height:1}
.core small{font-size:10px;color:var(--white);margin-top:8px;letter-spacing:.15em}
.node{position:absolute;width:80px;height:80px;border-radius:50%;display:grid;place-items:center;background:var(--white);border:1px solid var(--line);font-weight:700;font-size:14px;box-shadow:0 12px 40px rgba(16,43,36,.08)}
.node-a{top:5%;left:43%;background:var(--lime)}.node-b{bottom:16%;left:4%;background:var(--orange);color:var(--white)}.node-c{bottom:8%;right:10%}
.scroll-cue{position:absolute;bottom:28px;left:max(24px,8vw);font-size:11px;letter-spacing:.12em;color:var(--muted)}
.scroll-cue span{display:inline-block;margin-left:10px;animation:bounce 1.6s ease-in-out infinite}
.statement,.directions,.entry,.contact{padding:110px max(24px,8vw)}
.statement{background:var(--white);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.section-no{color:var(--orange);margin:0 0 42px}
.statement-grid{display:grid;grid-template-columns:1.35fr .65fr;gap:8vw;align-items:start}
.statement h2,.section-heading h2,.entry h2{font-size:clamp(34px,4.2vw,62px);line-height:1.2;letter-spacing:-.045em;margin:0}
.statement-copy{font-size:18px;color:#3f5951}
.statement-copy p{margin-top:0}
.note{font-size:13px;padding:15px 0 0;border-top:1px solid var(--line);color:var(--muted)}
.directions{display:flex;flex-direction:column;gap:18px}
.section-heading{display:grid;grid-template-columns:1fr 360px;gap:40px;align-items:end;margin-bottom:52px}
.section-heading .section-no{margin-bottom:14px}
.section-heading>p{margin:0;color:var(--muted)}
.direction-card{min-height:490px;display:grid;grid-template-columns:90px 1.1fr .9fr;gap:4vw;padding:52px;border:1px solid var(--line);background:var(--white);position:relative;overflow:hidden}
.card-index{font-family:"DM Sans";color:var(--muted);font-size:13px}
.tag{color:var(--orange);margin:0 0 15px}
.card-copy h3{font-size:clamp(32px,4vw,56px);line-height:1.1;margin:0 0 22px;letter-spacing:-.04em}
.card-copy>p:not(.tag):not(.card-disclaimer){font-size:18px;max-width:620px;color:#405a52}
.card-copy ul{list-style:none;padding:0;margin:28px 0;font-size:14px;font-weight:600}
.card-copy li{padding:9px 0;border-bottom:1px solid var(--line)}
.card-copy li:before{content:"↗";color:var(--orange);margin-right:12px}
.card-disclaimer{font-size:12px;color:var(--muted);max-width:610px}
.card-art{min-height:320px;align-self:center;position:relative}
.art-product{display:flex;align-items:end;justify-content:center;gap:8px;transform:perspective(800px) rotateY(-10deg)}
.art-product span{display:block;width:25%;height:65%;background:var(--sand);border:1px solid rgba(16,43,36,.18);box-shadow:12px 18px 28px rgba(16,43,36,.1)}
.art-product span:nth-child(2){height:83%;background:var(--lime)}.art-product span:nth-child(3){height:54%;background:var(--orange)}
.direction-card.ai{background:var(--ink);color:var(--white)}
.ai .card-copy>p:not(.tag),.ai .card-index{color:#b9c7c2}.ai .card-copy li{border-color:rgba(255,255,255,.16)}
.art-ai{display:grid;place-items:center}.pulse{width:42%;aspect-ratio:1;border:2px solid var(--lime);border-radius:50%;box-shadow:0 0 0 28px rgba(200,228,91,.08),0 0 0 58px rgba(200,228,91,.04);animation:pulse 3s ease-in-out infinite}.grid{position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.08) 1px,transparent 1px);background-size:28px 28px;mask-image:radial-gradient(circle,#000 20%,transparent 70%)}
.art-insight{display:flex;align-items:center;justify-content:center;gap:20px}.art-insight span{width:100px;height:100px;display:grid;place-items:center;border:1px solid var(--ink);border-radius:50%;font-family:"DM Sans";font-size:25px;font-weight:700}.art-insight i{width:80px;height:1px;background:var(--orange);position:relative}.art-insight i:after{content:"";position:absolute;right:0;top:-4px;width:8px;height:8px;border-top:1px solid var(--orange);border-right:1px solid var(--orange);transform:rotate(45deg)}
.status{display:inline-flex;align-items:center;min-height:28px;padding:0 10px;border-radius:20px;font-size:11px;font-weight:700;white-space:nowrap}.planning{background:#f0e9d8;color:#785b27}.ai .planning{background:rgba(200,228,91,.14);color:var(--lime)}.online{background:#deefce;color:#315c1e}.locked{background:#e8e8e5;color:#646963}
.approach{padding:110px max(24px,8vw);background:var(--ink);color:var(--white)}
.section-heading.light>p{color:#b5c4bf}.section-heading.light .section-no{color:var(--lime)}
.process{display:grid;grid-template-columns:repeat(4,1fr);margin-top:70px;border-top:1px solid rgba(255,255,255,.18)}
.process-step{padding:36px 28px 10px 0;border-right:1px solid rgba(255,255,255,.18);min-height:240px}.process-step:not(:first-child){padding-left:28px}.process-step:last-child{border:0}.process-step strong{font-family:"DM Sans";font-size:12px;color:var(--lime)}.process-step h3{font-size:22px;margin:44px 0 12px}.process-step p{font-size:14px;color:#b5c4bf;margin:0}
.entry-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:8vw}.entry-intro p{color:var(--muted);max-width:440px;margin-top:24px}.entry-list{border-top:1px solid var(--line)}
.entry-item{min-height:104px;padding:24px 0;display:flex;align-items:center;justify-content:space-between;gap:20px;border-bottom:1px solid var(--line)}.entry-item>div{display:grid;grid-template-columns:14px 1fr;column-gap:14px;align-items:center}.entry-item h3{font-size:17px;margin:0}.entry-item p{grid-column:2;margin:3px 0 0;color:var(--muted);font-size:12px}.dot{width:8px;height:8px;border:1px solid var(--muted);border-radius:50%}.dot.active{background:var(--orange);border-color:var(--orange);box-shadow:0 0 0 5px rgba(237,120,86,.13)}.disabled{opacity:.8}
.security-note{display:flex;gap:12px;align-items:flex-start;margin-top:32px;padding:16px;background:var(--white);border:1px solid var(--line);font-size:12px;color:var(--muted)}.security-note span{color:var(--orange);font-size:18px;line-height:1.2}.security-note p{margin:0}.security-note strong{color:var(--ink)}
.contact{background:var(--white);border-top:1px solid var(--line)}
.contact-head{display:grid;grid-template-columns:1.25fr .75fr;column-gap:8vw;align-items:end}.contact-head .section-no{grid-column:1/-1}.contact-head h2{font-size:clamp(34px,4.2vw,62px);line-height:1.2;letter-spacing:-.045em;margin:0}.contact-head>p:last-child{margin:0;color:var(--muted)}
.channel-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:60px}.channel-card{min-height:390px;padding:30px;display:flex;flex-direction:column;border:1px solid var(--line);background:var(--paper);transition:transform .25s,box-shadow .25s}.channel-card:hover,.channel-card:focus-visible{transform:translateY(-6px);box-shadow:0 20px 50px rgba(16,43,36,.12)}.channel-card.dark{background:var(--ink);color:var(--white)}.channel-card.company{background:#eaf1e4}.channel-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:60px}.channel-icon{width:44px;height:44px;border:1px solid currentColor;border-radius:50%;display:grid;place-items:center;font-family:"DM Sans";font-size:20px;font-weight:700}.channel-arrow{font-size:25px}.channel-card h3{font-size:25px;line-height:1.25;margin:0 0 16px;letter-spacing:-.025em}.channel-card>p:not(.tag){font-size:14px;color:var(--muted);margin:0}.channel-card.dark>p:not(.tag){color:#b5c4bf}.channel-cta{margin-top:auto;padding-top:28px;font-size:13px;font-weight:700;border-top:1px solid var(--line)}.dark .channel-cta{border-color:rgba(255,255,255,.18);color:var(--lime)}.contact-footnote{font-size:12px;color:var(--muted);margin:24px 0 0;max-width:900px}
footer{padding:42px max(24px,8vw);display:grid;grid-template-columns:1fr auto 1fr;align-items:center;border-top:1px solid var(--line);font-size:12px;color:var(--muted)}.footer-brand{color:var(--ink)}.copyright{text-align:right}
.reveal{opacity:0;transform:translateY(24px);transition:opacity .7s ease,transform .7s ease}.reveal.visible{opacity:1;transform:none}
@keyframes spin{to{transform:rotate(360deg)}}@keyframes pulse{50%{transform:scale(1.1);box-shadow:0 0 0 35px rgba(200,228,91,.08),0 0 0 70px rgba(200,228,91,.02)}}@keyframes bounce{50%{transform:translateY(5px)}}

@media(max-width:900px){
  .hero{grid-template-columns:1fr;padding-top:130px}.hero-visual{max-width:430px}.statement-grid,.section-heading,.entry-grid,.contact-head{grid-template-columns:1fr}.contact-head{gap:22px}.section-heading{align-items:start}.section-heading>p{max-width:520px}.direction-card{grid-template-columns:46px 1fr;padding:36px}.card-art{grid-column:2;min-height:230px}.process{grid-template-columns:repeat(2,1fr)}.process-step:nth-child(2){border-right:0}.process-step:nth-child(3),.process-step:nth-child(4){border-top:1px solid rgba(255,255,255,.18)}.channel-grid{grid-template-columns:1fr}.channel-card{min-height:320px}footer{grid-template-columns:1fr 1fr;gap:20px}footer>p:nth-child(2){display:none}
}
@media(max-width:640px){
  .topbar{height:66px}.menu-button{display:block}nav{position:absolute;top:66px;left:0;right:0;display:none;flex-direction:column;gap:0;background:var(--paper);border-bottom:1px solid var(--line);padding:12px 24px 20px}nav.open{display:flex}nav a{padding:12px 0}.hero{padding:110px 22px 70px;min-height:auto}.hero-lead{font-size:16px}.hero-actions{flex-direction:column;align-items:stretch}.hero-visual{margin-top:25px}.node{width:62px;height:62px;font-size:12px}.scroll-cue{display:none}.statement,.directions,.entry,.approach,.contact{padding:78px 22px}.statement-copy{font-size:16px}.section-no{margin-bottom:28px}.section-heading{margin-bottom:28px;gap:20px}.direction-card{grid-template-columns:1fr;padding:28px 22px;min-height:0}.card-index{margin-bottom:8px}.card-copy,.card-art{grid-column:1}.card-copy>p:not(.tag):not(.card-disclaimer){font-size:16px}.card-art{min-height:190px}.art-insight span{width:76px;height:76px}.art-insight i{width:45px}.process{grid-template-columns:1fr;margin-top:40px}.process-step,.process-step:not(:first-child){padding:26px 0;border-right:0;border-top:1px solid rgba(255,255,255,.18);min-height:0}.process-step h3{margin:22px 0 8px}.entry-item{align-items:flex-start}.entry-item>div{max-width:70%}.channel-grid{margin-top:38px}.channel-card{min-height:300px;padding:24px}.channel-top{margin-bottom:42px}footer{grid-template-columns:1fr}.copyright{text-align:left;margin:0}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.orbit-two,.pulse,.scroll-cue span{animation:none}.reveal{opacity:1;transform:none;transition:none}}
