/* GENERATED SNAPSHOT — do not edit by hand.
   Flattened from the design system's styles.css closure (tokens/*.css) so the
   site folder deploys on its own. Regenerate after any token change. */

/* Webfonts are declared inline in index.html and served locally from
   /assets/fonts/ — the previous @import fetched them from Google. */

/* ===== tokens/colors.css ===== */
:root{
/* Warm ivory — retuned to match the signature-palette swatch (proper off-white, not near-white) */
--ivory-50:#F1EADA;--ivory-100:#EBE3CC;--ivory-200:#E3D9BE;
/* Soft stone — warmed into the ivory family */
--stone-100:#E6DDC6;--stone-200:#D8CCB3;--stone-300:#C5BBA9;--stone-400:#A79C88;
/* Brushed silver */
--silver-100:#E6E7E5;--silver-200:#CFD2D0;--silver-300:#B3B8B5;--silver-400:#8F9591;--silver-500:#6F7571;
/* Pearl, mist and taupe — every "light ground" retuned into the warm ivory family
   so no section reads as cold white. Held to subtle tonal shifts (2–4 units apart)
   so glass panels and section grounds still separate visually. */
--pearl-50:#F4EDDD;--pearl-100:#EFE7D3;--mist-100:#E9E0CB;--mist-200:#DFD3BC;--mist-300:#C7BAA3;--taupe-100:#E3DCD2;--taupe-200:#CFC5B8;--taupe-300:#B0A497;

/* Soft midnight — used only as a detail, from the navy medallion artwork */
--midnight-500:#25324D;--midnight-700:#182238;--midnight-900:#0F1626;

/* Charcoal */
--charcoal-600:#4C4E49;--charcoal-700:#3A3C37;--charcoal-800:#292A26;--charcoal-900:#1B1C19;
/* Persian red — retuned to the deeper burgundy of the signature palette. Deep, never bright:
   inverse grounds, the deepest section, and rare emphasis. */
--persian-100:#F0DFDD;--persian-300:#B37C7A;--persian-500:#7A1E22;--persian-700:#5C1517;--persian-900:#380B0D;
/* Mirror silver — the only accent, from the silvered glass itself */
--mirror-200:#E9EBEB;--mirror-300:#D8DBDB;--mirror-400:#C7CBCC;--mirror-500:#A6ABAC;--mirror-600:#787E7F;

/* Semantic — text */
--text-primary:var(--charcoal-900);
--text-secondary:var(--charcoal-600);
--text-muted:#5A5F5B; /* darkened from silver-500 to meet WCAG AA on pearl/mist grounds */
--text-inverse:var(--ivory-50);
--text-inverse-muted:rgba(241,234,218,.72); /* raised alpha to keep AA on midnight/charcoal grounds */
--text-accent:var(--mirror-600);
/* Text set directly on the stone/warm surface tints, which flip in dark mode */
--text-on-stone:var(--charcoal-700);

/* Semantic — surfaces */
--surface-page:var(--ivory-50);
--surface-warm:var(--ivory-100);
--surface-stone:var(--stone-100);
--surface-charcoal:var(--charcoal-900);
--surface-charcoal-soft:var(--charcoal-800);
--surface-image:var(--stone-200);
--surface-pearl:var(--pearl-100);
--surface-mist:var(--mist-100);
--surface-midnight:var(--midnight-700);
--surface-persian:var(--persian-700);
--surface-persian-deep:var(--persian-900);

/* Semantic — lines */
--line-hairline:rgba(27,28,25,.14);
--line-quiet:rgba(27,28,25,.08);
--line-strong:rgba(27,28,25,.32);
--line-inverse:rgba(241,234,218,.22);
--line-accent:var(--mirror-400);
--line-persian:rgba(102,19,21,.28);

/* Semantic — interactive */
--accent:var(--mirror-500);
--accent-hover:var(--mirror-600);
--focus-ring:var(--mirror-400);
--accent-deep:var(--persian-700);
--text-persian:var(--persian-700);
}

/* ===== tokens/typography.css ===== */
:root{
--font-display:"Cormorant Garamond",Garamond,"Times New Roman",serif;
--font-body:"Manrope","Helvetica Neue",Helvetica,Arial,sans-serif;

--weight-light:300; /* @kind font */--weight-regular:400; /* @kind font */--weight-medium:500; /* @kind font */--weight-semibold:600; /* @kind font */

/* Display serif — editorial headings */
--text-display-1:clamp(44px,5.4vw,76px);--lh-display-1:1.04; /* @kind other */
--text-display-2:clamp(36px,4vw,56px);--lh-display-2:1.08; /* @kind other */
--text-display-3:clamp(29px,2.9vw,40px);--lh-display-3:1.14; /* @kind other */
--text-display-4:clamp(22px,2vw,28px);--lh-display-4:1.22; /* @kind other */

/* Body sans */
--text-lead:clamp(17px,1.35vw,19px);--lh-lead:1.68; /* @kind other */
--text-body:16px;--lh-body:1.75; /* @kind other */
--text-small:14px;--lh-small:1.62; /* @kind other */
--text-caption:12px;--lh-caption:1.4; /* @kind other */

/* Tracking */
--tracking-display:-0.015em;
--tracking-body:0em;
--tracking-eyebrow:0.18em;
--tracking-button:0.09em;

/* Composite roles */
--eyebrow-size:11px;
}
.t-display-1{font-family:var(--font-display);font-weight:var(--weight-light);font-size:var(--text-display-1);line-height:var(--lh-display-1);letter-spacing:var(--tracking-display)}
.t-display-2{font-family:var(--font-display);font-weight:var(--weight-light);font-size:var(--text-display-2);line-height:var(--lh-display-2);letter-spacing:var(--tracking-display)}
.t-display-3{font-family:var(--font-display);font-weight:var(--weight-light);font-size:var(--text-display-3);line-height:var(--lh-display-3);letter-spacing:var(--tracking-display)}
.t-display-4{font-family:var(--font-display);font-weight:var(--weight-regular);font-size:var(--text-display-4);line-height:var(--lh-display-4)}
.t-lead{font-family:var(--font-body);font-weight:var(--weight-light);font-size:var(--text-lead);line-height:var(--lh-lead);color:var(--text-secondary)}
.t-body{font-family:var(--font-body);font-weight:var(--weight-regular);font-size:var(--text-body);line-height:var(--lh-body)}
.t-small{font-family:var(--font-body);font-weight:var(--weight-regular);font-size:var(--text-small);line-height:var(--lh-small)}
.t-eyebrow{font-family:var(--font-body);font-weight:var(--weight-medium);font-size:var(--eyebrow-size);line-height:1.2;letter-spacing:var(--tracking-eyebrow);text-transform:uppercase;color:var(--text-muted)}

/* ===== tokens/spacing.css ===== */
:root{
--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:24px;--space-6:32px;
--space-7:48px;--space-8:64px;--space-9:96px;--space-10:128px;--space-11:160px;--space-12:200px;

/* Architectural rhythm */
--section-y:var(--space-11);
--section-y-tight:var(--space-9);
--gutter:32px;
--gutter-wide:64px;
--page-max:1440px;
--measure:56ch; /* @kind other */
--measure-narrow:40ch; /* @kind other */
--header-h:88px;
}
@media (max-width:1180px){:root{--gutter-wide:32px;--section-y:112px;--section-y-tight:80px}}
@media (max-width:720px){:root{--gutter-wide:24px;--gutter:20px;--section-y:88px;--section-y-tight:64px;--header-h:72px}}

/* ===== tokens/surfaces.css ===== */
:root{
/* Corners stay architectural — near-square by default */
--radius-none:0px;--radius-sm:1px;--radius-md:2px;--radius-pill:999px;

/* Borders */
--border-hairline:1px solid var(--line-hairline); /* @kind other */
--border-quiet:1px solid var(--line-quiet); /* @kind other */
--border-strong:1px solid var(--line-strong); /* @kind other */
--border-inverse:1px solid var(--line-inverse); /* @kind other */

/* Elevation — used sparingly; light and low */
--shadow-none:none;
--shadow-panel:0 1px 2px rgba(27,28,25,.04),0 32px 64px -40px rgba(27,28,25,.22);
--shadow-lift:0 2px 4px rgba(27,28,25,.05),0 40px 80px -40px rgba(27,28,25,.28);
--shadow-inset-edge:inset 0 0 0 1px rgba(241,234,218,.35);

/* Brushed-silver reflection sweeps */
--sheen-silver:linear-gradient(105deg,rgba(255,255,255,0) 32%,rgba(255,255,255,.55) 47%,rgba(207,210,208,.35) 53%,rgba(255,255,255,0) 68%); /* @kind other */
--sheen-mirror:linear-gradient(105deg,rgba(255,255,255,0) 34%,rgba(199,203,204,.6) 50%,rgba(255,255,255,0) 66%); /* @kind other */

/* Image protection scrim for text over photography */
--scrim-bottom:linear-gradient(to top,rgba(27,28,25,.62) 0%,rgba(27,28,25,.28) 38%,rgba(27,28,25,0) 72%); /* @kind other */
--scrim-top:linear-gradient(to bottom,rgba(27,28,25,.42) 0%,rgba(27,28,25,0) 60%); /* @kind other */

/* Frosted glass layers — the brand's signature surface */
--glass-light:rgba(241,234,218,.56); /* @kind color */
--glass-light-strong:rgba(241,234,218,.80); /* @kind color */
--glass-mist:rgba(237,238,238,.50); /* @kind color */
--glass-dark:rgba(24,34,56,.34); /* @kind color */
--glass-charcoal:rgba(27,28,25,.42); /* @kind color */
--glass-blur:blur(28px) saturate(150%); /* @kind other */
--glass-blur-soft:blur(16px) saturate(130%); /* @kind other */
--glass-border:rgba(255,255,255,.55); /* @kind color */
--glass-border-dark:rgba(255,255,255,.16); /* @kind color */
--glass-edge:inset 0 1px 0 rgba(255,255,255,.7),inset 0 -1px 0 rgba(255,255,255,.18); /* @kind shadow */
--glass-shadow:0 2px 4px rgba(27,28,25,.04),0 44px 88px -40px rgba(27,28,25,.30);
--glass-shadow-tight:0 24px 48px -28px rgba(27,28,25,.26);
--float-shadow:0 60px 90px -60px rgba(27,28,25,.46);
--reflection-fade:linear-gradient(to bottom,rgba(27,28,25,.22),rgba(27,28,25,0) 62%); /* @kind other */

/* Page-tinted veils laid over photography so a hero reads as a ground, not a photo.
   Both flip with the theme, so full-bleed art stays legible either way. */
--veil-page-strong:linear-gradient(to bottom,rgba(253,252,250,.86),rgba(253,252,250,.94)); /* @kind other */
--veil-page-soft:linear-gradient(to bottom,rgba(253,252,250,.34),rgba(253,252,250,.52)); /* @kind other */
/* Banded veils laid over a full-bleed photographic ground (hero, page headers):
   dense behind the header bar, clearing through the middle. Theme-aware. */
--veil-band:linear-gradient(to bottom,rgba(241,234,218,.94) 0%,rgba(241,234,218,.66) 22%,rgba(241,234,218,.60) 70%,rgba(241,234,218,.78) 100%); /* @kind other */
--veil-band-soft:linear-gradient(to bottom,rgba(241,234,218,.92) 0%,rgba(241,234,218,.46) 26%,rgba(241,234,218,.42) 74%,rgba(241,234,218,.66) 100%); /* @kind other */
/* The plate a framed artwork sits on */
--frame-plate:linear-gradient(150deg,var(--ivory-50),var(--ivory-200)); /* @kind other */

/* Glass — only over photography */
--blur-veil:saturate(120%) blur(14px); /* @kind other */
--overlay-veil:rgba(241,234,218,.10);
}

/* ===== tokens/motion.css ===== */
:root{
--ease-editorial:cubic-bezier(.22,.61,.36,1); /* @kind other */
--ease-veil:cubic-bezier(.4,0,.2,1); /* @kind other */
--ease-out-soft:cubic-bezier(.16,1,.3,1); /* @kind other */

--dur-1:180ms; /* @kind other */   /* hover colour / opacity */
--dur-2:320ms; /* @kind other */   /* button + link states */
--dur-3:600ms; /* @kind other */   /* image zoom, veils */
--dur-4:1100ms; /* @kind other */  /* section reveal, rule draw */

--zoom-hover:1.04; /* @kind other */
--dur-5:1800ms; /* @kind other */
--float-travel:14px;
--parallax-shift:64px;
--reveal-y:24px;
}
@media (prefers-reduced-motion:reduce){:root{--dur-3:1ms; /* @kind other */
--dur-4:1ms; /* @kind other */
--zoom-hover:1; /* @kind other */
--reveal-y:0px}}

@keyframes ma-float{0%,100%{transform:translateY(0)}50%{transform:translateY(calc(var(--float-travel) * -1))}}
@keyframes ma-rise{from{opacity:0;transform:translateY(var(--reveal-y))}to{opacity:1;transform:none}}
@keyframes ma-sheen{0%{transform:translateX(-120%)}100%{transform:translateX(120%)}}

/* ===== tokens/patterns.css ===== */
/* Āyeneh-kāri motifs — geometric tessellations built from CSS gradients only.
   Always subtle: they read as facet structure in the surface, never as decoration. */
:root{
--motif-size-sm:32px;--motif-size-md:64px;--motif-size-lg:120px;
--motif-line:rgba(27,28,25,.07);
--motif-line-inverse:rgba(241,234,218,.10);
}
/* Rhombus lattice — the core facet grid */
.motif-lattice{background-image:repeating-linear-gradient(60deg,var(--motif-line) 0 1px,transparent 1px var(--motif-size-md)),repeating-linear-gradient(-60deg,var(--motif-line) 0 1px,transparent 1px var(--motif-size-md))}
.motif-lattice-inverse{--motif-line:var(--motif-line-inverse)}
/* Triangular facet field — alternating cut-glass shards */
.motif-facets{background-image:repeating-conic-gradient(from 0deg at 50% 0,rgba(255,255,255,.5) 0 25%,rgba(197,187,169,.16) 0 50%);background-size:var(--motif-size-md) var(--motif-size-md)}
/* Starburst / eight-point node, tiled */
.motif-star{background-image:repeating-linear-gradient(45deg,var(--motif-line) 0 1px,transparent 1px var(--motif-size-sm)),repeating-linear-gradient(-45deg,var(--motif-line) 0 1px,transparent 1px var(--motif-size-sm)),repeating-linear-gradient(0deg,var(--motif-line) 0 1px,transparent 1px var(--motif-size-sm))}
/* Hairline column rule set — used to divide editorial grids */
.motif-rules{background-image:repeating-linear-gradient(90deg,var(--motif-line) 0 1px,transparent 1px var(--motif-size-lg))}

/* ===== tokens/base.css ===== */
*{box-sizing:border-box}
body{margin:0;background:var(--surface-page);color:var(--text-primary);font-family:var(--font-body);font-size:var(--text-body);line-height:var(--lh-body);-webkit-font-smoothing:antialiased;text-wrap:pretty}
h1,h2,h3,h4{font-family:var(--font-display);font-weight:var(--weight-light);letter-spacing:var(--tracking-display);margin:0}
p{margin:0}
a{color:var(--text-primary);text-decoration:none;transition:color var(--dur-2) var(--ease-editorial),opacity var(--dur-2) var(--ease-editorial)}
a:hover{color:var(--text-accent)}
img{display:block;max-width:100%}
hr{border:0;border-top:1px solid var(--line-hairline);margin:0}
::selection{background:var(--mirror-200);color:var(--charcoal-900)}
:focus-visible{outline:1px solid var(--focus-ring);outline-offset:3px}
/* Single-line headings and standfirsts relax back to normal wrapping once
   there is no longer room to hold the line. */
@media (max-width:1180px){[data-oneline]{white-space:normal !important}}

/* ===== tokens/theme-dark.css ===== */
/* Dark theme — opt-in via [data-theme="dark"] on <html>. Light is the default and
   is never affected by this file. The dark scheme is built from the existing
   charcoal and midnight ramps rather than new hues: the page becomes the deepest
   charcoal, glass layers invert, and Mirror silver lifts to carry the accent
   against it. Inverse tokens (used on midnight/photographic sections that are
   already dark in light mode) stay as they are. */
[data-theme="dark"]{
color-scheme:dark;

/* Text */
--text-primary:var(--ivory-50);
--text-secondary:rgba(241,234,218,.72);
--text-muted:rgba(241,234,218,.48);
/* NOT inverted: --text-inverse and friends sit on grounds that are already dark
   in light mode (midnight sections, the footer, the persian-red button), and
   those grounds stay dark here, so their text must stay ivory. */
--text-accent:var(--mirror-300);
--text-on-stone:rgba(241,234,218,.80);

/* Surfaces — the charcoal ramp, with "warm"/"stone"/"pearl" reading as lifts off
   the page rather than as paler tints. --surface-charcoal and --surface-midnight
   stay dark: they are the sections that are already dark in light mode. */
--surface-page:#121310;
--surface-warm:#191A16;
--surface-stone:#20221D;
--surface-image:#24261F;
--surface-pearl:#171814;
--surface-mist:#1C1E19;
--surface-midnight:#0B1120;
--surface-persian:var(--persian-900);
--surface-persian-deep:#2B070A;

/* Lines */
--line-hairline:rgba(241,234,218,.16);
--line-quiet:rgba(241,234,218,.09);
--line-strong:rgba(241,234,218,.34);
--line-accent:var(--mirror-500);
--line-persian:rgba(196,143,139,.30);

/* Interactive */
--accent:var(--mirror-400);
--accent-hover:var(--mirror-200);
--focus-ring:var(--mirror-300);
--text-persian:var(--persian-300);

/* Elevation — shadows read as depth, not as grey haze, on a dark ground */
--shadow-panel:0 1px 2px rgba(0,0,0,.32),0 32px 64px -40px rgba(0,0,0,.72);
--shadow-lift:0 2px 4px rgba(0,0,0,.36),0 40px 80px -40px rgba(0,0,0,.78);
--shadow-inset-edge:inset 0 0 0 1px rgba(241,234,218,.10);
--glass-shadow:0 2px 4px rgba(0,0,0,.34),0 44px 88px -40px rgba(0,0,0,.74);
--glass-shadow-tight:0 24px 48px -28px rgba(0,0,0,.66);
--float-shadow:0 60px 90px -60px rgba(0,0,0,.86);
--reflection-fade:linear-gradient(to bottom,rgba(0,0,0,.46),rgba(0,0,0,0) 62%); /* @kind other */

/* Frosted glass — tinted from the page ground instead of ivory */
--glass-light:rgba(24,26,22,.56);
--glass-light-strong:rgba(18,19,16,.82);
--glass-mist:rgba(28,30,25,.54);
--glass-dark:rgba(11,17,32,.52);
--glass-charcoal:rgba(0,0,0,.48);
--glass-border:rgba(241,234,218,.14);
--glass-border-dark:rgba(241,234,218,.10);
--glass-edge:inset 0 1px 0 rgba(241,234,218,.10),inset 0 -1px 0 rgba(0,0,0,.30); /* @kind shadow */
--overlay-veil:rgba(11,12,10,.14);
--veil-page-strong:linear-gradient(to bottom,rgba(18,19,16,.86),rgba(18,19,16,.94)); /* @kind other */
--veil-page-soft:linear-gradient(to bottom,rgba(18,19,16,.52),rgba(18,19,16,.68)); /* @kind other */
--veil-band:linear-gradient(to bottom,rgba(18,19,16,.96) 0%,rgba(18,19,16,.80) 22%,rgba(18,19,16,.74) 70%,rgba(18,19,16,.88) 100%); /* @kind other */
--veil-band-soft:linear-gradient(to bottom,rgba(18,19,16,.94) 0%,rgba(18,19,16,.66) 26%,rgba(18,19,16,.60) 74%,rgba(18,19,16,.82) 100%); /* @kind other */
--frame-plate:linear-gradient(150deg,#1D1F1A,#141511); /* @kind other */

/* Motifs and sheens */
--motif-line:rgba(241,234,218,.06);
--motif-line-inverse:rgba(241,234,218,.05);
--sheen-silver:linear-gradient(105deg,rgba(255,255,255,0) 32%,rgba(255,255,255,.22) 47%,rgba(199,203,204,.14) 53%,rgba(255,255,255,0) 68%); /* @kind other */
--sheen-mirror:linear-gradient(105deg,rgba(255,255,255,0) 34%,rgba(199,203,204,.26) 50%,rgba(255,255,255,0) 66%); /* @kind other */
--scrim-bottom:linear-gradient(to top,rgba(0,0,0,.74) 0%,rgba(0,0,0,.36) 38%,rgba(0,0,0,0) 72%); /* @kind other */
--scrim-top:linear-gradient(to bottom,rgba(0,0,0,.52) 0%,rgba(0,0,0,0) 60%); /* @kind other */
}
/* Artwork is photographed on pale plaster, so it is left untouched — only the
   plate ground behind a contained image is darkened by the tokens above. */
[data-theme="dark"] img{color-scheme:light}
[data-theme="dark"] .motif-facets{background-image:repeating-conic-gradient(from 0deg at 50% 0,rgba(241,234,218,.07) 0 25%,rgba(241,234,218,.02) 0 50%)}
