/* Local introductory accent; inherit all existing heading typography. */
.master-page .about-service-heading{display:flex;align-items:center;justify-content:space-between;gap:20px}
.about-service-heading span{min-width:0}
.about-handshake{flex:none;width:32px;height:32px;color:var(--blue)}
.master-page .about-section-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}
.about-section-heading span{min-width:0}
.about-section-icon{display:block;flex:none;width:28px;height:28px;color:var(--blue);margin-top:3px}

/* About page: three values and three clearly separated customer groups. */
.about-page .about-value-cards{display:grid;grid-template-columns:minmax(0,1fr);gap:16px;margin-top:24px}
.about-page .about-value-cards article{min-width:0;padding:22px;border:1px solid #dfe4ec;border-radius:8px;background:#fff}
.about-page .about-value-cards h3{margin:0 0 14px}
.about-page .about-value-cards p{margin:0;line-height:1.65}
.about-page .about-customer-list{list-style:none;margin:24px 0 0;padding:0}
.about-page .about-customer-list li{display:grid;grid-template-columns:minmax(0,1fr) 28px;gap:10px 18px;padding:24px 0;border-bottom:1px solid #dfe4ec;min-width:0;align-items:start}
.about-page .about-customer-list li:last-child{border-bottom:0;padding-bottom:0}
.about-page .about-customer-icon{grid-column:2;grid-row:1/3;width:28px;height:28px;color:var(--blue);margin-top:3px}
.about-page .about-customer-list h3{grid-column:1;margin:0;min-width:0}
.about-page .about-customer-list p{grid-column:1;margin:0;max-width:70ch;line-height:1.65;min-width:0}
@media(min-width:1100px){.about-page .about-value-cards{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:600px){.about-page .about-value-cards article{padding:20px 16px}.about-page .about-customer-list li{column-gap:14px}}

/* Calmer introductory hierarchy, scoped to About. */
.about-page .master-intro{padding-top:40px;padding-bottom:28px}
.about-page .master-intro .breadcrumb{margin-bottom:28px}
.about-page .master-intro>.eyebrow{margin-bottom:16px;font-size:.75rem;letter-spacing:.09em}
.about-page .master-intro h1{font-size:clamp(2.25rem,4.8vw,3.5rem);font-weight:700;line-height:1.12;margin:0 0 28px}
.about-page .master-intro .about-service-heading{align-items:flex-start;font-size:var(--pi-h2);font-weight:700;line-height:1.2;gap:16px;max-width:950px;margin:0 0 24px}
.about-page .master-intro .about-handshake{width:26px;height:26px;margin-top:3px}
.about-page .master-intro .lead{font-size:clamp(1.0625rem,1.4vw,1.125rem);line-height:1.7;max-width:70ch;margin:0}
.about-page .master-intro .about-intro-note{margin-top:14px}
.about-page .about-values{padding-top:28px}
@media(max-width:600px){.about-page .master-intro{padding-top:28px;padding-bottom:24px}.about-page .master-intro .breadcrumb{margin-bottom:24px}.about-page .master-intro h1{margin-bottom:20px}.about-page .about-values{padding-top:24px}}

/* Philosophy follows the introduction; customer symbols align on the right. */
.about-page .about-philosophy{border-top:1px solid #dfe4ec;padding-top:32px}
.about-page .about-philosophy p:not(.eyebrow){max-width:76ch;line-height:1.7;margin:0}
.about-page .about-philosophy p+p{margin-top:18px}
.about-page .about-customer-icon{justify-self:end}

/* Crop the river photograph in the page without changing the source image. */
.about-page .about-image-hero{position:relative;isolation:isolate;overflow:hidden}
.about-page .about-image-hero::before{content:"";position:absolute;inset:0;z-index:-1;background:inherit;transform:scale(1.18);transform-origin:15% 48%;pointer-events:none}
.about-page .about-copy p{margin:0}
.about-page .about-copy p+p{margin-top:18px}

.about-page .about-image-hero{background:linear-gradient(90deg,rgba(31,33,36,.88),rgba(31,33,36,.62) 48%,rgba(31,33,36,.12)),url('/assets/limmat-about-edited.webp?v=0d4e96595056') center/cover;color:#fff;padding:160px 0 64px}
.about-page .about-image-hero h1{color:#fff;font-size:clamp(2.25rem,4vw,3.5rem);max-width:24ch;margin:0 0 24px}
.about-page .about-image-hero h2{color:#e1e7f0;font-size:1.0625rem;font-weight:400;line-height:1.65;max-width:46ch;margin:0}
.about-page .about-image-hero .lead{color:#eef3fa;font-size:1.125rem;line-height:1.65;max-width:46ch}
.about-page .about-image-hero .eyebrow,.about-page .about-image-hero .breadcrumb a,.about-page .about-image-hero .breadcrumb [aria-current=page]{color:#e3ebf7}
.about-page .about-image-hero .breadcrumb li+li:before{border-color:#cbd7e7}
.about-page .about-introduction p:not(.eyebrow){font-size:1.0625rem;line-height:1.7;max-width:85ch}
@media(max-width:700px){.about-page .about-image-hero{padding-top:120px;padding-bottom:40px;background-position:60% center}.about-page .about-image-hero h1{font-size:2.25rem}.about-page .about-image-hero .lead{font-size:1.0625rem}}
@media(orientation:landscape) and (max-height:500px) and (pointer:coarse){.about-page .about-image-hero{padding-top:90px;padding-bottom:36px}}

/* Use both sides of wide screens without changing the reading order or copy. */
@media(min-width:1000px){
 .about-page .master-intro{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.3fr);column-gap:clamp(32px,4vw,56px);align-items:start}
 .about-page .master-intro>.breadcrumb,
 .about-page .master-intro>.eyebrow,
 .about-page .master-intro>h1{grid-column:1/-1}
 .about-page .master-intro .about-service-heading{grid-column:1;grid-row:4;margin:0;font-size:var(--pi-h2);max-width:20ch}
 .about-page .master-intro>.lead{grid-column:2;grid-row:4;max-width:64ch;margin:0}
 .about-page .about-philosophy{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.3fr);column-gap:clamp(32px,4vw,56px);row-gap:18px;align-items:start}
 .about-page .about-philosophy>.eyebrow{grid-column:1/-1;margin:0}
 .about-page .about-philosophy>h2{grid-column:1;grid-row:2/4;margin:0;max-width:20ch}
 .about-page .about-philosophy>p:not(.eyebrow){grid-column:2;max-width:64ch;margin:0;font-size:1.0625rem}
}
/* Portrait tablet: one readable column with consistent paragraph spacing. */
@media(min-width:701px) and (max-width:999.99px){
 .about-page .master-intro,.about-page .about-philosophy{max-width:760px}
 .about-page .master-intro .lead,.about-page .about-philosophy p:not(.eyebrow){max-width:none;font-size:1.0625rem;line-height:1.7}
 .about-page .master-intro .about-service-heading{margin-bottom:20px}
 .about-page .about-philosophy{padding-top:28px;padding-bottom:28px}
 .about-page .about-philosophy p+p{margin-top:18px}
}

/* Consistent editorial columns and a compact tablet reading rhythm. */
@media(min-width:1000px){
 .about-page .about-introduction,.about-page .about-philosophy{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.3fr);gap:14px clamp(28px,3.5vw,48px);align-items:start;padding-top:32px;padding-bottom:32px}
 .about-page .about-introduction>.eyebrow,.about-page .about-philosophy>.eyebrow{grid-column:1;grid-row:1;margin:0}
 .about-page .about-introduction>h2,.about-page .about-philosophy>h2{grid-column:1;grid-row:2;margin:0;max-width:20ch}
 .about-page .about-introduction,.about-page .about-philosophy{grid-template-rows:min-content 1fr}
 .about-page .about-copy{grid-column:2;grid-row:1/3;min-width:0}
 .about-page .about-copy p:not(.eyebrow){max-width:none;font-size:1.0625rem;line-height:1.65;margin:0}
 .about-page .about-copy p+p{margin-top:16px}
}
@media(min-width:701px) and (max-width:1400px){
 .about-page .about-values,.about-page .about-customers{padding-top:28px;padding-bottom:28px}
 .about-page .about-values>h2 br{display:none}
 .about-page .about-values>h2{max-width:none;margin-bottom:0}
 .about-page .about-value-cards{grid-template-columns:repeat(3,minmax(0,1fr));margin-top:20px;gap:16px}
 .about-page .about-value-cards article{padding:20px 18px}
 .about-page .about-customer-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin-top:20px}
 .about-page .about-customer-list li{border-bottom:0;border-top:1px solid #dfe4ec;padding:20px 0 0;align-content:start}
}
@media(min-width:701px) and (max-width:999.99px){
 .about-page .about-introduction,.about-page .about-philosophy{max-width:none;padding-top:28px;padding-bottom:28px}
 .about-page .about-value-cards{grid-template-columns:1fr}
 .about-page .about-value-cards article{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.3fr);gap:24px}
 .about-page .about-value-cards h3{margin:0}
}
