/* Interactive homepage: extends the existing light Instrument Panel design. */
:root { --experience-blue:#71869c; --experience-muted:#536374; --experience-line:#e1e5ea; }
html { scroll-padding-top:96px; }
body { color-scheme:light; }
body::after { opacity:.025; }
[hidden] { display:none!important; }
button { font:inherit; }
button,a,summary { -webkit-tap-highlight-color:transparent; }
:focus-visible { outline:3px solid #657b92; outline-offset:5px; }
.skip-link { position:fixed; top:8px; left:12px; padding:12px 18px; background:white; color:#1e242b; z-index:100; transform:translateY(-160%); }
.skip-link:focus { transform:none; }
header .row { height:auto; min-height:76px; gap:24px; }
nav { gap:20px; align-items:center; }
nav a { font-size:14px; }
.motion-toggle,.menu-toggle { flex-shrink:0; border:1px solid #d7dde4; border-radius:7px; padding:9px 12px; font-size:12px; color:#495868; background:#fff; cursor:pointer; }
.motion-toggle:hover,.experience-button:hover { border-color:#97a6b7; background:#f9fafb; }
.menu-toggle { display:none; }
.hero { padding:70px 0 65px; }
.hero .grid { grid-template-columns:1fr 1.06fr; gap:40px; }
.hero h1 { font-size:clamp(56px,6.5vw,82px); line-height:.95; font-weight:500; margin:25px 0; }
.hero p.sub { max-width:440px; font-size:19px; }
.hero .mesh { opacity:.58; }
.hero .veil { background:linear-gradient(90deg,#f7f8fad9,#f7f8fa66 60%,#f7f8fa11); }
.hero .grad-text { background-image:linear-gradient(100deg,#4c5c6e,#72879d 50%,#73889e); }
.hero-founder { margin-top:25px; font-size:14px; color:#536374; }
.hero-founder a { text-underline-offset:4px; }
.hero-art { position:relative; width:100%; min-width:0; }
#hero-sculpture { display:block; width:100%; height:430px; }
.art-label,.art-caption { text-align:center; color:#56687b; font:12px/1.5 var(--mono); letter-spacing:.04em; }
.art-caption { margin-top:12px; }
.floating-label { position:absolute; display:flex; align-items:center; gap:10px; padding:12px 17px; font-size:14px; background:#fffffff0; color:#3f4c5a; border:1px solid #fff; border-radius:10px; box-shadow:0 10px 30px #5b6f8420; animation:experience-float 7s ease-in-out infinite alternate; }
.floating-label i { width:7px; height:7px; border-radius:50%; background:#7f92a6; }
.tag-strategy { top:21%; right:0; }
.tag-governance { top:50%; left:-10px; animation-delay:-3s; }
.tag-governance i { background:#4d5d6e; }
.tag-execution { bottom:14%; right:12px; animation-delay:-5s; }
.tag-execution i { background:#7b8ea3; }
.principle-strip { border-block:1px solid var(--experience-line); background:#fff; padding:26px 0; }
.principle-strip .wrap { display:flex; align-items:center; justify-content:space-between; gap:18px; font:500 19px var(--display); letter-spacing:-.02em; }
.principle-strip i { width:4px; height:4px; border-radius:50%; background:#adb9c6; flex-shrink:0; }
.section-heading { display:grid; grid-template-columns:1.2fr 1fr; align-items:end; gap:65px; margin-bottom:35px; }
.section-heading h2.h { margin-bottom:0; }
.section-heading>.lead { font-size:17px; max-width:390px; padding-bottom:2px; }
.soft-text { color:#647a91; }
.small-label { font:12px/1.5 var(--mono); text-transform:uppercase; letter-spacing:.06em; color:#596b7f; }
.secondary { font-size:13px; line-height:1.5; color:var(--experience-muted); }
.research-note { font-size:13px; line-height:1.8; color:#5a6a7b; margin-top:20px; max-width:940px; }
.research-note a { color:#5c7085; text-underline-offset:3px; }
.explorer { border:1px solid #e0e5ea; border-radius:16px; background:white; overflow:hidden; box-shadow:0 20px 70px -50px #667b92; }
.experience-tabs { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); background:#f7f8f9; border-bottom:1px solid #e0e5ea; }
.experience-tabs button { cursor:pointer; border:0; border-bottom:3px solid transparent; padding:21px 16px; text-align:left; color:#516275; background:transparent; font-size:15px; display:flex; gap:10px; align-items:center; }
.experience-tabs button span { font:12px var(--mono); color:#7d8ea0; }
.experience-tabs button[aria-selected=true] { background:#fff; color:#55677a; border-bottom-color:#7c8fa4; }
.experience-tabs button:hover { background:#f0f2f4; }
.opportunity-panel { display:grid; grid-template-columns:.9fr 1.1fr; min-width:0; }
.opportunity-panel:focus-visible { outline-offset:-5px; }
.opportunity-visual { --scenario-accent:#75899f; position:relative; isolation:isolate; padding:25px 28px 20px; background:radial-gradient(ellipse at 20% 40%,#cdd4dc52,transparent 65%),linear-gradient(135deg,#f7f8fa,#f2f4f6 60%,#f3f5f7); display:flex; flex-direction:column; justify-content:space-between; min-height:480px; overflow:hidden; }
.opportunity-visual[data-tone=efficiency] { --scenario-accent:#445362; background:linear-gradient(135deg,#edf0f3,#f3f4f6 60%,#f1f3f5); }
.opportunity-visual[data-tone=experience] { --scenario-accent:#667c94; background:linear-gradient(135deg,#f1f3f5,#f2f4f6 60%,#f1f3f6); }
.opportunity-visual[data-tone=resilience] { --scenario-accent:#71869d; background:linear-gradient(135deg,#f3f4f6,#f1f3f5 60%,#eef0f3); }
.visual-topline { display:flex; align-items:center; justify-content:space-between; font:12px var(--mono); color:#5a6d82; gap:12px; }
.visual-topline i { width:6px; height:6px; border-radius:50%; background:var(--scenario-accent); }
.opportunity-orbits { position:absolute; inset:10%; z-index:-1; }
.opportunity-orbits i { position:absolute; top:14%; left:4%; width:95%; height:60%; border:1px solid #aebac735; border-radius:50%; transform:rotate(-28deg); animation:experience-orbit 28s linear infinite; }
.opportunity-orbits i:nth-child(2) { transform:rotate(35deg); animation-delay:-9s; }
.opportunity-orbits i:nth-child(3) { transform:rotate(85deg); animation-delay:-18s; }
.opportunity-flow { width:100%; max-width:300px; margin:35px auto; }
.opportunity-flow>div { display:flex; align-items:center; gap:18px; padding:19px; background:#fffffff5; border:1px solid #fff; border-radius:10px; box-shadow:0 12px 28px #5e728712; }
.opportunity-flow span { font:12px var(--mono); color:#6c8198; }
.opportunity-flow strong { font-family:var(--display); font-weight:500; font-size:19px; }
.opportunity-flow .flow-highlight { background:var(--scenario-accent); color:#fff; border-color:var(--scenario-accent); transform:translateX(10px); }
.opportunity-flow .flow-highlight span { color:#edeff2; }
.opportunity-flow>i { display:block; text-align:center; color:var(--scenario-accent); font-style:normal; font-size:22px; padding:7px; animation:flow-down 2.5s ease-in-out infinite; }
.visual-caption { font-size:12px; line-height:1.6; color:#55677b; }
.opportunity-copy { padding:34px 36px; }
.opportunity-copy h3 { font-family:var(--display); font-size:30px; line-height:1.1; font-weight:500; letter-spacing:-.035em; margin:15px 0; }
.opportunity-copy>p:not(.small-label) { font-size:16px; line-height:1.7; color:#526274; }
.decision-list { margin:25px 0; }
.decision-list>div { border-top:1px solid #e4e8ed; padding:13px 0; }
.decision-list dt { font-size:13px; color:#5a6d81; font-weight:600; margin-bottom:5px; }
.decision-list dd { font-size:15px; line-height:1.6; color:#3d4a58; }
.workflow-section { background:#fff; border-block:1px solid var(--experience-line); }
.workflow-surface { border:1px solid #e1e5ea; border-radius:16px; overflow:hidden; background:#fbfbfc; }
.workflow-toolbar { padding:25px 28px; display:flex; align-items:center; justify-content:space-between; gap:20px; border-bottom:1px solid #e3e7ec; background:#fff; }
.workflow-toolbar .secondary { margin-top:6px; }
.segmented { display:flex; padding:4px; background:#f0f2f4; border-radius:9px; gap:4px; flex-shrink:0; }
.segmented button { border:0; background:transparent; padding:10px 13px; cursor:pointer; border-radius:6px; color:#4d5e70; font-size:14px; }
.segmented button[aria-pressed=true] { background:#fff; color:#57697d; box-shadow:0 2px 7px #4e5f7116; }
.workflow-track { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:20px; padding:42px 28px; position:relative; }
.workflow-track::before { content:''; position:absolute; left:9%; right:9%; top:50%; height:2px; background:linear-gradient(90deg,#cbd3db,#b5c0cc,#c0c9d3); }
.workflow-node { position:relative; display:flex; flex-direction:column; align-items:flex-start; gap:10px; min-width:0; padding:15px 13px; border:1px solid #e1e5ea; border-radius:10px; background:white; color:#404e5c; cursor:pointer; text-align:left; transition:transform .3s,border-color .3s,box-shadow .3s; }
.workflow-node.is-current { border-color:#94a3b4; box-shadow:0 8px 25px #73879d1a; transform:translateY(-5px); }
.node-num { font:12px var(--mono); color:#74869a; }
.node-symbol { width:39px; height:39px; display:grid; place-items:center; border-radius:10px; background:#f4f6f8; color:#778ba0; font-size:25px; }
.workflow-node[data-step="3"] .node-symbol { background:#f0f2f5; color:#72879d; }
.workflow-node strong { font-family:var(--display); font-size:17px; font-weight:500; line-height:1.2; }
.node-role { font-size:12px; color:#5a6d81; }
.workflow-detail { padding:28px; border-top:1px solid #e3e7ec; display:grid; grid-template-columns:1fr 220px; gap:45px; background:white; }
.workflow-detail h3 { font-family:var(--display); font-size:26px; line-height:1.2; letter-spacing:-.025em; font-weight:500; margin:12px 0; }
.workflow-detail-copy>p:last-child { font-size:16px; line-height:1.7; color:#526274; min-height:82px; }
.workflow-controls { align-self:center; }
.experience-button { border:1px solid #d3dae1; border-radius:8px; padding:12px 17px; background:#f8f9fa; color:#4d5d6f; cursor:pointer; font-size:14px; }
.workflow-controls .secondary { margin-top:12px; }
.human-ai { display:grid; grid-template-columns:1fr 2fr; gap:50px; margin-top:50px; }
.human-ai h3 { font:500 29px/1.1 var(--display); letter-spacing:-.03em; margin:16px 0; }
.human-ai p { font-size:15px; line-height:1.65; color:#526274; }
.human-roles { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:25px; }
.human-roles h4 { font-size:16px; line-height:1.4; font-weight:600; margin:14px 0 10px; }
.human-roles p { font-size:14px; }
.role-dot { display:block; width:10px; height:10px; border-radius:50%; }
.delegate-dot { background:#5e7288; }.collaborate-dot { background:#768aa0; }.human-dot { background:#72879d; }
.questions-section { background:linear-gradient(135deg,#f4f6f8,#f5f6f8); border-block:1px solid #e3e7ec; }
.questions-layout { display:grid; grid-template-columns:1fr 1.4fr; gap:70px; }
.questions-layout>.wrap { padding:0; }
.questions-layout .lead { font-size:17px; margin-bottom:26px; }
.questions details { border-bottom:1px solid #dae0e6; }
.questions details:first-child { border-top:1px solid #dae0e6; }
.questions summary { cursor:pointer; display:flex; align-items:center; gap:15px; list-style:none; font-size:18px; font-family:var(--display); padding:22px 0; line-height:1.35; }
.questions summary::-webkit-details-marker { display:none; }
.questions summary>span { color:#7b8ea3; font:12px var(--mono); }
.questions summary i { margin-left:auto; font-style:normal; color:#8496aa; flex-shrink:0; }
.questions details[open] summary i { transform:rotate(45deg); }
.question-answer { padding:0 15px 23px 32px; font-size:16px; line-height:1.7; color:#4d5d6f; }
.question-answer .question-prompt { margin-top:14px; color:#4b5b6c; font-size:14px; }
.proof .products { gap:24px; }
.proof .product { padding:0 0 26px; overflow:hidden; border:1px solid #e1e5ea; border-radius:14px; background:white; }
.proof .product .tag,.proof .product>p { margin-inline:25px; }
.proof .product .tag { font-size:13px; margin-top:24px; }
.proof .product>p { font-size:16px; line-height:1.7; }
.proof-art { padding:25px; position:relative; min-height:340px; display:flex; flex-direction:column; border-bottom:1px solid #e5e9ed; }
.proof-art .diagram-note { margin-top:auto; }
.air-art { background:linear-gradient(135deg,#f0f2f4,#f2f4f6 65%,#f0f2f4); }
.atre-art { background:linear-gradient(135deg,#f3f5f7,#f1f3f5 65%,#f4f5f7); }
.research-stack { max-width:270px; margin:25px auto 30px; }
.research-stack>div { position:relative; padding:14px 18px; border:1px solid #e3e7eb; border-radius:7px; background:#fff; font-family:var(--display); font-size:17px; box-shadow:0 10px 22px #5f738810; }
.research-stack>div:nth-child(2) { margin-top:-2px; transform:translateX(8px); }
.research-stack>div:nth-child(3) { margin-top:-2px; transform:translateX(16px); background:#687e96; color:#fff; }
.research-stack span { font:12px var(--mono); margin-right:16px; opacity:.7; }
.diagram-note { font-size:12px; color:#60758b; }
.validation-flow { display:flex; flex-direction:column; align-items:center; margin:23px 0; gap:5px; }
.validation-flow span { padding:8px 19px; background:#fffffff2; border:1px solid #e2e6ea; border-radius:6px; font-size:15px; }
.validation-flow span:nth-of-type(2) { color:#596c81; border-color:#c0c9d3; }
.validation-flow i { font-style:normal; color:#91a1b2; animation:flow-down 3s ease-in-out infinite; }
.reading-shelf { margin-top:35px; padding-top:27px; border-top:1px solid #e1e5ea; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:25px; }
.reading-shelf>p { grid-column:1/-1; }
.reading-shelf a { font-family:var(--display); font-size:19px; text-decoration:none; }
.reading-shelf a span { display:block; margin-top:8px; color:#5c6f84; font-family:var(--body); font-size:14px; }
.reading-shelf a:hover span { text-decoration:underline; text-underline-offset:4px; }
.founder-role { margin-bottom:28px; color:#5b6e83; font-size:16px; }
.development-note { padding:20px 0; border-block:1px solid #e1e5ea; margin:25px 0; }
.development-note p { font-size:14px!important; color:#536374; margin-top:9px; }
.close h2.h { max-width:680px; }
.legacy-anchor { display:block; scroll-margin-top:96px; }
.reveal { opacity:1; transform:none; }
.motion-paused *, .motion-paused *::before, .motion-paused *::after { animation-play-state:paused!important; }
@keyframes experience-float { from { transform:translateY(-5px); } to { transform:translateY(5px); } }
@keyframes experience-orbit { from { rotate:0deg; } to { rotate:360deg; } }
@keyframes flow-down { 0%,100% { transform:translateY(-2px); opacity:.5; } 50% { transform:translateY(3px); opacity:1; } }
@media(max-width:1100px) { header .row { gap:15px; } nav { gap:13px; } nav a { font-size:13px; } .brand .word { font-size:12px; } .motion-toggle { font-size:11px; padding:8px; } .workflow-track { gap:12px; padding:35px 20px; } .workflow-node { padding:13px 10px; } }
@media(max-width:960px) {
  header .row { flex-wrap:wrap; padding-block:15px; }.menu-toggle:not([hidden]) { display:block; margin-left:auto; }.motion-toggle { font-size:12px; }
  #site-nav { width:100%; display:flex; flex-wrap:wrap; gap:10px 22px; padding-top:10px; } #site-nav a { padding:8px 0; font-size:15px; }
  .js #site-nav:not(.is-open) { display:none; }
  .hero .grid { grid-template-columns:1fr 1fr; gap:20px; }.hero h1 { font-size:65px; }.hero p.sub { font-size:17px; } #hero-sculpture { height:360px; }.art-label { font-size:11px; }.tag-governance { left:0; }.floating-label { padding:10px 12px; font-size:12px; }
  .section-heading { gap:30px; }.experience-tabs button { font-size:14px; padding:18px 12px; gap:8px; }.experience-tabs button span { display:none; }
  .opportunity-copy { padding:27px; }.opportunity-visual { padding:23px; }.opportunity-copy h3 { font-size:28px; }
  .human-ai { grid-template-columns:1fr; gap:25px; }.human-ai>div:first-child { max-width:590px; }
  .questions-layout { gap:40px; }.workflow-track { gap:9px; padding-inline:15px; }.workflow-node strong { font-size:16px; }.node-role { font-size:11px; }.workflow-toolbar { padding:22px; }.workflow-detail { gap:25px; }
}
@media(max-width:700px) {
  section { padding:65px 0; }.wrap { padding-inline:22px; }.hero { padding-top:45px; }.hero .grid { grid-template-columns:1fr; gap:42px; }.hero h1 { font-size:clamp(58px,13vw,80px); }.hero p.sub { max-width:510px; }.hero-art { max-width:470px; margin:auto; }#hero-sculpture { height:365px; }.art-label { font-size:12px; }
  .principle-strip .wrap { justify-content:flex-start; flex-wrap:wrap; font-size:16px; gap:12px 18px; }.principle-strip i:last-of-type { display:none; }
  .section-heading { grid-template-columns:1fr; gap:20px; }.section-heading>.lead { max-width:none; }
  .experience-tabs { grid-template-columns:1fr 1fr; }.experience-tabs button { min-height:55px; font-size:14px; }.opportunity-panel { grid-template-columns:1fr; }.opportunity-visual { min-height:390px; }.opportunity-flow { margin:25px auto; }.opportunity-copy { padding:27px 24px; }
  .workflow-toolbar { flex-direction:column; align-items:flex-start; gap:18px; }.segmented { width:100%; }.segmented button { flex:1; }
  .workflow-track { grid-template-columns:1fr; gap:13px; padding:24px; }.workflow-track::before { top:40px; bottom:40px; left:55px; right:auto; width:2px; height:auto; }
  .workflow-node { display:grid; grid-template-columns:28px 40px 1fr; gap:6px 12px; align-items:center; padding:12px 15px; }.workflow-node .node-num { grid-row:1/3; }.workflow-node .node-symbol { grid-row:1/3; }.workflow-node strong { font-size:17px; }.workflow-node .node-role { grid-column:3; font-size:12px; }.workflow-node.is-current { transform:translateX(4px); }
  .workflow-detail { grid-template-columns:1fr; gap:18px; padding:24px; }.workflow-detail-copy>p:last-child { min-height:0; }.workflow-controls { display:flex; align-items:center; gap:15px; flex-wrap:wrap; }.workflow-controls .secondary { margin-top:0; }
  .human-roles { grid-template-columns:1fr; gap:25px; }.human-roles article { display:grid; grid-template-columns:15px 1fr; gap:8px 12px; }.human-roles .role-dot { margin-top:8px; }.human-roles h4 { margin:0; }.human-roles p { grid-column:2; font-size:15px; }
  .questions-layout { grid-template-columns:1fr; gap:28px; }.questions summary { font-size:18px; padding:20px 0; }.questions summary>span { font-size:11px; }.question-answer { padding-left:28px; }.reading-shelf { grid-template-columns:1fr; gap:22px; }
  .proof .products { grid-template-columns:1fr; }.proof .product .tag { line-height:1.6; }.about-row { gap:25px; }.hero-founder { font-size:14px; }
  .motion-toggle,.menu-toggle { min-height:44px; }.experience-button { min-height:44px; }
}
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } *,*::before,*::after { animation:none!important; transition:none!important; }.floating-label { transform:none; } }

/* Brand palette: warm paper, ink navy, brushed slate, restrained brass. */
:root {
  --paper:#F5F3EE; --surface:#FFFFFF; --ink:#172A3A; --ink2:#46535D; --ink3:#70797F;
  --rule:#DDDCD6; --rule2:#EAE9E4;
  --cyan:#647D8C; --cobalt:#25465B; --amber:#9A7B49; --coral:#9A7B49; --violet:#536674; --teal:#647D8C;
  --experience-blue:#25465B; --experience-muted:#52606A; --experience-line:#DDDCD6;
  --brand-navy:#172A3A; --brand-slate:#647D8C; --brand-brass:#9A7B49;
}
header { background:rgba(245,243,238,.9); }
.hero .veil { background:linear-gradient(90deg,#f5f3eef0,#f5f3ee70 60%,#f5f3ee10); }
.hero .grad-text { background:none; color:var(--brand-navy); animation:none; }
.grad-text { background-image:linear-gradient(90deg,#25465B,#647D8C); }
.progress { background:var(--brand-brass); }
.eyebrow::before { background:var(--brand-brass); }
.btn:hover { box-shadow:0 14px 34px -10px #172a3a50; }
.link,nav a { background-image:linear-gradient(90deg,#647D8C,#25465B); }
.floating-label i { background:var(--brand-navy); }
.tag-governance i { background:var(--brand-slate); }
.tag-execution i { background:var(--brand-brass); }
.experience-tabs { background:#F1F2F1; }
.experience-tabs button[aria-selected=true] { color:var(--brand-navy); border-bottom-color:var(--brand-brass); }
.opportunity-visual { --scenario-accent:#25465B; background:linear-gradient(135deg,#E5EBEE,#F2F1EC); }
.opportunity-visual[data-tone=efficiency] { --scenario-accent:#405966; background:linear-gradient(135deg,#E4EAEC,#F3F2ED); }
.opportunity-visual[data-tone=experience] { --scenario-accent:#725D3E; background:linear-gradient(135deg,#ECE5D8,#F4F2ED); }
.opportunity-visual[data-tone=resilience] { --scenario-accent:#344A59; background:linear-gradient(135deg,#E0E6EB,#F1F2EF); }
.workflow-track::before { background:linear-gradient(90deg,#A4B2BC,#647D8C,#B6A282); }
.workflow-node.is-current { border-color:var(--brand-slate); }
.node-symbol { background:#E9EEF0; color:#25465B; }
.workflow-node[data-step="3"] .node-symbol { background:#EEE7D9; color:#80663E; }
.delegate-dot { background:var(--brand-slate); }.collaborate-dot { background:var(--brand-navy); }.human-dot { background:var(--brand-brass); }
.questions-section { background:linear-gradient(135deg,#EEF0EE,#F5F3ED); }
.air-art { background:linear-gradient(135deg,#E4EAED,#F0F1EE); }
.atre-art { background:linear-gradient(135deg,#EAE5DB,#F3F2ED); }
.research-stack>div:nth-child(3) { background:#25465B; }
.close .veil { background:linear-gradient(90deg,#f5f3eee6,#f5f3ee8c 60%,#f5f3ee33); }

/* Structured enterprise typography with deliberate headline line breaks. */
.hero h1 { font-size:clamp(48px,5.7vw,72px); line-height:1.06; letter-spacing:-.035em; font-weight:500; text-wrap:initial; }
.hero h1>span { display:block; }
@media(min-width:701px) and (max-width:960px) { .hero h1 { font-size:clamp(40px,5.7vw,55px); } }
@media(max-width:700px) { .hero h1 { font-size:clamp(36px,9.4vw,60px); line-height:1.08; } }
