.elementor-980023 .elementor-element.elementor-element-8c0a16c{--display:flex;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:center;--align-items:flex-start;--gap:0px 0px;--row-gap:0px;--column-gap:0px;border-style:solid;--border-style:solid;border-width:0px 0px 1px 0px;--border-top-width:0px;--border-right-width:0px;--border-bottom-width:1px;--border-left-width:0px;border-color:var( --e-global-color-dnrule );--border-color:var( --e-global-color-dnrule );--padding-top:12px;--padding-bottom:12px;--padding-left:0px;--padding-right:0px;}.elementor-980023 .elementor-element.elementor-element-8c0a16c:not(.elementor-motion-effects-element-type-background), .elementor-980023 .elementor-element.elementor-element-8c0a16c > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-dnsurf );}.elementor-980023 .elementor-element.elementor-element-b1e02df{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--gap:22px 0px;--row-gap:22px;--column-gap:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:24px;--padding-right:24px;}.elementor-980023 .elementor-element.elementor-element-55e756d3{width:initial;max-width:initial;}.elementor-980023 .elementor-element.elementor-element-5f6b5bc7{--display:flex;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:center;--align-items:flex-start;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--padding-top:44px;--padding-bottom:44px;--padding-left:0px;--padding-right:0px;}.elementor-980023 .elementor-element.elementor-element-5f6b5bc7:not(.elementor-motion-effects-element-type-background), .elementor-980023 .elementor-element.elementor-element-5f6b5bc7 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FBFAF6;}.elementor-980023 .elementor-element.elementor-element-7e532e35{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:24px;--padding-right:24px;}.elementor-980023 .elementor-element.elementor-element-73484134{--display:flex;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--align-items:flex-start;--gap:32px 40px;--row-gap:32px;--column-gap:40px;--flex-wrap:wrap;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-980023 .elementor-element.elementor-element-33abc320{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--align-items:flex-start;--gap:12px 0px;--row-gap:12px;--column-gap:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-widget-heading .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), sans-serif;font-weight:var( --e-global-typography-primary-font-weight );line-height:var( --e-global-typography-primary-line-height );letter-spacing:var( --e-global-typography-primary-letter-spacing );color:var( --e-global-color-primary );}.elementor-980023 .elementor-element.elementor-element-6deff553{width:initial;max-width:initial;text-align:start;}.elementor-980023 .elementor-element.elementor-element-6deff553 .elementor-heading-title{font-family:"Public Sans", sans-serif;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:2.2px;color:#8C8C8C;}.elementor-980023 .elementor-element.elementor-element-30ff4714{text-align:start;}.elementor-980023 .elementor-element.elementor-element-30ff4714 .elementor-heading-title{font-family:"Fraunces", sans-serif;font-size:34px;font-weight:700;text-transform:none;line-height:1.05em;letter-spacing:-0.4px;color:var( --e-global-color-accent );}.elementor-widget-divider{--divider-color:var( --e-global-color-secondary );}.elementor-widget-divider .elementor-divider__text{color:var( --e-global-color-secondary );font-family:var( --e-global-typography-secondary-font-family ), sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );line-height:var( --e-global-typography-secondary-line-height );}.elementor-widget-divider.elementor-view-stacked .elementor-icon{background-color:var( --e-global-color-secondary );}.elementor-widget-divider.elementor-view-framed .elementor-icon, .elementor-widget-divider.elementor-view-default .elementor-icon{color:var( --e-global-color-secondary );border-color:var( --e-global-color-secondary );}.elementor-widget-divider.elementor-view-framed .elementor-icon, .elementor-widget-divider.elementor-view-default .elementor-icon svg{fill:var( --e-global-color-secondary );}.elementor-980023 .elementor-element.elementor-element-2afc9f9e{--divider-border-style:solid;--divider-color:var( --e-global-color-dnfoil );--divider-border-width:1px;}.elementor-980023 .elementor-element.elementor-element-2afc9f9e .elementor-divider-separator{width:72px;margin:0 auto;margin-left:0;}.elementor-980023 .elementor-element.elementor-element-2afc9f9e .elementor-divider{text-align:left;padding-block-start:2px;padding-block-end:2px;}.elementor-980023 .elementor-element.elementor-element-6ec3932a{text-align:start;}.elementor-980023 .elementor-element.elementor-element-6ec3932a .elementor-heading-title{font-family:"Fraunces", sans-serif;font-size:20px;font-weight:600;text-transform:none;line-height:1.12em;letter-spacing:-0.2px;color:var( --e-global-color-accent );}.elementor-widget-text-editor{font-family:var( --e-global-typography-text-font-family ), sans-serif;font-size:var( --e-global-typography-text-font-size );font-weight:var( --e-global-typography-text-font-weight );line-height:var( --e-global-typography-text-line-height );color:var( --e-global-color-text );}.elementor-widget-text-editor.elementor-drop-cap-view-stacked .elementor-drop-cap{background-color:var( --e-global-color-primary );}.elementor-widget-text-editor.elementor-drop-cap-view-framed .elementor-drop-cap, .elementor-widget-text-editor.elementor-drop-cap-view-default .elementor-drop-cap{color:var( --e-global-color-primary );border-color:var( --e-global-color-primary );}.elementor-980023 .elementor-element.elementor-element-42ee27d5{font-family:"Public Sans", sans-serif;font-size:14px;line-height:1.6em;color:var( --e-global-color-text );}.elementor-980023 .elementor-element.elementor-element-565abf8{--display:flex;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--align-items:flex-start;--gap:12px 12px;--row-gap:12px;--column-gap:12px;--flex-wrap:wrap;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-980023 .elementor-element.elementor-element-3ff2aab3{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--align-items:flex-start;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-980023 .elementor-element.elementor-element-2afbe481{text-align:start;}.elementor-980023 .elementor-element.elementor-element-2afbe481 .elementor-heading-title{font-family:"Fraunces", sans-serif;font-size:15px;font-weight:700;line-height:1.2em;color:var( --e-global-color-accent );}.elementor-980023 .elementor-element.elementor-element-4f99d82e{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--align-items:flex-start;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-980023 .elementor-element.elementor-element-318a8ec5{text-align:start;}.elementor-980023 .elementor-element.elementor-element-318a8ec5 .elementor-heading-title{font-family:"Fraunces", sans-serif;font-size:15px;font-weight:700;line-height:1.2em;color:var( --e-global-color-accent );}.elementor-980023 .elementor-element.elementor-element-56e93f6b{font-family:"Public Sans", sans-serif;font-size:12.5px;line-height:1.6em;color:var( --e-global-color-text );}.elementor-980023 .elementor-element.elementor-element-33c25cd{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--align-items:flex-start;--gap:10px 0px;--row-gap:10px;--column-gap:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-980023 .elementor-element.elementor-element-7de196de{text-align:start;}.elementor-980023 .elementor-element.elementor-element-7de196de .elementor-heading-title{font-family:"Fraunces", sans-serif;font-size:15px;font-weight:700;text-transform:uppercase;line-height:1.12em;letter-spacing:-0.2px;color:var( --e-global-color-accent );}.elementor-980023 .elementor-element.elementor-element-52e381f3{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--align-items:flex-start;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-980023 .elementor-element.elementor-element-21c27d32{width:initial;max-width:initial;}.elementor-980023 .elementor-element.elementor-element-16fb5399{--display:flex;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:center;--align-items:flex-start;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-980023 .elementor-element.elementor-element-16fb5399:not(.elementor-motion-effects-element-type-background), .elementor-980023 .elementor-element.elementor-element-16fb5399 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-dnhero );}.elementor-980023 .elementor-element.elementor-element-76f5fc64{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:24px;--padding-right:24px;}.elementor-980023 .elementor-element.elementor-element-6fa1c036{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--align-items:flex-start;--gap:4px 0px;--row-gap:4px;--column-gap:0px;--padding-top:18px;--padding-bottom:18px;--padding-left:22px;--padding-right:22px;}.elementor-980023 .elementor-element.elementor-element-594c5fd4{text-align:start;}.elementor-980023 .elementor-element.elementor-element-594c5fd4 .elementor-heading-title{font-family:"Fraunces", sans-serif;font-size:19px;font-weight:700;text-transform:uppercase;line-height:1.12em;letter-spacing:-0.2px;color:var( --e-global-color-dnwhite );}.elementor-980023 .elementor-element.elementor-element-50072a18{font-family:"Public Sans", sans-serif;font-size:13px;line-height:1.5em;color:var( --e-global-color-dnwhite );}.elementor-980023 .elementor-element.elementor-element-143b5b7f{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--align-items:flex-start;--gap:4px 0px;--row-gap:4px;--column-gap:0px;--padding-top:18px;--padding-bottom:18px;--padding-left:22px;--padding-right:22px;}.elementor-980023 .elementor-element.elementor-element-42b865d2{width:initial;max-width:initial;}.elementor-980023 .elementor-element.elementor-element-18d77b1b{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--align-items:flex-start;--gap:4px 0px;--row-gap:4px;--column-gap:0px;--padding-top:18px;--padding-bottom:18px;--padding-left:22px;--padding-right:22px;}.elementor-980023 .elementor-element.elementor-element-3cacad6c{width:initial;max-width:initial;}.elementor-980023 .elementor-element.elementor-element-2e340826{--display:flex;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:center;--align-items:flex-start;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--padding-top:40px;--padding-bottom:48px;--padding-left:0px;--padding-right:0px;}.elementor-980023 .elementor-element.elementor-element-2e340826:not(.elementor-motion-effects-element-type-background), .elementor-980023 .elementor-element.elementor-element-2e340826 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-dnsurf );}.elementor-980023 .elementor-element.elementor-element-33ec3aea{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:10px 0px;--row-gap:10px;--column-gap:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:24px;--padding-right:24px;}.elementor-980023 .elementor-element.elementor-element-439c2c19{text-align:start;}.elementor-980023 .elementor-element.elementor-element-439c2c19 .elementor-heading-title{font-family:"Fraunces", sans-serif;font-size:15px;font-weight:700;text-transform:uppercase;line-height:1.12em;letter-spacing:-0.2px;color:var( --e-global-color-accent );}.elementor-980023 .elementor-element.elementor-element-6771624{font-family:"Public Sans", sans-serif;font-size:13px;line-height:1.55em;color:var( --e-global-color-text );}.elementor-980023 .elementor-element.elementor-element-63bbca70{text-align:start;}.elementor-980023 .elementor-element.elementor-element-63bbca70 .elementor-heading-title{font-family:"Fraunces", sans-serif;font-size:15px;font-weight:700;text-transform:uppercase;line-height:1.12em;letter-spacing:-0.2px;color:var( --e-global-color-accent );}.elementor-980023 .elementor-element.elementor-element-61f26d8b{font-family:"Public Sans", sans-serif;font-size:13px;line-height:1.6em;color:var( --e-global-color-text );}@media(min-width:768px){.elementor-980023 .elementor-element.elementor-element-b1e02df{--content-width:1200px;}.elementor-980023 .elementor-element.elementor-element-7e532e35{--content-width:1200px;}.elementor-980023 .elementor-element.elementor-element-73484134{--width:100%;}.elementor-980023 .elementor-element.elementor-element-33abc320{--width:52%;}.elementor-980023 .elementor-element.elementor-element-565abf8{--width:100%;}.elementor-980023 .elementor-element.elementor-element-3ff2aab3{--width:48%;}.elementor-980023 .elementor-element.elementor-element-4f99d82e{--width:48%;}.elementor-980023 .elementor-element.elementor-element-33c25cd{--width:44%;}.elementor-980023 .elementor-element.elementor-element-52e381f3{--width:100%;}.elementor-980023 .elementor-element.elementor-element-76f5fc64{--content-width:1200px;}.elementor-980023 .elementor-element.elementor-element-6fa1c036{--width:34%;}.elementor-980023 .elementor-element.elementor-element-143b5b7f{--width:33%;}.elementor-980023 .elementor-element.elementor-element-18d77b1b{--width:33%;}.elementor-980023 .elementor-element.elementor-element-33ec3aea{--content-width:1200px;}}@media(max-width:1024px){.elementor-widget-heading .elementor-heading-title{line-height:var( --e-global-typography-primary-line-height );letter-spacing:var( --e-global-typography-primary-letter-spacing );}.elementor-widget-divider .elementor-divider__text{line-height:var( --e-global-typography-secondary-line-height );}.elementor-widget-text-editor{font-size:var( --e-global-typography-text-font-size );line-height:var( --e-global-typography-text-line-height );}}@media(max-width:767px){.elementor-widget-heading .elementor-heading-title{line-height:var( --e-global-typography-primary-line-height );letter-spacing:var( --e-global-typography-primary-letter-spacing );}.elementor-widget-divider .elementor-divider__text{line-height:var( --e-global-typography-secondary-line-height );}.elementor-widget-text-editor{font-size:var( --e-global-typography-text-font-size );line-height:var( --e-global-typography-text-line-height );}}/* Start custom CSS *//* ============================================================================ appointment-usa.css — /appointment-service-usa-select-location/ (page 22352) WPCode snippet, "Site Wide Header". EVERY page snippet loads site wide (gotcha 18), so every class here is prefixed dn-usa-. ── THE SHELL ────────────────────────────────────────────────────────────── Borrowed deliberately from /contact/: warm paper ground, guilloche watermark under the copy column, dark Fraunces left, an elevated gold-edged document card right, and a full-bleed green rail between the light bands. The earlier build put the whole fold on a saturated green field, which forced every string white, flattened the hierarchy and left a large dead void beside the card. Paper fixes all three at once. Hierarchy comes from FOUR registers, not from black-vs-white: · h1 Fraunces, sentence case, ink, large — the page · h2 pitch Fraunces, sentence case, ink, 20px/600 — the proposition · h2 title Fraunces, UPPERCASE, 15px, gold-lined — a section label · body Public Sans, --dn-body grey — prose ⚠ WOOCOMMERCE OWNS THE CARD'S INTERNALS AND ITS SELECTORS ARE SPECIFIC. Measured off the served woocommerce.css 10.8.1: .woocommerce div.product form.cart .variations select (0,4,3) .woocommerce div.product form.cart .variations td.label (0,5,3) .woocommerce div.product form.cart .variations td|th (0,4,3) .woocommerce div.product form.cart .variations (0,4,2) .woocommerce div.product form.cart .reset_variations (0,4,2) .woocommerce div.product p.price (0,3,2) .woocommerce div.product div.summary (0,2,2) The previous build styled these at (0,1,1)-(0,2,1), so EVERY rule was discarded and the selects rendered at Woo's own `min-width:75%; display:inline-block` — which is why the configuration looked like it filled half its column. Each rule below prefixes Woo's OWN chain with `.dn-usa-slot`, taking it one class higher. No !important needed. Band padding is restated at (0,2,0) + !important OUTSIDE any @media (gotcha 23). The rail carries no `.dn-section`, so it needs none — but it must restate the z-index lift and overflow clip that base would have given it. ⚠ GOTCHA 34: the kit owns the link colour — `a` (0,1,1), `a:hover` (0,2,1). Every anchor rule repeats a class to clear both, resting AND hover. Tokens (--dn-guilloche, --dn-e1/e2, --dn-gold, --dn-ease …) come from homepage.css, the shared site-wide layer. Fallbacks are given so this file stands alone. Light only. No dark mode, ever. ========================================================================= */ /* ── BAND PADDING · gotcha 23, base level, (0,2,0) + !important ───────────── */ .dn-usa-fold.dn-section { position: relative; overflow-x: clip; padding-top: clamp(30px, 1.2rem + 2vw, 52px) !important; padding-bottom: clamp(28px, 1.1rem + 1.9vw, 48px) !important; } .dn-usa-fine.dn-section { padding-top: clamp(26px, 1rem + 1.6vw, 40px) !important; padding-bottom: clamp(30px, 1.1rem + 1.9vw, 48px) !important; } /* ── CRUMB RAIL ──────────────────────────────────────────────────────────── */ /* class repeated to (0,2,0) so the rail clears the kit's `a` at (0,1,1) outright. */ .dn-usa-crumbs.dn-usa-crumbs { font-size: 12px; } .dn-usa-crumbs .dn-usa-crumbs a { color: var(--dn-body, #666666); text-decoration: none; } .dn-usa-crumbs .dn-usa-crumbs a:hover { color: var(--dn-green, #0E7A3E); text-decoration: underline; } /* ═══════════════════════════════════════════════════════════════════════════ 1 · THE FOLD ═══════════════════════════════════════════════════════════════════════════ */ /* Guilloche watermark — security printing, drawn not fetched. Left-anchored, because the right half of this band is the card. */ .dn-usa-fold::after { content: ""; position: absolute; top: -20%; left: -8%; width: 540px; height: 540px; background-image: var(--dn-guilloche); background-repeat: no-repeat; background-size: contain; opacity: 0.06; pointer-events: none; z-index: 0; } /* homepage.css lifts `.dn-section > *` to z-index 1, so the copy already clears the mark. */ .dn-usa-h1 .elementor-heading-title { font-size: clamp(1.7rem, 0.95rem + 2.2vw, 2.3rem) !important; line-height: 1.07 !important; letter-spacing: -0.025em !important; text-wrap: balance; } .dn-usa-rule .elementor-divider-separator { border-top-width: 2px !important; } .dn-usa-rule { margin: 2px 0 2px; } .dn-usa-pitch .elementor-heading-title { font-size: clamp(1rem, 0.72rem + 0.85vw, 1.25rem) !important; line-height: 1.28 !important; letter-spacing: -0.01em !important; max-width: 26ch; text-wrap: balance; } .dn-usa-worksfor ul { margin: 0; padding: 0; list-style: none; } .dn-usa-worksfor li { position: relative; padding-left: 20px; margin: 0 0 3px; line-height: 1.5; } .dn-usa-worksfor li::before { content: ""; position: absolute; left: 0; top: 0.66em; width: 11px; height: 1px; background: var(--dn-gold, #A8862E); } /* Two credential panels: white on paper, gold left edge, ink type. Equal height, left aligned — a card grid that lets its cards find their own heights reads as unfinished. */ .dn-usa-chips { margin-top: 6px; align-items: stretch; } .dn-usa-chip { padding: 11px 14px; background: #FFFFFF; border: 1px solid var(--dn-rule, #E4E4E4); border-left: 3px solid var(--dn-gold, #A8862E); border-radius: 4px; box-shadow: var(--dn-e1, 0 1px 2px rgba(20, 30, 24, 0.05)); } .dn-usa-chiptext .elementor-heading-title { font-size: 15px; line-height: 1.2; } /* The urgent note closes the column: a hairline, then quiet type. */ .dn-usa-urgent { margin-top: 4px; padding-top: 12px; border-top: 1px solid var(--dn-rule, #E4E4E4); max-width: 46ch; text-wrap: pretty; } /* ── The section label above the card ────────────────────────────────────── */ .dn-usa-forkh2 .elementor-heading-title { font-size: 15px !important; letter-spacing: 0.06em !important; line-height: 1.3 !important; } /* ── THE CONFIGURATION CARD ────────────────────────────────────────────────── A document card: gold top edge, real elevation, sitting proud of the paper — the same object as /contact/'s enquiry form. */ .dn-usa-slot { position: relative; padding: 26px 24px 22px; background: #FFFFFF; border: 1px solid var(--dn-rule, #E4E4E4); border-radius: 10px; box-shadow: var(--dn-e2, 0 2px 4px rgba(20, 30, 24, 0.07), 0 18px 38px -18px rgba(20, 30, 24, 0.28)); } .dn-usa-slot::before { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 3px; background: var(--dn-gold, #A8862E); border-radius: 10px 10px 0 0; z-index: 2; } /* [product_page id="7994"] renders the whole single-product template. The page carries its own headings, so the embed's title, gallery, breadcrumb, meta, tabs, upsells and related products go. Scoped to .dn-usa-slot so nothing here reaches the real /product/ pages. */ .dn-usa-slot .product_title, .dn-usa-slot .woocommerce-product-gallery, .dn-usa-slot .woocommerce-breadcrumb, .dn-usa-slot .product_meta, .dn-usa-slot .woocommerce-tabs, .dn-usa-slot .up-sells, .dn-usa-slot .related, .dn-usa-slot .woocommerce-product-rating { display: none !important; } /* ⚠ Every rule below extends WOO'S OWN CHAIN — see the header. ⚠ THE HALF-WIDTH SUMMARY. `woocommerce-layout.css` ships .woocommerce div.product div.summary { float:right; width:48%; clear:none } because the single-product template expects a gallery in the other half. This page hides the gallery, so 48% is just a hole. Extending Woo's chain gives (0,4,2) against its (0,3,2), which should be enough — but the rendered page showed the summary at ~42% and LEFT aligned, i.e. the float ignored while the width still applied. That is a flex/grid parent, not a specificity loss, and it means the winning declaration is not necessarily Woo's at all. The served CSS could not be re-read to settle it (the host returns an optimised copy with the page snippet stripped), so this override is unconditional instead of resting on a margin that may not exist. Scoped to .dn-usa-slot, so no real /product/ page is touched. */ .dn-usa-slot .woocommerce div.product { display: block !important; width: 100% !important; max-width: none !important; float: none !important; } .dn-usa-slot .woocommerce div.product div.summary, .dn-usa-slot .woocommerce div.product .summary.entry-summary { display: block !important; width: 100% !important; max-width: none !important; float: none !important; margin: 0 !important; padding: 0 !important; } .dn-usa-slot .woocommerce div.product form.cart { width: 100% !important; float: none !important; } /* The template's own float context, now that nothing floats inside it. */ .dn-usa-slot .woocommerce div.product::after { content: ""; display: table; clear: both; } .dn-usa-slot .woocommerce div.product p.price { font-family: Fraunces, Georgia, serif; font-size: 30px; font-weight: 700; line-height: 1; color: var(--dn-ink, #2C2C2C); margin: 0 0 4px; } .dn-usa-slot .woocommerce-product-details__short-description { font-size: 12.5px; line-height: 1.5; color: var(--dn-body, #666666); margin: 0 0 16px; padding-top: 12px; border-top: 1px solid var(--dn-rule, #E4E4E4); } .dn-usa-slot .woocommerce div.product form.cart { margin: 0; } .dn-usa-slot .woocommerce div.product form.cart .variations { width: 100%; margin: 0 0 14px; border: 0; } .dn-usa-slot .woocommerce div.product form.cart .variations td, .dn-usa-slot .woocommerce div.product form.cart .variations th { display: block; width: 100%; padding: 0; border: 0; line-height: 1.4; background: none; } .dn-usa-slot .woocommerce div.product form.cart .variations td.label { padding: 0 0 5px; } .dn-usa-slot .woocommerce div.product form.cart .variations tr { display: block; margin: 0 0 12px; } .dn-usa-slot .woocommerce div.product form.cart .variations label { display: block; font-family: "Public Sans", system-ui, sans-serif; font-size: 11px; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; color: var(--dn-body, #666666); } /* THE ONE THAT MATTERED: Woo pins these at min-width 75% and inline-block. */ .dn-usa-slot .woocommerce div.product form.cart .variations select { display: block; width: 100%; min-width: 0; max-width: 100%; margin: 0; padding: 12px 40px 12px 13px; font-family: "Public Sans", system-ui, sans-serif; font-size: 15px; color: var(--dn-ink, #2C2C2C); background-color: #FFFFFF; border: 1px solid var(--dn-rule, #E4E4E4); border-radius: 5px; transition: border-color 0.2s ease, box-shadow 0.2s ease; } .dn-usa-slot .woocommerce div.product form.cart .variations select:hover { border-color: #C9C9C9; } .dn-usa-slot .woocommerce div.product form.cart .variations select:focus { outline: none; border-color: var(--dn-green, #0E7A3E); box-shadow: 0 0 0 3px rgba(14, 122, 62, 0.16); } .dn-usa-slot .woocommerce div.product form.cart .reset_variations { visibility: visible; font-size: 12px; color: var(--dn-body, #666666); } .dn-usa-slot .woocommerce-variation-price { margin: 0 0 12px; font-size: 17px; } .dn-usa-slot .quantity { display: none; } /* Woo renders add-to-cart as a real