/* CARNABY & OAK | ONE TYPOGRAPHY SOURCE OF TRUTH | 13 OCT 2026
   Scope: editorial headings + supporting text. Existing cards, colours, sections,
   animations, navbar and CMS are deliberately untouched. */
:root {
 --co-type-h1:clamp(74px,7.2vw,112px);
 --co-type-h2:clamp(54px,5.35vw,84px);
 --co-type-h3:clamp(32px,3.05vw,46px);
 --co-type-hand:clamp(23px,2.35vw,35px);
 --co-type-hand-gap:10px;
 --co-type-after-title:20px;
 --co-type-after-section-head:22px;
 --co-type-paragraph:16px;
 --co-type-paragraph-leading:1.48;
 --co-type-title-leading:.94;
}
@media (min-width:1600px){:root{--co-type-h1:112px;--co-type-h2:84px;--co-type-h3:46px;--co-type-hand:35px}}
@media (max-width:760px){:root{
 --co-type-h1:clamp(60px,14vw,82px);
 --co-type-h2:clamp(45px,11.5vw,66px);
 --co-type-h3:clamp(30px,8.2vw,42px);
 --co-type-hand:clamp(21px,5.6vw,28px);
 --co-type-hand-gap:8px;
 --co-type-after-title:16px;
 --co-type-after-section-head:18px;
 --co-type-paragraph:15px;
}}
/* Editorial headings: role-based styles, same metrics for every page. */
body[data-co-system] main h1.co-overlay-title,
body[data-co-system] main h1.co-master-title,
body[data-co-system] main :is(.page-hero,.classes-colour-intro,.class-host-copy,.whats-latest-copy) h1 {
 font-family:'Instrument Serif',Georgia,serif!important;
 font-size:var(--co-type-h1)!important;
 font-weight:400!important;
 font-style:normal!important;
 line-height:var(--co-type-title-leading)!important;
 letter-spacing:-.048em!important;
}
body[data-co-system] main h2.co-overlay-title,
body[data-co-system] main :is(.hour-title,.whatson-section-head h2,.whatson-split-head h2,.parlor-hours h2,.play-games-head h2,.play-worlds-head h2,.class-faq-head h2,.class-worlds-intro h2,.birthday-details-head h2,.birthday-final-inner h2,.join-copy h2,.enquiry-copy h2,.membership-feature-copy h2) {
 font-family:'Instrument Serif',Georgia,serif!important;
 font-size:var(--co-type-h2)!important;
 font-weight:400!important;
 font-style:normal!important;
 line-height:var(--co-type-title-leading)!important;
 letter-spacing:-.048em!important;
}
/* A unified handwritten treatment. Intentional normal flow prevents collision.
   Only position relative to its own heading; never compensate with negative margin. */
body[data-co-system] main :is(h1,h2,h3).co-overlay-title,
body[data-co-system] main h1.co-master-title {
 display:block!important;
 position:relative!important;
 width:max-content!important;
 max-width:100%!important;
 min-width:0!important;
 overflow:visible!important;
 padding:0!important;
 margin-top:0!important;
 margin-bottom:var(--co-type-after-title)!important;
 text-align:left!important;
 text-wrap:initial!important;
}
body[data-co-system] main :is(h1,h2,h3).co-overlay-title > span.hand,
body[data-co-system] main h1.co-master-title > span.hand,
body[data-co-system] main .hour-title > span.hand {
 position:relative!important;
 inset:auto!important;
 float:none!important;
 display:block!important;
 width:max-content!important;
 max-width:100%!important;
 min-width:0!important;
 box-sizing:border-box!important;
 white-space:nowrap!important;
 overflow-wrap:normal!important;
 word-break:normal!important;
 hyphens:none!important;
 font-family:'Gochi Hand',cursive!important;
 font-weight:400!important;
 font-style:normal!important;
 font-size:min(var(--co-fitted-hand, 1000px),var(--co-type-hand))!important;
 line-height:1.08!important;
 letter-spacing:0!important;
 text-transform:none!important;
 text-align:right!important;
 padding:0 2px 2px 0!important;
 margin:var(--co-type-hand-gap) 0 0 auto!important;
 transform:rotate(-3deg)!important;
 transform-origin:85% 50%!important;
}
/* Each section has ONE bottom rhythm: avoid stacking heading margin and wrapper margin. */
body[data-co-system] main :is(.co-section-intro,.section-head,.co-spotlight-head,.co-birthday-section-head,.birthday-details-head,.play-worlds-head,.play-games-head,.whatson-section-head,.join-section-head,.site-faq-head,.class-faq-head,.class-worlds-intro) {
 margin-bottom:var(--co-type-after-section-head)!important;
}
body[data-co-system] main :is(.co-section-intro,.section-head,.co-spotlight-head,.co-birthday-section-head,.birthday-details-head,.play-worlds-head,.play-games-head,.whatson-section-head,.join-section-head,.site-faq-head,.class-faq-head,.class-worlds-intro) :is(h1,h2).co-overlay-title {
 margin-bottom:0!important;
}
/* Clock title is an editorial heading too. Keep its approved upper-right location. */
body[data-co-system] main .hour-title > span.hand {
 color:inherit;
}
/* Semantically identical editorial text gets identical font size, weight and leading. */
body[data-co-system] main :is(.hero-lead,.section-copy,.co-intro-copy,.co-spotlight-cue,.co-birthday-section-head>p,.play-worlds-head>p,.play-games-intro,.membership-feature-copy>p,.birthday-landing-copy>p,.whats-latest-copy>p,.join-copy>p,.enquiry-copy>p,.class-host-copy>p) {
 font-family:'DM Sans',Arial,sans-serif!important;
 font-size:var(--co-type-paragraph)!important;
 font-weight:400!important;
 line-height:var(--co-type-paragraph-leading)!important;
 letter-spacing:0!important;
}
/* Preserve intentional special hero logo scale and small photographic card copy. */
body[data-co-system] main .garden-hero .hero-copy h1.co-overlay-title {
 font-size:clamp(125px,11.2vw,192px)!important;
 line-height:.82!important;
}
body[data-co-system] main .garden-hero .hero-copy h1.co-overlay-title>.hand {
 font-size:clamp(30px,3.15vw,47px)!important;
 margin-top:var(--co-type-hand-gap)!important;
}
/* Preserve the compact photo-card typographic hierarchy; align Gochi consistently. */
body[data-co-system] main .mood-copy h3.co-overlay-title,
body[data-co-system] main .play-world-copy h3.co-overlay-title {
 font-size:var(--co-type-h3)!important;
 margin-bottom:0!important;
}
body[data-co-system] main .mood-copy h3.co-overlay-title>span.hand,
body[data-co-system] main .play-world-copy h3.co-overlay-title>span.hand {
 font-size:min(var(--co-fitted-hand,1000px),clamp(21px,2.2vw,30px))!important;
 margin-top:var(--co-type-hand-gap)!important;
}
/* Keep dark/light theme's approved colours; no new background or card rules. */
@media(max-width:760px){
 body[data-co-system] main .garden-hero .hero-copy h1.co-overlay-title {font-size:clamp(86px,23vw,145px)!important;}
 body[data-co-system] main .garden-hero .hero-copy h1.co-overlay-title>.hand {font-size:clamp(26px,7vw,35px)!important;}
}
/* Highest-priority consolidation: override accumulated historic !important rules.
   One Gochi gap and alignment for EVERY heading, irrespective of old section name. */
body.compact-rhythm[data-co-system] main h1.co-overlay-title.co-overlay-title > span.hand.hand,
body.compact-rhythm[data-co-system] main h2.co-overlay-title.co-overlay-title > span.hand.hand,
body.compact-rhythm[data-co-system] main h3.co-overlay-title.co-overlay-title > span.hand.hand,
body.compact-rhythm[data-co-system] main h1.co-master-title.co-master-title > span.hand.hand,
body.compact-rhythm[data-co-system] main .hour-title.hour-title > span.hand.hand {
 position:relative!important;
 inset:auto!important;
 display:block!important;
 float:none!important;
 box-sizing:border-box!important;
 width:max-content!important;
 max-width:100%!important;
 white-space:nowrap!important;
 margin:var(--co-type-hand-gap) 0 0 auto!important;
 padding:0 2px 2px 0!important;
 font-family:'Gochi Hand',cursive!important;
 font-size:min(var(--co-fitted-hand,1000px),var(--co-type-hand))!important;
 font-weight:400!important;
 font-style:normal!important;
 line-height:1.08!important;
 letter-spacing:0!important;
 text-align:right!important;
 transform:rotate(-3deg)!important;
 transform-origin:85% 50%!important;
}
/* Logo remains the one intentional large Gochi variant. */
body.compact-rhythm[data-co-system] main .garden-hero .hero-copy h1.co-overlay-title.co-overlay-title > span.hand.hand{
 font-size:clamp(30px,3.15vw,47px)!important;
}
@media(max-width:760px){
 body.compact-rhythm[data-co-system] main .garden-hero .hero-copy h1.co-overlay-title.co-overlay-title > span.hand.hand{font-size:clamp(26px,7vw,35px)!important}
}
