/* Dark teal palette. Layout and interaction styles live in styles.css. */
:root {
  color-scheme: dark;
  --paper: #091b24;
  --ink: #e9f3f7;
  --muted: #a0b6c0;
  --line: #28434f;
  --lime: #153e4a;
  --orange: #57cde2;
  --white: #f4fbff;
  --accent: #57cde2;
  --accent-hover: #88e1ef;
  --accent-ink: #08232e;
  --surface: #102630;
  --surface-raised: #142f3b;
  --surface-soft: #0d222c;
}

::selection { background: #57cde2; color: #08232e; }
.button-dark { background: var(--accent); color: var(--accent-ink); }
.button-dark:hover { background: var(--accent-hover); }
.button-outline { border-color: #496470; }
.button-outline:hover { background: #1b3c49; }
.text-link:hover, .main-nav a:hover { color: var(--accent); }
.main-nav a:hover::after { background: var(--accent); }
.status-dot, .menu-toggle span { background: var(--accent); }
.preview-bar { background: #10333e; color: #bddbe4; }
.brand-mark { stroke: var(--accent); }
.wordmark i { color: var(--accent); }
.hero-intro, .hero-notes { color: var(--muted); }
.hero-notes svg { color: var(--accent); }

/* Keep the comparison, including the original demonstration artwork, on theme. */
.hero-visual { background: var(--surface); border-color: #34515e; }
.artboard-top { border-color: #34515e; }
.artboard-top > span:last-child { color: #9ab6c1; }
.artboard-bottom { background: #122c37; border-color: #34515e; }
.tiny-arrow { color: var(--accent); }
.comparison, .raster-layer {
  background-color: #102630;
  background-image: radial-gradient(#345360 .7px, transparent .7px);
}
.raster-layer { background-color: #0e232d; }
.compare-label { background: #0b202be8; border-color: #496875; color: #d3e4ea; }
.label-after { background: #153f4b; border-color: #3f94a5; color: #8ee3f1; }
.compare-line { background: var(--accent); }
.compare-line > span {
  background: var(--accent);
  color: var(--accent-ink);
  box-shadow: 0 0 0 5px #091b2466;
}
.compare-line b { background: #08232e70; }
.canvas-coordinate { color: #9bb8c4; }
.scale-note { border-color: #34899b; background: #164552; box-shadow: 0 8px 22px #00000020; }
.scale-note .infinity, .note-plus { color: var(--accent); }

.uses-strip i, .section-kicker > span:last-child:not(.kicker-line) { color: #7eb7c6; }
.paths-art .control { stroke: #618795; }
.paths-art circle { stroke: var(--accent); }
.paths-art .curve { stroke: var(--accent); }
.paths-art circle:nth-last-child(-n+2) { fill: #57cde2; stroke: #57cde2; }
.scale-art > span { background: #153e4a; border-color: #448398; }
.files-art > span { border-color: #527584; background: #1a3643; }
.files-art > span:nth-child(2) { background: #164552; }
.files-art > span:nth-child(3) { background: #254352; }

.pricing-section { background: #0d222c; border-color: #213e4b; }
.pill { border-color: #375865; color: #c4dce5; }
.price-card { background: #102a36; border-color: #2c4b59; }
.price-card.featured { background: #123e4c; border-color: #3b9db3; }
.featured-label { background: var(--accent); color: var(--accent-ink); }
.package-number { color: #8db5c4; }
.package-shape { stroke: var(--accent); }
.package-description, .price-context, .example-line { color: #acc5cf; }
.price-context { border-color: #2c4b59; }
.featured .price-context { border-color: #376776; }
.check-list li::before { color: var(--accent); }
.price-card .button-outline { border-color: #527582; }
.pricing-footnote > span { color: #a0b6c0; }
.extras { border-color: #2c4b59; }
.extras .eyebrow { color: #8eb9c8; }
.extra-item span, .revision-note { color: #a7c0cb; }
.extra-item strong { color: #d7eef5; }
.step-number { color: #5d9cad; }
.step-number > span { color: var(--accent); }
.payment-strip > span { color: #acc3cd; }
.paypal { color: #c0d4ff; }
.paypal > span { color: #73c9f5; }
.visa { color: #ceddff; }

.file-section { background: #103440; color: #e9f5f9; border: 1px solid #2b5362; }
.file-copy > .eyebrow { color: #8fd5e3; }
.file-copy > p, .file-copy > .small-note { color: #b2ccd5; }
.file-chips span { border-color: #4c7c8c; color: #d7edf4; }
.file-copy > .text-link { color: #80daeb; }
.delivery-card { background: #102630; color: var(--ink); border: 1px solid #416572; }
.delivery-header { color: #9fbbc7; }
.file-row, .delivery-card > p { border-color: #2b4b59; }
.file-icon { border-color: #477488; background: #164252; color: #b2eaf5; }
.file-row:nth-child(3) .file-icon { background: #1b3b50; }
.file-row:nth-child(4) .file-icon { background: #1f4050; }
.file-row:nth-child(5) .file-icon { background: #1b454d; }
.file-row div span, .delivery-card > p { color: #a4bdc8; }
.file-tick { color: #69c6d9; }
.closing-section { background: #12404e; border: 1px solid #36778a; }
.closing-section .eyebrow { color: #8ed7e7; }
.closing-section p { color: #bad3dc; }
.closing-decoration { stroke: #3b7f92; }
.site-footer > div > p, .footer-bottom { color: #a0b7c2; }
.footer-bottom i { color: #67c7db; }

/* Form surfaces, selected states and messages need the same contrast as the page. */
dialog { background: var(--paper); color: var(--ink); border-color: #3b5c6b; box-shadow: 0 25px 90px #00000080; }
dialog::backdrop { background: #020c13bc; }
.icon-button { border-color: #456572; }
.demo-notice { background: #123d48; color: #b7dfe9; }
.demo-notice .status-dot { background: var(--accent); }
.form-progress li { color: #98afba; }
.form-progress b { border-color: #486977; }
.form-progress li.active { color: var(--ink); border-bottom-color: var(--accent); }
.form-progress li.active b, .form-progress li.done b { background: var(--accent); color: var(--accent-ink); border-color: var(--accent); }
.drop-zone { background: #102b37; border-color: #628b9d; }
.drop-zone.is-dragging { background: #174653; border-color: var(--accent); }
.drop-zone:focus-within { outline-color: var(--accent); }
.drop-zone > svg { stroke: var(--accent); }
.drop-zone > span, .drop-zone > small { color: #abc4cf; }
.drop-zone label { color: var(--accent); }
.uploaded-files li { background: #14323e; }
.uploaded-files .file-info > small { color: #a4bfcb; }
.form-error { color: #ffb7a3; }
.package-picker label { border-color: #42616e; }
.package-picker label:has(input:checked), .payment-choice label:has(input:checked) { background: #164655; border-color: #61b8cd; }
.package-picker small { color: #a9c5cf; }
.package-picker input, .extras-picker input, .consent input, .payment-choice input { accent-color: var(--accent); }
.form-footer > span, .optional { color: #9fb9c5; }
.field input, .field textarea, .field select { background: #102b37; border-color: #4c6c7b; color: #e9f3f7; }
.field input::placeholder, .field textarea::placeholder { color: #9bb5c2; }
.extras-picker strong { color: #a4c7d5; }
.review-card { background: #102e3a; border-color: #3e6575; }
.review-row > span:first-child { color: #a4c3d0; }
.review-total { border-color: #3c5d6d; }
.review-total strong { color: var(--accent); }
.review-card > p { color: #a4c0cb; }
.payment-choice label { border-color: #42616e; }
.consent { color: #acc6d1; }
.complete-icon { background: #164655; border-color: #3b8fa6; }
.complete-icon svg { stroke: var(--accent); }
#quote-complete > p { color: #adc8d4; }
.info-content { color: #adc7d3; }
.info-content a { color: var(--accent); }
.toast { background: #144251; color: #e9f8ff; border-color: #4a98af; }

@media (max-width: 680px) {
  .main-nav { background: #102b37; border-color: #3c6274; box-shadow: 0 10px 25px #00000040; }
}