/* Fair Go Dads — calm, readable, logo palette */
:root{
  --teal:#1f6b6b;
  --teal-deep:#0d4f4f;
  --teal-dark:#163838;
  --gold:#d4a24c;
  --gold-light:#f0d78c;
  --eucalyptus:#a8c5a8;
  --eucalyptus-soft:#e8f0e8;
  --cream:#fffef8;
  --cream-warm:#fff8e7;
  --plum:#2c1840;
  --ink:#1a2424;
  --ink-muted:#3a4a4a;
  --white:#ffffff;
  --shadow:0 4px 14px rgba(22,56,56,.10);
  --radius:12px;
  /* Focus rings (WCAG 2.2 SC 1.4.11, >=3:1): dark ring on light surfaces, light ring on dark surfaces */
  --focus:#163838;          /* 10.7-12.7:1 on cream, cream-warm, white, eucalyptus-soft, card tints */
  --focus-on-dark:#f0d78c;  /* 11.3:1 plum, 6.6:1 teal-deep, 4.4:1 teal */
  --link:#0a5c8a;
}
*{box-sizing:border-box}
html{font-size:19px;-webkit-text-size-adjust:100%}
@media(min-width:48rem){html{font-size:21px}}
body{
  margin:0;
  font-family:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  line-height:1.6;
  color:var(--ink);
  background:var(--cream);
}
a{color:var(--link);text-decoration:underline;text-underline-offset:.15em}
a:hover{color:var(--teal-deep)}
a:focus{outline:3px solid var(--focus);outline-offset:2px}
.crisis a:focus,header.site a:focus,footer a:focus,.number a:focus{outline-color:var(--focus-on-dark)}
.skip{position:absolute;left:-999px;top:0;z-index:20}
.skip:focus{left:8px;top:8px;background:var(--white);color:var(--ink);padding:.5rem .75rem;border-radius:6px;outline:3px solid var(--focus);outline-offset:0;box-shadow:0 0 0 6px var(--focus-on-dark)} /* two-tone ring: readable over the plum crisis bar and over cream */

/* Crisis — deep plum, gold numbers (WCAG AA) */
.crisis{background:var(--plum);color:var(--cream-warm);padding:1rem 1.25rem}
.crisis h2{margin:0 0 .4rem;font-size:1.15rem;font-weight:800;color:var(--white)}
.crisis ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.35rem 1.35rem}
.crisis li{color:var(--cream-warm)}
.crisis a{color:var(--gold-light);font-weight:800;text-decoration:underline;text-underline-offset:.12em}
.crisis a:hover,.crisis a:focus{color:var(--white)}
.crisis a:focus{outline-color:var(--focus-on-dark)}

/* Header / nav — teal */
header.site{
  background:var(--teal-deep);
  color:var(--white);
  padding:.85rem 1.25rem;
  display:flex;flex-wrap:wrap;align-items:center;gap:.75rem 1.75rem;
  box-shadow:var(--shadow);
}
.brand{display:inline-block;line-height:0;text-decoration:none;border-radius:8px}
.brand img{height:56px;width:auto;display:block;background:var(--white);border-radius:8px;padding:.2rem .45rem}
.brand:hover{outline:3px solid var(--gold);outline-offset:3px}
.brand:focus{outline:3px solid var(--focus-on-dark);outline-offset:3px}
nav ul{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:.4rem 1.1rem}
nav a{color:var(--cream);font-weight:600;text-decoration:none;padding:.2rem 0;border-bottom:3px solid transparent}
nav a:hover{color:var(--gold-light);border-bottom-color:var(--gold)}
nav a:focus{outline:3px solid var(--focus-on-dark);outline-offset:3px;color:var(--white)}
nav a[aria-current]{color:var(--gold-light);border-bottom-color:var(--gold);font-weight:800}

/* Main measure */
main{max-width:48rem;margin:0 auto;padding:1.35rem 1.25rem 2rem}
main > p,main > ul:not(.cards),main > ol{max-width:65ch}
h1,h2,h3{line-height:1.2;color:var(--teal-deep);font-weight:800;letter-spacing:-.01em}
h1{font-size:1.85rem;margin:0 0 .85rem}
h2{font-size:1.45rem;margin:1.75rem 0 .75rem}
h3{font-size:1.15rem;margin:0 0 .4rem}
@media(min-width:48rem){
  h1{font-size:2.45rem}
  h2{font-size:1.7rem}
  h3{font-size:1.25rem}
}

/* Hero */
.hero{position:relative;margin:0 0 1.5rem;border-radius:var(--radius);overflow:hidden;background:var(--eucalyptus-soft);box-shadow:var(--shadow)}
.hero picture,.hero img{display:block;width:100%;height:auto}
.hero h1{
  position:absolute;left:3%;top:6%;max-width:min(50%,21rem);margin:0;
  padding:.75rem 1rem;font-size:clamp(1.1rem,2.6vw,1.75rem);line-height:1.25;
  color:var(--teal-deep);background:rgba(255,254,248,.92);border-radius:10px;box-shadow:var(--shadow)
}
@media(max-width:36rem){
  .hero h1{position:static;max-width:none;margin:0;border-radius:0;box-shadow:none;font-size:1.4rem;background:var(--eucalyptus-soft);padding:1rem 1.1rem}
}

/* Helpline CTA */
.number{
  background:linear-gradient(145deg,var(--teal) 0%,var(--teal-deep) 100%);
  color:var(--white);
  border:none;
  border-radius:var(--radius);
  padding:1.35rem 1.4rem;
  margin:1.75rem 0;
  box-shadow:var(--shadow);
  max-width:65ch;
}
.number h2{color:var(--gold-light);margin:0 0 .35rem;font-size:1.35rem}
.number p{margin:.35rem 0;color:var(--cream);max-width:none}
.number p.big{font-size:1.55rem;font-weight:800;margin:.4rem 0;color:var(--white);letter-spacing:.01em}
.number a{color:var(--gold-light)}
.number a:focus{outline-color:var(--focus-on-dark)}
.number p.ai-note{margin-top:.75rem;padding-top:.6rem;border-top:1px solid rgba(255,254,248,.35)}

/* Help topic cards */
.help-topics{margin:1.5rem 0 2rem}
.help-topics > h2{margin-bottom:1rem}
.cards{
  list-style:none;margin:0;padding:0;
  display:grid;grid-template-columns:1fr;gap:1rem;
  max-width:none;
}
@media(min-width:36rem){.cards{grid-template-columns:1fr 1fr}}
@media(min-width:52rem){.cards{grid-template-columns:1fr 1fr;gap:1.15rem}}
.card{
  background:var(--white);
  border-radius:var(--radius);
  padding:1.15rem 1.2rem 1.2rem;
  box-shadow:var(--shadow);
  border-top:5px solid var(--teal);
  display:flex;flex-direction:column;gap:.35rem;
}
.card p{margin:0;color:var(--ink-muted);font-size:.95rem;max-width:none}
.card__icon{
  display:inline-flex;align-items:center;justify-content:center;
  width:2.6rem;height:2.6rem;border-radius:50%;
  margin-bottom:.25rem;flex-shrink:0;
}
.card__icon svg{width:1.45rem;height:1.45rem;display:block}
.card--parenting{border-top-color:var(--teal)}
.card--parenting .card__icon{background:var(--eucalyptus-soft);color:var(--teal-deep)}
.card--support{border-top-color:#c4893a}
.card--support .card__icon{background:#f8edd8;color:#8a5a18}
.card--property{border-top-color:#5a8f7b}
.card--property .card__icon{background:#e4f0ea;color:#2d5c4a}
.card--forms{border-top-color:#6b7eb8}
.card--forms .card__icon{background:#e8ecf6;color:#3d4d7a}
.card--services{border-top-color:var(--gold)}
.card--services .card__icon{background:#f6ecd6;color:#7a5a18}

/* Alternate bands / note */
.band{background:var(--eucalyptus-soft);margin:1.75rem -1.25rem;padding:1.25rem 1.25rem;border-radius:0}
@media(min-width:48rem){.band{margin:1.75rem 0;padding:1.35rem 1.5rem;border-radius:var(--radius)}}
.note{
  background:var(--cream-warm);
  border-left:6px solid var(--gold);
  border-radius:0 var(--radius) var(--radius) 0;
  padding:1rem 1.15rem;
  max-width:65ch;
  box-shadow:0 2px 8px rgba(22,56,56,.06);
}
.note strong{color:var(--teal-dark)}

/* Content pages: soft section rhythm */
section.band{
  background:var(--eucalyptus-soft);
  margin:1.25rem 0;
  padding:1.15rem 1.25rem 1.25rem;
  border-radius:var(--radius);
  box-shadow:0 2px 8px rgba(22,56,56,.05);
}
section.plain{margin:1.25rem 0}
section.plain h2,section.band h2{margin-top:0}
section.band > :last-child{margin-bottom:0}
section.band ul{max-width:65ch}

/* Footer — teal */
footer{
  background:var(--teal-deep);
  color:var(--cream);
  margin-top:2.5rem;
  padding:1.5rem 1.25rem;
  font-size:.92rem;
  box-shadow:0 -2px 12px rgba(22,56,56,.08);
}
footer p{max-width:48rem;margin:.4rem auto;line-height:1.55}
footer a{color:var(--gold-light);font-weight:700}
footer a:hover{color:var(--white)}
footer a:focus{outline-color:var(--focus-on-dark)}
footer strong{color:var(--white)}

/* Notice (e.g. "not open yet") */
.notice{background:var(--cream-warm);border-left:6px solid var(--teal);border-radius:0 var(--radius) var(--radius) 0;padding:1rem 1.15rem;max-width:65ch}

/* Lists */
main ul:not(.cards){padding-left:1.2rem}
main ul:not(.cards) li{margin:.4rem 0}

/* Small safety line above the header (every page) */
.danger-strip{margin:0;background:var(--plum);color:var(--cream-warm);padding:.4rem 1.25rem;font-weight:700;font-size:.95rem}
.danger-strip a{color:var(--gold-light);font-weight:800}
.danger-strip a:hover,.danger-strip a:focus{color:var(--white)}
.danger-strip a:focus{outline:3px solid var(--focus-on-dark);outline-offset:2px}

/* Fair Go Dads helpline hero (top of every page, biggest on Home) */
.helpline-hero{
  background:linear-gradient(150deg,var(--cream-warm) 0%,#fbe9c4 100%);
  border:3px solid var(--gold);border-radius:var(--radius);
  padding:1.2rem 1.25rem 1.1rem;margin:0 0 1.5rem;box-shadow:var(--shadow);
}
.helpline-hero p{margin:.3rem 0;max-width:none}
.helpline-hero__title{font-size:1.2rem;font-weight:800;color:var(--teal-deep);line-height:1.3;display:flex;flex-wrap:wrap;align-items:center;gap:.35rem .6rem}
.helpline-hero__number{line-height:1.1}
.helpline-hero__number a{font-size:clamp(2.3rem,9vw,3.4rem);font-weight:900;color:var(--teal-dark);text-decoration:none;letter-spacing:.01em;white-space:nowrap}
.helpline-hero__number a:hover{color:var(--teal)}
.helpline-hero__actions{display:flex;flex-wrap:wrap;gap:.65rem;margin:.75rem 0 .6rem}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;min-height:3rem;padding:.6rem 1.15rem;border-radius:999px;font:inherit;font-weight:800;font-size:1.05rem;text-decoration:none;cursor:pointer;border:3px solid transparent}
.btn--call{background:var(--teal-deep);color:var(--white)}
.btn--call:hover{background:var(--teal);color:var(--white)}
.btn--online{background:var(--white);color:var(--teal-deep);border-color:var(--teal)}
.btn--online:hover:not([disabled]){background:var(--eucalyptus-soft)}
.btn--online[disabled]{cursor:not-allowed;color:var(--ink-muted);border-color:#9fb0b0;border-style:dashed}
.btn:focus{outline:3px solid var(--focus);outline-offset:3px}
.badge{display:inline-block;background:var(--plum);color:var(--gold-light);font-size:.8rem;font-weight:800;text-transform:uppercase;letter-spacing:.06em;padding:.2rem .6rem;border-radius:999px;line-height:1.4}
.badge--soft{background:var(--gold-light);color:var(--plum)}
.helpline-hero__status{font-size:1.05rem;color:var(--ink);font-weight:600}
.helpline-hero .ai-note{font-size:.9rem;color:var(--ink-muted);margin-top:.5rem}
@media(max-width:36rem){.helpline-hero__actions .btn{flex:1 1 100%;padding:.6rem .8rem;font-size:1rem}}
.badge{white-space:nowrap}
.btn--online{flex-wrap:wrap;row-gap:.25rem}
.helpline-hero--compact{padding:.9rem 1.1rem .8rem}
.helpline-hero--compact .helpline-hero__number a{font-size:clamp(1.9rem,7vw,2.5rem)}
.helpline-hero--compact .ai-note{display:none}

/* Other helplines, lower on the page */
.crisis.crisis--lower{border-radius:var(--radius);margin:2rem 0;padding:1.15rem 1.3rem;box-shadow:var(--shadow)}
.crisis.crisis--lower h2{margin:0 0 .6rem;font-size:1.3rem}
.crisis.crisis--lower ul{padding-left:0}
.crisis.crisis--lower li{margin:0}
.crisis.crisis--lower p{margin:.75rem 0 0;color:var(--cream-warm)}

/* ===== i18n: language picker, translation notice, scripts and RTL ===== */
.lang-picker{background:var(--cream-warm);border-bottom:3px solid var(--gold);padding:.55rem 1.25rem .65rem}
.lang-picker__label{margin:0 0 .35rem;font-weight:800;font-size:1rem;color:var(--teal-dark)}
.lang-picker ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.4rem .45rem}
.lang-picker a{display:inline-flex;align-items:center;min-height:2.4rem;padding:.15rem .75rem;border:2px solid var(--teal);border-radius:999px;background:var(--white);color:var(--teal-deep);font-weight:700;font-size:1.05rem;line-height:1.2;text-decoration:none}
.lang-picker a:hover{background:var(--eucalyptus-soft);color:var(--teal-dark)}
.lang-picker a:focus{outline:3px solid var(--focus);outline-offset:2px}
.lang-picker a[aria-current]{background:var(--teal-deep);border-color:var(--teal-deep);color:var(--white)}
@media(max-width:36rem){.lang-picker{padding:.5rem .9rem .6rem}.lang-picker ul{gap:.35rem .35rem}.lang-picker a{font-size:1rem;padding:.1rem .6rem}}
.i18n-notice{background:var(--white);border:2px solid var(--teal);border-radius:var(--radius);padding:.85rem 1.1rem;margin:0 0 1.5rem;font-size:.95rem}
.i18n-notice p{margin:.3rem 0;max-width:none}
.i18n-notice strong{color:var(--teal-dark)}

@font-face{font-family:"FGD Noto Sans Gurmukhi";src:url(/fonts/noto-sans-gurmukhi.woff2) format("woff2");font-weight:400 900;font-display:swap;unicode-range:U+0A00-0A7F,U+0964-0965,U+200C-200D,U+25CC}
@font-face{font-family:"FGD Noto Sans Devanagari";src:url(/fonts/noto-sans-devanagari.woff2) format("woff2");font-weight:400 900;font-display:swap;unicode-range:U+0900-097F,U+1CD0-1CFF,U+200C-200D,U+20B9,U+25CC,U+A830-A839,U+A8E0-A8FF}
:lang(zh-Hans){font-family:system-ui,-apple-system,"PingFang SC","Hiragino Sans GB","Microsoft YaHei","Noto Sans CJK SC","Noto Sans SC","Source Han Sans SC",sans-serif}
:lang(zh-Hant){font-family:system-ui,-apple-system,"PingFang TC","PingFang HK","Microsoft JhengHei","Noto Sans CJK TC","Noto Sans TC","Noto Sans CJK HK","Source Han Sans TC",sans-serif}
:lang(ar){font-family:system-ui,-apple-system,"Segoe UI","SF Arabic","Geeza Pro","Noto Sans Arabic","Noto Naskh Arabic",Tahoma,Arial,sans-serif}
:lang(pa){font-family:system-ui,-apple-system,"Nirmala UI","Gurmukhi MN","Mukta Mahee","Noto Sans Gurmukhi","Raavi","FGD Noto Sans Gurmukhi",sans-serif}
:lang(hi){font-family:system-ui,-apple-system,"Nirmala UI","Kohinoor Devanagari","Noto Sans Devanagari","Mangal","FGD Noto Sans Devanagari",sans-serif}
html:lang(ar) body,html:lang(pa) body,html:lang(hi) body{line-height:1.8}
html:lang(zh-Hans) body,html:lang(zh-Hant) body{line-height:1.7}
:lang(ar) h1,:lang(ar) h2,:lang(ar) h3,:lang(ar) .badge,:lang(zh-Hans) .badge,:lang(zh-Hant) .badge,:lang(pa) .badge,:lang(hi) .badge,:lang(zh-Hans) h1,:lang(zh-Hant) h1{letter-spacing:0}
:lang(ar) h1,:lang(ar) h2,:lang(ar) h3,:lang(pa) h1,:lang(pa) h2,:lang(hi) h1,:lang(hi) h2{line-height:1.45}

/* Right-to-left (Arabic) */
[dir=rtl] .skip{left:auto;right:-999px}
[dir=rtl] .skip:focus{left:auto;right:8px}
[dir=rtl] .note{border-left:0;border-right:6px solid var(--gold);border-radius:var(--radius) 0 0 var(--radius)}
[dir=rtl] .notice{border-left:0;border-right:6px solid var(--teal);border-radius:var(--radius) 0 0 var(--radius)}
[dir=rtl] main ul:not(.cards){padding-left:0;padding-right:1.2rem}
[dir=rtl] .hero h1{left:auto;right:3%}
[dir=rtl] a[href^="tel:"]:not(.btn),[dir=rtl] a[href^="mailto:"]{direction:ltr;unicode-bidi:isolate}
[dir=rtl] .btn{unicode-bidi:isolate}
/* Very narrow phones (<368px): shrink the big helpline number so it never forces sideways scrolling */
@media(max-width:23rem){.helpline-hero__number a,.helpline-hero--compact .helpline-hero__number a{font-size:10vw}}

/* ===== Design review 2026-10-22: call-first layout ===== */
/* Language: one dropdown */
.lang-picker{padding:.35rem 1.25rem}
.lang-picker details{position:relative}
.lang-picker summary.lang-picker__label{display:inline-flex;align-items:center;gap:.35rem;margin:0;cursor:pointer;min-height:2.4rem;padding:.1rem .8rem;border:2px solid var(--teal);border-radius:999px;background:var(--white);list-style:none}
.lang-picker summary::-webkit-details-marker{display:none}
.lang-picker summary::after{content:"▾";font-size:.85em}
.lang-picker summary:focus{outline:3px solid var(--focus);outline-offset:2px}
.lang-picker details[open] ul{margin-top:.45rem}
@media(max-width:36rem){.lang-picker{padding:.35rem .9rem}}
/* Main menu: hamburger on small screens */
.menu-toggle{position:absolute;opacity:0;width:1px;height:1px;pointer-events:none}
.menu-btn{display:none}
@media(max-width:48rem){
  header.site{padding:.55rem 1rem;justify-content:space-between}
  .brand img{height:44px}
  .menu-btn{display:inline-flex;align-items:center;gap:.4rem;min-height:2.75rem;padding:.3rem .9rem;border:2px solid var(--cream);border-radius:999px;color:var(--cream);font-weight:800;cursor:pointer}
  .menu-toggle:focus-visible + .menu-btn{outline:3px solid var(--focus-on-dark);outline-offset:3px}
  header.site nav{display:none;flex-basis:100%}
  .menu-toggle:checked ~ nav{display:block}
  header.site nav ul{flex-direction:column;gap:.5rem}
}
/* Home headline sits inside the helpline box */
.helpline-hero h1{font-size:1.45rem;margin:0 0 .5rem}
@media(min-width:48rem){.helpline-hero h1{font-size:2rem}}
.cards .card h3{margin:0}
/* Call is the only primary button; online chat is a small text link */
.btn--online,.btn--online[disabled]{background:none;border:0;min-height:2.75rem;padding:.2rem .1rem;font-size:.95rem;font-weight:700;color:var(--teal-deep);text-decoration:underline;text-underline-offset:.15em}
.btn--online[disabled]{color:var(--ink)}
@media(max-width:36rem){.helpline-hero__actions .btn--online{flex:0 1 auto;font-size:.95rem}}
/* AI note: darker text for WCAG AA */
.helpline-hero .ai-note{color:var(--ink)}
.helpline-hero .note{margin:.5rem 0;padding:.5rem .75rem;font-size:.95rem}
/* Sticky call bar (mobile) */
.call-bar{display:none}
@media(max-width:48rem){
  .call-bar{display:flex;align-items:center;justify-content:center;position:fixed;left:0;right:0;bottom:0;z-index:50;min-height:3.4rem;padding:.5rem 1rem calc(.5rem + env(safe-area-inset-bottom));background:var(--teal-deep);color:var(--white);font-weight:800;font-size:1.1rem;text-decoration:none;box-shadow:0 -4px 14px rgba(22,56,56,.25)}
  .call-bar:focus{outline:3px solid var(--focus-on-dark);outline-offset:-5px}
  body{padding-bottom:4.2rem}
}
[dir=rtl] .call-bar{direction:rtl;unicode-bidi:isolate}
@media(max-width:36rem){
  body{position:relative}
  .danger-strip{padding-right:8.5rem}
  .lang-picker{position:absolute;top:0;right:.5rem;padding:.2rem 0;background:none;border:0;z-index:40}
  .lang-picker summary.lang-picker__label{min-height:2.2rem;padding:0 .65rem;font-size:.9rem}
  .lang-picker details[open] ul{position:absolute;right:0;top:100%;background:var(--cream-warm);border:2px solid var(--gold);border-radius:var(--radius);padding:.5rem;width:16rem;box-shadow:var(--shadow)}
  [dir=rtl] .lang-picker{right:auto;left:.5rem}
  [dir=rtl] .danger-strip{padding-right:1.25rem;padding-left:8.5rem}
  [dir=rtl] .lang-picker details[open] ul{right:auto;left:0}
  main{padding-top:.9rem}
  .helpline-hero{padding:.85rem 1rem .9rem}
  .helpline-hero h1{font-size:1.2rem;margin:0 0 .35rem}
  .helpline-hero__title{font-size:1rem}
  .helpline-hero__actions{margin:.5rem 0 .4rem}
}
@media(max-width:36rem){
  header.site{padding:.4rem 1rem}
  .brand img{height:38px}
  .menu-btn{min-height:2.5rem;padding:.2rem .8rem}
  .helpline-hero__number a{font-size:clamp(2.1rem,9vw,3.4rem)}
}
@media(max-width:36rem){:lang(fil) .helpline-hero h1{font-size:1.05rem}:lang(fil) .helpline-hero__title{font-size:.95rem}}
@media(max-width:36rem){
  .danger-strip{padding-right:7.4rem;font-size:.9rem}
  [dir=rtl] .danger-strip{padding-right:.9rem;padding-left:7.4rem}
  .lang-picker summary.lang-picker__label{max-width:6.8rem;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;display:block;line-height:2.1rem}
  :lang(fil) .helpline-hero{padding-top:.7rem}
  :lang(fil) .helpline-hero__number a{font-size:2rem}
}
@media(max-width:36rem){
  .danger-strip{padding-right:8.8rem}
  [dir=rtl] .danger-strip{padding-right:.9rem;padding-left:8.8rem}
  .lang-picker summary.lang-picker__label{max-width:8.3rem}
}
@media(max-width:36rem){
  .danger-strip{padding-right:7.6rem}
  [dir=rtl] .danger-strip{padding-right:.9rem;padding-left:7.6rem}
  .lang-picker summary.lang-picker__label{max-width:7.1rem;font-size:.8rem;padding:0 .55rem}
}
[dir=rtl] a.call-bar[href^="tel:"]{direction:rtl;unicode-bidi:isolate}
/* ===== Fix 2 (2026-10-22): JS menu button, tighter mobile helpline box, desktop language ===== */
button.menu-btn{font:inherit;background:none}
.menu-btn[hidden],.menu-toggle[hidden]{display:none!important}
@media(max-width:48rem){
  .menu-js header.site nav{display:none}
  .menu-js header.site nav.is-open{display:block}
  .menu-btn--js:focus{outline:3px solid var(--focus-on-dark);outline-offset:3px}
}
@media(max-width:36rem){
  main{padding-top:.6rem}
  .helpline-hero{padding:.6rem .9rem .75rem;margin-bottom:1rem}
  .helpline-hero h1,:lang(fil) .helpline-hero h1{font-size:1.05rem;line-height:1.25;margin:0 0 .2rem}
  .helpline-hero__title,:lang(fil) .helpline-hero__title{font-size:.9rem;line-height:1.25;gap:.2rem .45rem}
  .helpline-hero__title .badge{font-size:.68rem;padding:.1rem .45rem}
  .helpline-hero p.helpline-hero__number{margin:.15rem 0 0}
  .helpline-hero__number a,:lang(fil) .helpline-hero__number a{font-size:1.9rem}
  .helpline-hero__actions{margin:.35rem 0 .3rem;gap:.3rem}
  .helpline-hero__actions .btn--call{min-height:2.75rem;padding:.4rem .8rem}
  :lang(ar) .helpline-hero h1,:lang(pa) .helpline-hero h1,:lang(hi) .helpline-hero h1{line-height:1.35}
}
/* Desktop: language dropdown sits in the header row instead of its own strip */
@media(min-width:48.01rem){
  body{position:relative}
  .lang-picker{position:absolute;right:1.25rem;top:calc(var(--strip-h,2.2rem) + 1.1rem);padding:0;background:none;border:0;z-index:40}
  .lang-picker details[open] ul{position:absolute;right:0;top:100%;background:var(--cream-warm);border:2px solid var(--gold);border-radius:var(--radius);padding:.5rem;width:20rem;box-shadow:var(--shadow);margin-top:.4rem}
  [dir=rtl] .lang-picker{right:auto;left:1.25rem}
  [dir=rtl] .lang-picker details[open] ul{right:auto;left:0}
  header.site{padding-right:12rem}
  [dir=rtl] header.site{padding-right:1.25rem;padding-left:12rem}
  .lang-picker summary.lang-picker__label{background:var(--cream);font-size:.9rem}
}
/* Language dropdown lives inside the header row (all widths) */
header.site .lang-picker{position:static;order:3;margin-left:auto;padding:0;background:none;border:0;z-index:40}
[dir=rtl] header.site .lang-picker{margin-left:0;margin-right:auto}
header.site .lang-picker details{position:relative}
header.site .lang-picker summary.lang-picker__label{background:var(--cream);color:var(--teal-dark);border-color:var(--cream);font-size:.9rem;max-width:none;display:inline-flex;line-height:1.2}
header.site .lang-picker details[open] ul{position:absolute;right:0;left:auto;top:100%;margin-top:.45rem;background:var(--cream-warm);border:2px solid var(--gold);border-radius:var(--radius);padding:.5rem;width:min(20rem,calc(100vw - 2rem));box-shadow:var(--shadow)}
[dir=rtl] header.site .lang-picker details[open] ul{right:auto;left:0}
header.site .lang-picker a{color:var(--teal-deep);border-bottom:2px solid var(--teal)}
header.site .lang-picker a[aria-current]{color:var(--white)}
header.site nav{order:2}
header.site .menu-toggle,header.site .menu-btn{order:4}
header.site #main-nav{order:5}
@media(min-width:48.01rem){header.site,[dir=rtl] header.site{padding:.85rem 1.25rem}header.site #main-nav{order:2}}
@media(max-width:48rem){header.site{gap:.5rem}header.site .lang-picker{margin-left:auto}}
@media(max-width:36rem){
  .danger-strip,[dir=rtl] .danger-strip{padding:.35rem .9rem}
  header.site .lang-picker summary.lang-picker__label{max-width:9.5rem;display:block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;line-height:2.1rem;font-size:.8rem;min-height:2.3rem}
}
header.site nav.lang-picker{display:block}
button.menu-btn{font-weight:800}
/* Home, mobile: the h1 already says it, so the sub-title line collapses to its "Opening soon" badge
   (text stays in the DOM for screen readers) */
@media(max-width:36rem){
  .helpline-hero h1 + .helpline-hero__title{font-size:0;gap:0;margin:0}
  .helpline-hero h1 + .helpline-hero__title .badge{font-size:.68rem}
}
header.site nav.lang-picker{flex-basis:auto;flex-shrink:1;min-width:0}
header.site{flex-wrap:wrap}
@media(max-width:36rem){header.site .lang-picker summary.lang-picker__label{max-width:8rem}}
@media(max-width:36rem){
  header.site{gap:.4rem;padding:.4rem .75rem}
  header.site .lang-picker summary.lang-picker__label{max-width:7rem}
  .menu-btn{padding:.2rem .65rem;gap:.3rem}
}