@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=JetBrains+Mono:wght@400;500&display=swap');
*{
  box-sizing:border-box
}
html{
  scroll-behavior:auto;
  scroll-padding-top:110px
}
body{
  margin:0;
  background:var(--bg);
  color:var(--fg-1);
  font:16px/1.6 Inter,Arial,sans-serif
}
a{
  color:inherit;
  text-underline-offset:5px
}
button,input,select,textarea{
  font:inherit
}
button,a,input,select,textarea{
  -webkit-tap-highlight-color:transparent
}
a,button{
  touch-action:manipulation
}
button{
  cursor:pointer
}
button:disabled{
  cursor:default;
  opacity:.45
}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{
  outline:3px solid var(--brand-light);
  outline-offset:4px
}
h1,h2,h3,h4,p{
  margin-top:0
}
h1,h2,h3,h4{
  line-height:1.15;
  letter-spacing:-.045em
}
h1{
  font-size:clamp(3rem,5.2vw,5.2rem);
  font-weight:700;
  margin-bottom:28px
}
h2{
  font-size:clamp(2rem,3.2vw,3.25rem);
  font-weight:600;
  margin-bottom:24px
}
h3{
  font-size:1.4rem;
  font-weight:600;
  letter-spacing:-.03em
}
h4{
  font-size:1.8rem
}
p{
  color:var(--fg-2)
}
header{
  height:94px;
  padding:0 5%;
  display:flex;
  align-items:center;
  gap:30px;
  border-bottom:1px solid var(--border);
  background:var(--bg);
  position:relative;
  z-index:10
}
.brand{
  margin-right:auto;
  display:flex;
  align-items:center
}
.brand img{
  width:126px;
  height:auto
}
nav{
  display:flex;
  align-items:center;
  gap:25px
}
nav a{
  text-decoration:none;
  font-size:.85rem;
  min-height:44px;
  display:inline-flex;
  align-items:center
}
nav a:hover,.text-link:hover{
  color:var(--brand-light)
}
.button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:30px;
  min-height:52px;
  padding:14px 22px;
  border:1px solid var(--brand-light);
  background:var(--brand-light);
  color:var(--fg-invert);
  font-weight:600;
  font-size:.9rem;
  text-decoration:none
}
.button:hover{
  background:var(--brand-hover)
}
.menu-toggle{
  display:none
}
.skip{
  position:absolute;
  left:20px;
  top:-100px;
  z-index:30;
  background:var(--bg);
  padding:12px
}
.skip:focus{
  top:10px
}
.hero,.section,.page-hero,.request-layout{
  max-width:1440px;
  margin:auto;
  padding:100px 6%
}
.hero{
  display:grid;
  grid-template-columns:1.15fr 1fr;
  gap:8%;
  padding-top:90px;
  padding-bottom:70px
}
.hero h1 span{
  color:var(--brand-light)
}
.eyebrow,.mini,.number{
  font-family:'JetBrains Mono',monospace;
  text-transform:uppercase;
  letter-spacing:.08em;
  font-size:.69rem;
  font-weight:500
}
.eyebrow{
  margin-bottom:28px;
  color:var(--fg-2)
}
.hero .eyebrow{
  color:var(--brand-light)
}
.lead{
  font-size:1.06rem;
  line-height:1.8;
  max-width:680px
}
.actions{
  display:flex;
  align-items:center;
  gap:26px;
  margin-top:30px
}
.text-link{
  font-weight:600;
  font-size:.9rem;
  display:inline-flex;
  align-items:center;
  min-height:44px
}
.note{
  font-size:.8rem;
  line-height:1.7;
  margin-top:22px;
  margin-bottom:0;
  max-width:900px
}
.enterprise-map{
  align-self:center;
  background:var(--bg-subtle);
  padding:30px
}
.enterprise-map .eyebrow{
  color:var(--fg-2);
  margin-bottom:24px
}
.map-card{
  padding:24px;
  background:var(--bg);
  border:1px solid var(--border)
}
.map-card.current{
  border:1px solid var(--brand-light);
  border-left:4px solid var(--brand-light)
}
.map-card strong{
  display:block;
  font-size:2.5rem;
  line-height:1.3;
  letter-spacing:-.04em;
  margin-top:14px
}
.map-card p{
  font-size:.85rem;
  margin:8px 0 18px
}
.map-card h3{
  font-size:1.1rem;
  margin:8px 0 0
}
.future{
  border:1px dashed var(--fg-3)
}
.map-tags{
  display:flex;
  gap:8px;
  flex-wrap:wrap
}
.map-tags span{
  font-size:.7rem;
  padding:4px 8px;
  background:var(--brand-surface);
  color:var(--brand-light)
}
.connector{
  text-align:center;
  font-size:.73rem;
  color:var(--fg-2);
  padding:16px
}
.proof-strip{
  display:flex;
  justify-content:space-between;
  gap:25px;
  padding:26px 6%;
  border-top:1px solid var(--border);
  border-bottom:1px solid var(--border);
  font-size:.8rem;
  color:var(--fg-2)
}
.roles{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  padding:0 6%;
  border-bottom:1px solid var(--border)
}
.roles a{
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:22px 0;
  text-decoration:none;
  font-weight:600;
  font-size:.85rem
}
.roles a+a{
  padding-left:24px;
  border-left:1px solid var(--border);
  margin-left:24px
}
.roles span{
  font-size:.72rem;
  color:var(--fg-2);
  font-weight:400
}
.section{
  border-bottom:1px solid var(--border)
}
.section-heading{
  display:grid;
  grid-template-columns:1fr 3fr;
  gap:30px;
  margin-bottom:32px
}
.section-heading .eyebrow{
  margin-top:8px
}
.section-heading .lead{
  margin-bottom:8px
}
.cards{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px
}
.cards:has(>article:nth-child(4)){
  grid-template-columns:repeat(4,1fr)
}
.cards article{
  border:1px solid var(--border);
  padding:28px;
  min-width:0
}
.cards h3{
  margin:35px 0 16px
}
.cards p{
  font-size:.9rem;
  margin-bottom:0
}
.mini{
  color:var(--fg-2)
}
.walkthrough{
  border:1px solid var(--border);
  margin-top:24px
}
.demo-toolbar{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  padding:18px 24px;
  background:var(--bg-subtle);
  border-bottom:1px solid var(--border);
  font: .7rem 'JetBrains Mono',monospace
}
.demo-toolbar strong{
  background:var(--accent-amber-surface);
  color:var(--accent-amber-text);
  padding:6px 10px;
  font-weight:500
}
.demo-body{
  display:grid;
  grid-template-columns:230px 1fr
}
.step-nav{
  padding:16px;
  border-right:1px solid var(--border);
  display:flex;
  flex-direction:column;
  gap:8px
}
.step-nav button{
  min-height:58px;
  background:var(--bg);
  border:1px solid transparent;
  display:flex;
  align-items:center;
  text-align:left;
  gap:18px;
  padding:14px;
  font-size:.86rem;
  color:var(--fg-2)
}
.step-nav button span{
  font: .65rem 'JetBrains Mono',monospace
}
.step-nav button[aria-pressed=true]{
  background:var(--brand-surface);
  border-color:var(--brand-light);
  color:var(--brand-light);
  font-weight:600
}
.demo-stage{
  padding:32px;
  min-width:0;
  display:flex;
  flex-direction:column;
  min-height:460px
}
.demo-panel{
  flex:1
}
.demo-panel h3{
  font-size:1.9rem;
  margin-bottom:25px
}
.demo-panel p{
  font-size:.9rem
}
.demo-panel .eyebrow{
  margin-bottom:16px;
  color:var(--brand-light)
}
[hidden]{
  display:none!important
}
.source-list{
  display:grid;
  gap:10px
}
.source-list>div{
  padding:14px 18px;
  border-left:2px solid var(--accent-blue);
  background:var(--accent-blue-surface)
}
.source-list strong,.source-list span{
  display:block
}
.source-list strong{
  font-size:.85rem
}
.source-list span{
  font-size:.73rem;
  color:var(--fg-2)
}
.demo-controls{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  border-top:1px solid var(--border);
  margin-top:28px;
  padding-top:18px;
  font-size:.75rem;
  color:var(--fg-2)
}
.demo-controls button{
  background:var(--bg);
  border:1px solid var(--border);
  padding:10px 15px;
  min-height:44px;
  font-size:.8rem
}
.demo-disclaimer{
  padding:18px 24px;
  margin:0;
  border-top:1px solid var(--border);
  font-size:.73rem
}
.financial-row{
  display:grid;
  grid-template-columns:2fr 1fr 1fr 1fr;
  gap:10px;
  padding:14px 0;
  border-bottom:1px solid var(--border);
  font-size:.82rem
}
.financial-row span{
  text-align:right;
  font-variant-numeric:tabular-nums
}
.financial-row:last-child{
  background:var(--brand-surface);
  color:var(--brand-light);
  padding:14px 8px
}
.financial-head{
  font-size:.7rem;
  color:var(--fg-2)
}
.financial-head span:first-child{
  text-align:left
}
.draft{
  display:inline-block;
  padding:6px 12px;
  background:var(--accent-amber-surface);
  color:var(--accent-amber-text);
  font-size:.75rem;
  margin-bottom:24px
}
.review{
  background:var(--accent-green-surface);
  color:var(--accent-green-text)
}
.checklist{
  padding-left:22px;
  color:var(--fg-2);
  font-size:.9rem
}
.checklist li{
  margin-bottom:14px
}
.scenario-question{
  background:var(--brand-surface);
  border:1px solid var(--brand-light);
  padding:20px;
  text-align:left;
  color:var(--brand-light);
  font-weight:600;
  margin-bottom:24px;
  width:100%
}
dl{
  display:grid;
  grid-template-columns:100px 1fr;
  gap:14px;
  font-size:.85rem
}
dt{
  color:var(--fg-2)
}
dd{
  margin:0
}
.journey-list>a,.journey-list>article{
  display:flex;
  gap:30px;
  align-items:flex-start;
  padding:28px 0;
  border-top:1px solid var(--border);
  text-decoration:none;
  scroll-margin-top:30px
}
.journey-list>a:hover h3{
  color:var(--brand-light)
}
.journey-list>*>span:last-child:not(.number){
  margin-left:auto
}
.number{
  font-size:.9rem;
  color:var(--brand-light);
  padding-top:4px
}
.journey-list h3{
  margin:0 0 12px
}
.journey-list p{
  font-size:.9rem;
  max-width:780px;
  margin-bottom:12px
}
.journey-list .mini{
  font-size:.65rem
}
.expansion-core,.expansion-next{
  text-align:center;
  padding:28px;
  border:1px solid var(--brand-light);
  background:var(--brand-surface)
}
.expansion-core h3{
  margin:12px 0 0
}
.expansion-next{
  background:var(--bg);
  border:1px dashed var(--fg-3)
}
.expansion-next h3{
  margin:0 0 12px
}
.expansion-next p{
  margin:0;
  font-size:.9rem
}
.platform-cards article{
  border-top:3px solid var(--component-accent);
  background:var(--component-surface)
}
.platform-cards .mini{
  color:var(--component-text)
}
.platform-cards h3{
  font-size:2.25rem
}
.platform-cards a{
  margin-top:32px
}
.final-cta{
  background:var(--bg-subtle);
  text-align:center;
  padding:95px 6%
}
.final-cta h2{
  font-size:clamp(2.3rem,4.2vw,4rem)
}
.final-cta p:not(.eyebrow){
  max-width:580px;
  margin:0 auto 28px
}
.final-cta .eyebrow{
  color:var(--brand-light)
}
footer{
  padding:60px 6% 25px;
  background:var(--bg)
}
.footer-top{
  display:flex;
  justify-content:space-between;
  gap:30px;
  margin-bottom:40px
}
.wordmark{
  font-size:2.9rem;
  font-weight:700;
  text-decoration:none;
  letter-spacing:-.065em;
  line-height:1
}
.wordmark span{
  font-size:.7rem;
  vertical-align:top;
  letter-spacing:0
}
.footer-top p{
  font-size:.85rem
}
footer nav{
  flex-wrap:wrap;
  gap:10px 25px
}
.footer-bottom{
  display:flex;
  justify-content:space-between;
  gap:20px;
  border-top:1px solid var(--border);
  padding-top:24px;
  margin-top:30px;
  font-size:.7rem;
  color:var(--fg-2)
}
.footer-bottom span{
  font-family:'JetBrains Mono',monospace;
  font-size:.6rem
}
.page-hero{
  max-width:1100px;
  text-align:center
}
.page-hero h1{
  font-size:clamp(2.8rem,5vw,4.8rem)
}
.page-hero .lead{
  margin:0 auto 30px
}
.questions{
  list-style:none;
  padding:0
}
.questions li{
  padding:22px 0;
  border-top:1px solid var(--border);
  font-size:1.1rem
}
.request-layout{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:9%;
  align-items:start
}
.request-layout h1{
  font-size:clamp(3rem,5vw,4.7rem)
}
.request-card{
  border:1px solid var(--border);
  padding:32px
}
.request-card h2{
  font-size:1.55rem
}
.request-card>p{
  font-size:.85rem
}
.contact-note{
  margin:35px 0;
  padding:22px;
  background:var(--bg-subtle);
  font-size:.85rem
}
.contact-note p{
  margin:8px 0 0
}
label{
  display:block;
  font-size:.82rem;
  font-weight:600;
  margin:20px 0 8px
}
label span{
  font-weight:400;
  color:var(--fg-2)
}
input,select,textarea{
  display:block;
  width:100%;
  min-height:48px;
  border:1px solid var(--border-hover);
  background:var(--bg);
  border-radius:0;
  padding:10px;
  color:var(--fg-1)
}
textarea{
  resize:vertical
}
input[aria-invalid=true]{
  border-color:var(--color-error)
}
.field-error{
  margin:6px 0 0;
  font-size:.8rem;
  color:var(--color-error)
}
form .button{
  width:100%;
  margin-top:24px
}
#request-status{
  font-size:.85rem;
  color:var(--brand-light)
}
#email-fallback{
  border-top:1px solid var(--border);
  padding-top:20px;
  font-size:.85rem
}
.mobile-persistent{
  display:none
}
@media(min-width:1500px){
  .hero,.section{
    padding-left:86px;
    padding-right:86px
  }
}
@media(max-width:1050px){
  header{
    gap:18px;
    padding:0 4%
  }
  nav{
    gap:15px
  }
  .header-cta{
    font-size:.75rem;
    padding:12px
  }
  .hero{
    gap:5%;
    padding:65px 5%
  }
  .enterprise-map{
    padding:22px
  }
  .cards article{
    padding:22px
  }
  .roles span{
    max-width:140px
  }
  .section-heading{
    grid-template-columns:1fr 3fr
  }
}
@media(max-width:780px){
  html{
    scroll-padding-top:30px
  }
  header{
    height:76px;
    padding:0 6%;
    flex-wrap:wrap
  }
  .brand img{
    width:112px
  }
  .header-cta{
    display:none
  }
  .menu-toggle{
    display:block;
    min-height:44px;
    background:var(--bg);
    border:1px solid var(--border);
    padding:8px 16px;
    position:relative;
    z-index:12
  }
  header>nav{
    display:none
  }
  header.menu-open>nav{
    display:flex;
    position:absolute;
    top:76px;
    left:0;
    right:0;
    min-height:calc(100dvh - 76px);
    background:var(--bg);
    padding:30px 6%;
    flex-direction:column;
    align-items:stretch;
    gap:0;
    z-index:11;
    overflow-y:auto
  }
  header.menu-open>nav a{
    font-size:1.5rem;
    padding:20px 0;
    border-bottom:1px solid var(--border)
  }
  body.menu-is-open{
    overflow:hidden
  }
  .hero,.section,.page-hero,.request-layout{
    padding:60px 6%
  }
  .hero{
    grid-template-columns:1fr;
    gap:45px
  }
  .hero h1{
    font-size:clamp(2.8rem,9.7vw,4.4rem)
  }
  .lead{
    font-size:1rem
  }
  .actions{
    align-items:stretch;
    flex-direction:column;
    gap:12px
  }
  .actions .text-link{
    justify-content:center
  }
  .actions .button{
    width:100%
  }
  .enterprise-map{
    padding:24px
  }
  .proof-strip{
    flex-direction:column;
    gap:9px;
    padding:24px 6%
  }
  .roles{
    display:flex;
    flex-direction:column
  }
  .roles a+a{
    padding-left:0;
    margin:0;
    border-left:0;
    border-top:1px solid var(--border)
  }
  .roles span{
    max-width:none
  }
  .section-heading{
    grid-template-columns:1fr;
    gap:0;
    margin-bottom:28px
  }
  .section-heading .eyebrow{
    margin-bottom:20px
  }
  .cards,.cards:has(>article:nth-child(4)){
    grid-template-columns:1fr
  }
  .cards h3{
    margin-top:20px
  }
  .demo-body{
    grid-template-columns:1fr
  }
  .step-nav{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    border-right:0;
    border-bottom:1px solid var(--border);
    padding:12px;
    gap:4px
  }
  .step-nav button{
    min-height:48px;
    gap:10px;
    padding:9px;
    font-size:.73rem
  }
  .demo-toolbar{
    padding:14px;
    font-size:.6rem
  }
  .demo-toolbar strong{
    white-space:nowrap;
    padding:6px
  }
  .demo-stage{
    padding:22px;
    min-height:500px
  }
  .demo-panel h3{
    font-size:1.6rem
  }
  .demo-controls{
    flex-wrap:wrap
  }
  .demo-controls button{
    padding:10px
  }
  .demo-disclaimer{
    padding:16px
  }
  .financial-head{
    display:none
  }
  .financial-row{
    grid-template-columns:1fr;
    gap:6px;
    padding:16px 0
  }
  .financial-row span{
    display:flex;
    justify-content:space-between
  }
  .financial-row span:before{
    content:attr(data-label);
    color:var(--fg-2)
  }
  .financial-row strong{
    margin-bottom:8px
  }
  .journey-list>a,.journey-list>article{
    gap:18px
  }
  .journey-list h3{
    font-size:1.2rem
  }
  .journey-list p{
    font-size:.85rem
  }
  .footer-top,.footer-bottom{
    flex-direction:column
  }
  .footer-top{
    gap:22px;
    margin-bottom:20px
  }
  footer nav{
    gap:8px 20px;
    align-items:flex-start
  }
  .final-cta{
    padding:65px 6%
  }
  .final-cta .button{
    width:100%
  }
  .request-layout{
    grid-template-columns:1fr;
    gap:35px
  }
  .request-card{
    padding:24px
  }
  .page-hero{
    text-align:left
  }
  .page-hero .button{
    width:100%
  }
  .mobile-persistent.visible{
    display:block;
    position:sticky;
    bottom:0;
    background:var(--bg);
    padding:12px 6%;
    border-top:1px solid var(--border);
    z-index:5
  }
  .mobile-persistent .button{
    width:100%
  }
  body:has(.mobile-persistent.visible) footer{
    padding-bottom:35px
  }
  dl{
    grid-template-columns:1fr;
    gap:6px
  }
  dd{
    margin-bottom:12px
  }
}
@media(prefers-reduced-motion:reduce){
  html{
    scroll-behavior:auto
  }
  *,*:before,*:after{
    animation:none!important;
    transition:none!important
  }
}
/* Neutral editorial headlines;
Peacock remains reserved for actions and diagrams. */
.hero h1 span{
  color:var(--fg-1)
}
@media(min-width:781px) and (max-width:1050px){
  .cards:has(>article:nth-child(4)){
    grid-template-columns:repeat(2,1fr)
  }
}
.demo-toolbar{
  position:sticky;
  top:0;
  z-index:2
}
@media(max-width:780px){
  .hero .desktop-copy{
    display:none
  }
}
@media(min-width:781px){
  .hero .mobile-copy{
    display:none
  }
}
header{
  height:auto;
  min-height:94px;
  flex-wrap:wrap;
  padding-top:20px;
  padding-bottom:20px
}
header nav{
  flex-wrap:wrap
}
h1,h2,h3,h4{
  overflow-wrap:anywhere
}
.roles a{
  gap:12px
}
.roles span{
  overflow-wrap:anywhere
}
.demo-toolbar{
  flex-wrap:wrap
}
@media(max-width:780px){
  header{
    min-height:76px;
    padding-top:0;
    padding-bottom:0
  }
  header>nav{
    flex-wrap:nowrap
  }
}
.demo-body>*{
  min-width:0
}
.step-nav button{
  min-width:0;
  overflow-wrap:anywhere
}
.demo-controls>div{
  display:flex;
  flex-wrap:wrap;
  gap:4px
}
.map-tags span{
  overflow-wrap:anywhere
}
p,dd,a{
  overflow-wrap:break-word
}
@media(max-width:780px){
  .step-nav{
    grid-template-columns:repeat(2,minmax(0,1fr))
  }
  .demo-body{
    grid-template-columns:minmax(0,1fr)
  }
  .demo-controls>div{
    width:100%
  }
  .demo-controls button{
    flex:1;
    min-width:0
  }
  .map-card{
    padding:18px
  }
  .demo-toolbar{
    top:0
  }
}

/* Closing vision stays editorial and subordinate to the deployment journey. */
.vision-section .section-heading { margin-bottom: 0; }
.vision-section .text-link { margin-top: 24px; }
.identity-questions h3 { font-size: 1.25rem; }

/* Approved hierarchy: enterprise destination first, FP&A entry below. */
.hero h1 span {
  display: block;
  margin-top: 18px;
  font-size: .58em;
  line-height: 1.25;
  letter-spacing: -.03em;
  color: var(--brand-light);
}
