/* About page only. Shared navigation, footer and their scripts remain in use. */
@font-face{font-family:AllianceAboutHeading;src:url('../fonts/archivo-latin.woff2') format('woff2');font-weight:400 900;font-display:swap}
@font-face{font-family:AllianceAboutHeading;src:url('../fonts/archivo-latin-ext.woff2') format('woff2');font-weight:400 900;font-display:swap;unicode-range:U+0100-02BA}
#main.about-page {
  /* Primary — Alliance Burgundy (from brand assets #821918) */
  --burgundy-950: #470D0C; /* utility-bar darkest step (13 Jul 2026 header spec) */
  --burgundy-900: #5A110F;
  --burgundy-800: #6B1513;
  --burgundy-700: #821918;
  --burgundy-600: #9A2320;
  --burgundy-500: #B33230;
  --burgundy-400: #CC4F4D;
  --burgundy-100: #F5E0DF;
  --burgundy-50: #FBF0EF;

  /* Action — donation green */
  --green-800: #0A5E2D;
  --green-700: #0E7A3A;
  --green-100: #DDEFE4;
  --green-50: #F0F8F3;

  /* Heritage pine — Alliance red+green co-primary (poster fields, motifs) */
  --green-pine: #18675A;
  --green-pine-900: #0F4F45;

  /* Neutrals — warm ink scale; 900 IS the ink token's value */
  --neutral-900: #1A1614;
  --neutral-700: #2D2D2D;
  --neutral-500: #404040;
  --neutral-400: #8C8C8C;
  --neutral-300: #B3B3B3;
  --neutral-200: #D4D4D4;
  --neutral-100: #EBEBEB;
  --neutral-50: #F7F7F7;
  --white: #FFFFFF;

  /* Creative Direction — red+green heritage ground tokens (29 Jun 2026) */
  --paper: #F5EEE0;        /* warm cream — default light ground, and type on red/green/ink */
  --paper-2: #FBF6EC;      /* warm panel ground (replaces neutral-50) */
  --ink: #1A1614;          /* warm near-black body type */
  /* Heritage rose (owner-approved 14 Jul 2026) — scoped surface, not a fifth
     general band: policy pages + pull-quotes only, oxblood ink ONLY (6.7:1),
     oxblood buttons only, never on the homepage, never framed. */
  --paper-rose: #E8CCC6;

  /* Typography — red+green heritage system (Archivo display + Fraunces editorial serif) */
  --font-display: 'Montserrat', sans-serif;
  --font-heading: AllianceAboutHeading, sans-serif;
  --font-body: 'Inter', sans-serif;
  --font-serif: 'Fraunces', Georgia, 'Times New Roman', serif;

  /* Type scale — component sizes. 13px floor; body scales up inside
     capped measures on wide screens (typography.css). */
  --text-xs: 0.8125rem;    /* 13px — metadata, legal, footer fine print */
  --text-sm: 0.9375rem;    /* 15px — secondary UI, card meta */
  --text-base: 1rem;       /* 16px — body */
  --text-md: 1.125rem;     /* 18px — emphasised body, card titles */
  --text-lg: 1.25rem;      /* 20px — wide-screen body, leads */

  /* Display scale — the poster registers. One statement moment per page. */
  --display-1: clamp(46px, 8.6vw, 128px);  /* statement: hero, "Let's get stuck in." */
  --display-2: clamp(44px, 6.4vw, 92px);   /* section display */
  --display-3: clamp(36px, 4.5vw, 56px);   /* interior H1 / section H2 */
  --display-4: clamp(28px, 4vw, 48px);     /* sub-display */
  --lead: clamp(20px, 2.1vw, 26px);        /* serif lead under displays */
  --display-poster: clamp(44px, 7vw, 112px); /* Fraunces poster voice, .poster-serif on rose only */

  /* Rhythm + voice */
  --leading-display: 0.95;
  --leading-tight: 1.15;
  --leading-heading: 1.2;
  --leading-body: 1.6;
  --track-display: -0.02em;
  --track-caps: 0.08em;    /* buttons only — caps are reserved for buttons */

  /* Spacing — 4px base */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 56px;
  --space-20: 64px;
  --space-24: 72px;
  --space-32: 96px;

  /* Layout — two frames, one system: --max-width is the legacy .container
     reading frame (steps up below); --max-width-wide is the .alliance-grid
     poster frame (layout-bands.css). */
  --max-width: 1280px;
  --max-width-wide: 2160px;

  /* Radius — squared off for a printed, not rendered, feel */
  --radius-sm: 2px;
  --radius-md: 2px;
  --radius-lg: 3px;

  /* Keylines + hard offsets — print treatment, never soft shadows.
     Card separation is an oxblood keyline + hard offset block. */
  --keyline-card: 0 0 0 1.5px var(--burgundy-100);
  --keyline-card-hover: 0 0 0 1.5px var(--burgundy-100), 6px 6px 0 0 var(--green-pine);
  --keyline-header: 0 1px 0 0 rgba(0, 0, 0, 0.08);

  /* Transitions */
  --transition-fast: 0.2s ease-in-out;
  --transition-medium: 0.35s ease-in-out;
  --transition-slow: 0.5s ease-in-out;
}
body.page-template-page-about{
  
  --font-display:'Montserrat',sans-serif;
  --about-frame:1320px;--about-header:80px;--about-nav:64px;--about-gutter:clamp(20px,4vw,64px);
  --about-title:clamp(2.6rem,4.6vw,4.5rem);--about-section-title:clamp(2rem,3.6vw,3.5rem);
  --about-chapter-title:clamp(1.6rem,2.7vw,2.5rem);--about-card-title:clamp(1.25rem,1.8vw,1.55rem);
  --about-rule:color-mix(in srgb,var(--burgundy-700) 22%,var(--paper));
  --about-offset:color-mix(in srgb,var(--burgundy-700) 12%,var(--paper));
  --about-section-space:clamp(48px,6.5vw,96px);--about-sticky:calc(var(--about-header) + var(--about-nav) + var(--space-8));
}
#main.about-page *{box-sizing:border-box}
html:has(body.page-template-page-about){scroll-behavior:auto;-webkit-font-smoothing:antialiased}
#main.about-page{margin:0;color:var(--ink);background:var(--paper);font:400 var(--text-base)/1.65 var(--font-body)}
#main.about-page img{display:block;max-width:100%;height:auto}
#main.about-page figure,#main.about-page blockquote{margin:0}
#main.about-page button,#main.about-page a,#main.about-page input{touch-action:manipulation}
#main.about-page a{color:inherit;text-underline-offset:.22em}
#main.about-page button{font:inherit;cursor:pointer}
#main.about-page p{margin:0 0 var(--space-5)}
#main.about-page h1,#main.about-page h2,#main.about-page h3,#main.about-page h4{color:var(--burgundy-700);margin:0;font-weight:900;line-height:1.06;letter-spacing:-.04em}
#main.about-page h1,#main.about-page h2{font-family:var(--font-display)}
#main.about-page h3,#main.about-page h4{font-family:var(--font-heading);font-variation-settings:'wght' 900,'wdth' 85}
#main.about-page h2{font-size:var(--about-section-title)}
#main.about-page h3{font-size:var(--about-chapter-title)}
#main.about-page h4{font-size:var(--about-card-title);line-height:1.16}
#main.about-page [id]{scroll-margin-top:var(--about-sticky)}
#main.about-page a:focus-visible,#main.about-page button:focus-visible,#main.about-page summary:focus-visible{outline:3px solid var(--green-pine);outline-offset:5px}
#main.about-page [tabindex='-1']:focus{outline:none}
#main.about-page .wrap,#main.about-page .container{width:min(calc(100% - var(--about-gutter)*2),var(--about-frame));margin-inline:auto}
#main.about-page .section{padding-block:var(--about-section-space)}
#main.about-page .section-intro{display:grid;grid-template-columns:1fr 1.05fr;gap:var(--space-20);margin-bottom:var(--space-12);align-items:start}
#main.about-page .prose{max-width:60ch}
#main.about-page .prose p:last-child{margin-bottom:0}
#main.about-page .lead{font-size:var(--text-lg);line-height:1.6}
#main.about-page .text-link{display:flex;align-items:center;justify-content:space-between;gap:var(--space-8);width:fit-content;min-height:44px;font-weight:600;color:var(--burgundy-700);text-decoration:none;border-bottom:2px solid currentColor;padding-block:var(--space-2)}
#main.about-page .text-link:hover{text-decoration:underline}
#main.about-page .text-link span{font-size:var(--text-lg)}
#main.about-page .button,#main.about-page .btn{display:inline-flex;justify-content:center;align-items:center;min-height:44px;padding:var(--space-3) var(--space-6);background:var(--burgundy-700);color:var(--paper);font:700 var(--text-sm)/1.3 var(--font-display);text-decoration:none;text-transform:uppercase;border:0;border-radius:var(--radius-sm)}
#main.about-page .button:hover,#main.about-page .btn:hover{background:var(--burgundy-900)}
#main.about-page .about-hero{padding-block:var(--space-20) var(--space-24)}
#main.about-page .hero-grid{display:grid;grid-template-columns:.9fr 1.15fr;gap:var(--space-12);align-items:center}
#main.about-page .hero-copy h1{font-size:var(--about-title);letter-spacing:-.055em;line-height:1.01;margin-bottom:var(--space-8)}
#main.about-page .hero-copy h1 span{color:var(--green-pine-900)}
#main.about-page .hero-copy .lead{max-width:41ch;margin-bottom:var(--space-6)}
#main.about-page .photo{min-width:0;background:var(--white);border-top:var(--space-2) solid var(--burgundy-700);box-shadow:var(--space-2) var(--space-2) 0 var(--about-offset);align-self:start}
#main.about-page .photo-open{display:block;position:relative;overflow:hidden;text-decoration:none}
#main.about-page .photo-open img{width:100%;height:auto}
#main.about-page .photo-enlarge{position:absolute;bottom:var(--space-3);right:var(--space-3);display:grid;place-items:center;width:44px;height:44px;background:var(--paper);color:var(--burgundy-700);font-size:1.4rem;border:1px solid var(--about-rule)}
#main.about-page .photo-open:hover .photo-enlarge{background:var(--burgundy-700);color:var(--paper)}
#main.about-page .photo figcaption{padding:var(--space-4) var(--space-5);font-size:var(--text-sm);line-height:1.5}
#main.about-page .photo figcaption small{display:block;font-size:var(--text-xs);margin-top:var(--space-1);color:var(--neutral-700)}
#main.about-page .about-hero-photo{margin-block:var(--space-5);border-top-color:var(--green-pine);transform:translateY(var(--parallax-y,0px))}
#main.about-page .chapter-nav{position:sticky;top:var(--about-header);z-index:15;background:var(--paper);border-block:1px solid var(--about-rule)}
#main.about-page .chapter-nav>.wrap{display:flex;align-items:center;justify-content:space-between;gap:var(--space-8);min-height:var(--about-nav)}
#main.about-page .chapter-label{font-family:var(--font-heading);font-weight:900;font-size:var(--text-md);color:var(--burgundy-700)}
#main.about-page .chapter-links{display:flex;align-items:center;gap:var(--space-8)}
#main.about-page .chapter-links a{display:flex;align-items:center;min-height:var(--about-nav);border-bottom:4px solid transparent;padding-top:4px;white-space:nowrap;text-decoration:none;font-size:var(--text-sm);font-weight:600}
#main.about-page .chapter-links a[aria-current]{border-color:var(--burgundy-700);color:var(--burgundy-700)}
#main.about-page .chapter-links a:hover{text-decoration:underline}
#main.about-page .today{background:var(--paper-2)}
#main.about-page .today-photos{display:grid;grid-template-columns:1.35fr 1fr;gap:var(--space-10);align-items:start;margin-block:var(--space-16) var(--space-10)}
#main.about-page .port-photo{transform:translateY(var(--parallax-y,0px))}
#main.about-page .stall-photo{margin-top:var(--space-20);border-top-color:var(--green-pine)}
#main.about-page .history-intro{margin-bottom:var(--space-20)}
#main.about-page .history-chapter{display:grid;grid-template-columns:.7fr 1.3fr;gap:var(--space-20);border-top:2px solid var(--burgundy-700);padding-block:var(--space-12) var(--space-20)}
#main.about-page .history-chapter:last-child{padding-bottom:0}
#main.about-page .era-heading{position:sticky;top:var(--about-sticky);align-self:start;max-width:19rem}
#main.about-page .era-range{font:900 var(--about-chapter-title)/1 var(--font-display);color:var(--green-pine-900);letter-spacing:-.04em;margin-bottom:var(--space-5)}
#main.about-page .era-content{min-width:0;display:grid;gap:var(--space-10)}
#main.about-page .milestone-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-8)}
#main.about-page .milestone .date{font-weight:600;color:var(--green-pine-900);margin-bottom:var(--space-3)}
#main.about-page .milestone h4{margin-bottom:var(--space-4)}
#main.about-page .milestone p:last-child{margin-bottom:0}
#main.about-page .government-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:var(--space-8);align-items:start}
#main.about-page .archive-inset{max-width:300px;justify-self:end}
#main.about-page .archive-pair{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-6);align-items:start}
#main.about-page .early-archive{max-width:500px}
#main.about-page .coalition-photo{max-width:660px}
#main.about-page .bank-photo{max-width:560px}
#main.about-page .archive-video{background:var(--green-pine-900);color:var(--paper)}
#main.about-page .video-stage{aspect-ratio:16/9;position:relative;background:var(--ink)}
#main.about-page .archive-video>p{padding:var(--space-4) var(--space-6);border-top:1px solid currentColor;margin:0;font-size:var(--text-xs)}
#main.about-page .video-stage iframe{position:absolute;inset:0;display:block;width:100%;height:100%;border:0}
#main.about-page .archive-video :focus-visible{outline-color:var(--paper);outline-offset:-5px}
#main.about-page .constitution-quote{background:var(--green-pine-900);color:var(--paper);padding-block:var(--space-20)}
#main.about-page .constitution-quote blockquote{font:900 var(--about-chapter-title)/1.22 var(--font-display);letter-spacing:-.035em;max-width:31ch;margin-bottom:var(--space-6)}
#main.about-page .constitution-quote a{display:inline-flex;align-items:center;gap:var(--space-6);min-height:44px;font-size:var(--text-sm)}
#main.about-page .constitution-quote a:focus-visible{outline-color:var(--paper)}
#main.about-page .principles-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-6)}
#main.about-page .principle{background:var(--white);border-top:var(--space-1) solid var(--burgundy-700);box-shadow:var(--space-1) var(--space-1) 0 var(--about-offset);padding:var(--space-6)}
#main.about-page .principle h3{font-size:var(--about-card-title);margin-bottom:var(--space-3)}
#main.about-page .principle p{margin:0;font-size:var(--text-sm)}
#main.about-page .leadership-section{background:var(--paper-2)}
#main.about-page .leaders{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-8)}
#main.about-page .leaders article{padding-block:var(--space-6);border-top:2px solid var(--about-rule)}
#main.about-page .leaders h3{font-size:var(--about-card-title);margin-bottom:var(--space-2)}
#main.about-page .leaders p{margin:0}
#main.about-page .leaders a{display:inline-flex;align-items:center;gap:var(--space-8);min-height:44px;color:var(--burgundy-700);font-size:var(--text-sm)}
#main.about-page .candidates-link{margin-top:var(--space-6)}
#main.about-page .recent-photos{scroll-margin-top:var(--about-sticky)}
#main.about-page .recent-photos h4{margin-bottom:var(--space-6)}
#main.about-page .recent-photo-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-6);align-items:start}
#main.about-page .recent-photo-grid .photo:nth-child(2){border-top-color:var(--green-pine)}
@media(max-width:760px){#main.about-page .recent-photo-grid{grid-template-columns:1fr;gap:var(--space-8)}}
#main.about-page dialog{border:0;padding:var(--space-6);background:var(--paper);color:var(--ink);width:min(94vw,1200px);max-height:94dvh;overflow:auto}
#main.about-page dialog::backdrop{background:color-mix(in srgb,var(--ink) 90%,transparent)}
#main.about-page .dialog-toolbar{display:flex;justify-content:space-between;align-items:center;gap:var(--space-4);margin-bottom:var(--space-4);font-size:var(--text-sm);color:var(--burgundy-700)}
#main.about-page .dialog-close{min-height:44px;background:var(--burgundy-700);color:var(--paper);border:0;padding:var(--space-2) var(--space-5)}
#main.about-page dialog img{max-height:70dvh;max-width:100%;width:auto;margin-inline:auto;object-fit:contain}
#main.about-page dialog figcaption{font-size:var(--text-sm);padding-top:var(--space-4)}
#main.about-page dialog figcaption small{display:block;font-size:var(--text-xs)}
body.page-template-page-about.modal-open{overflow:hidden}
@media(min-width:1600px){#main.about-page .hero-copy .lead,#main.about-page .prose,#main.about-page .milestone{font-size:var(--text-lg)}}
@media(max-width:1100px){#main.about-page .hero-grid{gap:var(--space-8);grid-template-columns:1fr 1fr}
#main.about-page .hero-copy h1{font-size:clamp(2.5rem,5vw,3.5rem)}
#main.about-page .history-chapter{gap:var(--space-10);grid-template-columns:.6fr 1.4fr}
#main.about-page .milestone-grid{grid-template-columns:1fr}
#main.about-page .section-intro{gap:var(--space-10)}}
@media(max-width:920px){body.page-template-page-about{--about-header:72px;--about-nav:56px}
#main.about-page .chapter-label{display:none}
#main.about-page .chapter-nav>.wrap{justify-content:center}
#main.about-page .chapter-links{width:100%;justify-content:space-between;gap:var(--space-4)}
#main.about-page .hero-grid{grid-template-columns:1fr}
#main.about-page .hero-copy{max-width:40rem}
#main.about-page .hero-copy h1{font-size:clamp(2.7rem,6.7vw,4rem)}
#main.about-page .hero-copy .lead{max-width:58ch}
#main.about-page .about-hero-photo{margin-top:var(--space-3);max-width:760px}
#main.about-page .about-hero{padding-block:var(--space-10) var(--space-12)}
#main.about-page .section-intro{grid-template-columns:1fr;gap:var(--space-6)}
#main.about-page .history-chapter{grid-template-columns:1fr;gap:var(--space-8)}
#main.about-page .era-heading{position:static;max-width:100%}
#main.about-page .era-range{margin-bottom:var(--space-3)}
#main.about-page .milestone-grid{grid-template-columns:1fr 1fr}
#main.about-page .history-intro{margin-bottom:var(--space-10)}
#main.about-page .today-photos{gap:var(--space-6)}}
@media(max-width:600px){body.page-template-page-about{--about-nav:56px;--about-section-space:48px}
#main.about-page .chapter-links{gap:var(--space-2)}
#main.about-page .chapter-links a{font-size:var(--text-xs)}
#main.about-page .about-hero .hero-copy h1{font-size:clamp(2.2rem,8.7vw,3.25rem)}
#main.about-page .hero-copy .lead{font-size:var(--text-md)}
#main.about-page .about-hero-photo,#main.about-page .port-photo{transform:none!important}
#main.about-page .today-photos{grid-template-columns:1fr;gap:var(--space-8);margin-block:var(--space-8)}
#main.about-page .stall-photo{margin-top:0}
#main.about-page .photo{box-shadow:var(--space-1) var(--space-1) 0 var(--about-offset)}
#main.about-page .photo figcaption{padding:var(--space-3) var(--space-4)}
#main.about-page .milestone-grid,#main.about-page .government-grid,#main.about-page .archive-pair,#main.about-page .leaders{grid-template-columns:1fr}
#main.about-page .archive-inset{justify-self:start;max-width:280px}
#main.about-page .era-content{gap:var(--space-8)}
#main.about-page .history-chapter{padding-block:var(--space-8) var(--space-12)}
#main.about-page .constitution-quote{padding-block:var(--space-12)}
#main.about-page .principles-grid{grid-template-columns:1fr;gap:var(--space-4)}
#main.about-page .principle{padding:var(--space-5)}
#main.about-page dialog{padding:var(--space-4)}}
@media(prefers-reduced-motion:no-preference){html:has(body.page-template-page-about){scroll-behavior:smooth}
#main.about-page .photo-enlarge{transition:background var(--transition-fast),color var(--transition-fast)}}
@media(prefers-reduced-motion:reduce){#main.about-page [data-parallax]{transform:none!important}
html:has(body.page-template-page-about){scroll-behavior:auto}}
@media print{#main.about-page .chapter-nav,#main.about-page .photo-enlarge,#main.about-page .text-link{display:none!important}
#main.about-page .section,#main.about-page .about-hero{padding-block:var(--space-6)}
#main.about-page .history-chapter,#main.about-page .hero-grid,#main.about-page .section-intro{display:block}
#main.about-page .era-heading{position:static}
#main.about-page .photo{break-inside:avoid;transform:none!important;box-shadow:none}
#main.about-page{background:var(--white)}
#main.about-page .photo-open{pointer-events:none}}
body.page-template-page-about{--paper:#F5EEE0;--ink:#1A1614;--about-header:var(--header-height,72px);overflow-x:clip}
html:has(body.page-template-page-about){overflow-x:clip;scroll-padding-top:0}
#main.about-page{padding-top:var(--about-header);color:var(--ink);background:var(--paper);font:400 var(--text-base)/1.65 var(--font-body)}
#main.about-page h1,#main.about-page h2,#main.about-page h3,#main.about-page h4{text-transform:none}
#main.about-page a{text-decoration:underline}
#main.about-page .text-link,#main.about-page .photo-open,#main.about-page .chapter-links a{text-decoration:none}
#main.about-page .wrap{padding-inline:0}
body.page-template-page-about .header,body.page-template-page-about .header.header-scrolled{background:var(--paper);border-bottom:1px solid var(--about-rule)}
body.page-template-page-about .header .header-logo{color:var(--burgundy-700)}
body.page-template-page-about .header .header-nav a:not(.btn){color:var(--ink)}
body.page-template-page-about .header .header-nav a:not(.btn):hover,body.page-template-page-about .header .header-nav a[aria-current="page"]:not(.btn){color:var(--burgundy-700)}
body.page-template-page-about .header .header-nav a:not(.btn)::after,body.page-template-page-about .header .mobile-toggle span{background:var(--burgundy-700)}
body.page-template-page-about .header .header-nav .btn.btn-primary{background:var(--burgundy-700);color:var(--paper);border-color:var(--burgundy-700)}
@media print{#main.about-page{padding-top:0}}