/* Financial clarity: measured motion, meaningful diagrams and layered depth. */
.hero { background: radial-gradient(ellipse at 78% 42%,rgba(67,88,113,.27),transparent 55%),var(--navy); }
.hero-visual { --hero-shift: 0px; --hero-turn: 0deg; --tilt-x: 0deg; --tilt-y: 0deg; }
.sculpture-motion { position:relative;z-index:2;width:124%;height:min(72svh,780px);flex-shrink:0;transform:translate3d(0,var(--hero-shift),0) rotateZ(var(--hero-turn)) rotateX(var(--tilt-x)) rotateY(var(--tilt-y));transition:transform .55s cubic-bezier(.2,.7,.2,1); }
.sculpture-reveal { width:100%;height:100%;position:relative;animation:sculptureReveal 2.3s cubic-bezier(.2,.65,.2,1) .12s both; }
.hero-sculpture { width:100%;height:100%;max-width:100%;margin:0;object-fit:contain;transform:none;will-change:auto;transition:none; }
.sculpture-highlight { position:absolute;inset:0;pointer-events:none;-webkit-mask:url('assets/clarity-sculpture.webp') center/contain no-repeat;mask:url('assets/clarity-sculpture.webp') center/contain no-repeat;mix-blend-mode:screen;overflow:hidden; }
.sculpture-highlight>span { position:absolute;inset:-30%;background:linear-gradient(115deg,transparent 38%,rgba(255,236,188,.03) 43%,rgba(255,243,214,.5) 49%,rgba(255,236,188,.04) 55%,transparent 60%);animation:metallicReveal 2.1s ease-in-out .45s both; }
.visual-orbit { opacity:.7;animation:orbitReveal 2s ease-out .4s both; }
.hero-data-paths { position:absolute;inset:5% 0;width:100%;height:90%;stroke:#cda968;stroke-width:.8;opacity:.45;pointer-events:none; }
.hero-path { stroke-dasharray:1;animation:tracePath 1.7s cubic-bezier(.2,.6,.2,1) 1s both; }
.hero-data-paths circle { fill:var(--gold);stroke:none;animation:softReveal .7s ease-out 1.8s both; }
.hero-data-note { position:absolute;z-index:3;display:flex;gap:10px;align-items:flex-start;color:#aab8cc;font-size:.875rem;line-height:1.35;animation:noteReveal 1s cubic-bezier(.2,.6,.2,1) 1.2s both; }
.hero-data-note strong { font-weight:400;color:#f1e5ce; }
.note-index { color:var(--gold);font-size:.75rem;letter-spacing:.05em;border-top:1px solid rgba(205,169,104,.6);padding-top:5px; }
.note-records { left:0;top:26%; }
.note-insight { right:4%;top:43%;animation-delay:1.4s; }
.note-people { left:4%;bottom:18%;animation-delay:1.6s; }
.caption-top { top:11%;right:0; }
.caption-bottom { bottom:6%;left:0; }
.visual-caption { animation:softReveal 1s ease-out 1.7s both; }
.scroll-cue>span { animation:scrollHint 2s ease-in-out 2; }

.journey { height:305svh;background:radial-gradient(ellipse at 72% 50%,rgba(48,68,91,.34),transparent 60%),var(--navy-deep); }
.journey-sticky { min-height:640px;padding-top:30px;padding-bottom:24px;overflow:clip; }
.journey-heading h2 { font-size:clamp(2.4rem,3vw,3.15rem); }
.journey-heading>.eyebrow { font-size:.75rem;margin-bottom:12px; }
.journey-composition { grid-template-columns:.86fr 1.2fr;gap:55px;padding:24px 0; }
.journey-copy { height:290px; }
.chapter-copy p { line-height:1.65; }
.ledger-scene { min-height:395px;perspective:1800px;transform:none; }
.scene-axis { width:82%;height:94%;transform:rotate(-10deg); }
.scene-grid { position:absolute;width:120%;height:95%;background-image:linear-gradient(rgba(205,169,104,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(205,169,104,.045) 1px,transparent 1px);background-size:44px 44px;transform:perspective(900px) rotateX(35deg) rotateZ(-8deg);mask-image:radial-gradient(ellipse,#000 15%,transparent 67%);pointer-events:none; }
.ledger-panel { width:92%;max-width:535px;min-height:365px;padding:23px 26px 0;border:1px solid rgba(205,169,104,.32);border-radius:8px;box-shadow:0 28px 70px rgba(0,0,0,.34);backdrop-filter:none;background:linear-gradient(135deg,#233750,#122135);color:#e7edf4;overflow:hidden;transition:border-color .4s; }
.ledger-panel.is-focused { border-color:rgba(205,169,104,.74); }
.ledger-middle { background:linear-gradient(125deg,#e3c995,#c6a56a);color:#132339; }
.ledger-back { background:linear-gradient(135deg,#263950,#101f32); }
.panel-top { opacity:1;color:#afbdd0;border-bottom:1px solid rgba(255,255,255,.14);padding-bottom:13px;gap:12px;font-size:.75rem;letter-spacing:.04em; }
.panel-top>span:first-child { color:var(--gold-light);white-space:nowrap; }
.panel-top>span:nth-child(2) { font-size:.7rem;text-align:right;letter-spacing:.07em;margin-left:auto; }
.panel-symbol { width:21px;height:21px;flex-shrink:0;fill:none;stroke:currentColor;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round; }
.ledger-middle .panel-top { color:#4a4f52;border-color:rgba(11,23,39,.18); }
.ledger-middle .panel-top>span:first-child { color:#26394c; }
.ledger-panel h4 { font-size:1.8rem;line-height:1.08;margin:17px 0 19px;letter-spacing:-.025em; }
.panel-footer { margin-top:20px;padding:13px 0;font-size:.75rem;justify-content:space-between;gap:12px;line-height:1.5;color:#c3cedd; }
.illustration-note { font-size:.75rem;opacity:.6;letter-spacing:0;text-align:right; }
.ledger-middle .panel-footer { color:#344154;border-color:rgba(11,23,39,.2); }
.records-dashboard { padding-top:1px; }
.record-channels { display:grid;grid-template-columns:repeat(3,1fr);gap:13px; }
.record-channel { min-height:75px;display:flex;align-items:center;flex-direction:column;justify-content:center;gap:7px;padding:10px 7px;border:1px solid rgba(185,203,225,.17);background:rgba(5,15,28,.23);border-radius:4px;font-size:.875rem;line-height:1.25;text-align:center; }
.record-channel svg { width:24px;height:24px;fill:none;stroke:var(--gold-light);stroke-width:1.3;stroke-linejoin:round;stroke-linecap:round; }
.records-connectors { width:100%;height:34px;display:block;stroke:var(--gold);stroke-width:1;opacity:.65; }
.records-connectors path { stroke-dasharray:1; }
.records-connectors circle { fill:var(--gold);stroke:none; }
.reconciliation-summary { min-height:45px;border:1px solid rgba(205,169,104,.38);border-radius:4px;background:rgba(205,169,104,.065);padding:10px 13px;display:flex;align-items:center;justify-content:space-between;gap:14px;font-size:.875rem;color:#e2ceb0; }
.ledger-mini { width:25px;display:grid;gap:4px; }
.ledger-mini span { height:2px;background:#758ca9;border-radius:1px; }
.ledger-mini span:nth-child(2) { width:75%; }
.workflow-check { display:inline-flex;align-items:center;justify-content:center;width:21px;height:21px;border:1px solid rgba(205,169,104,.55);border-radius:50%;color:var(--gold-light);flex-shrink:0; }
.workflow-check svg { width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round; }
.dashboard-label { font-size:.75rem;letter-spacing:.06em;line-height:1.4; }
.chart-heading { display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px; }
.chart-legend { display:flex;gap:13px;font-size:.75rem;color:#374657; }
.chart-legend>span { display:flex;align-items:center;gap:6px; }
.chart-legend i { width:12px;height:2px;background:#1c344e; }
.chart-legend>span:last-child i { height:0;border-top:2px dashed #856536;background:none; }
.cashflow-chart { display:block;width:100%;height:132px;overflow:visible; }
.chart-grid { stroke:#273a52;stroke-width:.6;opacity:.13; }
.chart-line { stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1; }
.chart-line-income { stroke:#1c344e; }
.chart-line-costs { stroke:#856536;stroke-width:1.6;opacity:.75; }
.chart-endpoint { fill:#1c344e;stroke:#edddb9;stroke-width:2; }
.report-summary { display:flex;justify-content:space-between;gap:10px;border-top:1px solid rgba(17,34,55,.2);padding-top:10px;margin-top:8px;font-size:.75rem;color:#344154; }
.payroll-dashboard { display:grid;grid-template-columns:1fr 1.05fr;gap:24px; }
.payslip-preview { padding:12px 14px;border:1px solid rgba(212,192,153,.36);background:rgba(236,227,209,.06);border-radius:4px; }
.payslip-title { display:flex;align-items:center;justify-content:space-between;color:#dfc99e;font-size:.75rem;letter-spacing:.12em;margin-bottom:13px; }
.payslip-title svg { width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.2; }
.pay-item { display:flex;align-items:center;justify-content:space-between;gap:12px;margin:8px 0;font-size:.875rem;line-height:1.4;color:#c3cdd9; }
.pay-bar { height:4px;display:block;border-radius:2px;transform-origin:left;background:#7488a0; }
.gross-bar { width:43%; }.tax-bar { width:26%; }.pension-bar { width:16%; }
.pay-net { border-top:1px solid rgba(255,255,255,.13);display:flex;justify-content:space-between;align-items:center;gap:12px;padding-top:9px;margin-top:11px;color:#ecd7b0;font-size:.875rem;line-height:1.4; }
.net-bar { width:36%;background:var(--gold-light); }
.payroll-checklist { display:flex;flex-direction:column;justify-content:center; }
.payroll-checklist>.dashboard-label { color:#9baec4;margin-bottom:15px; }
.payroll-check { display:flex;align-items:center;gap:10px;color:#d4deea;font-size:.875rem;line-height:1.4;margin-bottom:12px; }
.pay-cycle-line { width:100%;height:2px;background:linear-gradient(90deg,var(--gold) 68%,rgba(205,169,104,.15) 68%);margin-top:3px;transform-origin:left; }
.ledger-panel.is-focused .records-connectors path { animation:tracePath .85s ease-out both; }
.ledger-panel.is-focused .record-channel { animation:recordSettle .7s cubic-bezier(.2,.6,.2,1) both; }
.ledger-panel.is-focused .record-channel:nth-child(2) { animation-delay:.1s; }
.ledger-panel.is-focused .record-channel:nth-child(3) { animation-delay:.2s; }
.ledger-panel.is-focused .reconciliation-summary .workflow-check { animation:checkReveal .55s ease-out .6s both; }
.ledger-panel.is-focused .chart-line { animation:tracePath 1.25s cubic-bezier(.2,.6,.2,1) both; }
.ledger-panel.is-focused .chart-line-costs { animation-delay:.12s; }
.ledger-panel.is-focused .chart-fill,.ledger-panel.is-focused .chart-endpoint { animation:softReveal .85s ease-out .45s both; }
.ledger-panel.is-focused .pay-bar { animation:barReveal .85s ease-out both; }
.ledger-panel.is-focused .tax-bar { animation-delay:.1s; }.ledger-panel.is-focused .pension-bar { animation-delay:.2s; }.ledger-panel.is-focused .net-bar { animation-delay:.35s; }
.ledger-panel.is-focused .payroll-check { animation:recordSettle .65s ease-out .2s both; }
.ledger-panel.is-focused .payroll-check:nth-of-type(2) { animation-delay:.35s; }.ledger-panel.is-focused .payroll-check:nth-of-type(3) { animation-delay:.5s; }
.ledger-panel.is-focused .pay-cycle-line { animation:barReveal .85s ease-out .45s both; }
.service-icon { display:flex;align-items:center;justify-content:center;width:40px;height:40px;border:1px solid rgba(154,120,64,.2);border-radius:5px;background:rgba(205,169,104,.06);transition:background .3s,transform .3s; }
.service-icon svg { width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:1.35;stroke-linecap:round;stroke-linejoin:round; }
.service-card:hover .service-icon { background:rgba(205,169,104,.14);transform:translateY(-2px); }
.hero-actions { flex-wrap:wrap; }
.large-type .services-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
.large-type .record-channel,.large-type .report-summary { overflow-wrap:anywhere; }

@keyframes sculptureReveal { from{opacity:0;transform:translate3d(0,38px,0) rotateY(-16deg) rotateZ(3deg) scale(.93)}to{opacity:1;transform:none} }
@keyframes metallicReveal { from{transform:translateX(-75%);opacity:0}20%{opacity:.8}75%{opacity:.65}to{transform:translateX(75%);opacity:0} }
@keyframes orbitReveal { from{opacity:0}to{opacity:.7} }
@keyframes tracePath { from{stroke-dashoffset:1}to{stroke-dashoffset:0} }
@keyframes softReveal { from{opacity:0}to{opacity:1} }
@keyframes noteReveal { from{opacity:0;transform:translateY(9px)}to{opacity:1;transform:none} }
@keyframes recordSettle { from{opacity:.25;transform:translateY(-9px)}to{opacity:1;transform:none} }
@keyframes checkReveal { from{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)} }
@keyframes barReveal { from{transform:scaleX(0)}to{transform:scaleX(1)} }

@media(max-width:1200px) { .journey-composition{gap:30px}.ledger-panel{padding:21px 23px 0}.hero-data-note{font-size:.8rem}.note-records{left:-2%}.note-insight{right:-3%}.panel-top>span:nth-child(2){font-size:.65rem}.payroll-dashboard{gap:18px} }
@media(max-width:980px) { .hero-data-note{display:none}.sculpture-motion{width:136%}.journey-composition{grid-template-columns:1fr 1fr;gap:24px}.journey-copy{height:320px}.ledger-panel{width:96%;min-height:355px;padding:20px 19px 0}.ledger-scene{min-height:385px}.panel-top>span:nth-child(2){display:none}.ledger-panel h4{font-size:1.65rem}.record-channels{gap:8px}.record-channel{padding-inline:4px}.payroll-dashboard{gap:13px;grid-template-columns:1fr 1fr}.payslip-preview{padding:10px}.payroll-check{font-size:.875rem;gap:7px}.chart-heading{align-items:flex-start}.chart-legend{flex-direction:column;gap:3px}.illustration-note{max-width:110px}.chapter-copy h3{font-size:2rem} }
@media(max-width:720px) {
  .sculpture-motion{width:100%;height:100%}.hero-sculpture{height:100%;max-height:none;width:100%}.hero-data-paths{opacity:.32}.hero-visual{height:355px}.hero-data-note{display:flex;font-size:.75rem;gap:7px}.note-index{font-size:.75rem}.note-records{left:0;top:21%}.note-insight{right:-2%;top:44%}.note-people{left:0;bottom:12%}.visual-orbit{height:74%}.hero .visual-coordinate{display:none}.visual-caption{display:none}
  .journey{height:300svh}.journey-sticky{min-height:0;padding:23px 0 16px}.journey-heading h2{font-size:1.9rem;line-height:1.04}.journey-heading>.eyebrow{margin-bottom:10px;font-size:.75rem}.journey-composition{display:flex;gap:18px;padding:22px 0 13px;justify-content:space-evenly}.journey-copy{height:220px;min-height:220px}.chapter-number{font-size:.75rem;letter-spacing:.1em;margin-bottom:9px}.chapter-copy h3{font-size:1.55rem;line-height:1.12}.chapter-copy p{font-size:1rem;line-height:1.5;margin-top:11px}.chapter-copy .underlined-link{font-size:.875rem;margin-top:12px}.ledger-scene{height:305px;min-height:305px;max-width:440px;flex:none;padding-top:0;align-items:center}.ledger-panel{width:92%;min-height:302px;padding:16px 18px 0;border-radius:6px}.panel-top{padding-bottom:10px;font-size:.75rem}.ledger-panel h4{font-size:1.45rem;line-height:1.1;margin:13px 0 15px}.record-channel{min-height:66px;gap:5px;font-size:.875rem;padding:7px 3px}.record-channel svg{width:21px;height:21px}.records-connectors{height:25px}.reconciliation-summary{min-height:37px;padding:7px 10px;font-size:.875rem;gap:8px}.ledger-mini{width:18px}.panel-footer{margin-top:13px;padding:10px 0;font-size:.75rem;gap:8px}.illustration-note{font-size:.75rem;max-width:120px}.cashflow-chart{height:107px}.chart-heading{margin-bottom:9px;align-items:center}.chart-legend{flex-direction:row;gap:8px}.dashboard-label,.chart-legend,.report-summary{font-size:.75rem}.report-summary{gap:7px}.payroll-dashboard{gap:14px;grid-template-columns:1fr 1fr}.pay-item,.pay-net,.payroll-check{font-size:.875rem}.payslip-title{margin-bottom:9px}.pay-item{margin:7px 0}.payroll-check{margin-bottom:10px}.payroll-checklist>.dashboard-label{font-size:.75rem;margin-bottom:12px}.payslip-preview{padding:9px 10px}.chapter-track{min-height:44px;padding-top:15px}.chapter-step{font-size:.875rem}.chapter-step>span{font-size:.75rem}.chapter-step:after{top:-18px}.scene-grid{background-size:30px 30px}.service-icon{width:36px;height:36px}.service-icon svg{width:21px;height:21px}
}
@media(max-width:720px) {
  .journey-composition{padding-top:10px;padding-bottom:25px}.ledger-panel h4{font-size:1.3rem;margin:8px 0 12px}.ledger-panel h4 br{display:none}.cashflow-chart{height:90px}.chart-heading>.dashboard-label{letter-spacing:0;white-space:nowrap}.chart-heading .chart-legend{flex-direction:row}.report-summary{font-size:.75rem}.panel-footer{margin-top:10px;padding:9px 0}.illustration-note{max-width:none;white-space:nowrap}
  .large-type{--header-height:155px}.large-type .header-inner{flex-wrap:wrap;align-content:center;gap:10px}.large-type .header-inner>.brand{flex-basis:100%}.large-type .brand-wordmark strong{letter-spacing:.07em}.large-type .menu-toggle{margin-left:auto}.large-type .services-grid{grid-template-columns:1fr}.large-type .ledger-panel{padding-inline:15px}.large-type .payroll-dashboard{grid-template-columns:1fr}.large-type .chart-heading{flex-wrap:wrap}.large-type .chart-heading>.dashboard-label{white-space:normal}.large-type .record-channels{grid-template-columns:1fr}.large-type .record-channel{flex-direction:row;justify-content:flex-start;padding-inline:12px}.large-type .record-channels+.records-connectors{display:none}.large-type .reconciliation-summary{margin-top:15px}.large-type .payroll-checklist{margin-top:10px}.large-type .hero h1{font-size:2.2rem}.large-type .email-link{overflow-wrap:anywhere}.large-type .hero-data-note{display:none}.large-type .panel-footer{flex-wrap:wrap}.large-type .report-summary{flex-wrap:wrap}
}
@media(max-width:400px) { .hero-visual{height:325px}.hero-data-note{font-size:.75rem}.note-records{left:-2%}.note-insight{right:-3%}.journey-copy{height:245px;min-height:245px}.record-channels{gap:6px}.record-channel{font-size:.875rem}.payroll-dashboard{gap:10px}.ledger-panel{padding-inline:15px}.chart-heading{align-items:flex-start}.chart-legend{flex-direction:column;gap:3px}.report-summary{line-height:1.4}.panel-footer{font-size:.75rem}.illustration-note{max-width:110px} }

/* Short screens and enlarged text use paired chapters in normal document flow. */
:is(.static-story,.no-motion,html:not(.js)) .journey { height:auto; }
:is(.static-story,.no-motion,html:not(.js)) .journey-sticky { position:relative;top:auto;height:auto;min-height:0;overflow:visible;padding:65px 0 45px; }
:is(.static-story,.no-motion,html:not(.js)) .journey-composition { display:grid;grid-template-columns:.9fr 1.1fr;gap:70px 70px;align-items:center;padding:55px 0; }
:is(.static-story,.no-motion,html:not(.js)) .journey-copy,
:is(.static-story,.no-motion,html:not(.js)) .ledger-scene { display:contents;height:auto;min-height:0; }
:is(.static-story,.no-motion,html:not(.js)) .chapter-copy { position:static;inset:auto;opacity:1;visibility:visible;transform:none;margin:0;max-width:450px; }
:is(.static-story,.no-motion,html:not(.js)) .ledger-panel { position:relative;width:100%;max-width:535px;transform:none!important;opacity:1!important;min-height:365px;z-index:auto!important; }
:is(.static-story,.no-motion,html:not(.js)) .chapter-copy[data-chapter="0"]{order:1}
:is(.static-story,.no-motion,html:not(.js)) .ledger-panel[data-layer="0"]{order:2}
:is(.static-story,.no-motion,html:not(.js)) .chapter-copy[data-chapter="1"]{order:3}
:is(.static-story,.no-motion,html:not(.js)) .ledger-panel[data-layer="1"]{order:4}
:is(.static-story,.no-motion,html:not(.js)) .chapter-copy[data-chapter="2"]{order:5}
:is(.static-story,.no-motion,html:not(.js)) .ledger-panel[data-layer="2"]{order:6}
:is(.static-story,.no-motion,html:not(.js)) .scene-axis,
:is(.static-story,.no-motion,html:not(.js)) .scene-grid,
:is(.static-story,.no-motion,html:not(.js)) .chapter-scroll,
:is(.static-story,.no-motion,html:not(.js)) .chapter-step:after { display:none; }
:is(.static-story,.no-motion,html:not(.js)) .chapter-track { display:none; }
@media(max-width:980px) { :is(.static-story,.no-motion,html:not(.js)) .journey-composition{grid-template-columns:1fr;gap:28px;max-width:620px}:is(.static-story,.no-motion,html:not(.js)) .chapter-copy{max-width:none;margin-top:30px}:is(.static-story,.no-motion,html:not(.js)) .chapter-copy:first-child{margin-top:0}:is(.static-story,.no-motion,html:not(.js)) .ledger-panel{min-height:345px;max-width:none}:is(.static-story,.no-motion,html:not(.js)) .journey-heading>p:last-child{display:none} }
@media(max-width:720px) { :is(.static-story,.no-motion,html:not(.js)) .journey-sticky{padding:55px 0 28px}:is(.static-story,.no-motion,html:not(.js)) .journey-composition{padding:32px 0;gap:24px}:is(.static-story,.no-motion,html:not(.js)) .chapter-copy{margin-top:25px}:is(.static-story,.no-motion,html:not(.js)) .ledger-panel{min-height:302px}:is(.static-story,.no-motion,html:not(.js)) .chapter-copy h3{font-size:1.8rem}:is(.static-story,.no-motion,html:not(.js)) .journey-heading h2{font-size:2.5rem} }
.no-motion .sculpture-motion,.no-motion .sculpture-reveal { transform:none!important;animation:none!important; }
.no-motion .hero-data-paths,.no-motion .hero-data-note,.no-motion .visual-caption,.no-motion .visual-orbit,
.no-motion .ledger-panel * { animation:none!important;transition:none!important; }
.no-motion .sculpture-highlight { display:none; }
.no-motion .hero-path,.no-motion .records-connectors path,.no-motion .chart-line { stroke-dashoffset:0; }
@media(max-width:720px) {
  .large-type h2{font-size:1.5rem!important;line-height:1.18!important}.large-type .principles-strip{display:block}.large-type .principles-strip>span{display:block;border:0;text-align:left;padding:10px 0}.large-type .hero-bottom{flex-wrap:wrap;height:auto;padding:24px 0;gap:18px}.large-type .panel-top{flex-wrap:wrap}.large-type .reconciliation-summary{flex-wrap:wrap}.large-type .footer-bottom>span{white-space:normal;max-width:100%}
}
@media(prefers-reduced-motion:reduce) { .sculpture-motion,.sculpture-reveal{transform:none!important;animation:none!important}.sculpture-highlight{display:none}.hero-path,.records-connectors path,.chart-line{stroke-dashoffset:0!important} }
@media print { .hero-data-note,.hero-data-paths,.sculpture-motion{display:none!important} }