/* Template-led art direction. These are deliberately layout systems, not palette swaps. */
.family-editorial .site-nav { border-bottom: 1px solid color-mix(in srgb, currentColor 14%, transparent); }
.family-editorial .section-heading { max-width: 12ch; }
.family-editorial .type-hero .section-heading { max-width: 10ch; }
.family-editorial .menu-category h3 { font-style: italic; }

.family-sunlit { --font-heading: "Fredoka", sans-serif; }
.family-sunlit .site-nav { border-bottom: 2px solid var(--site-dark); }
.family-sunlit .site-section { overflow: clip; }
.family-sunlit .site-section:before { content:""; position:absolute; z-index:-1; width:32vw; height:32vw; min-width:280px; min-height:280px; right:-16vw; top:-18vw; border-radius:50%; background:color-mix(in srgb, var(--site-accent) 40%, transparent); }
.family-sunlit .type-hero:before { width:46vw; height:46vw; right:-18vw; top:auto; bottom:-25vw; background:color-mix(in srgb, var(--site-primary) 40%, transparent); }
.family-sunlit .section-heading { letter-spacing:-.06em; line-height:.86; }
.family-sunlit .site-button { border-radius:999px; border-width:2px; box-shadow:4px 4px 0 currentColor; }
.family-sunlit .variant-cards .section-copy,.family-sunlit .variant-cards .section-media { border:2px solid currentColor; border-radius:24px; }
.family-sunlit .menu-category { border-top-width:2px; }

.family-nightlife { --font-heading: "Fredoka", sans-serif; background-image:linear-gradient(rgb(255 255 255 / 3%) 1px,transparent 1px),linear-gradient(90deg,rgb(255 255 255 / 3%) 1px,transparent 1px); background-size:32px 32px; }
.family-nightlife .site-nav { border-bottom:1px solid var(--site-primary); box-shadow:0 8px 35px rgb(0 0 0 / 38%); }
.family-nightlife .site-section { border-bottom:1px solid color-mix(in srgb, currentColor 24%, transparent); }
.family-nightlife .section-eyebrow { display:inline-block; padding:7px 11px; color:var(--site-dark); background:var(--site-accent); letter-spacing:.12em; }
.family-nightlife .section-heading { line-height:.82; text-transform:uppercase; letter-spacing:-.07em; }
.family-nightlife .site-button { border:0; border-radius:2px; background:var(--site-primary); color:var(--site-dark); box-shadow:5px 5px 0 var(--site-accent); }
.family-nightlife .variant-cards .section-copy,.family-nightlife .variant-cards .section-media { border:1px solid var(--site-accent); }
.family-nightlife .menu-category h3 { text-transform:uppercase; font-size:1.2rem; letter-spacing:.16em; }

.family-minimal .site-nav { padding-top:36px; padding-bottom:36px; border-bottom:1px solid currentColor; }
.family-minimal .site-nav nav a { letter-spacing:.1em; font-size:.7rem; }
.family-minimal .site-section { padding-block:clamp(100px,15vw,260px); }
.family-minimal .section-eyebrow { color:inherit; letter-spacing:.18em; }
.family-minimal .section-heading { max-width:9ch; line-height:.95; letter-spacing:-.05em; }
.family-minimal .align-center .section-heading { margin-inline:auto; }
.family-minimal .site-button { border:0; border-bottom:1px solid currentColor; padding:8px 0; }
.family-minimal .menu-scene { grid-template-columns:1fr; gap:80px; }
.family-minimal .menu-category { max-width:760px; margin:auto; }
.family-minimal .menu-category li { padding-block:22px; }
.family-minimal .hours-scene { grid-template-columns:1fr; max-width:760px; margin:auto; }

.family-fieldnotes { background-color:var(--site-surface); background-image:radial-gradient(color-mix(in srgb,var(--site-text) 20%,transparent) .7px,transparent .7px); background-size:13px 13px; }
.family-fieldnotes .site-nav { border-bottom:1px solid color-mix(in srgb,currentColor 40%,transparent); }
.family-fieldnotes .site-section { border-bottom:1px dashed color-mix(in srgb,currentColor 40%,transparent); }
.family-fieldnotes .section-eyebrow { color:inherit; font-family:"Space Grotesk",sans-serif; letter-spacing:.14em; }
.family-fieldnotes .section-heading { line-height:.93; max-width:11ch; }
.family-fieldnotes .site-button { border-radius:0; border:1px solid currentColor; padding:13px 18px; }
.family-fieldnotes .variant-editorial .section-copy { background:var(--site-light); border:1px solid var(--site-dark); color:var(--site-dark); }
.family-fieldnotes .menu-category h3 { font-size:clamp(1.5rem,3vw,2.4rem); }
.family-fieldnotes .hours-list { border-top-style:dashed; }.family-fieldnotes .hours-list div { border-bottom-style:dashed; }
@media (max-width:760px) { .family-minimal .site-nav { padding-block:22px; }.family-minimal .site-section { padding-block:90px; } }
