/* ===================================================================
   DIGITAL ULTRA — DESIGN SYSTEM (Tokens + Overrides)
   Edit ONLY the :root values below to re-skin the whole site.
   =================================================================== */
@import url("https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap");

:root{
  /* ---------------------------------------------------------------
   * BRAND COLORS
   * --------------------------------------------------------------- */
  --ds-accent: #b55439;
  --ds-accent-hover: #9f4a32;
  --ds-accent-rgb: 181, 84, 57;

  /* ---------------------------------------------------------------
   * BASE UI COLORS
   * --------------------------------------------------------------- */
  --ds-bg: #0b0b0b;
  --ds-surface: #111111;
  --ds-text: #ffffff;
  --ds-text-muted: rgba(255,255,255,.65);
  --ds-border: rgba(255,255,255,.18);

  /* ---------------------------------------------------------------
   * TYPOGRAPHY
   * Tip: to swap fonts, update the variables here (and load your font files).
   * --------------------------------------------------------------- */
  --ds-font-sans: "montserrat-regular", sans-serif;
  --ds-font-sans-light: "montserrat-light", sans-serif;
  --ds-font-sans-medium: "montserrat-medium", sans-serif;
  --ds-font-sans-semibold: "montserrat-semibold", sans-serif;
  --ds-font-sans-bold: "montserrat-bold", sans-serif;

  --ds-font-sans: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  --ds-font-sans-light: var(--ds-font-sans);
  --ds-font-sans-medium: var(--ds-font-sans);
  --ds-font-sans-semibold: var(--ds-font-sans);
  --ds-font-sans-bold: var(--ds-font-sans);

  --ds-testimonial-font: var(--ds-font-sans);        /* ex: Inter */
  --ds-testimonial-author-font: var(--ds-font-sans); /* ou bold */

  /* se você não quer serif no projeto, deixe tudo como sans */
  --ds-font-serif: var(--ds-font-sans);
  --ds-font-serif-bold: var(--ds-font-sans);
  --ds-font-serif-italic: var(--ds-font-sans);

  /* Type scale (override safely with clamp if you want) */
  --ds-hero-title-size: clamp(3.6rem, 5.2vw, 7.2rem);
  --ds-hero-title-line: 1.18;

  /* ---------------------------------------------------------------
   * BUTTONS
   * --------------------------------------------------------------- */
  --ds-btn-radius: 1.15rem;        /* set 999px for pill look */
  --ds-btn-border: 0.2rem;
  --ds-btn-pad-y: 1.6rem;
  --ds-btn-pad-x: 2.8rem;
  --ds-btn-letter: .25rem;

  /* ---------------------------------------------------------------
   * MOTION
   * --------------------------------------------------------------- */
  --ds-ease: cubic-bezier(.2,.8,.2,1);
  --ds-fast: 160ms;
  --ds-med: 280ms;

  /* ---------------------------------------------------------------
   * HERO LAYOUT
   * --------------------------------------------------------------- */
  --ds-hero-top: 18rem;         /* reduce if buttons are getting cut */
  --ds-hero-buttons-top: 4.8rem;
  --ds-hero-align: center;      /* left | center */
  --ds-hero-max-width: 980px;
}


/* ===================================================================
   GLOBAL OVERRIDES
   (kept minimal on purpose — relies on existing template structure)
   =================================================================== */

body{
  background: var(--ds-bg);
  color: var(--ds-text);
  font-family: var(--ds-font-sans) !important;
}

/* Links */
a{ transition: color var(--ds-fast) var(--ds-ease); }
a:hover, a:focus{ color: var(--ds-accent); }

/* Text utilities (optional) */
.muted{ color: var(--ds-text-muted); }

/* Headings + hero */
h1, h2, h3, h4, h5, h6{
  font-family: var(--ds-font-sans-medium);
}

.home-content h3{
  font-family: var(--ds-font-sans-medium);
  margin-left: 0;
  text-align: var(--ds-hero-align);
}

.home-content h1{
  font-family: var(--ds-font-sans-medium);
  font-size: var(--ds-hero-title-size);
  line-height: var(--ds-hero-title-line);
}

.home-content__main{
  padding-top: var(--ds-hero-top) !important;
  text-align: var(--ds-hero-align);
  max-width: var(--ds-hero-max-width);
  margin-left: auto;
  margin-right: auto;
}

.home-content__buttons{
  padding-top: var(--ds-hero-buttons-top);
  text-align: var(--ds-hero-align) !important;
}

.home-content__buttons .btn{
  margin: 1.4rem .7rem 0 !important;
}

/* Buttons */
.btn,
button.btn,
input[type="submit"].btn,
input[type="reset"].btn,
input[type="button"].btn{
  border-radius: var(--ds-btn-radius) !important;
  border-width: var(--ds-btn-border) !important;
  padding: var(--ds-btn-pad-y) var(--ds-btn-pad-x) !important;
  letter-spacing: var(--ds-btn-letter) !important;
  transition: transform var(--ds-fast) var(--ds-ease),
              background-color var(--ds-med) var(--ds-ease),
              border-color var(--ds-med) var(--ds-ease),
              color var(--ds-med) var(--ds-ease);
}

.btn:hover,
button.btn:hover,
input[type="submit"].btn:hover,
input[type="reset"].btn:hover,
input[type="button"].btn:hover{
  transform: translateY(-1px);
}

/* Keep the existing pill helper working, but driven by the global radius */
.btn--pill, button.btn--pill{
  border-radius: 999px !important;
}

/* Footer social icons (if you are using .du-footer-social) */
.du-footer-social a{
  border-color: var(--ds-border);
}
.du-footer-social a:hover{
  border-color: rgba(255,255,255,.35);
}

/* Optional: better focus ring (accessibility) */
:focus-visible{
  outline: 2px solid rgba(var(--ds-accent-rgb), .55);
  outline-offset: 3px;
}

/* Centralizar texto do botão*/
a.btn,
.btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: var(--ds-btn-height);
  padding: 0 var(--ds-btn-pad-x) !important;
  line-height: 1 !important;  /* mata o “afundamento” do texto */
}

/* Se o tema empurra o texto via span */
a.btn span,
.btn span{
  line-height: 1 !important;
  top: 0 !important;
  transform: none !important;
}

.home-content__main p{
  font-family: var(--ds-font-sans) !important;
}

/* Featured carousel arrows */
.du-feature-carousel{
  position: relative;
}

.du-feature-carousel__nav{
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 46px;
  height: 46px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.18);
  background: rgba(0,0,0,.35);
  backdrop-filter: blur(10px);
  color: #fff;
  display: grid;
  place-items: center;
  z-index: 5;
  cursor: pointer;
  transition: transform .18s ease, opacity .18s ease, border-color .18s ease;
  opacity: 0; /* aparece no hover */
}

.du-feature-carousel__nav--prev{ left: 16px; }
.du-feature-carousel__nav--next{ right: 16px; }

.du-feature-carousel:hover .du-feature-carousel__nav{
  opacity: 1;
}

.du-feature-carousel__nav:hover{
  transform: translateY(-50%) scale(1.03);
  border-color: rgba(255,255,255,.35);
}

/* no mobile, deixa sempre visível */
@media (max-width: 900px){
  .du-feature-carousel__nav{ opacity: 1; }
}

/* Testimonials typography override */
#testimonials,
.s-testimonials{
  font-family: var(--ds-testimonial-font) !important;
}

#testimonials p,
.s-testimonials p,
.testimonials__slide p{
  font-family: var(--ds-testimonial-font) !important;
}

#testimonials cite,
.s-testimonials cite,
.testimonials__author,
.testimonials__name{
  font-family: var(--ds-testimonial-author-font) !important;
}

:root{
  --ds-menu-bg: rgba(8, 9, 12, .86);
  --ds-menu-border: rgba(255,255,255,.12);
}

/* Drawer do menu */
.header-nav{
  background: var(--ds-menu-bg) !important;
  border-left: 1px solid var(--ds-menu-border) !important;
  backdrop-filter: blur(14px);
  width: min(520px, 92vw) !important;
}

:root{
  --ds-surface-0: #0b0b0f;
  --ds-surface-1: rgba(255,255,255,.04);
  --ds-surface-2: rgba(255,255,255,.06);
  --ds-border: rgba(255,255,255,.14);
  --ds-radius-lg: 18px;
}

/* Fundo totalmente novo  */
.s-contact{
  position: relative;
  background:
    radial-gradient(900px 520px at 20% 15%, rgba(var(--ds-accent-rgb), .18), transparent 60%),
    radial-gradient(700px 520px at 85% 25%, rgba(255,255,255,.08), transparent 55%),
    linear-gradient(180deg, #07080b 0%, var(--ds-surface-0) 100%) !important;
  padding-top: 11rem; /* fica mais "premium" */
}

/* Uma textura discreta (sem imagem, sem pesar) */
.s-contact::before{
  content:"";
  position:absolute; inset:0;
  background:
    radial-gradient(circle at 40% 30%, rgba(255,255,255,.06), transparent 55%),
    radial-gradient(circle at 70% 70%, rgba(255,255,255,.04), transparent 60%);
  opacity:.9;
  pointer-events:none;
}

/* =========================
   Footer socials (clean)
   ========================= */
.footer-social-list{
  list-style: none;
  margin: 1.2rem 0 0;
  padding: 0;
  display: flex;
  gap: 14px;
  justify-content: flex-start;
  align-items: center;
  flex-wrap: wrap;
}

.footer-social-list li{ margin: 0; padding: 0; }

.footer-social-list a{
  width: 42px;
  height: 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--ds-border);
  border-radius: 999px;
  color: var(--ds-text);
  transition: transform .18s ease, background-color .18s ease, border-color .18s ease, color .18s ease;
}

.footer-social-list a:hover{
  background: rgba(var(--ds-accent-rgb), .18);
  border-color: rgba(var(--ds-accent-rgb), .55);
  color: var(--ds-accent);
  transform: translateY(-1px);
}

.footer-social-list i{
  font-size: 16px;
  line-height: 1;
}

.footer-contact{
  margin-top: 1.1rem;
  color: var(--ds-text-muted);
}

@media only screen and (max-width: 800px){
  .footer-social-list{ justify-content: center; }
  .footer-social{ text-align: center; }
}

/* Lightbox: video (Vimeo + local MP4) */
.du-lightbox__video{
  position: relative;
  width: min(1100px, 92vw);
  aspect-ratio: 16 / 9;
  border-radius: 18px;
  overflow: hidden;
  background: #000;
}

.du-lightbox__video iframe,
.du-lightbox__video video{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
  display: block;
}

:root{
  --ds-ui-btn-radius: 999px;        /* menu */
  --ds-ui-btn-size: 64px;          /* tamanho padrão */
  --ds-ui-btn-bg: rgba(0,0,0,.78);
  --ds-ui-btn-border: rgba(255,255,255,.14);
  --ds-ui-btn-shadow: 0 10px 30px rgba(0,0,0,.35);
}

/* MENU BUTTON (top-right) */
.header-menu-toggle{
  border-radius: var(--ds-ui-btn-radius) !important;
  overflow: hidden;
  box-shadow: var(--ds-ui-btn-shadow);
  background: var(--ds-ui-btn-bg);
  border: 1px solid var(--ds-ui-btn-border);
}

/* melhora hit-area no mobile sem mudar layout */
.header-menu-toggle,
.header-menu-toggle:focus{
  outline: none;
}/* BACK TO TOP (bottom-right) */
#go-top a,
a.smoothscroll[href="#top"]{
  width: var(--ds-ui-btn-size);
  height: var(--ds-ui-btn-size);
  border-radius: 999px !important;   /* redondo */
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  box-shadow: var(--ds-ui-btn-shadow);
  background: var(--ds-ui-btn-bg);
  border: 1px solid var(--ds-ui-btn-border);
}

/* garante que o ícone fique centralizado */
#go-top a i,
#go-top a svg{
  position: static !important;
  margin: 0 !important;
  transform: none !important;
  line-height: 1 !important;
}

/* ==================================================
   FIX: popup demonstrativo (fonte, tamanho e botões)
   Mantém o popup independente dos estilos globais de button/.btn
   ================================================== */
.demo-popup-overlay {
  position: fixed !important;
  inset: 0 !important;
  display: none !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 24px !important;
  background: rgba(0, 0, 0, 0.72) !important;
  z-index: 2147483000 !important;
}

.demo-popup-overlay.is-visible {
  display: flex !important;
}

body.demo-popup-open {
  overflow: hidden !important;
}

.demo-popup-card,
.demo-popup-card * {
  box-sizing: border-box;
}

.demo-popup-card {
  width: min(560px, 100%) !important;
  max-height: calc(100vh - 48px) !important;
  overflow-y: auto !important;
  background: #ffffff !important;
  color: #2d2d2d !important;
  border-radius: 14px !important;
  padding: 40px 48px 32px !important;
  text-align: center !important;
  box-shadow: 0 24px 80px rgba(0, 0, 0, 0.32) !important;
}

.demo-popup-label {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  margin: 0 0 24px !important;
  font-family: var(--ds-font-sans-semibold, "Inter", system-ui, sans-serif) !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
  color: #222222 !important;
}

.demo-popup-label i {
  font-size: 16px !important;
  line-height: 1 !important;
}

.demo-popup-card h2 {
  margin: 0 0 12px !important;
  color: #2c2c2c !important;
  font-family: var(--ds-font-sans-bold, "Inter", system-ui, sans-serif) !important;
  font-size: clamp(25px, 4vw, 30px) !important;
  font-weight: 800 !important;
  line-height: 1.18 !important;
  letter-spacing: -0.02em !important;
  text-transform: none !important;
}

.demo-popup-card p {
  max-width: 470px !important;
  margin: 0 auto 10px !important;
  color: #696969 !important;
  font-family: var(--ds-font-sans, "Inter", system-ui, sans-serif) !important;
  font-size: 16px !important;
  font-weight: 400 !important;
  line-height: 1.5 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

.demo-popup-card strong {
  color: #4d4d4d !important;
  font-family: var(--ds-font-sans-semibold, "Inter", system-ui, sans-serif) !important;
  font-weight: 700 !important;
}

.demo-popup-check {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  margin: 14px 0 26px !important;
  color: #666666 !important;
  font-family: var(--ds-font-sans, "Inter", system-ui, sans-serif) !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 1.35 !important;
  letter-spacing: 0 !important;
  cursor: pointer !important;
}

.demo-popup-check input {
  width: 18px !important;
  height: 18px !important;
  min-width: 18px !important;
  margin: 0 !important;
  padding: 0 !important;
  accent-color: #2d2d2d !important;
}

.demo-popup-actions {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 12px !important;
  flex-wrap: wrap !important;
}

.demo-popup-btn,
button.demo-popup-btn,
a.demo-popup-btn {
  width: auto !important;
  min-width: 172px !important;
  height: 46px !important;
  min-height: 46px !important;
  margin: 0 !important;
  padding: 0 24px !important;
  border-radius: 4px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-family: var(--ds-font-sans-bold, "Inter", system-ui, sans-serif) !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  letter-spacing: 0.12em !important;
  text-align: center !important;
  text-transform: uppercase !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  cursor: pointer !important;
  transition: background-color .25s ease, color .25s ease, border-color .25s ease, transform .25s ease !important;
  box-shadow: none !important;
  appearance: none !important;
  -webkit-appearance: none !important;
}

.demo-popup-btn:hover,
.demo-popup-btn:focus {
  transform: translateY(-1px) !important;
}

.demo-popup-btn-dark,
button.demo-popup-btn-dark {
  border: 1px solid #303030 !important;
  background: #303030 !important;
  color: #ffffff !important;
}

.demo-popup-btn-dark:hover,
.demo-popup-btn-dark:focus,
button.demo-popup-btn-dark:hover,
button.demo-popup-btn-dark:focus {
  border-color: #111111 !important;
  background: #111111 !important;
  color: #ffffff !important;
}

.demo-popup-btn-outline,
a.demo-popup-btn-outline {
  border: 1px solid #303030 !important;
  background: #ffffff !important;
  color: #303030 !important;
}

.demo-popup-btn-outline:hover,
.demo-popup-btn-outline:focus,
a.demo-popup-btn-outline:hover,
a.demo-popup-btn-outline:focus {
  border-color: #303030 !important;
  background: #303030 !important;
  color: #ffffff !important;
}

@media only screen and (max-width: 700px) {
  .demo-popup-overlay {
    padding: 18px !important;
  }

  .demo-popup-card {
    padding: 30px 22px 26px !important;
    border-radius: 12px !important;
  }

  .demo-popup-label {
    margin-bottom: 18px !important;
    font-size: 12px !important;
  }

  .demo-popup-card h2 {
    font-size: 24px !important;
  }

  .demo-popup-card p {
    font-size: 15px !important;
  }

  .demo-popup-check {
    align-items: flex-start !important;
    font-size: 13px !important;
  }

  .demo-popup-actions {
    gap: 10px !important;
  }

  .demo-popup-btn,
  button.demo-popup-btn,
  a.demo-popup-btn {
    width: 100% !important;
    min-width: 0 !important;
    height: 46px !important;
    min-height: 46px !important;
  }
}

/* Centraliza os textos dos botões da primeira seção */
.home-content__buttons a.btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 1.2 !important;
  text-align: center;
}