/* Brand tokens — Dominando a Residência
   These mirror the existing site's vars (navy + gold + Bebas/Oswald/Inter)
   so any direction below feels native to the brand. */
:root{
  --dr-bg-deep:#071a36;
  --dr-bg-mid:#0d2952;
  --dr-bg-light:#123768;
  --dr-bg-accent:#174180;
  --dr-bg-darker:#04101f;
  --dr-panel:#081d3a;
  --dr-panel-2:#0b2344;
  --dr-blue:#4a90d9;
  --dr-blue-b:#5ba3ec;
  --dr-blue-soft:#85B7EB;
  --dr-gold:#C9A84C;
  --dr-gold-d:#A67C2E;
  --dr-gold-soft:#f4d675;
  --dr-green:#22c55e;
  --dr-red:#ef4444;
  --dr-amber:#f59e0b;
  /* specialty colors */
  --dr-cm:#85B7EB;
  --dr-cir:#6BBF8A;
  --dr-go:#8B4C9E;
  --dr-ped:#F09088;
  --dr-mfc:#5CBFB0;
  --dr-sc:#2A4F5E;
  --dr-sm:#C78FD6;
  /* ink levels */
  --dr-t95:rgba(255,255,255,.95);
  --dr-t90:rgba(255,255,255,.90);
  --dr-t80:rgba(255,255,255,.80);
  --dr-t70:rgba(255,255,255,.70);
  --dr-t60:rgba(255,255,255,.60);
  --dr-t50:rgba(255,255,255,.50);
  --dr-t35:rgba(255,255,255,.35);
  --dr-t22:rgba(255,255,255,.22);
  --dr-t12:rgba(255,255,255,.12);
  --dr-t08:rgba(255,255,255,.08);
  --dr-t04:rgba(255,255,255,.04);
}

/* Reset just inside artboards */
.dr-page,.dr-page *,.dr-page *::before,.dr-page *::after{
  margin:0;padding:0;box-sizing:border-box;
}
.dr-page{
  font-family:'Inter',-apple-system,system-ui,sans-serif;
  color:var(--dr-t90);
  -webkit-font-smoothing:antialiased;
  line-height:1.6;
  background:var(--dr-bg-deep);
  width:100%;
  position:relative;
  overflow:hidden;
}
.dr-bebas{font-family:'Bebas Neue',sans-serif;letter-spacing:1px;line-height:.98}
.dr-oswald{font-family:'Oswald',sans-serif;letter-spacing:1.5px;text-transform:uppercase;font-weight:700}
.dr-playfair{font-family:'Playfair Display',serif}
.dr-mono{font-family:'JetBrains Mono','SFMono-Regular',Consolas,monospace}

.dr-gold-text{
  background:linear-gradient(135deg,var(--dr-gold-soft),var(--dr-gold-d));
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  background-clip:text;
}
.dr-blue-text{color:var(--dr-blue-b)}

/* Common button shapes used across all 3 directions */
.dr-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:9px;
  padding:16px 28px;border-radius:10px;border:none;
  font-family:'Oswald',sans-serif;font-size:14px;font-weight:800;
  letter-spacing:1.6px;text-transform:uppercase;text-decoration:none;
  cursor:pointer;transition:transform .18s,box-shadow .25s,background .2s,border-color .2s;
}
.dr-btn-gold{background:linear-gradient(135deg,var(--dr-gold),var(--dr-gold-d));color:#07111f}
.dr-btn-gold:hover{transform:translateY(-1px);box-shadow:0 10px 30px rgba(201,168,76,.30)}
.dr-btn-outline{background:rgba(255,255,255,.02);border:1px solid rgba(133,183,235,.30);color:var(--dr-t80)}
.dr-btn-outline:hover{border-color:rgba(133,183,235,.6);color:#fff}
.dr-btn-ghost{background:transparent;color:var(--dr-t60)}
.dr-btn-ghost:hover{color:#fff}

/* Specialty pill */
.dr-pill{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:999px;font-family:'Oswald',sans-serif;font-size:11px;font-weight:700;letter-spacing:1.2px;text-transform:uppercase}

/* Hide scrollbar on video carousel */
.dr-vid-carousel::-webkit-scrollbar{display:none}
.dr-vid-card{transition:transform .2s,border-color .2s}
.dr-vid-card:hover{transform:translateY(-2px);border-color:rgba(201,168,76,.25)!important}

/* ============== RESPONSIVE ============== */
/* Tablet & mobile: stack 2-col and 3-col grids; reduce paddings; scale headlines.
   Inline clamp()s already cover the font side; classes cover layout collapse. */
@media (max-width: 900px) {
  .dr-hero-grid,
  .dr-compare-grid,
  .dr-testi-grid,
  .dr-doors-grid {
    grid-template-columns: 1fr !important;
    gap: 24px !important;
  }
  .dr-compare-grid > div {
    border-right: none !important;
    border-bottom: 1px solid rgba(255,255,255,.08);
  }
  .dr-compare-grid > div:last-child { border-bottom: none; }
  .dr-trust-bar { flex-direction: column !important; align-items: flex-start !important; gap: 22px !important; }
  .dr-trust-bar > div:last-child { gap: 24px !important; flex-wrap: wrap; }
  .dr-doors-grid > div { transform: none !important; box-shadow: none !important; }
}

/* Nav: hide menu links on narrow, keep brand + CTA only */
@media (max-width: 720px) {
  .dr-nav-links { display: none !important; }
  .dr-countdown-strip { flex-direction: column !important; align-items: flex-start !important; gap: 10px !important; }
  .dr-footer-grid { grid-template-columns: 1fr !important; gap: 28px !important; }
}