/* Refine the authored SynOct design. Egos, MatrixType, colours and art stay canonical. */
main .page-hero{padding:64px 0 44px}
main .page-hero .eyebrow{margin-bottom:18px}
main .page-hero h1{font-size:clamp(30px,3.8vw,54px)!important;line-height:1.2!important;max-width:24ch;text-wrap:balance}
main .page-hero .kicker{max-width:65ch;line-height:1.7;margin:24px 0 0}
main>.section{padding-block:64px}
main .section-head{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:40px;align-items:end;margin-bottom:32px}
main .section-head .eyebrow{margin-bottom:16px}
main .section-intro{margin:0;line-height:1.7}
main .grid-2,main .grid-3{gap:20px}
main .card{display:flex;flex-direction:column;min-width:0;padding:28px}
main .card h3{margin:22px 0 16px;line-height:1.4!important}
main .card p{line-height:1.7}
main .card .card-link{margin-top:auto;padding-top:24px;min-height:44px;color:var(--orange);align-self:flex-start;line-height:1.5}
main .service-detail{gap:24px 36px;padding:32px 0;align-items:start}
main .service-detail h3{line-height:1.5!important}
main .service-detail li{padding-left:4px;margin:0 0 10px}
main .service-detail li::marker{color:var(--orange)}
main .work-filter{gap:10px;margin-bottom:32px}
main .work-filter button{padding:12px 18px}
main .about-grid{gap:48px;align-items:start}
main .manifesto{line-height:1.25;max-width:24ch}
main .principle{padding:24px 0;grid-template-columns:36px minmax(0,1fr);gap:18px;line-height:1.7}
main .hire-grid{gap:48px;align-items:start}
main .hire-card{padding:30px}
main .field{margin-bottom:20px}
main .field label{line-height:1.6;margin-bottom:9px}
main .field input,main .field select{min-height:48px}
main .field textarea{min-height:160px;line-height:1.6}
main .hire-card>.btn{width:100%;line-height:1.5;padding:14px 18px}
main .ollie-page{gap:32px}
main .ollie-page .chat-shell{height:clamp(460px,76svh,760px);min-height:0}
main .ollie-page .messages{min-height:0;max-height:none;flex:1}
main .ollie-page .chat-head,main .ollie-page .chat-compose{flex-shrink:0}
main .ollie-profile{padding:26px}
main .ollie-profile p{line-height:1.7}
.legal-shell{line-height:1.85}
.legal-shell>h2{padding-top:14px;border-top:1px solid var(--line2)}
.legal-shell li{margin-block:12px}
.legal-shell .data-table{line-height:1.75}
/* Keep the large authored mark. Remove excess empty space, never the identity. */
main .hero-v4{padding:48px 0 54px}
main .hero-company-mark{margin-bottom:18px}
main .hero-actions{margin-top:28px}
main .atlas-flagship{padding:54px 0 64px!important}
main #synoct-atlas-flagship .eyebrow{font-size:12px}
main #synoct-atlas-flagship .af-copy{max-width:700px;line-height:1.7}
main .original-ollie-section .ollie-northstar-grid{margin-top:0}
main .original-ollie-section .proof-strip{margin-top:36px}
main .what-we-do .proof-note{padding-block:16px}
main .what-we-do>h2{line-height:1.35!important}
main .what-we-do .proof-note b{line-height:1.5}
main .hero-actions .atlas-jump{color:var(--orange);border-color:rgba(248,88,0,.45)}
main :where(h1,h2,h3,[id]){scroll-margin-top:100px}
@media(max-width:980px){
 main .section-head{grid-template-columns:1fr;gap:20px}
 main .about-grid,main .hire-grid{gap:32px}
 main .ollie-profile{position:static}
 main .ollie-page{gap:24px}
}
@media(max-width:640px){
 main .wrap{width:calc(100% - 40px)!important}
 main .page-hero{padding:40px 0 32px}
 main .page-hero h1{font-size:clamp(27px,7.7vw,40px)!important}
 main .page-hero .kicker{font-size:17px;line-height:1.7}
 main>.section{padding-block:44px}
 main .section-head{margin-bottom:26px}
 main .card{padding:24px}
 main .service-detail{padding-block:26px}
 main .hire-card{padding:20px}
 main .hero-v4{padding:34px 0 38px}
 main .synoct-wordmark{font-size:clamp(40px,12.3vw,72px)!important;line-height:1.12!important;margin-top:20px!important;margin-bottom:22px!important}
 main .hero-company-mark{width:64px;height:64px}
 main .niche-line{font-size:18px;line-height:1.6}
 main .hero-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:24px}
 main .hero-actions .btn{padding:14px 10px;line-height:1.5}
 main .atlas-flagship{padding:40px 0 44px!important}
 main #synoct-atlas-flagship .af-copy{font-size:18px;margin-top:24px}
 main #synoct-atlas-flagship .af-sign{font-size:12px;line-height:1.8;letter-spacing:.1em}
 main #synoct-atlas-flagship .af-heading{font-size:clamp(30px,8.8vw,48px)!important}
 main .original-ollie-section .ollie-center{padding:20px 16px}
 main .what-we-do{gap:12px}
 main .ollie-profile{padding:22px}
 main .ollie-page .chat-shell{height:clamp(460px,76svh,660px)}
}
@media(prefers-reduced-motion:reduce){main .card{transition:none}}

/* Give Ollie's launcher its own space on narrow screens, clear of page content. */
.ollie-launcher-row,.ollie-launcher-inner{display:contents}
.ollie-launcher-label{display:none}
.ollie-drawer .chat-head{position:relative;padding-right:62px}
.ollie-close{position:absolute;right:8px;top:8px;width:44px;height:44px;border:1px solid var(--line2);border-radius:10px;background:var(--panel,#111c23);color:var(--orange);font:28px/1 system-ui;cursor:pointer}
.ollie-close:focus-visible{outline:2px solid var(--orange);outline-offset:3px}
@media(max-width:980px){
 .ollie-launcher-row{display:block;padding:24px 20px;border-top:1px solid var(--line2)}
 .ollie-launcher-inner{display:flex;align-items:center;justify-content:center;gap:18px}
 .ollie-launcher-row .ollie-fab{position:static;flex:0 0 64px}
 .ollie-launcher-label{display:block;color:var(--orange);font-size:20px;font-weight:700}
 .ollie-drawer{bottom:8px;height:min(590px,calc(100dvh - 16px))}
}