:root {
  --ink: #111827;
  --muted: #64748b;
  --paper: #f8fafc;
  --gold: #facc15;
  --gold-light: #fde047;
  --green: #10b981;
  --dark: #090d16;
  --line: #e2e8f0;
}

body { color: var(--ink); background: var(--paper); }
.site-header { background: rgba(255,255,255,.97); border-bottom-color: rgba(20,20,20,.1); }
.brand-mark { width: 51px; height: 51px; display: block; padding: 0; border: 2px solid var(--gold); border-radius: 50%; background: #fff; object-fit: cover; box-shadow: 0 2px 8px rgba(20,20,20,.12); }
.footer-brand .brand-mark { width: 48px; height: 48px; border-color: #f0c400; background: #fff; }
.hero { background: linear-gradient(135deg,#0F172A 0%,#1E1B4B 100%); }
.hero::before { opacity: .055; background-image: linear-gradient(rgba(148,163,184,.34) 1px,transparent 1px),linear-gradient(90deg,rgba(148,163,184,.34) 1px,transparent 1px); }
.hero-glow { background: radial-gradient(circle at 60% 45%,rgba(250,204,21,.18),transparent 34%),radial-gradient(circle at 75% 60%,rgba(59,130,246,.22),transparent 66%); }
.hero h1 { color: #fff; }
.hero h1 span { color: #FACC15; }
.hero-art::before { border-color: rgba(250,204,21,.24); }
.hero-art::after { border-color: rgba(148,163,184,.2); }
.art-orbit { border-color: rgba(255,255,255,.11); }
.screen-center { background: radial-gradient(ellipse at 50% 12%,rgba(250,204,21,.15),transparent 62%),linear-gradient(145deg,#202b42,#111827); }
.screen-logo { width: 49px; height: 49px; display: block; margin-bottom: 7px; border: 2px solid var(--gold); border-radius: 50%; background: #fff; object-fit: cover; }
.screen-line { background: linear-gradient(90deg,#FACC15 65%,rgba(255,255,255,.2) 65%); }
.tag-top { border-color: rgba(250,204,21,.34); }
.tag-top i { background: #44d644; }
.tag-bottom > span { color: #111827; background: #FACC15; }
.art-note > span.tool-orbit { color: #fff; background: #1378d4; }
.art-note .tool-orbit svg { stroke: currentColor; }
.stars { color: #FACC15; }
.hero-bottom i { background: #FACC15; }
.hero .button-primary,.final-inner .button-primary { color: #062b22; background: #10B981; box-shadow: 0 9px 26px rgba(16,185,129,.24); }
.hero .button-primary:hover,.final-inner .button-primary:hover { color: #062b22; background: #34D399; box-shadow: 0 12px 30px rgba(16,185,129,.32); }
.hero .button-quiet { color: #e2e8f0; border-color: rgba(226,232,240,.46); background: rgba(255,255,255,.025); }
.hero .button-quiet:hover { background: rgba(255,255,255,.1); }
.hero-proof { width: max-content; max-width: 100%; flex-wrap: wrap; padding: 11px 15px; border: 1px solid rgba(255,255,255,.15); border-radius: 13px; background: rgba(255,255,255,.08); color: #fff; box-shadow: 0 8px 26px rgba(2,6,23,.12); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); }
.hero-proof span { color: #cbd5e1; }
.nav-cta { color: #062b22; background: #10B981; }
.nav-cta:hover { color: #062b22; background: #34D399; }
.wa-icon { color: #062b22; }
.service-icon { color: #cc141e; background: #fff0ed; }
.service-icon.green { color: #168b20; background: #eaf8e9; }
.service-icon.gold { color: #765d00; background: #fff5c7; }
.service-icon.blue { color: #086ac0; background: #eaf3ff; }
.service-icon.rose { color: #ba1520; background: #fff0ed; }
.service-cta .service-icon { color: #111; background: #ffd21a; }
.catalog-placeholder { background: radial-gradient(circle at 76% 30%,rgba(250,204,21,.25),transparent 27%),linear-gradient(135deg,#1e293b,#1e1b4b 70%,#090d16); }
.catalog-placeholder::before,.catalog-placeholder::after { border-color: rgba(250,204,21,.22); }
.catalog-symbol { border-color: rgba(250,204,21,.55); color: #facc15; background: rgba(250,204,21,.12); }
.catalog-category { color: #715b06; background: #fff5c2; }
.catalog-card-bottom a,.light-link { color: #14733c; }
.catalog-card-bottom a:hover,.light-link:hover { color: #0d522b; }
.about { background: #161616; }
.about-visual { background: radial-gradient(ellipse at 45% 42%,rgba(30,64,175,.26),transparent 50%),linear-gradient(145deg,#1f2937,#090d16); }
.about-visual::before { border-color: rgba(250,204,21,.26); }
.about-ring { border-color: rgba(255,255,255,.19); }
.about-stamp { width: 212px; height: 212px; padding: 0; border: 0; border-radius: 50%; background: transparent; box-shadow: none; transform: none; }
.about-logo { width: 100%; height: 100%; display: block; border-radius: 50%; object-fit: contain; filter: drop-shadow(0 16px 24px rgba(0,0,0,.4)); }
.about-caption i { background: #32c831; }
.about-facts b { color: #facc15; }
.text-link { color: #fde047; }
.visit { background: #fff4c4; }
.visit-panel { border: 1px solid #f0e1a1; box-shadow: 0 20px 60px rgba(90,65,4,.08); }
.visit .eyebrow { color: #7c6a2d; }
.visit-copy h2 span { color: #1e1b4b; }
.pin-icon { color: #bd1721; background: #fff0ce; }
.button-dark { color: #fff; background: #171717; }
.map-card { border-color: #c9dfc6; background: linear-gradient(135deg,#dfefd9,#cce5d5 48%,#fff0bd); }
.map-pin { background: #e11922; }
.final-cta { background: linear-gradient(135deg,#0F172A 0%,#1E1B4B 100%); }
.site-footer { background: #111; }
.footer-brand .brand-copy small { color: #c5b766; }
.floating-whatsapp { background: #10B981; color: #062b22; }
.floating-whatsapp:hover { background: #34D399; }
.filter-chip.is-active { border-color: #171717; background: #171717; }
.empty-mark { color: #111827; background: #facc15; }
.portfolio-empty-art { background: radial-gradient(circle at 72% 34%,rgba(250,204,21,.24),transparent 24%),linear-gradient(135deg,#1e293b,#1e1b4b 68%,#090d16); }
.portfolio-empty-art::before { border-color: rgba(250,204,21,.24); }
.portfolio-empty-art span { color: #141414; background: #facc15; }
.portfolio-image-placeholder { background: radial-gradient(circle at 72% 34%,rgba(250,204,21,.2),transparent 23%),linear-gradient(135deg,#1e293b,#1e1b4b 68%,#090d16); }
.portfolio-number { color: #facc15; }
.service-card:hover { border-color: rgba(16,185,129,.38); }
.catalog-card:hover { border-color: rgba(250,204,21,.64); }

@media(max-width:740px) {
  .brand-mark { width: 43px; height: 43px; }
  .footer-brand .brand-mark { width: 42px; height: 42px; }
  .about-stamp { width: 175px; height: 175px; }
  .screen-logo { width: 44px; height: 44px; }
}
@media(max-width:390px) {
  .screen-logo { width: 40px; height: 40px; }
}