/* ============================================================
   A DIGITAL FILM IN SIX REELS — site-wide design layer
   Loaded by novamira-sandbox/dba-theme-loader.php
   Tokens mirror the active Novamira design system.
   ============================================================ */
:root {
  --dba-ink: #060705;
  --dba-charcoal: #0e100d;
  --dba-smoke: #191c18;
  --dba-cream: #efe9dc;
  --dba-cream-dim: #a8a295;
  --dba-emerald: #1e7a5c;
  --dba-emerald-bright: #35b98c;
  --dba-emerald-deep: #0b3b2c;
  --dba-brass: #b49a62;
  --dba-line: rgba(239, 233, 220, 0.12);
  --dba-ease: cubic-bezier(0.22, 1, 0.36, 1);
  --dba-expo: cubic-bezier(0.87, 0, 0.13, 1);
}

html { background: var(--dba-ink); }
body { background: var(--dba-ink); color: var(--dba-cream); }
::selection { background: var(--dba-emerald); color: var(--dba-cream); }

/* ---- Section grounds ---- */
.dba-ground-ink { background-color: var(--dba-ink); }
.dba-ground-charcoal { background: linear-gradient(180deg, #0e100d 0%, #060705 100%); }
.dba-ground-emerald { background: radial-gradient(120% 120% at 50% 0%, #0b3b2c 0%, #08281e 45%, #060705 100%); }

/* ---- Hairlines ---- */
.dba-hairline-top { border-top: 1px solid var(--dba-line); }
.dba-hairline-bottom { border-bottom: 1px solid var(--dba-line); }
.dba-hairline-left { border-left: 1px solid var(--dba-line); }

/* ---- Film grain (injected via wp_footer) ---- */
.dba-grain {
  position: fixed; inset: -100%; z-index: 90; pointer-events: none; opacity: 0.033;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 300 300' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.72' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  animation: dba-grain 0.9s steps(4) infinite;
}
@keyframes dba-grain {
  0% { transform: translate(0,0); } 25% { transform: translate(-2%,3%); }
  50% { transform: translate(3%,-2%); } 75% { transform: translate(-3%,-3%); }
  100% { transform: translate(2%,2%); }
}

/* ---- Seal (rotating ring image) ---- */
.dba-seal-spin img { animation: dba-rotate 28s linear infinite; }
@keyframes dba-rotate { to { transform: rotate(360deg); } }

/* ---- Marquee: heading text duplicated by the editor, scrolls forever ---- */
.dba-marquee { overflow: hidden; border-top: 1px solid var(--dba-line); border-bottom: 1px solid var(--dba-line); }
.dba-marquee .elementor-heading-title {
  display: inline-block; white-space: nowrap; will-change: transform;
  animation: dba-marquee 40s linear infinite;
}
@keyframes dba-marquee { to { transform: translateX(-50%); } }

/* ---- Buttons: pill sweep upgrade on native Elementor buttons ---- */
.dba-btn .elementor-button {
  position: relative; overflow: hidden; isolation: isolate;
  transition: color 0.45s var(--dba-ease);
}
.dba-btn .elementor-button::before {
  content: ""; position: absolute; inset: 0; border-radius: inherit; z-index: -1;
  background: var(--dba-cream); transform: translateY(101%);
  transition: transform 0.55s var(--dba-expo);
}
.dba-btn .elementor-button:hover::before { transform: translateY(0); }
.dba-btn .elementor-button:hover { color: var(--dba-ink) !important; }
.dba-btn .elementor-button:hover .elementor-button-text { color: var(--dba-ink); }
.dba-btn-ghost .elementor-button::before { background: var(--dba-emerald); }
.dba-btn-ghost .elementor-button:hover { color: var(--dba-cream) !important; }
.dba-btn-ghost .elementor-button:hover .elementor-button-text { color: var(--dba-cream); }

/* ---- Hero: 300vh scene, sticky stage, canvas behind, Elementor content on top ---- */
.dba-hero { position: relative; min-height: 300vh; }
.dba-hero-stage {
  position: sticky; top: 0; height: 100vh; min-height: 100vh;
  overflow: hidden; display: flex; align-items: center;
}
.dba-hero-canvas-slot { position: absolute !important; inset: 0; z-index: 0; }
.dba-hero-canvas-slot canvas { width: 100%; height: 100%; display: block; }
.dba-hero-scrim {
  position: absolute; inset: 0; z-index: 1; pointer-events: none;
  background: linear-gradient(to top, rgba(6,7,5,0.85), rgba(6,7,5,0.1) 45%, transparent);
}
@media (min-width: 768px) {
  .dba-hero-scrim { background: linear-gradient(to left, rgba(6,7,5,0.85), rgba(6,7,5,0.1) 45%, transparent); }
}
.dba-hero-content { position: relative; z-index: 2; }
.dba-hero .dba-vignette {
  position: absolute; inset: 0; z-index: 1; pointer-events: none;
  background: radial-gradient(80% 70% at 50% 40%, transparent 0%, rgba(6,7,5,0.75) 100%);
}

/* ---- Display type helpers (fluid sizes beyond widget controls) ---- */
.dba-display-xl .elementor-heading-title, .dba-display-xl .xpro-heading-title { font-size: clamp(3.2rem, 9.5vw, 9.5rem) !important; line-height: 0.85 !important; }
.dba-display-lg .elementor-heading-title, .dba-display-lg .xpro-heading-title { font-size: clamp(2.6rem, 7vw, 6.5rem) !important; line-height: 0.9 !important; }
.dba-display-md .elementor-heading-title, .dba-display-md .xpro-heading-title { font-size: clamp(2rem, 4.5vw, 4rem) !important; line-height: 0.95 !important; }

/* ---- Header: fixed film-credits bar, blends over the picture ---- */
.dba-header {
  position: absolute !important; top: 0; left: 0; right: 0; z-index: 95;
  background: transparent !important;
  mix-blend-mode: difference;
  max-width: none !important;
}
.dba-header .xpro-heading-title, .dba-header .xpro-heading-title a { color: var(--dba-cream) !important; text-decoration: none; }
.dba-header .xpro-title-focus { color: var(--dba-emerald-bright) !important; margin-left: -0.22em; }
.dba-header nav a, .dba-header .xpro-elementor-menu a, .dba-header li a {
  color: var(--dba-cream) !important;
  font-family: Archivo, sans-serif !important; font-size: 12px !important; font-weight: 600 !important;
  text-transform: uppercase !important; letter-spacing: 2.5px !important;
  position: relative; text-decoration: none;
}
.dba-header nav a::after, .dba-header li a::after {
  content: ""; position: absolute; left: 0; bottom: -4px; width: 100%; height: 1px;
  background: currentColor; transform: scaleX(0); transform-origin: right;
  transition: transform 0.45s var(--dba-expo);
}
.dba-header nav a:hover::after, .dba-header li a:hover::after { transform: scaleX(1); transform-origin: left; }
.dba-header .current-menu-item > a { color: var(--dba-emerald-bright) !important; }
@media (prefers-reduced-motion: reduce) { .dba-header nav a::after { transition: none; } }
/* Mobile menu toggle + panel readable outside blend mode */
@media (max-width: 767px) { .dba-header { mix-blend-mode: normal; background: rgba(6,7,5,0.9) !important; } }

/* ---- Footer polish ---- */
.dba-footer .elementor-icon-list-item { margin-bottom: 10px; }
.dba-footer .elementor-icon-list-text { color: var(--dba-cream-dim); font-family: Archivo, sans-serif; font-size: 15px; transition: color 0.3s var(--dba-ease); }
.dba-footer .elementor-icon-list-item a:hover .elementor-icon-list-text { color: var(--dba-emerald-bright); }
.dba-footer-backtop a { color: var(--dba-cream-dim); text-decoration: none; }
.dba-footer-backtop a:hover { color: var(--dba-emerald-bright); }

/* ---- Book cover shadow ---- */
.dba-book-cover img { box-shadow: 0 40px 80px -20px rgba(0,0,0,0.8); }

/* ---- FAQ / accordion restyle (native Elementor accordion) ---- */
.dba-accordion .elementor-accordion-item {
  border: 0 !important; border-bottom: 1px solid var(--dba-line) !important; background: transparent !important;
}
.dba-accordion .elementor-tab-title { padding: 24px 0 !important; }
.dba-accordion .elementor-tab-content { border: 0 !important; padding: 0 40px 32px 0 !important; }

/* ---- Reduced motion ---- */
@media (prefers-reduced-motion: reduce) {
  .dba-grain, .dba-seal-spin img, .dba-marquee .elementor-heading-title { animation: none !important; }
  .dba-hero { min-height: 100vh; }
}

/* ---- Small polish ---- */
.dba-testimonial-col { border-left: 1px solid var(--dba-line); padding-left: 32px; }
.dba-nowrap { white-space: nowrap; }

/* ---- WPForms: film-dark restyle ---- */
.wpforms-container .wpforms-form .wpforms-field-label {
  color: var(--dba-cream-dim); font-family: Archivo, sans-serif; font-size: 12px;
  font-weight: 600; text-transform: uppercase; letter-spacing: 3px; margin-bottom: 6px;
}
.wpforms-container .wpforms-form input[type=text],
.wpforms-container .wpforms-form input[type=email],
.wpforms-container .wpforms-form select,
.wpforms-container .wpforms-form textarea {
  background: transparent !important; border: 0 !important;
  border-bottom: 1px solid var(--dba-line) !important; border-radius: 0 !important;
  color: var(--dba-cream) !important; font-family: Archivo, sans-serif !important;
  font-size: 17px !important; padding: 12px 0 !important; box-shadow: none !important;
}
.wpforms-container .wpforms-form select option { background: var(--dba-charcoal); }
.wpforms-container .wpforms-form input:focus,
.wpforms-container .wpforms-form select:focus,
.wpforms-container .wpforms-form textarea:focus {
  border-bottom-color: var(--dba-emerald-bright) !important; outline: none !important;
}
.wpforms-container .wpforms-form ::placeholder { color: rgba(168,162,149,0.55); }
.wpforms-container .wpforms-form button[type=submit] {
  background: var(--dba-emerald) !important; color: var(--dba-cream) !important;
  border: 0 !important; border-radius: 999px !important; padding: 16px 36px !important;
  font-family: Archivo, sans-serif !important; font-size: 12.5px !important; font-weight: 600 !important;
  text-transform: uppercase !important; letter-spacing: 2.5px !important;
  transition: background 0.4s var(--dba-ease), color 0.4s var(--dba-ease) !important;
}
.wpforms-container .wpforms-form button[type=submit]:hover {
  background: var(--dba-cream) !important; color: var(--dba-ink) !important;
}
.wpforms-container .wpforms-confirmation-container-full {
  background: transparent; border: 1px solid var(--dba-line); color: var(--dba-cream);
}

/* Hide WPForms anti-spam decoy fields (aria-hidden inputs) */
.wpforms-form .wpforms-field:has(> input[aria-hidden="true"][tabindex="-1"]) { display: none !important; }
.wpforms-form .wpforms-field-hp { display: none !important; }

/* ---- Cover / media placeholders (until real files are supplied) ---- */
.dba-cover-placeholder {
  background: radial-gradient(80% 80% at 50% 40%, #0b3b2c, #08281e 60%, #060705);
  border: 1px dashed rgba(239,233,220,0.18); min-height: 420px;
  display: flex; align-items: center; justify-content: center;
}

/* ---- Pricing tiers ---- */
.dba-tier { border: 1px solid var(--dba-line); }
.dba-tier-featured { border: 1px solid var(--dba-emerald-bright); background: rgba(11,59,44,0.4); }