/* src/styles/tokens.css */
/* Token primitives, pushed as a code asset by push-site.mjs.
   These CANNOT live in the style registry: happy-dom drops --custom-property
   declarations during conversion, silently. Edit site-src/css/ and re-push. */

/* ===== 00-fluid-root.css ===== */
:root { --font-from: 18; --font-to: 20; --vw-from: calc(1920 / 100); --vw-to: calc(2400 / 100); --coefficient: calc((var(--font-to) - var(--font-from)) / (var(--vw-to) - var(--vw-from))); --base: calc((var(--font-from) - var(--vw-from) * var(--coefficient)) / 16); }
@media screen and (max-width: 1920px) {:root { --font-from: 16; --font-to: 18; --vw-from: calc(1440 / 100); --vw-to: calc(1920 / 100); }}
@media screen and (max-width: 1440px) {:root { --font-from: 16; --font-to: 16; --vw-from: calc(479 / 100); --vw-to: calc(1440 / 100); }}
@media screen and (max-width: 479px) {:root { --font-from: 14; --font-to: 16; --vw-from: calc(320 / 100); --vw-to: calc(479 / 100); }}

/* ===== 01-tokens.css ===== */
:root { --ivory: #f6f4ef; --stone: #d8d3ca; --charcoal: #272727; --green: #8fbc46; --white: #ffffff; --ivory-deep: #efece4; --stone-soft: #e7e3dc; --green-ink: #55731f; --green-deep: #6f9433; --green-wash: #f0f5e5; --charcoal-soft: #4a4a4a; --charcoal-mute: #6a6862; --bg: var(--ivory); --bg-alt: var(--ivory-deep); --bg-card: var(--white); --bg-deep: var(--charcoal); --fg: var(--charcoal); --fg-body: var(--charcoal-soft); --fg-mute: var(--charcoal-mute); --accent: var(--green-ink); --accent-flat: var(--green); --btn-ink: var(--charcoal); --line: var(--stone-soft); --line-strong: var(--stone); --focus: var(--green-ink); --scrim: linear-gradient(180deg, rgba(39, 39, 39, 0.42) 0%, rgba(39, 39, 39, 0.12) 38%, rgba(39, 39, 39, 0.72) 100%); --scrim-side: linear-gradient(100deg, rgba(39, 39, 39, 0.66) 0%, rgba(39, 39, 39, 0.34) 42%, rgba(39, 39, 39, 0) 72%); --font-display: "Cormorant Garamond", "Cormorant", Georgia, "Times New Roman", serif; --font-body: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif; --t-display: 1; --t-heading: 1; --t-sub: 1; --t-text: 1; --size-h1: calc(4.75rem * var(--t-display)); --size-h2: calc(3.25rem * var(--t-heading)); --size-h3: calc(2.25rem * var(--t-heading)); --size-h4: calc(1.625rem * var(--t-sub)); --size-h5: calc(1.25rem * var(--t-sub)); --size-h6: calc(1.0625rem * var(--t-sub)); --size-text-large: calc(1.25rem * var(--t-text)); --size-text-medium: calc(1.125rem * var(--t-text)); --size-text-regular: calc(1rem * var(--t-text)); --size-text-small: calc(0.875rem * var(--t-text)); --size-text-tiny: calc(0.75rem * var(--t-text)); --space-0: 0rem; --space-tiny: 0.125rem; --space-xxsmall: 0.25rem; --space-xsmall: 0.5rem; --space-small: 1rem; --space-medium: 2rem; --space-large: 3rem; --space-xlarge: 4rem; --space-xxlarge: 5rem; --space-huge: 6rem; --space-xhuge: 8rem; --space-xxhuge: 12rem; --radius: 999px; --radius-card: 1.25rem; --radius-frame: 1.75rem; --shadow-card: 0 1px 2px rgba(39, 39, 39, 0.04), 0 8px 24px rgba(39, 39, 39, 0.06); --shadow-card-hover: 0 2px 4px rgba(39, 39, 39, 0.06), 0 18px 44px rgba(39, 39, 39, 0.1); --ease: cubic-bezier(0.22, 1, 0.36, 1); }
@media (max-width: 1279px) {:root { --t-display: 0.82; --t-heading: 0.85; --t-sub: 0.92; }}
@media (max-width: 991px) {:root { --t-display: 0.7; --t-heading: 0.76; --t-sub: 0.88; }}
@media (max-width: 767px) {:root { --t-display: 0.56; --t-heading: 0.66; --t-sub: 0.84; }}
@media (max-width: 478px) {:root { --t-heading: 0.6; --t-sub: 0.82; --t-text: 1.1; }}
[data-theme="dark"] { --bg: var(--charcoal); --bg-alt: #1e1e1e; --bg-card: #333230; --fg: var(--white); --fg-body: rgba(255, 255, 255, 0.8); --fg-mute: rgba(255, 255, 255, 0.62); --accent: var(--green); --accent-flat: var(--green); --line: rgba(255, 255, 255, 0.14); --line-strong: rgba(255, 255, 255, 0.28); --focus: var(--green); }
[data-theme="green"] { --bg: var(--green); --bg-alt: #83ad3f; --bg-card: rgba(255, 255, 255, 0.34); --fg: var(--charcoal); --fg-body: rgba(39, 39, 39, 0.82); --fg-mute: rgba(39, 39, 39, 0.64); --accent: var(--charcoal); --accent-flat: var(--charcoal); --btn-ink: var(--white); --line: rgba(39, 39, 39, 0.18); --line-strong: rgba(39, 39, 39, 0.4); --focus: var(--charcoal); }
[data-theme="stone"] { --bg: var(--stone); --bg-alt: #cfc9bf; --bg-card: var(--ivory); --line: rgba(39, 39, 39, 0.12); --line-strong: rgba(39, 39, 39, 0.28); }

/* ===== :root harvested from 40-motion.css ===== */
.marquee_component { --marquee-duration: 40s; }

/* ===== :root harvested from 52-cadence.css ===== */
.cadence_grid { --cad-label: 13rem; }

@media (max-width: 1279px) {.cadence_grid { --cad-label: 10.5rem; }}

@media (max-width: 991px) {.cadence_grid { --cad-label: 9rem; }}

/* ===== :root harvested from 90-wide.css ===== */
@media (min-width: 1700px) {.cadence_grid { --cad-label: 16rem; }}

/* ===== the cascade of every pair the conversion is lossy on — a clamp()/min()/max()
        value, or a multi-layer background — from 02-base.css. See push-site.mjs ===== */
html { -webkit-text-size-adjust: 100%; }
html { scroll-behavior: smooth; }
html { scroll-padding-top: 7rem; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
@media (prefers-reduced-motion: reduce) { * { scroll-behavior: auto !important; } }
@media (prefers-reduced-motion: reduce) { *::before { scroll-behavior: auto !important; } }
@media (prefers-reduced-motion: reduce) { *::after { scroll-behavior: auto !important; } }

/* ===== the cascade of every pair the conversion is lossy on — a clamp()/min()/max()
        value, or a multi-layer background — from 21-drawer.css. See push-site.mjs ===== */
.drawer_panel { width: min(24rem, 88vw); }

/* ===== the cascade of every pair the conversion is lossy on — a clamp()/min()/max()
        value, or a multi-layer background — from 49-cover.css. See push-site.mjs ===== */
.cover_media::after { background: linear-gradient(180deg, rgba(39, 39, 39, 0.55) 0%, rgba(39, 39, 39, 0.1) 30%, rgba(39, 39, 39, 0.2) 55%, rgba(39, 39, 39, 0.82) 100%),
    linear-gradient(90deg, rgba(39, 39, 39, 0.4) 0%, rgba(39, 39, 39, 0) 60%); }
.cover_title { font-size: clamp(2.8rem, 6.6vw, 6.4rem); }
.cover_fact-num { font-size: clamp(2rem, 3.2vw, 3rem); }
@media (max-width: 767px) { .cover_title { font-size: clamp(2.4rem, 11vw, 3.6rem); } }

/* ===== the cascade of every pair the conversion is lossy on — a clamp()/min()/max()
        value, or a multi-layer background — from 50-hero.css. See push-site.mjs ===== */
.hero_media::after { background: linear-gradient(180deg, rgba(39, 39, 39, 0.5) 0%, rgba(39, 39, 39, 0) 32%, rgba(39, 39, 39, 0) 48%, rgba(39, 39, 39, 0.78) 100%),
    linear-gradient(90deg, rgba(39, 39, 39, 0.42) 0%, rgba(39, 39, 39, 0) 55%); }
.hero_title { font-size: clamp(3.2rem, 8.6vw, 8.4rem); }
@media (max-width: 767px) { .hero_title { font-size: clamp(2.9rem, 13vw, 4.2rem); } }

/* ===== the cascade of every pair the conversion is lossy on — a clamp()/min()/max()
        value, or a multi-layer background — from 51-mosaic.css. See push-site.mjs ===== */
.mosaic_title { font-size: clamp(2.6rem, 5.4vw, 5.2rem); }

/* ===== the cascade of every pair the conversion is lossy on — a clamp()/min()/max()
        value, or a multi-layer background — from 52-cadence.css. See push-site.mjs ===== */
.cadence_stat-num { font-size: clamp(2.4rem, 4vw, 3.6rem); }

/* ===== the cascade of every pair the conversion is lossy on — a clamp()/min()/max()
        value, or a multi-layer background — from 53-shelf.css. See push-site.mjs ===== */
.shelf_component { height: clamp(28rem, 62vh, 38rem); }
.shelf_name { font-size: clamp(1.8rem, 3vw, 2.8rem); }
@media (max-width: 991px) { .shelf_component { height: 30rem; } }
@media (max-width: 767px) { .shelf_component { height: auto; } }

/* ===== the cascade of every pair the conversion is lossy on — a clamp()/min()/max()
        value, or a multi-layer background — from 54-surgeon.css. See push-site.mjs ===== */
.surgeon_fact-num { font-size: clamp(2.2rem, 3.6vw, 3.4rem); }

/* ===== the cascade of every pair the conversion is lossy on — a clamp()/min()/max()
        value, or a multi-layer background — from 55-words.css. See push-site.mjs ===== */
.words_title { font-size: clamp(2.8rem, 7vw, 6.8rem); }
.quote_card { width: min(30rem, 78vw); }

/* ===== the cascade of every pair the conversion is lossy on — a clamp()/min()/max()
        value, or a multi-layer background — from 57-menu.css. See push-site.mjs ===== */
.menu_group-num { font-size: clamp(3rem, 6vw, 5.5rem); }
.row_name { font-size: clamp(1.6rem, 2.6vw, 2.5rem); }
.doors_component { height: clamp(24rem, 56vh, 34rem); }
.doors_name { font-size: clamp(1.8rem, 3vw, 2.8rem); }
@media (max-width: 767px) { .doors_component { height: auto; } }

/* ===== the cascade of every pair the conversion is lossy on — a clamp()/min()/max()
        value, or a multi-layer background — from 58-close.css. See push-site.mjs ===== */
.close_title { font-size: clamp(2.8rem, 6.2vw, 6rem); }

/* ===== the cascade of every pair the conversion is lossy on — a clamp()/min()/max()
        value, or a multi-layer background — from 59-detail.css. See push-site.mjs ===== */
.products_name { font-size: clamp(2.4rem, 4vw, 3.6rem); }

/* ===== the cascade of every pair the conversion is lossy on — a clamp()/min()/max()
        value, or a multi-layer background — from 61-about.css. See push-site.mjs ===== */
.room_rail { height: clamp(18rem, 42vh, 30rem); }
@media (max-width: 767px) { .room_rail { height: 16rem; } }

/* ===== the cascade of every pair the conversion is lossy on — a clamp()/min()/max()
        value, or a multi-layer background — from 62-team.css. See push-site.mjs ===== */
.people_initial { font-size: clamp(3rem, 6vw, 5rem); }
.strip_track { height: clamp(20rem, 52vh, 34rem); }
.lead_fact-num { font-size: clamp(2.2rem, 3.6vw, 3.4rem); }
@media (max-width: 991px) { .strip_track { height: 22rem; } }
@media (max-width: 767px) { .strip_track { height: 16rem; } }

/* ===== the cascade of every pair the conversion is lossy on — a clamp()/min()/max()
        value, or a multi-layer background — from 63-plan.css. See push-site.mjs ===== */
.principle_title { font-size: clamp(2.2rem, 4.6vw, 4.4rem); }
.principle_fact-num { font-size: clamp(2.2rem, 3.4vw, 3.2rem); }
.question_title { font-size: clamp(2.8rem, 6.4vw, 6rem); }
.faces_line { font-size: clamp(1.8rem, 3.2vw, 3rem); }

/* ===== the cascade of every pair the conversion is lossy on — a clamp()/min()/max()
        value, or a multi-layer background — from 64-book.css. See push-site.mjs ===== */
.book_call-number { font-size: clamp(2.8rem, 8vw, 7.4rem); }
.thanks_component .cover_media::after { background: linear-gradient(90deg, rgba(39, 39, 39, 0.9) 0%, rgba(39, 39, 39, 0.78) 45%, rgba(39, 39, 39, 0.4) 100%),
    linear-gradient(180deg, rgba(39, 39, 39, 0.5) 0%, rgba(39, 39, 39, 0.2) 50%, rgba(39, 39, 39, 0.7) 100%); }
@media (max-width: 767px) { .book_call-number { font-size: clamp(2.2rem, 11vw, 3.4rem); } }

/* ===== the cascade of every pair the conversion is lossy on — a clamp()/min()/max()
        value, or a multi-layer background — from 65-proof.css. See push-site.mjs ===== */
.quote_card.is-photo { width: min(16rem, 52vw); }
.plates_fact-num { font-size: clamp(2.2rem, 3.6vw, 3.4rem); }

/* ===== the cascade of every pair the conversion is lossy on — a clamp()/min()/max()
        value, or a multi-layer background — from 66-doctor.css. See push-site.mjs ===== */
.doctor_card-body { padding: clamp(2rem, 5vw, 4.5rem); }
.doctor_card-title { font-size: clamp(2rem, 3.6vw, 3.4rem); }
.doctor_rule-title { font-size: clamp(2.6rem, 5.6vw, 5.4rem); }
.doctor_rule-fact-num { font-size: clamp(2.2rem, 3.6vw, 3.4rem); }
@media (max-width: 767px) { .doctor_card-body { padding: 1.5rem; } }

/* ===== the cascade of every pair the conversion is lossy on — a clamp()/min()/max()
        value, or a multi-layer background — from 90-wide.css. See push-site.mjs ===== */
@media (min-width: 1700px) { .hero_title { font-size: 8.4rem; } }
@media (min-width: 1700px) { .words_title { font-size: 6.4rem; } }
@media (min-width: 1700px) { .close_title { font-size: 6.4rem; } }
@media (min-width: 1700px) { .shelf_component { height: 40rem; } }