/* Functional accommodation for the new fields. Visual design remains in studio.css. */
[hidden]{display:none!important}
mark.pending-information{background:#FFEB70;color:#1E2A40;padding:2px 4px;box-decoration-break:clone;-webkit-box-decoration-break:clone}
.signup-preview fieldset{min-width:0;border:0;padding:0;margin:0}
.signup-preview legend{padding:16px;font-weight:500}
.signup-preview .check{display:flex;align-items:flex-start;gap:12px;padding:16px;border:0}
.signup-preview input[type=checkbox]{appearance:auto;flex:0 0 20px;width:20px;height:20px;padding:0;margin:3px 0 0}
.signup-preview button:not(:disabled){background:var(--c-black);cursor:pointer}
.signup-preview :is(input,select,textarea):focus-visible{outline:3px solid var(--c-navy);outline-offset:2px}
.signup-preview select{appearance:auto}
.signup-preview textarea{resize:vertical}
.signup-field{margin-top:8px;border:1px solid var(--c-rule);border-radius:var(--radius-s);background:#fff}
.signup-field:focus-within{outline:3px solid var(--c-navy);outline-offset:2px}
.signup-preview .signup-field>label{margin-top:0;border:0;cursor:text}
.signup-preview .signup-field>:is(input,select,textarea){border:0}
.signup-preview .signup-field>:is(input,select,textarea):focus-visible{outline:none}
[data-full-film] video{display:block;width:100%;max-height:calc(78vh / var(--z,1))}
[data-full-film].film-ready{--film-frame-height:max(180px,calc(calc(100svh / var(--z,1)) - var(--header-h,77px) - 220px));position:relative;display:grid!important;place-items:center;padding:0!important;aspect-ratio:auto!important;min-height:0!important;max-height:none!important;overflow:hidden;background:#000!important}
[data-full-film].film-ready video{width:100%;max-width:100%;height:auto;max-height:none;aspect-ratio:16/9;object-fit:contain;background:#000;margin:0!important}
#false-promises [data-full-film].film-ready{background:#000!important}
.film-ready .film-preview-play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:grid;place-items:center;width:76px;height:76px;padding:0;border:2px solid #fff;border-radius:50%;background:rgba(44,61,92,.85);color:#fff;cursor:pointer;font-size:30px;line-height:1;box-shadow:0 4px 20px #0003}
.film-preview-play span{margin-left:5px}
.film-ready .film-preview-play:hover{background:var(--c-navy)}
.film-ready .film-preview-play:focus-visible{outline:3px solid #fff;outline-offset:5px}
.film-ready .film-playback-error{position:absolute;bottom:48px;left:16px;right:16px;padding:10px;background:#fff;color:var(--c-ink);font-size:.875rem;text-align:center}

/* Decorative hero photograph. Adjust this opacity without fading the text. */
#hero{position:relative;isolation:isolate;--hero-image-opacity:.10}
#hero{padding-bottom:calc(clamp(36px,calc(4.5vw / var(--z,1)),64px) + 32px)}
@media(max-width:781px){#hero{padding-bottom:52px}}
#hero::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:url("../images/burnley-street-2.png") center center/cover no-repeat;opacity:var(--hero-image-opacity)}
#why-it-happens{position:relative;isolation:isolate}
#why-it-happens::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:url("../images/burnley-street.png") center center/cover no-repeat;opacity:.10}
#burnley .featured-film-caption{max-width:none}
#burnley #false-promises>[data-full-film].film-ready{width:min(100%,calc(max(160px,calc(calc(100svh / var(--z,1)) - var(--header-h,77px) - 250px)) * 16 / 9));margin-left:auto!important;margin-right:auto!important}
#hero .wp-block-button .hero-campaign-cta{background:#555B64;color:#fff}
#hero .wp-block-button .hero-campaign-cta:hover{background:#424750;color:#fff}
/* Full-height left-side image, cropped proportionally and faded into the section. */
#issue-preview{position:relative;isolation:isolate}
#issue-preview>.eyebrow{grid-column:2;grid-row:1;margin:0 0 20px!important}
#issue-preview.focus-section{--focus-blur:.2px!important}
#issue-preview.focus-section:focus-within{--focus-blur:0px!important}
@media(min-width:782px){#issue-preview>:is(.eyebrow,h2,p:not(.eyebrow),.wp-block-buttons){position:relative;left:20px;max-width:calc(100% - 20px)}}
#issue-preview .issue-side-photo{grid-column:auto;grid-row:auto;position:absolute;top:0;left:0;z-index:-1;pointer-events:none;display:block;width:calc(var(--gutter) + (100% - var(--gutter) * 2 - clamp(32px,calc(6vw / var(--z,1)),96px)) / 3.6 + clamp(32px,calc(6vw / var(--z,1)),96px) - 32px);height:100%;max-width:none;object-fit:cover;object-position:65% center;margin:0!important;border-radius:0;opacity:.7;mask-image:linear-gradient(to right,#000 76%,rgba(0,0,0,.99) 80%,rgba(0,0,0,.94) 84%,rgba(0,0,0,.80) 88%,rgba(0,0,0,.52) 92%,rgba(0,0,0,.20) 96%,transparent 100%);filter:none}
/* There is no left column in the existing mobile layout. */
@media(max-width:781px){#issue-preview .issue-side-photo{display:none}}
/* Static photograph within the existing resident-experiences media area. */
#burnley-preview .resident-photo{position:relative;overflow:hidden;padding:0}
#burnley-preview .resident-photo>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;margin:0;opacity:.85}
#burnley-preview .resident-photo-credit{margin:10px 12px 4px;line-height:1.5}
/* Give the homepage film the same heading scale as the main sections. */
.wp-block-post-content>#false-promises>h2{font-size:clamp(1.75rem,calc(3vw / var(--z,1)),2.5rem);font-weight:600;line-height:1.1;letter-spacing:var(--track);margin:20px 0 12px}
.wp-block-post-content>#false-promises>.eyebrow{grid-column:1/-1;grid-row:2;margin:0 0 20px!important}
.wp-block-post-content>#false-promises{padding-bottom:24px}
.wp-block-post-content>#false-promises>.film-caption{max-width:none;line-height:1.5}
#hero .hero-summary-detail{font-size:.875em;font-weight:400}
/* Lift the headline and subheading together without moving the adjacent column. */
#hero h1,#hero h2{position:relative;top:-36px;text-align:left}
/* Fit the homepage heading, complete 16:9 player and caption in one screen. */
.wp-block-post-content>#false-promises>[data-full-film].film-ready{grid-row:3;width:min(100%,calc(max(160px,calc(calc(100svh / var(--z,1)) - var(--header-h,77px) - 180px)) * 16 / 9));margin-left:auto!important;margin-right:auto!important}
/* Issues introduction: keep the existing copy width, with a photograph alongside. */
#the-issue{position:relative;isolation:isolate}
.issues-intro-columns{display:block}
.issues-intro-copy>p{max-width:640px;margin:0 0 14px!important;font-size:1.125rem;color:var(--c-muted)}
.issues-intro-copy>p:first-child{font-size:clamp(1.125rem,calc(1.6vw / var(--z,1)),1.375rem);line-height:1.5;color:var(--c-ink)}
#the-issue>h1{max-width:640px;font-size:clamp(2rem,calc(3.4vw / var(--z,1)),3rem);line-height:1.12}
#the-issue>.eyebrow::before{display:none}
#policy-and-evidence{position:relative;isolation:isolate}
#policy-and-evidence>.issues-intro-photo{opacity:.5}
#policy-and-evidence>.eyebrow::before{display:none}
#policy-and-evidence>h1{max-width:640px;font-size:clamp(2rem,calc(3.4vw / var(--z,1)),3rem);line-height:1.12}
#policy-and-evidence>p:not(.eyebrow){max-width:640px;font-size:1rem;line-height:1.6}
#contact>.eyebrow::before{display:none}
#contact>h1{max-width:640px;font-family:var(--f-sans);font-size:clamp(2rem,calc(3.4vw / var(--z,1)),3rem);line-height:1.12}
#contact>p:not(.eyebrow){font-family:var(--f-sans);font-size:1rem;line-height:1.6}
#the-issue .issues-intro-copy>p{font-size:1rem;line-height:1.6}
.issues-intro-photo{position:absolute;top:0;right:0;z-index:-1;pointer-events:none;display:block;width:max(0px,calc(100% - var(--gutter) - 640px - 32px));height:100%;max-width:none;object-fit:cover;object-position:center;margin:0!important;border-radius:0;opacity:.6;mask-image:none;filter:none}
@media(max-width:1099px){.issues-intro-photo{display:none}}
.ssb-photo-columns{display:grid;grid-template-columns:minmax(0,680px) minmax(0,1fr);gap:48px;align-items:center}
.ssb-photo{margin:0}
.ssb-photo img{display:block;width:100%;height:auto;border-radius:var(--radius-s);opacity:.85}
.ssb-photo figcaption{margin-top:10px;line-height:1.5}
@media(max-width:1099px){.ssb-photo-columns{grid-template-columns:1fr;gap:24px}.ssb-photo{max-width:640px}}
#residents-call{position:relative;isolation:isolate}
#residents-call>h2,.residents-call-copy{max-width:640px}
#residents-call>h2{margin-bottom:0}
#residents-call>.residents-call-columns{margin-top:0}
.residents-call-copy>p:first-child{margin-top:0}
.residents-call-columns{display:block}
.residents-headline-image{position:absolute;top:50%;right:0;transform:translateY(-50%);z-index:-1;pointer-events:none;display:block;width:50%;height:auto;max-width:none;margin:0!important;object-fit:contain;object-position:center;border-radius:0;opacity:.7;mask-image:linear-gradient(to left,#000 65%,rgba(0,0,0,.98) 70%,rgba(0,0,0,.90) 76%,rgba(0,0,0,.72) 82%,rgba(0,0,0,.45) 88%,rgba(0,0,0,.18) 94%,transparent 100%)}
@media(min-width:1100px){#residents-call>h2,.residents-call-copy{max-width:min(640px,calc((calc(100vw / var(--z,1)) - var(--gutter) * 2) / 2 - 32px))}}
@media(max-width:1099px){.residents-headline-image{display:none}}
#supporting-asks .campaign-card>ul{grid-column:1/-1;max-width:none;width:100%;box-sizing:border-box}
#primary-asks>#supporting-asks{display:block;padding:0;margin-top:32px;background:transparent;min-height:0;scroll-snap-align:none}
#primary-asks>#supporting-asks>h3{font-size:1.25rem;margin:0 0 16px}
#white-paper .coverage-copy{gap:28px}
#white-paper .coverage-item h3{margin:0 0 12px}
#white-paper .coverage-item p{margin:0}
#related-links{display:block;text-align:left}
#related-links>h2{margin:0 0 24px}
#related-links>p{margin:0 0 8px}
#related-links>.wp-block-buttons{justify-content:flex-start;margin-top:24px}
#related-links .wp-block-button .wp-block-button__link[href="material.html"]{background:#000;color:#fff}
#related-links .wp-block-button .wp-block-button__link[href="material.html"]:hover{background:#242424;color:#fff}
/* Keep the contact privacy notice compact instead of filling a screen. */
.wp-block-post-content>#privacy.section-pad{display:block;min-height:0;padding-block:32px;scroll-snap-align:none;scroll-margin-top:calc(var(--header-h,77px) + 16px)}
.wp-block-post-content>#privacy>h2{font-size:1.25rem;margin:0 0 12px}
.wp-block-post-content>#privacy>p{margin-block:0}
.wp-block-post-content>#privacy>p+p{margin-top:12px}
/* Consistent navigation hover and keyboard focus, including the mobile menu. */
.site-header .wp-block-navigation-item:not(.header-cta)>.wp-block-navigation-item__content:is(:hover,:focus-visible){color:var(--c-fcj-blue);cursor:pointer}
.site-header .wp-block-navigation-item:not(.header-cta)>.wp-block-navigation-item__content[aria-current="page"]:not(:hover):not(:focus-visible){color:var(--c-navy)}

/* Contact: where to get help (Citizens Advice, SRA), kept as plain lines */
#contact>.contact-help{max-width:760px;margin:8px 0 24px}
#contact>.contact-help p{margin:0 0 16px;font-size:1rem;line-height:1.6}
#contact>.contact-help a{overflow-wrap:anywhere}
#contact>.contact-help>h2{margin:0 0 12px;font-size:1.25rem;line-height:1.3}
#contact>.contact-help>hr{height:0;margin:24px 0;border:0;border-top:1px solid var(--c-rule)}
/* Privacy notice: EU / U.S. policy panel titles in dark grey (11 Nov 2026) */
#privacy .privacy-full summary{color:#4A4A4A;font-weight:600;cursor:pointer}
#privacy .privacy-full summary:hover{color:#222222}
#privacy .privacy-full details[open]>summary{margin-bottom:1.5em}

/* ---------- Phones (11 Nov 2026) ---------- */
/* Featured film caption (Issues): each sentence on its own line (as before);
   on phones a blank line between them. */
.featured-film-caption>.caption-line{display:block}
/* All screen sizes: a blank line before "It premieres in Parliament...",
   which is grey and italic. */
.featured-film-caption>.caption-line+.caption-line{margin-top:1.6em;font-style:italic;color:var(--c-muted)}
/* Residents' call (Issues), all screen sizes: a blank line under the heading,
   and another before "Fair Civil Justice's ask". */
#residents-call>h2{margin-bottom:1.6rem}
.residents-call-copy>p:first-child{margin-bottom:calc(1rem + 1.6rem)}
/* Phones/tablets with section snapping: the privacy notice is a stop too
   (it was skipped). Matches the snapping media query in studio.css. */
@media (max-width:781px) and (prefers-reduced-motion:no-preference),
       (pointer:coarse) and (prefers-reduced-motion:no-preference){
  .wp-block-post-content>#privacy.section-pad{scroll-snap-align:start;scroll-margin-top:0}
}

/* Privacy policy panels (contact page): text runs the full width of the page
   instead of the 680px reading column, slightly smaller (15px) (11 Nov 2026). */
#privacy .privacy-full p,#privacy .privacy-full li,#privacy .privacy-full ul,#privacy .privacy-full ol,#privacy .privacy-full h3,#privacy .privacy-full h4{max-width:none}
#privacy .privacy-full p,#privacy .privacy-full li{font-size:.9375rem;line-height:1.6}

/* Contact page "Get involved": its grey label was removed, so the two-column
   layout (label left, text right) no longer applies. Text starts at the left
   edge like the rest of the page (11 Nov 2026). */
.wp-block-post-content>#supporters-and-organisations{display:block}

/* Resident spotlight: Seema is the interviewer, not a resident. Her card is
   labelled "Interviewer" and set apart with a see-through card and a dashed
   outline; text as in the other cards (11 Nov 2026). */
.resident-quote figcaption{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.resident-quote .quote-role{font-family:var(--f-mono);font-size:.6875rem;letter-spacing:.06em;text-transform:uppercase;color:var(--c-muted);padding:2px 8px;border:1px solid var(--c-rule);border-radius:999px}
.resident-quote.is-interviewer{background:transparent;border:1px dashed var(--c-rule)}

/* Contact page opening section: less space above "Contact" (and a little less
   below) so the whole section fits on one screen on a laptop and on phones
   (11 Nov 2026). */
.wp-block-post-content>#contact.page-intro{padding-top:40px!important;padding-bottom:16px!important}
@media(max-width:599px){.wp-block-post-content>#contact.page-intro{padding-top:32px!important;padding-bottom:32px!important}}

/* Contact page help block: text runs the full page width (no left column),
   and the "Visit" part (from its heading down) is slightly smaller (11 Nov 2026). */
#contact>.contact-help,#contact>.contact-help p{max-width:none}
#contact>.contact-help>h2:nth-of-type(2){font-size:1.125rem}
#contact>.contact-help>h2:nth-of-type(2)~p{font-size:.875rem;line-height:1.6}

/* Sign-up: hidden "website" field that only spam bots fill in (checked by the Worker). */
.signup-hp{position:absolute!important;left:-10000px!important;width:1px;height:1px;overflow:hidden}

/* ---------- Mobile test notes, 11 Nov 2026 ---------- */
/* Sign-up check boxes: smaller, with a crisp 1.5px outline (were large browser defaults). */
.signup-preview input[type=checkbox]{-webkit-appearance:none;appearance:none;flex:0 0 18px;width:18px;height:18px;margin:3px 0 0;
  border:1.5px solid var(--c-navy);border-radius:4px;background:#fff;display:grid;place-content:center;cursor:pointer}
.signup-preview input[type=checkbox]::after{content:"";width:10px;height:6px;border:solid #fff;border-width:0 0 2px 2px;transform:translateY(-1px) rotate(-45deg);opacity:0}
.signup-preview input[type=checkbox]:checked{background:var(--c-navy)}
.signup-preview input[type=checkbox]:checked::after{opacity:1}
.signup-preview input[type=checkbox]:focus-visible{outline:3px solid var(--c-fcj-blue);outline-offset:2px}
/* "(required)" in red so it stands apart from the label */
.signup-preview .required{color:#B42318;font-weight:500}
/* Short privacy notice by the consent box */
.signup-preview .signup-privacy{text-align:left;margin:0;padding:0 16px 8px;font-size:.8125rem;line-height:1.55;color:var(--c-muted)}
.signup-preview .signup-privacy a{color:inherit}
/* Homepage "Resident experiences" on phones: no extra space above, so it fits one screen. */
@media(max-width:781px){
  .wp-block-post-content>#burnley-preview.section-pad{padding-top:16px;align-content:start}
}
/* Phones/tablets with section snapping: long sections also get a stop at their end
   (marker added by section-snap.js), so a flick finishes the section before moving on. */
@media (max-width:781px) and (prefers-reduced-motion:no-preference),
       (pointer:coarse) and (prefers-reduced-motion:no-preference){
  .wp-block-post-content>.section-pad{position:relative}
  .snap-end{position:absolute;left:0;bottom:0;width:1px;height:1px;pointer-events:none;scroll-snap-align:end;scroll-snap-stop:always}
}
.snap-end{position:absolute;width:1px;height:1px;pointer-events:none}

/* ---------- Copy update from "End NWNF Microsite Copy_edit.docx" (11 Nov 2026) ---------- */
/* Homepage: Our ask is simple */
#our-ask .ask-quote{margin:0 0 28px;padding:0 0 0 20px;border-left:3px solid var(--c-black)}
#our-ask .ask-quote blockquote{margin:0;padding:0;border:0}
#our-ask .ask-quote blockquote p{max-width:none;margin:0;font-size:clamp(1.25rem,calc(2vw / var(--z,1)),1.625rem);line-height:1.4;color:var(--c-navy)}
#our-ask .ask-quote figcaption{margin-top:12px;font-size:.9375rem;font-weight:500;color:var(--c-ink)}
#our-ask .ask-quote figcaption::before{content:"– "}
/* Homepage: Manifesto, five principles without numbers */
#manifesto .manifesto-list{list-style:none;margin:24px 0 0;padding:0;max-width:820px;display:grid;gap:14px}
#manifesto .manifesto-list li{padding:14px 0 0;border-top:1px solid var(--c-rule);color:var(--c-muted);line-height:1.55}
#manifesto .manifesto-list li strong{color:var(--c-ink);font-weight:600}
/* The issue (homepage): four paragraphs now, so normal reading size instead of the large intro size */
#issue-preview>p:not(.eyebrow){font-size:1.0625rem;line-height:1.6;margin:0 0 16px;color:var(--c-ink)}
#issue-preview>p:not(.eyebrow):first-of-type{font-size:1.25rem;line-height:1.45;color:var(--c-navy)}
#issue-preview>.wp-block-buttons{margin-top:12px}
/* Our ask / Manifesto: comfortable line length */
#our-ask>p{max-width:none}
#manifesto>p{max-width:none}

/* ---------- Hero (11 Nov 2026) ---------- */
/* Desktop: headline and subtitle sit together, vertically centred against the
   text and buttons on the right (they used to sit near the bottom), left-aligned. */
.wp-block-post-content>.campaign-hero>.hero-title{grid-column:1;grid-row:2/4;align-self:center}
.wp-block-post-content>.campaign-hero>.hero-title>h1{grid-row:auto;align-self:auto}
.wp-block-post-content>.campaign-hero>.hero-title>h2{grid-row:auto;margin:14px 0 0!important}
#hero .hero-title>h1,#hero .hero-title>h2{top:0}
/* Side text: slightly smaller, with a blank line between the two paragraphs */
.campaign-hero>.hero-summary{font-size:1.125rem}
#hero .hero-summary>br{display:none}
#hero .hero-summary-detail{display:block;margin-top:1em;font-size:.889em}
@media(max-width:781px){
  .wp-block-post-content>.campaign-hero>.hero-title{align-self:stretch}
  .wp-block-post-content>.campaign-hero>.hero-title>h1{margin-bottom:20px!important}
  .wp-block-post-content>.campaign-hero>.hero-title>h2{margin:0 0 20px!important}
}
