/* ==========================================================================
   OAK TREE — RELAUNCH, glass seams. Loads AFTER relaunch.css.
   One device carries the whole branch: a plate of opaque glass laid ACROSS
   the seam between two pictures. It dips into the bottom of the picture
   above and the top of the one below, and a text-width feathered spacer
   hangs beneath it, so the plate IS the transition. Same frosted recipe as
   the rules cards on the range photographs.
     .bsec    homepage banners (click to expand)
     .gplate  any other panel that sits on a seam (range spec panels, the
              standing week on the events page)
   ========================================================================== */
:root{--seam:clamp(40px,6vw,92px);--seam-up:calc(var(--seam) * .45);}

/* the plate — same quiet hairline top and bottom, no drop shadow (it haloes
   on a photograph), no lit top edge (it reads as a heavier border) */
.bsec,.gplate{position:relative;z-index:6;margin:calc(var(--seam-up) * -1) 0;color:var(--bone);
  background:linear-gradient(160deg,rgba(244,239,230,.18),rgba(244,239,230,.06));
  backdrop-filter:blur(12px) saturate(1.25);-webkit-backdrop-filter:blur(12px) saturate(1.25); /* v2 · F6: blur diet */
  border-top:1px solid rgba(244,239,230,.1);border-bottom:1px solid rgba(244,239,230,.1);
  box-shadow:none;}
.bsec::before,.gplate::before{content:none;}

/* the spacer: text-width, sits where the two pictures meet. No tint at all —
   it only puts the pictures out of focus, feathered on all four edges, so
   nothing whitish or glowing reads under the plate. */
.bsec::after,.gplate::after{content:"";position:absolute;top:100%;left:50%;transform:translateX(-50%);
  width:min(var(--maxw),calc(100% - var(--pad) * 2));height:calc(var(--seam) * .8);pointer-events:none;z-index:1;
  background:transparent;
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  -webkit-mask-image:linear-gradient(180deg,transparent 0%,#000 42%,transparent 100%),linear-gradient(90deg,transparent 0%,#000 14%,#000 86%,transparent 100%);
  mask-image:linear-gradient(180deg,transparent 0%,#000 42%,transparent 100%),linear-gradient(90deg,transparent 0%,#000 14%,#000 86%,transparent 100%);
  -webkit-mask-composite:source-in;mask-composite:intersect;}

/* ---------- homepage banners on the plate ---------- */
.bsec-btn{padding:clamp(24px,2.8vw,38px) 0;color:var(--bone);}
/* the hover wash spans the whole plate, not just the text column */
.bsec-btn::before{left:50%;right:auto;width:100vw;max-width:none;transform:translateX(-50%);background:radial-gradient(72% 130% at 22% 50%,rgba(255,255,255,.13),transparent 74%);}
.bsec-btn .kicker{color:var(--amber);}
.bsec-btn .bh{color:#fff;text-shadow:0 2px 16px rgba(0,0,0,.45);}
.bsec-btn .bh em{color:var(--peach);}
.bsec-btn .bsub{color:rgba(255,255,255,.84);text-shadow:0 1px 10px rgba(0,0,0,.5);}
.bstat{color:var(--amber);}
.bstat b{color:rgba(255,255,255,.62);}
.plusbig{border-color:rgba(255,255,255,.5);color:#fff;}
.bsec-btn:hover .plusbig{border-color:var(--amber);}

/* the expansion is the same glass, smoked down so long copy stays readable */
.bsec-more-in{background:linear-gradient(180deg,rgba(32,28,22,.74),rgba(19,17,14,.82));
  backdrop-filter:blur(14px) saturate(1.15);-webkit-backdrop-filter:blur(14px) saturate(1.15);
  border-top:1px solid rgba(244,239,230,.22);box-shadow:none;color:var(--bone);}
.glass .field label{color:var(--amber);}
.glass .checks .ck span{border-color:rgba(244,239,230,.34);color:var(--bone);}
.glass .checks input:checked + span{background:var(--bone);border-color:var(--bone);color:var(--ink);}
.glass .payload{background:rgba(10,9,7,.55);border:1px solid var(--edge);color:var(--on-dark);}

/* ---------- pictures: room above for the plate, a spacer's worth below ---------- */
.hero .ov-copy{padding-bottom:calc(52px + var(--seam-up)) !important;}
.hero .scrollhint{bottom:calc(22px + var(--seam-up));}
.tabs-sec{height:calc(86svh + var(--seam) + var(--seam-up));min-height:calc(520px + var(--seam));}
.rtab .full{padding-bottom:calc(44px + var(--seam-up));}
.edge-label{top:calc(34px + var(--seam));}
.fsec-in{padding-top:calc(clamp(46px,6vw,90px) + var(--seam));padding-bottom:calc(clamp(46px,6vw,90px) + var(--seam-up));}

/* ---------- top bar: smoked glass, same language as the cards ---------- */
body.dark .bar,body.dark .bar.solid{mix-blend-mode:normal;color:var(--bone);
  background:linear-gradient(180deg,rgba(30,27,21,.62),rgba(17,15,12,.44));
  backdrop-filter:blur(12px) saturate(1.2);-webkit-backdrop-filter:blur(12px) saturate(1.2);
  border-bottom:1px solid rgba(244,239,230,.14);box-shadow:0 18px 40px -34px rgba(6,5,4,.9);}
body.dark .bar.solid{background:linear-gradient(180deg,rgba(26,23,18,.86),rgba(15,13,11,.8));border-bottom-color:rgba(244,239,230,.18);}
body.dark .bar .hours-chip{color:var(--amber);opacity:1;}
body.dark .bar nav a,body.dark .bar .brand,body.dark .bar .barbtn{color:var(--bone);}
body.dark .bar .barbtn.fill,body.dark .bar.solid .barbtn.fill{background:var(--clay);border-color:var(--clay);color:#fff;}

/* ---------- ranges page ---------- */
/* the hero is one crop of the property, sized like the homepage hero */
.hero.short{height:100svh;}
.hero.short img.media{position:absolute;inset:0;object-fit:cover;object-position:58% 64%;}

/* every picture on this page carries the same vignette: top and bottom equal
   and strong, with a soft corner falloff so the middle of the frame stays open */
.rband.vig::after{background:
  radial-gradient(118% 92% at 50% 50%, transparent 30%, rgba(10,9,7,.85) 100%),
  linear-gradient(180deg, rgba(10,9,7,.97) 0%, rgba(10,9,7,.62) 22%, transparent 52%),
  linear-gradient(0deg, rgba(10,9,7,.99) 0%, rgba(10,9,7,.86) 24%, rgba(10,9,7,.48) 48%, transparent 72%);}
.hero.short.vig::after{background:
  radial-gradient(118% 92% at 50% 50%, transparent 36%, rgba(10,9,7,.72) 100%),
  linear-gradient(180deg, rgba(10,9,7,.92) 0%, rgba(10,9,7,.5) 20%, transparent 48%),
  linear-gradient(0deg, rgba(10,9,7,.98) 0%, rgba(10,9,7,.82) 24%, rgba(10,9,7,.42) 46%, transparent 70%);}

/* the ranges meet on a hard edge, marked by one lit seam line. The band grows
   with its copy instead of being a fixed height, so a tall card row can never
   push the name up into the range number. */
.rband{height:auto;min-height:clamp(660px,92svh,1020px);display:flex;flex-direction:column;justify-content:flex-end;}
.rband .ov-copy{position:relative;padding-top:clamp(64px,8vw,110px);}
#ranges > section + section .rband{border-top:1px solid rgba(244,239,230,.16);}
#ranges > section + section .rband::before{content:"";position:absolute;left:0;right:0;top:0;height:1px;z-index:8;pointer-events:none;
  background:linear-gradient(90deg,transparent,rgba(255,217,168,.7) 18%,rgba(255,217,168,.7) 82%,transparent);}
.rband .no{top:clamp(18px,2.4vw,30px);left:auto;right:var(--pad);}
.rband .ov-copy{padding-bottom:clamp(30px,3vw,44px);}
.rname{margin-bottom:clamp(16px,2vw,26px);}
.rname .ov-tag{max-width:44ch;}
/* mobile: journey-style reveal — each band opens on a clean stretch of image
   (name pinned at its foot); the data cards arrive as you keep scrolling */
@media (max-width:700px){
  .rband{min-height:0;}
  .rband .ov-copy{padding-top:min(58svh,480px);}
  .rcd{opacity:0;transform:translateY(26px);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.7,.2,1);}
  .rcd.in{opacity:1;transform:none;}
  @media (prefers-reduced-motion:reduce){.rcd{opacity:1;transform:none;transition:none;}}
}

/* the range's own info: a row of glass cards across the picture */
.rcards{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(10px,1.1vw,15px);align-items:end;}
@media (max-width:1000px){.rcards{grid-template-columns:repeat(2,1fr);}}
@media (max-width:620px){.rcards{grid-template-columns:1fr;}}
.rcd{padding:clamp(14px,1.4vw,20px);color:var(--bone);
  background:linear-gradient(160deg,rgba(244,239,230,.2),rgba(244,239,230,.07));
  backdrop-filter:blur(22px) saturate(1.25);-webkit-backdrop-filter:blur(22px) saturate(1.25);
  border:1px solid rgba(244,239,230,.24);}
.rcd .k{display:block;font-weight:800;font-size:9.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--amber);margin-bottom:10px;}
.rcd .spec{width:100%;}
.rcd .spec td{padding:5px 0;font-size:12.5px;color:rgba(255,255,255,.88);border-bottom:1px solid rgba(244,239,230,.16);}
.rcd .spec td:last-child{color:#fff;font-size:13px;white-space:nowrap;}
.rcd .spec tr:last-child td{border-bottom:0;}
.rcd .spec .free{color:var(--amber);}
.rcd .ci{display:block;font-family:var(--serif);font-weight:500;font-size:18px;line-height:1.15;color:#fff;}
.rcd p{font-size:12.5px;line-height:1.5;color:rgba(255,255,255,.8);margin-top:7px;text-wrap:pretty;}
.rcd .rb-cls{display:flex;flex-direction:column;align-items:flex-start;gap:6px;}
.rcd .rb-cls button,.rcd .rb-cls a{display:inline-flex;align-items:center;gap:7px;padding:6px 11px;border:1px solid rgba(244,239,230,.32);font-weight:700;font-size:11px;color:var(--bone);text-decoration:none;text-align:left;white-space:nowrap;transition:background .2s ease,border-color .2s ease;}
.rcd .rb-cls button:hover,.rcd .rb-cls a:hover{background:rgba(244,239,230,.14);border-color:var(--bone);}
.rcd .rb-cls .cdot{width:5px;height:5px;border-radius:50%;background:var(--clay);flex:none;}

/* the rulebook opens like a folio: a card per section */
.rgrid{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(14px,1.8vw,22px);margin-top:0;align-items:start;}
@media (max-width:820px){.rgrid{grid-template-columns:1fr;}}
.rcard{position:relative;padding:clamp(18px,2.2vw,28px);border:1px solid var(--edge);border-top-color:var(--edge-lit);
  background:linear-gradient(155deg,rgba(50,44,35,.6),rgba(22,20,16,.5));}
.rcard:nth-child(2n){background:linear-gradient(155deg,rgba(40,35,28,.66),rgba(18,16,13,.56));}
.rcard .rc-no{position:absolute;top:clamp(14px,1.6vw,20px);right:clamp(16px,1.8vw,22px);font-family:var(--mono);font-size:11px;color:var(--amber);opacity:.7;}
.rcard h3{font-family:var(--serif);font-weight:500;font-size:20px;letter-spacing:-.01em;color:var(--bone);padding-bottom:12px;margin-bottom:6px;border-bottom:1px solid rgba(244,239,230,.24);}
.rcard ol{list-style:none;counter-reset:r;}
.rcard li{counter-increment:r;display:grid;grid-template-columns:24px 1fr;gap:10px;padding:9px 0;border-bottom:1px solid rgba(244,239,230,.12);font-size:14.5px;line-height:1.5;color:rgba(244,239,230,.84);text-wrap:pretty;}
.rcard li:last-child{border-bottom:0;}
.rcard li::before{content:counter(r,decimal-leading-zero);font-family:var(--mono);font-size:10.5px;color:var(--amber);padding-top:4px;}
.rcard li b{color:#fff;font-weight:700;}
.rcard.wide{grid-column:1 / -1;background:linear-gradient(160deg,rgba(244,239,230,.11),rgba(244,239,230,.04));}
.rcols{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(16px,2.2vw,32px);}
@media (max-width:820px){.rcols{grid-template-columns:1fr 1fr;}}
.rcols .rn{display:block;font-weight:800;font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--amber);margin-bottom:9px;}
.rcols ul{list-style:none;display:grid;gap:7px;}
.rcols li{font-size:13.5px;line-height:1.45;color:rgba(244,239,230,.82);text-wrap:pretty;}
.rules-foot{margin-top:clamp(22px,2.6vw,32px);padding-top:20px;border-top:1px solid rgba(244,239,230,.22);display:grid;grid-template-columns:1fr auto;gap:20px;align-items:center;}
@media (max-width:820px){.rules-foot{grid-template-columns:1fr;}}
.rules-foot p{font-size:14px;color:rgba(244,239,230,.7);max-width:56ch;}

/* ---------- events page: the standing week rides the plate too ---------- */
body.dark section.dark.gplate{background:linear-gradient(160deg,rgba(244,239,230,.18),rgba(244,239,230,.06));color:var(--bone);}
section.dark.gplate .esec{padding-top:calc(clamp(46px,6vw,84px) + var(--seam-up));padding-bottom:calc(clamp(46px,6vw,84px) + var(--seam-up));}

/* ---------- footer: About lives here now, in the club's warm palette ---------- */
.foot{background:linear-gradient(180deg,var(--umber),var(--umber-deep));color:var(--bone);
  border-top:1px solid rgba(244,239,230,.14);}
.foot .foot-inner{padding-top:calc(clamp(40px,5vw,60px) + var(--seam));}
.foot .foot-grid{grid-template-columns:1.35fr 1fr .85fr;margin-top:0;padding-top:0;border-top:0;}
@media (max-width:820px){.foot .foot-grid{grid-template-columns:1fr;}}
.foot h4{color:var(--amber);}
.foot .hours-table tr.today td{font-weight:400;}
.foot .hours-table tr.closed td:last-child{color:var(--peach);}
.foot-about p{font-size:14.5px;line-height:1.65;color:rgba(244,239,230,.78);max-width:46ch;text-wrap:pretty;}
.foot-about p + p{margin-top:10px;}
.foot-about .fa-links{display:flex;gap:16px;flex-wrap:wrap;margin-top:16px;}
.foot-about .fa-links a{font-weight:800;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--amber);opacity:1;border-bottom:1px solid rgba(255,217,168,.5);}
.foot-about .fa-links a:hover{color:#fff;border-bottom-color:#fff;text-decoration:none;}

@media (max-width:780px){
  .tabs-sec{height:auto;min-height:0;}
  .rtab .full{padding-bottom:18px;}
}

/* v2 · F6: where backdrop-filter is unavailable the seam plates fall back to
   tinted opaque panels instead of near-invisible washes */
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))){
  .bsec,.gplate{background:linear-gradient(160deg,rgba(56,49,39,.97),rgba(30,26,21,.97));}
  .bsec::after,.gplate::after{display:none;}
  .bsec-more-in{background:linear-gradient(180deg,rgba(32,28,22,.98),rgba(19,17,14,.98));}
  body.dark .bar,body.dark .bar.solid{background:linear-gradient(180deg,rgba(26,23,18,.97),rgba(15,13,11,.94));}
}
