/* Cuts4Cash presets (D45). Every rule here applies only when a preset is set (html[data-preset]) and is driven
   by the preset's tokens and data-* attributes, so one stylesheet renders every generated look. styles.css
   still provides the structure; skins.css only applies when no preset is set. */

/* ---------- Base type, width, rhythm ---------- */
[data-preset] body { font-family: var(--body); font-size: var(--fs-body-m); line-height: var(--lh); }
@media (min-width: 600px) { [data-preset] body { font-size: var(--fs-body); } }
[data-preset] .wrap { width: min(var(--wrap), 100% - 32px); }
[data-preset] .hero-copy { min-width: 0; }
[data-preset] .hero-copy h1 { font-size: var(--fs-h1); font-weight: var(--display-weight); line-height: 1.02; overflow-wrap: break-word; hyphens: auto; }
[data-preset][data-cond='yes'] .hero-copy h1 { line-height: 0.95; }
[data-preset] .band h2 { font-size: var(--fs-h2); font-weight: var(--display-weight); }
[data-preset] .screen-title { font-size: var(--fs-title); font-weight: var(--title-weight); text-transform: var(--display-case); letter-spacing: var(--display-tracking); }
[data-preset] .step-list h3, [data-preset] .visit-list h3 { font-family: var(--wide); font-stretch: var(--title-stretch); text-transform: var(--display-case); letter-spacing: var(--display-tracking); }
[data-preset] .step-list h3 { font-size: var(--fs-h3); }
[data-preset] .wordmark { font-stretch: var(--display-stretch); }
[data-preset] .hero-sub { font-size: calc(var(--fs-body) * 1.12); }
[data-preset] .price-num { font-variant-numeric: tabular-nums lining-nums; }
[data-preset][data-numerals='body-face'] .price-num { font-family: var(--body); font-stretch: 100%; font-weight: 800; }
[data-preset] .band { padding-block: var(--band-pad); }
@media (min-width: 960px) { [data-preset] .band { padding-block: var(--band-pad-lg); } }

/* ---------- Focus (never a yellow ring on light surfaces) ---------- */
[data-preset] :focus-visible { outline: 3px solid var(--focus); outline-offset: 2px; }
[data-preset] .hero :focus-visible { outline-color: var(--hero-focus); }
[data-preset] .card :focus-visible { outline-color: var(--focus); }
[data-preset][data-focus='offset-ring'] :focus-visible { outline-offset: 5px; }
[data-preset][data-focus='thick'] :focus-visible { outline-width: 4px; outline-offset: 1px; }

/* ---------- Hero: surface, height, texture ---------- */
[data-preset] .hero { background: var(--hero-bg); color: var(--hero-ink); }
[data-preset] .hero-lawn { background: none; animation: none; }
[data-preset][data-hero-h='compact'] .hero { padding-bottom: 48px; }
[data-preset][data-hero-h='tall'] .hero { padding-bottom: 128px; }
@media (min-width: 960px) {
  [data-preset][data-hero-h='compact'] .hero-grid { padding-top: 32px; }
  [data-preset][data-hero-h='tall'] .hero-grid { padding-top: 88px; }
}
[data-preset][data-texture='mower-stripes'] .hero-lawn {
  background: repeating-linear-gradient(90deg, color-mix(in oklch, var(--hero-bg), var(--tx-ink) var(--tx)) 0 64px, var(--hero-bg) 64px 128px);
}
[data-preset][data-texture='grid-paper'] .hero-lawn {
  background:
    linear-gradient(color-mix(in oklch, var(--hero-bg), var(--tx-ink) var(--tx)) 1px, transparent 1px) 0 0 / 22px 22px,
    linear-gradient(90deg, color-mix(in oklch, var(--hero-bg), var(--tx-ink) var(--tx)) 1px, transparent 1px) 0 0 / 22px 22px;
}
[data-preset][data-texture='ruler-ticks'] .hero-lawn {
  background:
    repeating-linear-gradient(90deg, var(--hero-ink) 0 1px, transparent 1px 8px) left bottom / 100% 8px no-repeat,
    repeating-linear-gradient(90deg, var(--hero-ink) 0 1px, transparent 1px 40px) left bottom / 100% 16px no-repeat;
  opacity: 0.35;
}
[data-preset][data-texture='hazard-hairline'] .hero-lawn {
  background: repeating-linear-gradient(-45deg, var(--ink) 0 12px, var(--brand) 12px 24px) left bottom / 100% 8px no-repeat;
}
[data-preset][data-texture='board-stripe'] .hero-lawn {
  background: linear-gradient(90deg, var(--brand) 0 6px, transparent 6px) left top / 100% 100% no-repeat;
}
[data-preset][data-surface='brand'][data-texture='board-stripe'] .hero-lawn { background: linear-gradient(90deg, var(--hero-ink) 0 6px, transparent 6px); opacity: .5; }
[data-preset][data-texture='grain'] .hero-lawn {
  background-image: radial-gradient(color-mix(in oklch, var(--hero-bg), var(--tx-ink) var(--tx)) 0.7px, transparent 0.8px);
  background-size: 4px 4px;
}
[data-preset][data-texture='dots'] .hero-lawn {
  background-image: radial-gradient(color-mix(in oklch, var(--hero-bg), var(--tx-ink) calc(var(--tx) * 2)) 1.4px, transparent 1.6px);
  background-size: 22px 22px;
}

/* ---------- Hero layouts ---------- */
[data-preset] .hero-art { display: none; }
[data-preset]:not([data-art='none']) .hero-art { display: block; margin-top: 22px; max-width: 440px; }
[data-preset] .hero-art svg { width: 100%; height: auto; display: block; }
@media (max-width: 599px) { [data-preset] .hero-art { display: none !important; } }

/* Centred: headline, then a wide quote card under it */
@media (min-width: 960px) {
  [data-preset][data-hero='centred'] .hero-grid { grid-template-columns: 1fr; justify-items: center; text-align: center; gap: 32px; }
  [data-preset][data-hero='centred'] .hero-copy h1, [data-preset][data-hero='centred'] .hero-detail { margin-inline: auto; }
  [data-preset][data-hero='centred'] .hero-copy h1 { max-width: 16ch; }
  [data-preset][data-hero='centred'] .card { width: min(620px, 100%); }
  [data-preset][data-hero='centred'] .hero-art { margin-inline: auto; }
  [data-preset][data-hero='centred'] .decor { justify-content: center; }
}
/* Stripe field: bolder stripes behind everything */
[data-preset][data-hero='stripe-field'] .hero-lawn {
  background: repeating-linear-gradient(90deg, color-mix(in oklch, var(--hero-bg), var(--tx-ink) 14%) 0 72px, var(--hero-bg) 72px 144px) !important;
}
/* Block / signboard / site board: the copy sits on a solid block */
@media (min-width: 960px) {
  [data-preset][data-hero='block'] .hero-copy, [data-preset][data-hero='signboard'] .hero-copy, [data-preset][data-hero='site-board'] .hero-copy {
    padding: 36px 36px 40px; border-radius: var(--radius-card);
    background: color-mix(in oklch, var(--hero-bg), var(--hero-ink) 7%);
  }
  [data-preset][data-hero='signboard'] .hero-copy h1 { max-width: 11ch; }
}
[data-preset][data-hero='signboard'] .hero-copy, [data-preset][data-hero='site-board'] .hero-copy { border-left: 8px solid var(--mark-accent); }
/* Listing card / streetscape: the drawing leads the quote card */
[data-preset][data-hero='listing-card'] .card::before, [data-preset][data-hero='quote-first-split'] .card::before {
  content: ''; display: block; height: 8px; margin: -22px -20px 20px; border-radius: var(--radius-card) var(--radius-card) 0 0; background: var(--brand);
}
@media (min-width: 520px) {
  [data-preset][data-hero='listing-card'] .card::before, [data-preset][data-hero='quote-first-split'] .card::before { margin: -28px -30px 22px; }
}
[data-preset][data-hero='streetscape-band'] .hero { padding-bottom: 0; }
[data-preset][data-hero='streetscape-band'] .hero-art { max-width: none; }
/* Editorial: hairline rule, serif-led, generous */
[data-preset][data-hero='editorial'] .hero-copy h1 { max-width: 14ch; }
[data-preset][data-hero='editorial'] .hero-copy::before { content: ''; display: block; width: 72px; height: 2px; background: var(--hero-ink); margin-bottom: 22px; }
/* Spec sheet: numbered scope and a measured feel */
[data-preset][data-hero='spec-sheet'] .hero-copy h1::after { content: ''; display: block; width: 96px; height: 6px; margin-top: 18px; background: var(--brand); }
[data-preset][data-hero='split-proof-panel'] .hero-copy h1 { max-width: 14ch; }

/* ---------- Top bar ---------- */
[data-preset] .topbar-nav a { color: var(--hero-accent); border-radius: var(--radius-btn); }
[data-preset] .topbar-nav a[aria-current='page'] { background: var(--hero-ink); color: var(--hero-bg); }
[data-preset][data-nav='underline'] .topbar-nav a { border-radius: 0; border: 0; }
[data-preset][data-nav='underline'] .topbar-nav a[aria-current='page'] { background: none; color: var(--hero-ink); box-shadow: inset 0 -3px 0 var(--mark-accent); }
[data-preset][data-nav='tabs'] .topbar-nav a { border-radius: var(--radius-ctl) var(--radius-ctl) 0 0; }
[data-preset][data-nav='tabs'] .topbar-nav a[aria-current='page'] { background: var(--card); color: var(--ink); }

/* ---------- Decor (chips, stamp) ---------- */
[data-preset] .decor { display: none; }
[data-preset][data-decor='standard'] .decor, [data-preset][data-decor='rich'] .decor { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 20px; padding: 0; list-style: none; }
[data-preset] .decor li { padding: 6px 12px; border-radius: var(--radius-btn); border: var(--bw) solid var(--hero-rule); color: var(--hero-ink); font-size: var(--s-14); font-weight: 600; }
[data-preset][data-decor='rich'] .decor li:first-child { background: var(--hero-ink); color: var(--hero-bg); border-color: transparent; }
[data-preset][data-icons='thin-line'] .decor li::before, [data-preset][data-icons='bold-line'] .decor li::before { content: '✓'; margin-right: 6px; font-weight: 400; }
[data-preset][data-icons='bold-line'] .decor li::before { font-weight: 900; }
[data-preset] .stamp { display: none; }
[data-preset][data-stamp='one'] .stamp {
  display: inline-block; margin-top: 18px; padding: 8px 14px; border: 2px solid var(--hero-ink); border-radius: 4px; transform: rotate(-2deg);
  font-family: var(--wide); font-stretch: var(--title-stretch); font-weight: 800; font-size: var(--s-14); letter-spacing: .08em; text-transform: uppercase; color: var(--hero-ink);
}

/* ---------- Quote card ---------- */
[data-preset] .card { background: var(--card); border: var(--bw) solid var(--card-border); box-shadow: var(--card-shadow); }
[data-preset][data-card='heavy-outline'] .card { border-width: 2px; }
[data-preset] .progress li.done { background: var(--accent); }
[data-preset] .progress li.now { background: var(--btn-edge); }
[data-preset] .combo input { border: var(--bw) solid var(--accent); border-radius: var(--radius-ctl); }
[data-preset][data-input='filled'] .combo input { background: var(--tint); border-color: transparent; border-bottom: 3px solid var(--accent); border-radius: var(--radius-ctl) var(--radius-ctl) 0 0; }
[data-preset][data-input='thick'] .combo input { border-width: 3px; border-color: var(--ink); }
[data-preset] .btn-go { background: var(--btn-bg); color: var(--btn-ink); border: 2px solid var(--btn-edge); box-shadow: none; font-family: var(--wide); font-stretch: var(--title-stretch); text-transform: none; }
[data-preset] .btn-go:hover { background: var(--btn-bg-press); }
[data-preset] .btn-go:not(:disabled):hover { box-shadow: none; }
[data-preset][data-button='arrow'] .btn-go:not(:disabled)::after { content: ' →'; white-space: pre; }
[data-preset][data-button='capitals'] .btn-go { text-transform: uppercase; letter-spacing: .06em; }
[data-preset] .btn-go:disabled { border-color: transparent; }
[data-preset][data-depth='hard-offset'] .card { box-shadow: 8px 8px 0 var(--hard); }
[data-preset] .choice, [data-preset] .pick span, [data-preset] .seg span { border-radius: var(--radius-ctl); }
[data-preset][data-choice='chips'] .pick span { border-radius: 999px; min-height: 48px; }
[data-preset][data-choice='list'] .pick { grid-template-columns: 1fr !important; }
[data-preset][data-choice='list'] .pick span { align-items: flex-start; text-align: left; padding-inline: 16px; min-height: 48px; }
[data-preset] .chip { background: var(--tint); color: var(--accent); border-radius: var(--radius-btn); }

/* ---------- Links ---------- */
[data-preset] .link, [data-preset] main a, [data-preset] .pc-note a { color: var(--accent); }
[data-preset][data-link='underline'] main a, [data-preset][data-link='underline'] .link { color: var(--ink); }
[data-preset][data-link='heavy-underline'] .link, [data-preset][data-link='heavy-underline'] main a { text-decoration-thickness: 3px; text-underline-offset: 4px; }

/* ---------- Headings accent ---------- */
[data-preset][data-accent='eyebrow'] .band h2::before { content: ''; display: block; width: 32px; height: 4px; margin-bottom: 14px; border-radius: 2px; background: var(--btn-edge); }
[data-preset][data-accent='bar'] .band h2::after { content: ''; display: block; width: 56px; height: 5px; margin-top: 16px; background: var(--btn-edge); }
[data-preset][data-accent='highlighter'] .band h2 { background: linear-gradient(transparent 62%, color-mix(in oklch, var(--btn-bg) 35%, transparent) 62%) left / auto no-repeat; display: inline; box-decoration-break: clone; -webkit-box-decoration-break: clone; }
[data-preset][data-accent='highlighter'] .band h2 + * { margin-top: 18px; }

/* ---------- Sections ---------- */
[data-preset] .visit { background: var(--vb-bg); color: var(--vb-ink); --hero-ink: var(--vb-ink); --hero-muted: var(--vb-muted); --hero-soft: var(--vb-muted); --hero-highlight: var(--vb-hi); --hero-rule: var(--vb-rule); }
[data-preset] .visit h2 { color: var(--vb-ink); }
[data-preset] .visit .lede, [data-preset] .visit-gear li, [data-preset] .visit-extras p { color: var(--vb-muted); }
[data-preset] .visit-list p { color: var(--vb-muted); }
[data-preset] .visit-list h3, [data-preset] .price-list strong { color: var(--vb-hi); }
[data-preset] .visit-gear strong { color: var(--vb-ink); }
[data-preset] .visit-extras h3, [data-preset] .visit-gear h3 { color: var(--vb-ink); }
[data-preset][data-rhythm='alternate'] .band.suburbs { box-shadow: 0 0 0 100vmax var(--tint); clip-path: inset(0 -100vmax); }
[data-preset][data-rhythm='framed'] main > .band.wrap { margin-block: 24px; padding-inline: clamp(20px, 4vw, 48px); background: var(--card); border: var(--bw) solid var(--rule); border-radius: var(--radius-card); }
[data-preset][data-rhythm='framed'] .visit { margin: 0; }
[data-preset] .step-list li::before, [data-preset] .pc-code { background: repeating-linear-gradient(90deg, var(--stripe-a) 0 6px, var(--stripe-b) 6px 12px); -webkit-background-clip: text; background-clip: text; color: transparent; }
[data-preset][data-depth='flat'] .step-list li::before, [data-preset][data-depth='hairline'] .step-list li::before { background: none; color: var(--stripe-a); }
[data-preset] .pc-grid, [data-preset] .faq-list { border-top-color: var(--heading); }
[data-preset] .faq-list summary { font-family: var(--body); }

/* Dividers between sections */
[data-preset][data-divider='rule'] main > .band + .band:not(.visit) { border-top: var(--bw) solid var(--rule); }
[data-preset][data-divider='stripe'] .visit { border-top: 6px solid var(--btn-edge); }
[data-preset][data-aud='trades'][data-divider='stripe'] .visit { border-top: 8px solid; border-image: repeating-linear-gradient(-45deg, var(--ink) 0 12px, var(--brand) 12px 24px) 8; }
[data-preset][data-divider='ruler-ticks'] main > .band + .band { background: repeating-linear-gradient(90deg, var(--rule) 0 1px, transparent 1px 8px) left top / 100% 8px no-repeat; }

/* Price list styles */
[data-preset][data-price='rate-card'] .visit-list { border: var(--bw) solid var(--vb-rule); border-radius: var(--radius-card); padding: 0 18px; font-variant-numeric: tabular-nums; }
[data-preset][data-price='rate-card'] .visit-list li:last-child { border-bottom: 0; }
[data-preset][data-price='cards'] .visit-list { border: 0; display: grid; gap: 12px; }
@media (min-width: 720px) { [data-preset][data-price='cards'] .visit-list { grid-template-columns: 1fr 1fr; } }
[data-preset][data-price='cards'] .visit-list li { display: block; padding: 18px; border: var(--bw) solid var(--vb-rule); border-radius: var(--radius-card); }
[data-preset][data-price='cards'] .visit-list li p { margin-top: 8px; }
[data-preset][data-aud='trades'][data-decor='rich'] .visit-list { counter-reset: scope; }
[data-preset][data-aud='trades'][data-decor='rich'] .visit-list h3::before { counter-increment: scope; content: counter(scope, decimal-leading-zero) ' '; color: var(--vb-muted); }

/* Footer */
[data-preset] .footer { background: var(--footer-bg); color: var(--footer-ink); border-top: 0; border-image: none; }
[data-preset] .footer .wordmark, [data-preset] .footer .wordmark span { color: var(--footer-head); text-shadow: none; }
[data-preset][data-footer='light'] .footer { border-top: var(--bw) solid var(--rule); }

/* ---------- Motion ---------- */
[data-preset][data-motion='none'] *, [data-preset][data-motion='none'] *::before, [data-preset][data-motion='none'] *::after { animation: none !important; transition: none !important; }
[data-preset][data-motion='none'].fx .reveal { opacity: 1; transform: none; }
[data-preset][data-motion='micro'].fx .reveal { opacity: 1; transform: none; transition: none; }
[data-preset][data-motion='micro'].fx .hero .card, [data-preset][data-motion='micro'].fx .hero-copy > * { animation: none; }
@media (prefers-reduced-motion: reduce) { [data-preset] *, [data-preset] *::before, [data-preset] *::after { animation: none !important; transition: none !important; } }

/* ---------- Tap targets (fixed, whatever the preset) ---------- */
[data-preset] .btn, [data-preset] .combo input { min-height: 52px; }
[data-preset] .suggestions li { min-height: 44px; }

/* Phones: keep the address box near the top (the hero detail is already hidden below 600px). */
@media (max-width: 599px) { [data-preset] .decor, [data-preset] .stamp { display: none !important; } }