:root {
  --ink: #080b09;
  --ink-soft: #c3c8c4;
  --blue: #8edb2c;
  --blue-bright: #afff3f;
  --sky: #171b18;
  --ice: #101311;
  --line: rgba(206, 255, 142, .16);
  --white: #f7f9f7;
  --lime: #9cf237;
  --radius: 26px;
  --shadow: 0 28px 72px rgba(0, 0, 0, .48);
  --panel: #121613;
  --panel-soft: #181d19;
  --muted: #9ba49e;
  --metal: linear-gradient(180deg, #ffffff 0%, #d5d9d6 40%, #858b87 58%, #f7f9f7 100%);
}

html { background: #080b09; }
body { color: var(--white); background: #080b09; }
body::before { content: ""; position: fixed; z-index: -1; inset: 0; pointer-events: none; opacity: .32; background-image: radial-gradient(circle at 20% 10%, rgba(156,242,55,.08), transparent 28%), radial-gradient(circle at 80% 85%, rgba(156,242,55,.05), transparent 30%), repeating-linear-gradient(135deg, rgba(255,255,255,.018) 0 1px, transparent 1px 5px); }
::selection { color: #0b1008; background: var(--lime); }

.demo-bar { color: #bfff78; background: #070a08; border-bottom: 1px solid rgba(156,242,55,.35); box-shadow: 0 8px 28px rgba(0,0,0,.36); }
.demo-editor-open { color: #071004; background: var(--lime); box-shadow: 0 0 20px rgba(156,242,55,.28); }
.demo-editor-open:hover { color: #071004; background: #bdff70; }

.theme-switcher { display: inline-flex; align-items: center; gap: 4px; padding: 3px; border: 1px solid rgba(255,255,255,.12); border-radius: 999px; background: rgba(255,255,255,.055); }
.theme-switcher button { display: inline-flex; align-items: center; gap: 6px; min-height: 27px; padding: 5px 9px; border: 0; border-radius: 999px; color: #8f9992; background: transparent; font-size: 9px; font-weight: 800; letter-spacing: .04em; cursor: pointer; transition: color .2s ease, background .2s ease, box-shadow .2s ease; }
.theme-switcher button:hover { color: #f3f5f3; }
.theme-switcher button[aria-pressed="true"] { color: #071004; background: #f5f7f5; box-shadow: 0 4px 12px rgba(0,0,0,.22); }
.theme-switcher i { width: 8px; height: 8px; border-radius: 50%; background: #9cf237; box-shadow: 0 0 8px rgba(156,242,55,.6); }
.theme-switcher [data-theme-choice="midnight"] i { background: #37d7ff; box-shadow: 0 0 8px rgba(55,215,255,.62); }
.theme-switcher [data-theme-choice="titan"] i { background: #e38a4c; box-shadow: 0 0 8px rgba(227,138,76,.6); }

.site-header { border-bottom-color: rgba(156,242,55,.16); background: rgba(8,11,9,.88); box-shadow: 0 12px 42px rgba(0,0,0,.24); }
.brand b { color: #f5f7f5; text-shadow: 0 4px 18px rgba(0,0,0,.7); }
.brand small { color: #9aa49d; }
.brand img[src="assets/logo.png"] { filter: grayscale(1) sepia(1) hue-rotate(35deg) saturate(4.2) brightness(1.3) drop-shadow(0 0 12px rgba(156,242,55,.32)); }
.main-nav a { color: #dce1dd; }
.main-nav a::after { background: var(--lime); box-shadow: 0 0 12px rgba(156,242,55,.7); }
.menu-toggle { border: 1px solid rgba(156,242,55,.2); background: #151a16; }
.menu-toggle > span:not(.sr-only) { background: var(--lime); }
.header-cta { color: #0a1107; background: var(--lime); border-color: var(--lime); }

.button { color: #0a1107; background: linear-gradient(180deg, #b8ff68, #7fd51e); border-color: #aff85b; box-shadow: 0 14px 34px rgba(117,211,28,.22), inset 0 1px 0 rgba(255,255,255,.5); }
.button:hover { color: #050803; background: linear-gradient(180deg, #cbff8f, #95e834); box-shadow: 0 18px 40px rgba(143,225,43,.32), 0 0 24px rgba(156,242,55,.18); }
.button-outline { color: #e6ebe7; background: rgba(255,255,255,.02); border-color: rgba(208,220,211,.3); box-shadow: none; }
.button-outline:hover { color: #0a1107; background: var(--lime); border-color: var(--lime); }
.text-link { color: #e9edea; border-bottom-color: rgba(156,242,55,.45); }
.text-link span { color: var(--lime); }

.eyebrow { color: #a6afa9; }
.eyebrow > span, .eyebrow.light > span { background: var(--lime); box-shadow: 0 0 12px rgba(156,242,55,.55); }
.eyebrow.light { color: #aeb7b1; }

.hero { position: relative; padding-top: 74px; color: var(--white); background: radial-gradient(circle at 12% 18%, rgba(156,242,55,.13), transparent 28%), radial-gradient(circle at 85% 25%, rgba(156,242,55,.06), transparent 28%), linear-gradient(145deg, #090c0a 0%, #141815 52%, #080a09 100%); }
.hero::before { content: ""; position: absolute; width: 520px; height: 520px; left: -270px; top: 42px; border: 2px solid rgba(156,242,55,.2); border-radius: 50%; box-shadow: 0 0 48px rgba(156,242,55,.08), inset 0 0 44px rgba(156,242,55,.05); }
.hero-grid { position: relative; z-index: 1; }
.hero h1 { color: #f0f2f0; text-shadow: 0 7px 18px rgba(0,0,0,.75); }
.hero h1 em { color: transparent; background: linear-gradient(180deg, #d2ff92 0%, #91e82d 48%, #5ea20d 55%, #beff73 100%); -webkit-background-clip: text; background-clip: text; filter: drop-shadow(0 7px 14px rgba(0,0,0,.7)); }
.hero-lead { color: #c2cac4; }
.hero-points { color: #bfc8c1; }
.hero-points span { color: #081005; background: var(--lime); box-shadow: 0 0 16px rgba(156,242,55,.38); }
.hero-visual { border: 1px solid rgba(156,242,55,.38); border-radius: 46px 10px 46px 46px; background: #101411; box-shadow: 0 38px 80px rgba(0,0,0,.55), 0 0 0 8px rgba(156,242,55,.025), inset 0 0 0 1px rgba(255,255,255,.08); }
.hero-visual::before { content: ""; position: absolute; z-index: 3; inset: 0; pointer-events: none; background: linear-gradient(135deg, rgba(156,242,55,.18), transparent 28%, transparent 70%, rgba(0,0,0,.4)); }
.hero-visual > img { filter: contrast(1.08) saturate(.78) brightness(.8); }
.image-shade { background: linear-gradient(180deg, rgba(5,8,6,.04) 35%, rgba(4,7,5,.78)); }
.hero-card { color: #eef2ef; border: 1px solid rgba(156,242,55,.2); background: rgba(12,17,13,.88); box-shadow: 0 16px 40px rgba(0,0,0,.48), inset 0 1px 0 rgba(255,255,255,.07); }
.hero-card span { color: #aeb8b0; }
.hero-card-place .pin { color: #0b1107; background: var(--lime); box-shadow: 0 0 18px rgba(156,242,55,.36); }

.trust-strip { border-color: rgba(156,242,55,.14); background: #0b0e0c; }
.trust-grid > div { border-color: rgba(156,242,55,.12); background: linear-gradient(180deg, rgba(255,255,255,.025), transparent); }
.trust-grid strong { color: var(--lime); text-shadow: 0 0 16px rgba(156,242,55,.3); }
.trust-grid span { color: #aeb7b1; }
.trust-grid span b { color: #f1f4f1; }
.review-placeholder small { color: #15220b; background: var(--lime); }

.section { background: #0d100e; }
.section-heading h2, .gallery-heading h2, .process-copy h2, .request-copy h2, .location-card h2, .social-intro h2 { color: transparent; background: var(--metal); -webkit-background-clip: text; background-clip: text; filter: drop-shadow(0 6px 10px rgba(0,0,0,.52)); }
.section-heading > p, .gallery-heading > p, .social-intro > p { color: #aab3ad; }

.service-card { border-color: rgba(156,242,55,.16); color: #f3f6f4; background: linear-gradient(150deg, #1a1f1b, #0f1310); box-shadow: 0 22px 48px rgba(0,0,0,.25), inset 0 1px 0 rgba(255,255,255,.04); }
.service-card:hover { border-color: rgba(156,242,55,.5); box-shadow: 0 28px 58px rgba(0,0,0,.42), 0 0 30px rgba(156,242,55,.08); }
.service-card.dark { color: #f6f8f6; border-color: rgba(156,242,55,.5); background: radial-gradient(circle at 20% 10%, rgba(156,242,55,.12), transparent 34%), linear-gradient(145deg, #151a16, #080b09); }
.service-number { color: #78837c; }
.service-icon { color: var(--lime); border-color: rgba(156,242,55,.42); background: rgba(156,242,55,.045); box-shadow: 0 0 24px rgba(156,242,55,.08), inset 0 0 16px rgba(156,242,55,.04); }
.dark .service-icon { color: var(--lime); border-color: rgba(156,242,55,.5); }
.service-card p, .dark p { color: #aab4ad; }
.service-card a span, .dark a span { color: var(--lime); }

.process-section { background: linear-gradient(135deg, #050706, #111512); }
.process-media { border-right: 1px solid rgba(156,242,55,.15); }
.process-media img { filter: grayscale(.15) saturate(.7) brightness(.72) contrast(1.12); }
.process-media::after { background: linear-gradient(90deg, rgba(8,11,9,.08) 45%, #090c0a); }
.media-label { border-color: var(--lime); background: rgba(6,10,7,.88); box-shadow: 0 16px 36px rgba(0,0,0,.4); }
.media-label span, .steps p { color: #9da8a0; }
.steps li { border-color: rgba(156,242,55,.14); }
.steps > li > span { color: #0a1107; background: var(--lime); box-shadow: 0 0 18px rgba(156,242,55,.24); }
.button-light { color: #0a1107; background: var(--lime); border-color: var(--lime); }

.pricing-section { background: radial-gradient(circle at 78% 18%, rgba(156,242,55,.07), transparent 24%), #111512; }
.price-card { color: #f1f4f1; border-color: rgba(156,242,55,.16); background: linear-gradient(160deg, #1a1f1b, #0d100e); box-shadow: 0 22px 50px rgba(0,0,0,.28); }
.price-card.featured { color: #f8faf8; border-color: rgba(156,242,55,.58); background: radial-gradient(circle at 50% 0, rgba(156,242,55,.16), transparent 38%), linear-gradient(160deg, #192017, #0a0d0b); box-shadow: 0 30px 68px rgba(0,0,0,.48), 0 0 34px rgba(156,242,55,.09); }
.price-kicker, .featured .price-kicker { color: #9aa59d; }
.price { border-color: rgba(156,242,55,.15); }
.featured .price { border-color: rgba(156,242,55,.25); }
.price strong { color: transparent; background: var(--metal); -webkit-background-clip: text; background-clip: text; }
.price-card ul, .featured ul { color: #aab4ad; }
.price-card li::before, .featured li::before { color: var(--lime); }
.featured .button { color: #091006; background: var(--lime); border-color: var(--lime); }
.price-note { color: #818b85; }

.gallery-section { background: radial-gradient(circle at 20% 0, rgba(156,242,55,.07), transparent 26%), #070a08; }
.gallery-grid figure { border: 1px solid rgba(156,242,55,.2); background: #111512; box-shadow: 0 28px 58px rgba(0,0,0,.34); }
.gallery-grid img { filter: saturate(.78) contrast(1.08) brightness(.8); }
.gallery-grid figure:hover img { filter: saturate(.95) contrast(1.08) brightness(.9); }
.gallery-grid figcaption { border: 1px solid rgba(156,242,55,.18); background: rgba(7,11,8,.86); }
.gallery-grid figcaption span { color: var(--lime); }

.social-section { background: radial-gradient(circle at 85% 20%, rgba(156,242,55,.08), transparent 28%), linear-gradient(145deg, #121613, #080b09); }
.social-proof { border-color: rgba(156,242,55,.18); }
.social-proof > span { color: #091006; background: var(--lime); box-shadow: 0 0 20px rgba(156,242,55,.22); }
.social-proof small { color: #8e9991; }
.social-card, .instagram-card { border: 1px solid rgba(156,242,55,.26); background: radial-gradient(circle at 20% 0, rgba(156,242,55,.12), transparent 32%), linear-gradient(155deg, #171c18 0%, #090c0a 100%); box-shadow: 0 28px 62px rgba(0,0,0,.4); }
a.social-card:hover { border-color: rgba(156,242,55,.62); box-shadow: 0 34px 72px rgba(0,0,0,.52), 0 0 30px rgba(156,242,55,.1); }
.social-logo { border-color: rgba(156,242,55,.32); color: var(--lime); background: rgba(156,242,55,.06); }
.social-arrow { color: #0a1107; background: var(--lime); }
.social-preview { border: 1px solid rgba(255,255,255,.08); }
.social-preview img { filter: saturate(.72) contrast(1.08) brightness(.78); }
.social-card-copy > span { color: #8f9b93; }
.social-card-copy p { color: #9ba59e; }
.social-card-copy strong { border-color: rgba(156,242,55,.16); color: #edf1ee; }

.faq-section { background: #0c0f0d; }
.accordion details { border-color: rgba(156,242,55,.14); }
.accordion summary { color: #edf1ee; }
.accordion summary span { color: #0a1107; background: var(--lime); }
.accordion details p { color: #9da8a0; }

.request-section { background: radial-gradient(circle at 12% 18%, rgba(156,242,55,.1), transparent 30%), linear-gradient(135deg, #080b09, #151a16); border-block: 1px solid rgba(156,242,55,.13); }
.request-copy p { color: #aab4ad; }
.contact-chips a { border-color: rgba(156,242,55,.2); background: rgba(255,255,255,.025); }
.contact-chips small { color: #89958c; }
.request-form { color: #f1f4f1; border: 1px solid rgba(156,242,55,.2); background: linear-gradient(160deg, #1a1f1b, #0c100d); box-shadow: 0 30px 76px rgba(0,0,0,.52); }
.request-form label small { color: #8c978f; }
.request-form input, .request-form select, .request-form textarea { color: #edf1ee; border-color: rgba(156,242,55,.14); background: #0b0f0c; }
.request-form input::placeholder, .request-form textarea::placeholder { color: #667069; }
.request-form input:focus, .request-form select:focus, .request-form textarea:focus { border-color: var(--lime); box-shadow: 0 0 0 3px rgba(156,242,55,.1); }
.upload-box { border-color: rgba(156,242,55,.35); background: rgba(156,242,55,.025); }
.upload-icon { color: #0a1107; background: var(--lime); }
.upload-box strong, .consent span { color: #909b93; }
.consent a { color: var(--lime); }
.form-status { color: var(--lime); }

.location-section { background: #101411; }
.location-grid { border: 1px solid rgba(156,242,55,.18); background: #0d110e; box-shadow: 0 32px 76px rgba(0,0,0,.42); }
.location-card { background: linear-gradient(150deg, #171c18, #0c100d); }
.location-card dl > div { border-color: rgba(156,242,55,.14); }
.location-card dt { color: #8e9991; }
.map-visual { background: radial-gradient(circle at 55% 45%, rgba(156,242,55,.13), transparent 24%), linear-gradient(145deg, #202820, #0d120e); }
.map-visual::before, .map-visual::after { border-color: rgba(156,242,55,.12); }
.road { border-color: #354137; background: #172019; box-shadow: 0 0 0 1px rgba(156,242,55,.08); }
.map-town { color: #818c84; }
.map-pin { color: #edf1ee; border: 1px solid rgba(156,242,55,.24); background: #101511; box-shadow: 0 24px 48px rgba(0,0,0,.48); }
.map-pin i { border-color: var(--lime); box-shadow: 0 0 16px rgba(156,242,55,.2); }
.map-pin small { color: #8e9991; }
.map-note { color: #929d95; border: 1px solid rgba(156,242,55,.14); background: rgba(8,12,9,.84); }

.site-footer { background: #050706; border-top: 1px solid rgba(156,242,55,.14); }
.footer-brand small, .footer-top p { color: #89958c; }
.footer-phone span { color: var(--lime); }
.footer-bottom { color: #758078; border-color: rgba(156,242,55,.12); }
.footer-bottom a:hover { color: var(--lime); }
.mobile-actions { background: #1b241d; }
.mobile-actions a { color: #f2f5f2; background: #0b0f0c; }
.mobile-actions a:last-child { color: #081005; background: var(--lime); }

.editor-overlay { background: rgba(2,5,3,.72); }
.demo-editor { color: #edf1ee; background: #0d110e; box-shadow: -30px 0 90px rgba(0,0,0,.7); }
.editor-head { border-color: rgba(156,242,55,.14); }
.editor-head > div > span { color: var(--lime); }
.editor-close { color: #edf1ee; border-color: rgba(156,242,55,.18); background: #171c18; }
.editor-note { color: #dfffc0; border-color: rgba(156,242,55,.32); background: rgba(156,242,55,.08); }
.editor-note p { color: #aabb9e; }
.editor-group { border-color: rgba(156,242,55,.16); background: #151a16; }
.editor-help, .editor-field > span, .editor-icon-grid label > span { color: #919d94; }
.editor-logo-preview { border-color: rgba(156,242,55,.16); background: #0a0e0b; }
.editor-logo-preview img { filter: none; }
.editor-file-button, .editor-secondary { color: #edf1ee; border-color: rgba(156,242,55,.25); background: #0e120f; }
.editor-text-button { color: var(--lime); }
.editor-field input, .editor-icon-grid input { color: #edf1ee; border-color: rgba(156,242,55,.14); background: #0a0e0b; }
.editor-section-item { border-color: rgba(156,242,55,.14); background: #0d110e; }
.editor-drag { color: #738078; }
.editor-section-buttons button { color: var(--lime); border-color: rgba(156,242,55,.18); background: #181d19; }
.editor-primary { color: #081005; background: var(--lime); }
.editor-reset-all { color: #ff8b82; }
.editor-status { color: var(--lime); }

@media (max-width: 1040px) {
  .main-nav { border-color: rgba(156,242,55,.18); background: #0d110e; }
  .main-nav a { border-color: rgba(156,242,55,.12); }
}

@media (max-width: 760px) {
  .demo-bar { padding-inline: 9px; }
  .demo-bar-inner > span { display: none; }
  .theme-switcher { flex: 1 1 auto; justify-content: center; }
  .theme-switcher button { flex: 1 1 auto; justify-content: center; padding-inline: 6px; }
  .hero { padding-top: 48px; }
  .hero::before { width: 330px; height: 330px; left: -210px; top: 80px; }
  .hero-visual { border-radius: 30px 8px 30px 30px; }
  .process-media::after { background: linear-gradient(180deg, transparent 45%, #090c0a); }
  .price-card.featured { box-shadow: 0 24px 54px rgba(0,0,0,.42), 0 0 22px rgba(156,242,55,.07); }
}

/* Three live art directions -------------------------------------------------
   Graphit is the recommended craft-led original. Midnight and Titan keep the
   same content so the design can be compared without moving the goalposts. */

html[data-theme="midnight"] {
  --ink: #07111e;
  --ink-soft: #c4d2df;
  --blue: #37d7ff;
  --blue-bright: #77e7ff;
  --sky: #11253a;
  --ice: #0b1928;
  --line: rgba(55,215,255,.18);
  --white: #f2f7ff;
  --lime: #37d7ff;
  --panel: #0d1c2c;
  --panel-soft: #11253a;
  --muted: #98adbf;
  --metal: linear-gradient(180deg, #ffffff 0%, #d8e8f7 42%, #71869b 58%, #f5fbff 100%);
}

html[data-theme="titan"] {
  --ink: #151310;
  --ink-soft: #d2c7ba;
  --blue: #e38a4c;
  --blue-bright: #ffad70;
  --sky: #2b251f;
  --ice: #1a1713;
  --line: rgba(227,138,76,.2);
  --white: #f7f1e8;
  --lime: #e38a4c;
  --panel: #211d18;
  --panel-soft: #2b251f;
  --muted: #b8aa98;
  --metal: linear-gradient(180deg, #fff8ed 0%, #dfd3c3 40%, #8f806e 58%, #fff5e7 100%);
}

html[data-theme="midnight"], html[data-theme="titan"] { background: var(--ink); }
html[data-theme="midnight"] body, html[data-theme="titan"] body { color: var(--white); background: var(--ink); }
html[data-theme="midnight"] body::before, html[data-theme="titan"] body::before { opacity: .42; background-image: radial-gradient(circle at 18% 8%, color-mix(in srgb, var(--lime) 15%, transparent), transparent 27%), radial-gradient(circle at 82% 86%, color-mix(in srgb, var(--lime) 9%, transparent), transparent 30%), repeating-linear-gradient(135deg, rgba(255,255,255,.018) 0 1px, transparent 1px 5px); }
html[data-theme="midnight"] ::selection, html[data-theme="titan"] ::selection { color: var(--ink); background: var(--lime); }

html[data-theme="midnight"] .demo-bar, html[data-theme="titan"] .demo-bar { color: var(--lime); background: color-mix(in srgb, var(--ink) 86%, #000); border-bottom-color: color-mix(in srgb, var(--lime) 34%, transparent); }
html[data-theme="midnight"] .demo-editor-open, html[data-theme="titan"] .demo-editor-open { color: var(--ink); background: var(--lime); box-shadow: 0 0 20px color-mix(in srgb, var(--lime) 27%, transparent); }
html[data-theme="midnight"] .theme-switcher button[aria-pressed="true"], html[data-theme="titan"] .theme-switcher button[aria-pressed="true"] { color: var(--ink); background: var(--white); }

html[data-theme="midnight"] .site-header, html[data-theme="titan"] .site-header { border-bottom-color: var(--line); background: color-mix(in srgb, var(--ink) 88%, transparent); }
html[data-theme="midnight"] .brand b, html[data-theme="titan"] .brand b { color: var(--white); }
html[data-theme="midnight"] .brand small, html[data-theme="titan"] .brand small { color: var(--muted); }
html[data-theme="midnight"] .brand img[src="assets/logo.png"] { filter: grayscale(1) sepia(1) hue-rotate(145deg) saturate(5) brightness(1.45) drop-shadow(0 0 12px rgba(55,215,255,.32)); }
html[data-theme="titan"] .brand img[src="assets/logo.png"] { filter: grayscale(1) sepia(1) hue-rotate(330deg) saturate(3.5) brightness(1.3) drop-shadow(0 0 12px rgba(227,138,76,.3)); }
html[data-theme="midnight"] .main-nav a, html[data-theme="titan"] .main-nav a { color: color-mix(in srgb, var(--white) 88%, var(--muted)); }
html[data-theme="midnight"] .main-nav a::after, html[data-theme="titan"] .main-nav a::after { background: var(--lime); box-shadow: 0 0 12px color-mix(in srgb, var(--lime) 70%, transparent); }
html[data-theme="midnight"] .menu-toggle, html[data-theme="titan"] .menu-toggle { border-color: var(--line); background: var(--panel); }
html[data-theme="midnight"] .menu-toggle > span:not(.sr-only), html[data-theme="titan"] .menu-toggle > span:not(.sr-only) { background: var(--lime); }

html[data-theme="midnight"] .button, html[data-theme="titan"] .button { color: var(--ink); border-color: var(--lime); background: linear-gradient(180deg, color-mix(in srgb, var(--lime) 75%, #fff), var(--lime)); box-shadow: 0 14px 34px color-mix(in srgb, var(--lime) 22%, transparent), inset 0 1px 0 rgba(255,255,255,.5); }
html[data-theme="midnight"] .button-outline, html[data-theme="titan"] .button-outline { color: var(--white); border-color: color-mix(in srgb, var(--white) 28%, transparent); background: rgba(255,255,255,.018); box-shadow: none; }
html[data-theme="midnight"] .button-outline:hover, html[data-theme="titan"] .button-outline:hover { color: var(--ink); border-color: var(--lime); background: var(--lime); }
html[data-theme="midnight"] .text-link, html[data-theme="titan"] .text-link { color: var(--white); border-bottom-color: color-mix(in srgb, var(--lime) 46%, transparent); }
html[data-theme="midnight"] .text-link span, html[data-theme="titan"] .text-link span { color: var(--lime); }

html[data-theme="midnight"] .eyebrow, html[data-theme="titan"] .eyebrow { color: var(--muted); }
html[data-theme="midnight"] .eyebrow > span, html[data-theme="titan"] .eyebrow > span { background: var(--lime); box-shadow: 0 0 12px color-mix(in srgb, var(--lime) 54%, transparent); }
html[data-theme="midnight"] .hero, html[data-theme="titan"] .hero { color: var(--white); background: radial-gradient(circle at 12% 18%, color-mix(in srgb, var(--lime) 14%, transparent), transparent 28%), radial-gradient(circle at 85% 25%, color-mix(in srgb, var(--lime) 7%, transparent), transparent 28%), linear-gradient(145deg, var(--ink), var(--panel) 52%, color-mix(in srgb, var(--ink) 86%, #000)); }
html[data-theme="midnight"] .hero::before, html[data-theme="titan"] .hero::before { border-color: color-mix(in srgb, var(--lime) 22%, transparent); box-shadow: 0 0 48px color-mix(in srgb, var(--lime) 8%, transparent), inset 0 0 44px color-mix(in srgb, var(--lime) 6%, transparent); }
html[data-theme="midnight"] .hero h1, html[data-theme="titan"] .hero h1 { color: var(--white); }
html[data-theme="midnight"] .hero h1 em, html[data-theme="titan"] .hero h1 em { background: linear-gradient(180deg, color-mix(in srgb, var(--lime) 55%, #fff), var(--lime) 48%, color-mix(in srgb, var(--lime) 58%, #000) 56%, color-mix(in srgb, var(--lime) 72%, #fff)); -webkit-background-clip: text; background-clip: text; }
html[data-theme="midnight"] .hero-lead, html[data-theme="titan"] .hero-lead, html[data-theme="midnight"] .hero-points, html[data-theme="titan"] .hero-points { color: var(--ink-soft); }
html[data-theme="midnight"] .hero-points span, html[data-theme="titan"] .hero-points span { color: var(--ink); background: var(--lime); box-shadow: 0 0 16px color-mix(in srgb, var(--lime) 36%, transparent); }
html[data-theme="midnight"] .hero-visual, html[data-theme="titan"] .hero-visual { border-color: color-mix(in srgb, var(--lime) 40%, transparent); background: var(--panel); box-shadow: 0 38px 80px rgba(0,0,0,.55), 0 0 0 8px color-mix(in srgb, var(--lime) 3%, transparent), inset 0 0 0 1px rgba(255,255,255,.08); }
html[data-theme="midnight"] .hero-visual { border-radius: 12px 48px 12px 48px; }
html[data-theme="titan"] .hero-visual { border-radius: 34px 6px 34px 6px; }
html[data-theme="midnight"] .hero-visual::before, html[data-theme="titan"] .hero-visual::before { background: linear-gradient(135deg, color-mix(in srgb, var(--lime) 18%, transparent), transparent 28%, transparent 70%, rgba(0,0,0,.42)); }
html[data-theme="midnight"] .hero-visual > img { filter: contrast(1.12) saturate(.7) brightness(.72) hue-rotate(5deg); }
html[data-theme="titan"] .hero-visual > img { filter: contrast(1.06) saturate(.62) brightness(.76) sepia(.14); }
html[data-theme="midnight"] .hero-card, html[data-theme="titan"] .hero-card { color: var(--white); border-color: var(--line); background: color-mix(in srgb, var(--panel) 90%, transparent); }
html[data-theme="midnight"] .hero-card span, html[data-theme="titan"] .hero-card span { color: var(--muted); }
html[data-theme="midnight"] .hero-card-place .pin, html[data-theme="titan"] .hero-card-place .pin { color: var(--ink); background: var(--lime); }

html[data-theme="midnight"] .trust-strip, html[data-theme="titan"] .trust-strip { border-color: var(--line); background: color-mix(in srgb, var(--ink) 92%, #000); }
html[data-theme="midnight"] .trust-grid > div, html[data-theme="titan"] .trust-grid > div { border-color: var(--line); }
html[data-theme="midnight"] .trust-grid strong, html[data-theme="titan"] .trust-grid strong { color: var(--lime); }
html[data-theme="midnight"] .trust-grid span, html[data-theme="titan"] .trust-grid span { color: var(--muted); }
html[data-theme="midnight"] .trust-grid span b, html[data-theme="titan"] .trust-grid span b { color: var(--white); }

html[data-theme="midnight"] .section, html[data-theme="titan"] .section { background: color-mix(in srgb, var(--ink) 94%, #fff); }
html[data-theme="midnight"] .section-heading h2, html[data-theme="midnight"] .gallery-heading h2, html[data-theme="midnight"] .process-copy h2, html[data-theme="midnight"] .request-copy h2, html[data-theme="midnight"] .location-card h2, html[data-theme="midnight"] .social-intro h2,
html[data-theme="titan"] .section-heading h2, html[data-theme="titan"] .gallery-heading h2, html[data-theme="titan"] .process-copy h2, html[data-theme="titan"] .request-copy h2, html[data-theme="titan"] .location-card h2, html[data-theme="titan"] .social-intro h2 { background: var(--metal); -webkit-background-clip: text; background-clip: text; }
html[data-theme="midnight"] .section-heading > p, html[data-theme="midnight"] .gallery-heading > p, html[data-theme="midnight"] .social-intro > p,
html[data-theme="titan"] .section-heading > p, html[data-theme="titan"] .gallery-heading > p, html[data-theme="titan"] .social-intro > p { color: var(--muted); }
html[data-theme="midnight"] .service-card, html[data-theme="titan"] .service-card { position: relative; color: var(--white); border-color: var(--line); background: linear-gradient(150deg, var(--panel-soft), var(--panel)); box-shadow: 0 22px 48px rgba(0,0,0,.25), inset 0 1px 0 rgba(255,255,255,.04); }
html[data-theme="midnight"] .service-card.dark, html[data-theme="titan"] .service-card.dark { color: var(--white); border-color: color-mix(in srgb, var(--lime) 50%, transparent); background: radial-gradient(circle at 20% 10%, color-mix(in srgb, var(--lime) 12%, transparent), transparent 34%), linear-gradient(145deg, var(--panel), var(--ink)); }
html[data-theme="midnight"] .service-icon, html[data-theme="titan"] .service-icon { color: var(--lime); border-color: color-mix(in srgb, var(--lime) 42%, transparent); background: color-mix(in srgb, var(--lime) 5%, transparent); }
html[data-theme="midnight"] .service-icon { width: 58px; height: 58px; margin: 24px 0 14px; border-radius: 16px; font-size: 30px; }
html[data-theme="midnight"] .service-card h3 { margin-top: 14px; }
html[data-theme="titan"] .service-icon { width: 68px; height: 48px; margin: 28px 0 16px; border-radius: 999px; font-size: 27px; }
html[data-theme="titan"] .service-card h3 { margin-top: 18px; font-family: Georgia, "Times New Roman", serif; font-weight: 600; }
html[data-theme="midnight"] .service-card p, html[data-theme="midnight"] .dark p, html[data-theme="titan"] .service-card p, html[data-theme="titan"] .dark p { color: var(--muted); }
html[data-theme="midnight"] .service-card a span, html[data-theme="titan"] .service-card a span { color: var(--lime); }

html[data-theme="midnight"] .process-section, html[data-theme="titan"] .process-section { background: linear-gradient(135deg, color-mix(in srgb, var(--ink) 90%, #000), var(--panel)); }
html[data-theme="midnight"] .process-media, html[data-theme="titan"] .process-media { border-color: var(--line); }
html[data-theme="midnight"] .process-media::after, html[data-theme="titan"] .process-media::after { background: linear-gradient(90deg, transparent 45%, var(--ink)); }
html[data-theme="midnight"] .steps li, html[data-theme="titan"] .steps li { border-color: var(--line); }
html[data-theme="midnight"] .steps > li > span, html[data-theme="titan"] .steps > li > span { color: var(--ink); background: var(--lime); }
html[data-theme="midnight"] .steps p, html[data-theme="titan"] .steps p { color: var(--muted); }

html[data-theme="midnight"] .pricing-section, html[data-theme="titan"] .pricing-section { background: radial-gradient(circle at 78% 18%, color-mix(in srgb, var(--lime) 8%, transparent), transparent 24%), var(--panel); }
html[data-theme="midnight"] .price-card, html[data-theme="titan"] .price-card { color: var(--white); border-color: var(--line); background: linear-gradient(160deg, var(--panel-soft), var(--panel)); }
html[data-theme="midnight"] .price-card.featured, html[data-theme="titan"] .price-card.featured { color: var(--white); border-color: color-mix(in srgb, var(--lime) 58%, transparent); background: radial-gradient(circle at 50% 0, color-mix(in srgb, var(--lime) 16%, transparent), transparent 38%), linear-gradient(160deg, var(--panel-soft), var(--ink)); box-shadow: 0 30px 68px rgba(0,0,0,.48), 0 0 34px color-mix(in srgb, var(--lime) 9%, transparent); }
html[data-theme="midnight"] .price-kicker, html[data-theme="midnight"] .price-card ul, html[data-theme="titan"] .price-kicker, html[data-theme="titan"] .price-card ul { color: var(--muted); }
html[data-theme="midnight"] .price, html[data-theme="titan"] .price { border-color: var(--line); }
html[data-theme="midnight"] .price strong, html[data-theme="titan"] .price strong { background: var(--metal); -webkit-background-clip: text; background-clip: text; }
html[data-theme="midnight"] .price-card li::before, html[data-theme="titan"] .price-card li::before { color: var(--lime); }

html[data-theme="midnight"] .gallery-section, html[data-theme="titan"] .gallery-section { background: radial-gradient(circle at 20% 0, color-mix(in srgb, var(--lime) 7%, transparent), transparent 26%), color-mix(in srgb, var(--ink) 90%, #000); }
html[data-theme="midnight"] .gallery-grid figure, html[data-theme="titan"] .gallery-grid figure { border-color: var(--line); background: var(--panel); }
html[data-theme="midnight"] .gallery-grid figcaption, html[data-theme="titan"] .gallery-grid figcaption { border-color: var(--line); background: color-mix(in srgb, var(--ink) 88%, transparent); }
html[data-theme="midnight"] .gallery-grid figcaption span, html[data-theme="titan"] .gallery-grid figcaption span { color: var(--lime); }

html[data-theme="midnight"] .social-section, html[data-theme="titan"] .social-section { background: radial-gradient(circle at 85% 20%, color-mix(in srgb, var(--lime) 8%, transparent), transparent 28%), linear-gradient(145deg, var(--panel), var(--ink)); }
html[data-theme="midnight"] .social-proof, html[data-theme="titan"] .social-proof { border-color: var(--line); }
html[data-theme="midnight"] .social-proof > span, html[data-theme="titan"] .social-proof > span, html[data-theme="midnight"] .social-arrow, html[data-theme="titan"] .social-arrow { color: var(--ink); background: var(--lime); }
html[data-theme="midnight"] .social-card, html[data-theme="titan"] .social-card { border-color: color-mix(in srgb, var(--lime) 26%, transparent); background: radial-gradient(circle at 20% 0, color-mix(in srgb, var(--lime) 12%, transparent), transparent 32%), linear-gradient(155deg, var(--panel-soft), var(--ink)); }
html[data-theme="midnight"] .social-logo, html[data-theme="titan"] .social-logo { color: var(--lime); border-color: color-mix(in srgb, var(--lime) 32%, transparent); background: color-mix(in srgb, var(--lime) 6%, transparent); }
html[data-theme="midnight"] .social-logo { border-radius: 14px; }
html[data-theme="titan"] .social-logo { border-radius: 50%; }
html[data-theme="midnight"] .social-card-copy > span, html[data-theme="midnight"] .social-card-copy p, html[data-theme="titan"] .social-card-copy > span, html[data-theme="titan"] .social-card-copy p { color: var(--muted); }

html[data-theme="midnight"] .faq-section, html[data-theme="titan"] .faq-section { background: color-mix(in srgb, var(--ink) 94%, #fff); }
html[data-theme="midnight"] .accordion details, html[data-theme="titan"] .accordion details { border-color: var(--line); }
html[data-theme="midnight"] .accordion summary, html[data-theme="titan"] .accordion summary { color: var(--white); }
html[data-theme="midnight"] .accordion summary span, html[data-theme="titan"] .accordion summary span { color: var(--ink); background: var(--lime); }
html[data-theme="midnight"] .accordion details p, html[data-theme="titan"] .accordion details p { color: var(--muted); }

html[data-theme="midnight"] .request-section, html[data-theme="titan"] .request-section { border-color: var(--line); background: radial-gradient(circle at 12% 18%, color-mix(in srgb, var(--lime) 10%, transparent), transparent 30%), linear-gradient(135deg, var(--ink), var(--panel-soft)); }
html[data-theme="midnight"] .request-copy p, html[data-theme="titan"] .request-copy p { color: var(--muted); }
html[data-theme="midnight"] .contact-chips a, html[data-theme="titan"] .contact-chips a { border-color: var(--line); }
html[data-theme="midnight"] .request-form, html[data-theme="titan"] .request-form { color: var(--white); border-color: var(--line); background: linear-gradient(160deg, var(--panel-soft), var(--panel)); }
html[data-theme="midnight"] .request-form input, html[data-theme="midnight"] .request-form select, html[data-theme="midnight"] .request-form textarea,
html[data-theme="titan"] .request-form input, html[data-theme="titan"] .request-form select, html[data-theme="titan"] .request-form textarea { color: var(--white); border-color: var(--line); background: var(--ink); }
html[data-theme="midnight"] .request-form input:focus, html[data-theme="midnight"] .request-form select:focus, html[data-theme="midnight"] .request-form textarea:focus,
html[data-theme="titan"] .request-form input:focus, html[data-theme="titan"] .request-form select:focus, html[data-theme="titan"] .request-form textarea:focus { border-color: var(--lime); box-shadow: 0 0 0 3px color-mix(in srgb, var(--lime) 11%, transparent); }
html[data-theme="midnight"] .upload-box, html[data-theme="titan"] .upload-box { border-color: color-mix(in srgb, var(--lime) 35%, transparent); background: color-mix(in srgb, var(--lime) 3%, transparent); }
html[data-theme="midnight"] .upload-icon, html[data-theme="titan"] .upload-icon { color: var(--ink); background: var(--lime); }

html[data-theme="midnight"] .location-section, html[data-theme="titan"] .location-section { background: var(--panel); }
html[data-theme="midnight"] .location-grid, html[data-theme="titan"] .location-grid { border-color: var(--line); background: var(--ink); }
html[data-theme="midnight"] .location-card, html[data-theme="titan"] .location-card { background: linear-gradient(150deg, var(--panel-soft), var(--panel)); }
html[data-theme="midnight"] .location-card dl > div, html[data-theme="titan"] .location-card dl > div { border-color: var(--line); }
html[data-theme="midnight"] .location-card dt, html[data-theme="titan"] .location-card dt { color: var(--muted); }
html[data-theme="midnight"] .map-visual, html[data-theme="titan"] .map-visual { background: radial-gradient(circle at 55% 45%, color-mix(in srgb, var(--lime) 13%, transparent), transparent 24%), linear-gradient(145deg, var(--panel-soft), var(--ink)); }
html[data-theme="midnight"] .road, html[data-theme="titan"] .road { border-color: color-mix(in srgb, var(--white) 16%, var(--panel)); background: var(--panel); }
html[data-theme="midnight"] .map-pin, html[data-theme="titan"] .map-pin { color: var(--white); border-color: var(--line); background: var(--panel); }
html[data-theme="midnight"] .map-pin i, html[data-theme="titan"] .map-pin i { border-color: var(--lime); }

html[data-theme="midnight"] .site-footer, html[data-theme="titan"] .site-footer { background: color-mix(in srgb, var(--ink) 88%, #000); border-color: var(--line); }
html[data-theme="midnight"] .footer-brand small, html[data-theme="midnight"] .footer-top p, html[data-theme="titan"] .footer-brand small, html[data-theme="titan"] .footer-top p { color: var(--muted); }
html[data-theme="midnight"] .footer-phone span, html[data-theme="titan"] .footer-phone span { color: var(--lime); }

html[data-theme="midnight"] .editor-overlay, html[data-theme="titan"] .editor-overlay { background: rgba(0,0,0,.72); }
html[data-theme="midnight"] .demo-editor, html[data-theme="titan"] .demo-editor { color: var(--white); background: var(--panel); }
html[data-theme="midnight"] .editor-head, html[data-theme="midnight"] .editor-group, html[data-theme="midnight"] .editor-field input, html[data-theme="midnight"] .editor-icon-grid input,
html[data-theme="titan"] .editor-head, html[data-theme="titan"] .editor-group, html[data-theme="titan"] .editor-field input, html[data-theme="titan"] .editor-icon-grid input { border-color: var(--line); }
html[data-theme="midnight"] .editor-head > div > span, html[data-theme="midnight"] .editor-text-button, html[data-theme="midnight"] .editor-status,
html[data-theme="titan"] .editor-head > div > span, html[data-theme="titan"] .editor-text-button, html[data-theme="titan"] .editor-status { color: var(--lime); }
html[data-theme="midnight"] .editor-group, html[data-theme="titan"] .editor-group { background: var(--panel-soft); }
html[data-theme="midnight"] .editor-field input, html[data-theme="midnight"] .editor-icon-grid input, html[data-theme="titan"] .editor-field input, html[data-theme="titan"] .editor-icon-grid input { color: var(--white); background: var(--ink); }
html[data-theme="midnight"] .editor-primary, html[data-theme="titan"] .editor-primary { color: var(--ink); background: var(--lime); }

@media (max-width: 1040px) {
  html[data-theme="midnight"] .main-nav, html[data-theme="titan"] .main-nav { border-color: var(--line); background: var(--panel); }
  html[data-theme="midnight"] .main-nav a, html[data-theme="titan"] .main-nav a { border-color: var(--line); }
}

@media (max-width: 760px) {
  html[data-theme="midnight"] .process-media::after, html[data-theme="titan"] .process-media::after { background: linear-gradient(180deg, transparent 45%, var(--ink)); }
}

@media (prefers-reduced-motion: reduce) {
  .hero h1 em { filter: none; }
}
