/* public/assets/css/app.css */

/* Design system (editável via Admin > Tema & Marca) */
:root{
  --color-primary:#0B5FA5;
  --color-secondary:#00B5E2;
  --color-accent:#22C55E;
  --color-bg:#F8FAFC;
  --color-text:#0F172A;

  --radius-lg: 16px;
  --radius-md: 12px;
  --shadow-soft: 0 10px 30px rgba(2,8,23,.08);

  /* ✅ altura do header (evita “banner cortado embaixo”) */
  --rg-header: 120px;
}

@media (max-width:640px){
  :root{
    --rg-header: 72px;
  }
}

/* Base */
html,body{height:100%;}
body{
  background: var(--color-bg);
  color: var(--color-text);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Brand helpers */
.bg-primary{background: var(--color-primary);}
.bg-secondary{background: var(--color-secondary);}
.bg-accent{background: var(--color-accent);}
.text-primary{color: var(--color-primary);}
.text-secondary{color: var(--color-secondary);}
.text-accent{color: var(--color-accent);}
.rg-card{border-radius: var(--radius-lg); box-shadow: var(--shadow-soft); background: #fff;}
.rg-ring{box-shadow: 0 0 0 4px rgba(0,181,226,.18);}

.btn{
  display:inline-flex; align-items:center; gap:.5rem;
  padding:.75rem 1rem; border-radius: 999px;
  font-weight: 600; line-height: 1;
  transition: transform .08s ease, box-shadow .15s ease, background .15s ease, color .15s ease;
}
.btn:active{transform: translateY(1px);}
.btn-primary{background: var(--color-primary); color:#fff;}
.btn-primary:hover{filter: brightness(1.04);}
.btn-outline{border:1px solid rgba(15,23,42,.14); background:#fff;}
.btn-outline:hover{border-color: rgba(15,23,42,.22); background: rgba(15,23,42,.03);}
.btn-soft{
  background: rgba(0,181,226,.12);
  color: var(--color-primary);
}
.btn-soft:hover{background: rgba(0,181,226,.16);}

.badge{
  display:inline-flex; align-items:center; gap:.375rem;
  padding:.25rem .5rem; border-radius: 999px;
  font-size:.75rem; font-weight:600;
  border: 1px solid rgba(15,23,42,.12);
  background: rgba(15,23,42,.03);
}

/* Header blur */
.header-blur{
  background: rgba(248,250,252,.78);
  backdrop-filter: blur(10px);
  border-bottom:1px solid rgba(15,23,42,.08);
}

/* Mobile menu */
.mobile-menu{display:none;}
.mobile-menu.open{display:block;}

/* FAQ accordion */
.accordion-item{border-radius: 14px; border:1px solid rgba(15,23,42,.10); overflow:hidden; background:#fff;}
.accordion-content{display:none;}
.accordion-item.open .accordion-content{display:block;}

/* Kanban */
.kanban-wrap{
  display:flex; gap: 1rem;
  overflow-x:auto; padding-bottom: 1rem;
  scroll-snap-type: x mandatory;
}
.kanban-col{
  min-width: 280px; max-width: 320px;
  scroll-snap-align: start;
  background: rgba(255,255,255,.8);
  border:1px solid rgba(15,23,42,.08);
  border-radius: 18px;
  box-shadow: 0 8px 22px rgba(2,8,23,.06);
}
.kanban-col-header{
  position: sticky; top: 0;
  background: rgba(255,255,255,.88);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid rgba(15,23,42,.08);
  border-top-left-radius: 18px;
  border-top-right-radius: 18px;
  z-index: 2;
}
.kanban-cards{padding: .75rem; min-height: 120px;}
.lead-card{
  background:#fff; border-radius: 14px;
  border: 1px solid rgba(15,23,42,.08);
  box-shadow: 0 10px 24px rgba(2,8,23,.06);
  padding:.75rem;
  margin-bottom:.75rem;
}
.lead-card:active{cursor:grabbing;}
.lead-card[draggable="true"]{cursor:grab;}
.lead-card .meta{font-size:.75rem; opacity:.8;}
.lead-color{
  width: 10px; height: 10px; border-radius: 999px; display:inline-block;
}

/* Toast */
.rg-toast{
  position: fixed;
  left: 50%;
  bottom: 18px;
  transform: translateX(-50%);
  max-width: 92vw;
  padding: .75rem 1rem;
  border-radius: 14px;
  color: #fff;
  background: rgba(15,23,42,.92);
  box-shadow: var(--shadow-soft);
  z-index: 9999;
  display:none;
}
.rg-toast.show{display:block;}

/* ==========================
   HERO FULL PRO (premium)
========================== */
.rg-heroFull{
  position:relative;
  overflow:hidden;
  background:#0b1220;
  isolation:isolate;
}

.rg-heroFull__slider{
  position:relative;
  min-height: calc(100vh - var(--rg-header, 96px));
}

.rg-heroFull__track{
  display:flex;
  align-items:stretch;
  overflow-x:auto;
  min-height: calc(100vh - var(--rg-header, 96px));
  scroll-snap-type: x proximity;
  scroll-behavior:smooth;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:none;
  touch-action: pan-y;
  cursor: grab;
}
.rg-heroFull__track:active{ cursor: grabbing; }
.rg-heroFull__track::-webkit-scrollbar{ display:none; }

.rg-heroFull__slide{
  position:relative;
  flex:0 0 100%;
  scroll-snap-align:start;
  min-height: calc(100vh - var(--rg-header, 96px));
}

/* Background com leve “cinema zoom” */
.rg-heroFull__bg{
  position:absolute;
  inset:-2%;
  width:104%;
  height:104%;
  object-fit:cover;
  transform: scale(1.06);
  filter: saturate(1.05) contrast(1.05);
}

/* Overlay premium: direita clara, esquerda escura, + vinheta */
.rg-heroFull__overlay{
  position:absolute;
  inset:0;
  background:
    radial-gradient(900px 520px at 28% 40%, rgba(0,0,0,.12), transparent 60%),
    radial-gradient(1100px 700px at 75% 30%, rgba(0,0,0,.18), transparent 60%),
    linear-gradient(to right, rgba(2,6,23,.82) 0%, rgba(2,6,23,.58) 38%, rgba(2,6,23,.22) 68%, rgba(2,6,23,.08) 100%),
    linear-gradient(to top, rgba(2,6,23,.55) 0%, rgba(2,6,23,.10) 55%, rgba(2,6,23,.00) 100%);
}

/* Container do conteúdo com grid mais profissional */
.rg-heroFull__content{
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  padding: clamp(20px, 4vw, 72px);
  max-width: 1200px;
  margin: 0 auto;
  color:#fff;
  pointer-events:none;
}

.rg-heroFull__stack{
  pointer-events:auto;
  width: min(640px, 92vw);
}

/* Tag superior “glass” discreta */
.rg-pill{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:10px 14px;
  border-radius:999px;
  background: rgba(255,255,255,.10);
  border: 1px solid rgba(255,255,255,.16);
  backdrop-filter: blur(10px);
  color: rgba(255,255,255,.92);
  font-weight: 700;
  font-size: 13px;
}

/* Tipografia premium */
.rg-heroFull__title{
  margin-top: 14px;
  font-weight: 900;
  letter-spacing: -0.03em;
  line-height: 1.02;
  font-size: clamp(36px, 5.4vw, 78px);
  text-shadow: 0 18px 60px rgba(0,0,0,.45);
}

.rg-heroFull__subtitle{
  margin-top: 12px;
  font-size: clamp(14px, 1.6vw, 18px);
  line-height: 1.6;
  color: rgba(255,255,255,.86);
  text-shadow: 0 18px 60px rgba(0,0,0,.35);
}

/* Ações: botões com alinhamento e espaçamento melhor */
.rg-heroFull__actions{
  margin-top: 18px;
  display:flex;
  flex-wrap:wrap;
  gap:12px;
}

/* Outline claro no hero */
.btn-outline--light{
  border-color: rgba(255,255,255,.22) !important;
  color: #fff !important;
  background: rgba(2,6,23,.18) !important;
  backdrop-filter: blur(10px);
}
.btn-outline--light:hover{
  background: rgba(2,6,23,.34) !important;
  border-color: rgba(255,255,255,.30) !important;
}

/* Chips mais discretos (menos “bala”) */
.rg-heroFull__chips{
  margin-top: 16px;
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}
.rg-chip{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:9px 12px;
  border-radius:999px;
  background: rgba(255,255,255,.10);
  border: 1px solid rgba(255,255,255,.14);
  color: rgba(255,255,255,.92);
  backdrop-filter: blur(10px);
  font-size: 13px;
}

/* Dots centralizados, elegantes */
.rg-heroFull__dots{
  position:absolute;
  left:50%;
  transform:translateX(-50%);
  bottom: 18px;
  display:flex;
  gap:10px;
  z-index:6;
}
.rg-dot{
  width:7px;height:7px;
  border-radius:999px;
  background: rgba(255,255,255,.30);
  border:1px solid rgba(255,255,255,.16);
  transition: transform .15s ease, background .15s ease, width .15s ease;
}
.rg-dot.is-active{
  background: rgba(255,255,255,.92);
  width: 22px;
  transform: none;
}

/* Setas menores, premium */
.rg-heroFull__arrow{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  width:50px;height:50px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.18);
  background: rgba(2,6,23,.22);
  color:#fff;
  display:flex;align-items:center;justify-content:center;
  backdrop-filter: blur(12px);
  z-index:7;
  opacity:0;
  transition: opacity .15s ease, background .15s ease, transform .15s ease;
}
.rg-heroFull__slider:hover .rg-heroFull__arrow{ opacity:1; }
.rg-heroFull__arrow:hover{ background: rgba(2,6,23,.40); transform:translateY(-50%) scale(1.03); }
.rg-heroFull__arrow--prev{ left:18px; }
.rg-heroFull__arrow--next{ right:18px; }

@media (max-width: 640px){
  .rg-heroFull__arrow{ opacity:1; width:46px;height:46px; }
  .rg-heroFull__arrow--prev{ left:12px; }
  .rg-heroFull__arrow--next{ right:12px; }
  .rg-heroFull__stack{ width: 92vw; }
}

@media (prefers-reduced-motion: reduce){
  .rg-heroFull__track{ scroll-behavior:auto; }
}
/* === FIX: overlay/content não podem “scrollar” separados do slide === */
.rg-heroFull__slide{
  position: relative !important;
  overflow: hidden !important;   /* prende overlay no slide */
}

.rg-heroFull__bg,
.rg-heroFull__overlay,
.rg-heroFull__content{
  position: absolute !important;
  inset: 0 !important;
}

/* garante que o overlay não “anda” */
.rg-heroFull__overlay{
  transform: none !important;
  will-change: auto !important;
}

.rg-heroFull__track{
  overflow-y: hidden !important;
  overscroll-behavior-x: contain;
  overscroll-behavior-y: auto;
}

.rg-heroFull__bg,
.rg-heroFull__overlay{
  pointer-events: none;
}

/* evita “puxar” a página junto durante swipe (mobile) */
.rg-heroFull__track{
  overscroll-behavior: contain;
}
/* FULL WIDTH sections helpers */
.rg-section{ padding: 56px 0; }
.rg-section--white{ background:#fff; }
.rg-container{ width:min(1200px, 92%); margin:0 auto; }
.rg-center{ text-align:center; }

.rg-features3{ display:grid; gap:40px; }
@media (min-width:768px){ .rg-features3{ grid-template-columns: repeat(3, 1fr); } }

.rg-feat{ display:flex; gap:16px; align-items:flex-start; }
.rg-feat__icon{ width:56px; height:56px; border-radius:999px; background: rgba(0,181,226,.10); border:1px solid rgba(15,23,42,.10); display:flex; align-items:center; justify-content:center; }
.rg-feat__iconInner{ width:44px; height:44px; border-radius:999px; background: var(--color-secondary); color:#fff; display:flex; align-items:center; justify-content:center; }
.rg-feat__title{ font-weight:800; color:#0f172a; font-size:18px; }
.rg-feat__text{ margin-top:8px; color:#475569; font-size:14px; line-height:1.6; }

.rg-split{ display:grid; gap:40px; }
@media (min-width:1024px){ .rg-split{ grid-template-columns: 1.05fr .95fr; align-items:center; } }

.rg-kicker{ display:flex; align-items:center; gap:12px; font-size:12px; font-weight:800; letter-spacing:.08em; color:#334155; }
.rg-kicker__bar{ width:44px; height:2px; background: var(--color-secondary); display:inline-block; }
.rg-kicker--center{ justify-content:center; }

.rg-h2{ margin-top:14px; font-size: clamp(28px, 3.2vw, 44px); font-weight:900; letter-spacing:-0.02em; color:#0f172a; }
.rg-h2--center{ text-align:center; }
.rg-p{ margin-top:14px; color:#475569; line-height:1.7; }
.rg-p--center{ max-width: 860px; margin-left:auto; margin-right:auto; }

.rg-bullets{ margin-top:22px; display:grid; gap:12px; }
.rg-bullet{ display:flex; gap:10px; align-items:flex-start; color:#0f172a; }
.rg-bullet i{ color: var(--color-secondary); margin-top:2px; }

.rg-aboutMedia{ position:relative; }
.rg-aboutMedia__img{ width:100%; height: 520px; object-fit:cover; border-radius: 22px; border:1px solid rgba(15,23,42,.10); box-shadow: 0 18px 60px rgba(2,8,23,.10); }
.rg-aboutMedia__placeholder{ height:520px; border-radius:22px; border:1px dashed rgba(15,23,42,.22); display:flex; align-items:center; justify-content:center; color:#64748b; background:#f8fafc; padding:18px; text-align:center; }

.rg-plans3{ margin-top:44px; display:grid; gap:42px; }
@media (min-width:768px){ .rg-plans3{ grid-template-columns: repeat(3, 1fr); } }
.rg-plan__icon{ width:64px; height:64px; margin:0 auto; border-radius:999px; background: var(--color-secondary); color:#fff; display:flex; align-items:center; justify-content:center; }
.rg-plan__title{ margin-top:16px; font-weight:900; font-size:20px; color:#0f172a; }
.rg-plan__text{ margin-top:10px; color:#475569; line-height:1.6; font-size:14px; }

.rg-statsBar{ background: var(--color-secondary); padding: 56px 0; color:#fff; }
.rg-statsGrid{ display:grid; gap:26px; text-align:center; }
@media (min-width:768px){ .rg-statsGrid{ grid-template-columns: repeat(4, 1fr); } }
.rg-stat__icon{ width:64px; height:64px; border-radius:999px; margin:0 auto; background: rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.18); display:flex; align-items:center; justify-content:center; }
.rg-stat__value{ margin-top:10px; font-size:40px; font-weight:900; letter-spacing:-0.02em; }
.rg-stat__label{ margin-top:6px; font-size:14px; opacity:.92; }

.rg-ctaStrip{ padding: 64px 0; background: linear-gradient(90deg, #0f172a 0%, #0b5fa5 55%, #00b5e2 100%); }
.rg-ctaStrip__inner{ display:flex; flex-direction:column; gap:18px; }
@media (min-width:768px){ .rg-ctaStrip__inner{ flex-direction:row; align-items:center; justify-content:space-between; } }
.rg-ctaStrip__title{ color:#fff; font-weight:900; letter-spacing:-0.02em; font-size: clamp(26px, 3vw, 40px); }
.rg-ctaStrip__text{ margin-top:8px; color: rgba(255,255,255,.86); }