/* Product page: scoped so the imported agency pages and workspace stay independent. */
.brandos-page{background:#fafafa;color:#222;font-size:16px;line-height:1.7}
.brandos-page *{box-sizing:border-box}
.brandos-page :is(h1,h2,h3,p,figure){margin:0}
.brandos-page :is(h1,h2,h3){color:inherit;text-transform:none;letter-spacing:-.045em;font-weight:400}
.brandos-page h2{font-size:clamp(28px,3.5vw,48px);line-height:1.18}
.brandos-page h3{font-size:22px;line-height:1.4}
.brandos-page a{color:inherit;text-underline-offset:5px}
.brandos-page a:hover{color:#d92121}
.brandos-page :is(a,button,summary):focus-visible{outline:2px solid #d92121;outline-offset:5px}
.brandos-width{width:min(100%,1280px);margin-inline:auto}
.brandos-section,.brandos-overview{padding:80px max(5vw,24px)}
.brandos-page .brandos-eyebrow{font-size:12px;line-height:1.6;letter-spacing:.025em;color:#596468;margin:0 0 24px}
.brandos-hero{padding:calc(var(--agency-header-height,100px) + 46px) max(5vw,24px) 64px}
.brandos-hero h1{display:flex;justify-content:space-between;align-items:center;gap:12px;font-size:clamp(48px,13vw,186px);line-height:1.1;letter-spacing:-.085em;margin:12px 0 48px}
.brandos-hero h1>span{color:#f33;font-size:.9em;font-weight:400;letter-spacing:0}
.brandos-hero-copy{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:start}
.brandos-hero-copy>div>p{max-width:58ch}
.brandos-actions{display:flex;gap:24px;flex-wrap:wrap;align-items:center;margin-top:28px}
.brandos-text-link{font-size:13px;text-decoration:underline;line-height:1.6}
.brandos-overview{background:#e3f2fd;scroll-margin-top:90px}
.brandos-section-heading{display:grid;grid-template-columns:1fr 1fr;gap:0 64px;align-items:end;margin-bottom:36px}
.brandos-section-heading>.brandos-eyebrow{grid-column:1/-1}
.brandos-section-heading>p:last-child:not(.brandos-eyebrow){max-width:58ch}
.brandos-screen{min-width:0}
.brandos-screen-open{display:block;position:relative;width:100%;padding:0;border:1px solid #59646840;background:#fafafa;cursor:zoom-in;line-height:0;box-shadow:0 12px 36px #2222220b}
.brandos-screen img{width:100%;height:auto;display:block}
.brandos-screen-zoom{position:absolute;right:12px;bottom:12px;background:#222;color:#fafafa;padding:10px;font-size:14px;line-height:1;pointer-events:none}
.brandos-screen figcaption{display:flex;justify-content:space-between;gap:16px;font-size:11px;line-height:1.6;color:#596468;margin-top:14px}
.brandos-screen figcaption span{flex-shrink:0}
.brandos-method>.brandos-width{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.4fr);gap:56px;align-items:center}
.brandos-method-copy>p:not(.brandos-eyebrow){margin-top:24px}
.brandos-method-copy .agency-bullet-list{font-size:14px;line-height:1.7;margin-top:24px}
.brandos-method .brandos-screen figcaption{flex-direction:column;gap:4px}
.brandos-workflow{border-block:1px solid #59646830}
.brandos-steps{margin-top:40px;border-top:1px solid #59646860}
.brandos-step{display:grid;grid-template-columns:1fr 1.3fr .7fr;gap:40px;padding:28px 0;border-bottom:1px solid #59646860;align-items:start}
.brandos-step h3{font-size:20px}
.brandos-step p{font-size:14px}
.brandos-location{font-size:12px;color:#596468;text-align:right;padding-top:5px}
.brandos-people{background:#596468;color:#fafafa}
.brandos-people .brandos-eyebrow{color:#e3f2fd}
.brandos-people-grid{display:grid;grid-template-columns:1fr 1fr;gap:64px;margin-top:40px}
.brandos-people-grid h3{font-size:18px;letter-spacing:-.025em;margin-bottom:16px}
.brandos-people-grid p{font-size:15px;max-width:60ch}
.brandos-page .brandos-note{border-top:1px solid #fafafa60;padding-top:24px;margin-top:36px;max-width:85ch;font-size:14px;color:#e3f2fd}
.brandos-faq>.brandos-width{max-width:960px}
.brandos-questions{margin-top:32px;border-top:1px solid #59646850}
.brandos-questions details{border-bottom:1px solid #59646850}
.brandos-questions summary{list-style:none;display:flex;justify-content:space-between;align-items:center;gap:24px;padding:22px 0;cursor:pointer;font-size:15px;line-height:1.5}
.brandos-questions summary::-webkit-details-marker{display:none}
.brandos-questions summary>span{font-size:22px;flex-shrink:0;transition:transform .2s}
.brandos-questions details[open] summary>span{transform:rotate(45deg)}
.brandos-questions details>p{font-size:15px;line-height:1.75;padding:0 48px 24px 0;max-width:80ch;color:#596468}
.brandos-cta{background:#e3f2fd}
.brandos-cta>.brandos-width{display:grid;grid-template-columns:1fr 300px;gap:64px;align-items:center}
.brandos-cta h2{margin-bottom:24px}
.brandos-cta p:not(.brandos-eyebrow){max-width:62ch}
.brandos-cta img{width:100%;height:auto;max-width:300px}
@media(max-width:1000px){.brandos-method>.brandos-width{grid-template-columns:1fr;gap:32px}.brandos-method-copy{max-width:700px}.brandos-method .brandos-screen figcaption{flex-direction:row}.brandos-step{grid-template-columns:1fr 1.5fr;gap:12px 32px}.brandos-location{grid-column:1;text-align:left;grid-row:auto}.brandos-step p{grid-column:2;grid-row:1/3}.brandos-cta>.brandos-width{grid-template-columns:1fr 200px;gap:24px}}
@media(max-width:767px){
 .brandos-page{font-size:15px;line-height:1.7}
 .brandos-section,.brandos-overview{padding:48px 24px}
 .brandos-hero{padding:calc(var(--agency-header-height,84px) + 28px) 24px 40px}
 .brandos-page .brandos-eyebrow{font-size:11px;margin-bottom:16px}
 .brandos-hero h1{font-size:clamp(36px,12vw,88px);gap:4px;letter-spacing:-.08em;margin:12px 0 28px}
 .brandos-hero-copy,.brandos-section-heading,.brandos-people-grid{grid-template-columns:1fr;gap:20px}
 .brandos-hero-copy h2{font-size:28px}
 .brandos-section-heading{margin-bottom:24px;gap:16px}
 .brandos-section-heading>.brandos-eyebrow{margin:0}
 .brandos-actions{gap:18px;margin-top:24px}
 .brandos-actions .agency-button{padding:12px 18px!important}
 .brandos-screen figcaption,.brandos-method .brandos-screen figcaption{flex-direction:column;gap:6px;font-size:11px}
 .brandos-screen-zoom{right:6px;bottom:6px;padding:6px;font-size:12px}
 .brandos-method-copy>p:not(.brandos-eyebrow){margin-top:16px}
 .brandos-steps{margin-top:24px}
 .brandos-step{grid-template-columns:1fr;gap:12px;padding:24px 0}
 .brandos-step p{grid-column:auto;grid-row:auto}
 .brandos-location{grid-column:auto;padding:0}
 .brandos-people-grid{margin-top:28px;gap:28px}
 .brandos-people-grid h3{margin-bottom:12px}
 .brandos-page .brandos-note{margin-top:28px;padding-top:20px}
 .brandos-questions{margin-top:24px}
 .brandos-questions summary{padding:18px 0;font-size:14px;gap:16px}
 .brandos-questions details>p{padding:0 12px 20px 0;font-size:14px}
 .brandos-cta>.brandos-width{display:block}
 .brandos-cta img{display:block;width:150px;margin:24px 0 0 auto}
 .brandos-cta h2{margin-bottom:16px}
}
@media(prefers-reduced-motion:reduce){.brandos-questions summary>span{transition:none}}
