/* Scrollprise Buying Engine Lab 02.1 · compact rhythm + canonical navigation · 2026-08-18 */

/* A. Canonical homepage navigation on every public page */
.site-header{
  background:rgba(230,230,228,.96)!important;
  border-bottom:1px solid rgba(0,0,0,.07)!important;
  box-shadow:none!important;
}
.site-header .header-row{min-height:74px!important;gap:20px!important;padding-top:0!important;padding-bottom:0!important}
.site-header .brand-image img,.site-header .nav-transparent-logo img{height:44px!important;width:auto!important}
.site-header .main-nav{gap:20px!important;align-items:center!important}
.site-header .main-nav>a,.site-header .nav-dropdown>summary{
  color:#1b1b1a!important;font-size:11px!important;font-weight:780!important;line-height:1!important;white-space:nowrap!important
}
.site-header .header-button{
  min-height:44px!important;padding:0 20px!important;border-radius:999px!important;background:#111!important;color:#fff!important;
  border:1px solid #111!important;font-size:11px!important;font-weight:850!important;white-space:nowrap!important
}

/* B. Discover + Traditional Categories use the exact same dropdown language */
.site-header details.nav-dropdown{position:static!important}
.site-header details.nav-dropdown:not([open])>.mega-menu{display:none!important}
.site-header details.nav-dropdown[open]>.mega-menu{
  display:grid!important;grid-template-columns:190px minmax(0,1fr)!important;gap:20px!important;
  position:absolute!important;top:calc(100% + 8px)!important;left:50%!important;transform:translateX(-50%)!important;
  width:min(calc(100vw - 42px),1240px)!important;max-height:min(76vh,720px)!important;overflow:auto!important;
  padding:20px!important;border:5px solid #fff!important;border-radius:25px!important;
  background:linear-gradient(180deg,#f3f3f1 0%,#ececea 100%)!important;color:#111!important;
  box-shadow:0 28px 58px rgba(0,0,0,.15)!important;z-index:10000!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important
}
.site-header details.nav-dropdown>.mega-menu .mega-intro{
  padding:3px 18px 3px 1px!important;border-right:1px solid #d5d5d1!important;color:#111!important
}
.site-header details.nav-dropdown>.mega-menu .mega-intro-label{
  display:block!important;margin-bottom:12px!important;color:#666663!important;font-size:8px!important;font-weight:900!important;letter-spacing:.12em!important;text-transform:uppercase!important
}
.site-header details.nav-dropdown>.mega-menu .mega-intro h2{
  margin:0 0 9px!important;color:#111!important;font-size:21px!important;line-height:1!important;letter-spacing:-.04em!important
}
.site-header details.nav-dropdown>.mega-menu .mega-intro p{
  margin:0 0 16px!important;color:#696965!important;font-size:10px!important;line-height:1.5!important
}
.site-header details.nav-dropdown>.mega-menu .mega-browse-button{
  display:inline-flex!important;align-items:center!important;gap:7px!important;min-height:35px!important;padding:0 12px!important;
  border-radius:999px!important;background:#111!important;color:#fff!important;font-size:9px!important;font-weight:850!important;text-decoration:none!important
}
.site-header details.nav-dropdown>.mega-menu .mega-columns{
  display:grid!important;grid-template-columns:repeat(6,minmax(0,1fr))!important;gap:14px 17px!important;min-width:0!important
}
.site-header details.nav-dropdown>.mega-menu .mega-column{display:flex!important;flex-direction:column!important;gap:10px!important;min-width:0!important}
.site-header details.nav-dropdown>.mega-menu .mega-group{padding:0 0 8px!important;border-bottom:1px solid #d9d9d5!important}
.site-header details.nav-dropdown>.mega-menu .mega-group h3{
  margin:0 0 5px!important;color:#5d5d59!important;font-size:8px!important;font-weight:900!important;letter-spacing:.08em!important;text-transform:uppercase!important
}
.site-header details.nav-dropdown>.mega-menu .mega-links{display:grid!important;gap:0!important}
.site-header details.nav-dropdown>.mega-menu .mega-links a{
  min-height:20px!important;padding:2px 4px!important;border-radius:7px!important;color:#3f3f3c!important;
  font-size:9.5px!important;font-weight:600!important;line-height:1.22!important;text-decoration:none!important;background:transparent!important
}
.site-header details.nav-dropdown>.mega-menu .mega-links a:hover{
  background:rgba(255,255,255,.76)!important;color:#111!important;transform:none!important;padding-left:4px!important
}

/* C. Site-wide compact rhythm: less dead space, same hierarchy */
.discovery-hub{padding-top:36px!important;padding-bottom:38px!important}
.discovery-hub .discovery-intro{margin-bottom:17px!important}
.discovery-hub .discovery-intro h2{margin-top:6px!important;margin-bottom:11px!important}
.discovery-hub .discovery-intro p{margin-bottom:0!important}
.editorial-drop,.vibe-guide-section,.traditional-home-section,.picks,.instagram-section,.about-section,.disclosure-block,.fun-zone{
  padding-top:40px!important;padding-bottom:40px!important
}
.section-heading,.discovery-heading{margin-bottom:16px!important}

/* Family pages: compact hero and 30% smaller cards */
.discovery-family-page .family-page-hero{padding:30px 0 18px!important}
.discovery-family-page .family-page-back{margin-bottom:10px!important}
.discovery-family-page .family-page-hero h1{
  margin:4px 0 10px!important;font-size:clamp(48px,5.8vw,88px)!important;line-height:.92!important
}
.discovery-family-page .family-page-hero p{margin:0!important;max-width:720px!important;font-size:14px!important;line-height:1.55!important}
.discovery-family-page .family-page-count{margin-top:8px!important;padding:8px 11px!important;font-size:10px!important}
.family-subcategory-grid{gap:12px!important;padding-bottom:38px!important}
.family-subcategory-card{
  min-height:172px!important;padding:16px!important;border-width:4px!important;border-radius:23px!important;
  box-shadow:0 14px 24px rgba(0,0,0,.075)!important
}
.family-subcategory-card:hover{transform:translateY(-4px)!important}
.family-subcategory-card .subcategory-count{top:12px!important;right:12px!important;padding:6px 8px!important;font-size:8.5px!important}
.family-subcategory-card .sub-family-label{margin-bottom:13px!important;font-size:7.5px!important}
.family-subcategory-card h2{font-size:22px!important;line-height:.98!important;margin:0 0 7px!important}
.family-subcategory-card .subcategory-tagline{font-size:11px!important;line-height:1.4!important;max-width:88%!important}
.family-subcategory-card .subcategory-bottom{padding-top:10px!important;gap:8px!important}
.family-subcategory-card .subcategory-bottom span:first-child{font-size:8px!important}
.family-subcategory-card .subcategory-arrow{width:29px!important;height:29px!important;font-size:12px!important}

/* Homepage top-level discovery-family cards also become tighter */
.discovery-family-overview-grid{gap:12px!important}
.discovery-family-overview-card{
  min-height:182px!important;padding:17px 17px 15px!important;border-width:4px!important;border-radius:23px!important;
  box-shadow:0 15px 25px rgba(0,0,0,.08)!important
}
.discovery-family-overview-card:hover{transform:translateY(-4px)!important}
.discovery-family-overview-card .family-num{font-size:9px!important;margin-bottom:12px!important}
.discovery-family-overview-card .family-micro{font-size:7.5px!important;margin-bottom:5px!important}
.discovery-family-overview-card h3{font-size:clamp(20px,1.6vw,26px)!important;margin-bottom:6px!important}
.discovery-family-overview-card p{font-size:10px!important;line-height:1.42!important;-webkit-line-clamp:2!important}
.discovery-family-overview-card .family-open{padding-top:12px!important;font-size:8px!important}
.discovery-family-overview-card .family-arrow{right:12px!important;bottom:11px!important;width:30px!important;height:30px!important;font-size:12px!important}

/* Individual vibe pages: preserve immersive imagery, just use space better */
.category-page .category-hero{padding:27px 0 22px!important}
.category-page .category-hero-grid{gap:26px!important}
.category-page .category-hero-grid>div:first-child{min-height:420px!important}
.category-page .category-hero h1{font-size:clamp(52px,5.6vw,88px)!important;margin:7px 0 9px!important}
.category-page .category-tagline{margin-bottom:11px!important;font-size:clamp(18px,1.7vw,25px)!important}
.category-page .category-story{font-size:15px!important;line-height:1.55!important;margin-bottom:16px!important}
.category-vibe-visual{min-height:420px!important;border-radius:28px!important}
.category-fit-wrap{margin-top:12px!important}
.category-fit-fullwidth{padding:18px!important;border-radius:23px!important}
.category-fit-fullwidth .fit-points{gap:10px!important;margin-top:11px!important}
.category-fit-fullwidth .fit-point{min-height:108px!important;padding:14px!important}
.category-page .category-products{padding-top:34px!important;padding-bottom:42px!important}
.category-page .category-products-head{margin-bottom:16px!important}

/* Catalogue/traditional pages */
.catalogue-page .category-hero,.traditional-categories-page .category-hero{padding-top:32px!important;padding-bottom:25px!important}
.catalogue-page .category-hero h1,.traditional-categories-page .category-hero h1{margin-top:4px!important;margin-bottom:12px!important}
.catalogue-page .category-hero p,.traditional-categories-page .category-hero p{margin-top:0!important;margin-bottom:12px!important}
.catalogue-page .category-products,.traditional-category-browser{padding-top:34px!important;padding-bottom:42px!important}
.product-grid,#productGrid,#traditionalProductGrid,.catalogue-grid{gap:15px!important}

/* Favourites + Swipe get the same global header without adding extra vertical waste */
.swipe-page .site-header,.stash-page .site-header{position:relative!important}
.final-swipe-page .final-swipe-shell{height:calc(100vh - 74px)!important}
.stash-page .stash-shell{padding-top:42px!important;padding-bottom:46px!important}

@media(max-width:1100px){
 .site-header details.nav-dropdown[open]>.mega-menu{grid-template-columns:170px 1fr!important}
 .site-header details.nav-dropdown>.mega-menu .mega-columns{grid-template-columns:repeat(3,minmax(0,1fr))!important}
 .site-header .main-nav{gap:12px!important}
}
@media(max-width:760px){
 .site-header .header-row{min-height:64px!important}
 .site-header .brand-image img,.site-header .nav-transparent-logo img{height:38px!important}
 .discovery-family-page .family-page-hero{padding:22px 0 14px!important}
 .family-subcategory-grid{grid-template-columns:1fr!important}
 .family-subcategory-card{min-height:160px!important}
 .discovery-family-overview-grid{grid-template-columns:1fr!important}
 .category-page .category-hero-grid>div:first-child{min-height:0!important}
 .category-vibe-visual{min-height:300px!important}
 .catalogue-page .category-products,.traditional-category-browser,.category-page .category-products{padding-top:28px!important;padding-bottom:32px!important}
}