:root {
  --bg: #f4f5f7;
  --surface: rgba(255, 255, 255, .72);
  --ink: #171a20;
  --muted: #667080;
  --line: rgba(23, 26, 32, .14);
  --accent: #1769e0;
  --accent-contrast: #fff;
  --display: Georgia, 'Times New Roman', serif;
  --sans: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --radius: 22px;
  --hero-min: min(720px, 78vh);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--bg); color: var(--ink); font-family: var(--sans); font-size: 16px; line-height: 1.6; }
a { color: inherit; }
.grain { position: fixed; inset: 0; pointer-events: none; opacity: .035; z-index: 5; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 140 140' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.5'/%3E%3C/svg%3E"); }
.topbar { max-width: 1440px; margin: auto; height: 76px; padding: 0 5vw; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--line); position: relative; z-index: 2; }
.brand { font-weight: 600; letter-spacing: -.04em; text-decoration: none; }
.topbar-middle { display: flex; align-items: center; gap: 9px; color: var(--muted); font-size: 11px; letter-spacing: .13em; text-transform: uppercase; }
.status-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--accent); box-shadow: 0 0 16px var(--accent); }
.language-switch { color: var(--muted); font-size: 12px; text-decoration: none; border-bottom: 1px solid var(--line); padding-bottom: 2px; }
.hero { max-width: 1440px; margin: auto; min-height: var(--hero-min); padding: 9vh 5vw 7vh; display: grid; grid-template-columns: minmax(0, 1fr) minmax(320px, .9fr); align-items: center; gap: 8vw; position: relative; overflow: hidden; }
.hero-copy { position: relative; z-index: 1; max-width: 700px; }
.eyebrow { display: flex; align-items: center; gap: 12px; color: var(--muted); font-size: 11px; letter-spacing: .12em; margin: 0 0 32px; text-transform: uppercase; }
.eyebrow span { display: block; width: 28px; height: 1px; background: var(--line); }
.availability { color: var(--accent); font-size: 11px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; margin: 0 0 17px; }
h1 { font-family: var(--display); font-size: clamp(4.5rem, 12vw, 10.7rem); font-weight: 400; letter-spacing: -.075em; line-height: .86; margin: 0 0 32px; overflow-wrap: anywhere; }
.tagline { font-size: clamp(1.18rem, 2.1vw, 1.7rem); letter-spacing: -.03em; line-height: 1.25; margin: 0; max-width: 600px; }
.hero-actions { display: flex; align-items: center; gap: 25px; margin-top: 43px; flex-wrap: wrap; }
.offer-link, .offer-button { display: inline-flex; align-items: center; justify-content: center; min-height: 46px; padding: 0 21px; border-radius: 999px; background: var(--accent); color: var(--accent-contrast); font-size: 13px; text-decoration: none; transition: transform .2s ease, filter .2s ease; }
.offer-link:hover, .offer-button:hover { transform: translateY(-2px); filter: brightness(1.08); }
.text-link { font-size: 13px; text-underline-offset: 5px; text-decoration-color: var(--line); }
.text-link span { display: inline-block; margin-left: 7px; color: var(--accent); }
.hero-art { min-height: 420px; position: relative; display: grid; place-items: center; isolation: isolate; }
.hero-art::before { content: ''; position: absolute; inset: 7% 2%; border-radius: 50%; background: radial-gradient(circle, var(--art-glow, rgba(23,105,224,.18)), transparent 67%); filter: blur(12px); z-index: -1; }
.art-orbit { position: absolute; border: 1px solid var(--line); border-radius: 50%; transform: rotate(-18deg); }
.art-orbit-one { width: min(35vw, 430px); height: min(35vw, 430px); }
.art-orbit-two { width: min(25vw, 310px); height: min(45vw, 520px); border-color: color-mix(in srgb, var(--accent) 65%, transparent); transform: rotate(48deg); }
.art-core { width: min(19vw, 230px); height: min(19vw, 230px); min-width: 165px; min-height: 165px; border-radius: 50%; display: grid; place-items: center; text-align: center; padding: 20px; color: var(--core-ink, var(--accent-contrast)); background: var(--core-bg, var(--accent)); box-shadow: 0 0 80px var(--art-glow, rgba(23,105,224,.18)); font-family: var(--display); font-size: clamp(1.3rem, 2.7vw, 2.5rem); line-height: .95; letter-spacing: -.06em; transform: rotate(-8deg); }
.art-core::after { content: ''; position: absolute; width: 115%; height: 115%; border: 1px dashed color-mix(in srgb, var(--accent) 65%, transparent); border-radius: 50%; }
.art-label { position: absolute; color: var(--muted); font: 10px/1 var(--sans); letter-spacing: .14em; }
.art-label-one { top: 10%; left: 8%; }
.art-label-two { right: 7%; bottom: 12%; color: var(--accent); }
.signal-strip { max-width: 1440px; margin: auto; padding: 20px 5vw; display: flex; align-items: center; gap: 18px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); color: var(--muted); font-size: 11px; letter-spacing: .14em; text-transform: uppercase; }
.signal-strip span:first-child { color: var(--ink); }
.signal-line { flex: 1; height: 1px; background: var(--line); }
.details, .offer-panel { max-width: 1440px; margin: auto; padding: 12vh 5vw; }
.section-kicker { color: var(--accent); font-size: 11px; letter-spacing: .15em; text-transform: uppercase; }
.details-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(280px, .7fr); gap: 9vw; margin-top: 45px; }
h2 { font-family: var(--display); font-size: clamp(2.5rem, 5.5vw, 5.6rem); font-weight: 400; letter-spacing: -.07em; line-height: .95; margin: 0; max-width: 780px; }
.details-copy { max-width: 520px; font-size: 1.04rem; }
.details-copy p { margin: 0 0 24px; }
.muted-copy { color: var(--muted); font-size: .9rem; }
.offer-panel { padding-top: 0; }
.offer-panel-inner { margin-top: 45px; border: 1px solid var(--line); border-radius: var(--radius); padding: clamp(26px, 5vw, 70px); display: flex; align-items: end; justify-content: space-between; gap: 40px; background: var(--surface); }
.offer-panel h2 { font-size: clamp(2.2rem, 4.5vw, 4.2rem); }
.offer-panel p { color: var(--muted); margin: 22px 0 0; max-width: 510px; }
.offer-button { min-width: 170px; }
.footer { max-width: 1440px; margin: auto; padding: 0 5vw 32px; color: var(--muted); font-size: 12px; }
.footer-top { border-top: 1px solid var(--line); padding: 27px 0; display: flex; justify-content: space-between; gap: 30px; }
.footer-brand, .email-block { display: flex; flex-direction: column; gap: 6px; }
.footer-mark { color: var(--ink); font-size: 15px; letter-spacing: -.04em; }
.email-link { color: var(--ink); text-decoration: none; }
.domain-links { border-top: 1px solid var(--line); padding: 20px 0; display: flex; flex-wrap: wrap; gap: 7px 18px; }
.domain-links a { color: var(--muted); text-decoration: none; transition: color .2s ease; }
.domain-links a:hover { color: var(--accent); }
.footer-bottom { border-top: 1px solid var(--line); padding-top: 16px; display: flex; justify-content: space-between; gap: 20px; }

/* Each page has a distinct art direction. The structure stays shared so the service remains maintainable. */
.theme-four-sale { --bg:#f5f5f7; --ink:#1d1d1f; --muted:#707070; --accent:#0071e3; --line:#d2d2d7; --surface:rgba(255,255,255,.72); --display:var(--sans); --art-glow:rgba(41,151,255,.24); --core-bg:#1d1d1f; }
.theme-anti-dema { --bg:#100e10; --ink:#f5eee7; --muted:#a69b9e; --accent:#ff5c45; --line:rgba(245,238,231,.19); --surface:rgba(255,255,255,.045); --display:Georgia,serif; --art-glow:rgba(255,92,69,.23); --core-bg:#ff5c45; --core-ink:#100e10; }
.theme-b8b { --bg:#080a0d; --ink:#f5f7f2; --muted:#8a948e; --accent:#d8ff44; --line:rgba(216,255,68,.18); --surface:rgba(255,255,255,.055); --display:var(--sans); --art-glow:rgba(216,255,68,.18); --core-bg:#d8ff44; --core-ink:#080a0d; }
.theme-city-watcher { --bg:#10191c; --ink:#eff8f4; --muted:#88a29e; --accent:#35e1c0; --line:rgba(53,225,192,.2); --surface:rgba(19,44,47,.62); --display:var(--sans); --art-glow:rgba(53,225,192,.17); --core-bg:#173c3e; }
.theme-e-receipt { --bg:#f8fafd; --ink:#061b31; --muted:#64748d; --accent:#533afd; --line:#e5edf5; --surface:#fff; --display:var(--sans); --art-glow:rgba(83,58,253,.17); --core-bg:#533afd; }
.theme-manp { --bg:#f8f0e6; --ink:#30251f; --muted:#8f7c70; --accent:#e86f51; --line:#dfd1c3; --surface:rgba(255,252,247,.72); --display:var(--sans); --art-glow:rgba(232,111,81,.2); --core-bg:#f4c84a; --core-ink:#30251f; }
.theme-mem-horizon { --bg:#0d1023; --ink:#f0efff; --muted:#9ea2c3; --accent:#9b88ff; --line:rgba(158,162,195,.2); --surface:rgba(47,46,87,.42); --display:Georgia,serif; --art-glow:rgba(155,136,255,.28); --core-bg:#302e68; }
.theme-political { --bg:#f3eee4; --ink:#172b45; --muted:#687587; --accent:#b33c43; --line:#d8cfc1; --surface:rgba(255,252,246,.78); --display:Georgia,serif; --art-glow:rgba(179,60,67,.16); --core-bg:#172b45; }
.theme-polipays { --bg:#f0f5ef; --ink:#14241c; --muted:#678071; --accent:#2e9f68; --line:#cddbd0; --surface:rgba(255,255,255,.7); --display:var(--sans); --art-glow:rgba(46,159,104,.19); --core-bg:#2e9f68; }
.theme-touringram { --bg:#f6efe3; --ink:#233447; --muted:#7c8386; --accent:#ef6c38; --line:#decfbd; --surface:rgba(255,251,242,.78); --display:Georgia,serif; --art-glow:rgba(239,108,56,.22); --core-bg:#2559a8; }
.theme-xxj { --bg:#e8e8df; --ink:#11120e; --muted:#62665d; --accent:#a8d61b; --line:#babdb0; --surface:rgba(248,249,239,.75); --display:var(--sans); --art-glow:rgba(168,214,27,.26); --core-bg:#11120e; }

@media (max-width: 800px) {
  .topbar { height: 64px; padding: 0 20px; }
  .topbar-middle { display: none; }
  .hero { min-height: auto; padding: 70px 20px 45px; display: block; }
  h1 { font-size: clamp(4rem, 21vw, 7rem); }
  .hero-art { min-height: 280px; margin-top: 45px; }
  .art-orbit-one { width: 260px; height: 260px; }
  .art-orbit-two { width: 190px; height: 300px; }
  .art-core { width: 155px; height: 155px; min-width: 155px; min-height: 155px; }
  .signal-strip { padding: 16px 20px; }
  .details, .offer-panel { padding: 75px 20px; }
  .details-grid { display: block; margin-top: 35px; }
  .details-copy { margin-top: 38px; }
  .offer-panel-inner { display: block; margin-top: 35px; }
  .offer-button { margin-top: 28px; }
  .footer { padding: 0 20px 24px; }
  .footer-top, .footer-bottom { display: block; }
  .email-block { margin-top: 22px; }
  .footer-bottom span { display: block; margin-top: 6px; }
}