/* GW audio design / About Us
   Page-specific visual layer; uses the same editorial vocabulary as Approach and Cases.
   Install at /css/gw/about.css next to gwaudiodesign.css and approach.css.
   All rules are limited to body.page-about. Existing site components are retained.
*/
.page-about {
  --ab-ink: #242e38;
  --ab-muted: #606f7d;
  --ab-blue: #577b9f;
  --ab-line: #dce4ec;
  --ab-soft: #f5f8fa;
}
.page-about .gw-ab-intro { padding-top:4.2rem; padding-bottom:3rem; }
.page-about .gw-ab-eyebrow { color:#6a87a3; font-size:.72rem; font-weight:700; letter-spacing:.12em; line-height:1.5; text-transform:uppercase; margin-bottom:1rem; }
.page-about .gw-ab-display { font-size:clamp(2rem,3.9vw,3.4rem); font-weight:650; letter-spacing:-.045em; line-height:1.17; color:var(--ab-ink); margin-bottom:1.45rem; }
.page-about .gw-ab-display span { color:var(--ab-blue); }
.page-about .gw-ab-lead { color:#273746; font-size:1.16rem; line-height:1.7; font-weight:500; margin-bottom:1.35rem; }
.page-about .gw-ab-copy, .page-about .gw-ab-copy p { color:#52606e; font-size:1rem; line-height:1.86; }
.page-about .gw-ab-copy p { margin-top:0; margin-bottom:1.3rem; }
.page-about .gw-ab-copy p.mb-0 { margin-bottom:0; }
.page-about .gw-ab-copy a, .page-about .gw-ab-text-link { color:#4d7696; text-underline-offset:3px; }
.page-about .gw-ab-copy a:hover { color:#2b5275; }
.page-about .gw-ab-title { font-size:clamp(1.65rem,2.5vw,2.35rem); font-weight:650; line-height:1.34; letter-spacing:-.035em; color:var(--ab-ink); margin:0 0 1.45rem; }
.page-about .gw-ab-section { padding:4.8rem 0; scroll-margin-top:105px; }
.page-about .gw-ab-tint { background:var(--ab-soft); }
/* Intro: aligned with the Approach introduction panel, but lighter in density. */
.page-about .gw-ab-intro-panel { background:#253441; border-top:4px solid #84a6c4; box-shadow:0 12px 34px rgba(30,49,63,.12); padding:1.55rem 1.75rem; color:#fff; }
.page-about .gw-ab-intro-panel > div { display:grid; grid-template-columns:2.5rem minmax(0,1fr); column-gap:.6rem; padding:1.05rem 0; border-bottom:1px solid rgba(255,255,255,.15); }
.page-about .gw-ab-intro-panel > div:last-child { border-bottom:0; }
.page-about .gw-ab-intro-panel span { grid-row:span 2; color:#93bad6; font-size:.88rem; font-weight:700; }
.page-about .gw-ab-intro-panel strong { color:#fff; font-size:1rem; line-height:1.35; font-weight:650; }
.page-about .gw-ab-intro-panel small { display:block; color:#c4d1db; font-size:.82rem; line-height:1.55; margin-top:.35rem; }
.page-about .gw-ab-onpage { display:flex; flex-wrap:wrap; column-gap:1.7rem; row-gap:.7rem; border-top:1px solid var(--ab-line); padding-top:1.15rem; margin-top:2.25rem; }
.page-about .gw-ab-onpage a { color:#536e87; text-decoration:none; font-size:.84rem; font-weight:650; }
.page-about .gw-ab-onpage a:hover, .page-about .gw-ab-onpage a:focus-visible { color:#2b5275; text-decoration:underline; text-underline-offset:4px; }
/* Heritage and typographic detail. */
.page-about .gw-ab-aside-line { margin-top:1.4rem; padding:0 0 0 1.05rem; border-left:3px solid #87a5bc; max-width:230px; color:#708395; font-size:.86rem; font-style:italic; line-height:1.65; }
.page-about .gw-ab-insight-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); background:#dbe4eb; border:1px solid #dbe4eb; gap:1px; margin-top:2.4rem; }
.page-about .gw-ab-insight-grid > div { background:#fff; padding:1.65rem 1.45rem; }
.page-about .gw-ab-insight-grid span { color:#7b9ab7; font-size:.77rem; font-weight:700; display:block; }
.page-about .gw-ab-insight-grid strong { color:var(--ab-ink); font-size:1rem; display:block; margin:.55rem 0; }
.page-about .gw-ab-insight-grid small { color:var(--ab-muted); font-size:.85rem; line-height:1.65; display:block; }
/* Editorial image composition; the existing website images are reused. */
/* Original animated About photos, now arranged in a restrained editorial 1+2 grid.
   Reveal motion is supplied by the site's existing appear-animation JavaScript. */
.page-about .gw-ab-image-composition { margin:0; padding:0 0 1rem 1rem; position:relative; }
.page-about .gw-ab-image-main { display:block; width:100%; height:310px; object-fit:cover; object-position:center center; background:#e4ebf0; border:1px solid #e1e8ee; }
.page-about .gw-ab-image-row { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; margin-top:14px; }
.page-about .gw-ab-image-thumbnail { display:block; width:100%; height:146px; object-fit:cover; object-position:center center; background:#e4ebf0; border:1px solid #e1e8ee; }
/* Evolution gallery: its lower image edge aligns with the neighbouring text on desktop.
   Flex growth is applied only to the large photograph; the two CAD previews keep their height.
   On tablets and phones, the normal gallery heights remain unchanged. */
@media (min-width:992px) {
  .page-about #evolution .row.align-items-start { align-items:stretch !important; }
  .page-about #evolution .col-lg-7 { display:flex; }
  .page-about #evolution .gw-ab-image-gallery {
    display:flex;
    flex-direction:column;
    flex:1 1 auto;
    height:0;
    min-height:100%;
    min-width:0;
    padding-bottom:0;
  }
  .page-about #evolution .gw-ab-image-main {
    height:0;
    min-height:0;
    flex:1 1 0%;
  }
  .page-about #evolution .gw-ab-image-row { flex:0 0 auto; }
}
.page-about .gw-ab-timeline { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); margin-top:2.9rem; gap:0; border-top:1px solid #d5e1e9; }
.page-about .gw-ab-timeline > div { padding:1.45rem 1.3rem 0 0; position:relative; }
.page-about .gw-ab-timeline > div::before { content:""; position:absolute; width:9px; height:9px; border-radius:50%; background:#83a4be; top:-5px; left:0; border:2px solid #fff; outline:1px solid #83a4be; }
.page-about .gw-ab-timeline-marker { font-size:.76rem; font-weight:700; color:#7295b0; display:block; margin-bottom:.5rem; }
.page-about .gw-ab-timeline strong { display:block; color:#293e4e; font-size:1rem; margin-bottom:.4rem; }
.page-about .gw-ab-timeline small { display:block; color:#677a89; font-size:.82rem; line-height:1.65; max-width:280px; }
/* Founder: retain original picture, name treatment, social links and read-more plugin. */
.page-about .gw-ab-founder { max-width:100%; }
.page-about .gw-ab-founder .gw-ab-title { margin-bottom:.2rem; }
.page-about .gw-ab-founder .gw-ab-founder-card { border:1px solid #dce5ed; background:#fff !important; box-shadow:0 12px 28px rgba(40,60,77,.09) !important; }
.page-about .gw-ab-founder .gw-ab-founder-card > .image { min-height:320px; }
.page-about .gw-ab-founder .gw-ab-founder-card > .col-md-8 { padding:2.35rem 2.7rem !important; }
.page-about .gw-ab-founder .gw-ab-founder-card h2.text-6 { font-size:1.18rem !important; line-height:1.22 !important; letter-spacing:0; }
.page-about .gw-ab-founder .gw-ab-founder-card .custom-read-more-style-1 p { color:#52606e; font-size:.94rem; line-height:1.79; }
/* Collective information panels. */
.page-about .gw-ab-collective-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1.1rem; margin-top:2.4rem; }
.page-about .gw-ab-collective-grid > div { background:#f5f8fa; border-top:3px solid #8eabc4; padding:1.55rem 1.45rem; }
.page-about .gw-ab-card-number { display:block; color:#6c91ad; font-size:.71rem; letter-spacing:.09em; font-weight:700; min-height:1.25rem; margin-bottom:.9rem; }
.page-about .gw-ab-collective-grid strong { display:block; color:#293c4b; font-size:.99rem; margin-bottom:.5rem; }
.page-about .gw-ab-collective-grid small { display:block; color:#697987; font-size:.85rem; line-height:1.65; }
.page-about .gw-ab-arrow-link { display:inline-block; color:#416b8c; font-size:.83rem; font-weight:700; text-decoration:none; border-bottom:1px solid #a8bdce; margin-top:1.1rem; padding-bottom:.2rem; }
.page-about .gw-ab-arrow-link:hover, .page-about .gw-ab-arrow-link:focus-visible { color:#254d6c; border-color:#254d6c; }
/* IP content: quiet three-pillar visual and accessible native HTML details. */
.page-about .gw-ab-ip-lead { font-weight:550; color:#314457 !important; font-size:1.07rem !important; }
.page-about .gw-ab-ip-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1px; background:#dbe4eb; border:1px solid #dbe4eb; margin-top:2.5rem; }
.page-about .gw-ab-ip-grid > div { background:#fff; padding:1.65rem 1.5rem; }
.page-about .gw-ab-icon { display:inline-flex; width:2.25rem; height:2.25rem; align-items:center; justify-content:center; background:#eef4f8; color:#648aa8; font-size:1rem; margin-bottom:1rem; }
.page-about .gw-ab-ip-grid strong { display:block; font-size:.98rem; color:#2b4050; margin-bottom:.5rem; }
.page-about .gw-ab-ip-grid small { color:#697987; font-size:.84rem; line-height:1.7; display:block; }
.page-about .gw-ab-ip-details { border:1px solid #d9e4ec; background:#fff; margin-top:1.2rem; }
.page-about .gw-ab-ip-details summary { list-style:none; cursor:pointer; display:flex; justify-content:space-between; gap:1.5rem; align-items:center; padding:1.35rem 1.6rem; }
.page-about .gw-ab-ip-details summary::-webkit-details-marker { display:none; }
.page-about .gw-ab-ip-details summary:focus-visible { outline:3px solid #8cacc6; outline-offset:-3px; }
.page-about .gw-ab-ip-details summary small { color:#7997b0; font-size:.68rem; letter-spacing:.09em; font-weight:700; display:block; margin-bottom:.25rem; }
.page-about .gw-ab-ip-details summary strong { color:#2b3f50; font-size:1.02rem; }
.page-about .gw-ab-details-action { font-weight:600; font-size:.79rem; color:#527792; display:flex; align-items:center; gap:.7rem; flex:none; }
.page-about .gw-ab-details-action i { transition:transform .2s ease; }
.page-about .gw-ab-ip-details[open] .gw-ab-details-action i { transform:rotate(180deg); }
.page-about .gw-ab-ip-details-body { border-top:1px solid #e0e8ee; padding:1.75rem 1.6rem 1.9rem; max-width:100%; }
.page-about .gw-ab-ip-details-body p { max-width:900px; }
/* Compliance block and statements. */
/* Product compliance image: larger, frameless and revealed with the site's existing theme.js. */
.page-about .gw-ab-compliance-image { border:0; padding:0; background:transparent; margin:0; }
.page-about .gw-ab-compliance-image img { display:block; width:100%; height:auto; max-width:100%; max-height:none; object-fit:contain; }
.page-about .gw-ab-values-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1rem; margin:2.2rem 0 2.4rem; }
.page-about .gw-ab-values-grid > article { background:#fff; border:1px solid #dde6ed; border-top:3px solid #90abc3; padding:1.7rem 1.5rem; }
.page-about .gw-ab-values-grid article > span { color:#7695ae; font-size:.7rem; letter-spacing:.08em; font-weight:700; }
.page-about .gw-ab-values-grid h3 { color:#2b3d4c; font-size:1.18rem; font-weight:650; margin:.7rem 0 1rem; }
.page-about .gw-ab-values-grid p { color:#5b6b79; font-size:.89rem; line-height:1.8; margin:0; }
.page-about .gw-ab-closing { padding:2.05rem; background:#273947; color:#e2eaf0; display:flex; justify-content:space-between; align-items:center; gap:2rem; }
.page-about .gw-ab-closing-kicker { color:#a9c2d6 !important; font-size:.69rem !important; letter-spacing:.13em; font-weight:700; margin:0 0 .55rem; }
.page-about .gw-ab-closing h3 { color:#fff; font-size:1.38rem; font-weight:650; margin:0 0 .7rem; }
.page-about .gw-ab-closing p { color:#d3dfe7; max-width:600px; font-size:.92rem; line-height:1.8; }
.page-about .gw-ab-cta-actions { flex:0 0 auto; display:flex; flex-direction:column; gap:.8rem; align-items:flex-start; }
.page-about .gw-ab-text-link { color:#cde0f0; font-size:.85rem; text-decoration:none; }
.page-about .gw-ab-project-count { color:#b2c9da; font-size:.73rem; letter-spacing:.01em; }
.page-about .gw-ab-project-count strong { color:#fff; font-weight:700; font-size:1.1rem; margin-right:.3rem; }
.page-about .gw-ab-text-link:hover, .page-about .gw-ab-text-link:focus-visible { color:#fff; text-decoration:underline; }
@media(max-width:991px) {
  .page-about .gw-ab-section { padding:3.7rem 0; }
  .page-about .gw-ab-values-grid { grid-template-columns:1fr; }
  .page-about .gw-ab-collective-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .page-about .gw-ab-collective-action { grid-column:span 2; }
  .page-about .gw-ab-image-main { height:315px; }
}
@media(max-width:767px) {
  .page-about .gw-ab-intro { padding-top:3rem; }
  .page-about .gw-ab-insight-grid, .page-about .gw-ab-ip-grid { grid-template-columns:1fr; }
  .page-about .gw-ab-collective-grid { grid-template-columns:1fr; }
  .page-about .gw-ab-collective-action { grid-column:auto; }
  .page-about .gw-ab-image-composition { padding-left:0; }
  .page-about .gw-ab-image-main { height:260px; }
  .page-about .gw-ab-image-row { gap:10px; margin-top:10px; }
  .page-about .gw-ab-image-thumbnail { height:118px; }
  .page-about .gw-ab-timeline { grid-template-columns:1fr; border-top:none; border-left:1px solid #d5e1e9; margin-left:.25rem; }
  .page-about .gw-ab-timeline > div { padding:0 0 1.65rem 1.5rem; }
  .page-about .gw-ab-timeline > div::before { left:-5px; top:.25rem; }
  .page-about .gw-ab-founder .gw-ab-founder-card > .col-md-8 { padding:1.5rem !important; }
  .page-about .gw-ab-ip-details summary { flex-direction:column; align-items:flex-start; gap:.6rem; }
  .page-about .gw-ab-closing { flex-direction:column; align-items:flex-start; padding:1.5rem; }
  .page-about .gw-ab-onpage { column-gap:1.2rem; }
}
@media(max-width:480px) {
  .page-about .gw-ab-image-main { height:215px; }
  .page-about .gw-ab-image-thumbnail { height:94px; }
  .page-about .gw-ab-intro-panel { padding:1.2rem 1.3rem; }
  .page-about .gw-ab-ip-details summary, .page-about .gw-ab-ip-details-body { padding:1.2rem; }
}
@media(prefers-reduced-motion:reduce) { .page-about .gw-ab-details-action i { transition:none; } }
