/* Prosight Dev — ABOUT page layout (Odoo website 18). Loaded on /about AFTER the 6
   shared home CSS parts (which provide reset/tokens/buttons/.pros-rv/modal/dark-theme
   + the .pros-ab-* dark overrides). This file adds only the light-mode ab layout. */
.pros-ab-hero { padding: 14px 14px 0 }
.pros-ab-hero__inner { background: #f4f2ec; border-radius: 32px; padding: 150px 0 80px }
.pros-ab-wrap { max-width: 1400px; margin: 0 auto; padding: 0 40px }
.pros-ab-stack { display: flex; flex-direction: column; gap: 40px }
.pros-ab-hd { display: flex; flex-direction: column; gap: 16px }
.pros-ab-hd h1 { font-size: clamp(40px, 6vw, 68px); line-height: 1; font-weight: 600; letter-spacing: -.02em; max-width: 900px }
.pros-ab-hd p { font-size: 18px; line-height: 1.4; max-width: 505px; color: var(--muted) }
.pros-ab-photos { display: grid; grid-template-columns: 370fr 548fr 370fr; gap: 16px; align-items: center }
.pros-ab-photos img { width: 100%; border-radius: 20px; object-fit: cover }
.pros-ab-photos .pros-side { height: 403px }
.pros-ab-photos .pros-mid { height: 504px }
.pros-ab-mission { display: grid; grid-template-columns: 370fr 548fr 370fr; gap: 16px }
.pros-ab-mission .pros-mtext { grid-column: 2; display: flex; flex-direction: column; gap: 24px; align-items: flex-start }
.pros-ab-mission .pros-mtext p { font-size: 18px; line-height: 1.5; color: #2a2a2a }
.pros-ab-adv { padding: 80px 0 }
.pros-ab-adv__grid { max-width: 1400px; margin: 0 auto; padding: 0 40px; display: grid; grid-template-columns: 1fr 1.2fr; gap: 80px; align-items: stretch }
.pros-ab-adv__left { display: flex; flex-direction: column; gap: 34px }
.pros-ab-adv__hd { display: flex; flex-direction: column; gap: 16px }
.pros-ab-adv__hd h2 { font-size: clamp(34px, 5vw, 50px); line-height: 1.25; font-weight: 600; letter-spacing: -.03em }
.pros-ab-adv__hd p { color: var(--muted); font-size: 17px; max-width: 520px }
.pros-ab-cards { display: flex; flex-direction: column; gap: 16px }
.pros-ab-card { background: #fff; border: 1px solid rgba(0,0,0,.08); border-radius: 12px; padding: 24px; display: flex; flex-direction: column; gap: 12px }
.pros-ab-card h3 { font-size: 20px; font-weight: 600; letter-spacing: -.01em }
.pros-ab-card p { font-size: 16px; color: var(--muted); line-height: 1.55 }
.pros-ab-adv__photowrap { position: relative; border-radius: 20px; overflow: hidden; min-height: 100% }
.pros-ab-adv__photo { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover }
.pros-ab-stats { background: #f4f2ec; padding: 48px 0 72px }
.pros-ab-stats__grid { max-width: 1400px; margin: 0 auto; padding: 0 40px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px }
.pros-ab-stat { background: #fff; border-radius: 24px; padding: 28px; min-height: 190px; display: flex; flex-direction: column; justify-content: space-between; gap: 28px }
.pros-ab-stat .pros-num { font-size: clamp(40px, 5vw, 50px); font-weight: 600; letter-spacing: -.03em; line-height: 1 }
.pros-ab-stat .pros-cap { font-size: 20px; text-align: right; color: var(--muted); letter-spacing: -.01em }
@media(max-width:1200px){
  .pros-ab-photos .pros-side{height:340px}
  .pros-ab-photos .pros-mid{height:430px}
  .pros-ab-adv__photo{height:640px}
}
@media(max-width:991px){
  .pros-ab-hero__inner{padding:150px 0 80px}
  .pros-ab-photos{grid-template-columns:1fr 1fr}
  .pros-ab-photos .pros-mid{grid-column:1/-1;height:420px}
  .pros-ab-mission{grid-template-columns:1fr}
  .pros-ab-mission .pros-mtext{grid-column:1}
  .pros-ab-adv__grid{grid-template-columns:1fr;gap:40px}
  .pros-ab-adv__photowrap{min-height:420px}
  .pros-ab-stats__grid{grid-template-columns:1fr}
}
@media(max-width:767px){
  .pros-ab-hero{padding:8px 8px 0}
  .pros-ab-hero__inner{padding:120px 0 64px;border-radius:24px}
  .pros-ab-wrap,.pros-ab-adv__grid,.pros-ab-stats__grid{padding-left:20px;padding-right:20px}
  .pros-ab-adv{padding:80px 0}
  .pros-ab-hd h1{font-size:clamp(34px,9vw,52px)}
}
@media(max-width:520px){
  .pros-ab-photos{grid-template-columns:1fr}
  .pros-ab-photos .pros-mid{grid-column:auto}
  .pros-ab-photos .pros-side,.pros-ab-photos .pros-mid{height:300px}
}
