/* ======================================================================
   GSC-TEMPC — ABOUT US (#section-about) — ARCH EDITORIAL REDESIGN
   v1.1 — background matched to Home Services / Board / Future Plans
   ----------------------------------------------------------------------
   File:   assets/css/about-us.css
   Scope:  every selector starts with #section-about; no other section,
           the header, the sidebar or the footer is affected.

   v1.1 CHANGE (background only; layout, markup, JS hooks unchanged)
     - Section ground now uses the same vertical gradient as
       .home-services, #section-leadership and #future-plans:
         #FFFFFF > #F3F8F2 (30%) > #E9F4E6 (64%) > #FFFFFF
       The old ground ended on a deeper green (#E3F0E0). The deep-forest
       trust band still closes the section; the white end of the gradient
       now sits cleanly behind it.
     - The wash glows use the exact Home Services values (same size,
       position and opacity).
     - Botanical opacity matches Home Services (.13).

   Concept: one shape language, the ARCH (a nod to the cooperative's
   building and its heritage). The video sits in an arched window with a
   champagne outline arch up-left and a light-green arch down-right; a
   huge pale arch echoes behind the story. A round gold-ringed seal marks
   "Trusted since 1991", and a deep-forest band anchors the bottom. Light
   green stays the dominant field; forest green and gold only anchor it.

   Layout: the section is a size container (container-name: about), so
   breakpoints follow the SECTION's width, not the screen's. This matters
   because the fixed "Explore GSC-TEMPC" panel takes ~320px on desktop.
   Browsers without container queries get the stacked layout plus a small
   @supports fallback near the end.

   Palette:
     --ab-brand   #30AA28  logo green (icons, rules)
     --ab-leaf    #B9DDB5  light green (fields, arches)
     --ab-action  #27883A  buttons, seal (white text = 4.5:1)
     --ab-forest  #1F5A2D  headings, trust band
     --ab-ink     #173E29  deepest green
     --ab-gold    #D6B56D  champagne accents
   ====================================================================== */

#section-about.gsc-about-editorial {
    --ab-brand: #30AA28;
    --ab-leaf: #B9DDB5;
    --ab-leaf-soft: #E5F1E3;
    --ab-sage: #F3F8F2;
    --ab-action: #27883A;
    --ab-action-deep: #1B6A2E;
    --ab-forest: #1F5A2D;
    --ab-ink: #173E29;
    --ab-gold: #D6B56D;
    --ab-gold-light: #F6E3AE;
    --ab-white: #FFFFFF;
    --ab-warm: #FBFCF9;
    --ab-text: #3E4C42;
    --ab-muted: #53625A;
    --ab-ease: cubic-bezier(.16, 1, .3, 1);
    --ab-serif: var(--hp-display-font, 'Fraunces', Georgia, 'Times New Roman', serif);
    /* arch radii: semicircular top, soft square bottom (percent radii so the
       arch scales with whatever size the box has) */
    --ab-arch: 50% 50% 22px 22px / 46% 46% 22px 22px;
    --ab-arch-inner: 50% 50% 14px 14px / 46% 46% 14px 14px;

    container: about / inline-size;
    position: relative;
    isolation: isolate;
    overflow: hidden;
    margin: 0;
    padding: 72px 14px 0;
    scroll-margin-top: 80px;
    color: var(--ab-forest);
    /* Same ground as .home-services, #section-leadership and #future-plans */
    background: linear-gradient(
        180deg,
        #FFFFFF 0%,
        #F3F8F2 30%,
        #E9F4E6 64%,
        #FFFFFF 100%
    );
}

/* Padding must never add to widths inside this section */
#section-about *,
#section-about *::before,
#section-about *::after {
    box-sizing: border-box;
}

/* ----------------------------------------------------------------------
   BACKDROP — green light behind the photo, plus the big story arch
   Glows are identical to the Home Services wash.
   ---------------------------------------------------------------------- */
#section-about .gsc-about-editorial__wash {
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background:
        radial-gradient(ellipse 52% 40% at 20% 34%, rgba(185, 221, 181, .5), transparent 72%),
        radial-gradient(ellipse 44% 36% at 94% 12%, rgba(185, 221, 181, .3), transparent 70%);
}

/* Large pale arch behind the story column (wide layouts only) */
#section-about .gsc-about-editorial__wash::before {
    content: '';
    display: none;
    position: absolute;
    top: 6%;
    right: 2cqi;
    width: 50cqi;
    height: 76%;
    border-radius: 50% 50% 0 0 / 30% 30% 0 0;
    background: linear-gradient(180deg, rgba(255, 255, 255, .92) 0%, rgba(229, 241, 227, .5) 55%, rgba(229, 241, 227, 0) 100%);
}

#section-about .gsc-about-editorial__botanical {
    position: absolute;
    z-index: 1;
    bottom: 0;
    width: clamp(110px, 24vw, 280px);
    width: clamp(110px, 16cqi, 280px);
    height: 100%;
    background-repeat: no-repeat;
    background-size: contain;
    pointer-events: none;
    opacity: .13;
    filter: grayscale(1) sepia(.55) saturate(3) hue-rotate(85deg) brightness(.7);
    mix-blend-mode: multiply;
    -webkit-mask-image: linear-gradient(to top, #000 0%, #000 42%, transparent 90%);
    mask-image: linear-gradient(to top, #000 0%, #000 42%, transparent 90%);
}

#section-about .gsc-about-editorial__botanical--left {
    left: 0;
    background-image: url('../images/botanical-corner-right.png');
    background-position: bottom left;
    transform: scaleX(-1);
}

#section-about .gsc-about-editorial__botanical--right {
    right: 0;
    background-image: url('../images/botanical-corner-right.png');
    background-position: bottom right;
}

/* ----------------------------------------------------------------------
   COMPOSITION — stacked by default, two columns when the section is wide
   ---------------------------------------------------------------------- */
#section-about .gsc-about-editorial__inner {
    position: relative;
    z-index: 2;
    width: min(1320px, 100%);
    margin: 0 auto;
}

#section-about .gsc-about-editorial__composition {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    align-items: center;
    gap: 72px;
    padding: 12px 0 56px;
}

/* ----------------------------------------------------------------------
   VISUAL — arched video window with layered arches
   ---------------------------------------------------------------------- */
#section-about .gsc-about-editorial__visual {
    --ab-off: 10px;   /* gold arch offset */
    --ab-pl: 12px;    /* green arch offset */
    position: relative;
    min-width: 0;
    width: min(100%, 560px);
    margin: 0 auto;
padding: var(--ab-off);
transform-style: preserve-3d;
    transition: transform .5s var(--ab-ease);
    will-change: transform;
}

/* Light-green arch, shifted down-right of the frame */
#section-about .gsc-about-editorial__offset {
    position: absolute;
    z-index: 0;
    inset: 0;
    border: 1.5px solid rgba(214, 181, 109, .95);
    border-radius: 50% 50% 32px 32px / 46% 46% 32px 32px;
    pointer-events: none;
}

/* Champagne outline arch, shifted up-left of the frame; open at the bottom
   and faded so it never ends in a stray corner */
#section-about .gsc-about-editorial__offset {
    position: absolute;
    z-index: -1;
    top: 0;
    left: 0;
    right: var(--ab-off);
    bottom: 34%;
    border: 1px solid rgba(214, 181, 109, .9);
    border-bottom: 0;
    border-radius: 999px 999px 0 0; /* clamps to a perfect semicircle */
    -webkit-mask-image: linear-gradient(to bottom, #000 55%, transparent 100%);
    mask-image: linear-gradient(to bottom, #000 55%, transparent 100%);
    pointer-events: none;
}

#section-about .gsc-about-editorial__photo-frame {
    position: relative;
    z-index: 1;
    padding: 8px;
    border: 1px solid rgba(48, 170, 40, .2);
    border-radius: var(--ab-arch);
    background: var(--ab-white);
    box-shadow:
        0 30px 60px rgba(23, 62, 41, .2),
        0 6px 18px rgba(48, 170, 40, .12);
}

#section-about .gsc-about-editorial__photo-wrap {
    position: relative;
    overflow: hidden;
    aspect-ratio: 1 / 1.04;
    border-radius: var(--ab-arch-inner);
    background: #0C1C13;
    touch-action: manipulation; /* keeps double-tap skip from zooming the page */
}

#section-about .gsc-about-editorial__photo-wrap::after {
    content: '';
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: linear-gradient(180deg, rgba(255, 255, 255, .06), transparent 26%, rgba(7, 34, 23, .14) 100%);
}

#section-about .gsc-about-editorial__photo-wrap:focus-visible {
    outline: 3px solid var(--ab-action);
    outline-offset: 3px;
}

#section-about .gsc-about-editorial__photo {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center 40%;
    transition: transform .95s var(--ab-ease), filter .95s ease;
}

#section-about .gsc-about-editorial__visual:hover .gsc-about-editorial__photo {
    transform: scale(1.02);
    filter: saturate(1.04) contrast(1.01);
}

/* Fullscreen must show the whole video, not the cropped fill */
#section-about .gsc-about-editorial__photo:fullscreen {
    object-fit: contain;
    object-position: center;
    transform: none;
    background: #000;
}

#section-about .gsc-about-editorial__photo:-webkit-full-screen {
    object-fit: contain;
    object-position: center;
    transform: none;
    background: #000;
}

/* ----------------------------------------------------------------------
   VIDEO CONTROLS — behavior untouched, appearance refined
   ---------------------------------------------------------------------- */
#section-about .gsc-about-editorial__video-toggle {
    position: absolute;
    top: 0;
    bottom: 54px;
    left: 0;
    right: 0;
    z-index: 3;
    margin: auto;
    width: 64px;
    height: 64px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 0 0 4px; /* optical centering of the play triangle */
    border: 2px solid rgba(255, 255, 255, .92);
    border-radius: 50%;
    background: rgba(27, 106, 46, .94);
    color: #fff;
    font-size: 1.25rem;
    cursor: pointer;
    box-shadow: 0 10px 28px rgba(0, 0, 0, .3);
    transition: background .3s ease, transform .3s var(--ab-ease), opacity .3s ease, box-shadow .3s ease;
}

#section-about .gsc-about-editorial__video-toggle:hover {
    background: var(--ab-forest);
    transform: scale(1.06);
    box-shadow: 0 14px 32px rgba(0, 0, 0, .36);
}

#section-about .gsc-about-editorial__video-toggle.is-playing {
    padding-left: 0;
    opacity: 0;
}

#section-about .gsc-about-editorial__photo-wrap:hover .gsc-about-editorial__video-toggle.is-playing,
#section-about .gsc-about-editorial__video-toggle.is-playing:focus-visible {
    opacity: 1;
}

#section-about .gsc-about-editorial__video-skip {
    position: absolute;
    top: 0;
    bottom: 52px;
    width: 50%;
    z-index: 2;
}

#section-about .gsc-about-editorial__video-skip--back { left: 0; }
#section-about .gsc-about-editorial__video-skip--fwd { right: 0; }

#section-about .gsc-about-editorial__video-skip-flash {
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 5;
    padding: 9px 18px;
    border-radius: 999px;
    background: rgba(18, 48, 28, .82);
    color: #fff;
    font-size: .95rem;
    font-weight: 700;
    opacity: 0;
    pointer-events: none;
    transform: translate(-50%, -50%) scale(.85);
    transition: opacity .25s ease, transform .25s ease;
}

#section-about .gsc-about-editorial__video-skip-flash.is-visible {
    opacity: 1;
    transform: translate(-50%, -50%) scale(1);
}

#section-about .gsc-about-editorial__video-controls {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 6;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    padding: 26px 16px 14px;
    background: linear-gradient(to top, rgba(8, 34, 18, .8), transparent);
    opacity: 0;
    pointer-events: auto;
    transition: opacity .3s ease;
}

#section-about .gsc-about-editorial__photo-wrap:hover .gsc-about-editorial__video-controls,
#section-about .gsc-about-editorial__photo-wrap:focus-visible .gsc-about-editorial__video-controls,
#section-about .gsc-about-editorial__video-controls.is-active,
#section-about .gsc-about-editorial__video-controls:focus-within {
    opacity: 1;
}

#section-about .gsc-about-editorial__video-mute,
#section-about .gsc-about-editorial__video-fullscreen {
    flex: 0 0 auto;
    width: 42px;
    height: 42px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    border: 1px solid rgba(255, 255, 255, .4);
    border-radius: 50%;
    background: rgba(8, 34, 18, .62);
    color: #fff;
    font-size: .95rem;
    cursor: pointer;
    transition: background .25s ease, border-color .25s ease;
}

#section-about .gsc-about-editorial__video-mute:hover,
#section-about .gsc-about-editorial__video-fullscreen:hover {
    background: var(--ab-action-deep);
    border-color: rgba(255, 255, 255, .7);
}

#section-about .gsc-about-editorial__video-toggle:focus-visible,
#section-about .gsc-about-editorial__video-mute:focus-visible,
#section-about .gsc-about-editorial__video-fullscreen:focus-visible {
    outline: 3px solid #fff;
    outline-offset: 2px;
    box-shadow: 0 0 0 6px rgba(8, 34, 18, .7);
}

/* ----------------------------------------------------------------------
   HERITAGE SEAL — round, gold-ringed "Trusted since 1991", pinned to the
   arch's right shoulder so it never covers the video's own captions
   ---------------------------------------------------------------------- */
#section-about .gsc-about-editorial__heritage {
    --ab-seal: 132px;
    position: absolute;
    z-index: 4;
    top: 0;
    right: 4px;
    width: var(--ab-seal);
    height: var(--ab-seal);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0;
    padding: 12px;
    border: 2px solid var(--ab-gold);
    border-radius: 50%;
    text-align: center;
    color: #fff;
    background:
        radial-gradient(circle at 30% 18%, rgba(255, 255, 255, .2), transparent 55%),
        linear-gradient(155deg, var(--ab-action) 0%, var(--ab-action-deep) 100%);
    box-shadow:
        inset 0 0 0 5px var(--ab-action-deep),
        inset 0 0 0 6px rgba(214, 181, 109, .65),
        0 0 0 6px var(--ab-white),
        0 18px 36px rgba(23, 62, 41, .34);
    pointer-events: none; /* decorative: taps pass through to the video beneath */
}

#section-about .gsc-about-editorial__heritage-icon {
    flex: 0 0 auto;
    margin-bottom: 4px;
    color: var(--ab-gold-light);
    font-size: 1rem;
    line-height: 1;
}

#section-about .gsc-about-editorial__heritage-copy {
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
}

#section-about .gsc-about-editorial__heritage-kicker {
    font-size: .64rem;
    line-height: 1;
    font-weight: 700;
    letter-spacing: .12em;
    color: rgba(255, 255, 255, .95);
    white-space: nowrap;
}

#section-about .gsc-about-editorial__heritage strong {
    margin: 4px 0 2px;
    font-family: var(--ab-serif);
    font-size: 2.3rem;
    line-height: .95;
    font-weight: 600;
    letter-spacing: .01em;
    color: var(--ab-gold-light);
    text-shadow: 0 1px 0 rgba(0, 0, 0, .22);
}

#section-about .gsc-about-editorial__heritage-rule {
    display: block;
    width: 34px;
    height: 1px;
    margin: 3px 0 5px;
    background: rgba(214, 181, 109, .9);
}

#section-about .gsc-about-editorial__heritage small {
    max-width: 8em;
    font-size: .64rem;
    line-height: 1.25;
    font-weight: 700;
    letter-spacing: .08em;
    color: rgba(255, 255, 255, .95);
}

/* ----------------------------------------------------------------------
   STORY COLUMN
   ---------------------------------------------------------------------- */
#section-about .gsc-about-editorial__story {
    position: relative;
    min-width: 0;
    width: min(100%, 680px);
    margin: 0 auto;
    align-self: stretch;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
}

#section-about .gsc-about-editorial__emblem-wrap {
    position: absolute;
    z-index: 0;
    right: -4%;
    bottom: -2%;
    width: min(62%, 320px);
    aspect-ratio: 1 / 1;
    display: flex;
    align-items: center;
    justify-content: center;
    pointer-events: none;
    -webkit-mask-image: radial-gradient(circle, #000 34%, transparent 70%);
    mask-image: radial-gradient(circle, #000 34%, transparent 70%);
}

#section-about .gsc-about-editorial__emblem {
    width: 100%;
    height: 100%;
    object-fit: contain;
    opacity: .06;
}

#section-about .gsc-about-editorial__eyebrow {
    position: relative;
    z-index: 1;
    display: inline-flex;
    align-items: center;
    gap: 14px;
    margin: 0 0 20px;
    color: var(--ab-action-deep);
    font-size: .82rem;
    line-height: 1;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .22em;
}

#section-about .gsc-about-editorial__eyebrow-line {
    flex: 0 0 auto;
    width: 52px;
    height: 2px;
    background: linear-gradient(90deg, var(--ab-gold) 0 60%, var(--ab-leaf) 60% 100%);
}

#section-about .gsc-about-editorial__title {
    position: relative;
    z-index: 1;
    margin: 0;
    max-width: 640px;
    font-family: var(--ab-serif);
    font-size: clamp(2.3rem, 9.5vw, 3.2rem);
    font-size: clamp(2.3rem, 11cqi, 3.2rem);
    line-height: 1.04;
    font-weight: 600;
    letter-spacing: -.035em;
    text-wrap: balance;
    overflow-wrap: break-word;
    color: var(--ab-forest);
    text-shadow: 0 1px 0 rgba(255, 255, 255, .8);
}

#section-about .gsc-about-editorial__divider {
    position: relative;
    z-index: 1;
    display: block;
    width: 72px;
    height: 3px;
    margin: 26px 0;
    border-radius: 2px;
    background: linear-gradient(90deg, var(--ab-gold) 0 58%, var(--ab-leaf) 58% 100%);
}

#section-about .gsc-about-editorial__copy {
    position: relative;
    z-index: 1;
    max-width: 36em;
    color: var(--ab-text);
    font-size: 1.02rem;
    line-height: 1.8;
    font-weight: 400;
}

#section-about .gsc-about-editorial__copy p {
    margin: 0 0 1.1em;
}

#section-about .gsc-about-editorial__copy p:last-child {
    margin-bottom: 0;
}

#section-about .gsc-about-editorial__copy p:first-child {
    color: var(--ab-ink);
    font-size: 1.12rem;
    line-height: 1.7;
    font-weight: 500;
}

/* ----------------------------------------------------------------------
   CTA
   ---------------------------------------------------------------------- */
#section-about .gsc-about-editorial__cta {
    position: relative;
    z-index: 1;
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    gap: 22px;
    min-width: 0;
    min-height: 56px;
    margin-top: 30px;
    padding: 12px 14px 12px 24px;
    overflow: hidden;
    border: 1px solid rgba(214, 181, 109, .75);
    border-radius: 999px;
    background: linear-gradient(180deg, var(--ab-action) 0%, var(--ab-action-deep) 100%);
    color: #fff;
    text-decoration: none;
    font-size: .98rem;
    line-height: 1.1;
    font-weight: 700;
    box-shadow: 0 14px 28px rgba(31, 90, 45, .28), inset 0 1px 0 rgba(255, 255, 255, .16);
    transition: transform .4s var(--ab-ease), box-shadow .4s ease, background .3s ease;
}

#section-about .gsc-about-editorial__cta > * {
    position: relative;
}

#section-about .gsc-about-editorial__cta::before {
    content: '';
    position: absolute;
    top: -40%;
    left: -70%;
    width: 46%;
    height: 180%;
    transform: skewX(-18deg);
    background: linear-gradient(100deg, transparent, rgba(255, 255, 255, .22), transparent);
    transition: left .7s var(--ab-ease);
    pointer-events: none;
}

/* Arrow sits in its own gold disc */
#section-about .gsc-about-editorial__cta i {
    display: grid;
    place-items: center;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: var(--ab-gold-light);
    color: var(--ab-ink);
    font-size: .8rem;
    transition: transform .4s var(--ab-ease);
}

#section-about .gsc-about-editorial__cta:hover {
    transform: translateY(-2px);
    background: linear-gradient(180deg, var(--ab-action-deep) 0%, var(--ab-ink) 100%);
    box-shadow: 0 18px 32px rgba(31, 90, 45, .36), inset 0 1px 0 rgba(255, 255, 255, .16);
}

#section-about .gsc-about-editorial__cta:hover::before { left: 130%; }
#section-about .gsc-about-editorial__cta:hover i { transform: translateX(3px); }

#section-about .gsc-about-editorial__cta:focus-visible {
    outline: 3px solid var(--ab-forest);
    outline-offset: 3px;
}

#section-about .gsc-about-editorial__cta:active {
    transform: translateY(0);
    box-shadow: 0 6px 14px rgba(31, 90, 45, .26);
}

/* ----------------------------------------------------------------------
   TRUST BAND — deep forest anchor that closes the section
   ---------------------------------------------------------------------- */
#section-about .gsc-about-editorial__trust-strip {
    --ab-strip-rule: rgba(255, 255, 255, .14);
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    overflow: hidden;
    border-radius: 16px 16px 0 0;
    background: linear-gradient(180deg, var(--ab-forest) 0%, var(--ab-ink) 100%);
    box-shadow: 0 -12px 32px rgba(23, 62, 41, .16);
}

/* Gold-to-green ribbon along the top edge */
#section-about .gsc-about-editorial__trust-strip::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(90deg, var(--ab-leaf), var(--ab-gold) 50%, var(--ab-leaf));
    pointer-events: none;
}

#section-about .gsc-about-editorial__trust-item {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    min-width: 0;
    min-height: 84px;
    padding: 16px 20px;
}

#section-about .gsc-about-editorial__trust-item + .gsc-about-editorial__trust-item {
    border-top: 1px solid var(--ab-strip-rule);
}

#section-about .gsc-about-editorial__trust-item:first-child {
    padding-top: 19px;
}

#section-about .gsc-about-editorial__trust-icon {
    flex: 0 0 46px;
    width: 46px;
    height: 46px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(214, 181, 109, .7);
    border-radius: 50%;
    background: rgba(255, 255, 255, .06);
    color: var(--ab-gold-light);
    font-size: 1.02rem;
}

#section-about .gsc-about-editorial__trust-copy {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 5px;
}

#section-about .gsc-about-editorial__trust-copy strong {
    color: #fff;
    font-size: .76rem;
    line-height: 1.2;
    font-weight: 800;
    letter-spacing: .06em;
    text-transform: uppercase;
}

#section-about .gsc-about-editorial__trust-copy small {
    color: rgba(255, 255, 255, .84);
    font-size: .86rem;
    line-height: 1.5;
    font-weight: 400;
}

/* ----------------------------------------------------------------------
   RESPONSIVE — driven by the section's own width (container queries)
   ---------------------------------------------------------------------- */
@media (min-width: 600px) {
    #section-about.gsc-about-editorial { padding: 88px 24px 0; }
}

/* Tablet-width section */
@container about (min-width: 600px) {
    #section-about .gsc-about-editorial__composition { gap: 80px; padding: 20px 0 64px; }
    #section-about .gsc-about-editorial__visual { --ab-off: 14px; --ab-pl: 18px; }
    #section-about .gsc-about-editorial__photo-frame { padding: 10px; }
    #section-about .gsc-about-editorial__video-toggle { width: 72px; height: 72px; font-size: 1.4rem; bottom: 60px; }
    #section-about .gsc-about-editorial__heritage { --ab-seal: 172px; top: calc(var(--ab-off) - 4px); right: -6px; padding: 14px; }
    #section-about .gsc-about-editorial__heritage-icon { font-size: 1.15rem; }
    #section-about .gsc-about-editorial__heritage-kicker { font-size: .68rem; }
    #section-about .gsc-about-editorial__heritage strong { font-size: 2.6rem; }
    #section-about .gsc-about-editorial__heritage small { font-size: .68rem; }
    #section-about .gsc-about-editorial__title { font-size: clamp(2.8rem, 8vw, 4.1rem); font-size: clamp(2.8rem, 8cqi, 4.1rem); }
    #section-about .gsc-about-editorial__copy { font-size: 1.05rem; }
    #section-about .gsc-about-editorial__copy p:first-child {
        margin-left: -19px;
        padding-left: 16px;
        border-left: 3px solid var(--ab-gold);
        font-size: 1.16rem;
    }

    #section-about .gsc-about-editorial__trust-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    #section-about .gsc-about-editorial__trust-item { padding: 22px 26px; }
    #section-about .gsc-about-editorial__trust-item:first-child { padding-top: 22px; }
    #section-about .gsc-about-editorial__trust-item + .gsc-about-editorial__trust-item { border-top: 0; }
    #section-about .gsc-about-editorial__trust-item:nth-child(n+3) { border-top: 1px solid var(--ab-strip-rule); }
    #section-about .gsc-about-editorial__trust-item:nth-child(even) { border-left: 1px solid var(--ab-strip-rule); }
}

/* Desktop-width section (900px+): arch photo left, story right */
@container about (min-width: 900px) {
    #section-about .gsc-about-editorial__wash::before { display: block; }
    #section-about .gsc-about-editorial__composition {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        gap: clamp(48px, 6cqi, 100px);
        min-height: 560px;
        padding: 36px 0 72px;
    }
    #section-about .gsc-about-editorial__visual { width: min(100%, 560px); justify-self: center; }
    #section-about .gsc-about-editorial__story { width: 100%; margin: 0; padding: 0 2cqi 0 3cqi; }
    #section-about .gsc-about-editorial__title { font-size: clamp(2.6rem, 4.4vw, 4.4rem); font-size: clamp(2.6rem, 4.6cqi, 4.4rem); }
}

/* Wide section: four trust columns in one row */
@container about (min-width: 1100px) {
    #section-about .gsc-about-editorial__trust-strip { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    #section-about .gsc-about-editorial__trust-item { padding: 26px; }
    #section-about .gsc-about-editorial__trust-item:first-child { padding-top: 26px; }
    #section-about .gsc-about-editorial__trust-item:nth-child(n+3) { border-top: 0; }
    #section-about .gsc-about-editorial__trust-item + .gsc-about-editorial__trust-item { border-left: 1px solid var(--ab-strip-rule); }
}

/* Very narrow sections (320px phones) */
@container about (max-width: 360px) {
    #section-about .gsc-about-editorial__heritage { --ab-seal: 124px; padding: 8px; }
    #section-about .gsc-about-editorial__heritage strong { font-size: 2rem; }
    #section-about .gsc-about-editorial__eyebrow { letter-spacing: .18em; }
    #section-about .gsc-about-editorial__botanical { display: none; }
}

/* Fallback for browsers without container queries */
@supports not (container-type: inline-size) {
    @media (min-width: 1100px) {
        #section-about .gsc-about-editorial__composition {
            grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
            gap: 64px;
            padding: 36px 0 88px;
        }
        #section-about .gsc-about-editorial__story { width: 100%; margin: 0; }
        #section-about .gsc-about-editorial__trust-strip { grid-template-columns: repeat(4, minmax(0, 1fr)); }
        #section-about .gsc-about-editorial__trust-item { padding: 26px; }
        #section-about .gsc-about-editorial__trust-item:nth-child(n+3) { border-top: 0; }
        #section-about .gsc-about-editorial__trust-item + .gsc-about-editorial__trust-item { border-left: 1px solid var(--ab-strip-rule); }
    }
    @media (min-width: 600px) and (max-width: 1099px) {
        #section-about .gsc-about-editorial__trust-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
        #section-about .gsc-about-editorial__trust-item + .gsc-about-editorial__trust-item { border-top: 0; }
        #section-about .gsc-about-editorial__trust-item:nth-child(n+3) { border-top: 1px solid var(--ab-strip-rule); }
        #section-about .gsc-about-editorial__trust-item:nth-child(even) { border-left: 1px solid var(--ab-strip-rule); }
    }
}

/* ----------------------------------------------------------------------
   TOUCH DEVICES — no hover, so keep the controls reachable
   ---------------------------------------------------------------------- */
@media (hover: none) {
    #section-about .gsc-about-editorial__video-controls { opacity: 1; }
    #section-about .gsc-about-editorial__video-toggle.is-playing { opacity: .6; }
    #section-about .gsc-about-editorial__visual:hover .gsc-about-editorial__photo { transform: none; filter: none; }
}

/* ----------------------------------------------------------------------
   REDUCED MOTION
   ---------------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
    #section-about .gsc-about-editorial__photo,
    #section-about .gsc-about-editorial__cta,
    #section-about .gsc-about-editorial__cta::before,
    #section-about .gsc-about-editorial__cta i,
    #section-about .gsc-about-editorial__video-toggle,
    #section-about .gsc-about-editorial__video-skip-flash,
    #section-about .gsc-about-editorial__video-controls,
    #section-about .gsc-about-editorial__visual {
        transition: none;
    }
    #section-about .gsc-about-editorial__visual:hover .gsc-about-editorial__photo,
    #section-about .gsc-about-editorial__cta:hover,
    #section-about .gsc-about-editorial__cta:hover i,
    #section-about .gsc-about-editorial__video-toggle:hover {
        transform: none;
    }
    /* The homepage script tilts the photo plate with an inline transform on
       mouse move; !important is needed here to override that inline style. */
    #section-about .gsc-about-editorial__visual { transform: none !important; }
}

/* ----------------------------------------------------------------------
   HIGH-CONTRAST / FORCED COLORS
   ---------------------------------------------------------------------- */
@media (forced-colors: active) {
    #section-about .gsc-about-editorial__heritage,
    #section-about .gsc-about-editorial__cta {
        border: 2px solid ButtonText;
    }
}

/* Existing scroll-reveal hook, preserved */
#section-about.gsc-about-editorial.reveal.is-active { opacity: 1; transform: translateY(0) scale(1); filter: blur(0); }