/* Carnaby & Oak, 13 October 2026
   Palette correction and homepage-only layout repair.
   Preserve all existing membership, birthday and class card designs. */
:root{
 --co-night-wine:#78213e;
 --co-night-teal:#205966;
 --co-night-blue:#344c67;
 --co-night-plum:#593b62;
 --co-night-spruce:#2f574a;
}
/* Distinct dark brand hues; the light sections retain their existing palette and layouts. */
body[data-co-system] main > section.co-tone-dark[data-co-palette="wine"]{background:var(--co-night-wine)!important}
body[data-co-system] main > section.co-tone-dark[data-co-palette="teal"]{background:var(--co-night-teal)!important}
body[data-co-system] main > section.co-tone-dark[data-co-palette="blue"]{background:var(--co-night-blue)!important}
body[data-co-system] main > section.co-tone-dark[data-co-palette="plum"]{background:var(--co-night-plum)!important}
body[data-co-system] main > section.co-tone-dark[data-co-palette="spruce"]{background:var(--co-night-spruce)!important}
/* The birthday Works card stays wine, against teal. */
body.birthday-page[data-co-system] main > #birthday-packages.co-tone-dark{background:var(--co-night-teal)!important}
/* Preserve readable serif/handwriting on all dark surfaces. */
body[data-co-system] main > section.co-tone-dark[data-co-palette] :is(.co-simple-eyebrow,.co-simple-eyebrow .eyebrow){color:#fffaf1!important}

/* Homepage: the old second section is removed. 5th section uses its
   image-forward, click-to-expand featured card pattern instead of plain cards. */
body.compact-rhythm[data-co-system] main #club-offers{
 padding-block:clamp(40px,4.3vw,65px)!important;
}
body.compact-rhythm[data-co-system] main #club-offers .co-simple-eyebrow{
 margin-bottom:16px!important;
}
body.compact-rhythm[data-co-system] main #club-offers .co-offers-featured{
 width:100%;max-width:var(--co-max-width);margin-inline:auto;
 height:clamp(395px,32vw,475px);
 gap:14px;
}
body.compact-rhythm[data-co-system] main #club-offers .co-offers-featured .mood-card{
 display:block;min-height:0!important;height:100%;border-radius:var(--co-card-radius,26px);
 isolation:isolate;overflow:hidden;cursor:pointer;
}
body.compact-rhythm[data-co-system] main #club-offers .co-offers-featured .mood-card:focus-visible{
 outline:3px solid var(--co-site-yellow);outline-offset:4px;
}
body.compact-rhythm[data-co-system] main #club-offers .co-offers-featured .mood-stack{min-height:0;gap:14px}
body.compact-rhythm[data-co-system] main #club-offers .co-offers-featured .mood-copy{
 left:clamp(18px,2.1vw,30px);right:clamp(18px,2.1vw,30px);
 bottom:clamp(18px,2vw,27px);color:#fff;pointer-events:none;
}
body.compact-rhythm[data-co-system] main #club-offers .co-offers-featured .mood-copy :is(h3,p,small){color:#fff!important}
body.compact-rhythm[data-co-system] main #club-offers .co-offers-featured .mood-copy h3{
 font-family:'Instrument Serif',serif;font-weight:400;font-size:clamp(39px,4.2vw,69px);
 letter-spacing:-.04em;line-height:.91;margin:11px 0 12px;
}
body.compact-rhythm[data-co-system] main #club-offers .co-offers-featured .mood-copy h3 .hand{
 font-family:'Gochi Hand',cursive;color:#f5c43b;font-size:.57em;font-weight:400;
 display:inline-block;white-space:nowrap;line-height:1.06;letter-spacing:0;
 transform:rotate(-3deg);margin-left:8px;
}
body.compact-rhythm[data-co-system] main #club-offers .co-offers-featured .mood-copy p{
 max-width:38ch;font-size:clamp(13px,1.05vw,16px);line-height:1.35;
 margin:0 0 14px;opacity:.97;
}
body.compact-rhythm[data-co-system] main #club-offers .co-offers-featured .co-mood-cta{
 display:inline-flex;align-items:center;gap:8px;
 border-radius:99px;background:var(--co-site-yellow);color:#2c2622;
 padding:11px 16px;font-size:11px;font-weight:750;letter-spacing:.045em;
 text-transform:uppercase;text-decoration:none;pointer-events:auto;
 transition:transform .22s ease,background-color .22s ease;
}
body.compact-rhythm[data-co-system] main #club-offers .co-offers-featured .co-mood-cta:hover,
body.compact-rhythm[data-co-system] main #club-offers .co-offers-featured .co-mood-cta:focus-visible{
 background:#fffaf1;transform:translateY(-2px);
}
/* 3rd section: rightward movement still follows vertical page scroll.
   Clearer progress cue; no changes to 4th section's cards or scroll behaviour. */
body.compact-rhythm main #club-corners .co-spotlight-track{gap:clamp(13px,1.4vw,19px)!important}
body.compact-rhythm main #club-corners .co-spotlight-card{
 flex:0 0 clamp(275px,27vw,370px);
 border-radius:26px;
 transition:filter .25s ease,box-shadow .25s ease;
 box-shadow:0 10px 25px rgba(13,34,37,.14);
}
body.compact-rhythm main #club-corners .co-spotlight-card:hover{filter:saturate(1.08) brightness(1.045)}
body.compact-rhythm main #club-corners .co-corners-progress{
 flex:0 0 4px;width:min(330px,60%);height:4px;margin:14px 0 0;
 border-radius:99px;background:rgba(255,255,255,.3);overflow:hidden;
}
body.compact-rhythm main #club-corners .co-corners-progress span{
 display:block;width:100%;height:100%;background:#f5c43b;
 transform:scaleX(.06);transform-origin:left center;transition:transform .09s linear;
}
@media(min-width:1081px){
 body.compact-rhythm[data-co-system] main #club-offers .co-offers-featured{display:grid;}
 body.compact-rhythm[data-co-system] main #club-offers .co-offers-featured .mood-stack{display:contents}
 body.compact-rhythm[data-co-system] main #club-offers .co-offers-featured .mood-copy h3{font-size:clamp(38px,3.8vw,65px)}
 body.compact-rhythm[data-co-system] main #club-offers .co-offers-featured .mood-card:not([aria-pressed="true"]) .mood-copy p{display:none}
}
@media(min-width:761px) and (max-width:1080px){
 body.compact-rhythm[data-co-system] main #club-offers .co-offers-featured{
  display:grid;grid-template-columns:1.08fr .92fr;grid-template-rows:1fr 1fr;
  height:450px;
 }
 body.compact-rhythm[data-co-system] main #club-offers .co-offers-featured>.mood-card{grid-row:1/3;grid-column:1}
 body.compact-rhythm[data-co-system] main #club-offers .co-offers-featured>.mood-stack{grid-row:1/3;grid-column:2;display:grid;grid-template-rows:1fr 1fr}
 body.compact-rhythm[data-co-system] main #club-offers .co-offers-featured .mood-copy h3{font-size:clamp(32px,4vw,48px)}
 body.compact-rhythm[data-co-system] main #club-offers .co-offers-featured .mood-stack .mood-copy p{display:none}
}
@media(max-width:760px){
 body.compact-rhythm[data-co-system] main #club-offers .co-offers-featured{
  display:flex!important;height:auto!important;min-height:0!important;
  overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;
  overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;
  scrollbar-width:none;gap:12px;padding-bottom:6px;
 }
 body.compact-rhythm[data-co-system] main #club-offers .co-offers-featured::-webkit-scrollbar{display:none}
 body.compact-rhythm[data-co-system] main #club-offers .co-offers-featured .mood-stack{display:contents!important}
 body.compact-rhythm[data-co-system] main #club-offers .co-offers-featured .mood-card{
  flex:0 0 min(80vw,360px)!important;width:min(80vw,360px)!important;
  max-width:none;height:355px!important;min-height:355px!important;
  scroll-snap-align:start;
 }
 body.compact-rhythm[data-co-system] main #club-offers .co-offers-featured .mood-copy h3{font-size:clamp(36px,9vw,50px)!important}
 body.compact-rhythm[data-co-system] main #club-offers .co-offers-featured .mood-copy h3 .hand{font-size:.55em}
 body.compact-rhythm[data-co-system] main #club-offers .co-offers-featured .mood-copy p{font-size:13px}
 body.compact-rhythm main #club-corners .co-spotlight-card{flex-basis:min(78vw,355px)}
 body.compact-rhythm main #club-corners .co-corners-progress{width:190px;margin-top:8px}
}
@media(prefers-reduced-motion:reduce){
 body.compact-rhythm main #club-corners .co-spotlight-card,
 body.compact-rhythm main #club-corners .co-corners-progress span{transition:none!important}
}
/* The image rail fills the sticky viewport more naturally instead of leaving
   a large empty band below small cards on larger laptops. */
body.compact-rhythm main #club-corners .co-spotlight-card{
 height:clamp(315px,44svh,430px)!important;
 min-height:clamp(315px,44svh,430px)!important;
}
@media(min-width:1081px){
 body.compact-rhythm[data-co-system] main #club-offers .co-offers-featured .mood-card[aria-pressed="false"] .mood-copy h3{
  font-size:clamp(32px,2.9vw,46px)!important;
 }
}
@media(max-width:760px){
 body.compact-rhythm main #club-corners .co-spotlight-card{
  height:clamp(290px,42svh,380px)!important;
  min-height:clamp(290px,42svh,380px)!important;
 }
}
