/* Page additions from the September 26, 2026 audit. Loaded on every page after style.css.
   Markup lives in site/build.py. Small orange text uses --asc-orange-text (defined in style.css). */

/* Line breaks that only help wide layouts. Each is preceded by a space, so hiding it keeps words apart. */
@media(max-width:760px){.br-wide{display:none}}
/* A heading made of two sentences keeps each sentence on its own line(s) at every width; each is balanced separately. */
.h-line{display:block}

/* Services: one practical task first, then areas with one illustrative example each. */
.services-hero{padding-bottom:84px}
.services-hero .lead{max-width:720px}
.area-links{display:flex;flex-wrap:wrap;gap:10px;margin-top:36px}
.area-links a{display:inline-flex;align-items:center;min-height:44px;padding:9px 18px;border:1px solid #b8c1ba;border-radius:30px;background:#fff;font-size:.9375rem;line-height:1.3}
.area-links a:hover{background:var(--wash)}
.service-list-note{max-width:640px;margin:0 0 22px}
.service-example{margin-top:24px;padding:16px 20px 18px;border-left:2px solid var(--asc-orange);border-radius:0 10px 10px 0;background:#fff}
.service-example .example-label{margin:0 0 6px;font-size:.8125rem;letter-spacing:.01em;color:var(--asc-orange-text,#B5410E)}
.service-example p:last-child{margin:0;font-size:1rem;line-height:1.65;color:var(--asc-ink)}
.yours-title{margin:38px 0 12px;--fs:1.375rem;letter-spacing:-.025em;color:var(--asc-green)}
.yours-list{list-style:none;margin:0 0 30px;padding:0}
.yours-list li{position:relative;padding:11px 0 11px 24px;border-top:1px solid #d3dbd2;font-size:1.0625rem;line-height:1.55;color:var(--asc-ink)}
.yours-list li:last-child{border-bottom:1px solid #d3dbd2}
.yours-list li::before{content:'';position:absolute;left:2px;top:21px;width:8px;height:8px;border-radius:50%;background:var(--asc-success)}
.managed .handoff{margin:0;font-size:1.0625rem}

/* About: the principles are a real section with a heading. */
.principles h2{max-width:820px}
.principles-lead{max-width:700px;margin:24px 0 0;font-size:1.1875rem;line-height:1.75;color:var(--asc-muted)}

/* Insights: a compact, honest empty state. */
.page-empty{padding-bottom:110px}
.page-empty h1{max-width:860px;--fs:4.25rem}
.page-empty .lead{max-width:620px}
.page-empty .button{margin-top:36px}

/* Contact: embedded inquiry form with direct-link and email alternatives. */
.contact-hero{padding-bottom:60px}
.contact-hero .lead{max-width:720px}
/* .contact-layout prefix outranks style.css .contact-info h2 (2.25rem). */
.contact-layout .contact-label{margin:0 0 16px;--fs:1.5rem;line-height:1.2;letter-spacing:-.03em}
.contact-info .contact-label{margin-bottom:14px}
.contact-info .email-link{font-size:1.125rem}

@media(max-width:760px){
 .services-hero{padding-bottom:56px}
 .area-links{gap:8px;margin-top:28px}
 .area-links a{padding:8px 14px;font-size:.875rem}
 .service-example{padding:14px 16px 16px}
 .yours-title{margin-top:30px}
 .yours-list li{font-size:1rem}
 .principles-lead{font-size:1.0625rem}
 .page-empty{padding-bottom:72px}
 .page-empty h1{--fs:2.25rem}
 .contact-hero{padding-bottom:36px}
 .contact-hero .lead{font-size:1.0625rem;margin-top:22px}
 .contact-layout{gap:36px}
 .contact-layout .contact-label{--fs:1.3125rem}
}
/* Keep the About independence statement at fine-print size on phones too (style.css phone rule enlarged it). */
.about-story>div>p.fine{font-size:.875rem}

/* Round 1 review fixes (September 26, 2026). */
/* Services: below 1000px the area rows and the managed-service block stack, so the heading no longer sits beside a tall
   empty column next to the example (V8). */
@media(max-width:999px) and (min-width:761px){
 .service-row{grid-template-columns:minmax(0,1fr);gap:18px;padding:36px 0}
 .service-row>div{max-width:680px}
 .overview{grid-template-columns:minmax(0,1fr);gap:28px}
 .overview-body{padding-top:0;max-width:680px}
}
/* Three-column card grids (About principles, Services steps) stack when their section is narrower than 40rem. At default
   text size that is only below 640px, where they are already one column; with enlarged text it keeps the h3 headings
   larger than the body copy instead of capping them to a third of the width (SUITE-R1-01). */
@container (max-width:40rem){.principle-grid,.steps{grid-template-columns:minmax(0,1fr);gap:32px}}
/* Centred short copy balances its lines; list descriptions avoid a lone last word (V4). */
.flow-finale .flow-desc,.flow-intro p{text-wrap:balance}
.bridge-areas li a>span:not(.bridge-arrow){text-wrap:pretty}
/* About: explain the first engagement without a separate demonstration. */
.principles .principles-process{margin-top:24px}

@media(min-width:761px) and (max-width:1199px){.page-empty h1{--fs:3rem}}

@media(min-width:400px) and (max-width:479px){.page-empty h1{--fs:2.4375rem}}
@media(min-width:480px) and (max-width:760px){.page-empty h1{--fs:2.875rem}}
@media(min-width:1100px) and (max-width:1199px){.page-empty h1{--fs:3.5rem}}
@media(min-width:1200px) and (max-width:1399px){.page-empty h1{--fs:3.875rem}}

/* Current refinement: task-led services and a short original Insights guide. */
.services-hero{padding-bottom:56px}
.services-hero .lead{max-width:690px}
.services-cta{margin-top:28px}
.area-links{margin-top:30px;padding-top:28px;border-top:1px solid var(--line)}
.service-row{grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:70px;padding-block:40px}
.service-row .service-pain{max-width:350px;font-size:1rem;line-height:1.65;margin:18px 0 0;color:var(--asc-muted)}
.service-example{margin-top:20px}
.service-example .example-label{font-size:.875rem}
.steps-section{padding-top:80px;padding-bottom:70px}
.about-story{padding-top:80px;padding-bottom:80px}
.principles-lead{max-width:660px}
.insights-hero{padding-bottom:60px}
.insight-guide{max-width:var(--page);margin:auto;padding:0 32px 90px;display:grid;grid-template-columns:1fr 1fr;gap:80px}
.guide-intro{border-top:1px solid var(--line);padding-top:32px}
.guide-intro h2{--fs:2.5rem}
.guide-intro>p:not(.eyebrow){max-width:440px;color:var(--asc-muted);margin:24px 0 0;font-size:1.0625rem}
.guide-questions{list-style:none;padding:0;margin:0}
.guide-questions li{display:grid;grid-template-columns:32px minmax(0,1fr);gap:14px;border-top:1px solid var(--line);padding:26px 0}
.guide-questions li>span{font-size:.875rem;color:var(--asc-orange-text);padding-top:3px}
.guide-questions h3{--fs:1.625rem;margin-bottom:12px}
.guide-questions p{font-size:1rem;color:var(--asc-muted);margin:0}
@media(max-width:999px){.service-row{grid-template-columns:minmax(0,1fr);gap:22px}.service-row .service-pain{max-width:600px}}
@media(max-width:760px){
 .services-hero{padding-bottom:40px}.services-cta{margin-top:24px}.area-links{margin-top:24px;padding-top:24px}
 .service-row{padding-block:28px}.service-row .service-pain{margin-top:12px}
 .about-story{padding-top:48px;padding-bottom:48px}.steps-section{padding-top:48px;padding-bottom:48px}
 .insights-hero{padding-bottom:40px}.insight-guide{padding:0 26px 54px;grid-template-columns:minmax(0,1fr);gap:32px}
 .guide-intro h2{--fs:2rem}.guide-questions h3{--fs:1.5rem}
}
@container page (max-width:45rem){.service-row,.insight-guide{grid-template-columns:minmax(0,1fr)}}

/* Keep ordinary headline words whole; overflow-wrap still allows enlarged text to reflow. */
.insights-hero h1{hyphens:none}

/* Inquiry links stay on the site; Microsoft controls the content inside its iframe. */
.inquiry-action{display:inline-flex;flex-direction:column;align-items:flex-start;max-width:100%}
.closing .inquiry-action{align-items:center}
.home-hero .hero-actions{align-items:flex-start}
.hero-actions>.text-link{padding-top:14px}
.contact-layout{display:block;max-width:1056px;margin:auto;padding:0 32px 80px;scroll-margin-top:24px}
.contact-layout:focus-visible{outline:2px solid var(--asc-orange);outline-offset:4px}
.contact-form-link{background:var(--asc-canvas);border:1px solid var(--line);border-radius:16px;padding:28px}
.contact-intro{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:48px;padding:4px 8px 28px}
.contact-intro>div>p:not(.fine){color:var(--asc-muted);font-size:1.0625rem;margin:0 0 18px;max-width:540px}
.contact-intro .fine{margin:0 0 14px}
.contact-privacy a,.form-fallback a{text-decoration:underline;text-underline-offset:3px}
.form-fallback a{display:inline-block;min-height:44px;padding-block:10px}
.contact-info .email-link{user-select:text;display:inline-block;max-width:100%;line-height:1.6;min-height:44px;padding-block:8px}
.contact-info .fine{max-width:410px}
.inquiry-embed{display:block;width:100%;height:1500px;border:0;border-radius:10px;background:var(--asc-canvas)}
.inquiry-embed:focus-visible{outline:2px solid var(--asc-orange);outline-offset:4px}
.form-noscript{padding:16px;background:var(--wash);border-radius:8px}
@media(max-width:760px){.contact-layout{padding:0 16px 54px}.contact-form-link{padding:16px 8px 8px}.contact-intro{grid-template-columns:minmax(0,1fr);gap:22px;padding:8px 12px 24px}.inquiry-embed{height:1540px}.hero-actions>.text-link{padding-top:0}}
@container page (max-width:45rem){.contact-intro{grid-template-columns:minmax(0,1fr);gap:22px}}
/* Give the provider enough usable width on narrow phones; do not clip its content. */
@media(max-width:420px){.contact-layout{padding-inline:0}.contact-form-link{padding-inline:0;border-inline:0;border-radius:0}.contact-intro{padding-inline:24px}.inquiry-embed{border-radius:0}}

/* October 7 final layout: use the wider page while keeping prose readable. */
.header,.page-hero,.service-list,.about-story,.steps-section,.principles,.insight-guide,.footer,.founder-preview{padding-inline:var(--gutter)}
.page-hero{padding-top:64px;padding-bottom:48px}
.service-row>div:last-child,.about-story>div:last-child{max-width:680px}
.managed{padding-inline:max(var(--gutter),calc((100vw - var(--page))/2 + var(--gutter)));column-gap:64px}
.managed .overview-body{max-width:680px}
.faq{max-width:var(--page);padding-inline:var(--gutter)}
.faq>*{max-width:820px}
.steps-section,.about-story{padding-top:64px;padding-bottom:64px}
.principles{padding-top:48px;padding-bottom:72px}
.contact-layout{max-width:1200px}
@media(max-width:760px){
 :root{--gutter:20px}
 .header{padding-inline:var(--gutter)}
 .page-hero{padding-top:36px;padding-bottom:36px}
 .service-list,.about-story,.steps-section,.principles,.insight-guide,.footer,.founder-preview,.faq{padding-inline:var(--gutter)}
 .about-story,.steps-section,.principles{padding-top:40px;padding-bottom:44px}
 .managed{padding-inline:var(--gutter)}
}