/*
 * Studio refinement — composition, type scale and spacing taken from the live
 * Amoxi Studio Webflow preview (inspected 3 Nov 2026), rebuilt as plain HTML/CSS. No Webflow code, fonts or images are used.
 *
 * Reference tokens adapted here: 1280px content container; medium (500)
 * headings at 110% line height with slight negative tracking; 60/48/32/24px
 * heading scale; monospaced small labels; pale rounded panels (20px radius);
 * pill buttons; fine 1px dividers; ~100px section rhythm.
 *
 * Page copy lives in the HTML files. Class names (wp-block-*) come from the
 * original WordPress markup and are kept so this stylesheet applies unchanged.
 */

:root{
  --c-navy:#2C3D5C;
  /* Accent: dark blue only (no bright blue). Swap these two values to match FCJ's exact accent once confirmed. */
  --c-accent:#2C3D5C;
  --c-accent-hover:#1E2A40;
  --c-pale:#F5F9FC;
  --c-pale-2:#EEF3F9;
  --c-rule:#DCE3EC;
  --c-muted:#5D6B80;
  --c-ink:#1E2A40;
  --f-sans:"Inter Display","Inter","Segoe UI Variable Display","Segoe UI Variable Text","Segoe UI",-apple-system,BlinkMacSystemFont,"Helvetica Neue",Arial,sans-serif;
  --f-mono:var(--f-sans); /* Small labels use the same font as the page text. */
  --container:1280px;
  --gutter:max(20px,calc((calc(100vw / var(--z,1)) - var(--container))/2));
  --section:clamp(64px,calc(8vw / var(--z,1)),112px);
  --radius:20px;
  --radius-s:12px;
  --track:-.02em;
}

/* ---------- Base ---------- */
html{scroll-behavior:smooth;scroll-padding-top:24px}
body{margin:0;background:#fff;color:var(--c-navy);font-family:var(--f-sans);font-size:1rem;line-height:1.6;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
.wp-site-blocks{padding:0}
.wp-site-blocks>header,.wp-site-blocks>main,.wp-site-blocks>footer{margin-block-start:0}
main{min-height:calc(60vh / var(--z,1))}
h1,h2,h3,h4{font-family:var(--f-sans);font-weight:500;line-height:1.1;letter-spacing:var(--track);color:var(--c-ink);text-wrap:balance}
p{text-wrap:pretty}
a{color:var(--c-accent);text-underline-offset:.22em;text-decoration-thickness:1px}
a:focus-visible,button:focus-visible,.wp-block-button__link:focus-visible{outline:2px solid var(--c-accent);outline-offset:4px;border-radius:4px}

/* Section shell: every top-level page section spans the 1280px container. */
.wp-block-post-content>.wp-block-group{margin-block-start:0;padding-inline:var(--gutter);box-sizing:border-box}
.wp-block-post-content>.wp-block-group>*{max-width:none;margin-left:0!important;margin-right:0!important}
.wp-block-post-content>.has-light-background-color{background-color:#fff!important}
.section-pad{padding-block:var(--section);scroll-margin-top:16px}
.section-pad h2{font-size:clamp(2rem,calc(3.6vw / var(--z,1)),3rem);margin:0 0 24px}
.section-pad h3{font-size:clamp(1.25rem,calc(1.8vw / var(--z,1)),1.5rem);margin:0 0 10px}
.section-pad p{max-width:680px}

/* ---------- Labels ---------- */
.eyebrow{font-family:var(--f-mono);font-size:.75rem;line-height:1.4;font-weight:400;letter-spacing:.04em;text-transform:uppercase;color:var(--c-muted);margin:0 0 28px!important}
/* Section numbers such as "(01)" removed 11 Nov 2026 at the owner's request; labels stay. */

/* Fine dividers between sections */
.wp-block-post-content>.section-pad+.section-pad:not(#false-promises){background-image:linear-gradient(var(--c-rule),var(--c-rule));background-repeat:no-repeat;background-position:var(--gutter) 0;background-size:calc(100% - 2*var(--gutter)) 1px}

/* ---------- Buttons ---------- */
.wp-block-buttons{gap:10px}
.wp-block-button__link{display:inline-flex;align-items:center;gap:.6em;min-height:46px;box-sizing:border-box;padding:12px 24px;border-radius:999px;font-size:.9375rem;font-weight:500;line-height:1.3;letter-spacing:0;background:var(--c-accent);color:#fff;transition:background-color .25s ease,color .25s ease,border-color .25s ease}
.wp-block-button:not(.is-style-outline) .wp-block-button__link:hover{background:var(--c-accent-hover)}
.is-style-outline .wp-block-button__link{background:transparent;color:var(--c-navy);border:1px solid var(--c-rule)}
.is-style-outline .wp-block-button__link:hover{border-color:var(--c-navy);background:var(--c-pale)}
.wp-block-button__link::after{content:"\2192";font-size:1em;transition:transform .25s ease}
.wp-block-button__link:hover::after{transform:translateX(3px)}
a.wp-block-button__link[href^="#"]::after,a.wp-block-button__link[href^="index.html#"]::after{content:"\2193"}
a.wp-block-button__link[href^="#"]:hover::after,a.wp-block-button__link[href^="index.html#"]:hover::after{transform:translateY(2px)}

/* ---------- Header ---------- */
.site-header{padding:18px var(--gutter);border-bottom:0;gap:24px;align-items:center;background:#fff}
.site-header .wp-block-site-title{font-size:1.25rem!important;font-weight:600!important;letter-spacing:-.03em;line-height:1.1}
.site-header .wp-block-site-title a{text-decoration:none;color:var(--c-navy)}
.site-header .wp-block-navigation{font-size:.9375rem;font-weight:500;gap:30px}
.site-header .wp-block-navigation-item__content{text-decoration:none;min-height:44px;display:inline-flex;align-items:center;color:var(--c-navy)}
.site-header .wp-block-navigation-item__content:hover{color:var(--c-accent)}
.site-header .current-menu-item>.wp-block-navigation-item__content,.site-header .wp-block-navigation-item__content[aria-current="page"]{color:var(--c-accent)}
.site-header .header-cta .wp-block-navigation-item__content{padding:0 20px;min-height:40px;background:var(--c-pale-2);color:var(--c-navy);border-radius:999px;transition:background-color .25s ease,color .25s ease}
.site-header .header-cta .wp-block-navigation-item__content:hover{background:var(--c-accent);color:#fff}

/* ---------- Home: hero ---------- */
.wp-block-post-content>.campaign-hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(240px,340px);column-gap:clamp(32px,calc(6vw / var(--z,1)),96px);row-gap:0;align-items:end;padding-top:clamp(48px,calc(7vw / var(--z,1)),96px);padding-bottom:clamp(36px,calc(4.5vw / var(--z,1)),64px)}
.campaign-hero>.eyebrow{grid-column:1/-1;grid-row:1}
.campaign-hero h1{grid-column:1;grid-row:2/4;margin:0!important;max-width:1000px;font-size:clamp(2.75rem,calc(6vw / var(--z,1)),5.25rem);line-height:1.02;letter-spacing:-.035em}
.campaign-hero>.hero-summary{grid-column:2;grid-row:2;align-self:end;margin:0 0 24px!important;font-size:1rem;line-height:1.55;color:var(--c-muted);max-width:340px}
.campaign-hero>.wp-block-buttons{grid-column:2;grid-row:3;margin:0!important;align-self:end}

/* ---------- Home: film as the main visual ---------- */
.wp-block-post-content>#false-promises{display:grid;grid-template-columns:1fr auto;align-items:baseline;column-gap:24px;padding-top:0;padding-bottom:var(--section)}
#false-promises>h2{grid-column:1;grid-row:1;font-size:.9375rem;font-weight:500;letter-spacing:0;margin:0 0 14px;color:var(--c-ink)}
#false-promises>.eyebrow{grid-column:2;grid-row:1;margin:0 0 14px!important}
#false-promises>:not(h2):not(.eyebrow){grid-column:1/-1}
/* Placeholder panel until the approved film or thumbnail is supplied */
#false-promises>.video-placeholder{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;aspect-ratio:16/9;min-height:300px;max-height:calc(78vh / var(--z,1));width:100%;margin:0;padding:32px;box-sizing:border-box;border-radius:var(--radius);overflow:hidden;color:#fff;background:radial-gradient(120% 90% at 85% 10%,rgba(98,124,166,.55) 0%,rgba(98,124,166,0) 55%),radial-gradient(90% 80% at 10% 100%,rgba(98,124,166,.3) 0%,rgba(98,124,166,0) 60%),var(--c-navy)!important}
#false-promises>.video-placeholder>*{max-width:none}
#false-promises>.video-placeholder>.asset-placeholder{position:absolute;left:28px;bottom:24px;margin:0!important;font-family:var(--f-mono);font-size:.75rem;letter-spacing:.04em;text-transform:uppercase;color:#fff}
#false-promises>.video-placeholder>p:not(.asset-placeholder){position:absolute;right:28px;bottom:24px;margin:0!important;font-family:var(--f-mono);font-size:.75rem;letter-spacing:.04em;text-transform:uppercase;color:#C9D6EA;text-align:right;max-width:45%}
.film-play-preview{position:relative;text-align:center}
.film-play-preview button{display:inline-flex;align-items:center;gap:14px;padding:10px 26px 10px 10px;border:1px solid rgba(255,255,255,.28);border-radius:999px;background:rgba(255,255,255,.14);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);color:#fff;font:inherit;font-size:1rem;font-weight:500;cursor:not-allowed}
.film-play-preview button::before{content:"";flex:none;width:56px;height:56px;border-radius:50%;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M8 5.5v13l10.5-6.5z' fill='%232C3D5C'/%3E%3C/svg%3E") 54% 50%/24px no-repeat}
.film-play-preview button::after{content:none}
.film-play-preview small{display:block;margin-top:12px;font-size:.8125rem;color:#C9D6EA}
/* Approved media replacing the placeholder: Video, Embed, Cover (muted loop) or Image (thumbnail) */
#false-promises>.wp-block-video,#false-promises>.wp-block-embed,#false-promises>.wp-block-cover,#false-promises>.wp-block-image{margin:0;width:100%;border-radius:var(--radius);overflow:hidden;background:var(--c-navy)}
#false-promises>.wp-block-video video,#false-promises>.wp-block-image img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover}
#false-promises>.wp-block-embed .wp-block-embed__wrapper{aspect-ratio:16/9}
#false-promises>.wp-block-embed iframe{width:100%;height:100%}
#false-promises figcaption{margin:12px 0 0;font-size:.8125rem;color:var(--c-muted);text-align:left}
#false-promises>.wp-block-buttons{margin-top:20px}
.film-loop.wp-block-cover{min-height:min(calc(78vh / var(--z,1)),720px)!important;aspect-ratio:16/9;padding:32px;align-items:flex-end;justify-content:flex-start}
.film-loop .wp-block-cover__inner-container{width:auto;max-width:none}
.film-loop .wp-block-cover__inner-container p{color:#fff;font-family:var(--f-mono);font-size:.75rem;letter-spacing:.04em;text-transform:uppercase;margin:0 0 14px}
.film-loop .wp-block-button__link{background:#fff;color:var(--c-navy)}
.film-loop .wp-block-button__link:hover{background:var(--c-pale-2)!important}
.film-loop .wp-block-button__link::after{content:"\25B6";font-size:.7em;color:var(--c-accent)}
@media(prefers-reduced-motion:reduce){.film-loop video.wp-block-cover__video-background{display:none}}

/* ---------- Home: issue preview (label | statement) ---------- */
#issue-preview{display:grid;grid-template-columns:minmax(160px,1fr) minmax(0,2.6fr);column-gap:clamp(32px,calc(6vw / var(--z,1)),96px);align-items:start}
#issue-preview>.eyebrow{grid-column:1;grid-row:1/5;margin:10px 0 0!important}
#issue-preview>:not(.eyebrow){grid-column:2}
#issue-preview>h2{margin:0 0 24px}
#issue-preview>p:not(.eyebrow){max-width:760px;margin:0 0 36px;font-size:clamp(1.25rem,calc(2vw / var(--z,1)),1.625rem);line-height:1.4;font-weight:400;letter-spacing:-.01em;color:var(--c-navy)}
#issue-preview>.wp-block-buttons{margin:0}

/* ---------- Text links used for secondary actions ---------- */
#issue-preview .wp-block-button__link,.story-copy .wp-block-button__link{padding:6px 0;min-height:44px;background:transparent!important;color:var(--c-navy);border-radius:0;border-bottom:1px solid var(--c-navy)}
#issue-preview .wp-block-button__link:hover,.story-copy .wp-block-button__link:hover{color:var(--c-accent);border-color:var(--c-accent)}

/* ---------- Resident stories (Home + Issues) ---------- */
#burnley-preview>.wp-block-columns,#burnley>.wp-block-columns{margin:32px 0 0;padding:12px;gap:12px;background:var(--c-pale);border-radius:var(--radius);align-items:stretch!important}
#burnley-preview>.wp-block-columns>.wp-block-column,#burnley>.wp-block-columns>.wp-block-column{display:flex;flex-direction:column}
.story-copy{flex:1;display:flex;flex-direction:column;justify-content:flex-start;gap:12px;padding:24px 20px!important}
.story-copy>*{margin:0!important}
.story-copy p{color:var(--c-muted);font-size:1rem}
.story-copy .wp-block-buttons{margin-top:auto!important;padding-top:16px}
.story-copy h3{font-size:1.5rem}
/* Compact labelled slot — no empty image frame */
.video-placeholder{flex:1;display:flex;flex-direction:column;justify-content:flex-end;align-items:flex-start;gap:6px;min-height:200px;margin:0;padding:24px;box-sizing:border-box;background:#fff!important;border:0;border-radius:var(--radius-s);color:var(--c-navy);text-align:left}
.video-placeholder>*{margin:0!important;max-width:none}
.video-placeholder .asset-placeholder{font-size:1rem;font-weight:500;color:var(--c-ink)}
.video-placeholder:not(#false-promises>*) .asset-placeholder::before{content:"";display:block;width:40px;height:40px;margin-bottom:18px;border-radius:50%;background:var(--c-pale-2) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M8 5.5v13l10.5-6.5z' fill='%232C3D5C'/%3E%3C/svg%3E") 56% 50%/16px no-repeat}
.video-placeholder p{font-size:.875rem;color:var(--c-muted)}
/* Approved film stills / resident videos dropped into a story column */
#burnley-preview .wp-block-column>.wp-block-image,#burnley-preview .wp-block-column>.wp-block-video,#burnley-preview .wp-block-column>.wp-block-embed,#burnley .wp-block-column>.wp-block-image,#burnley .wp-block-column>.wp-block-video,#burnley .wp-block-column>.wp-block-embed{margin:0;border-radius:var(--radius-s);overflow:hidden}
#burnley-preview .wp-block-column>.wp-block-image img,#burnley .wp-block-column>.wp-block-image img,#burnley-preview .wp-block-video video,#burnley .wp-block-video video{display:block;width:100%;aspect-ratio:16/10;object-fit:cover}
.asset-note{font-size:.8125rem!important;color:var(--c-muted)}
#burnley>.asset-note{margin-top:20px!important}
.asset-placeholder{font-weight:500}

/* ---------- Home: get involved ---------- */
#get-involved>.wp-block-columns{margin-top:40px;gap:clamp(32px,calc(6vw / var(--z,1)),96px)}
.involvement-copy>*{max-width:none}
.involvement-copy h3{margin:0 0 6px!important;padding-top:22px;border-top:1px solid var(--c-rule);font-size:1.25rem}
.involvement-copy h3:first-child{padding-top:0;border-top:0}
.involvement-copy p{margin:0 0 22px!important;font-size:1rem;color:var(--c-muted)}
.preview-notice{margin-top:32px!important;padding:14px 16px;border-radius:var(--radius-s);background:var(--c-pale);font-size:.8125rem!important;line-height:1.6;color:var(--c-muted)!important}
.form-preview-wrap>*{max-width:none}
.signup-preview{padding:12px;border:0;border-radius:var(--radius);background:var(--c-pale);font-size:.9375rem}
.signup-preview{display:grid;gap:0}
.signup-preview label{display:block;padding:16px 16px 0;font-weight:500;color:var(--c-ink);background:#fff;border-radius:var(--radius-s) var(--radius-s) 0 0;margin-top:8px}
.signup-preview label:first-child{margin-top:0}
.signup-preview input,.signup-preview select,.signup-preview textarea{display:block;box-sizing:border-box;width:100%;max-width:100%;margin:0;padding:10px 16px 16px;border:0;border-radius:0 0 var(--radius-s) var(--radius-s);background:#fff;color:var(--c-muted);font:inherit;opacity:1;appearance:none}
.signup-preview textarea{resize:none}
.signup-preview button{margin-top:12px;min-height:48px;border:0;border-radius:999px;background:#8592A7;color:#fff;font:inherit;font-weight:500;cursor:not-allowed}
.signup-preview p{margin:12px 0 4px;font-size:.75rem;color:var(--c-muted);text-align:center}

/* ---------- Inner pages: intro ---------- */
.page-intro{padding-top:clamp(48px,calc(7vw / var(--z,1)),96px)!important;padding-bottom:clamp(48px,calc(6vw / var(--z,1)),80px)!important}
.page-intro>.eyebrow::before{content:"";display:inline-block;width:8px;height:8px;margin-right:10px;border-radius:50%;background:var(--c-accent);vertical-align:1px}
.page-intro h1{max-width:1000px;margin:0 0 28px!important;font-size:clamp(2.75rem,calc(5.6vw / var(--z,1)),4.75rem);line-height:1.04;letter-spacing:-.03em}
.page-intro>p:not(.eyebrow){max-width:640px;margin:0 0 14px!important;font-size:1.125rem;color:var(--c-muted)}
.page-intro>p:not(.eyebrow):first-of-type{font-size:clamp(1.125rem,calc(1.6vw / var(--z,1)),1.375rem);line-height:1.5;color:var(--c-navy)}

/* ---------- Issues: campaign asks ---------- */
#primary-asks{display:grid;grid-template-columns:minmax(160px,1fr) minmax(0,2.6fr);column-gap:clamp(32px,calc(6vw / var(--z,1)),96px)}
#primary-asks>.eyebrow{grid-column:1;grid-row:1/3;margin-top:12px!important}
#primary-asks>:not(.eyebrow){grid-column:2}
#primary-asks>h2{margin-bottom:40px}
#primary-asks>.wp-block-columns,#supporting-asks>.wp-block-columns{display:block;margin:0;border-top:1px solid var(--c-rule)}
#primary-asks>.wp-block-columns>.wp-block-column,#supporting-asks>.wp-block-columns>.wp-block-column{margin:0}
.campaign-card{height:auto;margin:0;padding:32px 0;border:0;border-bottom:1px solid var(--c-rule);border-radius:0;background:transparent}
.campaign-card>*{max-width:none}
.ask-card{display:grid;grid-template-columns:72px minmax(0,1fr);gap:16px;align-items:baseline;transition:padding .3s ease}
.ask-number{margin:0!important;font-family:var(--f-mono);font-size:.875rem;letter-spacing:.04em;color:var(--c-accent)}
.ask-card h3{margin:0!important;max-width:820px;font-size:clamp(1.5rem,calc(3vw / var(--z,1)),2.5rem);line-height:1.12;letter-spacing:-.025em}
#supporting-asks{display:grid;grid-template-columns:minmax(160px,1fr) minmax(0,2.6fr);column-gap:clamp(32px,calc(6vw / var(--z,1)),96px)}
#supporting-asks>h2{grid-column:1;font-size:1.25rem;margin:4px 0 24px;letter-spacing:-.01em}
#supporting-asks>.wp-block-columns{grid-column:2}
#supporting-asks .campaign-card{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.4fr);gap:24px;padding:22px 0}
#supporting-asks .campaign-card h3{margin:0!important;font-size:1.25rem}
#supporting-asks .campaign-card p{margin:0!important;font-size:.9375rem;color:var(--c-muted)}

/* Launch-plan copy additions */
#false-promises>.film-caption{margin:16px 0 0!important;max-width:680px;font-size:.9375rem;color:var(--c-muted)}
#primary-asks>p:not(.eyebrow):not(.asset-note):not(.ask-route){margin:-16px 0 40px;max-width:720px;font-size:1.125rem;line-height:1.55;color:var(--c-navy)}
.ask-card>p:not(.ask-number){grid-column:2;margin:14px 0 0!important;max-width:760px;font-size:1rem;line-height:1.6;color:var(--c-muted)}
#primary-asks>.ask-route{margin:32px 0 8px;max-width:720px;font-size:.9375rem;color:var(--c-muted)}
#primary-asks>.asset-note{margin:0!important}
#supporting-asks>.residents-call{grid-column:2;margin-top:32px;padding:24px;border-radius:var(--radius);background:var(--c-pale)}
.residents-call>*{max-width:none;margin:0!important}
.residents-call h3{font-size:1.25rem;margin-bottom:8px!important}
.residents-call p{max-width:720px;color:var(--c-muted)}
.residents-call .asset-note{margin-top:12px!important}
.page-intro>.asset-note{font-size:.8125rem!important}
#burnley>p:not(.eyebrow):not(.asset-note){max-width:760px}

/* ---------- Issues: related links band ---------- */
#related-links{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:24px 48px}
#related-links>h2{margin:0;max-width:640px}
#related-links>.wp-block-buttons{margin:0}

/* ---------- Material ---------- */
#white-paper>.wp-block-columns{gap:12px;padding:12px;background:var(--c-pale);border-radius:var(--radius);align-items:stretch!important}
.resource-copy{padding:24px 20px!important}
.resource-copy>*{max-width:none}
.resource-copy h2{font-size:clamp(1.75rem,calc(3vw / var(--z,1)),2.5rem);margin-bottom:16px}
.resource-copy p{color:var(--c-muted)}
.resource-panel{height:100%;box-sizing:border-box;display:flex;flex-direction:column;justify-content:flex-end;gap:6px;min-height:200px;padding:24px!important;border:0;border-radius:var(--radius-s);background:#fff}
.resource-panel>*{margin:0!important;max-width:none}
.resource-panel .eyebrow{margin-bottom:auto!important}
.resource-panel .asset-placeholder{font-size:1.125rem;color:var(--c-ink)}
.resource-panel .asset-placeholder::before{content:"";display:block;width:40px;height:40px;margin:28px 0 18px;border-radius:50%;background:var(--c-pale-2) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232C3D5C' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 4v11m0 0-4.5-4.5M12 15l4.5-4.5M5 19.5h14'/%3E%3C/svg%3E") 50% 50%/18px no-repeat}
.resource-panel .wp-block-file{margin:0}
#resource-scope{display:grid;grid-template-columns:minmax(160px,1fr) minmax(0,2.6fr);column-gap:clamp(32px,calc(6vw / var(--z,1)),96px)}
#resource-scope>h2{grid-column:1;grid-row:1/4;font-size:1.25rem;margin:4px 0 20px;letter-spacing:-.01em}
#resource-scope>:not(h2){grid-column:2}
#resource-scope>p{margin:0 0 20px}
.resource-placeholder{padding-top:20px;border-top:1px solid var(--c-rule);font-size:.9375rem;color:var(--c-muted)}

/* ---------- Contact ---------- */
.contact-route{margin-top:48px!important;padding:28px!important;max-width:760px!important;border:0;border-radius:var(--radius);background:var(--c-pale)}
.contact-route>*{max-width:none;margin:0!important}
.contact-route h2{font-size:1.25rem;letter-spacing:-.01em}
.contact-route p:not(.asset-note){margin-top:8px!important;font-size:1.125rem;color:var(--c-ink)}
.contact-route .asset-note{margin-top:20px!important;padding-top:16px;border-top:1px solid var(--c-rule)}
#affected-residents,#supporters-and-organisations{display:grid;grid-template-columns:minmax(160px,1fr) minmax(0,2.6fr);column-gap:clamp(32px,calc(6vw / var(--z,1)),96px)}
#affected-residents>.eyebrow,#supporters-and-organisations>.eyebrow{grid-column:1;grid-row:1/8;margin-top:10px!important}
#affected-residents>:not(.eyebrow),#supporters-and-organisations>:not(.eyebrow){grid-column:2}
#affected-residents p,#supporters-and-organisations p{margin:0 0 14px;color:var(--c-muted)}
#affected-residents .wp-block-buttons,#supporters-and-organisations .wp-block-buttons{margin-top:20px}

/* ---------- Footer ---------- */
.site-footer{padding:clamp(56px,calc(7vw / var(--z,1)),96px) var(--gutter) 8px;border-top:1px solid var(--c-rule);background:var(--c-pale);color:var(--c-navy);overflow:hidden}
.site-footer>*{max-width:none!important}
.site-footer .footer-top{gap:48px}
.site-footer h2{margin:0 0 10px;font-size:1.5rem;font-weight:500;letter-spacing:var(--track)}
.site-footer p{margin:0 0 8px;max-width:420px;color:var(--c-muted);font-size:.9375rem}
.site-footer a{color:var(--c-navy);text-decoration:none}
.site-footer a:hover{color:var(--c-accent)}
.site-footer .footer-label{font-family:var(--f-mono);font-size:.75rem;letter-spacing:.04em;text-transform:uppercase;margin-bottom:16px}
.site-footer .footer-links{list-style:none;margin:0;padding:0;display:grid;gap:8px;font-size:1rem;font-weight:500}
.site-footer .footer-links a{display:inline-flex;min-height:32px;align-items:center}
.site-footer .footer-cta a{border-bottom:1px solid currentColor;padding-bottom:2px}
.site-footer .footer-meta{display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px 24px;margin:clamp(48px,calc(6vw / var(--z,1)),80px) 0 0;padding:20px 0;max-width:none;border-top:1px solid var(--c-rule);font-family:var(--f-mono);font-size:.75rem;letter-spacing:.03em;text-transform:uppercase}

/* ---------- Responsive ---------- */
@media(max-width:1000px){
  .site-header .wp-block-navigation{gap:20px}
  .wp-block-post-content>.campaign-hero{grid-template-columns:minmax(0,1fr) minmax(220px,300px)}
}
@media(max-width:781px){
  :root{--section:64px}
  .wp-block-post-content>.campaign-hero{display:flex;flex-direction:column;align-items:stretch;padding-top:40px;padding-bottom:28px}
  .campaign-hero h1{font-size:clamp(2.4rem,calc(9vw / var(--z,1)),3.4rem);margin-bottom:20px!important}
  .campaign-hero>.hero-summary{order:2;align-self:stretch;max-width:520px;margin-bottom:20px!important}
  .campaign-hero>.wp-block-buttons{order:3;align-self:stretch}
  .wp-block-post-content>#false-promises{padding-bottom:var(--section)}
  #false-promises>.video-placeholder{aspect-ratio:4/3;min-height:0;padding:24px;border-radius:16px}
  #false-promises>.video-placeholder>.asset-placeholder,#false-promises>.video-placeholder>p:not(.asset-placeholder){position:static;max-width:none;text-align:center;order:2}
  #false-promises>.video-placeholder>.asset-placeholder{margin-top:24px!important}
  #false-promises>.video-placeholder>p:not(.asset-placeholder){margin-top:6px!important}
  .film-play-preview button{padding:8px 20px 8px 8px;font-size:.9375rem}
  .film-play-preview button::before{width:46px;height:46px;background-size:20px}
  #issue-preview,#primary-asks,#supporting-asks,#resource-scope,#affected-residents,#supporters-and-organisations{display:block}
  #issue-preview>.eyebrow,#primary-asks>.eyebrow,#affected-residents>.eyebrow,#supporters-and-organisations>.eyebrow{margin:0 0 24px!important}
  #supporting-asks>h2,#resource-scope>h2{margin-bottom:16px}
  #burnley-preview>.wp-block-columns,#burnley>.wp-block-columns,#white-paper>.wp-block-columns{padding:8px;gap:8px}
  .story-copy,.resource-copy{padding:20px 16px!important}
  .video-placeholder,.resource-panel{min-height:160px}
  .ask-card{grid-template-columns:44px minmax(0,1fr);gap:8px}
  #supporting-asks .campaign-card{grid-template-columns:1fr;gap:6px}
  #supporting-asks>.residents-call{padding:20px}
  #primary-asks>p:not(.eyebrow):not(.asset-note):not(.ask-route){margin:0 0 28px}
  #related-links{display:block}
  #related-links>h2{margin-bottom:24px}
  .site-footer .footer-top{gap:32px}
}
@media(max-width:599px){
  .site-header{padding-block:14px}
  .site-header .wp-block-navigation__responsive-container.is-menu-open{padding:24px var(--gutter);background:#fff;color:var(--c-navy)}
  .site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container{align-items:flex-start;gap:14px;font-size:1.5rem}
  .site-header .wp-block-navigation__responsive-container.is-menu-open .header-cta .wp-block-navigation-item__content{font-size:1rem;padding:0 22px;min-height:48px}
  .wp-block-buttons{flex-direction:column;align-items:stretch}
  .wp-block-button,.wp-block-button__link{width:100%;justify-content:center}
  #issue-preview .wp-block-buttons,.story-copy .wp-block-buttons{align-items:flex-start}
  #issue-preview .wp-block-button,.story-copy .wp-block-button,#issue-preview .wp-block-button__link,.story-copy .wp-block-button__link{width:auto;justify-content:flex-start}
  .section-pad h2{font-size:2rem}
  .contact-route{padding:22px!important}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important}}

/* =====================================================================
 * Contrast and depth refinement (3 Nov 2026)
 * Palette (WCAG contrast measured):
 *   Navy   #2C3D5C  brand anchor: header and dark sections. White text 10.9:1
 *   Deep   #041232  footer. White text 18.5:1
 *   Black  #000000  accent on light backgrounds: primary buttons, markers, number badges.
 *                   White text on it 21:1; 21:1 vs white, 18.6:1 vs tint.
 *                   Not used on navy (only 1.9:1); there primary buttons are white with navy text (10.9:1).
 *   Hover  #2C3D5C  (navy) on light; #EEF2F7 (tint) on dark
 *   FCJ blue #2465FF  header 'Get involved' button only. White text 4.8:1; hover #174ED0 (6.9:1)
 *   Tint   #EEF2F7  pale sections. Ink 12.8:1, muted 5.4:1
 *   Ink    #1E2A40  headings on light. 14.4:1 on white
 *   Muted  #55637A  secondary text. 6.1:1 on white, 5.4:1 on tint
 *   Mist   #C9D3E2  secondary text on navy. 7.2:1
 * ===================================================================== */
:root{
  --c-black:#000000;
  --c-fcj-blue:#2465FF;
  --c-fcj-blue-hover:#174ED0;
  --c-deep:#1F2B42;
  --c-tint:#EEF2F7;
  --c-mist:#C9D3E2;
  --c-muted:#55637A;
  --c-rule:#D9E0E9;
  --c-rule-dark:rgba(255,255,255,.16);
}

/* Focus: black ring on light, white ring on dark */
a:focus-visible,button:focus-visible,.wp-block-button__link:focus-visible{outline:3px solid var(--c-black);outline-offset:3px;border-radius:6px}
#related-links :focus-visible,#supporters-and-organisations :focus-visible,.site-footer :focus-visible,#false-promises .video-placeholder :focus-visible{outline-color:#fff}
.wp-block-button__link:focus-visible{border-radius:999px}

/* ---------- Buttons ---------- */
.wp-block-button:not(.is-style-outline) .wp-block-button__link{background:var(--c-black);color:#fff;font-weight:600;box-shadow:none}
.wp-block-button:not(.is-style-outline) .wp-block-button__link:hover{background:var(--c-navy);color:#fff}
/* On navy sections primary buttons invert to white */
#related-links .wp-block-button:not(.is-style-outline) .wp-block-button__link,#supporters-and-organisations .wp-block-button:not(.is-style-outline) .wp-block-button__link{background:#fff;color:var(--c-navy)}
#related-links .wp-block-button:not(.is-style-outline) .wp-block-button__link:hover,#supporters-and-organisations .wp-block-button:not(.is-style-outline) .wp-block-button__link:hover{background:var(--c-tint);color:var(--c-navy)}
.wp-block-button:not(.is-style-outline) .wp-block-button__link:active{transform:translateY(1px)}
.is-style-outline .wp-block-button__link{background:transparent;color:var(--c-black);border:1px solid var(--c-black);font-weight:500}
.is-style-outline .wp-block-button__link:hover{background:var(--c-black);color:#fff;border-color:var(--c-black)}
/* Restrained text links for secondary actions */
#issue-preview .wp-block-button__link,.story-copy .wp-block-button__link{box-shadow:none;background:transparent!important;color:var(--c-black)!important;font-weight:600;border-bottom:2px solid var(--c-black)}
#issue-preview .wp-block-button__link:hover,.story-copy .wp-block-button__link:hover{color:var(--c-navy)!important;border-color:var(--c-navy)}

/* ---------- Header: white bar ---------- */
.site-header{background:#fff;padding-block:16px;border-bottom:1px solid var(--c-rule)}
.site-header .wp-block-site-title.has-navy-color,.site-header .wp-block-site-title a{color:var(--c-navy)!important}
.site-header .wp-block-navigation,.site-header .wp-block-navigation-item__content,.site-header .wp-block-navigation__responsive-container-open{color:var(--c-navy)}
.site-header .wp-block-navigation-item__content:hover{color:var(--c-fcj-blue)}
.site-header .header-cta .wp-block-navigation-item__content{background:var(--c-fcj-blue);color:#fff;font-weight:600}
.site-header .header-cta .wp-block-navigation-item__content:hover{background:var(--c-fcj-blue-hover);color:#fff}

/* ---------- Section rhythm: tint and dark sections replace hairlines ---------- */
.wp-block-post-content>.page-intro,.wp-block-post-content>#issue-preview,.wp-block-post-content>#supporting-asks,.wp-block-post-content>#get-involved{background-color:var(--c-tint)!important;background-image:none!important}
.wp-block-post-content>#related-links,.wp-block-post-content>#supporters-and-organisations{background-color:var(--c-navy)!important;background-image:none!important;color:#fff}
.wp-block-post-content>.page-intro+.section-pad,.wp-block-post-content>#issue-preview+.section-pad,.wp-block-post-content>#supporting-asks+.section-pad,.wp-block-post-content>#get-involved+.section-pad,.wp-block-post-content>#related-links+.section-pad{background-image:none!important}
.page-intro{border-bottom:0}

/* Labels: black counters on light, white on dark */
.eyebrow{color:var(--c-muted)}
.page-intro>.eyebrow::before,.campaign-hero>.eyebrow::before{content:"";display:inline-block;width:8px;height:8px;margin-right:10px;border-radius:50%;background:var(--c-black);vertical-align:1px}

/* ---------- Home ---------- */
.campaign-hero>.hero-summary{padding-left:18px;border-left:3px solid var(--c-black);font-size:1.25rem;line-height:1.4;font-weight:500;color:var(--c-ink)}
.film-play-preview button::before{background-color:#fff;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M8 5.5v13l10.5-6.5z' fill='%232C3D5C'/%3E%3C/svg%3E")}
#issue-preview>h2,#issue-preview>p:not(.eyebrow){color:var(--c-ink)}
#burnley-preview>.wp-block-columns,#burnley>.wp-block-columns,#white-paper>.wp-block-columns{background:var(--c-tint)}

/* Get involved: light tinted sign-up section with a white form card */
#get-involved h2,#get-involved h3{color:var(--c-ink)}
.involvement-copy h3{border-top-color:#CBD4E0}
.involvement-copy p{color:var(--c-muted)}
#get-involved .preview-notice{background:#fff;color:var(--c-muted)!important;border-left:3px solid var(--c-black)}
.signup-preview{background:#fff;padding:16px;border:1px solid var(--c-rule)}
/* white field panels, outlined so each field stays distinct inside the white box */
.signup-preview label,.signup-preview input,.signup-preview select,.signup-preview textarea{background:#fff;border:1px solid var(--c-rule)}
.signup-preview label{border-bottom:0}
.signup-preview input,.signup-preview select,.signup-preview textarea{border-top:0;color:var(--c-muted)}

/* ---------- Inner pages ---------- */
.page-intro>p:not(.eyebrow):first-of-type{color:var(--c-ink)}
.ask-number{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:50%;background:var(--c-black);color:#fff;font-weight:700;letter-spacing:0;align-self:start}
.ask-card{align-items:start}
.ask-card h3{padding-top:2px}
#primary-asks>.wp-block-columns,#supporting-asks>.wp-block-columns{border-top:2px solid var(--c-navy)}
#supporting-asks .campaign-card{border-bottom-color:#CBD4E0}
#supporting-asks>.residents-call{background:#fff;border-left:4px solid var(--c-black)}
/* Campaign statement band and dark Contact section */
#related-links>h2,#supporters-and-organisations h2{color:#fff}
#related-links .is-style-outline .wp-block-button__link,#supporters-and-organisations .is-style-outline .wp-block-button__link{color:#fff;border-color:rgba(255,255,255,.6)}
#related-links .is-style-outline .wp-block-button__link:hover,#supporters-and-organisations .is-style-outline .wp-block-button__link:hover{background:#fff;color:var(--c-navy);border-color:#fff}
#supporters-and-organisations>.eyebrow{color:var(--c-mist)}
#supporters-and-organisations>.eyebrow:first-child::before{color:#fff!important}
#supporters-and-organisations p{color:var(--c-mist)}
.contact-route{background:#fff}

/* ---------- Footer: deep navy ---------- */
.site-footer{background:#041232;color:#fff;border-top:1px solid var(--c-rule-dark)}
.site-footer h2{color:#fff}
.site-footer p,.site-footer .footer-label{color:#AEBBD0}
.site-footer a{color:#fff}
.site-footer a:hover{color:var(--c-mist)}
.site-footer .footer-cta a{color:#fff;border-bottom:1px solid #fff}
.site-footer .footer-meta{border-top-color:var(--c-rule-dark);color:#AEBBD0}

/* ---------- Mobile menu overlay matches the navy header ---------- */
@media(max-width:599px){
  .site-header .wp-block-navigation__responsive-container.is-menu-open{background:#fff;color:var(--c-navy)}
  .site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content,.site-header .wp-block-navigation__responsive-container-close{color:var(--c-navy)}
  .site-header .wp-block-navigation__responsive-container.is-menu-open .header-cta .wp-block-navigation-item__content{color:#fff}
  .ask-number{width:36px;height:36px;font-size:.8125rem}
}
@media(prefers-reduced-motion:reduce){.wp-block-button__link:active{transform:none}}

/* =====================================================================
 * Subtle motion (3 Nov 2026). Works with assets/js/motion.js.
 * Hidden states apply only under html.motion-ready (set by the script), so
 * content stays visible if JavaScript fails. Reduced-motion users get none.
 * ===================================================================== */

/* Sticky header; fine border appears once the page has scrolled (no shadow) */
.wp-site-blocks>header{position:sticky;top:0;z-index:100}
/* header line is always visible (no longer hidden at the top of the page) */
.site-header{border-bottom-color:var(--c-rule)}

/* Smooth same-page scrolling, landing clear of the sticky header */
html{scroll-padding-top:calc(var(--header-h,76px) + 8px)}

/* Entrances: fade and rise 10px over 400ms, once */
.motion-ready .reveal{opacity:0;transform:translateY(10px);transition:opacity .4s cubic-bezier(.2,.6,.2,1),transform .4s cubic-bezier(.2,.6,.2,1)}
.motion-ready .reveal.is-visible{opacity:1;transform:none}
.motion-ready #primary-asks .wp-block-column:nth-child(2) .ask-card{transition-delay:70ms}
.motion-ready #primary-asks .wp-block-column:nth-child(3) .ask-card{transition-delay:140ms}

/* Consistent hover/focus colour transitions: 180ms */
a,.wp-block-button__link,.site-header .wp-block-navigation-item__content,.site-header .header-cta .wp-block-navigation-item__content{transition:color .18s ease,background-color .18s ease,border-color .18s ease,opacity .18s ease}
.wp-block-button__link::after{transition:transform .18s ease}
/* Arrow nudge only on devices that really hover (avoids sticky hover after a tap) */
@media(hover:none){.wp-block-button__link:hover::after{transform:none}}

/* Video play button: restrained hover once the control is enabled (it is disabled until the film is supplied) */
.film-play-preview button,.film-play-preview button::before{transition:background-color .18s ease,border-color .18s ease,transform .18s ease}
@media(hover:hover){
  .film-play-preview button:not(:disabled):hover{background-color:rgba(255,255,255,.22);border-color:rgba(255,255,255,.45)}
  .film-play-preview button:not(:disabled):hover::before{transform:scale(1.05)}
}

@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .motion-ready .reveal{opacity:1;transform:none;transition:none}
}

/* =====================================================================
 * Section focus (3 Nov 2026). Works with assets/js/motion.js.
 * The section(s) in the middle of the viewport stay at full strength; the others
 * ease to 0.85 opacity, with up to 0.75px blur on text only (desktop), in 300ms.
 * Applies only under html.focus-ready (set by the script). Header, footer,
 * the hero, inner-page intros, buttons, links and the form are never blurred.
 * ===================================================================== */
.focus-ready .focus-section:not(.reveal){opacity:var(--focus-opacity,1);transition:opacity .3s ease}
/* entrance reveal and focus share the opacity property: once revealed, follow the focus value */
.motion-ready .focus-section.reveal.is-visible{opacity:var(--focus-opacity,1);transition:opacity .3s ease,transform .4s cubic-bezier(.2,.6,.2,1)}
/* keyboard focus anywhere in a section restores full clarity */
.focus-ready .focus-section:focus-within{--focus-opacity:1!important;--focus-blur:0px!important}

/* Blur: text blocks only, desktop pointer devices only */
@media (min-width:782px) and (hover:hover){
  .focus-ready .focus-section :is(h2,h3,p,li):not(.video-placeholder *):not(.signup-preview *):not(.wp-block-buttons *){filter:blur(var(--focus-blur,0px));transition:filter .3s ease}
}

@media (prefers-reduced-motion:reduce){
  .focus-ready .focus-section,.motion-ready .focus-section.reveal.is-visible{opacity:1;transition:none}
  .focus-ready .focus-section *{filter:none!important}
}

/* =====================================================================
 * Framed sections with scroll snapping (3 Nov 2026). CSS only, no JavaScript.
 * Scroll container: the root element (html); nothing else on the page scrolls.
 * Desktop with a mouse/trackpad and a screen at least 700px tall only.
 * Phones, tablets, short screens and "reduce motion" keep normal scrolling.
 *
 * - Mandatory snapping to the start of each major section, directly beneath the
 *   sticky header (scroll-padding-top = header height, measured by motion.js).
 * - Short sections are at least one screen tall (minus the header) and centre
 *   their content vertically. min-height only: nothing is fixed-height or clipped.
 * - Sections taller than the screen stay fully scrollable: browsers allow free
 *   scrolling inside a snap area larger than the viewport.
 * - The homepage hero keeps its natural height so the film still peeks below the
 *   headline; the page top and the footer are snap positions so both stay reachable.
 * - Each section uses scroll-snap-stop:normal so fast scrolling pauses at the
 *   next section instead of skipping several. Oversized sections scroll freely.
 * ===================================================================== */
@media (min-width:782px) and (min-height:540px) and (pointer:fine) and (prefers-reduced-motion:no-preference){
  html{scroll-snap-type:y proximity;scroll-padding-top:var(--header-h,77px)}
  html.wheel-snapping{scroll-snap-type:none}
  html.free-scroll{scroll-snap-type:none}
  .wp-block-post-content>.campaign-hero{scroll-snap-align:start;scroll-snap-stop:normal}
  .wp-block-post-content>.section-pad{scroll-snap-align:start;scroll-snap-stop:normal;scroll-margin-top:0;min-height:calc(calc(100vh / var(--z,1)) - var(--header-h,77px));box-sizing:border-box;align-content:center}
  .wp-site-blocks>footer{scroll-snap-align:end;scroll-snap-stop:normal}
  /* Framing: trim excess vertical padding (112px to a height-based 40-88px) so sections that
     were only slightly taller than the screen fit on one screen. Text sizes are unchanged. */
  .wp-block-post-content>.section-pad:not(.page-intro){padding-block:clamp(40px,calc(6vh / var(--z,1)),88px)}
  .wp-block-post-content>#false-promises{padding-top:0;padding-bottom:clamp(40px,calc(6vh / var(--z,1)),88px)}
  /* the film panel keeps its width and is capped so the whole film section fits under the header */
  #false-promises>.video-placeholder{max-height:calc(calc(100vh / var(--z,1)) - var(--header-h,77px) - 170px)}
  /* Chrome snaps to a section's transformed position, so a section still offset by the
     entrance rise would frame 10px low. While snapping, sections fade in without rising
     (the ask rows inside a section keep their rise). */
  .motion-ready .wp-block-post-content>.section-pad.reveal{transform:none}
}

/* Hero: main headline (H1) above the subtitle (H2). Desktop grid rows set here; mobile follows HTML order. */
.wp-block-post-content>.campaign-hero h1{grid-row:2;align-self:end}
.wp-block-post-content>.campaign-hero h2{grid-column:1;grid-row:3;align-self:start;margin:14px 0 0!important}
@media(max-width:781px){.wp-block-post-content>.campaign-hero h1,.wp-block-post-content>.campaign-hero h2{align-self:stretch}.wp-block-post-content>.campaign-hero h2{margin:0 0 20px!important}}

/* Underlined links: underline only in FCJ bright blue (matches the header "Get involved" button); text colour unchanged */
#issue-preview .wp-block-button__link,.story-copy .wp-block-button__link{border-bottom-color:var(--c-fcj-blue)}
#issue-preview .wp-block-button__link:hover,.story-copy .wp-block-button__link:hover{border-bottom-color:var(--c-fcj-blue-hover)}
.site-footer .footer-cta a{border-bottom-color:var(--c-fcj-blue)}

/* Resident spotlight: its own section so it snaps and fits one screen (replaces the resident video) */
#resident-spotlight>.resident-quotes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:0;padding:12px;background:var(--c-pale);border-radius:var(--radius)}
.resident-quotes-head{grid-column:1/-1;padding:16px 16px 4px!important}
.resident-quote{display:flex;flex-direction:column;gap:14px;margin:0;padding:20px 22px 18px;background:#fff;border-radius:var(--radius-s)}
.resident-quote blockquote{margin:0;padding:0;border:0}
/* opening mark on the first line of the quote, matching the closing mark (11 Nov 2026) */
.resident-quote blockquote p::before{content:"\201C";display:inline-block;margin-right:4px;font-size:2.5rem;line-height:0;vertical-align:-.42em;font-weight:500;color:var(--c-accent);opacity:.35}
.resident-quote blockquote p{margin:0;font-size:.9375rem;line-height:1.55;color:var(--c-ink);text-wrap:pretty}
.resident-quote figcaption{margin-top:auto;padding-top:12px;border-top:1px solid var(--c-rule)}
.resident-quote .quote-name{font-size:.875rem;font-weight:500;color:var(--c-ink)}
@media(max-width:781px){#resident-spotlight>.resident-quotes{grid-template-columns:1fr}}
@media (min-width:782px) and (min-height:540px) and (pointer:fine) and (prefers-reduced-motion:no-preference){.wp-block-post-content>#resident-spotlight.section-pad{padding-block:clamp(20px,calc(4vh / var(--z,1)),88px)}}
.resident-quote blockquote p::after{content:"\201D";display:inline-block;margin-left:4px;font-size:2.5rem;line-height:0;vertical-align:-.42em;font-weight:500;color:var(--c-accent);opacity:.35}
#primary-asks>#supporting-asks>*{max-width:none;margin-left:0!important;margin-right:0!important}

/* ---------- Mobile menu as a right-hand panel (11 Nov 2026) ----------
 * Phones only (below 600px, the only size where the menu button exists).
 * The page stays visible behind a light dim layer; the menu slides in from
 * the right as a white panel, with a thin line between the options.
 * Tapping the dimmed page closes the menu (nav.js). Desktop is unchanged. */
@media(max-width:599px){
  .site-header .wp-block-navigation__responsive-container.is-menu-open{
    background:rgba(20,28,45,.60)!important;padding:0!important;
    animation:menu-dim .2s ease-out}
  .site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-close{
    position:absolute;top:0;right:0;bottom:0;width:min(64vw,250px);max-width:none;margin:0;
    padding:20px 24px;background:#fff;box-shadow:-10px 0 30px rgba(0,0,0,.18);
    overflow-y:auto;animation:menu-slide .22s ease-out}
  .site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container{
    gap:0;width:100%;align-items:stretch}
  .site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item{
    width:100%;padding:6px 0;align-items:flex-start;justify-content:flex-start}
  .site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-link:not(.header-cta) .wp-block-navigation-item__content{
    font-size:1.125rem;width:100%;justify-content:flex-start;text-align:left}
  .site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item:not(:last-child){
    border-bottom:1px solid var(--c-rule,#D9E0E9)}
  .site-header .wp-block-navigation__responsive-container.is-menu-open .header-cta{padding-top:24px}
}
@keyframes menu-dim{from{background-color:rgba(20,28,45,0)}}
@keyframes menu-slide{from{transform:translateX(100%)}}
@media(max-width:599px) and (prefers-reduced-motion:reduce){
  .site-header .wp-block-navigation__responsive-container.is-menu-open,
  .site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-close{animation:none}
}

/* ---------- Phones: first block fills the first screen (11 Nov 2026) ----------
 * Below 600px only. The homepage hero and the intro block of the other pages
 * are at least one screen tall (minus the sticky header, --header-h from
 * motion.js), with the text starting 64px below the header. Desktop unchanged. */
@media(max-width:599px){
  .wp-block-post-content>.campaign-hero,
  .wp-block-post-content>.page-intro{
    box-sizing:border-box;
    min-height:calc(100vh - var(--header-h,57px));
    min-height:calc(100svh - var(--header-h,57px));
    padding-top:64px!important}
  .wp-block-post-content>.campaign-hero{justify-content:flex-start!important}
  /* content.css lifts the homepage headline 36px (desktop look); not on phones */
  .wp-block-post-content>#hero h1,.wp-block-post-content>#hero h2{top:0}
}

/* ---------- Section scroll lock on phones and tablets (11 Nov 2026) ----------
 * For touch screens and narrow windows, which the desktop block above leaves out.
 * Firm (mandatory) snapping to the start of each section, just under the sticky
 * header: with the desktop's looser "proximity" type, short phone swipes stopped
 * between sections. svh = the visible screen height with the
 * browser's address bar showing, so a framed section is not cut off. Sections
 * taller than the screen still scroll freely. "Reduce motion" keeps free scrolling. */
@media (max-width:781px) and (prefers-reduced-motion:no-preference),
       (pointer:coarse) and (prefers-reduced-motion:no-preference){
  html{scroll-snap-type:y mandatory;scroll-padding-top:var(--header-h,57px)}
  html.free-scroll{scroll-snap-type:none}
  .wp-block-post-content>.campaign-hero{scroll-snap-align:start;scroll-snap-stop:normal}
  .wp-block-post-content>.section-pad{scroll-snap-align:start;scroll-snap-stop:normal;scroll-margin-top:0;
    box-sizing:border-box;align-content:center;
    min-height:calc(100vh - var(--header-h,57px));
    min-height:calc(100svh - var(--header-h,57px))}
  .wp-site-blocks>footer{scroll-snap-align:end;scroll-snap-stop:normal}
  .motion-ready .wp-block-post-content>.section-pad.reveal{transform:none}
}
/* Phones/tablets: the homepage film section sits about two lines (56px) higher
   than exact centre, at the owner's request (11 Nov 2026). The extra bottom
   padding (24px -> 136px) moves the centred block up by half of it. */
@media (max-width:781px) and (prefers-reduced-motion:no-preference),
       (pointer:coarse) and (prefers-reduced-motion:no-preference){
  .wp-block-post-content>#false-promises.section-pad{padding-bottom:136px}
}