/* Company story: editorial alignment, scoped to the about page. */
.page-about .about-story.alt-about-story{grid-template-columns:minmax(0,.92fr) minmax(0,1.2fr);gap:clamp(32px,5vw,76px);align-items:stretch}
.page-about .company-editorial{display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;min-width:0;padding:4px 0 0;text-align:left}
.page-about .company-intro>.eyebrow{display:flex;align-items:center;gap:9px;margin:0 0 20px}
.page-about .company-intro h2{font-size:clamp(29px,2.7vw,43px);font-weight:500;line-height:1.16;letter-spacing:-.035em;margin:0 0 24px;max-width:20ch}
.page-about .company-editorial .company-intro p{font-size:15px;line-height:1.85;letter-spacing:0;color:var(--muted);margin:0;max-width:57ch}
.page-about .company-editorial .company-intro p+p{margin-top:14px}
.page-about .company-principles{display:grid;grid-template-columns:1fr 1fr;gap:28px;margin-top:32px;padding-top:26px;border-top:1px solid var(--line)}
.page-about .company-principle-label{font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--link)}
.page-about .company-principles h3{font-size:18px;font-weight:500;letter-spacing:-.02em;line-height:1.4;margin:12px 0}
.page-about .company-editorial .company-principles p{font-size:13px;line-height:1.8;letter-spacing:0;color:var(--muted);margin:0}
.page-about .company-editorial-footer{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-top:24px;padding-top:20px;border-top:1px solid var(--line)}
.page-about .company-editorial-footer>span{font-size:13px;line-height:1.65;color:var(--muted)}
.page-about .company-editorial-footer .detail-link{font-size:12px;line-height:1.6;white-space:nowrap}
@media(max-width:1100px){.page-about .about-story.alt-about-story{gap:36px;grid-template-columns:minmax(0,.85fr) minmax(0,1.2fr)}.page-about .company-principles{gap:20px;margin-top:24px;padding-top:22px}.page-about .company-intro h2{font-size:32px}.page-about .company-editorial-footer{align-items:flex-start;flex-direction:column;gap:14px}}
@media(max-width:800px){.page-about .about-story.alt-about-story{grid-template-columns:1fr;gap:32px}.page-about .alt-company-photo img{aspect-ratio:1.35;object-position:50% 60%}.page-about .company-intro h2{font-size:36px;max-width:none}.page-about .company-editorial-footer{flex-direction:row;align-items:flex-end}}
@media(max-width:480px){.page-about .company-intro h2{font-size:31px}.page-about .company-principles{grid-template-columns:1fr;gap:22px}.page-about .company-principles article+article{border-top:1px solid var(--line);padding-top:22px}.page-about .company-editorial-footer{flex-direction:column;align-items:flex-start;gap:16px}.page-about .company-editorial .company-intro p{font-size:14px}.page-about .company-editorial .company-principles p{font-size:14px}}

/* Mission and vision: restrained framed panels with architectural corner accents. */
.page-about .company-principles{gap:16px;padding-top:0;border-top:0}
.page-about .company-principles article{position:relative;isolation:isolate;min-width:0;padding:24px 22px 26px;border:1px solid var(--line);background:linear-gradient(140deg,rgba(83,137,225,.07),transparent 65%);box-shadow:inset 0 1px 0 rgba(140,170,210,.08)}
.page-about .company-principles article::before{content:"";position:absolute;left:-1px;top:-1px;width:46px;height:1px;background:linear-gradient(90deg,var(--link),transparent)}
.page-about .company-principles article::after{content:"";position:absolute;right:10px;bottom:10px;width:9px;height:9px;border-right:1px solid var(--link);border-bottom:1px solid var(--link);opacity:.35;pointer-events:none}
.page-about .company-principle-top{display:flex;align-items:center;gap:12px;min-height:34px}
.page-about .company-principle-icon{width:34px;height:34px;display:grid;place-items:center;color:var(--link);border:1px solid var(--line);background:rgba(83,137,225,.04)}
.page-about .company-principle-icon svg{width:21px;height:21px}
.page-about .company-principles h3{margin:22px 0 12px;font-size:18px;line-height:1.4;max-width:21ch}
.page-about .company-editorial .company-principles p{font-size:13px;line-height:1.85}
@media(min-width:801px) and (max-width:1100px){.page-about .company-principles{gap:12px}.page-about .company-principles article{padding:20px 16px 24px}.page-about .company-principle-top{gap:8px}.page-about .company-principle-label{font-size:9px}.page-about .company-principles h3{font-size:17px}}
@media(max-width:480px){.page-about .company-principles{gap:16px}.page-about .company-principles article,.page-about .company-principles article+article{padding:24px}.page-about .company-principles h3{max-width:none;margin-top:20px}.page-about .company-editorial .company-principles p{font-size:14px}}

/* Let the editorial content set the row height; avoid an empty spacer below the cards. */
@media(min-width:801px){
 .page-about .alt-company-photo{position:relative;min-height:480px}
 .page-about .alt-company-photo figure{position:absolute;inset:0;display:flex;flex-direction:column}
 .page-about .alt-company-photo img{flex:1 1 0;min-height:0;height:0;aspect-ratio:auto;object-fit:cover;object-position:50% 60%}
 .page-about .alt-company-photo figcaption{flex:0 0 auto}
}
.page-about .company-editorial-footer{flex-direction:row;align-items:center;flex-wrap:wrap;gap:14px 24px}
.page-about .company-editorial-footer .company-factory-link{color:var(--muted)}
@media(max-width:480px){.page-about .company-editorial-footer{flex-direction:column;align-items:flex-start}}
