/* ==========================================================================
   GENERATED by tools/make-fixtures.py --emit-base from ../../site/css/shared-responsive.css + ../../site/css/blocks-responsive.css + build/css/responsive.css
   shell ranges (fixtures.config.json). DO NOT hand-edit this section —
   edit the source or the config, then regenerate. The hand-maintained
   pins live in dc009-wp-pins.css and are appended below.
   ========================================================================== */

/* non-color tokens (colors come from the kit bridge in the pins) */
body {
  --f-title: "Cormorant Garamond", Georgia, "Times New Roman", serif;
  --f-body:  "Montserrat", Arial, sans-serif;
  --t-h1: clamp(32px, 1.98347vw + 24.3145px, 56px);
  --t-h1-lh: clamp(40px, 2.47934vw + 30.3806px, 70px);
  --t-h2: clamp(26px, 0.743802vw + 23.1492px, 35px);
  --t-h2-lh: clamp(36px, 1.32231vw + 30.893px, 52px);
  --t-nav: 16px;
  --t-nav-lh: 30px;
  --t-body: 16px;
  --t-body-lh: clamp(27px, 0.330579vw + 25.7607px, 31px);
  --t-15: 15px;
  --t-15-lh: var(--t-body-lh);
  --t-14: 14px;
  --t-14-lh: var(--t-body-lh);
  --t-small: 12px;
  --t-small-lh: 21px;
  --ls-title: 0.2em;
  --ls-body: -0.01em;
  --gutter: clamp(20px, 4.95868vw + 0.711157px, 80px);
  --w-container: 1440px;
  --bleed: var(--gutter);
  --gap-section: clamp(40px, 3.30579vw + 27.1574px, 80px);
  --gap-section-lg: clamp(50px, 4.13223vw + 33.9343px, 100px);
  --gap-48: clamp(32px, 1.32231vw + 26.893px, 48px);
  --gap-30: clamp(20px, 0.826446vw + 16.8269px, 30px);
  --pad-35: clamp(20px, 1.23967vw + 15.2153px, 35px);
  --header-h: 80px;
}
@media (min-width: 1024px) {
  body { --header-h: clamp(90px, 4.6875vw + 42.05px, 117px); }
}
@media (min-width: 1600px) {
  body { --bleed: max(var(--gutter), (100vw - var(--w-container)) / 2); }
}

/* element resets FIRST (ties with class families resolve by order) */
.dc009, .dc009 *, .dc009 *::before, .dc009 *::after { box-sizing: border-box; }
.dc009 :where(main), .dc009:where(main) { display: block; }
.dc009 :where(img), .dc009:where(img), .dc009 :where(svg), .dc009:where(svg) { display: block; max-width: 100%; }
.dc009 :where(ul), .dc009:where(ul), .dc009 :where(ol), .dc009:where(ol) { margin: 0; padding: 0; list-style: none; }
.dc009 :where(h1), .dc009:where(h1), .dc009 :where(h2), .dc009:where(h2), .dc009 :where(h3), .dc009:where(h3), .dc009 :where(h4), .dc009:where(h4), .dc009 :where(h5), .dc009:where(h5), .dc009 :where(h6), .dc009:where(h6), .dc009 :where(p), .dc009:where(p), .dc009 :where(address), .dc009:where(address) { margin: 0; font-weight: inherit; font-style: normal; }
.dc009 :where(a), .dc009:where(a) { color: inherit; text-decoration: none; }
.dc009 :where(button), .dc009:where(button), .dc009 :where(input), .dc009:where(input), .dc009 :where(textarea), .dc009:where(textarea), .dc009 :where(select), .dc009:where(select) { font: inherit; letter-spacing: inherit; color: inherit; }
.dc009 :where(.visually-hidden), .dc009:where(.visually-hidden) { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.dc009 :where(.container), .dc009:where(.container) { width: min(var(--w-container), 100% - 2 * var(--gutter)); margin: 0 auto; }
.dc009 :where(.deco), .dc009:where(.deco) { pointer-events: none; }

/* shared button family */
.dc009 :where(.btn), .dc009:where(.btn) {
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 50px; padding: 10px 25px;   /* the design's 50 (10 + 30 + 10) as a FLOOR: a label that wraps grows the button instead of printing under it */
  /* TRAILING TRACK (stage 1's rule): CSS puts a letter-space after the last character, Figma's advance does
     not, so a tracked label in a padded box measures one letter-space too wide (ENQUIRE NOW 211.3 against the
     design's 209) and every box after it shifts. Give it back out of the right padding — it scales with the
     label, unlike a fixed width. */
  padding-right: calc(25px - var(--ls-title));
  background: var(--c-gold); color: var(--c-white);
  font-family: var(--f-body); font-weight: 600; font-size: var(--t-nav); line-height: var(--t-nav-lh);
  letter-spacing: var(--ls-title); text-transform: uppercase;
  max-width: 100%;   /* a long label wraps inside the button instead of running off the frame — the first
                        build had `white-space: nowrap` here to stop a label wrapping inside a PINNED box;
                        with the box sized by the label there is nothing to guard, and the nowrap only
                        pushed a long CTA past the right edge of a phone (tools/stress.mjs at 390) */
  border: 0; cursor: pointer;
}
.dc009 :where(.btn--outline), .dc009:where(.btn--outline) { min-height: 52px; padding: 11px 26px; padding-right: calc(26px - var(--ls-title)); background: transparent; color: var(--c-white); box-shadow: inset 0 0 0 1px var(--c-white); }
.dc009 :where(.btn), .dc009:where(.btn) { transition: background-color 0.2s ease, color 0.2s ease; }
.dc009 :where(.btn):hover, .dc009:where(.btn):hover, .dc009 :where(.btn):focus-visible, .dc009:where(.btn):focus-visible { background-color: var(--c-sand); color: var(--c-black); }
.dc009 :where(.btn--outline):hover, .dc009:where(.btn--outline):hover, .dc009 :where(.btn--outline):focus-visible, .dc009:where(.btn--outline):focus-visible { background-color: var(--c-white); color: var(--panel, var(--c-black)); }
@media (prefers-reduced-motion: reduce) {
.dc009 :where(.btn), .dc009:where(.btn) { transition: none; }
}

/* inline highlight idiom */
.dc009 :where(h1), .dc009:where(h1), .dc009 :where(h2), .dc009:where(h2), .dc009 :where(.title), .dc009:where(.title) { font-family: var(--f-title); font-weight: 700; text-transform: uppercase; letter-spacing: var(--ls-title); text-wrap: balance; }
.dc009 :where(h1), .dc009:where(h1), .dc009 :where(.title--h1), .dc009:where(.title--h1) { font-size: var(--t-h1); line-height: var(--t-h1-lh); }
.dc009 :where(h2), .dc009:where(h2), .dc009 :where(.title--h2), .dc009:where(.title--h2) { font-size: var(--t-h2); line-height: var(--t-h2-lh); }
.dc009 :where(h3), .dc009:where(h3), .dc009 :where(h4), .dc009:where(h4), .dc009 :where(h5), .dc009:where(h5), .dc009 :where(h6), .dc009:where(h6) { font-size: inherit; line-height: inherit; }
.dc009 :where(.text-15), .dc009:where(.text-15) { font-size: var(--t-15); line-height: var(--t-15-lh); letter-spacing: var(--ls-body); }
.dc009 :where(.text-14), .dc009:where(.text-14) { font-size: var(--t-14); line-height: var(--t-14-lh); letter-spacing: var(--ls-body); }
.dc009 :where(.text-small), .dc009:where(.text-small) { font-size: var(--t-small); line-height: var(--t-small-lh); letter-spacing: var(--ls-body); }
.dc009 :where(.title--centred), .dc009:where(.title--centred) { text-align: center; text-indent: var(--ls-title); }
.dc009 :where(.copy), .dc009:where(.copy) { font-weight: 300; color: var(--c-bronze); }
.dc009 :where(.label), .dc009:where(.label) { font-weight: 500; color: var(--label-c, var(--c-bronze)); }
.dc009 :where(.accent), .dc009:where(.accent) { color: var(--c-gold); }
@media (min-width: 1200px) {
.dc009 :where(h1), .dc009:where(h1), .dc009 :where(h2), .dc009:where(h2), .dc009 :where(.title), .dc009:where(.title) { text-wrap: initial; }
}



/* ==== hand-maintained WP pins (measured) ================================ */
/* dc009-wp-pins.css — HAND-MAINTAINED. Measured WP-environment
   neutralizations go here; every pin cites its measurement. GOTCHAS
   §WordPress is a catalogue of HYPOTHESES measured on a specific
   version — re-verify each against your stack before adopting (D22).

   KIT BRIDGE (run-3 #014): the four system colours are gold/bronze/ink/cream
   (primary/secondary/text/accent), the rest are custom colours with our
   slugs (tools/set-kit.php); the literal fallbacks keep the page rendering
   until the kit compiles. #fff stays literal — a universal constant. */
body {
  --c-white: #ffffff;
  --c-black: var(--e-global-color-text, #000000);
  --c-gold: var(--e-global-color-primary, #9c7645);
  --c-bronze: var(--e-global-color-secondary, #906c3e);
  --c-cream: var(--e-global-color-accent, #fffaf5);
  --c-grey-100: var(--e-global-color-dc_grey_100, #f4f4f4);
  --c-sand: var(--e-global-color-dc_sand, #e6d5c5);
  --c-placeholder: var(--e-global-color-dc_placeholder, #a3a3a3);
  --c-scrim: var(--e-global-color-dc_scrim, rgba(0, 0, 0, 0.35));
  --c-atelier: var(--e-global-color-dc_atelier, #911e2d);
  --c-heritage: var(--e-global-color-dc_heritage, #5a7d57);
  --c-elements: var(--e-global-color-dc_elements, #78517c);
  --c-luxe: var(--e-global-color-dc_luxe, #127c9f);
  --c-commercial: var(--e-global-color-dc_commercial, #2d3f5b);
}

/* ---- body-level typography of stage 2, restated at the WIDGET ROOT ----------------------------------
   --emit-base drops every `body` rule by design (the theme owns body); without this every widget inherited
   the browser's serif default once Hello Elementor's sheets were switched off (measured on the first WP
   render: the collection copy and swatch names in Times). shared-responsive.css `body { … }` verbatim. */
.dc009 {
  font-family: var(--f-body);
  font-weight: 300;
  font-size: var(--t-body);
  line-height: var(--t-body-lh);
  letter-spacing: var(--ls-body);
  color: var(--c-black);
  -webkit-text-size-adjust: 100%;
}
/* anchors land under the sticky header otherwise (stage 2 put this on html, which the base cannot scope) */
html { scroll-padding-top: 80px; }
@media (min-width: 1600px) { html { scroll-padding-top: 117px; } }
/* the page's horizontal scroll guard (stage 2: body { overflow-x: hidden }) — the hero photo reaches past the frame.
   BODY ONLY: with html visible the value propagates to the viewport and body stays a non-scrolling box. Setting it
   on html AND body made body its own scroll container, and the sticky header stuck to a box that never scrolls
   (measured on the live site: no header at 600px of scroll). */
body { overflow-x: hidden; }

/* ---- Elementor's own link reset ------------------------------------------------------------------------
   frontend.min.css: `.elementor a { box-shadow: none; text-decoration: none }` at (0,1,1) beats every base rule
   (the base is all (0,1,0) by :where design). Measured on the first WP render: the five REQUEST A SAMPLE
   outline buttons lost their 1px ring (3,190 differing px, all on those rows). Mirrored at (0,2,0). */
.elementor .dc009 :where(.btn--outline) { box-shadow: inset 0 0 0 1px var(--c-white); }   /* white in both states, as the stage-2 rule */
