/* MSAL 2.0 content composition; the accepted portrait scene stays in styles.css. */
/* Shared reading rhythm below the hero. Keep display type for section headings. */
.positioning-page .section,.positioning-page .manifesto,.positioning-page .contact{padding:80px 0}
.positioning-page .section-head{gap:32px;margin-bottom:32px}
.positioning-page .section-head h2,.positioning-page .manifesto h2,.positioning-page .contact h2{font-size:clamp(30px,4vw,56px);font-weight:800;line-height:1.08;letter-spacing:-.025em}
.positioning-page .section-head p{font-size:16px;line-height:1.6;margin-top:8px}
.positioning-page .manifesto h2{margin:24px 0 0}
.positioning-page .contact h2{margin:16px 0 24px}
.positioning-page .contact>p{font-size:17px;line-height:1.6;margin-bottom:32px}
.positioning-page .service-link,.positioning-page .case-product,.positioning-page .about-social,.positioning-page .contact-links{font-family:inherit;font-size:14px;line-height:1.5;letter-spacing:0;text-transform:none}
.positioning-page .case-product{gap:8px;margin-top:16px}
.positioning-page .case-story{max-width:65ch}
.positioning-page .project-meta,.positioning-page .case-scope,.positioning-page .case-stage,.positioning-page .delivery-steps li>span{font-size:12px;line-height:1.5;letter-spacing:0}
.positioning-page .project-meta{margin-bottom:16px}
.positioning-page .case-scope,.positioning-page .case-stage{margin-top:24px}
.positioning-page .brand-cases h3{font-size:clamp(24px,2.25vw,32px);font-weight:700;line-height:1.2;letter-spacing:-.02em;text-transform:none}
.positioning-page .focus-item p,.positioning-page .manifesto .delivery-steps p{font-size:16px;line-height:1.6}
.positioning-page .case-details summary{font-size:14px;line-height:1.5;font-weight:600}
.positioning-page .case-details p{font-size:15px;line-height:1.6}
.positioning-page .contact-links{gap:16px 24px;margin-top:24px}
.positioning-page .contact-links a{display:inline-flex;align-items:center;min-height:44px}
.positioning-page .contact .note{font-size:13px;line-height:1.6;letter-spacing:0}
.positioning-page .contact .note span{font-size:12px;line-height:1.5;margin-top:12px}
.contact-mascot{width:56px;height:56px;margin:0 auto 12px;color:var(--orange)}
.contact-mascot svg{display:block;width:100%;height:100%}
.positioning-page .hero h1{font-size:clamp(42px,4.15vw,67px);font-weight:800;line-height:1.06;letter-spacing:-.03em;word-spacing:0;margin:26px 0 20px}
.headline-line{display:block}
.hero-promise{font-size:clamp(20px,1.7vw,24px);font-weight:500;line-height:1.4;letter-spacing:-.01em;margin:0 0 16px}
.positioning-page .hero .deck{max-width:550px;font-size:17px;line-height:1.55;letter-spacing:0}
.positioning-page .hero .human-pill{font-size:11px}
.positioning-page .hero .hero-meta{font-size:12px;line-height:1.5;letter-spacing:0}
.service-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.service-panel{display:flex;flex-direction:column;padding:32px;border:1.5px solid var(--line);background:var(--paper-2)}
.service-panel:nth-child(2){background:#e9e3fa}
.service-number{font-size:12px;line-height:1.5;letter-spacing:0;text-transform:uppercase;color:var(--muted)}
.service-panel h3{font-size:clamp(24px,2.25vw,32px);font-weight:700;letter-spacing:-.02em;line-height:1.2;margin:24px 0 16px}
.service-panel p{font-size:16px;line-height:1.6;margin:0 0 16px;max-width:520px}
.service-panel ul{padding:0;margin:0 0 24px;list-style:none;line-height:1.5}
.service-panel li{padding:10px 0;border-bottom:1px solid #bfb8ad;font-size:16px}
.service-link{display:inline-flex;align-items:center;gap:12px;min-height:44px;font-size:12px;text-decoration:underline;text-underline-offset:5px;line-height:1.5}
.service-panel .service-link{margin-top:auto;padding-top:14px}
.positioning-page #solutions{border-bottom:0;padding-bottom:32px}
.positioning-page #work{border-bottom:0}
.engineering-note{display:grid;grid-template-columns:minmax(220px,.85fr) minmax(0,1.15fr);align-items:center;gap:32px;padding:32px;border-left:3px solid var(--blue);background:var(--paper-2)}
.engineering-note h2{font-size:24px;line-height:1.2;letter-spacing:-.02em;margin:0}
.engineering-note h2 em{font-style:normal;color:var(--purple)}
.engineering-note p{font-size:16px;line-height:1.6;max-width:65ch;margin:0}
.positioning-page .delivery-steps{grid-template-columns:repeat(3,1fr);gap:32px;margin-top:32px}
.positioning-page .delivery-steps li{padding-top:24px}
.positioning-page .delivery-steps h3{font-size:24px;line-height:1.2;letter-spacing:-.02em;margin:24px 0 16px}
.about-bio{max-width:72ch;font-size:16px;line-height:1.6}
.about-bio p{margin:0 0 16px}
.about-social{display:flex;flex-wrap:wrap;gap:12px 24px;margin-top:24px;font-size:14px}
.about-social a{display:inline-flex;align-items:center;min-height:44px;padding:10px 0;text-decoration:underline;text-underline-offset:4px}
.editor-preview[hidden]{display:none}
.positioning-page .marquee-group .marquee-tag{padding:0;color:inherit;white-space:nowrap}
.positioning-page .tech-marquee:not(.is-enhanced) .marquee-group:not([aria-hidden]){display:flex;flex-wrap:wrap;justify-content:center;gap:8px 16px;padding:16px 18px;font-size:14px;font-weight:700;line-height:1.5;letter-spacing:0}
.positioning-page .tech-marquee:not(.is-enhanced) .marquee-group>span[aria-hidden]{display:none}
.positioning-page .tech-marquee:not(.is-enhanced) .marquee-tag[data-enhanced-tag]{display:none}
@media(prefers-reduced-motion:reduce){
 .positioning-page .tech-marquee.is-enhanced .marquee-group:not([aria-hidden]){display:flex;flex-wrap:wrap;justify-content:center;gap:8px 16px;padding:16px 18px;font-size:14px;font-weight:700;line-height:1.5;letter-spacing:0}
 .positioning-page .tech-marquee.is-enhanced .marquee-group>span[aria-hidden]{display:none}
}
/* Share spare desktop height between reading groups; keep the facts at the foot. */
@media(min-width:1101px) and (min-height:900px){
 .positioning-page .hero-promise{margin-top:auto;padding-top:12px}
 .positioning-page .hero .cta-row{margin-top:auto;margin-bottom:32px;padding-top:32px}
 .positioning-page .hero .hero-meta{margin-top:auto;padding-top:20px}
}
@media(min-width:1101px) and (max-height:800px){
 .positioning-page .hero h1{font-size:clamp(42px,4.1vw,65px);margin:18px 0 16px}
 .hero-promise{font-size:23px;margin-bottom:12px}
 .positioning-page .hero .deck{font-size:16px;line-height:1.45}
}
@media(min-width:1101px) and (max-height:680px){
 .positioning-page .hero h1{font-size:clamp(38px,3.6vw,57px);margin:12px 0}
 .hero-promise{font-size:20px;margin-bottom:10px}
 .positioning-page .hero .deck{font-size:15px}
}
@media(max-width:1100px){
 .positioning-page .nav{gap:20px}
 .positioning-page .hero h1{font-size:clamp(44px,7vw,76px);max-width:900px}
 .positioning-page .hero .deck{max-width:650px;font-size:18px}
 .hero-promise{font-size:24px}
}
@media(max-width:760px){
 .service-grid,.positioning-page .delivery-steps{grid-template-columns:1fr}
 .engineering-note{grid-template-columns:1fr;gap:16px}
}
@media(max-width:640px){
 .positioning-page .section,.positioning-page .manifesto,.positioning-page .contact{padding:48px 0}
 .positioning-page .section-head{margin-bottom:24px}
 .positioning-page .section-head p{margin-top:16px}
 .engineering-note{padding:24px}
 .positioning-page .contact .cta-row{display:grid;grid-template-columns:minmax(0,1fr);gap:12px}
 .positioning-page .contact .btn{min-width:0}
 .positioning-page .brand-cases .focus-item{padding:32px 0}
 .positioning-page .hero h1{font-size:clamp(30px,8.5vw,49px);margin:26px 0 20px}
 .hero-promise{font-size:21px}
 .positioning-page .hero .deck{font-size:16px}
 .positioning-page .hero .hero-meta{grid-template-columns:1fr 1fr;gap:14px}
 .positioning-page .hero .hero-meta>div:last-child{grid-column:1 / -1}
 .service-panel{padding:24px}
}
@media(max-width:360px){.positioning-page .hero .cta-row{grid-template-columns:minmax(0,1fr)}}

/* Compact paper/ink enquiry card; mailto remains the no-JS fallback. */