/* Carnaby & Oak | Client-led website update | 12 October 2026
   Retains approved fonts and clock behaviour. Uses one system for editorial blocks. */
:root { --co-gutter: var(--pad); }

/* A simple, persistent, legible logo and the client's four-part navigation. */
.site-nav { grid-template-columns:minmax(0,1fr) auto minmax(0,1fr); background:rgba(255,250,241,.96); }
.site-nav .nav-left { gap:clamp(12px,2vw,28px); min-width:0; white-space:nowrap; }
.site-nav .nav-combined { display:flex; gap:8px; align-items:center; white-space:nowrap; }
.site-nav .nav-separator { font-family:'Instrument Serif',serif; font-size:19px; color:var(--wine); opacity:.65; }
.site-nav .nav-right { gap:14px; }
.site-nav .brand { justify-self:center; display:flex; align-items:center; justify-content:center; }
.site-nav .brand-logo { width:54px; height:54px; flex:0 0 54px; object-fit:contain; }
.site-nav a:focus-visible, .nav-drawer a:focus-visible, .co-offer-card:focus-visible,
.co-activity-card:focus-visible, .co-ways-buttons button:focus-visible,
.co-package-actions a:focus-visible { outline:3px solid var(--teal); outline-offset:4px; }
.nav-drawer { overflow-y:auto; max-height:calc(100dvh - 66px); }

/* Brand-focused homepage hero: larger logo lettering and kid-first promise. */
body.compact-rhythm main .garden-hero h1 { font-size:clamp(100px,10.5vw,164px)!important; line-height:.82!important; max-width:none; }
body.compact-rhythm main .garden-hero .hero-lead { max-width:620px!important; }
body.compact-rhythm main .garden-hero .hero-note { font-size:clamp(22px,2.5vw,37px); }

/* Editorial headings, eyebrow and paragraph styles match the existing type system. */
body.compact-rhythm main .co-section-intro { display:flex; flex-direction:column; align-items:flex-start; text-align:left; width:100%; margin:0 0 28px; gap:10px; }
body.compact-rhythm main h2.co-display { font-family:'Instrument Serif',serif!important; font-weight:400!important; font-size:var(--co-section-title,clamp(46px,5.2vw,75px))!important; line-height:.91!important; letter-spacing:-.044em!important; color:var(--wine); margin:0!important; max-width:980px; text-align:left!important; }
body.compact-rhythm main h2.co-display .hand { font-family:'Gochi Hand',cursive!important; color:var(--teal); font-size:.52em!important; font-weight:400!important; letter-spacing:0!important; line-height:1.08!important; transform:rotate(-2deg)!important; display:inline-block!important; margin:0!important; }
body.compact-rhythm main .co-intro-copy { max-width:620px!important; margin:6px 0 0!important; font-family:'DM Sans',Arial,sans-serif!important; font-size:16px!important; font-weight:400!important; line-height:1.48!important; letter-spacing:0!important; text-align:left!important; }
body.compact-rhythm main .co-offer-grid, body.compact-rhythm main .co-activity-track { text-align:left; }

/* What you get: three consistent, image-led cards. */
body.compact-rhythm main .co-offers { background:#fffaf1; }
.co-offer-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }
.co-offer-card { background:#fff; border:1px solid rgba(122,32,62,.18); border-radius:24px; overflow:hidden; display:flex; flex-direction:column; min-width:0; transition:transform .24s ease, box-shadow .24s ease; }
.co-offer-card:hover { transform:translateY(-3px); box-shadow:0 16px 30px rgba(77,37,51,.10); }
.co-offer-image { aspect-ratio:1.45/1; overflow:hidden; background:#eadce5; }
.co-offer-image img { height:100%; width:100%; object-fit:cover; transition:transform .5s ease; }
.co-offer-card:hover img { transform:scale(1.035); }
.co-offer-body { display:flex; flex-direction:column; align-items:flex-start; padding:20px 22px 22px; flex:1; }
body.compact-rhythm main .co-offer-body h3, body.compact-rhythm main .co-activity-body h3 {
 font-family:'Instrument Serif',serif!important; font-size:var(--co-card-title,clamp(32px,3vw,43px))!important; line-height:1.02!important; font-weight:400!important; letter-spacing:-.035em!important; text-align:left!important; color:var(--wine); margin:12px 0 10px!important;
}
body.compact-rhythm main .co-offer-body p, body.compact-rhythm main .co-activity-body p { font-family:'DM Sans',Arial,sans-serif!important; font-size:14px!important; font-weight:400!important; line-height:1.48!important; text-align:left!important; margin:0 0 18px!important; max-width:620px!important; }
.co-card-link { display:inline-flex; align-items:center; gap:8px; font-size:11px; font-weight:600; letter-spacing:.08em; text-transform:uppercase; border-bottom:1px solid currentColor; padding-bottom:4px; margin-top:auto; color:var(--wine); }
.co-card-link span { font-size:15px; line-height:1; }

/* Activities: native touch scrolling with a deliberate peek of the next card. */
body.compact-rhythm main .co-ways { background:#f7e9e6; overflow:hidden; }
.co-ways-toolbar { display:flex; align-items:center; justify-content:space-between; gap:12px; margin:0 0 14px; }
.co-scroll-cue, .co-way-small { font-size:10px; font-weight:600; letter-spacing:.12em; text-transform:uppercase; color:var(--wine); }
.co-ways-buttons { display:flex; gap:8px; }
.co-ways-buttons button { border:1px solid rgba(122,32,62,.4); color:var(--wine); background:#fffaf1; width:40px; height:40px; border-radius:100%; display:grid; place-items:center; font-size:18px; font-weight:400; }
.co-ways-buttons button:disabled { opacity:.34; cursor:default; }
.co-activity-track { display:flex; gap:14px; width:100%; overflow-x:auto; overscroll-behavior-inline:contain; scroll-snap-type:x mandatory; scroll-padding-inline:2px; -webkit-overflow-scrolling:touch; scrollbar-width:thin; padding:0 0 14px; }
.co-activity-card { flex:0 0 clamp(278px,32vw,438px); min-width:0; border-radius:24px; overflow:hidden; background:#fffaf1; border:1px solid rgba(122,32,62,.16); scroll-snap-align:start; display:flex; flex-direction:column; }
.co-activity-img { aspect-ratio:1.45/1; width:100%; overflow:hidden; background:#e4d6d4; }
.co-activity-img img { width:100%; height:100%; object-fit:cover; transition:transform .4s ease; }
.co-activity-card:hover .co-activity-img img { transform:scale(1.045); }
.co-activity-body { padding:17px 21px 20px; display:flex; flex-direction:column; align-items:flex-start; flex:1; }
.co-activity-body h3 { margin-top:11px!important; }
.co-activity-body p { margin:0 0 18px!important; }
.co-way-footer { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:10px; margin-top:6px; }
.co-way-footer>a { font-size:11px; text-transform:uppercase; letter-spacing:.07em; border-bottom:1px solid currentColor; padding:5px 0; color:var(--wine); }

/* Keep life-at-club photo cards cohesive with the previous approved interaction. */
#life-at-the-club .mood-copy small { letter-spacing:.12em; }
#life-at-the-club .mood-copy .hand { color:var(--yellow); }

/* Birthday package callout uses current brand elements, no invented dates/prices. */
body.compact-rhythm main .co-packages { background:#f5eadb; }
.co-package-inner { border:1px solid rgba(122,32,62,.2); background:#fffaf1; border-radius:25px; padding:clamp(24px,4vw,52px); max-width:100%; }
.co-package-inner .co-display { margin-top:13px!important; }
.co-package-actions { display:flex; align-items:center; flex-wrap:wrap; gap:10px; margin-top:24px; }
.co-package-actions a { display:inline-flex; align-items:center; padding:12px 16px; border:1px solid var(--wine); border-radius:999px; font-size:11px; font-weight:600; letter-spacing:.04em; }
.co-package-actions a.co-package-primary { background:var(--yellow); border-color:var(--yellow); }

@media(max-width:1060px) and (min-width:761px){
 .site-nav { gap:12px; padding-inline:16px; }
 .site-nav .nav-left { gap:11px; }
 .site-nav .nav-combined { gap:5px; }
 .site-nav .nav-link,.site-nav .pill-link { font-size:10px; }
 .site-nav .brand-logo { width:48px; height:48px; flex-basis:48px; }
 .site-nav .nav-time { display:none; }
 .site-nav .nav-right { gap:6px; }
}
@media(max-width:900px) and (min-width:761px){
 /* Do not let an old rule silently hide the client's Birthday menu item. */
 body.compact-rhythm .nav-left .nav-link[href="/birthday"] { display:inline-block!important; }
}
@media(max-width:760px){
 .site-nav { grid-template-columns:auto 1fr auto; }
 .site-nav .brand-logo { width:46px; height:46px; flex-basis:46px; }
 body.compact-rhythm main .garden-hero h1 { font-size:clamp(72px,18.5vw,116px)!important; }
 body.compact-rhythm main .garden-hero .hero-grid { gap:18px; }
 .co-offer-grid { grid-template-columns:1fr; gap:12px; }
 .co-offer-card { display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); border-radius:20px; }
 .co-offer-image { aspect-ratio:auto; height:100%; min-height:195px; }
 .co-offer-body { padding:16px; }
 body.compact-rhythm main .co-offer-body h3 { font-size:30px!important; }
 body.compact-rhythm main .co-offer-body p { font-size:13px!important; }
 .co-activity-card { flex:0 0 min(82vw,350px); border-radius:20px; }
 .co-activity-img { aspect-ratio:1.35/1; }
 .co-activity-body { padding:16px; }
 .co-ways-buttons button { height:36px; width:36px; }
 .co-package-inner { padding:24px 18px; }
 .co-package-actions { align-items:stretch; }
}
@media(max-width:380px){
 .co-offer-card { grid-template-columns:1fr; }
 .co-offer-image { min-height:0; aspect-ratio:1.65/1; }
 .co-activity-card { flex-basis:84vw; }
 .site-nav .brand-logo { width:42px; height:42px; flex-basis:42px; }
 .mobile-dock { width:calc(100vw - 20px); justify-content:space-around; }
 .mobile-dock a { font-size:8px; padding:9px 5px; }
}
@media(prefers-reduced-motion:reduce){
 .co-offer-card, .co-offer-card img,.co-activity-card img { transition:none; }
 .co-activity-track { scroll-behavior:auto; }
}

/* Account for the fixed header when navigating to content anchors. */
html { scroll-padding-top: 92px; }
main section[id], main div[id="birthday-play"] { scroll-margin-top: 92px; }
@media(max-width:760px) { html { scroll-padding-top:78px; } main section[id], main div[id="birthday-play"] { scroll-margin-top:78px; } }