/* Spectra: search guide pages (things to do, immersive museum, birthdays, school trips, team outings, date ideas).
   Reads css/site.css for tokens, header, focus ring and .cta. One museum-world device per page, no card grids:
   hours line, gallery wall labels, RSVP slip, class register, agenda sheet, admit-two stub. Static, no JS. */

:root{--gp:calc(var(--gut) + var(--sal));--gpr:calc(var(--gut) + var(--sar))}
html{-webkit-text-size-adjust:100%}
body{overflow-x:clip}
#main{padding-top:calc(var(--head) + var(--sat) + 8px);outline:none}
.g-wrap{max-width:var(--wrap);margin:0 auto;padding-left:var(--gp);padding-right:var(--gpr)}

/* breadcrumb, quiet */
.g-crumb{max-width:var(--wrap);margin:0 auto;padding:6px var(--gpr) 0 var(--gp);font-size:14px;color:var(--dim)}
.g-crumb a{display:inline-flex;align-items:center;min-height:44px;color:var(--soft);text-decoration:none}   /* 44px tap (council 2026-11-08 E29) */
.g-crumb a:hover{color:var(--ink);text-decoration:underline}
.g-crumb span[aria-current]{color:var(--soft)}

/* hero: text left, one photo offset right */
.g-hero{max-width:var(--wrap);margin:0 auto;padding:clamp(28px,6vh,64px) var(--gpr) clamp(48px,8vh,88px) var(--gp);
  display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,.8fr);gap:clamp(28px,5vw,72px);align-items:start}
.g-hero h1{margin:0;font-family:var(--sans);font-weight:300;font-size:var(--fs-1);line-height:1.04;letter-spacing:-.015em;color:var(--ink);text-wrap:balance}
.g-lede{margin:clamp(20px,3vh,32px) 0 0;max-width:46ch;font-size:clamp(19px,1.8vw,23px);font-weight:300;line-height:1.42;color:var(--soft)}
.g-hero-f{margin:0;margin-top:clamp(0px,4vw,56px)}
.g-hero-f img{display:block;width:100%;height:auto;aspect-ratio:4/5;object-fit:cover}
.g-act{margin:clamp(28px,4.4vh,40px) 0 clamp(12px,2vh,20px);display:flex;flex-wrap:wrap;gap:12px 28px;align-items:center}   /* council 2026-11-08 D24: room under the CTA row */
.g-alt{display:inline-flex;align-items:center;min-height:44px;color:var(--ink);font-size:17px;text-decoration:underline;text-decoration-color:rgba(252,252,252,.45);text-underline-offset:4px}
@media (hover:hover){.g-alt:hover{text-decoration-color:currentColor}}

/* sections: hairlines and whitespace */
.g-sec{border-top:1px solid var(--line);padding:var(--sec-y) 0}
.g-split{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.5fr);gap:clamp(20px,4vw,72px);align-items:start}
.g-split-photo{grid-template-columns:minmax(0,.8fr) minmax(0,1.3fr)}
.g-h2{margin:0 0 clamp(14px,2vh,22px);font-family:var(--sans);font-weight:300;font-size:var(--fs-3);line-height:1.12;letter-spacing:-.01em;color:var(--ink)}
.g-split>.g-h2{margin:0}
.g-h2-after{margin-top:clamp(32px,5vh,56px)}
.g-p{margin:0 0 18px;max-width:36em;font-size:18px;line-height:1.55;color:var(--soft)}
.g-p b{font-weight:600;color:var(--ink)}
.g-p a,.g-rt a,.g-faq a{color:var(--ink);text-decoration:underline;text-decoration-color:rgba(252,252,252,.45);text-underline-offset:3px}
@media (hover:hover){.g-p a:hover,.g-rt a:hover,.g-faq a:hover{text-decoration-color:currentColor}}
.g-fig{margin:0}
.g-fig img{display:block;width:100%;height:auto;aspect-ratio:4/5;object-fit:cover}
.g-split-photo .g-fig{max-width:380px}
.g-quote{font-size:clamp(20px,2.2vw,28px);font-weight:300;line-height:1.3;max-width:34ch;color:var(--soft)}

/* the one loud moment: Druk Wide stand-in, silver */
.g-big{margin:0 0 clamp(18px,3vh,30px);font-family:var(--serif);font-stretch:var(--wide);font-weight:800;text-transform:uppercase;line-height:.95;letter-spacing:.005em;
  font-size:clamp(34px,8.2vw,112px);color:var(--ink);overflow-wrap:anywhere;
  background:var(--silver-type);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.g-big[data-word]{font-size:clamp(27px,6.6vw,92px);overflow-wrap:normal}

/* --- device: hours line (things to do) --- */
.g-hours{position:relative;height:84px;margin:6px 0 28px;max-width:620px}
.g-hline{position:absolute;left:0;right:0;top:42px;height:1px;background:var(--soft)}
.g-htick{position:absolute;top:-6px;width:1px;height:13px;background:var(--soft)}
.g-htick-on{top:-9px;height:19px;width:2px;background:var(--ink)}
.g-hl{position:absolute;font-size:14px;color:var(--soft);white-space:nowrap}
.g-hl-o{left:0;top:56px}
.g-hl-c{right:0;top:56px}
.g-hl-a{right:0;top:12px;color:var(--ink)}

/* --- rows: who is coming (things to do) --- */
.g-rows{list-style:none;margin:0;padding:0;border-bottom:1px solid var(--line)}
.g-rows li{display:grid;grid-template-columns:minmax(120px,.5fr) minmax(0,1.5fr);gap:8px 28px;align-items:baseline;padding:20px 0;border-top:1px solid var(--line)}
.g-rl{font-family:var(--mono);font-stretch:62%;font-weight:700;font-size:17px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink)}
.g-rt{font-size:17px;line-height:1.5;color:var(--soft);max-width:54ch}

/* --- device: gallery wall labels (immersive museum) --- */
.g-wall{display:grid;grid-template-columns:1fr 1fr;gap:clamp(20px,4vw,64px);margin-top:clamp(24px,4vh,40px)}
.g-wcol{display:flex;flex-direction:column;gap:clamp(36px,6vw,72px)}
.g-wcol-b{padding-top:clamp(40px,9vw,120px)}
.g-wf{margin:0}
.g-wf img{display:block;width:100%;height:auto;aspect-ratio:4/5;object-fit:cover}
.g-wf:nth-child(2) img{aspect-ratio:1/1}
.g-wf:nth-child(3) img{aspect-ratio:5/6}
.g-label{display:block;margin-top:12px;padding:10px 12px 12px;border:1px solid var(--line);max-width:30ch;font-size:14px;line-height:1.4;color:var(--soft)}
.g-label b{display:block;margin-bottom:3px;font-family:var(--mono);font-stretch:62%;font-weight:700;font-size:15px;letter-spacing:.07em;text-transform:uppercase;color:var(--ink)}
.g-label span{display:block}

/* --- device: RSVP slip (birthdays) --- */
.g-slip{position:relative;max-width:520px;margin:6px 0 24px;padding:6px 0 6px 28px;border:1px solid var(--line);border-left:0}
.g-slip::before{content:"";position:absolute;left:10px;top:0;bottom:0;border-left:2px dotted var(--soft);opacity:.6}
.g-sl{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 16px;margin:0;padding:12px 16px 12px 0;border-bottom:1px dashed var(--line);font-size:17px}
.g-sl:last-child{border-bottom:0}
.g-sl span{min-width:9.5em;font-family:var(--mono);font-stretch:62%;font-weight:700;font-size:14px;letter-spacing:.07em;text-transform:uppercase;color:var(--ink)}
.g-sl em{font-style:normal;color:var(--soft);border-bottom:1px solid var(--dim);padding-bottom:1px}

/* --- device: class register (school trips) --- */
.g-reg{margin-top:clamp(20px,3vh,32px);border-top:2px solid var(--ink)}
.g-rg-head{display:grid;grid-template-columns:minmax(110px,.45fr) minmax(0,1.6fr) 72px;gap:12px 24px;margin:0;padding:10px 0;border-bottom:1px solid var(--line);
  font-family:var(--mono);font-stretch:62%;font-weight:700;font-size:13px;letter-spacing:.07em;text-transform:uppercase;color:var(--dim)}
.g-reg ul{list-style:none;margin:0;padding:0}
.g-reg li{display:grid;grid-template-columns:minmax(110px,.45fr) minmax(0,1.6fr) 72px;gap:6px 24px;align-items:center;padding:16px 0;border-bottom:1px solid var(--line)}
.g-rg-n{font-family:var(--mono);font-stretch:62%;font-weight:700;font-size:20px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink)}
.g-rg-d{font-size:17px;line-height:1.45;color:var(--soft);max-width:54ch}
.g-rg-d strong{color:var(--ink);font-weight:600}
.g-tick{position:relative;justify-self:center;width:26px;height:26px;border:1px solid var(--dim)}
.g-tick::after{content:"";position:absolute;left:8px;top:2px;width:8px;height:15px;border:solid var(--ink);border-width:0 2px 2px 0;transform:rotate(40deg)}

/* --- device: agenda sheet (team outings) --- */
.g-agenda{max-width:640px}
.g-agenda dl{margin:0;border-top:2px solid var(--ink)}
.g-agenda dl>div{display:grid;grid-template-columns:minmax(100px,.4fr) minmax(0,1.6fr);gap:4px 20px;padding:15px 0;border-bottom:1px solid var(--line)}
.g-agenda dt{font-family:var(--mono);font-stretch:62%;font-weight:700;font-size:18px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink)}
.g-agenda dd{margin:0;font-size:17px;line-height:1.45;color:var(--soft)}
.g-agenda .g-ag-end{border-bottom:2px solid var(--ink)}
.g-agenda .g-ag-end dd{color:var(--ink);font-weight:600}
.g-ag-note{margin:14px 0 0;font-size:14px;color:var(--dim);max-width:52ch}
.g-agenda+.g-ag-note{margin-top:14px}

/* --- device: admit-two stub (date ideas) --- */
.g-stub{position:relative;display:flex;max-width:760px;overflow:hidden;background:var(--raise);border:1px solid var(--line)}
.g-stub-main{flex:1;padding:clamp(22px,4vw,40px) clamp(20px,4vw,40px)}
.g-stub-main .g-big{margin:8px 0 14px;font-size:clamp(34px,7vw,84px)}
.g-stub-k{margin:0;font-family:var(--mono);font-stretch:62%;font-weight:700;font-size:14px;letter-spacing:.07em;text-transform:uppercase;color:var(--soft)}
.g-stub-s{margin:0;font-size:17px;color:var(--soft)}
.g-stub-tear{position:relative;flex:0 0 clamp(70px,12vw,120px);display:flex;align-items:center;justify-content:center;border-left:2px dashed var(--dim)}
.g-stub-tear span{writing-mode:vertical-rl;transform:rotate(180deg);font-family:var(--mono);font-stretch:62%;font-weight:700;font-size:15px;letter-spacing:.12em;text-transform:uppercase;color:var(--soft)}
.g-stub::before,.g-stub::after,.g-stub-tear::before,.g-stub-tear::after{content:"";position:absolute;width:20px;height:20px;border-radius:50%;background:var(--ground);border:1px solid var(--line)}
.g-stub-tear::before{left:-11px;top:-11px}
.g-stub-tear::after{left:-11px;bottom:-11px}
.g-stub::before,.g-stub::after{display:none}

/* FAQ: plain, always open */
.g-qs{max-width:66ch}
.g-q{padding:20px 0;border-top:1px solid var(--line)}
.g-q:first-child{border-top:0;padding-top:0}
.g-q h3{margin:0 0 8px;font-family:var(--sans);font-weight:400;font-size:clamp(19px,1.8vw,23px);line-height:1.25;color:var(--ink)}
.g-q p{margin:0;font-size:17px;line-height:1.55;color:var(--soft)}
.g-more .g-p{margin:0}
.g-book{min-height:56px}

@media (max-width:860px){
  .g-hero{grid-template-columns:1fr;padding-bottom:40px}
  .g-hero-f{max-width:340px;margin-top:8px}
  .g-split,.g-split-photo{grid-template-columns:1fr;gap:20px}
  .g-split-photo .g-fig{max-width:300px}
  .g-rows li{grid-template-columns:1fr;gap:4px}
  .g-rg-head,.g-reg li{grid-template-columns:minmax(92px,.5fr) minmax(0,1.5fr) 44px;gap:6px 14px}
  .g-rg-n{font-size:17px}
  .g-tick{width:22px;height:22px}.g-tick::after{left:6px;top:1px;width:7px;height:13px}
  .g-agenda dl>div{grid-template-columns:1fr}
  .g-wall{grid-template-columns:1fr 1fr;gap:14px}
  .g-label{padding:8px 9px 10px;font-size:15px}   /* council 2026-11-08 E30: was 13px */
  .g-label b{font-size:15px}
  .g-act .cta{width:auto}
}
@media (max-width:480px){
  .g-act .cta{width:100%}
  .g-sl span{min-width:100%}
  .g-stub-tear{flex-basis:56px}
}