/* ============================================================
   register.sherigarba.ca v3, the light registration portal.
   Base stylesheet: the client's own white design (2026-10-08), carried onto the
   live foundation. Single white theme, marigold primary, pink and red festive
   accents. Playfair + Work Sans, Noto Sans Gujarati and Devanagari for the Indic
   labels, all self hosted (CSP font-src 'self'). The live components (sign in
   card, identity strip, netbar, toasts, install pill, Buddy, print) live in
   register-live.css, loaded after this file. verify.html and the portal keep
   app.css. See spec/V3-SPEC.md section 5.
   ============================================================ */
@font-face{font-family:"Playfair Display";font-style:normal;font-weight:400;font-display:swap;src:url("../fonts/playfair-display-latin-400-normal.woff2") format("woff2")}
@font-face{font-family:"Playfair Display";font-style:italic;font-weight:400;font-display:swap;src:url("../fonts/playfair-display-latin-400-italic.woff2") format("woff2")}
@font-face{font-family:"Playfair Display";font-style:normal;font-weight:500;font-display:swap;src:url("../fonts/playfair-display-latin-500-normal.woff2") format("woff2")}
@font-face{font-family:"Playfair Display";font-style:italic;font-weight:500;font-display:swap;src:url("../fonts/playfair-display-latin-500-italic.woff2") format("woff2")}
@font-face{font-family:"Playfair Display";font-style:normal;font-weight:600;font-display:swap;src:url("../fonts/playfair-display-latin-600-normal.woff2") format("woff2")}
@font-face{font-family:"Playfair Display";font-style:normal;font-weight:700;font-display:swap;src:url("../fonts/playfair-display-latin-700-normal.woff2") format("woff2")}
@font-face{font-family:"Work Sans";font-style:normal;font-weight:400;font-display:swap;src:url("../fonts/work-sans-latin-400-normal.woff2") format("woff2")}
@font-face{font-family:"Work Sans";font-style:normal;font-weight:500;font-display:swap;src:url("../fonts/work-sans-latin-500-normal.woff2") format("woff2")}
@font-face{font-family:"Work Sans";font-style:normal;font-weight:600;font-display:swap;src:url("../fonts/work-sans-latin-600-normal.woff2") format("woff2")}
@font-face{font-family:"Noto Sans Gujarati";font-style:normal;font-weight:400;font-display:swap;src:url("../fonts/noto-sans-gujarati-gujarati-400-normal.woff2") format("woff2");unicode-range:U+0951-0952,U+0964-0965,U+0A80-0AFF,U+200C-200D,U+20B9,U+25CC,U+A830-A839}
@font-face{font-family:"Noto Sans Gujarati";font-style:normal;font-weight:500;font-display:swap;src:url("../fonts/noto-sans-gujarati-gujarati-500-normal.woff2") format("woff2");unicode-range:U+0951-0952,U+0964-0965,U+0A80-0AFF,U+200C-200D,U+20B9,U+25CC,U+A830-A839}
@font-face{font-family:"Noto Sans Gujarati";font-style:normal;font-weight:600;font-display:swap;src:url("../fonts/noto-sans-gujarati-gujarati-600-normal.woff2") format("woff2");unicode-range:U+0951-0952,U+0964-0965,U+0A80-0AFF,U+200C-200D,U+20B9,U+25CC,U+A830-A839}
@font-face{font-family:"Noto Sans Devanagari";font-style:normal;font-weight:400;font-display:swap;src:url("../fonts/noto-sans-devanagari-devanagari-400-normal.woff2") format("woff2");unicode-range:U+0900-097F,U+1CD0-1CF9,U+200C-200D,U+20A8,U+20B9,U+20F0,U+25CC,U+A830-A839,U+A8E0-A8FF,U+11B00-11B09}
@font-face{font-family:"Noto Sans Devanagari";font-style:normal;font-weight:500;font-display:swap;src:url("../fonts/noto-sans-devanagari-devanagari-500-normal.woff2") format("woff2");unicode-range:U+0900-097F,U+1CD0-1CF9,U+200C-200D,U+20A8,U+20B9,U+20F0,U+25CC,U+A830-A839,U+A8E0-A8FF,U+11B00-11B09}


:root {
  /* brand palette (from the festival) */
  --purple-900:#160B26; --purple-800:#1E1036; --purple-700:#2B1550;
  --purple-500:#6C32A7; --purple-300:#9861CF; --purple-200:#C9ABEC;
  --saffron:#F6A93B; --gold:#E7B94B; --marigold:#F58024;
  --magenta:#D6266E; --maple:#C0392B; --jade:#2FB08A; --teal:#1F9E9E;
  --cream:#F6EAD6;

  --serif:"Playfair Display","Noto Sans Gujarati","Noto Sans Devanagari",Georgia,serif;
  --sans:"Work Sans","Noto Sans Gujarati","Noto Sans Devanagari",system-ui,-apple-system,"Segoe UI",sans-serif;
  --guj:"Noto Sans Gujarati","Noto Sans Devanagari","Nirmala UI",var(--sans);
  --code:ui-monospace,"SF Mono",Menlo,Consolas,"Liberation Mono",monospace;

  --wide:1120px;
  --gutter:clamp(16px,4vw,44px);
  --radius:20px; --radius-sm:13px; --radius-xs:9px;

  /* ---- primary (marigold) + festive accents ---- */
  --primary:#F5A623;        /* buttons, key highlights */
  --primary-hover:#FFB940;
  --on-primary:#1A0F2E;     /* text on marigold */
  --accent-pink:#E0218A;    /* icons, hover, focus rings */
  --accent-red:#C8102E;     /* small highlights, Gujarati labels on light */
  --accent-teal:#14A3A3;    /* badges, success */
  --gold-metal:#C9A227;     /* dividers, decorative lines */
  --success:#2BB673;
  --error:#FF5A5F;

  /* surfaces - single white theme */
  --bg:#FFFFFF; --bg-2:#F4F1F8;
  --panel:#FFFFFF;          /* cards, header, footer */
  --panel-2:#F5F2FA;        /* form fields */
  --line:rgba(42,23,63,.13); --line-strong:rgba(42,23,63,.22);
  --ink:#1E1230;            /* headings + body */
  --ink-2:#3C2C57;          /* secondary copy */
  --ink-3:#5A4C73;          /* muted helper text, >=7:1 on white (AA) */
  --ink-subtle:#7A6E92;     /* placeholders only */
  --accent:#9A4E12;         /* marigold, dark enough to read on white */
  --accent-ink:#FFFFFF;
  --focus:var(--accent-pink);
  --label-accent:var(--accent-red);   /* Gujarati labels, red on white */
  --hero-overlay:linear-gradient(90deg,rgba(22,11,38,.88) 0%,rgba(22,11,38,.62) 50%,rgba(22,11,38,.5) 100%);
  --shadow:0 16px 40px -26px rgba(42,23,63,.3);

  /* text on the dark grounds (hero, page hero, OSF band, toast), named so the
     live contrast sweep can measure them against the ground they land on */
  --on-dark:#FFF6E5; --on-dark-2:rgba(255,246,229,.84); --on-dark-3:rgba(255,246,229,.72);
  --dark-ground:#2B1550;
}
/* the three state machine on the register page relies on the attribute, not on a
   class, so it must beat any display rule either stylesheet adds */
[hidden]{display:none !important}

*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--bg);color:var(--ink);
  font-family:var(--sans);font-size:16px;line-height:1.6;
  -webkit-font-smoothing:antialiased;overflow-x:clip;
}
img{max-width:100%;display:block}
a{color:inherit}
.guj{font-family:var(--guj)}
.kicker{font-family:var(--sans);font-weight:600;letter-spacing:.18em;text-transform:uppercase;font-size:.78rem;color:var(--accent)}
.kicker.guj{color:var(--label-accent);font-weight:700;font-size:.9rem;letter-spacing:.06em}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.skip{position:absolute;left:-999px;top:0;background:var(--accent);color:var(--accent-ink);padding:10px 16px;border-radius:0 0 10px 0;z-index:200}
.skip:focus{left:0}
:focus-visible{outline:3px solid var(--focus);outline-offset:2px;border-radius:6px}

.wrap{max-width:var(--wide);margin:0 auto;padding-inline:var(--gutter)}

/* ---------- header ---------- */
.site-header{position:sticky;top:0;z-index:100;background:color-mix(in srgb,var(--bg) 86%,transparent);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.nav{display:flex;align-items:center;justify-content:space-between;gap:18px;min-height:64px}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--ink)}
.brand .mark{width:38px;height:38px;border-radius:50%;flex:none;background:#fff center/72% no-repeat url("../img/osf/logo-112.webp");border:1px solid var(--line-strong)}
.brand .bn{font-family:var(--serif);font-weight:700;font-size:1.08rem;line-height:1.1;display:block}
.brand .bs{font-size:.66rem;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-3)}
.nav-links{display:flex;align-items:center;gap:6px;list-style:none;margin:0;padding:0}
.nav-links a{text-decoration:none;color:var(--ink-2);font-weight:500;font-size:.92rem;padding:8px 12px;border-radius:999px}
.nav-links a:hover{color:var(--accent-pink);background:var(--panel)}
.nav-links a[aria-current]{color:var(--ink);background:var(--panel)}
.nav-tools{display:flex;align-items:center;gap:8px}
.icon-btn{width:40px;height:40px;border-radius:50%;border:1px solid var(--line-strong);background:var(--panel);color:var(--ink);cursor:pointer;display:grid;place-items:center;font-size:1rem}
.icon-btn:hover{border-color:var(--accent-pink);color:var(--accent-pink)}
.menu-btn{display:none}
@media (max-width:860px){
  /* dropdown anchored right below the header; reliably hidden when closed */
  .nav-links{position:absolute;top:100%;left:0;right:0;flex-direction:column;align-items:stretch;gap:2px;background:var(--bg-2);border-bottom:1px solid var(--line);padding:10px var(--gutter) 18px;box-shadow:var(--shadow);opacity:0;visibility:hidden;transform:translateY(-8px);transition:opacity .2s ease,transform .2s ease,visibility .2s;pointer-events:none}
  .nav-links.open{opacity:1;visibility:visible;transform:none;pointer-events:auto}
  .nav-links a{padding:12px 10px;font-size:1rem}
  .menu-btn{display:grid}
}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;font-family:var(--sans);font-weight:600;font-size:1rem;padding:13px 22px;border-radius:999px;border:1px solid transparent;cursor:pointer;text-decoration:none;transition:transform .08s ease,filter .15s ease}
.btn:active{transform:translateY(1px)}
.btn-gold{background:linear-gradient(180deg,var(--primary-hover),var(--primary));color:var(--on-primary);box-shadow:0 10px 24px -12px rgba(245,166,35,.7)}
.btn-gold:hover{filter:brightness(1.05)}
.btn-ghost{background:transparent;border-color:var(--line-strong);color:var(--ink)}
.btn-ghost:hover{border-color:var(--accent-pink);color:var(--accent-pink)}
.btn-soft{background:var(--panel);border-color:var(--line);color:var(--ink)}
.btn-soft:hover{border-color:var(--accent-pink);color:var(--accent-pink)}
.btn-block{width:100%}
.btn[disabled]{opacity:.55;cursor:not-allowed}

/* ---------- hero (slim) ---------- */
.hero{position:relative;overflow:hidden;border-bottom:1px solid var(--line)}
.hero .photo{position:absolute;inset:0;z-index:0}
.hero .photo img{width:100%;height:100%;object-fit:cover;filter:saturate(1.08) contrast(1.04)}
.hero .scrim{position:absolute;inset:0;z-index:1;background:var(--hero-overlay)}
/* on narrow screens the text sits over more of the photo, so add a soft vertical wash */
@media (max-width:640px){.hero .scrim{background:linear-gradient(90deg,rgba(22,11,38,.9),rgba(22,11,38,.72))}}
.hero .wrap{position:relative;z-index:2;padding-top:clamp(40px,7vw,78px);padding-bottom:clamp(40px,7vw,78px)}
.hero-inner{max-width:620px}
.hero .presents{display:flex;align-items:center;gap:12px;margin-bottom:22px}
.hero .presents img{width:40px;height:40px;border-radius:50%;background:#fff;padding:3px}
.hero .presents b{display:block;font-size:.8rem;letter-spacing:.04em;color:#FFF6E5}
.hero .presents span{font-size:.68rem;letter-spacing:.18em;text-transform:uppercase;color:rgba(255,246,229,.6)}
.hero .place{font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,246,229,.8);margin:0 0 14px}
.hero .place .guj{color:var(--accent-pink);letter-spacing:0;font-size:1.2rem;font-weight:700;margin-right:6px}
.hero h1{font-family:var(--serif);font-weight:700;font-size:clamp(2.3rem,6.4vw,4rem);line-height:1.02;margin:0 0 6px;letter-spacing:-.01em;color:#FFF6E5}
.hero h1 em{color:var(--primary);font-style:italic}
.hero .sub{font-family:var(--serif);font-style:italic;font-size:clamp(1.1rem,2.6vw,1.5rem);color:rgba(255,246,229,.84);margin:0 0 20px}
.hero p.lede{font-size:1.06rem;color:rgba(255,246,229,.84);max-width:30em;margin:0 0 10px}
.hero .cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:26px}
.hero .btn-ghost{border-color:rgba(255,255,255,.42);color:#FFF6E5}
.hero .btn-ghost:hover{border-color:var(--accent-pink);color:var(--accent-pink)}
.hero .facts{display:flex;flex-wrap:wrap;gap:8px 10px;margin-top:26px}
.hero .facts span{display:inline-flex;align-items:center;gap:7px;background:#2B1550;border:1px solid rgba(246,234,214,.25);border-radius:999px;padding:8px 15px;font-size:.86rem;font-weight:600;color:#FFF6E5;box-shadow:0 4px 14px -6px rgba(0,0,0,.5)}
.hero .facts b{color:var(--saffron)}

/* ---------- sections ---------- */
section{padding-block:clamp(44px,6vw,80px)}
.sec-head{max-width:40em;margin-bottom:32px}
.sec-head h2{font-family:var(--serif);font-weight:700;font-size:clamp(1.7rem,4vw,2.5rem);line-height:1.08;margin:.4rem 0 .5rem}
.sec-head .guj{color:var(--label-accent);font-weight:700;font-size:1.25rem;display:block;margin-bottom:2px}
.sec-head p{color:var(--ink-2);margin:0;font-size:1.04rem}
.panel{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}

/* ---------- register layout ---------- */
.register-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:28px;align-items:start}
@media (max-width:900px){.register-grid{grid-template-columns:1fr}}

.form-card{padding:clamp(20px,3vw,32px)}
.form-card h3{font-family:var(--serif);font-size:1.5rem;margin:0 0 4px}
.form-card .hint{color:var(--ink-3);font-size:.92rem;margin:0 0 22px}
.field{margin-bottom:16px}
.field label{display:block;font-weight:600;font-size:.875rem;margin-bottom:6px;color:var(--ink)}
.field .opt{color:var(--ink-3);font-weight:400}
.field input,.field select{
  width:100%;background:var(--panel-2);border:1px solid var(--line-strong);color:var(--ink);
  font:inherit;padding:12px 14px;border-radius:var(--radius-xs);
}
.field input::placeholder{color:var(--ink-subtle)}
.field input:focus,.field select:focus{border-color:var(--accent-pink);outline:none;box-shadow:0 0 0 3px color-mix(in srgb,var(--accent-pink) 35%,transparent)}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.attendee-list{display:grid;gap:10px;margin-top:2px}
@media (max-width:460px){.field-row{grid-template-columns:1fr}}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.form-note{font-size:.82rem;color:var(--ink-3);margin:6px 0 20px;line-height:1.5}
.form-err{color:var(--accent-red);font-weight:600;font-size:.86rem;margin:-8px 0 12px;min-height:1.1em}

/* why-panel beside the form */
.why{padding:clamp(20px,3vw,30px);background:var(--panel-2)}
.why h3{font-family:var(--serif);font-size:1.3rem;margin:0 0 14px}
.why ul{list-style:none;margin:0;padding:0;display:grid;gap:14px}
.why li{display:flex;gap:12px;align-items:flex-start;color:var(--ink-2);font-size:.96rem}
.why li .ic{flex:none;width:30px;height:30px;border-radius:9px;display:grid;place-items:center;background:color-mix(in srgb,var(--accent-pink) 22%,transparent);color:var(--accent-pink);font-size:1rem}
.why .demo{margin-top:20px;padding:12px 14px;border:1px dashed var(--line-strong);border-radius:var(--radius-xs);font-size:.82rem;color:var(--ink-3)}

/* ---------- pass card ---------- */
#passOut{margin-top:28px}
#passOut:empty{display:none}
.passgrid{display:grid;grid-template-columns:286px 1fr;gap:28px;align-items:start}
@media (max-width:640px){.passgrid{grid-template-columns:1fr;justify-items:center}}
.passcard{background:#FFFFFF;color:#26163F;border:1px solid #E6DCC8;border-radius:18px;padding:14px 18px 16px;width:286px;max-width:100%;box-shadow:0 22px 46px -24px rgba(0,0,0,.6);overflow:hidden}
.toran{height:15px;width:100%;border-radius:4px;background-repeat:repeat-x;background-size:64px 15px;
  background-image:url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='64'%20height='15'%3E%3Cpath%20d='M1%200h13l-6.5%2014z'%20fill='%23D94A3D'/%3E%3Cpath%20d='M17%200h13l-6.5%2014z'%20fill='%23F1892E'/%3E%3Cpath%20d='M33%200h13l-6.5%2014z'%20fill='%232FB08A'/%3E%3Cpath%20d='M49%200h13l-6.5%2014z'%20fill='%23E7B94B'/%3E%3C/svg%3E")}
/* toran pennant strip used as a full-width divider between sections */
.toran-divider{height:16px;width:100%;background-repeat:repeat-x;background-position:top center;background-size:68px 16px;
  background-image:url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='64'%20height='15'%3E%3Cpath%20d='M1%200h13l-6.5%2014z'%20fill='%23D94A3D'/%3E%3Cpath%20d='M17%200h13l-6.5%2014z'%20fill='%23F1892E'/%3E%3Cpath%20d='M33%200h13l-6.5%2014z'%20fill='%232FB08A'/%3E%3Cpath%20d='M49%200h13l-6.5%2014z'%20fill='%23E7B94B'/%3E%3C/svg%3E")}
.passcard .ph{display:flex;align-items:center;gap:11px;margin:13px 0 12px}
.passcard .ph img{width:40px;height:44px;object-fit:contain;flex:none}
.passcard .ph strong{font-family:var(--serif);font-size:1.02rem;display:block;line-height:1.2;color:#26163F}
.passcard .ph span{font-size:.72rem;color:#6B5E80}
.qrbox{background:#fff;border:1px solid #E6DCC8;border-radius:12px;padding:10px}
.qrbox svg,.qrbox img{display:block;width:100%;height:auto}
.pcode{font-family:var(--code);font-size:.82rem;letter-spacing:.05em;text-align:center;margin:11px 0 7px;color:#26163F;font-weight:700;word-break:break-all}
.pline{text-align:center;font-size:.9rem;color:#26163F;margin:3px 0;line-height:1.35}
.pline strong{font-weight:700}
.pline.code{font-family:var(--code);font-size:.78rem;color:#6B5E80}
.pfoot{font-family:var(--code);font-size:.56rem;letter-spacing:.07em;text-align:center;color:#6B5E80;margin-top:11px;border-top:1px dashed #E6DCC8;padding-top:9px;line-height:1.7}

.passnote{align-self:center}
.passnote h4{font-family:var(--serif);font-size:1.25rem;margin:0 0 8px}
.passnote p{color:var(--ink-2);margin:0 0 12px;font-size:.96rem}
.passnote .pass-actions{display:flex;flex-wrap:wrap;gap:10px;margin:18px 0 10px}
.passnote .saved-tag{display:inline-flex;align-items:center;gap:7px;color:var(--success);font-size:.9rem;font-weight:600}

/* ---------- my passes ---------- */
.pass-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:14px}
.pass-chip{display:flex;gap:12px;align-items:center;text-align:left;width:100%;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius-sm);padding:14px 16px;cursor:pointer;color:var(--ink);font:inherit}
.pass-chip:hover{border-color:var(--accent-pink)}
.pass-chip .qs{flex:none;width:44px;height:44px;border-radius:9px;background:#fff;padding:4px}
.pass-chip .qs svg,.pass-chip .qs img{width:100%;height:100%;display:block}
.pass-chip b{display:block;font-family:var(--code);font-size:.84rem}
.pass-chip span{font-size:.82rem;color:var(--ink-3)}
.empty{color:var(--ink-3);font-size:.96rem;border:1px dashed var(--line-strong);border-radius:var(--radius-sm);padding:20px;text-align:center}

.find-form{display:grid;grid-template-columns:1fr 1fr auto;gap:12px;align-items:end;margin-top:18px}
@media (max-width:640px){.find-form{grid-template-columns:1fr}}

/* ---------- nights table ---------- */
.nights-table{width:100%;border-collapse:collapse;font-size:.94rem;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
.nights-table th,.nights-table td{padding:13px 14px;text-align:left;border-bottom:1px solid var(--line)}
.nights-table thead th{font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3);background:var(--panel-2)}
.nights-table tbody tr:last-child td{border-bottom:none}
.nights-table tbody tr:hover{background:var(--panel-2)}
.nights-table .nnum{font-family:var(--serif);font-size:1.1rem;color:var(--accent)}
.nights-table .nname{font-weight:600}
.nights-table .nlabel{display:block;font-size:.76rem;color:var(--ink-3)}
.swatch{display:inline-flex;align-items:center;gap:8px}
.swatch i{width:16px;height:16px;border-radius:50%;border:1px solid rgba(0,0,0,.25);flex:none}
.nav-badge{display:inline-block;margin-left:6px;font-size:.66rem;color:var(--ink-3)}
.table-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}
@media (max-width:700px){.nights-table{font-size:.86rem}.nights-table .hide-sm{display:none}}

/* colour-dots strip */
.colour-strip{display:flex;flex-wrap:wrap;gap:10px;margin-top:26px}
.colour-strip .cdot{display:flex;flex-direction:column;align-items:center;gap:6px;width:66px}
.colour-strip .cdot i{width:30px;height:30px;border-radius:50%;border:2px solid var(--line-strong)}
.colour-strip .cdot span{font-size:.68rem;color:var(--ink-3);text-align:center;line-height:1.2}

/* ---------- info grids (venue / parking) ---------- */
.info-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px}
.info-card{padding:20px}
.info-card .k{font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--accent);margin-bottom:6px}
.info-card .v{font-size:1.04rem;color:var(--ink)}
.bring-list{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.bring-list li{display:flex;gap:11px;align-items:flex-start;color:var(--ink-2)}
.bring-list li::before{content:"\2713";color:var(--accent-teal);font-weight:700}
.lot-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px;margin-top:8px}
.lot{padding:20px}
.lot .type{font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;color:var(--accent-ink);background:var(--accent);display:inline-block;padding:3px 10px;border-radius:999px;margin-bottom:12px}
.lot .type.permit{background:var(--accent-red);color:#fff}
.lot .type.accessible{background:var(--accent-teal);color:#042322}
.lot h3{font-family:var(--serif);font-size:1.2rem;margin:0 0 6px}
.lot .cap{font-size:1.5rem;font-family:var(--serif);color:var(--ink)}
.lot .cap span{font-size:.8rem;color:var(--ink-3);font-family:var(--sans)}
.lot p{color:var(--ink-2);font-size:.9rem;margin:8px 0 0}

/* ---------- poster / partners ---------- */
.poster-wrap{max-width:680px;margin:0 auto}
.poster-wrap img{width:100%;border-radius:var(--radius);box-shadow:var(--shadow);border:1px solid var(--line)}
.partners{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:34px;margin-top:10px}
.partners figure{margin:0;text-align:center}
.partners img{height:66px;width:auto;object-fit:contain;margin:0 auto 8px;filter:drop-shadow(0 6px 14px rgba(0,0,0,.3))}
.partners figcaption{font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3)}

/* ---------- page hero (inner pages) ---------- */
.page-hero{position:relative;overflow:hidden;border-bottom:1px solid rgba(255,255,255,.08);background:#160B26}
.page-hero .wrap{position:relative;z-index:2;padding-block:clamp(28px,3.8vw,48px)}
/* the dandiya photo full-width, darkened so light text reads over it */
.page-hero::before{content:"";position:absolute;inset:0;z-index:0;background:url("../img/osf/hero-dandiya.webp") center/cover no-repeat}
.page-hero::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(22,11,38,.86) 0%,rgba(22,11,38,.6) 50%,rgba(22,11,38,.48) 100%)}
.page-hero .crumbs{color:rgba(255,246,229,.72)}
.page-hero .crumbs a{color:rgba(255,246,229,.9)}
.page-hero .crumbs a:hover{color:var(--accent-pink)}
.page-hero .guj{color:var(--accent-pink);font-weight:700;font-size:1.3rem;display:inline-block}
.page-hero h1{font-family:var(--serif);font-weight:700;font-size:clamp(1.9rem,4.4vw,2.7rem);line-height:1.04;margin:.3rem 0 .4rem;max-width:640px;color:#FFF6E5}
.page-hero p{color:rgba(255,246,229,.86);max-width:min(560px,100%);margin:0;font-size:1.04rem}
@media (max-width:640px){
  .page-hero::after{background:linear-gradient(90deg,rgba(22,11,38,.9),rgba(22,11,38,.72))}
  .page-hero h1{max-width:none}
}
.crumbs{font-size:.82rem;color:var(--ink-3)}
.crumbs a{color:var(--ink-2);text-decoration:none}
.crumbs a:hover{color:var(--accent-pink)}

/* ---------- legal / policy page ---------- */
.legal{max-width:800px;margin:0 auto}
.legal .meta-card{background:var(--panel-2);border:1px solid var(--line);border-radius:var(--radius-sm);padding:18px 22px;margin-bottom:30px;font-size:.95rem;color:var(--ink-2)}
.legal .meta-card div{margin:4px 0}
.legal .meta-card strong{color:var(--ink)}
.legal h2{font-family:var(--serif);font-size:1.4rem;margin:36px 0 10px;color:var(--ink);scroll-margin-top:84px}
.legal p{margin:0 0 12px;color:var(--ink-2);font-size:1rem}
.legal ul{margin:0 0 14px;padding-left:22px;color:var(--ink-2)}
.legal li{margin:6px 0;font-size:1rem}
.legal .clause{line-height:1.8}
.legal a{color:var(--accent);text-decoration:underline}
.legal a:hover{color:var(--accent-pink)}
.legal table{width:100%;border-collapse:collapse;margin:10px 0 18px;font-size:.92rem}
.legal th,.legal td{border:1px solid var(--line);padding:10px 12px;text-align:left;color:var(--ink-2);vertical-align:top}
.legal th{background:var(--panel-2);color:var(--ink);font-size:.74rem;text-transform:uppercase;letter-spacing:.04em;font-weight:700}
.legal .ph{background:#FFF0CC;color:#7A5200;padding:1px 6px;border-radius:4px;font-weight:600}

/* registration consent row */
.consent{display:flex;gap:10px;align-items:flex-start;font-size:.9rem;color:var(--ink-2);margin:4px 0 18px;line-height:1.5}
.consent input{flex:none;width:18px;height:18px;margin-top:2px;accent-color:var(--accent-pink)}
.consent a{color:var(--accent);text-decoration:underline}
.consent a:hover{color:var(--accent-pink)}

/* ---------- footer ---------- */
.site-footer{border-top:1px solid var(--line);background:var(--bg-2);padding-block:40px;margin-top:20px}
.footer-grid{display:flex;flex-wrap:wrap;justify-content:space-between;gap:24px}
.footer-grid nav{display:flex;flex-wrap:wrap;gap:8px 20px}
.footer-grid a{color:var(--ink-2);text-decoration:none;font-size:.92rem}
.footer-grid a:hover{color:var(--accent-pink)}
.site-footer .meta{color:var(--ink-3);font-size:.82rem;margin-top:22px;line-height:1.7}
.site-footer .meta a{color:var(--accent);text-decoration:none}

/* ---------- toast ---------- */
#toast{position:fixed;left:50%;bottom:26px;transform:translateX(-50%) translateY(140%);background:#120826;color:#FFF6E5;border:1px solid var(--accent-pink);padding:13px 20px;border-radius:999px;box-shadow:var(--shadow);z-index:300;transition:transform .3s cubic-bezier(.2,.8,.2,1);font-size:.95rem;max-width:90vw}
#toast.show{transform:translateX(-50%) translateY(0)}

/* print: only the pass card, as a fallback to the PDF button */
@media print{
  body *{visibility:hidden}
  .passcard,.passcard *{visibility:visible}
  .passcard{position:absolute;left:50%;top:24px;transform:translateX(-50%);box-shadow:none}
}
@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}

/* v3 additions */
/* The mode gating register-live.css carries, repeated here so this sheet holds both
   guards of the sign in state machine on its own. If register-live.css fails to load on
   the live site, the demo note and the "Continue as a demo visitor" form must still stay
   hidden beside the real Google button. Duplicate rules are harmless. */
:root:not([data-sg-mode]) [data-demo-only],
:root:not([data-sg-mode]) [data-live-only]{display:none}
:root[data-sg-mode="live"] [data-demo-only]{display:none}
:root[data-sg-mode="demo"] [data-live-only]{display:none}

/* Playfair Display italic 600, the weight the client's prototype loads (ital 1,600) for the
   hero subtitle and the gold em of the h1. Without it both fell to the 500 italic, the em
   with a synthesised bold. Same @fontsource/playfair-display 5.3.0 latin subset as the
   other Playfair files in assets/fonts. */
@font-face{font-family:"Playfair Display";font-style:italic;font-weight:600;font-display:swap;src:url("../fonts/playfair-display-latin-600-italic.woff2") format("woff2")}

/* v3.1.0 fix round (B #4, #5). A grid track of 1fr has an auto minimum, which is the
   min-content of the panel inside it, and the signed in email strip (.whoami .em,
   white-space:nowrap) makes that min-content the full width of the address: with a 35
   character Gmail address the one column grid grew past a 320 or 360 px screen and the whole
   form, the party buttons and the pass card panned sideways; at 200 percent text the same at
   360. minmax(0,1fr) lets the track shrink to the container and the email ellipsises inside
   the strip as register-live.css intends. Same rules as the register layout above, repeated
   here under the append only banner so they win the cascade. */
.register-grid{grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr)}
@media (max-width:900px){.register-grid{grid-template-columns:minmax(0,1fr)}}