:root {
      --wine: #004D36;
      --wine-dark: #004D36;
      --pink: #FFDF0F;
      --cream: #FFFFFF;
      --paper: #FFFFFF;
      --ink: #004D36;
      --muted: #004D36;
      --line: rgba(0, 77, 54, .2);
      --serif: Georgia, "Times New Roman", serif;
      --sans: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    }

    * { box-sizing: border-box; }
    html { scroll-behavior: smooth; }
    body { margin: 0; overflow-x: hidden; background: var(--paper); color: var(--ink); font-family: var(--sans); }
    img { display: block; max-width: 100%; }
    a { color: inherit; text-decoration: none; }
    button { font: inherit; }
    :focus-visible { outline: 3px solid var(--pink); outline-offset: 4px; }
    .skip-link { position: fixed; z-index: 100; top: 10px; left: 10px; padding: 12px 18px; color: white; background: var(--wine-dark); border-radius: 4px; font-weight: 700; transform: translateY(-150%); transition: transform .2s; }
    .skip-link:focus { transform: translateY(0); }
    .sr-only { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
    .wrap { width: min(1180px, calc(100% - 40px)); margin-inline: auto; }

    .topbar { display: none; }
    .site-header { position: fixed; z-index: 20; top: 0; left: 0; width: 100%; color: var(--wine-dark); background: rgba(255,255,255,.96); border-bottom: 1px solid var(--line); backdrop-filter: blur(14px); box-shadow: 0 6px 24px rgba(0,77,54,.07); }
    .nav { min-height: 88px; display: flex; align-items: center; justify-content: space-between; gap: 32px; padding-block: 10px; }
    .brand { display: flex; align-items: center; gap: 13px; font-weight: 700; line-height: 1.08; letter-spacing: -.02em; transition: opacity .25s ease, transform .25s ease; }
    .site-header.logo-hidden .brand { opacity: 0; pointer-events: none; transform: translateY(-8px); }
    .brand-logo { display: block; width: 152px; height: auto; }
    .nav-links { display: flex; align-items: center; gap: 30px; font-size: 14px; font-weight: 600; }
    .nav-links a:not(.nav-cta) { position: relative; }
    .nav-links a:not(.nav-cta)::after { content: ""; position: absolute; left: 0; bottom: -7px; width: 100%; height: 2px; background: var(--wine); transform: scaleX(0); transform-origin: left; transition: transform .25s; }
    .nav-links a:hover::after { transform: scaleX(1); }
    .nav-cta { padding: 12px 18px; border: 0; border-radius: 999px; background: var(--pink); color: var(--wine-dark); }
    .menu-btn { display: none; border: 0; background: transparent; color: var(--wine-dark); font-size: 27px; cursor: pointer; }

    .hero { position: relative; overflow: hidden; padding: 150px 0 76px; color: var(--wine); background: linear-gradient(90deg, #fff 0 58%, #f3f7f5 58% 100%); }
    .hero-grid { display: grid; grid-template-columns: minmax(0, 1.02fr) minmax(380px, .98fr); gap: clamp(52px, 7vw, 104px); align-items: center; }
    .hero-content { position: relative; z-index: 2; padding: 26px 0; }
    .hero-portrait { position: relative; min-height: 560px; }
    .hero-portrait::before { content: ""; position: absolute; z-index: 0; inset: 30px -22px -22px 28px; background: var(--wine); }
    .hero-portrait::after { content: ""; position: absolute; z-index: 3; top: -10px; left: -18px; width: 112px; height: 10px; background: var(--pink); }
    .hero-photo-frame { position: absolute; z-index: 1; inset: 0; overflow: hidden; border: 1px solid var(--line); background: #fff; }
    .hero-photo { position: absolute; left: 50%; bottom: -11%; width: 112%; height: 112%; object-fit: contain; object-position: center bottom; filter: saturate(1.03) contrast(1.01); transform: translateX(-50%); }
    .eyebrow { display: flex; align-items: center; gap: 12px; margin-bottom: 22px; font-size: 13px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; }
    .eyebrow::before { content: ""; width: 38px; height: 2px; background: currentColor; }
    h1 { margin: 0; max-width: 720px; color: var(--wine-dark); font-family: var(--serif); font-size: clamp(54px, 6.6vw, 96px); font-weight: 600; line-height: .94; letter-spacing: -.045em; }
    h1 em { display: block; color: var(--pink); font-weight: 600; }
    .hero-kicker { display: flex; align-items: center; gap: 12px; margin: 0 0 20px; color: var(--wine); font-size: 13px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
    .hero-kicker::before { content: ""; width: 36px; height: 4px; background: var(--pink); }
    .hero-role { width: fit-content; max-width: 470px; margin: 30px 0 0; padding: 14px 18px; border-left: 6px solid var(--pink); color: white; background: var(--wine); font-size: clamp(14px, 1.5vw, 18px); font-weight: 800; line-height: 1.35; letter-spacing: .055em; text-transform: uppercase; }
    .hero-copy { max-width: 560px; margin: 28px 0 34px; color: white; font-size: 18px; line-height: 1.7; }
    .actions { display: flex; flex-wrap: wrap; gap: 12px; }
    .btn { display: inline-flex; align-items: center; justify-content: center; gap: 9px; min-height: 51px; padding: 0 23px; border: 1px solid transparent; border-radius: 999px; font-size: 14px; font-weight: 700; transition: transform .2s, background .2s; }
    .btn:hover { transform: translateY(-2px); }
    .btn-light { background: var(--pink); color: var(--wine-dark); }
    .btn-ghost { border-color: rgba(255,255,255,.55); color: white; }

    .intro { padding: 110px 0; background: var(--cream); }
    .intro-grid { display: grid; grid-template-columns: .65fr 1.35fr; gap: clamp(55px, 8vw, 120px); align-items: start; }
    .section-label { margin: 0 0 20px; color: var(--wine); font-size: 12px; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; }
    .section-title { margin: 0; font-family: var(--serif); font-size: clamp(40px, 5vw, 66px); font-weight: 600; line-height: 1.05; letter-spacing: -.035em; }
    .intro-lead { margin: 0 0 25px; color: var(--wine-dark); font-family: var(--serif); font-size: clamp(25px, 3vw, 38px); line-height: 1.35; }
    .intro-text { margin: 0; color: var(--muted); font-size: 17px; line-height: 1.85; }
    .signature { margin-top: 25px; color: var(--wine); font-family: var(--serif); font-size: 27px; font-style: italic; }

    .story-section { padding: clamp(72px, 9vw, 125px) 0; }
    .story-section:nth-child(even) { background: var(--cream); }
    .story-section.accent { background: var(--wine-dark); color: white; }
    .story-row { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: clamp(42px, 8vw, 110px); align-items: center; }
    .story-section.reverse .story-media { order: 2; }
    .story-media { position: relative; min-height: 470px; overflow: hidden; border-radius: 3px; box-shadow: 18px 20px 0 var(--pink); }
    .story-section.reverse .story-media { box-shadow: -18px 20px 0 var(--pink); }
    .story-media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
    .story-media.city img { object-position: center; }
    .story-media.team img { object-position: 50% 45%; }
    .story-media.phone { min-height: 620px; width: min(100%, 390px); justify-self: center; box-shadow: 18px 20px 0 var(--pink); }
    .story-media.phone img { object-position: top center; }
    .story-copy p { margin: 0; color: var(--muted); font-size: clamp(17px, 1.5vw, 20px); line-height: 1.9; }
    .story-copy p::first-letter { color: var(--wine); font-family: var(--serif); font-size: 4.4em; font-weight: 600; line-height: .74; float: left; padding: .12em .1em 0 0; }
    .story-section.accent .story-copy p { color: white; }
    .story-section.accent .story-copy p::first-letter { color: var(--pink); }
    .story-section.final .story-row { grid-template-columns: 1fr; }
    .story-section.final .story-copy { width: 100%; }
    .story-section.final .story-copy p { color: var(--muted); }

    .gallery { scroll-margin-top: 88px; padding: clamp(78px, 9vw, 120px) 0; background: var(--cream); }
    .gallery-head { display: flex; align-items: end; justify-content: space-between; gap: 30px; margin-bottom: 42px; }
    .gallery-intro { max-width: 430px; margin: 0; color: var(--muted); font-size: 16px; line-height: 1.7; }
    .gallery-grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); grid-auto-rows: 245px; gap: 16px; }
    .gallery-item { position: relative; min-width: 0; margin: 0; overflow: hidden; border-radius: 4px; background: var(--wine-dark); }
    .gallery-item:nth-child(1) { grid-column: span 5; grid-row: span 2; }
    .gallery-item:nth-child(2) { grid-column: span 4; }
    .gallery-item:nth-child(3) { grid-column: span 3; }
    .gallery-item:nth-child(4) { grid-column: span 3; }
    .gallery-item:nth-child(5) { grid-column: span 4; }
    .gallery-button { position: relative; display: block; width: 100%; height: 100%; padding: 0; overflow: hidden; border: 0; background: transparent; cursor: zoom-in; }
    .gallery-button::after { content: "+"; position: absolute; right: 16px; bottom: 16px; width: 42px; height: 42px; display: grid; place-items: center; border-radius: 50%; color: var(--wine-dark); background: var(--pink); font-family: var(--serif); font-size: 27px; line-height: 1; opacity: 0; transform: translateY(8px); transition: opacity .25s, transform .25s; }
    .gallery-button:hover::after, .gallery-button:focus-visible::after { opacity: 1; transform: none; }
    .gallery-item img { width: 100%; height: 100%; object-fit: cover; transition: transform .55s ease, filter .55s ease; }
    .gallery-item:nth-child(1) img, .gallery-item:nth-child(2) img, .gallery-item:nth-child(4) img, .gallery-item:nth-child(5) img { object-position: center 28%; }
    .gallery-button:hover img, .gallery-button:focus-visible img { transform: scale(1.035); filter: saturate(1.06); }

    .program-section, .candidates-section { padding: clamp(64px, 8vw, 100px) 0; scroll-margin-top: 104px; border-top: 1px solid var(--line); }
    .program-content { max-width: 860px; }
    .program-content h3 { margin: 42px 0 18px; font-family: var(--serif); font-size: clamp(25px, 3vw, 34px); line-height: 1.25; }
    .program-content .program-intro-title { margin-top: 30px; }
    .program-content p, .program-content li { font-size: 17px; line-height: 1.8; }
    .program-content p { margin: 0 0 18px; }
    .program-content ul { margin: 0 0 22px; padding-left: 24px; }
    .program-content li { padding-left: 4px; margin-bottom: 8px; }
    .candidate-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px; margin-top: 36px; }
    .candidate-group { padding: clamp(24px, 4vw, 40px); border: 1px solid var(--line); border-top: 5px solid var(--pink); }
    .candidate-group h3 { margin: 0 0 24px; font-family: var(--serif); font-size: 30px; }
    .candidate-list { margin: 0; padding-left: 36px; }
    .candidate-list li { padding: 10px 0 10px 8px; font-size: 18px; line-height: 1.5; }
    .candidate-list li::marker { font-weight: 800; }
    .region-candidates { margin-top: 36px; max-width: 680px; }
    @media (min-width: 901px) { .nav { gap: 20px; } .nav-links { gap: clamp(12px, 1.6vw, 24px); } .nav-links a { text-align: center; } .brand { flex-shrink: 0; } }
    @media (max-width: 600px) { .candidate-grid { grid-template-columns: 1fr; } .candidates-section .section-title { font-size: 40px; } }

    .supporters { padding: clamp(48px, 6vw, 78px) 0; border-top: 1px solid var(--line); background: white; }
    .supporters-strip { overflow-x: auto; overscroll-behavior-inline: contain; scrollbar-width: thin; scrollbar-color: var(--wine) #eef4f1; }
    .supporters-strip img { width: 100%; height: auto; }

    .lightbox { position: fixed; z-index: 100; inset: 0; display: grid; place-items: center; padding: 70px 80px 34px; background: rgba(0, 77, 54, .96); opacity: 0; visibility: hidden; pointer-events: none; transition: opacity .22s, visibility .22s; }
    .lightbox.is-open { opacity: 1; visibility: visible; pointer-events: auto; }
    .lightbox-image { max-width: 100%; max-height: calc(100vh - 104px); object-fit: contain; box-shadow: 0 28px 80px rgba(0,77,54,.4); transform: scale(.97); transition: transform .25s; }
    .lightbox.is-open .lightbox-image { transform: scale(1); }
    .lightbox-close, .lightbox-nav { position: fixed; display: grid; place-items: center; border: 1px solid white; border-radius: 50%; color: white; background: var(--wine); cursor: pointer; transition: background .2s, border-color .2s; }
    .lightbox-close:hover, .lightbox-nav:hover { border-color: var(--pink); background: var(--wine); }
    .lightbox-close { top: 18px; right: 20px; width: 46px; height: 46px; font-size: 31px; line-height: 1; }
    .lightbox-nav { top: 50%; width: 52px; height: 52px; font-family: var(--serif); font-size: 39px; line-height: 1; transform: translateY(-50%); }
    .lightbox-prev { left: 18px; }
    .lightbox-next { right: 18px; }

    .vision { position: relative; padding: 110px 0 125px; }
    .vision-head { display: flex; align-items: end; justify-content: space-between; gap: 30px; margin-bottom: 55px; }
    .vision-head p { max-width: 420px; margin: 0; color: var(--muted); line-height: 1.7; }
    .cards { display: grid; grid-template-columns: repeat(4, 1fr); border: 1px solid var(--line); }
    .card { min-height: 315px; padding: 35px 30px; border-right: 1px solid var(--line); background: white; transition: color .25s, background .25s, transform .25s; }
    .card:last-child { border-right: 0; }
    .card:hover { position: relative; z-index: 2; color: white; background: var(--wine); transform: translateY(-8px); }
    .card-num { display: block; margin-bottom: 68px; color: var(--pink); font-family: var(--serif); font-size: 18px; font-style: italic; }
    .card:hover .card-num { color: var(--pink); }
    .card:hover p { color: white; }
    .card h3 { margin: 0 0 13px; font-family: var(--serif); font-size: 27px; font-weight: 600; }
    .card p { margin: 0; color: var(--muted); font-size: 14px; line-height: 1.7; transition: color .25s; }

    .quote { display: grid; grid-template-columns: 1fr 1fr; min-height: 600px; background: var(--wine); color: white; }
    .quote-photo { min-height: 520px; background: url('material/b19be1c1-2310-41eb-91c0-dbdf4076b92a.jpeg') center/cover; }
    .quote-copy { display: flex; flex-direction: column; justify-content: center; padding: clamp(55px, 7vw, 105px); }
    .quote-mark { color: var(--pink); font-family: var(--serif); font-size: 76px; line-height: .5; }
    blockquote { margin: 25px 0 35px; font-family: var(--serif); font-size: clamp(31px, 4vw, 54px); line-height: 1.16; letter-spacing: -.025em; }
    .quote-copy p { margin: 0; color: white; font-size: 13px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; }

    .join { padding: 100px 0; text-align: center; background: var(--cream); }
    .join .section-title { max-width: 780px; margin-inline: auto; }
    .join p { max-width: 590px; margin: 22px auto 32px; color: var(--muted); font-size: 17px; line-height: 1.75; }
    .join .btn { background: var(--wine); color: white; }

    footer { padding: 55px 0 35px; background: var(--wine-dark); color: white; }
    .footer-grid { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: clamp(30px, 6vw, 80px); }
    .footer-identity { text-align: left; }
    .footer-identity strong { display: block; margin-bottom: 6px; font-family: var(--serif); font-size: 21px; }
    .footer-identity span { color: white; font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
    .footer-grid > .social { justify-self: end; }
    .footer-bottom { display: flex; align-items: center; justify-content: center; gap: 25px; margin-top: 38px; padding-top: 22px; border-top: 1px solid rgba(255,255,255,.14); text-align: center; }
    .footer-bottom p { margin: 0; color: white; font-size: 12px; }
    .social { display: flex; gap: 10px; }
    .social a { display: grid; place-items: center; width: 42px; height: 42px; border: 1px solid rgba(255,255,255,.25); border-radius: 50%; font-weight: 700; }

    .reveal { opacity: 0; transform: translateY(24px); transition: opacity .7s ease, transform .7s ease; }
    .reveal.visible { opacity: 1; transform: none; }

    @media (max-width: 900px) {
      .site-header { top: 0; }
      .nav { min-height: 88px; }
      .menu-btn { display: block; }
      .nav-links { position: absolute; top: 88px; left: 20px; right: 20px; display: none; flex-direction: column; align-items: stretch; gap: 0; padding: 16px; border-radius: 14px; background: var(--wine-dark); color: white; box-shadow: 0 20px 40px rgba(0,77,54,.25); }
      .nav-links.open { display: flex; }
      .nav-links a { padding: 13px; }
      .hero { padding: 135px 0 72px; background: #fff; }
      .hero-grid { grid-template-columns: 1fr; gap: 54px; }
      .hero-content { width: 100%; padding: 28px 0 0; }
      .hero-portrait { width: min(100% - 18px, 570px); min-height: 600px; margin-inline: auto; }
      .hero-copy { font-size: 16px; }
      .intro-grid { grid-template-columns: 1fr; }
      .story-row { grid-template-columns: 1fr; }
      .story-section.reverse .story-media { order: 0; }
      .story-media { min-height: 390px; box-shadow: 12px 14px 0 var(--pink); }
      .story-section.reverse .story-media { box-shadow: -12px 14px 0 var(--pink); }
      .story-media.phone { min-height: 560px; }
      .gallery-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: 300px; }
      .gallery-item:nth-child(n) { grid-column: span 1; grid-row: span 1; }
      .gallery-item:first-child { grid-column: span 2; grid-row: span 2; }
      .cards { grid-template-columns: repeat(2, 1fr); }
      .card:nth-child(2) { border-right: 0; }
      .card:nth-child(-n+2) { border-bottom: 1px solid var(--line); }
      .quote { grid-template-columns: 1fr; }
      .quote-photo { min-height: 430px; }
    }

    @media (max-width: 600px) {
      .wrap { width: min(100% - 28px, 1180px); }
      .topbar { font-size: 9px; }
      .brand { font-size: 14px; }
      .brand-logo { width: 126px; }
      h1 { font-size: clamp(47px, 15vw, 68px); }
      .hero { padding: 120px 0 62px; }
      .hero-grid { gap: 42px; }
      .hero-content { padding-top: 34px; }
      .hero-portrait { min-height: 470px; }
      .hero-photo { bottom: -9%; width: 110%; height: 110%; }
      .hero-portrait::before { inset: 20px -12px -14px 18px; }
      .hero-portrait::after { left: -8px; width: 82px; height: 8px; }
      .eyebrow { font-size: 10px; }
      .hero-copy { margin: 20px 0 26px; line-height: 1.55; }
      .actions .btn { width: 100%; }
      .intro, .vision, .join { padding: 75px 0; }
      .story-section { padding: 68px 0; }
      .story-media { min-height: 300px; }
      .story-media.phone { min-height: 520px; width: min(86%, 360px); }
      .gallery { padding: 72px 0 76px; }
      .gallery-head { align-items: start; flex-direction: column; gap: 18px; margin-bottom: 30px; }
      .gallery-grid { grid-template-columns: 1fr; grid-auto-rows: 340px; gap: 12px; }
      .gallery-item:nth-child(n) { grid-column: auto; grid-row: auto; }
      .gallery-item:nth-child(3) { height: 235px; }
      .gallery-button::after { opacity: 1; transform: none; }
      .supporters { padding: 42px 0; }
      .supporters-strip img { width: 900px; max-width: none; }
      .lightbox { padding: 68px 14px 78px; }
      .lightbox-image { max-height: calc(100vh - 146px); }
      .lightbox-nav { top: auto; bottom: 14px; transform: none; }
      .lightbox-prev { left: calc(50% - 61px); }
      .lightbox-next { right: calc(50% - 61px); }
      .vision-head { align-items: start; flex-direction: column; }
      .cards { grid-template-columns: 1fr; }
      .card { min-height: 250px; border-right: 0; border-bottom: 1px solid var(--line); }
      .card:last-child { border-bottom: 0; }
      .card-num { margin-bottom: 42px; }
      .quote-photo { min-height: 330px; background-position: 46% center; }
      .quote-copy { padding: 65px 28px; }
      .footer-grid { grid-template-columns: 1fr; align-items: flex-start; gap: 28px; }
      .footer-grid > .social { justify-self: start; }
      .footer-bottom { justify-content: center; }
    }

    @media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; } .reveal { opacity: 1; transform: none; } }