:root{
  --bg:#F7F5F1;
  --surface:#ffffff;
  --surface-2:#F1F5F4;
  --ink:#132238;
  --ink-2:#24384D;
  --text:#24313D;
  --muted:#62707c;
  --line:#d5dcdf;
  --line-strong:#b9c5ca;
  --accent:#006E73;
  --accent-deep:#00575B;
  --accent-soft:#D9F0EE;
  --warm:#FF6B4A;
  --warm-soft:#FFF0EC;
  --focus:#8a5d00;
  --good:#2f6b4f;
  --shadow:0 18px 50px rgba(19,34,56,.07);
  --max:1180px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:
    radial-gradient(circle at 85% 2%, rgba(0,110,115,.09), transparent 30rem),
    radial-gradient(circle at 10% 20%, rgba(255,107,74,.055), transparent 24rem),
    var(--bg);
  color:var(--text);
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  line-height:1.65;
  text-rendering:optimizeLegibility;
}
a{color:inherit}
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{
  outline:3px solid var(--focus);
  outline-offset:3px;
}
.staging{
  background:var(--ink);
  color:#fff;
  text-align:center;
  padding:.55rem 1rem;
  font-size:.78rem;
  font-weight:800;
  letter-spacing:.09em;
}
header{
  position:sticky;
  top:0;
  z-index:20;
  background:rgba(244,243,239,.94);
  border-bottom:1px solid rgba(185,197,202,.85);
  backdrop-filter:blur(14px);
}
.nav{
  max-width:var(--max);
  margin:auto;
  display:flex;
  align-items:center;
  gap:1.25rem;
  padding:1rem 1.25rem;
}
.brand{
  display:inline-flex;
  align-items:center;
  gap:.7rem;
  font-size:1.25rem;
  font-weight:850;
  letter-spacing:-.025em;
  text-decoration:none;
  white-space:nowrap;
  color:var(--ink);
}
.brand-mark{display:inline-block;width:2.25rem;height:1.7rem;flex:0 0 auto;background:url("brand-mark-a.svg") center/contain no-repeat;}
.brand-mark::after,.brand-mark span{display:none!important;}
.brand-word{display:inline-block}
.nav-links{
  margin-left:auto;
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:flex-end;
  gap:.25rem .7rem;
}
.nav-links a{
  text-decoration:none;
  font-size:.9rem;
  padding:.45rem .2rem;
  color:var(--ink-2);
}
.nav-links a:not(.btn):hover{text-decoration:underline;text-underline-offset:.25rem}
.btn{
  display:inline-block;
  border:1px solid var(--accent);
  background:var(--accent);
  color:#fff;
  text-decoration:none;
  padding:.78rem 1.05rem;
  border-radius:.62rem;
  font-weight:800;
  box-shadow:0 6px 20px rgba(31,111,120,.12);
}
.btn:hover{background:var(--accent-deep);border-color:var(--accent-deep)}
.btn.secondary{background:transparent;color:var(--accent-deep);box-shadow:none}
main{display:block}
section{padding:4.5rem 1.25rem}
.wrap{max-width:var(--max);margin:auto}
.hero{
  padding:7rem 1.25rem 5.6rem;
  position:relative;
  overflow:hidden;
}
.hero::after{
  content:"";
  position:absolute;
  right:max(1.25rem,calc((100vw - var(--max))/2));
  top:4.2rem;
  width:12rem;
  height:12rem;
  opacity:.18;
  background:
    radial-gradient(circle at 15% 72%,var(--accent) 0 .36rem,transparent .4rem),
    radial-gradient(circle at 58% 18%,var(--warm) 0 .36rem,transparent .4rem),
    radial-gradient(circle at 88% 54%,var(--ink) 0 .36rem,transparent .4rem),
    linear-gradient(150deg,transparent 42%,var(--accent) 43% 44%,transparent 45%),
    linear-gradient(18deg,transparent 48%,var(--accent) 49% 50%,transparent 51%);
  pointer-events:none;
}
.eyebrow{
  color:var(--accent-deep);
  text-transform:uppercase;
  letter-spacing:.12em;
  font-size:.76rem;
  font-weight:850;
  margin-bottom:.8rem;
}
h1,h2,h3{line-height:1.1;margin-top:0;color:var(--ink)}
h1{font-size:clamp(2.7rem,6.2vw,5.6rem);max-width:980px;letter-spacing:-.055em;margin-bottom:1.25rem}
h2{font-size:clamp(1.85rem,4vw,3.25rem);letter-spacing:-.035em;max-width:900px}
h3{font-size:1.18rem;letter-spacing:-.015em}
.lead{font-size:1.22rem;max-width:810px;color:var(--muted)}
.actions{display:flex;flex-wrap:wrap;gap:.8rem;margin-top:1.6rem}
.grid{display:grid;grid-template-columns:repeat(12,1fr);gap:1rem}
.card{
  grid-column:span 4;
  background:rgba(255,255,255,.92);
  border:1px solid var(--line);
  border-radius:.9rem;
  padding:1.45rem;
  box-shadow:0 2px 0 rgba(16,36,58,.03);
  position:relative;
}
.card::before{
  content:"";
  position:absolute;
  left:1.45rem;
  top:0;
  width:2.5rem;
  border-top:3px solid var(--accent);
}
.card.wide{grid-column:span 6}
.card.full{grid-column:1/-1}
.rail{display:grid;grid-template-columns:repeat(5,1fr);gap:.8rem;counter-reset:step}
.step{
  position:relative;
  background:rgba(255,255,255,.94);
  border:1px solid var(--line);
  border-radius:.8rem;
  padding:1.1rem;
  min-height:12rem;
}
.step::before{
  counter-increment:step;
  content:counter(step);
  display:inline-grid;
  place-items:center;
  width:1.9rem;height:1.9rem;
  border-radius:999px;
  background:var(--accent-soft);
  color:var(--accent-deep);
  font-weight:850;
  margin-bottom:.8rem;
}
.step:not(:last-child)::after{
  content:"";
  position:absolute;
  top:1.9rem;
  right:-.82rem;
  width:.85rem;
  border-top:1px solid var(--line-strong);
}
.soft{
  background:linear-gradient(180deg,rgba(228,240,239,.7),rgba(238,243,242,.8));
  border-top:1px solid rgba(213,220,223,.7);
  border-bottom:1px solid rgba(213,220,223,.7);
}
.kicker{font-size:1.06rem;color:var(--muted);max-width:790px}
.flow{display:flex;flex-wrap:wrap;gap:.55rem;align-items:center;margin-top:1.35rem}
.flow span{background:var(--surface);border:1px solid var(--line);padding:.68rem .88rem;border-radius:.58rem;box-shadow:0 2px 0 rgba(16,36,58,.025)}
.flow b{color:var(--accent);font-weight:900}
.notice{border-left:4px solid var(--accent);background:rgba(255,255,255,.94);padding:1rem 1.2rem;margin:1rem 0;border-radius:0 .65rem .65rem 0}
form{background:rgba(255,255,255,.96);border:1px solid var(--line);border-radius:.9rem;padding:1.55rem;max-width:850px;box-shadow:var(--shadow)}
.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}
.field.full{grid-column:1/-1}
label{display:block;font-weight:800;margin-bottom:.35rem;color:var(--ink)}
input,textarea,select{width:100%;padding:.82rem .9rem;border:1px solid #aeb9bf;border-radius:.55rem;background:#fff;color:var(--text);font:inherit}
input:focus,textarea:focus,select:focus{border-color:var(--accent)}
textarea{min-height:130px;resize:vertical}
.help{font-size:.88rem;color:var(--muted);margin-top:.3rem}
.form-actions{display:flex;align-items:center;gap:1rem;flex-wrap:wrap;margin-top:1rem}
.status{min-height:1.5em;font-weight:800;color:var(--accent-deep)}
footer{border-top:1px solid var(--line);padding:2.8rem 1.25rem;color:var(--muted);background:rgba(255,255,255,.45)}
footer .wrap{display:flex;gap:1.2rem;flex-wrap:wrap;justify-content:space-between;align-items:flex-start}
.footer-brand{color:var(--ink);letter-spacing:-.01em}
.small{font-size:.88rem;max-width:720px}
ul.clean{padding-left:1.2rem}

/* internal reference board */
.reference-board{max-width:1180px;margin:2rem auto;padding:1.5rem}
.reference-board .option{background:#fff;border:1px solid var(--line);border-radius:1rem;padding:2rem;margin:1rem 0;box-shadow:var(--shadow)}
.wordmark-demo{display:flex;align-items:center;gap:1rem;font-size:clamp(2rem,5vw,4rem);font-weight:850;letter-spacing:-.055em;color:var(--ink)}
.wordmark-demo .signal{display:inline-grid;place-items:center;width:3.4rem;height:3.4rem;border:2px solid var(--accent);border-radius:1rem;color:var(--accent);font-size:1rem;letter-spacing:0}
.wordmark-demo.path .signal{border-radius:999px;position:relative}
.wordmark-demo.path .signal::after{content:"";position:absolute;width:2.7rem;border-top:2px solid var(--warm);transform:rotate(-25deg)}
.token-row{display:flex;gap:.7rem;flex-wrap:wrap;margin-top:1.2rem}.token{padding:.6rem .8rem;border:1px solid var(--line);border-radius:.55rem;background:var(--bg);font-size:.88rem}

@media(max-width:1040px){.nav{align-items:flex-start;flex-direction:column}.nav-links{margin-left:0;justify-content:flex-start}.hero::after{opacity:.1}.step:not(:last-child)::after{display:none}}
@media(max-width:900px){.card,.card.wide{grid-column:span 6}.rail{grid-template-columns:1fr 1fr}}
@media(max-width:620px){section{padding:3.2rem 1rem}.hero{padding:4.4rem 1rem 3.4rem}.card,.card.wide{grid-column:1/-1}.rail{grid-template-columns:1fr}.form-grid{grid-template-columns:1fr}.field.full{grid-column:auto}.brand-mark{transform:none}.nav-links{gap:.15rem .55rem}.nav-links .btn{width:100%;text-align:center}.hero::after{display:none}}


/* V0.5RC1 commercial-MVP experience */
.btn.compact{padding:.58rem .75rem;font-size:.86rem}.micro-proof{margin-top:1.15rem;color:var(--muted);font-size:.9rem;font-weight:700}.compact-grid{margin-top:1.4rem}.subhero{padding-bottom:3.9rem}.role-state{display:inline-block;margin-bottom:.8rem;padding:.28rem .58rem;border-radius:999px;background:var(--accent-soft);color:var(--accent-deep);font-size:.74rem;font-weight:850;letter-spacing:.03em}.lead-role{border-color:#aec9c8}.lead-role::before{width:4rem}.developing-strip{margin-top:1rem;border:1px solid var(--line);border-radius:.75rem;padding:1rem 1.15rem;background:rgba(255,255,255,.78);color:var(--muted)}
.workforce-shell{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(310px,.75fr);gap:1.4rem;align-items:stretch;margin-top:2rem}.workforce-map{min-height:520px;position:relative;border:1px solid var(--line);border-radius:1.2rem;background:rgba(255,255,255,.82);box-shadow:var(--shadow);overflow:hidden}.workforce-map::before,.workforce-map::after{content:"";position:absolute;inset:15% 16%;border:1px solid rgba(31,111,120,.18);border-radius:50%}.workforce-map::after{inset:27% 29%;border-color:rgba(196,101,69,.17)}.business-centre{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:170px;height:170px;border-radius:50%;display:grid;place-content:center;text-align:center;background:var(--ink);color:#fff;z-index:2;box-shadow:0 16px 40px rgba(16,36,58,.18)}.business-centre strong{font-size:1.12rem}.business-centre span{font-size:.78rem;opacity:.75}.function-node{position:absolute;width:180px;min-height:76px;border:1px solid var(--line-strong);border-radius:.85rem;background:#fff;color:var(--ink);padding:.75rem .85rem;text-align:left;z-index:3;cursor:pointer;box-shadow:0 6px 18px rgba(16,36,58,.05);font:inherit}.function-node span{display:block;font-weight:850}.function-node small{display:block;color:var(--muted);margin-top:.15rem}.function-node:hover,.function-node:focus-visible,.function-node.active{border-color:var(--accent);box-shadow:0 0 0 3px rgba(31,111,120,.12)}.function-node.active{background:var(--accent-soft)}.function-node[data-function="operations"]{left:6%;top:10%}.function-node[data-function="implementation"]{right:6%;top:10%}.function-node[data-function="sales"]{right:3%;top:42%}.function-node[data-function="marketing"]{right:8%;bottom:8%}.function-node[data-function="administration"]{left:8%;bottom:8%}.function-node[data-function="finance"]{left:3%;top:42%}.workforce-detail{border:1px solid var(--line);border-radius:1.2rem;background:#fff;padding:1.55rem;box-shadow:var(--shadow)}.workforce-detail h3{font-size:1.55rem}.detail-list{display:grid;gap:.85rem}.detail-list div{border-top:1px solid var(--line);padding-top:.75rem}.detail-list strong{display:block;font-size:.8rem;text-transform:uppercase;letter-spacing:.08em;color:var(--accent-deep);margin-bottom:.25rem}.readiness-note{margin-top:1rem;padding:.8rem;border-radius:.7rem;background:var(--warm-soft);color:var(--ink-2);font-size:.9rem}.handoff-flow{display:flex;align-items:stretch;gap:.55rem;margin-top:1.5rem;overflow-x:auto;padding-bottom:.35rem}.handoff-flow>div{flex:1 0 150px;border:1px solid var(--line);background:#fff;border-radius:.8rem;padding:1rem;display:grid;gap:.25rem}.handoff-flow>div strong{display:grid;place-items:center;width:1.8rem;height:1.8rem;border-radius:50%;background:var(--accent-soft);color:var(--accent-deep)}.handoff-flow>div span{font-weight:850;color:var(--ink)}.handoff-flow>div small{color:var(--muted)}.handoff-flow>b{align-self:center;color:var(--accent);font-size:1.25rem}.handoff-flow .approval-step{border-color:var(--warm);background:var(--warm-soft)}.conversion-panel{display:flex;justify-content:space-between;gap:2rem;align-items:center}.conversion-panel .actions{margin-top:0}.portal-preview-card{max-width:960px;margin:auto}
@media(max-width:1080px){.nav-links{gap:.2rem .5rem}.nav-links a{font-size:.84rem}.workforce-shell{grid-template-columns:1fr}.workforce-map{min-height:560px}}
@media(max-width:720px){.workforce-map{min-height:auto;display:grid;gap:.65rem;padding:1rem}.business-centre{position:static;transform:none;width:auto;height:auto;border-radius:.85rem;padding:1rem}.workforce-map::before,.workforce-map::after{display:none}.function-node{position:static;width:100%;min-height:auto}.workforce-detail{padding:1.15rem}.handoff-flow{display:grid;grid-template-columns:1fr}.handoff-flow>b{display:none}.conversion-panel{display:block}.conversion-panel .actions{margin-top:1.4rem}}

/* Production brand reference helpers */
.brand-decision-board h2{font-size:2rem;margin-bottom:.5rem}.brand-recommendation{display:grid;grid-template-columns:230px 1fr;gap:1rem;background:var(--ink);color:#fff;border-radius:1rem;padding:1.2rem 1.35rem;margin:1.5rem 0 2rem}.brand-recommendation span{color:#dce7ed}.brand-option{border-width:1px}.brand-option.recommended{border-color:#aac9c8}.brand-option.alternate{opacity:.94}.option-meta{display:flex;justify-content:space-between;gap:1rem;align-items:flex-start}.neutral-state{background:var(--surface-2);color:var(--ink-2)}.logo-stage{min-height:190px;display:flex;align-items:center;justify-content:center;gap:1.2rem;border:1px solid var(--line);border-radius:1rem;background:linear-gradient(145deg,#fff,#f5f7f6);margin:1.2rem 0;padding:2rem}.wordmark-only>span,.logo-word{font-size:clamp(3rem,8vw,6.6rem);font-weight:850;letter-spacing:-.06em;color:var(--ink);line-height:1}.handoff-mark{position:relative;display:inline-block;width:5.2rem;height:4.1rem;border-left:.24rem solid var(--accent);border-bottom:.24rem solid var(--accent);border-radius:0 0 0 1rem;transform:skewX(-10deg);flex:0 0 auto}.handoff-mark:before{content:"";position:absolute;left:1rem;right:.45rem;top:.9rem;border-top:.24rem solid var(--accent);transform:rotate(-18deg);transform-origin:left center}.handoff-mark i{position:absolute;width:.8rem;height:.8rem;border-radius:50%;background:var(--ink);box-shadow:0 0 0 .18rem #fff}.handoff-mark i:nth-child(1){left:-.5rem;bottom:-.5rem}.handoff-mark i:nth-child(2){left:1.55rem;top:.1rem;background:var(--warm)}.handoff-mark i:nth-child(3){right:-.35rem;top:1.2rem;background:var(--accent)}.handoff-mark.s48{width:48px;height:38px;border-width:2px;border-radius:0 0 0 8px}.handoff-mark.s48:before{left:9px;right:4px;top:8px;border-width:2px}.handoff-mark.s48 i{width:7px;height:7px;box-shadow:0 0 0 2px #fff}.handoff-mark.s48 i:nth-child(1){left:-4px;bottom:-4px}.handoff-mark.s48 i:nth-child(2){left:14px;top:1px}.handoff-mark.s48 i:nth-child(3){right:-3px;top:11px}.handoff-mark.s32{width:32px;height:26px;border-width:2px;border-radius:0 0 0 6px}.handoff-mark.s32:before{left:6px;right:3px;top:5px;border-width:2px}.handoff-mark.s32 i{width:6px;height:6px;box-shadow:0 0 0 1.5px #fff}.handoff-mark.s32 i:nth-child(1){left:-4px;bottom:-4px}.handoff-mark.s32 i:nth-child(2){left:9px;top:0}.handoff-mark.s32 i:nth-child(3){right:-3px;top:7px}.handoff-mark.s24{width:24px;height:20px;border-width:2px;border-radius:0 0 0 5px}.handoff-mark.s24:before{left:5px;right:2px;top:4px;border-width:2px}.handoff-mark.s24 i{width:5px;height:5px;box-shadow:0 0 0 1px #fff}.handoff-mark.s24 i:nth-child(1){left:-3px;bottom:-3px}.handoff-mark.s24 i:nth-child(2){left:7px;top:0}.handoff-mark.s24 i:nth-child(3){right:-2px;top:5px}.handoff-mark.s16{width:16px;height:14px;border-width:1.5px;border-radius:0 0 0 3px}.handoff-mark.s16:before{left:3px;right:1px;top:3px;border-width:1.5px}.handoff-mark.s16 i{width:3.5px;height:3.5px;box-shadow:0 0 0 1px #fff}.handoff-mark.s16 i:nth-child(1){left:-2.5px;bottom:-2.5px}.handoff-mark.s16 i:nth-child(2){left:4.5px;top:0}.handoff-mark.s16 i:nth-child(3){right:-1.5px;top:3.5px}.icon-scale{display:flex;align-items:center;gap:1.2rem;min-height:72px;padding:1rem 1.2rem;border-radius:.8rem;background:var(--surface-2);margin-bottom:1rem}.icon-scale small{margin-left:auto;color:var(--muted)}.frame-mark{position:relative;width:5.2rem;height:4.5rem;display:inline-block;flex:0 0 auto}.frame-mark:before,.frame-mark:after{content:"";position:absolute;top:.45rem;width:2.25rem;height:3.6rem;border:3px solid var(--accent);border-radius:.8rem}.frame-mark:before{left:0;border-right-color:transparent}.frame-mark:after{right:0;border-left-color:transparent}.frame-mark i{position:absolute;width:.65rem;height:.65rem;border-radius:50%;z-index:2}.frame-mark i:first-child{left:1.45rem;top:1.9rem;background:var(--warm)}.frame-mark i:last-child{right:1.45rem;top:1.9rem;background:var(--accent)}.brand-criteria{display:grid;grid-template-columns:repeat(3,1fr);gap:.8rem;margin-top:1rem}.brand-criteria div{border-top:1px solid var(--line);padding-top:.75rem}.brand-criteria strong,.brand-criteria span{display:block}.brand-criteria strong{font-size:.75rem;text-transform:uppercase;letter-spacing:.07em;color:var(--accent-deep);margin-bottom:.2rem}.brand-criteria span{font-size:.9rem;color:var(--muted)}.application-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:.8rem}.application-grid article{display:grid;gap:.5rem;background:var(--surface-2);border-radius:.75rem;padding:1rem}.application-grid strong{color:var(--ink)}.application-grid small{color:var(--muted)}@media(max-width:760px){.brand-recommendation{grid-template-columns:1fr}.option-meta{display:block}.logo-stage{min-height:150px;padding:1.2rem}.lockup{align-items:center}.logo-word{font-size:clamp(2.4rem,13vw,4rem)}.brand-criteria,.application-grid{grid-template-columns:1fr}.icon-scale{gap:.85rem;flex-wrap:wrap}.icon-scale small{width:100%;margin-left:0}}
/* QA compatibility: explicit wordmark scale for renderers without clamp() support */
.brand-decision-board .wordmark-only>span,.brand-decision-board .logo-word{font-size:72px}
@media(max-width:760px){.brand-decision-board .wordmark-only>span,.brand-decision-board .logo-word{font-size:48px}}

/* V0.7RC1 production identity: Direction A selected 3 September 2026. Space Grotesk is the preferred display/wordmark family when available; Inter/system remains the dense interface fallback. */
.brand-word,h1,h2,.eyebrow{font-family:"Space Grotesk",Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;}