/* Attua / approved navy and cream identity. */
:root{
  --navy:#012138;--white:#f0f0e8;
  --color-indigo-strike:var(--navy);--color-deep-indigo:#001827;
  --color-bone:var(--white);--color-paper:var(--white);--color-ink:var(--navy);
  --blue:var(--navy);--bone:var(--white);--line:rgba(240,240,232,.35);
}
body{background:var(--navy);color:var(--white)}
body:after{content:'';position:fixed;inset:0;z-index:60;pointer-events:none;opacity:.025;background-image:url('assets/print-grain.svg')}
::selection{background:var(--white);color:var(--navy)}
h1,h2,h3{font-weight:400;text-transform:none}
.brand{background:var(--navy);color:var(--white)}
.brand-symbol{color:var(--white)}
.header-nav{color:var(--white)}
.contact-icon{background:var(--navy);color:var(--white)}
.contact-icon:hover{color:var(--white)}
.menu-toggle,.menu-close{background:var(--white);color:var(--navy)}
dialog,dialog::backdrop{background:var(--navy);color:var(--white)}
.menu-inner nav a{border-color:var(--line)}
.menu-inner nav a:hover{color:var(--white)}
.hero{background:var(--navy);color:var(--white)}
.hero-image{background:var(--navy)}
.hero-image:after{background:rgba(1,33,56,.15)}
.hero-image img{filter:grayscale(1);mix-blend-mode:screen;opacity:.45}
.hero-image.ready img{opacity:0}
.hero-rules i{background:var(--line)}
.hero-link{border-color:var(--line)}
.hero-link>span{color:var(--white)}
.hero-link:hover{border-color:var(--white)}
.introduction{background:var(--navy);color:var(--white)}
.stairs i{background:#0b3047}
.roadmap-mark span{background:var(--white)}
.roadmap-mark span:last-child{background:var(--white)}
.wide-link{background:transparent;color:var(--white);border:1px solid var(--line)}
.wide-link>span{color:var(--white)}
.wide-link:hover{background:#0b3047;border-color:var(--white)}
.human-intro h2,.human-question,.human-note{background:var(--navy)}
.paper{background:var(--white);color:var(--navy)}
.paper-title,.paper p{border-color:var(--navy)}
.plate{background:var(--navy);border:1px solid var(--line)}
.plate i{border-color:var(--white)}
.plate-fit i:nth-child(3),.plate-people i:nth-child(3),.plate-build i{background:var(--white)}
.portrait-image{background:var(--navy)}
.sam-copy,.questions article{border-color:var(--line)}
.contact{background:var(--navy);color:var(--white)}
.contact-form,textarea,.contact-cta,.footer-meta{border-color:var(--line)}
textarea{color:var(--white)}textarea::placeholder{color:#abb7bf}
.contact-cta>span:last-child{color:var(--white)}
.contact-cta:hover{border-color:var(--white)}
.footer-wordmark{font-weight:400;text-transform:none}
.footer-wordmark>span{color:var(--white)}
@media print{body:after{display:none}body,.hero,.introduction,.contact,.human-intro h2,.human-question,.human-note{background:white;color:black}.paper{color:black}.roadmap-mark,.plate{display:none}}

/* Pixel-print reference: precise type, stippled surfaces, small modular marks. */
body:after{background-image:url('assets/print-stipple.svg');opacity:.065;mix-blend-mode:screen}
.brand-symbol{transform:none;align-items:flex-end;gap:3px}.brand-symbol i{height:12px}.brand-symbol i:nth-child(2){height:21px}.brand-symbol i:nth-child(3){height:30px}
.hero-caption:after{content:'';display:block;width:84px;height:20px;background:url('assets/pixel-rhythm.svg') left center / contain no-repeat;margin-top:18px;opacity:.8}
.eyebrow{display:inline-block;align-self:flex-start;border:1px solid var(--line);padding:10px 13px;font-size:11px;letter-spacing:.035em}
.section-top{align-items:center;padding-top:22px;gap:15px}
.section-top>span:first-child{border:1px solid var(--white);padding:10px 14px;letter-spacing:.025em}
.section-top>span:last-child{font-size:10px;letter-spacing:.04em}
.paper:before{content:'';position:absolute;inset:0;background:url('assets/print-stipple.svg');opacity:.07;mix-blend-mode:multiply;pointer-events:none}
.paper:after{content:'';position:absolute;right:22px;bottom:9px;width:50px;height:12px;background:url('assets/pixel-rhythm-ink.svg') center / contain no-repeat;opacity:.7;pointer-events:none}
.paper p{padding-bottom:37px}
.plate{border-color:var(--line);background-position:center;background-repeat:no-repeat;background-size:auto 90%}
.plate i{visibility:hidden}
.plate-fit{background-image:url('assets/pixel-fit.svg')}
.plate-people{background-image:url('assets/pixel-people.svg')}
.plate-build{background-image:url('assets/pixel-build.svg')}
.sam-portrait figcaption{border-bottom:1px solid var(--line);padding:12px 0}
footer:before{content:'';display:block;width:100%;max-width:800px;height:50px;margin-top:80px;background:url('assets/pixel-dissolve.svg') left center / 100% 100% no-repeat;opacity:.85}
.footer-wordmark{margin-top:50px}
@media(max-width:700px){
 .brand-symbol{transform:scale(.85)}
 .hero-caption:after{width:65px;height:16px;margin-top:15px}
 .section-top{align-items:flex-start;gap:12px}
 .section-top>span:first-child{padding:9px;font-size:9px;white-space:nowrap}
 .section-top>span:last-child{font-size:9px;max-width:120px;text-align:right;padding-top:8px}
 .eyebrow{font-size:10px;padding:10px}
 .paper:after{right:17px;bottom:7px;width:42px;height:10px}
 .paper p{padding-bottom:34px}
 footer:before{margin-top:55px;height:28px}
 .footer-wordmark{margin-top:35px}
}
@media print{.hero-caption:after,.paper:after,footer:before{display:none}}

/* Generated landscape dither: retain its own ink colours and print pattern. */
.hero-image img{filter:none;mix-blend-mode:normal;opacity:1}
.hero-image.ready img{opacity:0}
.hero-image:after{background:rgba(1,33,56,.12)}
/* Small navy labels keep navigation legible over the pale dithered cloud. */
.header-nav>div{width:fit-content;background:var(--navy);padding:8px 12px;margin:-8px -12px}
.hero-caption{background:var(--navy);padding:14px 16px;width:max-content;max-width:24%}
@media(max-width:700px){.hero-caption{padding:12px 14px;max-width:61%}}

/* The cloud opening has a reading hold followed by a gradual native sticky passage; the rest stays in normal flow. */
.hero-scroll{position:relative}
.hero-scroll.cloud-enabled{height:300svh;min-height:2100px}
.cloud-enabled .hero{position:sticky;top:0;height:100svh;max-height:none;background:var(--navy);isolation:isolate}
.cloud-enabled .hero-image{z-index:2;background:transparent;transform:none!important;pointer-events:none}
.cloud-enabled .hero-image:after{display:none}
.cloud-enabled .hero h1,.cloud-enabled .hero-caption,.cloud-enabled .hero-link,.cloud-enabled .hero-rules,.cloud-enabled .scroll-label{z-index:3;opacity:var(--opening-opacity,1);transform:translate3d(0,var(--opening-y,0px),0)}
.cloud-enabled .hero.opening-cleared h1,.cloud-enabled .hero.opening-cleared .hero-caption,.cloud-enabled .hero.opening-cleared .hero-link,.cloud-enabled .hero.opening-cleared .hero-rules,.cloud-enabled .hero.opening-cleared .scroll-label{visibility:hidden}
.hero-reveal{position:absolute;inset:0;z-index:1;display:flex;align-items:center;padding:100px 7%;opacity:var(--arrival-opacity,0);transform:translate3d(0,var(--arrival-y,38px),0);pointer-events:none}
.hero-reveal .intro-lead{font-size:clamp(32px,3.65vw,60px);line-height:1.12;letter-spacing:-.035em;max-width:1240px}
.hero-reveal .word>span{transform:none!important;opacity:1!important;transition:none}
.cloud-introduction{padding-top:0}
.cloud-introduction .intro-columns{margin-top:0;padding-top:50px}
@media(max-width:700px){
 .hero-scroll.cloud-enabled{height:260svh;min-height:calc(740px + 160svh)}
 .hero-reveal{padding:100px 24px 75px}
 .hero-reveal .intro-lead{font-size:clamp(28px,7.5vw,38px);line-height:1.16;letter-spacing:-.035em}
 .cloud-introduction .intro-columns{padding-top:30px}
}
@media(prefers-reduced-motion:reduce){.hero-scroll.cloud-enabled{height:auto;min-height:0}.cloud-enabled .hero{position:relative}.hero-reveal{transform:none}}
@media print{.hero-scroll.cloud-enabled{height:auto;min-height:0}.cloud-enabled .hero{position:relative;height:auto}.hero-reveal{position:static;opacity:1;transform:none;padding:30px 0}.cloud-enabled .hero h1{visibility:visible;opacity:1;transform:none}}

/* Assessment: one readable thought, then a clear problem / deliverable pair. */
.introduction{padding-bottom:105px}
.intro-columns{margin-bottom:0}
.approach{margin:0 4%;padding:70px 0 95px;border-top:1px solid var(--line)}
.approach:before{display:none}
.approach-heading{margin-bottom:65px;transition:opacity .8s ease,transform 1s cubic-bezier(.2,.65,.2,1)}
.motion .approach-heading.pending{opacity:0;transform:translate3d(0,24px,0)}
.approach-label{font-size:11px;margin-bottom:30px;color:var(--white)}
.approach-heading h2{font-size:clamp(48px,6.8vw,110px);line-height:1.02;letter-spacing:-.045em;max-width:1150px}
.approach-grid{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:8%}
.approach-aside{padding:0}
.approach-aside .aside-statement{font-size:clamp(22px,1.9vw,30px);max-width:490px}
.approach-aside .aside-question{font-size:18px;line-height:1.4;margin:26px 0 0;max-width:400px}
.approach-aside .aside-caption{align-self:auto;max-width:350px;margin:45px 0 0;padding-top:20px;border-top:1px solid var(--line);font-size:11px;line-height:1.6}
.approach-content .body-lead{font-size:22px;line-height:1.35;max-width:670px}
.approach-content .scope{margin:30px 0;max-width:560px;font-size:11px;line-height:1.6}
.approach-content .detail-content{padding:12px 45px 25px 0;font:400 17px/1.5 var(--sans);text-transform:none;max-width:620px}
.approach-content summary{font-size:clamp(22px,1.8vw,29px);padding:22px 0;line-height:1.2}
.approach-content .wide-link{margin-top:25px}
@media(max-width:700px){
 .introduction{padding-bottom:60px}
 .approach{margin:0 20px;padding:50px 0 60px}
 .approach-heading{margin-bottom:38px}
 .approach-label{font-size:9px;margin-bottom:23px}
 .approach-heading h2{font-size:clamp(37px,9.8vw,65px);line-height:1.05}
 .approach-grid{display:block}
 .approach-aside .aside-statement{font-size:23px}
 .approach-aside .aside-question{font-size:17px}
 .approach-aside .aside-caption{margin-top:25px;font-size:10px;max-width:100%}
 .approach-content{margin-top:42px}
 .approach-content .body-lead{font-size:21px}
 .approach-content .scope{margin:25px 0}
 .approach-content summary{font-size:23px;padding:20px 0}
 .approach-content .detail-content{font-size:16px;padding-right:20px}
}
@media(prefers-reduced-motion:reduce){.motion .approach-heading.pending{opacity:1;transform:none}}
@media print{.motion .approach-heading.pending{opacity:1;transform:none}}

/* An ink-like dot field moves beneath the content, without intercepting input. */
.introduction,.approach,.human,.implementation,.sam,.contact{position:relative;isolation:isolate}
.ambient-field{position:absolute;inset:0;width:100%;height:100%;z-index:-1;pointer-events:none;contain:strict}
@media print{.ambient-field{display:none}}

/* Cream assessment chapter. Its v16 transition lives in ink-transition.css. */
.approach:after{content:'';position:absolute;inset:0;background:url('assets/print-stipple.svg');opacity:.055;mix-blend-mode:multiply;pointer-events:none}
.approach{margin:0;padding:85px 4% 105px;background:var(--white);color:var(--navy);--line:rgba(1,33,56,.28);border-top:0}
.approach:after{z-index:-1}
.approach-label{color:var(--navy)}
.approach .wide-link{color:var(--navy);border-color:var(--navy)}
.approach .wide-link>span{color:var(--navy)}
.approach .wide-link:hover{background:var(--navy);color:var(--white)}
.approach .wide-link:hover>span{color:var(--white)}
.approach a:focus-visible,.approach summary:focus-visible{outline:2px solid var(--navy);outline-offset:6px}
.menu-toggle{border:1px solid var(--navy)}
@media(max-width:700px){
 .approach{margin:0;padding:50px 20px 65px}
}
@media print{.approach{background:white;color:black}.approach:after{display:none}}
