:root {
  --bg: #0b0b0d;
  --bg-soft: #111114;
  --card: #151519;
  --graphite: #2e2e32;
  --ivory: #f4f1ea;
  --muted: #a8a59f;
  --gold: #f4b860;
  --gold-2: #d98a35;
  --ember: #e0502d;
  --line: rgba(244,241,234,.12);
  --max: 1180px;
  --radius: 24px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background:
    radial-gradient(circle at 15% 5%, rgba(244,184,96,.07), transparent 28%),
    linear-gradient(180deg, #09090b 0%, var(--bg) 100%);
  color: var(--ivory);
  font-family: Inter, system-ui, sans-serif;
  line-height: 1.6;
  overflow-x: hidden;
}
body::selection { background: var(--gold); color: #111; }
a { color: inherit; text-decoration: none; }
img { max-width: 100%; display: block; }
.container { width: min(calc(100% - 40px), var(--max)); margin: 0 auto; }
.section-pad { padding: 110px 0; position: relative; }
.noise { position: fixed; inset: 0; opacity: .032; pointer-events: none; z-index: 50; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.45'/%3E%3C/svg%3E"); }

.site-header { position: fixed; inset: 0 0 auto 0; z-index: 40; backdrop-filter: blur(18px); background: linear-gradient(180deg, rgba(11,11,13,.9), rgba(11,11,13,.55)); border-bottom: 1px solid rgba(255,255,255,.05); }
.nav-wrap { height: 78px; display: flex; align-items: center; justify-content: space-between; }
.brand { display: inline-flex; align-items: center; gap: 10px; }
.brand-mark { width: 42px; height: 42px; }
.brand-copy { display: flex; align-items: baseline; gap: 6px; letter-spacing: .08em; }
.brand-copy strong { font-family: Montserrat, sans-serif; font-size: 14px; letter-spacing: .16em; }
.brand-copy span { font-size: 15px; color: #c7c3bb; }
.nav { display: flex; gap: 34px; align-items: center; font-size: 14px; color: #c9c6bf; }
.nav a { transition: .2s ease; }
.nav a:hover { color: #fff; }
.nav-cta { padding: 10px 16px; border: 1px solid rgba(244,184,96,.45); border-radius: 999px; color: var(--gold)!important; }
.menu-toggle { display: none; background: none; border: 0; padding: 10px; }
.menu-toggle span { display: block; width: 24px; height: 1px; background: #fff; margin: 6px; }

.hero { min-height: 900px; display: flex; align-items: center; padding-top: 150px; overflow: hidden; }
.hero-grid { display: grid; grid-template-columns: 1.05fr .95fr; gap: 60px; align-items: center; }
.eyebrow { display: inline-flex; align-items: center; gap: 10px; color: var(--gold); font-size: 11px; font-weight: 700; letter-spacing: .22em; text-transform: uppercase; }
.eyebrow::before { content: ''; width: 32px; height: 1px; background: var(--gold); }
h1,h2,h3 { font-family: Montserrat, Inter, sans-serif; margin: 0; line-height: 1.02; }
h1 { font-size: clamp(56px, 7vw, 96px); letter-spacing: -.055em; margin-top: 24px; }
h1 em { color: var(--gold); font-style: normal; font-weight: 500; }
.hero-lead { max-width: 650px; color: #b8b5ae; font-size: 19px; margin: 30px 0 0; }
.hero-actions { display: flex; gap: 14px; margin-top: 36px; flex-wrap: wrap; }
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 12px; min-height: 52px; padding: 0 22px; border-radius: 999px; font-weight: 700; font-size: 14px; transition: .25s ease; }
.btn-primary { background: var(--gold); color: #17120b; box-shadow: 0 10px 40px rgba(244,184,96,.18); }
.btn-primary:hover { transform: translateY(-2px); background: #ffc86f; }
.btn-ghost { border: 1px solid var(--line); color: #d8d5ce; }
.btn-ghost:hover { border-color: rgba(244,184,96,.5); color: var(--gold); }
.hero-proof { display: grid; grid-template-columns: repeat(3,1fr); gap: 0; margin-top: 58px; border-top: 1px solid var(--line); max-width: 720px; }
.hero-proof > div { padding: 18px 20px 0 0; }
.hero-proof span { font-size: 10px; color: var(--gold); letter-spacing: .18em; }
.hero-proof p { margin: 4px 0 0; color: #d0cdc6; font-size: 13px; }

.hero-visual { min-height: 610px; position: relative; display: grid; place-items: center; }
.hero-logo-wrap { width: min(72%, 440px); aspect-ratio: 1; display: grid; place-items: center; border-radius: 50%; background: radial-gradient(circle, rgba(244,184,96,.11), transparent 63%); position: relative; z-index: 2; }
.hero-logo { width: 70%; filter: drop-shadow(0 30px 50px rgba(0,0,0,.55)); }
.sun-orbit { position: absolute; border: 1px solid rgba(244,184,96,.18); border-radius: 50%; }
.orbit-a { width: 440px; height: 440px; animation: rotate 18s linear infinite; border-right-color: var(--gold); }
.orbit-b { width: 560px; height: 560px; animation: rotate 30s linear infinite reverse; border-top-color: rgba(224,80,45,.6); }
@keyframes rotate { to { transform: rotate(360deg); } }
.code-card { position: absolute; z-index: 3; background: rgba(20,20,23,.8); border: 1px solid var(--line); backdrop-filter: blur(14px); border-radius: 14px; padding: 14px 16px; min-width: 150px; box-shadow: 0 20px 50px rgba(0,0,0,.25); }
.code-card span { display:block; font-size: 9px; letter-spacing:.18em; text-transform:uppercase; color:var(--muted); }
.code-card b { display:block; margin:5px 0 2px; font-size:13px; }
.code-card i { color: var(--gold); font-size:11px; font-style:normal; }
.code-card-a { top: 17%; right: -2%; }
.code-card-b { bottom: 17%; left: -1%; }
.code-card-c { bottom: 5%; right: 10%; }
.hero-glow { position:absolute; filter:blur(80px); border-radius:50%; opacity:.25; }
.hero-glow-one { width:280px; height:280px; background:var(--gold); right:5%; top:10%; }
.hero-glow-two { width:200px; height:200px; background:var(--ember); left:-8%; bottom:5%; opacity:.12; }

.signal-bar { overflow:hidden; border-top:1px solid var(--line); border-bottom:1px solid var(--line); background:#0f0f12; }
.signal-track { min-width:max-content; display:flex; gap:28px; align-items:center; padding:16px 0; animation: marquee 32s linear infinite; color:#9e9b94; font-size:11px; letter-spacing:.18em; }
.signal-track i { color: var(--gold); font-style:normal; }
@keyframes marquee { from { transform:translateX(0);} to {transform:translateX(-50%);} }

.section-heading { display:grid; grid-template-columns:1fr .8fr; gap:80px; align-items:end; margin-bottom:54px; }
.section-heading h2, .aws h2, .stack h2, .cta h2 { font-size:clamp(42px,5vw,68px); letter-spacing:-.045em; margin-top:16px; }
.section-heading p, .aws-copy > p, .cta-copy > p { color:#a9a69f; font-size:17px; margin:0; }
.service-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.service-card { min-height:370px; padding:28px; border:1px solid var(--line); border-radius:20px; background:linear-gradient(180deg, rgba(255,255,255,.024), rgba(255,255,255,.01)); position:relative; overflow:hidden; transition:.25s ease; }
.service-card:hover { transform:translateY(-4px); border-color:rgba(244,184,96,.32); background:linear-gradient(180deg, rgba(244,184,96,.05), rgba(255,255,255,.01)); }
.service-card.featured { background:linear-gradient(150deg, rgba(244,184,96,.11), rgba(255,255,255,.02)); }
.service-card::after { content:''; position:absolute; width:160px; height:160px; border:1px solid rgba(244,184,96,.1); border-radius:50%; right:-80px; top:-80px; }
.service-number { color:#77736d; font-size:10px; letter-spacing:.18em; }
.service-icon { width:50px; height:50px; display:grid; place-items:center; border:1px solid rgba(244,184,96,.25); border-radius:14px; color:var(--gold); margin:28px 0 38px; font-size:22px; background:rgba(244,184,96,.035); }
.service-card h3 { font-size:24px; letter-spacing:-.025em; }
.service-card p { color:#aaa79f; font-size:14px; }
.service-card ul { list-style:none; margin:22px 0 0; padding:0; display:flex; gap:8px; flex-wrap:wrap; }
.service-card li { border:1px solid var(--line); border-radius:999px; padding:7px 10px; color:#bdb9b1; font-size:11px; }

.aws { background:linear-gradient(180deg, #0e0e11, #09090b); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.aws-grid { display:grid; grid-template-columns:1fr 1fr; gap:80px; align-items:center; }
.aws-copy > p { max-width:620px; margin-top:26px; }
.aws-points { margin-top:40px; display:grid; gap:22px; }
.aws-points > div { display:grid; grid-template-columns:200px 1fr; gap:20px; padding-top:18px; border-top:1px solid var(--line); }
.aws-points strong { font-size:14px; }
.aws-points span { color:#99968f; font-size:13px; }
.architecture { position:relative; min-height:580px; border:1px solid var(--line); border-radius:28px; padding:34px; background:radial-gradient(circle at 50% 30%, rgba(244,184,96,.07), transparent 45%), #0d0d10; display:flex; flex-direction:column; align-items:center; justify-content:center; overflow:hidden; }
.architecture::before { content:''; position:absolute; inset:0; background-image:linear-gradient(rgba(255,255,255,.025) 1px, transparent 1px),linear-gradient(90deg, rgba(255,255,255,.025) 1px, transparent 1px); background-size:34px 34px; mask-image:linear-gradient(to bottom, transparent, #000 15%, #000 85%, transparent); }
.arch-label { position:absolute; top:24px; left:26px; font-size:10px; color:#77736d; letter-spacing:.18em; }
.arch-node { min-width:120px; height:62px; display:grid; place-items:center; border:1px solid rgba(244,184,96,.25); border-radius:14px; background:#151519; color:#e2ded5; font-size:12px; box-shadow:inset 0 0 30px rgba(244,184,96,.025); z-index:1; }
.node-users { border-color:rgba(244,184,96,.5); }
.node-edge { min-width:180px; }
.arch-line { width:1px; height:44px; background:linear-gradient(var(--gold), rgba(244,184,96,.08)); }
.arch-row { display:flex; gap:14px; z-index:1; }
.arch-row.small .arch-node { min-width:104px; height:54px; }
.arch-foot { margin-top:34px; color:#6f6c66; letter-spacing:.18em; font-size:9px; z-index:1; }

.steps { display:grid; grid-template-columns:repeat(4,1fr); border-top:1px solid var(--line); }
.step { padding:32px 28px 0 0; min-height:210px; border-right:1px solid var(--line); }
.step:last-child { border-right:0; }
.step span { color:var(--gold); font-size:11px; }
.step h3 { margin-top:50px; font-size:23px; }
.step p { color:#97948d; font-size:13px; max-width:240px; }

.stack { padding-top:70px; }
.stack-grid { display:grid; grid-template-columns:.7fr 1.3fr; gap:80px; align-items:start; }
.tech-cloud { display:flex; flex-wrap:wrap; gap:10px; }
.tech-cloud span { padding:11px 14px; border:1px solid var(--line); border-radius:999px; color:#c7c3bb; font-size:12px; background:rgba(255,255,255,.015); }
.tech-cloud span:nth-child(3n+1) { border-color:rgba(244,184,96,.28); color:#e5c184; }

.cta { padding-top:60px; }
.cta-box { min-height:420px; border:1px solid rgba(244,184,96,.23); border-radius:32px; padding:58px; background:linear-gradient(135deg, rgba(244,184,96,.08), rgba(17,17,20,.96) 45%, #0c0c0e 100%); display:grid; grid-template-columns:1.25fr .75fr; gap:50px; align-items:end; overflow:hidden; position:relative; }
.cta-copy { position:relative; z-index:2; }
.cta-copy h2 { max-width:780px; }
.cta-copy > p { margin-top:24px; max-width:720px; }
.cta-actions { position:relative; z-index:2; display:flex; flex-direction:column; align-items:flex-start; gap:12px; }
.cta-note { color:#817e77; font-size:11px; }
.cta-sun { position:absolute; width:460px; height:460px; border-radius:50%; background:radial-gradient(circle at 35% 35%, #ffd68d, #e99f3f 47%, #6a3c18 71%, transparent 72%); right:-170px; top:-150px; opacity:.25; }

.footer { border-top:1px solid var(--line); padding:26px 0; color:#77736d; font-size:11px; }
.footer-grid { display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:20px; }
.footer-grid > span { text-align:right; }
.footer .brand-mark { width:34px; height:34px; }
.footer .brand-copy strong { color:#d5d1c9; font-size:11px; }
.footer .brand-copy span { font-size:12px; }

.reveal { opacity:0; transform:translateY(22px); transition:opacity .7s ease, transform .7s ease; }
.reveal.visible { opacity:1; transform:none; }
.delay-1 { transition-delay:.08s; } .delay-2 { transition-delay:.16s; } .delay-3 { transition-delay:.24s; }

@media (max-width: 980px) {
  .nav { position:fixed; top:78px; left:20px; right:20px; padding:20px; border:1px solid var(--line); border-radius:18px; background:#121215; display:none; flex-direction:column; align-items:stretch; gap:18px; }
  .nav.open { display:flex; }
  .menu-toggle { display:block; }
  .hero { min-height:auto; }
  .hero-grid, .aws-grid, .section-heading, .stack-grid, .cta-box { grid-template-columns:1fr; }
  .hero-visual { min-height:500px; }
  .service-grid { grid-template-columns:repeat(2,1fr); }
  .section-heading { gap:30px; }
  .steps { grid-template-columns:repeat(2,1fr); }
  .step:nth-child(2) { border-right:0; }
  .cta-box { align-items:start; }
  .footer-grid { grid-template-columns:1fr; text-align:left; }
  .footer-grid > span { text-align:left; }
}

@media (max-width: 640px) {
  .container { width:min(calc(100% - 24px), var(--max)); }
  .section-pad { padding:76px 0; }
  .hero { padding-top:120px; }
  h1 { font-size:50px; }
  .hero-proof { grid-template-columns:1fr; }
  .hero-proof > div { padding-top:14px; }
  .hero-visual { min-height:420px; }
  .orbit-a { width:320px; height:320px; } .orbit-b { width:390px; height:390px; }
  .code-card { transform:scale(.85); }
  .code-card-a { right:-8%; } .code-card-b { left:-8%; }
  .service-grid { grid-template-columns:1fr; }
  .aws-points > div { grid-template-columns:1fr; gap:6px; }
  .architecture { min-height:520px; padding:20px; }
  .arch-row { gap:8px; width:100%; justify-content:center; }
  .arch-node { min-width:88px; padding:0 8px; }
  .arch-row.small .arch-node { min-width:82px; }
  .steps { grid-template-columns:1fr; }
  .step { border-right:0; border-bottom:1px solid var(--line); padding-bottom:25px; }
  .cta-box { padding:34px 24px; min-height:500px; }
  .cta-box h2 { font-size:42px; }
}

/* --- Nichirin identity: every project has its own color --- */
.hero-manifesto { margin:26px 0 0; display:grid; grid-template-columns:34px 1fr; gap:14px; align-items:start; max-width:650px; }
.hero-manifesto > span { height:1px; background:var(--gold); margin-top:10px; box-shadow:0 0 18px rgba(244,184,96,.45); }
.hero-manifesto p { margin:0; color:#9f9b94; font-size:13px; line-height:1.7; }
.hero-manifesto strong { color:#e9e5dd; font-weight:600; }

.identity { position:relative; overflow:hidden; background:radial-gradient(circle at 75% 50%, rgba(244,184,96,.055), transparent 36%); border-bottom:1px solid var(--line); }
.identity::before { content:''; position:absolute; width:520px; height:520px; border:1px solid rgba(244,184,96,.07); border-radius:50%; right:-240px; top:50%; transform:translateY(-50%); }
.identity-grid { display:grid; grid-template-columns:.92fr 1.08fr; gap:90px; align-items:center; }
.identity h2 { font-size:clamp(48px,6vw,82px); line-height:.98; letter-spacing:-.055em; margin:18px 0 28px; }
.identity h2 em { color:var(--gold); font-style:normal; font-weight:500; }
.identity-lead { color:#d6d2ca !important; font-size:19px !important; }
.identity-copy > p { max-width:620px; color:#97948d; font-size:15px; line-height:1.8; }
.identity-quote { display:grid; grid-template-columns:2px 1fr; gap:18px; margin-top:38px; }
.quote-line { background:linear-gradient(var(--gold), transparent); }
.identity blockquote { margin:0; color:#a8a49d; font-size:16px; line-height:1.75; }
.identity blockquote strong { color:#f2eee6; font-size:20px; font-weight:600; }

.color-system { min-width:0; }
.color-stage { --active:#F4B860; --active-rgb:244,184,96; min-height:480px; border:1px solid rgba(var(--active-rgb),.28); border-radius:30px; position:relative; display:grid; place-items:center; overflow:hidden; background:radial-gradient(circle at 50% 42%, rgba(var(--active-rgb),.13), transparent 33%), linear-gradient(160deg, rgba(var(--active-rgb),.045), rgba(255,255,255,.01)); transition:border-color .45s ease, background .45s ease; }
.color-stage::before { content:''; position:absolute; width:280px; height:280px; border-radius:50%; background:var(--active); opacity:.10; filter:blur(65px); transition:background .45s ease; }
.color-orbit { position:absolute; width:330px; height:330px; border-radius:50%; border:1px solid rgba(var(--active-rgb),.26); border-right-color:var(--active); transition:border-color .45s ease; animation:rotate 22s linear infinite; }
.color-orbit::after { content:''; position:absolute; width:10px; height:10px; border-radius:50%; background:var(--active); top:34px; right:44px; box-shadow:0 0 25px var(--active); }
.color-core { width:210px; height:210px; border-radius:50%; display:grid; place-items:center; background:radial-gradient(circle, rgba(var(--active-rgb),.16), rgba(0,0,0,.05) 62%); position:relative; z-index:2; }
.color-core img { width:74%; filter:drop-shadow(0 20px 34px rgba(0,0,0,.55)); }
.color-stage-copy { position:absolute; left:28px; bottom:26px; z-index:3; }
.color-stage-copy span { display:block; color:var(--active); font-size:9px; letter-spacing:.22em; transition:color .3s ease; }
.color-stage-copy strong { display:block; margin-top:7px; font-family:'Montserrat',sans-serif; font-size:20px; }
.color-stage-copy p { margin:5px 0 0; color:#918e88; font-size:12px; max-width:360px; }
.color-options { display:grid; grid-template-columns:repeat(5,1fr); gap:8px; margin-top:12px; }
.color-option { appearance:none; border:1px solid var(--line); background:#101013; color:#8d8a84; border-radius:12px; padding:13px 8px; display:flex; align-items:center; justify-content:center; gap:7px; cursor:pointer; font:inherit; font-size:10px; transition:.25s ease; }
.color-option i { width:7px; height:7px; border-radius:50%; background:var(--dot); box-shadow:0 0 12px color-mix(in srgb, var(--dot) 55%, transparent); }
.color-option:hover, .color-option.active { color:#eeeae2; transform:translateY(-2px); border-color:rgba(255,255,255,.19); background:#16161a; }
.color-note { margin:14px 2px 0; color:#6f6c66; font-size:11px; }
.color-note strong { color:#aaa69f; font-weight:500; }

/* Each service carries its own accent: one client, one need, one solution */
.service-card { --service-accent:var(--gold); --service-rgb:244,184,96; }
.service-card:hover { border-color:rgba(var(--service-rgb),.42); background:linear-gradient(180deg, rgba(var(--service-rgb),.065), rgba(255,255,255,.01)); }
.service-card.featured { background:linear-gradient(150deg, rgba(var(--service-rgb),.11), rgba(255,255,255,.02)); }
.service-card::after { border-color:rgba(var(--service-rgb),.12); }
.service-icon { border-color:rgba(var(--service-rgb),.29); color:var(--service-accent); background:rgba(var(--service-rgb),.045); }
.service-card:hover .service-icon { box-shadow:0 0 30px rgba(var(--service-rgb),.10); }

@media (max-width:980px) {
  .identity-grid { grid-template-columns:1fr; gap:46px; }
  .color-stage { min-height:430px; }
}
@media (max-width:640px) {
  .identity h2 { font-size:50px; }
  .color-stage { min-height:390px; }
  .color-orbit { width:270px; height:270px; }
  .color-core { width:170px; height:170px; }
  .color-options { grid-template-columns:repeat(2,1fr); }
  .color-option:last-child { grid-column:1/-1; }
}


/* --- Scroll story: each project activates its own Nichirin Core --- */
.identity { overflow:hidden; background:radial-gradient(circle at 80% 35%, rgba(244,184,96,.06), transparent 34%); border-bottom:0; }
.identity::before { display:none; }
.identity-intro-grid { display:grid; grid-template-columns:.9fr 1.1fr; gap:100px; align-items:start; margin-top:20px; }
.identity-intro h2 { font-size:clamp(52px,6.2vw,86px); line-height:.96; letter-spacing:-.06em; }
.identity-intro h2 em { color:var(--gold); font-style:normal; font-weight:500; }
.identity-intro-grid > div > p { color:#9d9992; font-size:15px; line-height:1.85; max-width:650px; }
.identity-intro .identity-lead { color:#dedad2 !important; font-size:19px !important; margin-top:4px; }

.project-colors { position:relative; padding:50px 0 130px; border-top:1px solid var(--line); border-bottom:1px solid var(--line); background:linear-gradient(180deg,#0a0a0c,#0d0d10 42%,#09090b); overflow:clip; }
.project-colors::before { content:''; position:absolute; inset:0; pointer-events:none; background-image:linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px); background-size:46px 46px; mask-image:linear-gradient(to bottom,transparent 0,#000 10%,#000 88%,transparent); }
.project-colors-heading { padding:70px 0 40px; position:relative; z-index:2; }
.project-colors-heading h2 { font-size:clamp(48px,6vw,82px); letter-spacing:-.055em; margin:18px 0 24px; max-width:900px; }
.project-colors-heading h2 em { color:var(--gold); font-style:normal; font-weight:500; }
.project-colors-heading > p { max-width:760px; color:#a6a29a; font-size:17px; }

.forge-layout { display:grid; grid-template-columns:minmax(390px,.88fr) minmax(0,1.12fr); gap:90px; align-items:start; position:relative; z-index:2; }
.core-column { min-height:100%; }
.core-sticky {
  --core-color:#FF7A45;
  --core-rgb:255,122,69;
  --core-charge:0%;
  --core-activation:0;
  position:sticky; top:108px; min-height:calc(100vh - 132px);
  border:1px solid rgba(var(--core-rgb),.20);
  border-radius:30px;
  background:radial-gradient(circle at 50% 38%,rgba(var(--core-rgb),.12),transparent 28%),linear-gradient(165deg,rgba(var(--core-rgb),.045),rgba(255,255,255,.012) 45%,#0b0b0e 100%);
  overflow:hidden; display:flex; flex-direction:column; align-items:center; justify-content:center;
  transition:border-color .55s ease,background .55s ease, box-shadow .55s ease;
  box-shadow:0 28px 80px rgba(0,0,0,.24);
}
.core-grid-lines { position:absolute; inset:0; background-image:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px); background-size:38px 38px; mask-image:radial-gradient(circle at center,#000,transparent 72%); opacity:.8; }
.core-halo { position:absolute; width:420px; height:420px; border-radius:50%; border:1px solid rgba(var(--core-rgb),.24); box-shadow:inset 0 0 90px rgba(var(--core-rgb),.045),0 0 80px rgba(var(--core-rgb),.04); transition:border-color .5s ease, box-shadow .5s ease; }
.core-halo::before,.core-halo::after { content:''; position:absolute; border-radius:50%; inset:34px; border:1px dashed rgba(var(--core-rgb),.13); animation:rotate 28s linear infinite; }
.core-halo::after { inset:92px; border-style:solid; border-right-color:var(--core-color); animation-duration:17s; animation-direction:reverse; }
.core-meta { position:absolute; left:25px; right:25px; z-index:4; display:flex; justify-content:space-between; align-items:center; gap:14px; }
.core-meta-top { top:22px; }
.core-meta span,.core-readout span { font-size:9px; letter-spacing:.22em; color:#6f6c67; }
.core-meta strong { color:var(--core-color); font-size:10px; letter-spacing:.18em; transition:color .45s ease; }

.core-visual { position:relative; width:min(84%, 430px); aspect-ratio:1/1; z-index:3; filter:drop-shadow(0 26px 24px rgba(0,0,0,.55)); }
.core-shell { position:absolute; inset:14%; display:grid; place-items:center; }
.ring { position:absolute; border-radius:50%; border:1px solid rgba(var(--core-rgb), calc(.10 + .16 * var(--core-activation))); transition:border-color .45s ease, transform .45s ease, box-shadow .45s ease; }
.ring-a { inset:0; box-shadow:0 0 24px rgba(var(--core-rgb), calc(.08 + .22 * var(--core-activation))); }
.ring-b { inset:11%; border-style:dashed; animation:rotate 16s linear infinite; }
.ring-c { inset:24%; border-width:2px; box-shadow:inset 0 0 34px rgba(var(--core-rgb), calc(.05 + .18 * var(--core-activation))); animation:rotate 30s linear infinite reverse; }

.core-chip {
  position:relative; width:46%; aspect-ratio:1/1; border-radius:26px;
  border:1px solid rgba(255,255,255,.08); overflow:hidden;
  display:grid; place-items:center;
  box-shadow:0 30px 65px rgba(0,0,0,.45), inset 0 1px 0 rgba(255,255,255,.06);
}
.chip-metal, .chip-fill, .chip-grid { position:absolute; inset:0; }
.chip-metal { background:linear-gradient(145deg,#5a5e65 0%,#bcc1c7 18%,#f5f6f7 32%,#8c9096 48%,#d4d7da 67%,#41444a 100%); }
.chip-fill {
  background:radial-gradient(circle at 50% 42%, rgba(var(--core-rgb),.95), rgba(var(--core-rgb),.55) 38%, rgba(var(--core-rgb),.18) 72%, transparent 100%),
             linear-gradient(180deg, rgba(var(--core-rgb),.92), rgba(var(--core-rgb),.22));
  clip-path:inset(calc(100% - var(--core-charge)) 0 0 0);
  transition:clip-path .08s linear;
  mix-blend-mode:screen;
}
.chip-grid {
  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:18px 18px;
  mask-image:radial-gradient(circle at center,#000 50%,transparent 85%);
  opacity:.35;
}
.core-chip::before,
.core-chip::after {
  content:''; position:absolute; width:18%; height:6px; background:linear-gradient(90deg, transparent, rgba(var(--core-rgb), .7), transparent);
  left:50%; transform:translateX(-50%); opacity:calc(.15 + (.85 * var(--core-activation))); transition:opacity .35s ease;
}
.core-chip::before { top:-18px; }
.core-chip::after { bottom:-18px; }
.core-logo { position:relative; width:43%; z-index:2; opacity:.98; filter:drop-shadow(0 0 18px rgba(255,255,255,.12)); }

.trace {
  position:absolute; border-radius:999px; background:linear-gradient(90deg, rgba(255,255,255,.08), rgba(var(--core-rgb), calc(.28 + .44 * var(--core-activation))), rgba(255,255,255,.06));
  box-shadow:0 0 18px rgba(var(--core-rgb), calc(.06 + .18 * var(--core-activation)));
  opacity:calc(.26 + (.74 * var(--core-activation)));
  transition:opacity .35s ease, box-shadow .35s ease, background .35s ease;
}
.trace-1 { width:30%; height:2px; top:22%; left:6%; }
.trace-2 { width:2px; height:24%; top:8%; left:27%; }
.trace-3 { width:28%; height:2px; top:31%; right:4%; }
.trace-4 { width:2px; height:22%; bottom:10%; right:29%; }
.trace-5 { width:34%; height:2px; bottom:23%; left:4%; }
.trace-6 { width:2px; height:30%; bottom:6%; left:31%; }

.module-orbit { position:absolute; inset:0; pointer-events:none; }
.module-pill {
  position:absolute; min-width:96px; padding:9px 12px; border-radius:999px;
  border:1px solid rgba(255,255,255,.09); background:rgba(10,10,12,.82); color:#d6d1c9;
  font-size:11px; text-align:center; backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px);
  box-shadow:0 12px 30px rgba(0,0,0,.25); opacity:.55; transform:scale(.94);
  transition:border-color .35s ease, color .35s ease, box-shadow .35s ease, opacity .35s ease, transform .35s ease, background .35s ease;
}
.module-pill.active {
  opacity:1; transform:scale(1);
  color:#fff8ef; background:rgba(var(--core-rgb),.12);
  border-color:rgba(var(--core-rgb),.4);
  box-shadow:0 0 24px rgba(var(--core-rgb),.2), 0 12px 28px rgba(0,0,0,.28);
}
.module-pill:nth-child(1) { top:6%; left:12%; }
.module-pill:nth-child(2) { top:18%; right:3%; }
.module-pill:nth-child(3) { top:48%; right:-2%; }
.module-pill:nth-child(4) { bottom:15%; right:10%; }
.module-pill:nth-child(5) { bottom:7%; left:8%; }

.core-readout { position:absolute; z-index:4; left:25px; right:25px; bottom:54px; display:flex; align-items:end; justify-content:space-between; padding-top:16px; border-top:1px solid rgba(255,255,255,.08); }
.core-readout strong { display:block; margin-top:4px; font:600 18px/1.1 Montserrat,sans-serif; }
.core-swatch { width:38px; height:38px; border-radius:50%; background:var(--core-color); box-shadow:0 0 28px rgba(var(--core-rgb),.45); transition:background .45s ease,box-shadow .45s ease; }
.core-progress { position:absolute; left:25px; right:25px; bottom:31px; height:2px; background:#222226; overflow:hidden; z-index:4; }
.core-progress span { display:block; height:100%; width:0%; background:var(--core-color); box-shadow:0 0 14px var(--core-color); transition:background .45s ease; }
.core-caption { position:absolute; left:25px; right:25px; bottom:8px; margin:0; font-size:9px; color:#5f5c57; letter-spacing:.04em; z-index:4; }

.stack-stories { position:relative; }
.stack-story { --story-color:#F4B860; min-height:82vh; padding:15vh 0 12vh; display:flex; flex-direction:column; justify-content:center; border-bottom:1px solid rgba(255,255,255,.075); opacity:.34; transform:scale(.985); transition:opacity .4s ease,transform .4s ease; }
.stack-story:last-child { border-bottom:0; }
.stack-story.active { opacity:1; transform:none; }
.story-index { font-size:10px; color:#67645f; letter-spacing:.2em; margin-bottom:16px; }
.story-kicker { color:var(--story-color); font-size:10px; letter-spacing:.2em; font-weight:700; transition:color .45s ease; }
.stack-story h3 { font-size:clamp(36px,4.2vw,58px); letter-spacing:-.045em; max-width:700px; margin:18px 0 24px; }
.stack-story > p { color:#aaa69e; font-size:17px; max-width:690px; line-height:1.8; }
.stack-pills { display:flex; flex-wrap:wrap; gap:9px; margin-top:28px; max-width:720px; }
.stack-pills span { padding:9px 12px; border:1px solid rgba(255,255,255,.105); border-radius:999px; background:rgba(255,255,255,.02); color:#d0ccc4; font-size:11px; transition:border-color .3s ease,background .3s ease; }
.stack-story.active .stack-pills span { border-color:color-mix(in srgb,var(--story-color) 35%,rgba(255,255,255,.1)); background:color-mix(in srgb,var(--story-color) 5%,transparent); }
.stack-decision { display:grid; grid-template-columns:150px 1fr; gap:28px; margin-top:44px; padding-top:20px; border-top:1px solid rgba(255,255,255,.08); max-width:720px; }
.stack-decision span { color:var(--story-color); font-size:9px; letter-spacing:.18em; transition:color .45s ease; }
.stack-decision p { margin:0; color:#8d8a84; font-size:13px; line-height:1.7; }

.forge-manifesto { margin-top:55px; padding:26px 0 0; border-top:1px solid var(--line); display:grid; grid-template-columns:.55fr 1.45fr; gap:70px; position:relative; z-index:2; }
.forge-manifesto > span { color:var(--gold); font-size:10px; font-weight:700; letter-spacing:.2em; }
.forge-manifesto p { margin:0; color:#8e8a84; font-size:14px; max-width:760px; }
.forge-manifesto strong { color:#e7e3da; font-weight:600; }

@media (max-width:980px) {
  .identity-intro-grid { grid-template-columns:1fr; gap:32px; }
  .forge-layout { grid-template-columns:330px minmax(0,1fr); gap:42px; }
  .core-sticky { top:96px; min-height:calc(100vh - 116px); }
  .core-halo { width:300px; height:300px; }
  .core-visual { width:min(92%, 340px); }
  .module-pill { min-width:82px; font-size:10px; }
  .stack-decision { grid-template-columns:1fr; gap:8px; }
}

@media (max-width:760px) {
  .project-colors { padding-bottom:76px; overflow:visible; }
  .project-colors::before { position:absolute; }
  .project-colors-heading { padding-top:40px; padding-bottom:20px; }
  .project-colors-heading h2 { font-size:clamp(42px,12vw,60px); }
  .project-colors-heading > p { font-size:15px; line-height:1.75; }

  .forge-layout { display:block; position:relative; }
  .core-column {
    position:sticky; top:72px; z-index:30; height:234px; min-height:0; margin:4px 0 24px; pointer-events:none;
  }
  .core-sticky {
    position:relative; inset:auto; top:auto; min-height:0; height:234px; width:100%; border-radius:20px; overflow:hidden; display:block;
    backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px);
    background:
      radial-gradient(circle at 72% 46%,rgba(var(--core-rgb),.18),transparent 24%),
      linear-gradient(165deg,rgba(18,18,22,.94),rgba(10,10,13,.97));
    box-shadow:0 20px 55px rgba(0,0,0,.42), inset 0 1px 0 rgba(255,255,255,.035);
  }
  .core-grid-lines { opacity:.45; background-size:30px 30px; }
  .core-halo { width:170px; height:170px; right:14px; left:auto; top:30px; }
  .core-visual { position:absolute; right:6px; top:16px; width:170px; aspect-ratio:1/1; }
  .core-shell { inset:15%; }
  .core-chip { border-radius:22px; }
  .trace-1 { width:26%; top:18%; left:8%; }
  .trace-2 { left:24%; height:20%; }
  .trace-3 { width:22%; top:31%; right:10%; }
  .trace-4 { height:19%; right:28%; }
  .trace-5 { width:28%; bottom:21%; left:8%; }
  .trace-6 { left:29%; height:24%; }
  .module-pill {
    min-width:auto; font-size:9px; padding:6px 9px;
  }
  .module-pill:nth-child(1) { top:0; left:4%; }
  .module-pill:nth-child(2) { top:8%; right:8%; }
  .module-pill:nth-child(3) { top:49%; right:-4%; }
  .module-pill:nth-child(4) { bottom:9%; right:10%; }
  .module-pill:nth-child(5) { bottom:2%; left:2%; }

  .core-meta { left:16px; right:180px; display:block; }
  .core-meta-top { top:17px; }
  .core-meta span { display:block; margin-bottom:7px; }
  .core-meta strong { display:block; font-size:9px; line-height:1.35; }
  .core-readout { left:16px; right:180px; bottom:48px; padding-top:13px; align-items:center; }
  .core-readout strong { font-size:17px; max-width:170px; }
  .core-swatch { width:28px; height:28px; flex:0 0 28px; }
  .core-progress { left:16px; right:180px; bottom:27px; }
  .core-caption { display:none; }

  .stack-stories { position:relative; z-index:2; background:transparent; }
  .stack-story { min-height:78svh; padding:72px 2px 92px; opacity:.38; transform:none; justify-content:flex-start; scroll-margin-top:310px; }
  .stack-story.active { opacity:1; }
  .stack-story::before { content:''; display:block; width:42px; height:2px; margin-bottom:22px; background:var(--story-color); box-shadow:0 0 18px color-mix(in srgb,var(--story-color) 45%,transparent); transition:background .4s ease,box-shadow .4s ease; }
  .stack-story h3 { font-size:clamp(34px,9vw,44px); line-height:1.03; margin-top:15px; }
  .stack-story > p { font-size:15px; line-height:1.72; }
  .stack-pills { margin-top:22px; gap:7px; }
  .stack-pills span { padding:8px 10px; font-size:10px; }
  .stack-decision { margin-top:30px; padding-top:16px; grid-template-columns:1fr; gap:8px; }
  .forge-manifesto { grid-template-columns:1fr; gap:12px; margin-top:28px; }
}

@media (max-width:430px) {
  .core-column { top:66px; height:214px; }
  .core-sticky { height:214px; border-radius:18px; }
  .core-visual { width:154px; right:2px; top:20px; }
  .core-halo { width:146px; height:146px; right:8px; top:36px; }
  .core-meta,.core-readout { right:160px; }
  .core-readout strong { font-size:15px; }
  .core-progress { right:160px; }
  .stack-story { min-height:76svh; padding-top:62px; }
}