/* Readable controls and compact small-screen layouts, after section-flow.css. */
:root{--field-boundary:#74827c;--focus-reading:#00746b;--compact-card-space:20px}

/* Empty fields remain identifiable on both paper and cream surfaces. */
:is(.home-story .review-form-wrap,.inner-page .site-form) :is(input,select,textarea){border-color:var(--field-boundary)}
:is(.home-story .review-form-wrap,.inner-page .site-form) :is(input,select,textarea):focus-visible{outline:3px solid var(--focus-reading);outline-offset:3px}
.client-logo-toggle{min-width:44px;min-height:44px;padding:9px 12px;border:1px solid var(--field-boundary);border-radius:3px;font-size:14px;line-height:1.5}
.client-logo-toggle[aria-pressed=true]{background:var(--navy);color:var(--cream);border-color:var(--navy)}
.client-logo-toggle:focus-visible{outline:3px solid var(--focus-reading);outline-offset:4px}

@media(max-width:1100px){
 .inner-page .site-form label{font-size:14px;line-height:1.5}
 .site-header .nav-simplified .mega-column small{font-size:14px;line-height:1.5}
}

@media(max-width:1000px){
 /* Let related material sit closer together without changing reading order. */
 :is(.inner-page,.case-study-page){--content-gap:28px}
 .inner-page .brand-heading{margin-bottom:24px}
 .inner-page .brand-feature-list article,.inner-page .brand-feature-list article:first-child{padding-block:20px}
 .inner-page .brand-feature-list h3{margin-bottom:8px}
}

@media(max-width:700px){
 :is(.home-story,.inner-page,.case-study-page){--opening-body-gap:16px;--opening-content-gap:24px}
 .inner-page .site-form :is(input,select,textarea),.home-story .review-form-wrap :is(input,select,textarea){font-size:16px}
 .client-logo-heading{gap:12px;align-items:center}
 .client-logo-heading .eyebrow{min-width:0}
 .client-logo-toggle{flex-shrink:0}

 /* The headings and introductions stay full size; repeated card space reduces. */
 .home-story #our-services .ai-flagship-strip{padding:20px;gap:16px;margin-bottom:16px}
 .home-story #our-services .ai-flagship-strip h3{font-size:27px}
 .home-story #our-services .service-grid-primary{gap:16px}
 .home-story #our-services .service-grid-primary>.service-card{display:grid;grid-template-columns:44px minmax(0,1fr);column-gap:12px;align-content:start;padding:16px}
 .home-story #our-services .service-grid-primary .service-icon{grid-column:1;grid-row:1/3;align-self:center;margin:0}
 .home-story #our-services .service-grid-primary .eyebrow{grid-column:2;grid-row:1;align-self:end;margin:0 0 4px}
 .home-story #our-services .service-grid-primary h3{grid-column:2;grid-row:2;align-self:start;font-size:26px;margin:0}
 .home-story #our-services .service-grid-primary p:not(.eyebrow){grid-column:1/-1;grid-row:3;line-height:1.65;margin:12px 0 0}
 .home-story #our-services .service-grid-primary .text-link{grid-column:1/-1;grid-row:4;min-height:44px;margin:8px 0 0;padding:4px 0;justify-self:start}
 .home-story #our-services .supporting-services{gap:14px;margin-top:20px}
 .home-story #our-services .supporting-services p{padding-top:12px}
 .home-story #our-services .supporting-services span{margin-top:4px;line-height:1.6}

 /* Proof keeps every metric, period and source; screenshots use a shorter window. */
 .home-story .work-grid{gap:16px}
 .home-story .work-card .showcase-viewport{aspect-ratio:16/6}
 .home-story .work-card .work-copy{display:grid;grid-template-columns:108px minmax(0,1fr);column-gap:12px;row-gap:0;align-items:start;padding:16px}
 .home-story .work-card .work-copy>.client-logo-compact{grid-column:1;grid-row:1/3;width:100%;height:48px;max-width:108px;margin:0;padding:4px}
 .home-story .work-card .work-copy>.eyebrow{grid-column:2;grid-row:1;margin:0 0 4px}
 .home-story .work-copy h3{grid-column:2;grid-row:2;font-size:22px;line-height:1.2;margin:0}
 .home-story .work-copy .result{grid-column:1;grid-row:3;font-size:32px;line-height:1.15;margin:16px 0 0}
 .home-story .work-copy .result-label{grid-column:2;grid-row:3;align-self:center;line-height:1.5;margin:16px 0 0}
 .home-story .work-copy .small{grid-column:1/-1;grid-row:4;font-size:14px;line-height:1.5;margin:12px 0 0}
 .home-story .work-reviews{margin-top:24px;padding-top:20px}
 .home-story .google-review-scroll .google-review{padding:18px}

 /* The book remains a cover and open pages, with less repeated internal margin. */
 .home-story .growth-book{gap:20px;padding-bottom:4px}
 .home-story .growth-book .book-cover{min-height:185px;padding:16px 18px 16px 22px}
 .home-story .growth-book .book-logo{width:80px;margin-bottom:8px}
 .home-story .growth-book .book-cover h3{font-size:26px;margin-bottom:8px}
 .home-story .growth-book .cover-footer{margin-top:8px}
 .home-story .growth-book .book-page{padding:16px 18px 24px}
 .home-story .growth-book .book-page h3{margin-bottom:8px}
 .home-story .growth-book .book-kicker{margin-bottom:8px}
 .home-story .growth-book .book-page-left>p:not(.book-kicker,.book-page-note){margin-bottom:0}
 .home-story .growth-book .book-page-right h3 br{display:none}
 .home-story .growth-book .book-page .journey li{padding-block:7px}
 .home-story .growth-book .book-page .journey h4,.home-story .growth-book .book-page .journey p{display:inline;margin:0}
 .home-story .growth-book .book-page .journey h4{margin-right:5px;font-size:18px;line-height:1.4}
 .home-story .growth-book .book-page-note{padding-top:8px;margin-bottom:8px;line-height:1.5}

 .home-story .problems .problem-grid{gap:16px;margin-top:24px}
 .home-story .problems .problem-grid article{padding:20px}
 .home-story .guide-grid{gap:16px}
 .home-story .guide-grid .guide{min-height:0;padding:20px}
 .home-story .guide-grid .guide h3{font-size:27px;max-width:none}
 .home-story .guide-grid .guide .text-link{padding-top:14px}
 .home-story .people-grid{gap:28px;padding-top:24px}
 .home-story .people-bottom{margin-top:24px;padding-top:20px}

 /* The whole map remains visible; reducing its reserved window avoids cropping. */
 .market-grid{gap:20px}
 .market-map .city-map-image,.market-single .city-map-image{height:160px;aspect-ratio:auto;object-fit:contain}
 .market-map .map-heading{padding:12px 16px}

 /* Branded service illustrations keep their original artwork and natural height. */
 .inner-page .brand-feature-grid,.inner-page .brand-budget-grid,.inner-page .brand-technical-grid,.inner-page .brand-opening-grid,.inner-page .brand-plan{row-gap:24px}
 .inner-page .brand-feature-list article,.inner-page .brand-feature-list article:first-child{padding-block:18px}
 .inner-page .brand-prose{line-height:1.75}
 .inner-page .brand-visual{min-height:300px;padding:20px}
 .inner-page .brand-visual .mini-results{margin-top:72px;margin-bottom:44px}
 .inner-page .brand-visual .brand-phone{height:315px;margin-block:24px}
 .inner-page .brand-visual .care-sheet{padding:24px;margin-top:20px}
 .inner-page .brand-visual .clarity-sheet{padding:24px;margin-top:20px}
 .inner-page .brand-book-cover{margin-top:20px;margin-bottom:8px;max-width:250px}
 .inner-page .brand-book-cover .service-notebook,.inner-page .plan-chapter .service-notebook{min-height:310px;padding:22px}
 .inner-page .plan-chapter .service-notebook{margin-top:16px}
 .inner-page .brand-plan-paper{padding:24px}
 .inner-page .brand-plan-paper ol{margin-block:24px}
 .inner-page .brand-plan-paper li{padding-block:12px}
 .inner-page .brand-plan-paper h3{margin-block:4px 8px}
 .inner-page .brand-proof .site-proof-copy{padding:20px}
 .inner-page .brand-proof .site-proof-copy>strong{margin-block:18px 10px}
 .inner-page .site-link-grid article{padding:20px}
 .inner-page .brand-links .site-link-grid article,.inner-page .brand-links .site-link-grid article+article{padding-block:20px}
 .inner-page .dn-editorial-layout{gap:20px}
}

@media(max-width:499px){
 .home-story{--home-section-space:32px}
 /* A small complete illustration beside the copy avoids six tall stacked scenes. */
 .home-story #industries-we-help .industry-grid{grid-template-columns:minmax(0,1fr);gap:12px;margin-bottom:0}
 .home-story #industries-we-help .industry-card{display:grid;grid-template-columns:92px minmax(0,1fr);align-items:stretch;min-height:0}
 .home-story #industries-we-help .industry-illustration{height:100%;min-height:124px;align-items:center;padding:8px}
 .home-story #industries-we-help .industry-illustration img{height:108px;width:100%;object-fit:contain}
 .home-story #industries-we-help .industry-copy{min-width:0;padding:16px}
 .home-story #industries-we-help .industry-card h3{font-size:19px;line-height:1.25;margin-bottom:8px}
 .home-story #industries-we-help .industry-card p{font-size:14px;line-height:1.6;margin-bottom:0}
}

@media(max-width:360px){
 .home-story #industries-we-help .industry-card{grid-template-columns:76px minmax(0,1fr)}
 .home-story #industries-we-help .industry-copy{padding:16px 14px}
 .home-story #industries-we-help .industry-card h3{font-size:18px}
 .home-story .work-card .work-copy{grid-template-columns:76px minmax(0,1fr)}
 .home-story .work-copy .result{grid-column:1/-1;grid-row:3;margin-top:12px}
 .home-story .work-copy .result-label{grid-column:1/-1;grid-row:4;margin-top:6px}
 .home-story .work-copy .small{grid-row:5}
}
/* Retained section destinations stay useful after duplicated content is merged. */
.usability-anchor{display:block;height:0;scroll-margin-top:100px}
