/* ============================================================================
   Biswakarma Pratibha Samman 2026
   Website stylesheet. Built to BPS26 Design System v1, Sections 16 to 18.
   Every colour and type value below is quoted from that document. Do not add
   colours and do not introduce a second typeface.
   ========================================================================= */

/* ---- Fonts. Subset from the OFL originals in Identity/fonts. -------------- */
@font-face{font-family:'Archivo';src:url('assets/fonts/archivo-400.woff2') format('woff2');
  font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Archivo';src:url('assets/fonts/archivo-700.woff2') format('woff2');
  font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:'Archivo';src:url('assets/fonts/archivo-800.woff2') format('woff2');
  font-weight:800;font-style:normal;font-display:swap}
@font-face{font-family:'Archivo Expanded';src:url('assets/fonts/archivo-exp-800.woff2') format('woff2');
  font-weight:800;font-style:normal;font-display:swap}
/* 3 KB face holding only the six glyphs of the toggle's own label, so an
   English page never downloads the full Devanagari face for one word. */
@font-face{font-family:'MuktaToggle';src:url('assets/fonts/mukta-toggle.woff2') format('woff2');
  font-weight:400 700;font-style:normal;font-display:swap}
/* Mukta carries a unicode-range so it is only fetched when Devanagari renders. */
@font-face{font-family:'Mukta';src:url('assets/fonts/mukta-400.woff2') format('woff2');
  font-weight:400;font-style:normal;font-display:swap;unicode-range:U+0900-097F,U+200C-200D,U+25CC}
@font-face{font-family:'Mukta';src:url('assets/fonts/mukta-700.woff2') format('woff2');
  font-weight:700;font-style:normal;font-display:swap;unicode-range:U+0900-097F,U+200C-200D,U+25CC}

/* ---- Section 16 screen values -------------------------------------------- */
:root{
  --bg:#F4EFE2;
  --surface:#FFFFFF;
  --surface-2:#EAE3D1;
  --ink:#14180F;
  --ink-muted:#5A5B52;
  --brand:#0A3B1C;
  --brand-deep:#05230F;
  --accent:#B4882B;
  --danger:#9A3312;
  --ok:#1E6B3A;
  --rule:#CFC6B0;

  --measure:68ch;
  --gutter:24px;
  --content:1200px;
  --pad:20px;
  --radius:4px;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);
  font-family:'Archivo','Mukta',system-ui,sans-serif;
  font-size:17px;line-height:1.6;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}

/* Devanagari runs at 1.08x the Latin size at every step. Section 16. */
html[lang="ne"] body,.np{font-size:1.08em;line-height:1.65}
html[lang="ne"] .exp,html[lang="ne"] h1,html[lang="ne"] h2,html[lang="ne"] h3{letter-spacing:0}

img{max-width:100%;height:auto;display:block}
a{color:var(--brand);text-decoration:underline;text-underline-offset:2px}
a:hover{text-decoration-thickness:2px}

/* Focus: 2px Medal Gold ring, 2px offset, never removed. Section 18. */
:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:2px}

.container{width:100%;max-width:calc(var(--content) + 2*var(--pad));margin:0 auto;padding:0 var(--pad)}
.skip{position:absolute;left:-9999px;top:0;background:var(--brand);color:var(--bg);
  padding:12px 18px;z-index:100}
.skip:focus{left:8px;top:8px}

/* ---- Type scale, Section 16 ---------------------------------------------- */
.display{font-family:'Archivo Expanded','Archivo',sans-serif;font-weight:800;
  font-size:40px;line-height:.98;letter-spacing:-.015em;color:var(--brand);margin:0}
h1,.h1{font-size:30px;line-height:1.08;font-weight:800;letter-spacing:-.01em;color:var(--brand);margin:0}
h2,.h2{font-size:24px;line-height:1.18;font-weight:800;color:var(--brand);margin:0}
h3,.h3{font-size:19px;line-height:1.28;font-weight:700;color:var(--ink);margin:0}
p{margin:0 0 16px;max-width:var(--measure)}
.lead{font-size:19px;line-height:1.5}
.small{font-size:14px;line-height:1.5}
.muted{color:var(--ink-muted)}
.label{font-size:13px;line-height:1.3;font-weight:800;letter-spacing:.12em;text-transform:uppercase}
.eyebrow{font-size:13px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;
  color:var(--brand);margin:0 0 10px}
.exp{font-family:'Archivo Expanded','Archivo',sans-serif;font-weight:800}

@media (min-width:720px){
  .display{font-size:56px}
  h1,.h1{font-size:38px}
  h2,.h2{font-size:28px}
  h3,.h3{font-size:21px}
  .lead{font-size:20px}
}
@media (min-width:1024px){
  :root{--pad:40px}
  .display{font-size:72px;line-height:.94}
  h1,.h1{font-size:44px;line-height:1.05}
  h2,.h2{font-size:30px;line-height:1.15}
}
@media (min-width:1440px){:root{--pad:80px}}

/* ---- Header. Deep Green band, 72px, sticky, reduced to 56px. Section 17. -- */
.site-header{position:sticky;top:0;z-index:50;background:var(--brand-deep);color:var(--bg)}
.site-header a{color:var(--bg)}
.header-inner{height:72px;display:flex;align-items:center;gap:16px;transition:height .18s ease}
.site-header.is-stuck .header-inner{height:56px}
.brand-lockup{display:flex;align-items:center;gap:12px;text-decoration:none;flex:0 0 auto}
.brand-lockup img{width:44px;height:44px;transition:width .18s ease,height .18s ease}
.site-header.is-stuck .brand-lockup img{width:36px;height:36px}
.brand-lockup .wordmark{font-size:13px;font-weight:800;letter-spacing:.11em;text-transform:uppercase;
  line-height:1.15;max-width:15ch}
.brand-lockup .wordmark{white-space:nowrap}
.brand-lockup .wordmark span{display:block;font-size:11px;letter-spacing:.16em;color:var(--accent);margin-top:2px}

.nav{margin-left:auto;display:flex;align-items:center;gap:22px}
.nav a{font-size:15px;text-decoration:none}
.nav a:hover,.nav a[aria-current="page"]{text-decoration:underline;text-underline-offset:4px}
.nav-links{display:flex;gap:22px;align-items:center}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;
  min-height:48px;padding:0 22px;border-radius:var(--radius);border:2px solid transparent;
  font:inherit;font-size:16px;font-weight:800;letter-spacing:.02em;
  text-decoration:none;cursor:pointer;text-align:center}
.btn-primary{background:var(--brand);color:var(--bg);border-color:var(--brand)}
.btn-primary:hover{background:var(--brand-deep);border-color:var(--brand-deep)}
.btn-secondary{background:transparent;color:var(--brand);border-color:var(--brand)}
.btn-secondary:hover{background:var(--surface-2)}
.btn-gold,.site-header .btn-gold,.band-green .btn-gold,.band-deep .btn-gold,.action-band .btn-gold{
  background:var(--accent);color:#231800;border-color:var(--accent);min-height:44px;padding:0 18px}
.btn-gold:hover{background:#9C7522;border-color:#9C7522}
.btn-block{width:100%}
.btn[disabled],.btn[aria-disabled="true"]{opacity:.55;cursor:not-allowed}

/* Language toggle. Persistent in the header, across pages. Section 18. */
.lang{display:inline-flex;border:1px solid rgba(244,239,226,.45);border-radius:var(--radius);overflow:hidden}
.lang button{min-height:36px;padding:0 11px;background:transparent;color:var(--bg);border:0;
  font:inherit;font-size:13px;font-weight:700;letter-spacing:.06em;cursor:pointer;
  font-family:'Archivo','MuktaToggle',sans-serif}
.lang button[aria-pressed="true"]{background:var(--bg);color:var(--brand-deep)}

.nav-toggle{display:none;margin-left:auto;min-height:44px;min-width:44px;background:transparent;
  border:1px solid rgba(244,239,226,.45);border-radius:var(--radius);color:var(--bg);
  font:inherit;font-size:14px;font-weight:700;cursor:pointer;padding:0 12px}

@media (max-width:1023px){
  .nav-toggle{display:inline-flex;align-items:center;justify-content:center}
  .nav{position:absolute;top:100%;left:0;right:0;background:var(--brand-deep);
    flex-direction:column;align-items:stretch;gap:0;padding:8px var(--pad) 20px;
    border-top:1px solid rgba(244,239,226,.2);display:none}
  .nav.is-open{display:flex}
  .nav-links{flex-direction:column;align-items:stretch;gap:0}
  .nav-links a{padding:14px 0;border-bottom:1px solid rgba(244,239,226,.15)}
  .nav .btn-gold{margin-top:16px}
  .nav .lang{margin-top:16px;align-self:flex-start}
}

/* ---- Sections ------------------------------------------------------------ */
section{padding:56px 0}
@media (min-width:1024px){section{padding:80px 0}}
.section-head{max-width:var(--measure);margin-bottom:28px}
.section-head p{margin-bottom:0}
.band-2{background:var(--surface-2)}

/* ---- Hero ---------------------------------------------------------------- */
.hero{padding:44px 0 52px;border-bottom:1px solid var(--rule)}
@media (min-width:1024px){.hero{padding:72px 0 80px}}
.hero-grid{display:grid;gap:32px}
@media (min-width:1024px){.hero-grid{grid-template-columns:minmax(0,7fr) minmax(0,4fr);gap:56px;align-items:start}}
.hero p.lead{max-width:52ch}
.hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.hero-emblem{display:none}
@media (min-width:1024px){.hero-emblem{display:block;justify-self:end;width:176px}}

/* ---- Deadline callout. Accent is for deadlines. Section 16. -------------- */
.deadline{border:2px solid var(--accent);background:var(--surface);
  padding:20px 22px;border-radius:var(--radius);max-width:var(--measure)}
.deadline .label{color:var(--accent)}
.deadline .when{font-family:'Archivo Expanded','Archivo',sans-serif;font-weight:800;
  font-size:28px;line-height:1.1;margin:6px 0 4px;color:var(--ink)}
@media (min-width:720px){.deadline .when{font-size:34px}}

/* ---- Cards. White surface, 1px rule, no shadow. Section 17. -------------- */
.card-grid{display:grid;gap:20px;grid-template-columns:1fr}
@media (min-width:720px){.card-grid{grid-template-columns:repeat(2,1fr)}}
@media (min-width:1024px){.card-grid{grid-template-columns:repeat(3,1fr);gap:var(--gutter)}}

.card{position:relative;background:var(--surface);border:1px solid var(--rule);
  border-radius:var(--radius);padding:22px 22px 24px;display:flex;flex-direction:column}
.card .eyebrow{margin-bottom:8px}
.card h3{margin-bottom:8px}
.card p{font-size:16px;margin-bottom:16px}
.card .card-foot{margin-top:auto;display:flex;align-items:baseline;justify-content:space-between;
  gap:12px;flex-wrap:wrap}
/* Whole card is the click target. Section 17. */
.card a.stretch::after{content:"";position:absolute;inset:0}
.card:focus-within{outline:2px solid var(--accent);outline-offset:2px}
.card a.stretch:focus-visible{outline:none}

/* Entry status carries a word as well as a colour. Section 18. */
.status{font-size:13px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;
  display:inline-flex;align-items:center;gap:7px;white-space:nowrap}
.status::before{content:"";width:9px;height:9px;border-radius:50%;background:currentColor;flex:0 0 auto}
.status-open{color:var(--ok)}
.status-soon{color:var(--ink-muted)}
.status-closed{color:var(--danger)}

/* ---- Tables. Alternating rows in Cream Deep. Stack below 720px. Sec 17. -- */
.table-wrap{overflow-x:auto}
table{width:100%;border-collapse:collapse;font-size:16px}
caption{text-align:left;font-size:14px;color:var(--ink-muted);padding-bottom:10px}
th{text-align:left;font-size:13px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;
  color:var(--brand);border-bottom:2px solid var(--brand);padding:0 16px 10px 0}
td{padding:14px 16px 14px 0;border-bottom:1px solid var(--rule);vertical-align:top}
tbody tr:nth-child(even){background:var(--surface-2)}
tbody tr:nth-child(even) td{padding-left:10px}
.time{font-family:'Archivo Expanded','Archivo',sans-serif;font-weight:800;white-space:nowrap}

@media (max-width:719px){
  table.stack,table.stack tbody,table.stack tr,table.stack td{display:block;width:100%}
  table.stack thead{position:absolute;left:-9999px}
  table.stack tr{background:var(--surface);border:1px solid var(--rule);
    border-radius:var(--radius);padding:14px 16px;margin-bottom:14px}
  table.stack tbody tr:nth-child(even){background:var(--surface-2)}
  table.stack td{border:0;padding:4px 0}
  table.stack td::before{content:attr(data-th);display:block;font-size:12px;font-weight:800;
    letter-spacing:.1em;text-transform:uppercase;color:var(--ink-muted)}
}

/* ---- Panels -------------------------------------------------------------- */
.panel{background:var(--surface-2);border-radius:var(--radius);padding:22px 24px;max-width:var(--measure)}
.panel.on-white{background:var(--surface);border:1px solid var(--rule)}
.panel.dark{background:var(--brand);color:var(--bg)}
.panel.dark h2,.panel.dark h3{color:var(--bg)}
.panel.dark a{color:var(--bg)}
.panel.note{border-left:6px solid var(--accent)}
.panel > :last-child{margin-bottom:0}

.facts{list-style:none;margin:0;padding:0;display:grid;gap:2px}
.facts li{display:grid;grid-template-columns:1fr;gap:2px;padding:12px 0;border-bottom:1px solid var(--rule)}
.facts li:last-child{border-bottom:0}
@media (min-width:600px){.facts li{grid-template-columns:170px 1fr;gap:16px;align-items:baseline}}
.facts dt,.facts .k{font-size:13px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-muted)}

ul.bullets{list-style:none;margin:0 0 16px;padding:0;max-width:var(--measure)}
ul.bullets li{position:relative;padding-left:22px;margin-bottom:10px}
ul.bullets li::before{content:"";position:absolute;left:0;top:11px;width:11px;height:3px;background:var(--accent)}

/* ---- Forms. Section 18. -------------------------------------------------- */
.form{max-width:640px}
.fieldset{border:0;padding:0;margin:0 0 40px}
.fieldset > legend{font-size:19px;font-weight:800;color:var(--brand);padding:0;margin-bottom:6px}
.fieldset .legend-note{font-size:14px;color:var(--ink-muted);margin-bottom:22px;max-width:var(--measure)}

/* One question per row. Never two fields side by side, including on desktop. */
.field{display:block;margin-bottom:26px}
.field > label,.field > .field-label{display:block;font-size:16px;font-weight:700;margin-bottom:4px}
.field .req{color:var(--danger);font-weight:800}
.field .optional{font-weight:400;color:var(--ink-muted);font-size:14px}
/* Help text before the field, not after the error. */
.field .help{font-size:14px;line-height:1.45;color:var(--ink-muted);margin:0 0 8px;max-width:var(--measure)}

.field input[type=text],.field input[type=tel],.field input[type=email],
.field input[type=date],.field input[type=url],.field select,.field textarea{
  width:100%;min-height:48px;padding:11px 14px;background:var(--surface);
  border:1px solid var(--rule);border-radius:var(--radius);
  font:inherit;font-size:17px;color:var(--ink)}
.field textarea{min-height:132px;resize:vertical;line-height:1.5}
.field select{appearance:none;
  background-image:linear-gradient(45deg,transparent 50%,var(--ink) 50%),linear-gradient(135deg,var(--ink) 50%,transparent 50%);
  background-position:calc(100% - 20px) 22px,calc(100% - 14px) 22px;
  background-size:6px 6px,6px 6px;background-repeat:no-repeat;padding-right:44px}
.field input:focus-visible,.field select:focus-visible,.field textarea:focus-visible{
  outline:2px solid var(--accent);outline-offset:2px;border-color:var(--accent)}

.choices{display:grid;gap:10px}
.choice{display:flex;align-items:flex-start;gap:12px;min-height:44px;padding:11px 14px;
  background:var(--surface);border:1px solid var(--rule);border-radius:var(--radius);cursor:pointer}
.choice input{width:20px;height:20px;margin:2px 0 0;accent-color:var(--brand);flex:0 0 auto}
.choice span{font-size:16px}
.choice:has(input:checked){border-color:var(--brand);box-shadow:inset 0 0 0 1px var(--brand)}

/* Errors name the fix, not the fault. */
.field .error{display:none;font-size:15px;font-weight:700;color:var(--danger);margin-top:7px}
.field .error::before{content:"! ";font-weight:800}
.field.has-error .error{display:block}
.field.has-error input,.field.has-error select,.field.has-error textarea,
.field.has-error .choice{border-color:var(--danger);border-width:2px}

.form-error{display:none;background:#F5E3DC;border-left:6px solid var(--danger);
  border-radius:var(--radius);padding:18px 20px;margin-bottom:28px;max-width:var(--measure)}
.form-error.is-visible{display:block}
.form-error h3{color:var(--danger);margin-bottom:8px}
.form-error ol{margin:0;padding-left:20px}
.form-error a{color:var(--danger)}

/* Upload states what is accepted, the limit, and what to do if it is too big. */
.upload{background:var(--surface);border:1px dashed var(--rule);border-radius:var(--radius);padding:18px 20px}
.upload input[type=file]{font:inherit;font-size:15px;width:100%;margin-top:6px}
.upload input[type=file]::file-selector-button{min-height:44px;padding:0 16px;margin-right:14px;
  background:var(--surface-2);border:1px solid var(--rule);border-radius:var(--radius);
  font:inherit;font-weight:700;cursor:pointer}
.progress{margin-top:14px;display:none}
.progress.is-visible{display:block}
.progress .bar{height:10px;background:var(--surface-2);border-radius:999px;overflow:hidden}
.progress .bar i{display:block;height:100%;width:0;background:var(--brand);transition:width .2s linear}
.progress .pct{font-size:14px;font-weight:700;margin-top:6px}

.form-actions{display:flex;flex-wrap:wrap;gap:12px;align-items:center;
  border-top:1px solid var(--rule);padding-top:26px;margin-top:8px}
.save-note{font-size:14px;color:var(--ink-muted);margin:0}

/* Confirmation screen. Section 18. */
.confirm{display:none}
.confirm.is-visible{display:block}
.confirm .tick{width:56px;height:56px;border-radius:50%;background:var(--ok);color:#fff;
  display:flex;align-items:center;justify-content:center;font-size:30px;font-weight:800;margin-bottom:20px}
.ref{font-family:'Archivo Expanded','Archivo',sans-serif;font-weight:800;font-size:26px;
  letter-spacing:.04em;color:var(--brand)}

/* ---- Footer -------------------------------------------------------------- */
.site-footer{background:var(--brand-deep);color:var(--bg);padding:52px 0 28px;margin-top:0}
.site-footer a{color:var(--bg)}
.site-footer h3{color:var(--bg);font-size:14px;font-weight:800;letter-spacing:.12em;
  text-transform:uppercase;margin-bottom:14px}
.footer-grid{display:grid;gap:34px}
@media (min-width:720px){.footer-grid{grid-template-columns:2fr 1fr 1fr}}
.footer-grid ul{list-style:none;margin:0;padding:0}
.footer-grid li{margin-bottom:10px;font-size:16px}
.footer-lockup{display:flex;gap:16px;align-items:flex-start}
.footer-lockup img{width:64px;height:64px;flex:0 0 auto}
.footer-bottom{margin-top:18px;padding-top:0;
  font-size:14px;color:rgba(244,239,226,.72);display:flex;flex-wrap:wrap;gap:8px 22px}
.footer-bottom p{margin:0;max-width:none}

/* ---- Utilities ----------------------------------------------------------- */
.visually-hidden{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;
  overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.stack-sm > * + *{margin-top:12px}
.stack-md > * + *{margin-top:24px}
.mt-0{margin-top:0}.mb-0{margin-bottom:0}
.tbc{font-size:13px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;
  color:var(--ink-muted);border:1px dashed var(--rule);border-radius:var(--radius);padding:2px 8px;
  display:inline-block;white-space:nowrap}

@media print{
  .site-header,.nav,.site-footer,.btn{display:none}
  body{background:#fff}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}
  html{scroll-behavior:auto}
}
html{scroll-behavior:smooth;scroll-padding-top:86px}

/* Home page: the Samity split */
@media (min-width:900px){
  .about-split{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr)!important;gap:56px!important;align-items:start}
}

/* ---- Devanagari never takes letterspacing or caps -------------------------
   Section 19 of the design system, and the campaign rule proved on the
   Round 1 artwork. Devanagari has no uppercase, and tracking breaks its
   conjuncts, so both are switched off wherever the toggle is on Nepali.
   The brand lockup is exempt: it stays in Latin in both languages.        */
html[lang="ne"] .eyebrow,
html[lang="ne"] .label,
html[lang="ne"] .status,
html[lang="ne"] .tbc,
html[lang="ne"] .btn,
html[lang="ne"] th,
html[lang="ne"] .facts .k,
html[lang="ne"] .field-label,
html[lang="ne"] .site-footer h3,
html[lang="ne"] .fieldset > legend{
  letter-spacing:0;
  text-transform:none;
}
html[lang="ne"] .eyebrow,
html[lang="ne"] .label,
html[lang="ne"] .status,
html[lang="ne"] th,
html[lang="ne"] .facts .k{font-size:14px}
/* The lockup is the mark, not reading matter, and does not translate. */
html[lang="ne"] .brand-lockup .wordmark{letter-spacing:.11em;text-transform:uppercase}
html[lang="ne"] .brand-lockup .wordmark span{letter-spacing:.16em}

/* Small screens: let the stacked lockup set the header height rather than
   clipping it against a fixed 72 px. */
@media (max-width:719px){
  .header-inner{height:auto;min-height:64px;padding:10px 0}
  .site-header.is-stuck .header-inner{height:auto;min-height:56px}
  .brand-lockup .wordmark{font-size:11px;white-space:normal;max-width:14ch}
  .brand-lockup .wordmark span{font-size:10px}
}

/* ============================================================================
   THE BAND SYSTEM ON SCREEN
   Section 08: pieces are built from full-bleed horizontal bands, and the
   website page uses 03 to 06 as its hero and body. Section 10 allows solid
   panels, hairline rules, the emblem, and large numerals as graphic elements,
   and bans everything a "make it richer" brief usually reaches for: gradients,
   shadows, glows, filigree, AI texture, rounded cards with pill headers.
   Every device below is on the allowed list.
   ========================================================================= */

/* Full-bleed bands. The container inside keeps the 1200 px measure. */
.band{position:relative}
.band-cream{background:var(--bg)}
.band-cream-2{background:var(--surface-2)}
.band-green{background:var(--brand);color:var(--bg)}
.band-deep{background:var(--brand-deep);color:var(--bg)}
.band-green h1,.band-green h2,.band-green h3,
.band-deep h1,.band-deep h2,.band-deep h3{color:var(--bg)}
.band-green .eyebrow,.band-deep .eyebrow{color:var(--gold-light,#D9B45C)}
.band-green a,.band-deep a{color:var(--bg)}
.band-green .muted,.band-deep .muted{color:rgba(244,239,226,.74)}
.band-green .panel,.band-deep .panel{background:rgba(244,239,226,.09)}
:root{--gold-light:#D9B45C}

/* 02 Mark band. Emblem with its clear space, organiser line beneath in
   Archivo 700 caps +0.17em. */
.mark-band{padding:34px 0 0;text-align:left}
.mark-band img{width:96px;height:96px}
.mark-band .organiser{font-size:12px;font-weight:700;letter-spacing:.17em;
  text-transform:uppercase;color:var(--ink-muted);margin:14px 0 0;max-width:38ch}
.band-green .mark-band .organiser,.band-deep .mark-band .organiser{color:var(--gold-light)}

/* 06b Eligibility bar. Solid Medal Gold, ink type, Archivo 800 caps +0.16em.
   One line, naming who may enter. */
.eligibility-bar{background:var(--accent);color:#231800;
  font-size:13px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;
  padding:14px 0;line-height:1.45}
.eligibility-bar p{margin:0;max-width:none}
html[lang="ne"] .eligibility-bar{letter-spacing:0;text-transform:none;font-size:16px}

/* 03 Topic bar. 5 px Assembly Green rule box, green label block left, value
   centred in Archivo Expanded 800 caps, Devanagari value ranged right. */
.topic-bar{border:5px solid var(--brand);display:flex;flex-wrap:wrap;align-items:stretch;
  margin-top:26px;max-width:760px}
.topic-bar .k{background:var(--brand);color:var(--bg);padding:12px 16px;
  font-size:12px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;
  display:flex;align-items:center;flex:0 0 auto}
.topic-bar .v{flex:1 1 200px;padding:12px 18px;text-align:center;
  font-family:'Archivo Expanded','Archivo',sans-serif;font-weight:800;
  font-size:20px;letter-spacing:.03em;text-transform:uppercase;
  display:flex;align-items:center;justify-content:center;color:var(--ink)}
.topic-bar .np-v{padding:12px 18px;font-weight:700;font-size:18px;color:var(--ink);
  display:flex;align-items:center;border-left:1px solid var(--rule)}
html[lang="ne"] .topic-bar .k,html[lang="ne"] .topic-bar .v{letter-spacing:0;text-transform:none}
@media (min-width:720px){.topic-bar .v{font-size:26px}}

/* Large numerals as graphic elements. Section 10, allowed and until now unused. */
/* Assembly Green, not gold: gold on cream is 2.82:1 and these numerals carry
   information. Section 10 also says gold never carries information. */
.bignum{font-family:'Archivo Expanded','Archivo',sans-serif;font-weight:800;
  font-size:64px;line-height:.82;letter-spacing:-.03em;color:var(--brand);display:block}
@media (min-width:720px){.bignum{font-size:88px}}
.band-green .bignum,.band-deep .bignum{color:var(--gold-light)}

.stat-row{display:grid;gap:0;grid-template-columns:1fr;border-top:1px solid var(--rule)}
@media (min-width:720px){.stat-row{grid-template-columns:repeat(3,1fr)}}
.stat{padding:26px 0 28px;border-bottom:1px solid var(--rule)}
@media (min-width:720px){
  .stat{padding:30px 28px 32px;border-bottom:0;border-left:1px solid var(--rule)}
  .stat:first-child{padding-left:0;border-left:0}
}
.stat .t{font-size:16px;font-weight:700;margin:14px 0 2px;max-width:26ch}
.stat .d{font-size:14px;color:var(--ink-muted);margin:0;max-width:30ch}
.band-green .stat,.band-deep .stat{border-color:rgba(244,239,226,.26)}
.band-green .stat .d,.band-deep .stat .d{color:rgba(244,239,226,.74)}
.band-green .stat-row,.band-deep .stat-row{border-color:rgba(244,239,226,.26)}

/* 05 Action band. Reversed. Gold Light kicker +0.22em, Archivo Expanded
   headline, three numbered steps divided by 3 px rules at 28% opacity, then
   the send bar. The engine of the piece. */
.action-band{background:var(--brand);color:var(--bg);padding:52px 0 56px}
.action-band .kicker{font-size:13px;font-weight:800;letter-spacing:.22em;
  text-transform:uppercase;color:var(--gold-light);margin:0 0 14px}
html[lang="ne"] .action-band .kicker{letter-spacing:0;text-transform:none;font-size:15px}
.action-band h2{font-family:'Archivo Expanded','Archivo',sans-serif;font-weight:800;
  color:var(--bg);font-size:30px;line-height:1.02;letter-spacing:-.01em;max-width:20ch}
@media (min-width:720px){.action-band h2{font-size:44px}}
.action-band p{color:rgba(244,239,226,.86)}

.steps{display:grid;gap:0;grid-template-columns:1fr;margin-top:34px;
  border-top:3px solid rgba(244,239,226,.28)}
@media (min-width:720px){.steps{grid-template-columns:repeat(3,1fr)}}
.step{padding:22px 0 24px;border-bottom:3px solid rgba(244,239,226,.28)}
@media (min-width:720px){
  .step{padding:24px 26px 26px;border-bottom:0;border-left:3px solid rgba(244,239,226,.28)}
  .step:first-child{padding-left:0;border-left:0}
}
.step .n{font-family:'Archivo Expanded','Archivo',sans-serif;font-weight:800;
  font-size:32px;line-height:1;color:var(--gold-light);display:block;margin-bottom:12px}
.step h3{color:var(--bg);font-size:18px;font-weight:700;margin-bottom:6px}
.step p{font-size:15px;line-height:1.5;color:rgba(244,239,226,.86);margin:0}

/* Send bar. Channel label, number in Archivo Expanded 800, alternates beneath. */
.send-bar{margin-top:34px;border-top:1px solid rgba(244,239,226,.28);padding-top:26px;
  display:flex;flex-wrap:wrap;gap:24px 40px;align-items:flex-end}
.send-bar .channel{font-size:12px;font-weight:800;letter-spacing:.2em;text-transform:uppercase;
  color:var(--gold-light);margin:0 0 6px}
html[lang="ne"] .send-bar .channel{letter-spacing:0;text-transform:none;font-size:14px}
.send-bar .number{font-family:'Archivo Expanded','Archivo',sans-serif;font-weight:800;
  font-size:26px;line-height:1;color:var(--bg);text-decoration:none;letter-spacing:.02em}
@media (min-width:720px){.send-bar .number{font-size:34px}}
.send-bar .number:hover{text-decoration:underline;text-underline-offset:5px}
.send-bar .alt{font-size:14px;color:rgba(244,239,226,.74);margin:8px 0 0}
.send-bar .alt a{color:rgba(244,239,226,.92)}

/* 06a Deadline panel. Solid Medal Gold, not an outline. */
.deadline-solid{background:var(--accent);color:#231800;padding:26px 28px 28px;max-width:var(--measure)}
.deadline-solid .label{color:#231800;opacity:.78}
html[lang="ne"] .deadline-solid .label{letter-spacing:0;text-transform:none;font-size:15px}
.deadline-solid .when{font-family:'Archivo Expanded','Archivo',sans-serif;font-weight:800;
  font-size:30px;line-height:1.04;margin:8px 0 4px;color:#231800}
@media (min-width:720px){.deadline-solid .when{font-size:40px}}
.deadline-solid .consequence{font-size:15px;margin:0;color:#231800}
.deadline-solid a{color:#231800}

/* Cards get their index numeral and a hard edge. A rounded card with a pill
   header is a slide, not a poster. Section 10. */
.card,.panel,.eligibility-bar,.deadline-solid,.topic-bar{border-radius:0}
.card{border-top:4px solid var(--brand)}
.card .idx{position:absolute;top:14px;right:18px;
  font-family:'Archivo Expanded','Archivo',sans-serif;font-weight:800;font-size:26px;
  line-height:1;color:var(--rule);pointer-events:none}
.card h3{padding-right:44px}

/* Footer bar. Organiser and venue left, status right in Gold Light caps. */
.footer-bar{border-top:1px solid rgba(244,239,226,.22);margin-top:36px;padding-top:20px;
  display:flex;flex-wrap:wrap;gap:10px 24px;align-items:baseline;
  font-size:12px;font-weight:800;letter-spacing:.14em;text-transform:uppercase}
.footer-bar .status{margin-left:auto;color:var(--gold-light)}
html[lang="ne"] .footer-bar{letter-spacing:0;text-transform:none;font-size:14px}

/* Motion. Section 15: type animates by position or opacity only, never by
   rotation, bounce or elastic easing. */
@media (prefers-reduced-motion:no-preference){
  .reveal{opacity:0;transform:translateY(14px);
    transition:opacity .5s ease,transform .5s ease}
  .reveal.is-in{opacity:1;transform:none}
}

/* Section numerals. Large numerals as graphic elements, Section 10. They are
   decorative: the heading beside them carries the meaning. */
.secnum{font-family:'Archivo Expanded','Archivo',sans-serif;font-weight:800;
  font-size:40px;line-height:1;letter-spacing:-.02em;color:var(--rule);margin:0 0 6px}
.band-green .secnum,.band-deep .secnum{color:rgba(217,180,92,.5)}
@media (min-width:720px){.secnum{font-size:52px}}

/* Event rows on the programme page. Same devices as the cards: a hard green
   edge and a large index numeral, so a long list still reads as designed. */
/* .panel.on-white sets a `border` shorthand, so this needs equal specificity
   to keep the green edge. */
.panel.on-white.event-row{position:relative;border-left:5px solid var(--brand);padding-right:72px}
.event-row .idx{position:absolute;top:20px;right:22px;
  font-family:'Archivo Expanded','Archivo',sans-serif;font-weight:800;font-size:34px;
  line-height:1;color:var(--rule);pointer-events:none}
@media (max-width:719px){
  .event-row{padding-right:24px}
  .event-row .idx{font-size:24px;top:14px;right:16px}
}

/* ---- Category marks ------------------------------------------------------
   One stroke weight, one colour, never filled, never scaled below 24 px.
   They mark the category, not the event. Decorative in the accessibility
   sense: the category eyebrow beneath carries the same information in words,
   so colour and picture are never the only signal.
   ------------------------------------------------------------------------- */
/* Solid, and the detail inside is a real hole, so the ground shows through
   whether the mark sits on a white card, on cream or reversed on green. */
.mark{width:32px;height:32px;display:block;margin:0 0 12px;color:var(--brand)}
.band-green .mark,.band-deep .mark,.action-band .mark{color:var(--gold-light)}
.event-row .mark{width:38px;height:38px}
@media (min-width:1024px){.card .mark{width:34px;height:34px}}

/* Two link-colour collisions the contrast audit caught.
   1. `.action-band` is not `.band-green`, so links inside it fell back to
      Assembly Green on an Assembly Green ground and were invisible. That hid
      the three entry phone numbers on the event page.
   2. `.deadline-solid a` set ink for links on the gold panel, which also
      repainted the label of a green button sitting inside it. */
.action-band a{color:var(--bg)}
.action-band a:hover{text-decoration-thickness:2px}
.action-band .btn-primary{background:var(--bg);color:var(--brand);border-color:var(--bg)}
.action-band .btn-primary:hover{background:#fff;border-color:#fff}
.action-band .btn-gold{color:#231800}
.deadline-solid .btn-primary{color:var(--bg)}
.deadline-solid .btn-secondary{color:#231800;border-color:#231800}

/* ============================================================================
   22 SEPTEMBER 2026. THE FESTIVAL RECORD.
   The site was an entry portal; it is now the record of the eight events and
   the Grand Finale. New devices: the event emblems (client instruction, see
   DS v1.2 note), photographs of the events, and a slow crossfade. Motion is
   still opacity and position only. No shadows, no gradients, no filigree.
   ========================================================================= */

/* Photo crossfade. A stack of photographs, one on at a time. */
.slides{position:relative;overflow:hidden;background:var(--brand-deep);aspect-ratio:3/2}
.slides img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;
  transition:opacity 1.6s ease;transform:translateY(0)}
.slides img.is-on{opacity:1}
@media (prefers-reduced-motion:no-preference){
  .slides img{transition:opacity 1.6s ease,transform 9s linear;transform:translateY(2.5%)}
  .slides img.is-on{transform:translateY(-2.5%)}
}
.hero-record{padding:0 0 56px;border-bottom:0}
.hero-record .slides{margin-top:34px}
@media (min-width:1024px){
  .hero-record{padding-bottom:80px}
  .hero-split{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:56px;align-items:end}
  .hero-split .slides{margin-top:0;aspect-ratio:4/3}
}

/* Emblem lockup: the event's own emblem beside its name. */
.emblem{width:96px;height:96px;flex:0 0 auto}
.emblem-lg{width:140px;height:140px}
@media (min-width:720px){.emblem-lg{width:200px;height:200px}}
.event-head{display:flex;gap:22px;align-items:center;flex-wrap:wrap}
.event-head h1,.event-head h2{margin:0}

/* Programme: one row per event, in date order. Emblem, date column, name,
   one line, status word. Hard green edge like the cards. */
.programme{list-style:none;margin:0;padding:0;border-top:1px solid var(--rule)}
.programme li{display:grid;grid-template-columns:64px 1fr;gap:16px 18px;padding:20px 0;
  border-bottom:1px solid var(--rule);align-items:start}
.programme img{width:64px;height:64px}
.programme .date{font-family:'Archivo Expanded','Archivo',sans-serif;font-weight:800;
  font-size:15px;letter-spacing:.02em;color:var(--brand);text-transform:uppercase;margin:0 0 4px}
.programme h3{margin:0 0 4px}
.programme h3 a{text-decoration:none}
.programme h3 a:hover{text-decoration:underline}
.programme p{margin:0;font-size:15px;color:var(--ink-muted);max-width:60ch}
.programme .st{margin-top:8px}
@media (min-width:720px){
  .programme li{grid-template-columns:80px 150px 1fr auto;align-items:center}
  .programme img{width:80px;height:80px}
  .programme .date{margin:0;font-size:16px}
  .programme .st{margin:0}
}
html[lang="ne"] .programme .date{text-transform:none;letter-spacing:0}

/* Status words. The word carries the meaning; the colour repeats it. */
.status-held{color:var(--ink-muted)}
.status-tomorrow,.status-today,.is-soon{color:var(--ok)}
.when.is-past{color:var(--ink-muted)}

/* Emblem strip. The eight event emblems in a slow horizontal drift, a
   position animation. Duplicated once so the loop has no join. */
.emblem-strip{overflow:hidden;padding:26px 0;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule)}
.emblem-strip .track{display:flex;gap:40px;width:max-content}
.emblem-strip img{width:110px;height:110px}
@media (prefers-reduced-motion:no-preference){
  .emblem-strip .track{animation:strip 48s linear infinite}
  @keyframes strip{from{transform:translateX(0)}to{transform:translateX(-50%)}}
}

/* Galleries. Hard-edged photographs on a grid, clickable to a lightbox. */
.gallery{display:grid;gap:12px;grid-template-columns:repeat(2,1fr)}
@media (min-width:720px){.gallery{grid-template-columns:repeat(3,1fr);gap:16px}}
@media (min-width:1024px){.gallery{grid-template-columns:repeat(4,1fr)}}
.gallery a{display:block;aspect-ratio:4/3;overflow:hidden;background:var(--surface-2)}
.gallery img{width:100%;height:100%;object-fit:cover}
.gallery .wide{grid-column:span 2}
.lightbox{position:fixed;inset:0;background:rgba(5,35,15,.94);z-index:200;display:flex;
  align-items:center;justify-content:center;padding:20px;cursor:zoom-out}
.lightbox[hidden]{display:none}
.lightbox img{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain}
.lightbox-close{position:absolute;top:14px;right:18px;background:none;border:0;color:var(--bg);
  font-size:40px;line-height:1;cursor:pointer}
body.has-lightbox{overflow:hidden}
.figure{margin:0}
.figure img{width:100%;height:auto}
.figure figcaption{font-size:14px;color:var(--ink-muted);margin-top:8px}

/* People. A portrait in a gold ring, name and role beneath. Gold is a fill
   here, not type, so it is allowed. */
.people{display:grid;gap:22px;grid-template-columns:repeat(2,1fr)}
@media (min-width:720px){.people{grid-template-columns:repeat(3,1fr)}}
@media (min-width:1024px){.people{grid-template-columns:repeat(4,1fr)}}
.person{text-align:left}
.person .ph{width:120px;height:120px;border-radius:50%;overflow:hidden;background:var(--surface-2);
  border:5px solid var(--accent)}
.person .ph img{width:100%;height:100%;object-fit:cover;object-position:top}
.person h3{font-size:17px;margin:12px 0 2px}
.person p{font-size:14px;color:var(--ink-muted);margin:0}
.band-green .person p,.band-deep .person p{color:rgba(244,239,226,.74)}
.band-green .person h3,.band-deep .person h3{color:var(--bg)}

/* Awards. Namesake left, recipient right, the award name across the top. */
.award{background:var(--surface);border:1px solid var(--rule);border-top:4px solid var(--accent);
  padding:22px 22px 24px}
.award .name{font-family:'Archivo Expanded','Archivo',sans-serif;font-weight:800;font-size:17px;
  line-height:1.15;color:var(--brand);margin:0 0 4px;letter-spacing:.01em;text-transform:uppercase}
html[lang="ne"] .award .name{text-transform:none;letter-spacing:0}
.award .pair{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:16px}
.award .pair figure{margin:0}
.award .pair .ph{aspect-ratio:3/4;overflow:hidden;background:var(--surface-2)}
.award .pair img{width:100%;height:100%;object-fit:cover;object-position:top}
.award .pair figcaption{font-size:13px;margin-top:8px;line-height:1.4}
.award .pair figcaption b{display:block;font-size:14px;color:var(--ink)}
.award .who{font-size:12px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-muted)}
html[lang="ne"] .award .who{letter-spacing:0;text-transform:none}

/* Partner logos on a white strip. */
.logos{display:flex;flex-wrap:wrap;gap:18px 28px;align-items:center}
.logos img{height:64px;width:auto;background:#fff}
.logos .sq{height:84px}

/* Event page: the mark band carries the event emblem, the parent name under it. */
.event-band{display:flex;gap:26px;align-items:center;flex-wrap:wrap;padding-top:34px}
.event-band .parent{font-size:12px;font-weight:700;letter-spacing:.17em;text-transform:uppercase;color:var(--ink-muted);margin:0 0 8px}
html[lang="ne"] .event-band .parent{letter-spacing:0;text-transform:none}
.event-band .np{font-family:'Mukta','Archivo',sans-serif;font-weight:700;font-size:20px;color:var(--brand);margin:6px 0 0;letter-spacing:0}

/* Fact grid on event pages. */
.kv{display:grid;gap:14px 24px;grid-template-columns:1fr;margin:0;padding:0;list-style:none}
@media (min-width:600px){.kv{grid-template-columns:repeat(3,1fr)}}
.kv li{border-top:2px solid var(--brand);padding-top:10px}
.kv .k{display:block;font-size:12px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-muted);margin-bottom:4px}
html[lang="ne"] .kv .k{letter-spacing:0;text-transform:none}
.kv .v{font-weight:700;font-size:17px}

/* Staggered reveal for grids. */
.stagger > *{transition-delay:0s}
@media (prefers-reduced-motion:no-preference){
  .stagger > .reveal:nth-child(2){transition-delay:.08s}
  .stagger > .reveal:nth-child(3){transition-delay:.16s}
  .stagger > .reveal:nth-child(4){transition-delay:.24s}
  .stagger > .reveal:nth-child(5){transition-delay:.32s}
  .stagger > .reveal:nth-child(6){transition-delay:.40s}
  .stagger > .reveal:nth-child(7){transition-delay:.48s}
  .stagger > .reveal:nth-child(8){transition-delay:.56s}
}

/* Day-relative words inherit the colour of the bar they sit in. */
.eligibility-bar .when,.action-band .when,.deadline-solid .when,.band-deep .when{color:inherit}

/* The page is one light design. Refuse browser auto-darkening (Chrome on Android, Samsung Internet). */
:root{color-scheme:light only}
/* Key facts: replaces the plain facts list. Two columns in a split, three full width. */
.kv-2{grid-template-columns:1fr 1fr}
@media (min-width:600px){.kv-2{grid-template-columns:1fr 1fr}}
.kv .v{display:block;font-weight:800;font-size:19px;line-height:1.25;color:var(--ink)}
.kv .v.big{font-family:'Archivo Expanded','Archivo',sans-serif;font-size:30px;line-height:1;color:var(--brand)}
.kv li{border-top:3px solid var(--brand);padding-top:12px}

/* 22 Sept, evening review. Emblem and organiser side by side, one line, never a stacked cramped block. */
.mark-band{display:flex;align-items:center;gap:20px;padding:34px 0 0}
.mark-band img{width:84px;height:84px;flex:0 0 auto}
.mark-band .organiser{margin:0;max-width:none;letter-spacing:.14em;line-height:1.6}
@media (max-width:599px){.mark-band{gap:14px}.mark-band img{width:64px;height:64px}.mark-band .organiser{font-size:11px}}
/* Sub-page heads: air between the organiser line and the page eyebrow. */
.mark-band + .eyebrow,.mark-band + p.eyebrow{margin-top:36px}
/* Hero: the photograph column runs from the top of the title to the foot of the buttons. */
@media (min-width:1024px){
  .hero-split{align-items:stretch}
  .hero-split .slides{aspect-ratio:auto;height:100%;min-height:480px}
}
.panel.note{border-left:0}
.footer-bar .status{white-space:normal;text-align:right}
@media (max-width:719px){.footer-bar .status{margin-left:0;text-align:left}}

/* 22 Sept, heritage under an award: the committee's text and the old council prints, shown whole. */
.award .heritage{margin-top:22px;padding-top:18px;border-top:1px solid var(--rule)}
.award .heritage p{margin:6px 0 0;font-size:15px;line-height:1.6}
.award .heritage .who{margin:0}
.award .heritage .prints{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:14px}
.award .heritage .prints figure{margin:0}
.award .heritage .prints img{width:100%;height:auto;display:block;background:var(--surface-2)}
.award .heritage .prints figcaption{font-size:12px;margin-top:6px;line-height:1.4;color:var(--ink-muted)}
@media (max-width:480px){.award .heritage .prints{grid-template-columns:1fr}}


/* Programme rows on phones: emblem on the left spanning the row; date, name,
   line and status stacked in the wide column. (Before this, the text block
   fell into the 64 px emblem column on the second grid row.) */
@media (max-width:719px){
  .programme li{grid-template-columns:56px 1fr;gap:4px 16px}
  .programme li > img{grid-row:1 / span 3;width:56px;height:56px}
  .programme li > .date,.programme li > div,.programme li > .st{grid-column:2}
  .programme li > .st{margin-top:6px}
}
