/* ============================================================
   LIVE MUSIC PRODUÇÕES — CSS v3
   Estética: Cinematográfico Premium · Dark mode · Ouro metálico
   Identidade única · Grain texture · Cortes diagonais · Glows orgânicos
   ============================================================ */

/* ————————————————————————————————
   VARIÁVEIS GLOBAIS
———————————————————————————————— */
:root {
  /* Backgrounds — cada seção tem seu próprio dark único */
  --bg-hero:         #020202;
  --bg-about:        #070506;
  --bg-services:     #030305;
  --bg-jean:         #050300;
  --bg-numbers:      #020202;
  --bg-diff:         #060608;
  --bg-portfolio:    #040404;
  --bg-testimonials: #050505;
  --bg-pricing:      #030303;
  --bg-cta:          #060400;

  /* Auxiliares */
  --bg-0:            #040404;
  --bg-1:            #080808;
  --bg-2:            #0d0d0d;
  --bg-3:            #111111;
  --bg-card:         #0f0f0f;

  /* Ouro */
  --gold:            #C9A84C;
  --gold-light:      #E8D5A3;
  --gold-bright:     #F5CC50;
  --gold-dim:        #6e5522;
  --gold-glow:       rgba(201,168,76,0.16);
  --gold-glow-s:     rgba(201,168,76,0.07);
  --gold-glow-xs:    rgba(201,168,76,0.04);

  /* Texto */
  --white:           #FFFFFF;
  --text-1:          #FFFFFF;
  --text-2:          #DCDCDC;
  --text-3:          #8E8E8E;
  --text-4:          #4A4A4A;

  /* Bordas */
  --border:          rgba(201,168,76,0.25);
  --border-s:        rgba(255,255,255,0.07);
  --border-hover:    rgba(201,168,76,0.6);

  /* Glass */
  --glass-bg:        rgba(255,255,255,0.03);
  --glass-border:    rgba(255,255,255,0.08);

  /* Tipografia */
  --font-serif:      'Playfair Display', Georgia, serif;
  --font-sans:       'Inter', system-ui, sans-serif;
  --font-caps:       'Montserrat', system-ui, sans-serif;

  /* Layout */
  --section-pad:     clamp(80px,10vw,130px);
  --container:       1200px;

  /* Easing */
  --ease:            cubic-bezier(0.25,0.1,0.25,1);
  --ease-out:        cubic-bezier(0.0,0.0,0.2,1);
  --ease-spring:     cubic-bezier(0.34,1.56,0.64,1);

  /* Grain texture — SVG noise data URL reutilizável */
  --grain: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='300' height='300' filter='url(%23n)' opacity='1'/%3E%3C/svg%3E");
}

/* ————————————————————————————————
   RESET & BASE
———————————————————————————————— */
*,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }
html { scroll-behavior:smooth; font-size:16px; overflow-x:clip; }
body {
  background: var(--bg-0);
  color: var(--text-2);
  font-family: var(--font-sans);
  font-weight: 400;
  line-height: 1.65;
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
}
img { display:block; max-width:100%; }
a   { text-decoration:none; color:inherit; }
ul  { list-style:none; }

/* ————————————————————————————————
   LAYOUT UTILITÁRIOS
———————————————————————————————— */
.container {
  max-width: var(--container);
  margin: 0 auto;
  padding: 0 clamp(20px,5vw,60px);
}
.section { padding:var(--section-pad) 0; position:relative; }

/* Scroll margin para compensar navbar fixa + urgency bar */
section[id] { scroll-margin-top: 90px; }

/* Linha de onda sonora — decoração sutil entre algumas seções */
.about::after,
.jean-barros::after,
.portfolio::after {
  content: '';
  position: absolute;
  bottom: 0; left: 0; right: 0;
  height: 40px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 40' preserveAspectRatio='none'%3E%3Cpath d='M0 20 Q90 5 180 20 Q270 35 360 20 Q450 5 540 20 Q630 35 720 20 Q810 5 900 20 Q990 35 1080 20 Q1170 5 1260 20 Q1350 35 1440 20' fill='none' stroke='rgba(201,168,76,0.12)' stroke-width='1.5'/%3E%3Cpath d='M0 25 Q120 10 240 25 Q360 40 480 25 Q600 10 720 25 Q840 40 960 25 Q1080 10 1200 25 Q1320 40 1440 25' fill='none' stroke='rgba(201,168,76,0.06)' stroke-width='1'/%3E%3C/svg%3E");
  background-size: cover;
  background-repeat: no-repeat;
  pointer-events: none;
  z-index: 3;
}

/* Grain overlay — aplicado como pseudo-elemento em seções que precisam */
.section::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image: var(--grain);
  opacity: 0.028;
  pointer-events: none;
  z-index: 1;
}
/* Container fica acima do grain */
.section > .container,
.section > canvas,
.section > .hero-bg,
.section > .hero-particles,
.section > .hero-inner,
.section > .hero-services-bar,
.section > .jean-barros__bg,
.section > .numbers__grain,
.section > .cta__glow,
.section > .academy__bg-glow {
  position: relative;
  z-index: 2;
}

/* Tipografia de seção */
.section-eyebrow {
  font-family: var(--font-caps);
  font-size: .62rem;
  font-weight: 700;
  letter-spacing: .3em;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: .875rem;
}
.section-title {
  font-family: var(--font-serif);
  font-size: clamp(2.5rem,5vw,4rem);
  font-weight: 700;
  line-height: 1.1;
  color: var(--text-1);
  letter-spacing: -0.03em;
  margin-bottom: 1.25rem;
}
.section-title em { font-style:italic; color:var(--gold-light); }
.section-lead { font-size:.93rem; color:var(--text-3); max-width:560px; line-height:1.75; }
.section-header { text-align:center; margin-bottom:clamp(50px,6vw,80px); }
.section-header .section-lead { margin:0 auto; }

.body-text { font-size:.93rem; color:var(--text-3); line-height:1.8; margin-bottom:1rem; }

/* ————————————————————————————————
   BOTÕES
———————————————————————————————— */
.btn {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  padding: .875rem 1.875rem;
  font-family: var(--font-caps);
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  border-radius: 2px;
  border: none;
  cursor: pointer;
  transition: background .25s var(--ease), transform .25s var(--ease-spring), box-shadow .25s var(--ease), border-color .2s, color .2s;
  white-space: nowrap;
  position: relative;
  overflow: hidden;
}
.btn::after {
  content:'';
  position:absolute;
  inset:0;
  background:rgba(255,255,255,.06);
  opacity:0;
  transition:opacity .2s;
}
.btn:hover::after { opacity:1; }

/* Botão primário: brilho pulsante sutil + anel de luz */
.btn-primary {
  background: var(--gold);
  color: var(--bg-0);
  isolation: isolate;
  box-shadow: 0 6px 24px rgba(201,168,76,.35);
  animation: ctaPulse 2.8s ease-in-out infinite;
}
.btn-primary:hover { animation: none; }

@keyframes ctaPulse {
  0%  { box-shadow: 0 6px 24px rgba(201,168,76,.35), 0 0 0 0   rgba(201,168,76,.4); }
  50% { box-shadow: 0 6px 32px rgba(201,168,76,.55), 0 0 0 10px rgba(201,168,76,0); }
  100%{ box-shadow: 0 6px 24px rgba(201,168,76,.35), 0 0 0 0   rgba(201,168,76,0); }
}
.btn-primary::before {
  content: '';
  position: absolute;
  inset: -2px;
  border-radius: 4px;
  background: conic-gradient(
    from var(--angle, 0deg),
    var(--gold-bright),
    var(--gold),
    #fff9e0,
    var(--gold-bright),
    var(--gold)
  );
  z-index: -1;
  opacity: 0;
  transition: opacity .3s;
  animation: shimmer 3s linear infinite;
}
.btn-primary:hover::before { opacity: 1; }
.btn-primary:hover {
  background: var(--gold-bright);
  transform: translateY(-3px) scale(1.03);
  box-shadow: 0 16px 44px rgba(201,168,76,.45);
}

@property --angle {
  syntax: '<angle>';
  initial-value: 0deg;
  inherits: false;
}
@keyframes shimmer {
  to { --angle: 360deg; }
}

.btn-outline  { background:transparent; color:var(--text-1); border:1px solid var(--border); }
.btn-outline:hover { border-color:var(--gold); color:var(--gold-light); background:var(--gold-glow-s); transform:translateY(-2px); }

.btn-ghost    { background:transparent; color:var(--text-2); border:1px solid var(--border-s); }
.btn-ghost:hover { border-color:var(--border); color:var(--text-1); transform:translateY(-2px); }

.btn-whatsapp { background:#25D366; color:#fff; }
.btn-whatsapp:hover { background:#1db954; transform:translateY(-3px); box-shadow:0 12px 36px rgba(37,211,102,.35); }

.btn-lg  { padding:1rem 2.25rem; font-size:.75rem; }
.btn-xl  { padding:1.125rem 2.75rem; font-size:.78rem; }
.btn-full { width:100%; justify-content:center; }

/* Glass card — com spotlight de luz seguindo o cursor via --mx/--my */
.glass-card {
  background: var(--glass-bg);
  border: 1px solid var(--glass-border);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  transition: border-color .3s, box-shadow .3s, transform .3s var(--ease-spring);
  overflow: hidden;
}
.glass-card::after {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(
    circle 180px at var(--mx, 50%) var(--my, 50%),
    rgba(201,168,76,.07),
    transparent 60%
  );
  opacity: 0;
  transition: opacity .3s;
  pointer-events: none;
}
.glass-card:hover {
  border-color: var(--border);
  box-shadow: 0 24px 60px rgba(0,0,0,.55), 0 0 0 1px rgba(201,168,76,.08);
  transform: translateY(-5px);
}
.glass-card:hover::after { opacity: 1; }

/* Reveal animations */
.reveal-up,.reveal-left,.reveal-right {
  opacity:0;
  transition:opacity .75s var(--ease-out), transform .75s var(--ease-out);
  transition-delay: var(--delay,0s);
}
.reveal-up    { transform:translateY(45px); }
.reveal-left  { transform:translateX(-55px); }
.reveal-right { transform:translateX(55px); }
.reveal-up.is-visible,
.reveal-left.is-visible,
.reveal-right.is-visible { opacity:1; transform:none; }

/* ————————————————————————————————
   URGENCY BAR
———————————————————————————————— */
.urgency-bar {
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 1100;
  background: linear-gradient(90deg, #1a1000, #2a1c00, #1a1000);
  border-bottom: 1px solid rgba(201,168,76,.3);
  padding: .5rem 1.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .75rem;
  font-family: var(--font-caps);
  font-size: .68rem;
  letter-spacing: .06em;
  color: var(--gold-light);
}
.urgency-bar a {
  color: var(--gold);
  font-weight:700;
  display:inline-flex;
  align-items:center;
  gap:.3rem;
  border-bottom:1px solid rgba(201,168,76,.4);
  padding-bottom:1px;
  transition:color .2s;
}
.urgency-bar a:hover { color:var(--gold-bright); }
.urgency-pulse {
  color:#ff4444;
  font-size:.55rem;
  animation:pulseDot 1.2s ease-in-out infinite;
}
@keyframes pulseDot {
  0%,100% { opacity:1; transform:scale(1); }
  50%      { opacity:.5; transform:scale(1.4); }
}

/* ————————————————————————————————
   NAVBAR
———————————————————————————————— */
.navbar {
  position: fixed;
  top: 28px; left: 0; right: 0;
  z-index: 1000;
  padding: 1.25rem 0;
  transition: background .3s, padding .3s, top .3s, backdrop-filter .3s;
}
.navbar.scrolled {
  top: 28px;
  background: rgba(2,2,2,.95);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  padding: .9rem 0;
  border-bottom: 1px solid var(--border-s);
  box-shadow: 0 8px 40px rgba(0,0,0,.5);
}

.nav-container {
  max-width: var(--container);
  margin: 0 auto;
  padding: 0 clamp(20px,5vw,60px);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 2rem;
}

/* ————————————————————————————————
   LOGO — HEADER (navbar)
———————————————————————————————— */

.nav-logo { display:flex; align-items:center; background:transparent; border:none; box-shadow:none; }

.logo-header {
  display: block;
  line-height: 0;
  flex-shrink: 0;
  padding-left: clamp(0px, 0.5vw, 8px);
  background: transparent;
}

.logo-header__img {
  display: block;
  height: 75px;   /* +15% sobre 65px anterior */
  width: auto;
  object-fit: contain;
  object-position: left center;

  image-rendering: -webkit-optimize-contrast;

  filter:
    brightness(1.08)
    contrast(1.05)
    drop-shadow(0 0 10px rgba(201,168,76,.12));

  transition:
    transform .3s ease,
    filter    .3s ease;

  will-change: transform;
}

.logo-header:hover .logo-header__img {
  transform: scale(1.03);
  filter:
    brightness(1.12)
    contrast(1.06)
    drop-shadow(0 0 16px rgba(201,168,76,.26));
}

.navbar.scrolled .logo-header__img {
  height: 60px;
  transition: height .3s ease, transform .3s ease, filter .3s ease;
}

/* ————————————————————————————————
   LOGO — FOOTER
———————————————————————————————— */
.logo-footer {
  display: inline-block;
  line-height: 0;
  margin-bottom: 1.25rem;
  background: transparent;
}

.logo-footer__img {
  display: block;
  height: 84px;
  width: auto;
  object-fit: contain;
  object-position: left center;

  image-rendering: -webkit-optimize-contrast;

  filter:
    brightness(1.08)
    contrast(1.05)
    drop-shadow(0 0 10px rgba(201,168,76,.10));

  transition:
    transform .3s ease,
    filter    .3s ease;
}

.logo-footer:hover .logo-footer__img {
  transform: scale(1.03);
  filter:
    brightness(1.12)
    contrast(1.05)
    drop-shadow(0 0 18px rgba(201,168,76,.24));
}

.nav-menu { display:flex; align-items:center; gap:.2rem; }
.nav-menu > li { flex-shrink:0; }

.nav-link {
  font-family: var(--font-caps);
  font-size: .66rem;
  font-weight: 600;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--text-3);
  padding: .5rem .875rem;
  border-radius: 2px;
  transition: color .18s;
  position: relative;
  white-space: nowrap;
}
.nav-link::after {
  content:'';
  position:absolute;
  bottom:0; left:50%;
  width:70%; height:1px;
  background:var(--gold);
  transform:translateX(-50%) scaleX(0);
  transition:transform .28s var(--ease-out);
}
.nav-link:hover { color:var(--text-1); }
.nav-link:hover::after,.nav-link.active-link::after { transform:translateX(-50%) scaleX(1); }
.nav-link.active-link { color:var(--text-2); }

/* ————————————————————————————————
   DROPDOWN DE SERVIÇOS
———————————————————————————————— */
.nav-item--dropdown {
  position: relative;
}

.nav-dropdown-toggle {
  background: none;
  border: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: .35rem;
  /* Reseta aparência de botão para combinar com .nav-link */
  color: inherit;
  font: inherit;
  letter-spacing: inherit;
  text-transform: inherit;
}
/* Sem estado "ativo permanente" — hover só enquanto o mouse está sobre o item */
.nav-dropdown-toggle:focus-visible {
  outline: 1px solid var(--gold);
  outline-offset: 3px;
  border-radius: 2px;
}

.nav-chevron {
  font-size: .48rem;
  color: var(--text-3);
  transition: transform .28s var(--ease-out), color .2s;
  will-change: transform;
}
.nav-item--dropdown:hover .nav-chevron,
.nav-item--dropdown.is-open .nav-chevron {
  transform: rotate(180deg);
  color: var(--gold);
}

/* ——— Painel do dropdown ——— */
.nav-dropdown {
  position: absolute;
  top: calc(100% + 14px); /* gap maior = área morta evita fechamento acidental */
  left: 50%;
  transform: translateX(-50%) translateY(-8px);
  min-width: 210px;
  background: rgba(6,6,6,.98);
  backdrop-filter: blur(24px);
  -webkit-backdrop-filter: blur(24px);
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 8px;
  box-shadow:
    0 4px 6px rgba(0,0,0,.3),
    0 20px 48px rgba(0,0,0,.65),
    0 0 0 1px rgba(201,168,76,.05);
  padding: .375rem;
  display: flex;
  flex-direction: column;
  gap: 1px;
  /* Invisível + deslocado para baixo — entra com fade + slide */
  opacity: 0;
  pointer-events: none;
  transition:
    opacity .22s ease,
    transform .22s ease;
  z-index: 200;
}

/* Ponte invisível entre o botão e o painel — elimina o gap que fecha o hover */
.nav-item--dropdown::after {
  content: '';
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  height: 16px; /* cobre o gap de 14px + margem */
}

/* Aberto */
.nav-item--dropdown:hover .nav-dropdown,
.nav-item--dropdown.is-open .nav-dropdown {
  opacity: 1;
  pointer-events: auto;
  transform: translateX(-50%) translateY(0);
}

/* ——— Links dentro do dropdown ——— */
.nav-dropdown__link {
  display: flex;
  align-items: center;
  gap: .625rem;
  /* Padding generoso — toda a área é clicável */
  padding: .8rem 1rem;
  border-radius: 5px;
  font-family: var(--font-caps);
  font-size: .62rem;
  font-weight: 600;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--text-3);
  white-space: nowrap;
  transition: color .2s ease, background .2s ease;
}
.nav-dropdown__link i {
  color: var(--gold-dim);
  font-size: .68rem;
  width: 14px;
  text-align: center;
  flex-shrink: 0;
  transition: color .2s ease, transform .2s ease;
}

/* Hover: fundo dourado muito sutil + texto levemente mais claro */
.nav-dropdown__link:hover {
  color: var(--gold-light);
  background: rgba(201,168,76,.09);
}
.nav-dropdown__link:hover i {
  color: var(--gold);
  transform: translateX(1px);
}

/* Separador elegante entre itens */
.nav-dropdown li + li .nav-dropdown__link {
  border-top: 1px solid rgba(255,255,255,.04);
  border-radius: 0 0 5px 5px;
}
.nav-dropdown li:first-child .nav-dropdown__link {
  border-radius: 5px 5px 0 0;
}
.nav-dropdown li:only-child .nav-dropdown__link {
  border-radius: 5px;
  border-top: none;
}

/* ————————————————————————————————
   MOBILE: dropdown vira accordion
———————————————————————————————— */
@media (max-width: 768px) {
  .nav-item--dropdown {
    width: 100%;
    text-align: center;
  }
  /* Remove a ponte — não é necessária no mobile */
  .nav-item--dropdown::after { display: none; }

  .nav-dropdown-toggle {
    justify-content: center;
    width: 100%;
    font-size: .88rem;
    padding: 1rem 2rem;
    letter-spacing: .15em;
  }

  .nav-dropdown {
    position: static;
    transform: none !important;
    left: auto;
    opacity: 1;
    pointer-events: auto;
    background: rgba(201,168,76,.04);
    border: none;
    border-top: 1px solid rgba(255,255,255,.05);
    border-radius: 0;
    box-shadow: none;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    padding: 0;
    max-height: 0;
    overflow: hidden;
    transition: max-height .32s ease, padding .22s ease;
  }
  /* Separadores visuais desativados no mobile — accordion já separa */
  .nav-dropdown li + li .nav-dropdown__link { border-top: none; border-radius: 4px; }
  .nav-dropdown li:first-child .nav-dropdown__link { border-radius: 4px; }

  .nav-item--dropdown.is-open .nav-dropdown {
    max-height: 280px;
    padding: .25rem 0 .5rem;
  }

  .nav-dropdown__link {
    justify-content: center;
    font-size: .78rem;
    padding: .75rem 2rem;
  }
  .nav-dropdown__link:hover i { transform: none; }
}

.nav-cta {
  background: var(--gold) !important;
  color: var(--bg-0) !important;
  margin-left: .5rem;
  padding: .6rem 1.125rem;
  display:inline-flex;
  align-items:center;
  gap:.4rem;
}
.nav-cta:hover { background:var(--gold-bright) !important; color:var(--bg-0) !important; }
.nav-cta::after { display:none; }

.nav-link--academy {
  color: var(--gold) !important;
  filter: drop-shadow(0 0 7px rgba(201,168,76,.3));
  letter-spacing: .14em;
}
.nav-link--academy::after {
  background: linear-gradient(90deg, var(--gold), var(--gold-bright));
  height: 1.5px;
  opacity: 1;
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .35s var(--ease-out);
}
.nav-link--academy:hover,
.nav-link--academy:focus {
  color: var(--gold-bright) !important;
  filter: drop-shadow(0 0 12px rgba(201,168,76,.55));
}
.nav-link--academy:hover::after,
.nav-link--academy:focus::after { transform: scaleX(1); }
.nav-academy-badge {
  display: inline-block;
  background: var(--gold);
  color: var(--bg-0);
  font-size: .48rem;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  padding: .12rem .38rem;
  border-radius: 100px;
  vertical-align: middle;
  margin-left: .3rem;
  line-height: 1.6;
}

.nav-toggle {
  display:none; flex-direction:column; gap:5px;
  background:none; border:none; cursor:pointer; padding:4px;
}
.nav-toggle span { display:block; width:24px; height:1.5px; background:var(--text-1); transition:all .25s var(--ease); }

/* ————————————————————————————————
   HERO
———————————————————————————————— */
.hero {
  position: relative;
  min-height: 100svh;
  display: flex;
  flex-direction: column;
  padding-top: 120px;
  overflow: hidden;
  background: var(--bg-hero);
  /* Glow orgânico irregular — nunca perfeitamente centrado */
  background-image:
    radial-gradient(ellipse 40% 30% at 15% 60%, rgba(201,168,76,.12), transparent),
    radial-gradient(ellipse 60% 40% at 85% 20%, rgba(201,168,76,.08), transparent),
    radial-gradient(ellipse 25% 45% at 60% 80%, rgba(201,168,76,.06), transparent);
}

/* Fundo hero: imagem real + efeitos */
.hero-bg { position:absolute; inset:0; pointer-events:none; }

/* Imagem de estúdio com blur para criar foco no texto */
.hero-bg__image {
  position: absolute;
  inset: -10px; /* compensa o overflow do blur */
  background-image: url('../images/studio/img_8237.webp');
  background-size: cover;
  background-position: center 30%;
  opacity: 0.32;
  filter: blur(2px);          /* blur sutil — cria bokeh cinematográfico */
  transform: scale(1.05);     /* evita bordas brancas do blur */
  will-change: transform;
}

/* Raios de luz girando */
.hero-bg__rays {
  position:absolute; inset:0;
  background:
    conic-gradient(from 280deg at 80% 35%,
      transparent 0deg,
      rgba(201,168,76,.04) 15deg,
      transparent 25deg,
      rgba(201,168,76,.03) 40deg,
      transparent 55deg
    );
  animation: raysRotate 30s linear infinite;
}
@keyframes raysRotate {
  from { transform:rotate(0deg) scale(1.5); }
  to   { transform:rotate(360deg) scale(1.5); }
}

/* Overlay em múltiplas camadas — cria profundidade e foco no texto */
.hero-bg__overlay {
  position:absolute; inset:0;
  background:
    /* Escurecimento nas bordas — vinheta cinematográfica */
    radial-gradient(ellipse 80% 80% at 50% 50%, transparent 30%, rgba(2,2,2,.75) 100%),
    /* Faixa escura na direita para contrastar com o card visual */
    linear-gradient(90deg, rgba(2,2,2,.25) 0%, rgba(2,2,2,.05) 50%, rgba(2,2,2,.55) 100%),
    /* Gradiente vertical — topo e base escuros */
    linear-gradient(180deg, rgba(2,2,2,.7) 0%, rgba(2,2,2,.1) 30%, rgba(2,2,2,.15) 60%, rgba(2,2,2,.8) 100%),
    /* Toque dourado no topo — como luz de estúdio */
    radial-gradient(ellipse 60% 25% at 40% 0%, rgba(201,168,76,.08), transparent);
}

/* Scanline sutil — referência a tela de cinema */
.hero-bg__overlay::after {
  content: '';
  position: absolute;
  inset: 0;
  background-image: repeating-linear-gradient(
    0deg,
    transparent,
    transparent 3px,
    rgba(0,0,0,.03) 3px,
    rgba(0,0,0,.03) 4px
  );
  pointer-events: none;
}

/* Marca d'água — identidade sutil no fundo da hero */
.hero-bg__watermark {
  position: absolute;
  right: 3%;
  bottom: 6%;
  width: clamp(180px, 24%, 360px);
  aspect-ratio: 3 / 1;    /* proporção da logo (landscape) */
  background-image: url('../images/logo3.png');
  background-size: contain;
  background-repeat: no-repeat;
  background-position: right bottom;

  /*
   * Opacidade intencional: visível o suficiente para reforçar
   * a marca, invisível o suficiente para não competir com o texto
   */
  opacity: 0.04;

  pointer-events: none;
  z-index: 1;             /* acima do bg, abaixo do conteúdo (z-index 2) */

  /* Tom quente para se misturar ao glow dourado da cena */
  filter: brightness(1.5) saturate(0.8) sepia(0.15);
}

.hero-particles { position:absolute; inset:0; width:100%; height:100%; pointer-events:none; }

/* Layout hero */
.hero-inner {
  position: relative;
  z-index: 2;
  flex: 1;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 3rem;
  align-items: center;
  max-width: var(--container);
  margin: 0 auto;
  padding: 2rem clamp(20px,5vw,60px) 4rem;
  width: 100%;
}

/* Conteúdo hero (esquerda) — animação de entrada sem opacidade no container */
.hero-content { /* animações individuais em cada linha */ }

/* ——— Título cinematográfico multi-linha ——— */
.hero-title {
  display: flex;
  flex-direction: column;
  gap: .1em;
  font-family: var(--font-serif);
  line-height: 1.0;
  letter-spacing: -0.03em;
  margin-bottom: 1.25rem;
}

/* Animação escalonada por linha */
.ht-line--1 {
  font-size: clamp(2rem, 4vw, 3.2rem);
  font-weight: 400;
  color: var(--text-2);
  letter-spacing: -0.01em;
  opacity: 0;
  transform: translateY(24px);
  animation: lineReveal .85s var(--ease-out) .15s forwards;
}

.ht-line--2 {
  font-size: clamp(2.5rem, 5vw, 4.5rem);
  font-style: italic;
  font-weight: 700;
  color: var(--gold-light);
  /* Glow dourado forte */
  text-shadow:
    0 0 20px rgba(201,168,76,.9),
    0 0 50px rgba(201,168,76,.5),
    0 0 90px rgba(201,168,76,.25),
    0 0 160px rgba(201,168,76,.1);
  opacity: 0;
  transform: translateY(28px) scale(.97);
  animation: lineRevealScale .95s var(--ease-out) .35s forwards;
}
.ht-line--2 em { font-style:inherit; }

/* Linha 3: impacto máximo — profundidade + escala */
.ht-line--3 {
  font-size: clamp(4rem, 9vw, 8rem);
  font-weight: 900;
  color: #f4f0e8;
  letter-spacing: -0.04em;
  text-shadow:
    2px 2px  0 rgba(0,0,0,.95),
    4px 4px  0 rgba(0,0,0,.65),
    6px 6px  0 rgba(0,0,0,.3),
    0 0 80px  rgba(201,168,76,.07);
  opacity: 0;
  transform: translateY(36px) scale(.95);
  animation: lineRevealBig 1.05s var(--ease-out) .55s forwards;
}

@keyframes lineReveal {
  to { opacity:1; transform:none; }
}
@keyframes lineRevealScale {
  to { opacity:1; transform:none; }
}
@keyframes lineRevealBig {
  to { opacity:1; transform:none; }
}

/* Ponto final dourado */
.ht-dot { color: var(--gold); }

/* Subtítulo-eyeline: caps pequeno dourado */
.hero-eyeline {
  font-family: var(--font-caps);
  font-size: .62rem;
  font-weight: 700;
  letter-spacing: .3em;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 1.75rem;
  opacity: .85;
}

.hero-subtitle {
  font-size: clamp(.95rem,1.5vw,1.1rem);
  color: var(--text-3);
  line-height: 1.75;
  max-width: 500px;
  margin-bottom: 2.5rem;
}

.hero-eyeline {
  opacity: 0;
  animation: lineReveal .8s var(--ease-out) .75s forwards;
}

.hero-subtitle {
  opacity: 0;
  animation: lineReveal .8s var(--ease-out) .9s forwards;
}

.hero-actions {
  display: flex;
  gap: .875rem;
  flex-wrap: wrap;
  margin-bottom: 2.5rem;
  opacity: 0;
  animation: lineReveal .8s var(--ease-out) 1.05s forwards;
}

/* Prova social */
.hero-proof {
  display: flex;
  align-items: center;
  gap: 1rem;
}
.proof-avatars { display: flex; }
.proof-av {
  width: 34px; height:34px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--bg-3), var(--bg-2));
  border: 2px solid var(--gold-dim);
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-caps);
  font-size: .58rem;
  font-weight: 700;
  color: var(--gold-light);
  margin-left: -8px;
}
.proof-av:first-child { margin-left:0; }
.proof-text { display:flex; flex-direction:column; gap:2px; }
.proof-stars { color:var(--gold); font-size:.65rem; display:flex; gap:2px; }
.proof-text span { font-size:.72rem; color:var(--text-4); font-family:var(--font-caps); letter-spacing:.06em; }

/* Prova social: fade in após os demais elementos */
.hero-proof {
  opacity: 0;
  animation: lineReveal .8s var(--ease-out) 1.25s forwards;
}

/* Visual hero (direita) — com leve rotação 3D */
.hero-visual {
  position: relative;
  opacity: 0;
  transform: translateY(30px) rotate(-2deg);
  animation: heroVisualIn 1.1s var(--ease-out) .6s forwards;
  perspective: 1000px;
}
@keyframes heroVisualIn {
  to { opacity:1; transform:translateY(0) rotate(0deg); }
}

.hero-visual__frame {
  position: relative;
  border-radius: 8px;
  overflow: visible;
  /* Leve rotação 3D para não parecer template */
  transform: rotate(-2deg) perspective(800px) rotateY(4deg);
  transition: transform .4s var(--ease);
}
.hero-visual__frame:hover {
  transform: rotate(-1deg) perspective(800px) rotateY(2deg);
}

.hero-visual__studio-scene {
  border-radius: 8px;
  overflow: hidden;
  border: 1px solid var(--border);
  background: linear-gradient(160deg, #0f0a05, #080507, #050305);
  aspect-ratio: 4/3;
  position: relative;
}

/* Cena de estúdio simulada */
.studio-scene {
  position:relative; width:100%; height:100%; overflow:hidden;
  background-image: linear-gradient(rgba(2,2,2,.18),rgba(2,2,2,.42)), url('../images/studio/img_8238.webp');
  background-size: cover;
  background-position: center;
}

.studio-scene__light {
  position: absolute;
  border-radius: 50%;
  filter: blur(60px);
  pointer-events: none;
}
.studio-scene__light--1 {
  width:300px; height:300px;
  top:-80px; right:-60px;
  background:radial-gradient(circle, rgba(201,168,76,.25), transparent 65%);
  animation:lightMove1 6s ease-in-out infinite;
}
.studio-scene__light--2 {
  width:200px; height:200px;
  bottom:-40px; left:-40px;
  background:radial-gradient(circle, rgba(100,80,200,.12), transparent 65%);
  animation:lightMove2 9s ease-in-out infinite;
}
.studio-scene__light--3 {
  width:150px; height:150px;
  top:40%; left:40%;
  background:radial-gradient(circle, rgba(201,168,76,.08), transparent 65%);
  animation:lightMove3 7s ease-in-out infinite;
}
@keyframes lightMove1 { 0%,100%{transform:translate(0,0)} 50%{transform:translate(-20px,15px)} }
@keyframes lightMove2 { 0%,100%{transform:translate(0,0)} 50%{transform:translate(15px,-20px)} }
@keyframes lightMove3 { 0%,100%{transform:translate(0,0) scale(1)} 50%{transform:translate(-10px,10px) scale(1.3)} }

.studio-scene__mic {
  position:absolute; top:50%; left:50%;
  transform:translate(-50%,-50%);
  font-size:3.5rem;
  color:rgba(201,168,76,.2);
  z-index:1;
}

.studio-scene__waves { position:absolute; inset:0; z-index:2; }
#waveform-canvas { width:100%; height:100%; display:block; }

.studio-scene__label {
  position:absolute; top:1rem; left:1rem;
  font-family:var(--font-caps);
  font-size:.6rem; font-weight:700;
  letter-spacing:.18em;
  color:var(--text-1);
  background:rgba(0,0,0,.5);
  border:1px solid rgba(255,255,255,.1);
  padding:.35rem .75rem;
  border-radius:2px;
  display:flex; align-items:center; gap:.4rem;
  z-index:3;
}
.rec-dot {
  width:7px; height:7px; border-radius:50%;
  background:#ff4444;
  animation:pulseDot .8s ease-in-out infinite;
}

/* Badge sobre o visual */
.hero-visual__badge {
  position:absolute; bottom:1rem; right:1rem;
  background:rgba(2,2,2,.88);
  border:1px solid var(--border);
  border-radius:4px;
  padding:.625rem 1rem;
  display:flex; align-items:center; gap:.625rem;
  backdrop-filter:blur(8px);
  z-index:4;
}
.hero-visual__badge i { color:var(--gold); font-size:1.1rem; }
.hero-visual__badge strong { display:block; font-size:.78rem; color:var(--text-1); line-height:1; }
.hero-visual__badge span  { font-size:.62rem; color:var(--text-4); font-family:var(--font-caps); letter-spacing:.08em; }

/* Stats flutuantes */
.hero-stat {
  position:absolute;
  background:rgba(2,2,2,.9);
  border:1px solid var(--border);
  border-radius:4px;
  padding:.75rem 1.125rem;
  backdrop-filter:blur(8px);
  text-align:center;
  z-index:4;
}
.hero-stat--1 { top:-1.5rem; left:-2rem; }
.hero-stat--2 { bottom:-1.5rem; right:-2rem; }
.hs-num {
  display:block;
  font-family:var(--font-serif);
  font-size:1.5rem; font-weight:700;
  color:var(--gold-light);
  line-height:1;
}
.hs-lbl {
  font-family:var(--font-caps);
  font-size:.58rem; letter-spacing:.1em;
  color:var(--text-4);
}

/* Barra de serviços */
.hero-services-bar {
  position: relative;
  z-index: 2;
  background: rgba(0,0,0,.75);
  border-top: 1px solid var(--border-s);
  /* Wave line separator via SVG data URL */
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1200' height='4' viewBox='0 0 1200 4'%3E%3Cpath d='M0 2 Q150 0 300 2 Q450 4 600 2 Q750 0 900 2 Q1050 4 1200 2' fill='none' stroke='rgba(201,168,76,0.18)' stroke-width='1'/%3E%3C/svg%3E");
  background-repeat: repeat-x;
  background-position: top center;
  backdrop-filter: blur(12px);
  display: flex;
  align-items: stretch;
  justify-content: center;
  padding: 0;
}
.hsb-item {
  display: flex;
  align-items: center;
  gap: .625rem;
  padding: 1.125rem 2rem;
  font-family: var(--font-caps);
  font-size: .65rem;
  font-weight: 600;
  letter-spacing: .12em;
  color: var(--text-4);
  text-transform: uppercase;
  transition: color .2s, background .2s;
  cursor: default;
}
.hsb-item:hover { color:var(--gold-light); background:rgba(201,168,76,.04); }
.hsb-item i { color:var(--gold); font-size:.85rem; }
.hsb-sep { width:1px; background:var(--border-s); margin:1rem 0; align-self:stretch; flex-shrink:0; }

@keyframes heroIn { to { opacity:1; transform:none; } }

/* Remove animação antiga no .hero-content — cada linha tem a sua própria */
.hero-content { opacity:1 !important; transform:none !important; animation:none !important; }

/* ————————————————————————————————
   SOBRE — SPLIT LAYOUT
   Background: warm dark #070506
   Corte diagonal na borda inferior
———————————————————————————————— */
.about {
  background: var(--bg-about);
  /* Glow orgânico assimétrico */
  background-image:
    radial-gradient(ellipse 55% 35% at 20% 70%, rgba(201,168,76,.07), transparent),
    radial-gradient(ellipse 35% 50% at 90% 15%, rgba(201,168,76,.04), transparent);
  clip-path: polygon(0 0, 100% 0, 100% 94%, 0 100%);
  padding-bottom: calc(var(--section-pad) + 4vw);
}

.split-layout {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(40px,6vw,100px);
  align-items: center;
}

/* Mockup de estúdio com imagem real */
.studio-mockup { position: relative; }
.studio-mockup__img {
  border-radius: 6px;
  overflow: hidden;
  aspect-ratio: 4/3;
  border: 1px solid var(--border-s);
  position: relative;
}

/* Imagem real injetada via CSS */
.studio-img--control {
  background-image: url('../images/studio/img_9018.webp');
  background-size: cover;
  background-position: center;
}

/* ————————————————————————————————
   GALERIA DO ESTÚDIO — MATERIAL REAL
———————————————————————————————— */
.studio-gallery {
  background: #050303;
  background-image: radial-gradient(ellipse 50% 35% at 50% 45%, rgba(160,35,24,.12), transparent);
}
.studio-gallery__grid {
  display:grid;
  grid-template-columns:repeat(4,1fr);
  grid-auto-rows:clamp(150px,16vw,230px);
  gap:.75rem;
}
.studio-gallery__item {
  position:relative;
  overflow:hidden;
  border-radius:4px;
  border:1px solid var(--border-s);
  background:#090606;
}
.studio-gallery__item--wide { grid-column:span 2; }
.studio-gallery__item img {
  width:100%; height:100%; object-fit:cover;
  transition:transform .6s var(--ease-out), filter .4s ease;
  filter:saturate(.9) brightness(.88);
}
.studio-gallery__item::after {
  content:''; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(145deg, transparent 48%, rgba(0,0,0,.35));
}
.studio-gallery__item:hover img { transform:scale(1.045); filter:saturate(1.05) brightness(1); }
@media (max-width: 768px) {
  .studio-gallery__grid { grid-template-columns:repeat(2,1fr); grid-auto-rows:180px; }
  .studio-gallery__item--wide { grid-column:span 2; }
}
@media (max-width: 420px) {
  .studio-gallery__grid { grid-auto-rows:150px; gap:.5rem; }
}
/* Overlay escuro para manter estética dark */
.studio-img--control::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(
    160deg,
    rgba(7,5,6,.55) 0%,
    rgba(7,5,6,.3) 60%,
    rgba(7,5,6,.65) 100%
  );
}

/* Badges flutuantes sobre mockup */
.mockup-badge {
  position:absolute;
  background:rgba(4,4,4,.92);
  border:1px solid var(--border);
  border-radius:4px;
  padding:.625rem 1rem;
  display:flex; align-items:center; gap:.5rem;
  backdrop-filter:blur(8px);
  font-family:var(--font-caps);
  font-size:.62rem; font-weight:700;
  letter-spacing:.08em; color:var(--gold-light);
  z-index: 3;
}
.mockup-badge i { color:var(--gold); }
.mockup-badge--tl { top:-1rem; left:-1.5rem; }
.mockup-badge--br { bottom:-1rem; right:-1.5rem; }

/* Texto (direita) */
.feature-list {
  display: flex;
  flex-direction: column;
  gap: 1.125rem;
  margin: 1.75rem 0;
}
.feature-item {
  display: flex;
  gap: 1rem;
  align-items: flex-start;
}
.feature-item > i {
  color: var(--gold);
  font-size: 1rem;
  margin-top: 3px;
  flex-shrink: 0;
}
.feature-item strong { display:block; font-size:.9rem; color:var(--text-1); margin-bottom:.2rem; }
.feature-item span   { font-size:.82rem; color:var(--text-4); }

.about-cta {
  display: flex;
  align-items: center;
  gap: 2rem;
  flex-wrap: wrap;
  margin-top: 2rem;
}
.about-stats-mini { display: flex; gap: 1.5rem; }
.about-stats-mini span {
  font-family: var(--font-caps);
  font-size: .68rem;
  color: var(--text-4);
  letter-spacing: .06em;
}
.about-stats-mini strong { color:var(--gold-light); font-size:.9rem; display:block; }

/* ————————————————————————————————
   SERVIÇOS — BLOCOS ALTERNADOS
   Background: cool dark #030305
———————————————————————————————— */
.services {
  background: var(--bg-services);
  background-image:
    radial-gradient(ellipse 45% 25% at 70% 80%, rgba(201,168,76,.06), transparent),
    radial-gradient(ellipse 30% 40% at 10% 30%, rgba(201,168,76,.04), transparent);
}

.service-block {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(40px,6vw,100px);
  align-items: center;
  margin-bottom: clamp(70px,9vw,110px);
  padding-bottom: clamp(70px,9vw,110px);
  border-bottom: 1px solid var(--border-s);
  position: relative;
}
.service-block:last-child { margin-bottom:0; padding-bottom:0; border-bottom:none; }

/* Número de fundo em cada bloco de serviço */
.service-block:nth-child(2)::before { content: '01'; }
.service-block:nth-child(3)::before { content: '02'; }
.service-block:nth-child(4)::before { content: '03'; }
.service-block:nth-child(5)::before { content: '04'; }
/* Números corrigidos na seção de serviços que continua após a Academy */
.services--continued .service-block:nth-child(1)::before { content: '03'; }
.services--continued .service-block:nth-child(2)::before { content: '04'; }
.services--continued .service-block:nth-child(3)::before { content: '05'; }
/* Reduz o espaço do topo na continuação — academy já tem padding-bottom */
.services--continued { padding-top: clamp(40px, 5vw, 60px); }
.service-block::before {
  position: absolute;
  top: -1rem;
  right: 0;
  font-family: var(--font-serif);
  font-size: 10rem;
  font-weight: 900;
  color: var(--text-1);
  opacity: 0.03;
  line-height: 1;
  pointer-events: none;
  z-index: 0;
  letter-spacing: -0.05em;
}

/* Inverte ordem no bloco text-right */
.service-block--text-right .service-block__visual { order:-1; }
.service-block--text-right .service-block__content { order:1; }

.service-block__icon {
  width:52px; height:52px;
  background:var(--gold-glow-s);
  border:1px solid var(--border);
  border-radius:4px;
  display:flex; align-items:center; justify-content:center;
  font-size:1.3rem; color:var(--gold);
  margin-bottom:1rem;
  position: relative;
  z-index: 1;
}
.service-block__tag {
  display:inline-block;
  background:var(--gold);
  color:var(--bg-0);
  font-family:var(--font-caps);
  font-size:.58rem; font-weight:800;
  letter-spacing:.12em; text-transform:uppercase;
  padding:.3rem .875rem;
  border-radius:100px;
  margin-bottom:1rem;
  position: relative;
  z-index: 1;
}
.service-block__title {
  font-family: var(--font-serif);
  font-size: clamp(1.75rem,3vw,2.5rem);
  font-weight: 700;
  line-height: 1.15;
  letter-spacing: -0.02em;
  color: var(--text-1);
  margin-bottom: 1.125rem;
  position: relative;
  z-index: 1;
}
.service-block__title em { font-style:italic; color:var(--gold-light); }
.service-block__desc { font-size:.93rem; color:var(--text-3); line-height:1.8; margin-bottom:1.5rem; position:relative; z-index:1; }

.service-block__list {
  display:flex; flex-direction:column; gap:.625rem;
  margin-bottom:2rem;
  position: relative;
  z-index: 1;
}
.service-block__list li {
  display:flex; align-items:center; gap:.625rem;
  font-size:.85rem; color:var(--text-3);
}
.service-block__list li i { color:var(--gold); font-size:.65rem; flex-shrink:0; }

/* Visual do serviço — imagens reais */
.service-visual-card {
  border-radius:6px;
  overflow:hidden;
  border:1px solid var(--border-s);
  transition:border-color .3s, box-shadow .3s;
  position: relative;
  z-index: 1;
}
.service-visual-card:hover {
  border-color:var(--border);
  box-shadow:0 20px 50px rgba(0,0,0,.6);
}

/* Divs de serviço com imagens reais via background-image */
[class^="svc-img--"] {
  aspect-ratio: 4/3;
  background-size: cover;
  background-position: center;
  position: relative;
  display: flex;
  align-items: flex-end;
  justify-content: flex-start;
}

/* Overlay escuro sobre cada imagem de serviço */
[class^="svc-img--"]::after {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.svc-img--music {
  background-image: url('../images/studio/img_9019.webp');
}
/* Overlays calibrados para mostrar mais da imagem real sem perder identidade dark */
.svc-img--music::after {
  background: linear-gradient(200deg, rgba(3,3,5,.45) 0%, rgba(3,3,5,.15) 45%, rgba(3,3,5,.7) 100%);
}

.svc-img--podcast {
  background-image: url('../images/studio/img_9024.webp');
}
.svc-img--podcast::after {
  background: linear-gradient(200deg, rgba(3,3,5,.5) 0%, rgba(3,3,5,.15) 45%, rgba(3,3,5,.72) 100%);
}

.svc-img--video {
  background-image: url('../images/studio/img_8292.webp');
}
.svc-img--video::after {
  background: linear-gradient(200deg, rgba(3,3,5,.48) 0%, rgba(3,3,5,.18) 45%, rgba(3,3,5,.7) 100%);
}

.svc-img--live {
  background-image: url('../images/studio/img_8237.webp');
}
.svc-img--live::after {
  background: linear-gradient(200deg, rgba(3,3,5,.5) 0%, rgba(3,3,5,.15) 45%, rgba(3,3,5,.72) 100%);
}

.svc-img--ensaio {
  background-image: url('../images/studio/img_9015.webp');
}
.svc-img--ensaio::after {
  background: linear-gradient(200deg, rgba(3,3,5,.46) 0%, rgba(3,3,5,.14) 45%, rgba(3,3,5,.72) 100%);
}

/* Badge de preço — destaque comercial dentro do serviço de ensaio */
.ensaio-price-badge {
  display: inline-flex;
  align-items: center;
  gap: .625rem;
  background: rgba(201,168,76,.08);
  border: 1px solid rgba(201,168,76,.3);
  border-radius: 4px;
  padding: .75rem 1.25rem;
  margin-bottom: 1.5rem;
  color: var(--gold-light);
  font-size: .9rem;
}
.ensaio-price-badge i {
  color: var(--gold);
  font-size: 1rem;
}
.ensaio-price-badge strong {
  color: var(--gold-bright);
  font-size: 1.1rem;
}

/* Overlay redundante no HTML — ::after já cuida disso */
.svc-img__overlay { display: none; }

/* Efeito de luz varrendo o card no hover */
.service-visual-card:hover [class^="svc-img--"]::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(
    105deg,
    transparent 30%,
    rgba(201,168,76,.07) 50%,
    transparent 70%
  );
  animation: cardSweep .6s ease-out forwards;
  z-index: 3;
  pointer-events: none;
}
@keyframes cardSweep {
  from { transform: translateX(-100%); }
  to   { transform: translateX(100%); }
}

/* Label visível sobre a imagem */
.svc-img__label {
  position: absolute;
  bottom: 1.25rem;
  left: 1.25rem;
  z-index: 2;
  display: flex;
  align-items: center;
  gap: .625rem;
  font-family: var(--font-serif);
  font-size: 1rem;
  color: var(--text-2);
}
.svc-img__label i { color: var(--gold); font-size: 1.1rem; }

.service-visual-stats {
  padding:.75rem 1rem;
  background:var(--bg-card);
  border-top:1px solid var(--border-s);
  font-family:var(--font-caps);
  font-size:.65rem; letter-spacing:.08em;
  color:var(--text-4);
  display:flex; align-items:center; gap:.5rem;
}
.service-visual-stats i { color:var(--gold); }

/* ————————————————————————————————
   JEAN BARROS
   Background: amber dark #050300
———————————————————————————————— */
.jean-barros {
  background: var(--bg-jean);
  overflow: hidden;
}
.jean-barros__bg {
  position:absolute; inset:0;
  background:
    radial-gradient(ellipse 60% 70% at 30% 50%, rgba(201,168,76,.07), transparent),
    radial-gradient(ellipse 40% 60% at 80% 30%, rgba(100,50,200,.04), transparent);
  pointer-events:none;
}

.jean-barros__grid {
  display:grid;
  grid-template-columns:1fr 1.5fr;
  gap:clamp(50px,7vw,110px);
  align-items:center;
}

/* Foto com extensão negativa além do container no topo */
.jb-photo-wrap {
  position:relative;
  display:inline-block;
  margin-top: -60px;
}

.jb-photo {
  width:clamp(260px,28vw,360px);
  aspect-ratio:3/4;
  border-radius:6px;
  overflow:hidden;
  border:1px solid var(--border);
  position:relative;
  z-index:2;
}
/* Foto real de Jean Barros */
.jb-photo-placeholder {
  width:100%; height:100%;
  background-image: url('../images/jean-barros.webp');
  background-size: cover;
  background-position: 45% center;
  display:flex; flex-direction:column;
  align-items:center; justify-content:flex-end;
  gap:1rem; color:var(--text-4);
  position: relative;
}
/* Overlay gradiente na foto */
.jb-photo-placeholder::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(
    to bottom,
    rgba(5,3,0,.2) 0%,
    rgba(5,3,0,.1) 40%,
    rgba(5,3,0,.75) 100%
  );
}
.jb-photo-placeholder i  { display:none; }
.jb-photo-placeholder span {
  font-family:var(--font-serif); font-size:.85rem;
  color:var(--gold-light); position:relative; z-index:1;
  padding:.5rem 1rem; background:rgba(0,0,0,.5);
  border:1px solid rgba(201,168,76,.2); border-radius:2px;
  letter-spacing:.08em;
  margin-bottom: 1.5rem;
}
.jb-photo-placeholder small { display:none; }

.jb-ring {
  position:absolute; border:1px solid var(--border); border-radius:8px;
  animation:ringPulse 4s ease-in-out infinite; z-index:1;
}
.jb-ring--1 { inset:-14px; animation-delay:0s; }
.jb-ring--2 { inset:-28px; border-color:rgba(201,168,76,.07); animation-delay:-2s; }
@keyframes ringPulse { 0%,100%{opacity:.8}50%{opacity:.3} }

.jb-badge-float {
  position:absolute; bottom:-1.25rem; right:-1.25rem;
  background:rgba(4,4,4,.92);
  border:1px solid var(--border);
  border-radius:4px;
  padding:.75rem 1.125rem;
  display:flex; align-items:center; gap:.625rem;
  backdrop-filter:blur(10px);
  z-index:3;
}
.jb-badge-float i { color:var(--gold); font-size:1.25rem; }
.jb-badge-float strong { display:block; font-size:.8rem; color:var(--text-1); line-height:1; }
.jb-badge-float span   { font-size:.62rem; color:var(--text-4); font-family:var(--font-caps); letter-spacing:.08em; }

/* Conteúdo Jean Barros com linha vertical dourada à esquerda */
.jean-barros__content {
  position: relative;
  padding-left: 2rem;
}
.jean-barros__content::before {
  content: '';
  position: absolute;
  left: 0;
  top: 10%;
  height: 60%;
  width: 2px;
  background: linear-gradient(
    180deg,
    transparent 0%,
    var(--gold) 20%,
    var(--gold) 80%,
    transparent 100%
  );
  opacity: .7;
}

.jb-quote {
  background:var(--bg-card);
  border:1px solid var(--border-s);
  border-left:2px solid var(--gold);
  border-radius:0 4px 4px 0;
  padding:1.25rem 1.5rem;
  margin-bottom:1.5rem;
}
.jb-quote i  { color:var(--gold); font-size:1.25rem; margin-bottom:.75rem; display:block; }
.jb-quote p  { font-family:var(--font-serif); font-style:italic; font-size:1rem; line-height:1.75; color:var(--text-2); }

.jb-credentials {
  display:grid; grid-template-columns:repeat(3,1fr);
  gap:1rem; margin:2rem 0;
  padding:1.5rem 0;
  border-top:1px solid var(--border-s);
  border-bottom:1px solid var(--border-s);
}
.jb-cred { text-align:center; }
.jb-cred__num { font-family:var(--font-serif); font-size:2rem; font-weight:700; color:var(--gold-light); line-height:1; }
.jb-cred__num::after { content:'+'; font-size:1.2rem; }
.jb-cred__lbl { font-family:var(--font-caps); font-size:.6rem; letter-spacing:.1em; color:var(--text-4); margin-top:.3rem; }

/* ————————————————————————————————
   FLORENS STEISY — DIREÇÃO ARTÍSTICA
———————————————————————————————— */
.florens-steisy {
  background: #040305;
  overflow: hidden;
}
.florens-steisy__bg {
  position:absolute;
  inset:0;
  background:
    radial-gradient(ellipse 55% 65% at 25% 45%, rgba(201,168,76,.06), transparent),
    radial-gradient(ellipse 45% 55% at 85% 65%, rgba(112,62,135,.05), transparent);
  pointer-events:none;
}
.fs-photo-placeholder {
  width:100%;
  height:100%;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:.75rem;
  position:relative;
  background-image:url('../images/florens-steisy.webp');
  background-size:cover;
  background-position:center top;
}
.fs-photo-placeholder::before {
  content:'';
  position:absolute;
  inset:0;
  background:linear-gradient(to bottom, transparent 55%, rgba(4,3,5,.58));
}
.fs-credentials .jb-cred__num {
  font-family:inherit;
  font-size:1.45rem;
}
.fs-credentials .jb-cred__num::after { display:none; }

/* ————————————————————————————————
   LIS ROMA — FOTOGRAFIA E VÍDEO
———————————————————————————————— */
.lis-roma {
  background:#030405;
  overflow:hidden;
}
.lis-roma__bg {
  position:absolute;
  inset:0;
  background:
    radial-gradient(ellipse 55% 65% at 25% 50%, rgba(201,168,76,.055), transparent),
    radial-gradient(ellipse 45% 55% at 85% 35%, rgba(44,88,115,.07), transparent);
  pointer-events:none;
}
.lg-photo-placeholder {
  width:100%;
  height:100%;
  display:flex;
  align-items:flex-end;
  justify-content:center;
  position:relative;
  background-image:url('../images/lis-roma.webp');
  background-size:cover;
  background-position:center top;
}
.lg-photo-placeholder::before {
  content:'';
  position:absolute;
  inset:0;
  background:linear-gradient(to bottom, rgba(3,4,5,.02) 50%, rgba(3,4,5,.58));
}
.lg-credentials .jb-cred__num { font-size:1.4rem; }

@media (min-width: 1100px) and (max-width: 1320px) {
  .nav-link { padding-inline:.55rem; font-size:.6rem; letter-spacing:.08em; }
}
@media (min-width: 769px) and (max-width: 1099px) {
  .nav-link { padding-inline:.38rem; font-size:.55rem; letter-spacing:.05em; }
  .nav-menu { gap:0; }
  .logo-header__img { height:46px; width:auto; }
  .nav-cta { margin-left:.15rem; }
}

/* ————————————————————————————————
   NÚMEROS — SEÇÃO DE AUTORIDADE
   Background: puro preto #020202
   Corte diagonal inverso na borda inferior
———————————————————————————————— */
.numbers {
  background: var(--bg-numbers);
  padding: 100px 0;
  position: relative;
  overflow: hidden;
  /* Corte diagonal alternado */
  clip-path: polygon(0 0, 100% 0, 100% 100%, 0 92%);
  padding-bottom: calc(100px + 6vw);
  background-image:
    radial-gradient(ellipse 50% 30% at 25% 50%, rgba(201,168,76,.06), transparent),
    radial-gradient(ellipse 35% 60% at 80% 30%, rgba(201,168,76,.04), transparent);
}

/* Grain no numbers */
.numbers__grain {
  position: absolute;
  inset: 0;
  background-image: var(--grain);
  opacity: 0.03;
  pointer-events: none;
  z-index: 1;
}

.numbers .container { position: relative; z-index: 2; }

.numbers__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr) 1.4fr;
  gap: 0;
  align-items: center;
}

/* Alinhamentos verticais alternados */
.numbers__item:nth-child(1) { align-self: flex-start; }
.numbers__item:nth-child(2) { align-self: center; }
.numbers__item:nth-child(3) { align-self: flex-end; }

.numbers__item {
  padding: 3rem 2.5rem;
  border-right: 1px solid rgba(255,255,255,.06);
  position: relative;
}

.num-value {
  font-family: var(--font-serif);
  font-size: clamp(5rem, 10vw, 9rem);
  font-weight: 900;
  color: var(--gold-light);
  line-height: .9;
  display: block;
  letter-spacing: -0.04em;
}
.num-plus {
  font-family: var(--font-serif);
  font-size: clamp(2rem, 4vw, 3.5rem);
  color: var(--gold);
  vertical-align: super;
}
.num-label {
  font-family: var(--font-caps);
  font-size: .65rem;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--text-4);
  display: block;
  margin-top: .875rem;
  line-height: 1.6;
}

.numbers__quote {
  padding: 3rem 3rem 3rem 3.5rem;
  border-left: 2px solid var(--gold);
  background: linear-gradient(90deg, rgba(201,168,76,.04), transparent);
}
.numbers__quote i {
  font-size: 2rem;
  color: var(--gold);
  opacity: .4;
  display: block;
  margin-bottom: 1rem;
}
.numbers__quote blockquote {
  font-family: var(--font-serif);
  font-size: clamp(1.3rem, 2.5vw, 1.75rem);
  font-style: italic;
  line-height: 1.4;
  color: var(--text-1);
  margin-bottom: 1.25rem;
}
.numbers__quote cite {
  font-family: var(--font-caps);
  font-size: .65rem;
  letter-spacing: .18em;
  color: var(--gold);
}

/* ————————————————————————————————
   DIFERENCIAIS
   Background: cool dark #060608
   Corte diagonal na borda inferior
———————————————————————————————— */
.differentials {
  background: var(--bg-diff);
  clip-path: polygon(0 0, 100% 0, 100% 92%, 0 100%);
  padding-bottom: calc(var(--section-pad) + 4vw);
  background-image:
    radial-gradient(ellipse 40% 35% at 80% 75%, rgba(201,168,76,.06), transparent),
    radial-gradient(ellipse 50% 25% at 15% 20%, rgba(201,168,76,.04), transparent);
}

.diff-grid {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:1.5rem;
}
.diff-card {
  padding:2rem 1.75rem;
  border-radius:4px;
}
.diff-card__icon {
  width:48px; height:48px;
  background:var(--gold-glow-s);
  border:1px solid var(--border);
  border-radius:4px;
  display:flex; align-items:center; justify-content:center;
  font-size:1.2rem; color:var(--gold);
  margin-bottom:1.125rem;
  transition:background .3s, border-color .3s;
}
.diff-card:hover .diff-card__icon { background:var(--gold-glow); border-color:var(--gold); }
.diff-card h3 { font-family:var(--font-serif); font-size:1.05rem; font-weight:600; color:var(--text-1); margin-bottom:.5rem; }
.diff-card p  { font-size:.85rem; color:var(--text-3); line-height:1.75; }

/* ————————————————————————————————
   PORTFÓLIO
   Background: #040404
———————————————————————————————— */
.portfolio {
  background: var(--bg-portfolio);
  background-image:
    radial-gradient(ellipse 45% 30% at 55% 65%, rgba(201,168,76,.05), transparent);
}

.portfolio-filter {
  display:flex; gap:.5rem; justify-content:center; flex-wrap:wrap;
  margin-bottom:3rem;
}
.filter-btn {
  font-family:var(--font-caps); font-size:.65rem; font-weight:700;
  letter-spacing:.14em; text-transform:uppercase;
  padding:.5rem 1.25rem;
  background:transparent;
  border:1px solid var(--border-s);
  border-radius:2px;
  color:var(--text-4); cursor:pointer;
  transition:all .2s;
}
.filter-btn:hover,.filter-btn.active {
  border-color:var(--gold); color:var(--gold-light); background:var(--gold-glow-s);
}

/* Grid masonry-like — estilo Netflix */
.portfolio-grid {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  grid-auto-rows:220px;
  gap:1.25rem;
}
.pf-item--large { grid-column:span 2; grid-row:span 2; }

.pf-item {
  border-radius:4px;
  overflow:hidden;
  position:relative;
  /* Sem transform no container — o zoom é na imagem interna (overflow:hidden cortaria o translateY) */
  transition: box-shadow .35s var(--ease-out), opacity .3s;
  cursor: pointer;
}
.pf-item:hover {
  box-shadow: 0 0 0 2px var(--gold), 0 28px 64px rgba(0,0,0,.75), 0 0 40px rgba(201,168,76,.06);
}
.pf-item.hidden { opacity:0; pointer-events:none; transform:scale(.95); }

.pf-item__media { width:100%; height:100%; position:relative; }

/* Portfolio: imagem com zoom interno no hover */
.pf-video-placeholder {
  width:100%; height:100%;
  display:flex; flex-direction:column;
  align-items:center; justify-content:center;
  gap:.75rem;
  position:relative;
  background-size: 100%;            /* começa em 100% — zoom via JS/transition */
  background-position: center;
  transition: background-size .6s var(--ease-out);
}
.pf-item:hover .pf-video-placeholder {
  background-size: 110%;            /* zoom suave na imagem */
}

/* Overlay: semi-transparente no repouso, mais escuro no hover para destacar info */
.pf-video-placeholder::before {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 1;
  transition: background .4s;
}

/* Imagens reais + overlays por item */
.pf-bg--1 {
  background-image: url('https://images.unsplash.com/photo-1493225457124-a3eb161ffa5f?auto=format&fit=crop&w=600&q=80');
}
.pf-bg--1::before { background: linear-gradient(160deg, rgba(0,0,0,.65) 0%, rgba(0,0,0,.3) 50%, rgba(0,0,0,.8) 100%); }

.pf-bg--2 {
  background-image: url('https://images.unsplash.com/photo-1598387181032-a3103a2db5b3?auto=format&fit=crop&w=600&q=80');
}
.pf-bg--2::before { background: linear-gradient(160deg, rgba(0,0,0,.6) 0%, rgba(0,0,0,.3) 50%, rgba(0,0,0,.75) 100%); }

.pf-bg--3 {
  background-image: url('https://images.unsplash.com/photo-1590602847861-f357a9332bbc?auto=format&fit=crop&w=600&q=80');
}
.pf-bg--3::before { background: linear-gradient(160deg, rgba(0,0,0,.65) 0%, rgba(0,0,0,.3) 50%, rgba(0,0,0,.8) 100%); }

.pf-bg--4 {
  background-image: url('../images/studio/img_9009.webp');
}
.pf-bg--4::before { background: linear-gradient(160deg, rgba(0,0,0,.6) 0%, rgba(0,0,0,.25) 50%, rgba(0,0,0,.78) 100%); }

.pf-bg--5 {
  background-image: url('../images/studio/img_9023.webp');
}
.pf-bg--5::before { background: linear-gradient(160deg, rgba(0,0,0,.65) 0%, rgba(0,0,0,.3) 50%, rgba(0,0,0,.8) 100%); }

.pf-bg--6 {
  background-image: url('../images/studio/img_8281.webp');
}
.pf-bg--6::before { background: linear-gradient(160deg, rgba(0,0,0,.6) 0%, rgba(0,0,0,.3) 50%, rgba(0,0,0,.75) 100%); }

.pf-local-video {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  background:#050505;
  transition:transform .6s var(--ease-out), filter .35s ease;
}
.pf-local-media::before {
  background:linear-gradient(160deg, rgba(0,0,0,.32), rgba(0,0,0,.08) 48%, rgba(0,0,0,.82));
}
.pf-local-media .pf-play-btn { opacity:1; transform:scale(1); }
.pf-local-media.is-playing .pf-local-video { transform:scale(1.025); }
.pf-local-media.is-playing .pf-play-btn { opacity:.28; }
.pf-local-media.is-playing:hover .pf-play-btn { opacity:1; }

/* Botão "Assistir" — oculto por padrão, revela no hover */
.pf-play-btn {
  width: 56px; height: 56px;
  background: rgba(201,168,76,.92);
  border: none; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  color: var(--bg-0); font-size: .95rem;
  cursor: pointer;
  position: relative; z-index: 3;
  padding-left: 3px;
  opacity: 0;
  transform: scale(.7);
  transition: opacity .35s var(--ease-out), transform .35s var(--ease-spring), background .2s, box-shadow .2s;
  flex-shrink: 0;
}
/* Label "Assistir" ao lado do play */
.pf-play-btn::after {
  content: 'Assistir';
  position: absolute;
  left: calc(100% + 10px);
  white-space: nowrap;
  font-family: var(--font-caps);
  font-size: .6rem;
  font-weight: 700;
  letter-spacing: .14em;
  color: var(--text-1);
  opacity: 0;
  transform: translateX(-8px);
  transition: opacity .3s .1s, transform .3s .1s;
}
.pf-item:hover .pf-play-btn {
  opacity: 1;
  transform: scale(1);
}
.pf-item:hover .pf-play-btn::after {
  opacity: 1;
  transform: none;
}
.pf-play-btn:hover {
  background: var(--gold-bright);
  box-shadow: 0 0 0 8px rgba(201,168,76,.2), 0 8px 30px rgba(201,168,76,.5);
  transform: scale(1.1) !important;
}

/* Info: oculta abaixo e sobe no hover */
.pf-item__info {
  position: absolute; bottom: 0; left: 0; right: 0;
  padding: 1.25rem 1.25rem 1rem;
  background: linear-gradient(to top, rgba(0,0,0,.95) 0%, rgba(0,0,0,.5) 60%, transparent 100%);
  z-index: 2;
  transform: translateY(8px);
  opacity: .7;
  transition: transform .4s var(--ease-out), opacity .4s;
}
.pf-item:hover .pf-item__info {
  transform: none;
  opacity: 1;
}
.pf-tag {
  font-family:var(--font-caps); font-size:.58rem; font-weight:700;
  letter-spacing:.14em; text-transform:uppercase;
  color:var(--gold); display:block; margin-bottom:.35rem;
}
.pf-item__info h4 {
  font-family:var(--font-serif); font-size:1rem;
  color:var(--text-1); margin-bottom:.2rem;
  text-shadow: 0 2px 8px rgba(0,0,0,.8);
}
.pf-item__info p  { font-size:.75rem; color:var(--text-3); }

/* Wrap para iframe de YouTube */
.pf-iframe-wrap { position:absolute; inset:0; }
.pf-iframe-wrap iframe { width:100%; height:100%; border:none; }

.portfolio-cta {
  display:flex; align-items:center; justify-content:center; gap:1.5rem;
  margin-top:3rem;
  padding:2rem;
  background:var(--glass-bg);
  border:1px solid var(--glass-border);
  border-radius:4px;
  backdrop-filter:blur(8px);
}
.portfolio-cta p { font-family:var(--font-serif); font-size:1.1rem; color:var(--text-2); }

/* ————————————————————————————————
   DEPOIMENTOS
   Background: #050505
———————————————————————————————— */
.testimonials {
  background: var(--bg-testimonials);
  background-image:
    radial-gradient(ellipse 40% 40% at 70% 50%, rgba(201,168,76,.05), transparent);
}

.testimonials-slider { position:relative; overflow:hidden; }
.testimonials-track  { display:flex; gap:1.5rem; transition:transform .5s var(--ease-out); }

.testimonial-card {
  min-width:calc(33.333% - 1rem);
  border-radius:4px;
  padding:2rem;
  display:flex; flex-direction:column; gap:1rem;
  flex-shrink:0;
}
.tc-stars { color:var(--gold); font-size:.7rem; display:flex; gap:3px; }
.testimonial-card blockquote {
  font-family:var(--font-serif); font-style:italic;
  font-size:.97rem; line-height:1.8;
  color:var(--text-2); flex:1;
}
.tc-author { display:flex; align-items:center; gap:.875rem; padding-top:1rem; border-top:1px solid var(--border-s); }
.tc-avatar {
  width:38px; height:38px; border-radius:50%;
  background:var(--gold-glow);
  border:1px solid var(--border);
  display:flex; align-items:center; justify-content:center;
  font-family:var(--font-caps); font-size:.65rem; font-weight:700;
  color:var(--gold-light); flex-shrink:0;
}
.tc-author strong { display:block; font-size:.85rem; color:var(--text-1); }
.tc-author span   { font-size:.72rem; color:var(--text-4); }

.testimonials-controls { display:flex; align-items:center; justify-content:center; gap:1.5rem; margin-top:2.5rem; }
.t-btn {
  width:44px; height:44px; background:var(--bg-card);
  border:1px solid var(--border-s); border-radius:50%;
  color:var(--text-3); cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  font-size:.85rem;
  transition:all .2s;
}
.t-btn:hover { border-color:var(--gold); color:var(--gold); }
.t-dots { display:flex; gap:.5rem; }
.dot {
  width:6px; height:6px; border-radius:50%;
  background:var(--text-4); cursor:pointer;
  transition:background .2s, transform .2s;
}
.dot.active { background:var(--gold); transform:scale(1.4); }

/* ————————————————————————————————
   PREÇOS
   Background: #030303
———————————————————————————————— */
.pricing {
  background: var(--bg-pricing);
  background-image:
    radial-gradient(ellipse 50% 35% at 50% 0%, rgba(201,168,76,.07), transparent);
}

.pricing-urgency {
  display:flex; align-items:center; gap:.75rem;
  background:linear-gradient(90deg, rgba(26,16,0,.8), rgba(40,25,0,.8));
  border:1px solid rgba(201,168,76,.3);
  border-radius:4px;
  padding:1rem 1.5rem;
  margin-bottom:3rem;
  font-size:.85rem; color:var(--gold-light);
}
.pricing-urgency i { color:var(--gold); }
.pricing-urgency strong { color:var(--gold-bright); }

.pricing-grid {
  display:grid;
  grid-template-columns:repeat(5,1fr);
  gap:1.25rem;
  align-items:start;
}
.pricing-card {
  border-radius:4px;
  padding:2rem 1.75rem;
  display:flex; flex-direction:column;
  position:relative;
  transition: transform .3s var(--ease-out), box-shadow .3s var(--ease-out), border-color .3s;
}
.pricing-card:not(.pricing-card--featured):hover {
  transform: translateY(-5px);
  box-shadow: 0 20px 56px rgba(0,0,0,.5), 0 0 0 1px rgba(201,168,76,.12);
}
.pricing-card--featured {
  transform:translateY(-8px);
  border-color:var(--border) !important;
}
.pricing-card--featured:hover { border-color:var(--gold) !important; transform:translateY(-12px); box-shadow:0 32px 80px rgba(201,168,76,.18); }

.pc-badge {
  position:absolute; top:-1px; left:50%;
  transform:translateX(-50%);
  background:var(--gold); color:var(--bg-0);
  font-family:var(--font-caps); font-size:.58rem; font-weight:800;
  letter-spacing:.1em; padding:.28rem 1rem;
  border-radius:0 0 4px 4px; white-space:nowrap;
}
.pc-header { margin-bottom:1.75rem; padding-bottom:1.75rem; border-bottom:1px solid var(--border-s); }
.pc-cat { font-family:var(--font-caps); font-size:.6rem; font-weight:700; letter-spacing:.2em; color:var(--gold); display:block; margin-bottom:.25rem; }
.pc-name { font-family:var(--font-serif); font-size:1.15rem; font-weight:700; color:var(--text-1); margin-bottom:1.125rem; }
.pc-price { display:flex; flex-direction:column; }
.pc-from  { font-family:var(--font-caps); font-size:.58rem; letter-spacing:.1em; color:var(--text-4); }
.pc-val   { font-family:var(--font-serif); font-size:2.2rem; font-weight:700; color:var(--gold-light); line-height:1.1; }
.pc-per   { font-size:.75rem; color:var(--text-4); margin-top:.2rem; }

.pc-features { display:flex; flex-direction:column; gap:.6rem; margin-bottom:1.75rem; flex:1; }
.pc-features li { display:flex; align-items:center; gap:.625rem; font-size:.82rem; color:var(--text-3); }
.pc-features li i.fa-check { color:var(--gold); font-size:.65rem; }
.pc-features li i.fa-xmark  { color:var(--text-4); font-size:.65rem; }
.pc-features li.muted { opacity:.4; }

.pricing-note {
  text-align:center; margin-top:2rem;
  font-size:.78rem; color:var(--text-4);
  display:flex; align-items:center; justify-content:center; gap:.5rem;
}
.pricing-note i { color:var(--gold); }

/* ————————————————————————————————
   LIVE MUSIC ACADEMY
———————————————————————————————— */
.academy {
  background: #030208;
  background-image:
    radial-gradient(ellipse 55% 50% at 100% 50%, rgba(201,168,76,.06), transparent),
    radial-gradient(ellipse 40% 60% at 0% 50%, rgba(108,76,201,.04), transparent);
  position: relative;
  overflow: hidden;
}
.academy__bg-glow {
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse 60% 60% at 65% 50%, rgba(201,168,76,.05) 0%, transparent 70%);
  pointer-events: none;
}
/* Header centralizado — marca a seção como novo capítulo */
.academy__header {
  text-align: center;
  max-width: 680px;
  margin: 0 auto 4rem;
}

.academy__subtitle {
  font-size: 1.1rem;
  color: var(--text-3);
  margin-top: .75rem;
  font-style: italic;
}

.academy__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(3rem, 7vw, 6rem);
  align-items: start;
}
.academy__title {
  font-family: var(--font-serif);
  font-size: clamp(2.5rem, 5vw, 4rem);
  font-weight: 800;
  line-height: 1.1;
  color: var(--text-1);
  margin-bottom: 1.5rem;
}
.academy__title em {
  font-style: italic;
  background: linear-gradient(135deg, var(--gold-bright), var(--gold), var(--gold-light));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
.academy__desc {
  font-size: .95rem;
  color: var(--text-3);
  line-height: 1.85;
  margin-bottom: 1.25rem;
}
.academy__tags {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
  margin: 1.75rem 0;
}
.academy__tag {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  background: rgba(201,168,76,.07);
  border: 1px solid rgba(201,168,76,.2);
  border-radius: 100px;
  padding: .35rem .875rem;
  font-family: var(--font-caps);
  font-size: .58rem;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--gold-light);
}
.academy__tag i { color: var(--gold); font-size: .6rem; }
.academy__exclusive {
  display: flex;
  align-items: flex-start;
  gap: .75rem;
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.07);
  border-left: 2px solid var(--gold);
  border-radius: 4px;
  padding: .875rem 1rem;
  margin-bottom: 2rem;
  font-size: .84rem;
  color: var(--text-3);
  line-height: 1.6;
}
.academy__exclusive i { color: var(--gold); font-size: .8rem; margin-top: 2px; flex-shrink: 0; }
.academy__actions { display: flex; gap: 1rem; flex-wrap: wrap; }
.academy__visual {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}
.academy-card {
  width: 100%;
  max-width: 380px;
  background: rgba(12,10,18,.9);
  border: 1px solid rgba(201,168,76,.22);
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 0 0 1px rgba(201,168,76,.06), 0 24px 64px rgba(0,0,0,.6), 0 0 80px rgba(201,168,76,.04);
  position: relative;
  z-index: 2;
}
.academy-card__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1.5rem 1.5rem 1rem;
  border-bottom: 1px solid rgba(255,255,255,.05);
}
.academy-card__icon {
  width: 48px; height: 48px;
  background: linear-gradient(135deg, rgba(201,168,76,.15), rgba(201,168,76,.05));
  border: 1px solid rgba(201,168,76,.25);
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--gold);
  font-size: 1.2rem;
}
.academy-card__badge {
  background: var(--gold);
  color: var(--bg-0);
  font-family: var(--font-caps);
  font-size: .58rem;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  padding: .3rem .75rem;
  border-radius: 100px;
}
.academy-card__body { padding: 1.25rem 1.5rem; }
.academy-card__label {
  font-family: var(--font-caps);
  font-size: .6rem;
  font-weight: 700;
  letter-spacing: .15em;
  text-transform: uppercase;
  color: var(--text-4);
  margin-bottom: 1rem;
}
.academy-card__list { display: flex; flex-direction: column; gap: .75rem; }
.academy-card__list li {
  display: flex;
  align-items: center;
  gap: .625rem;
  font-size: .86rem;
  color: var(--text-2);
}
.academy-card__list li i { color: var(--gold); font-size: .65rem; flex-shrink: 0; }
.academy-card__footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1rem 1.5rem 1.25rem;
  border-top: 1px solid rgba(255,255,255,.05);
}
.academy-card__coming {
  font-family: var(--font-caps);
  font-size: .6rem;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--gold-dim);
}
.academy-card__dots { display: flex; gap: 5px; }
.academy-card__dots span {
  width: 6px; height: 6px;
  border-radius: 50%;
  background: var(--gold);
  opacity: .3;
  animation: dotPulse 1.6s ease-in-out infinite;
}
.academy-card__dots span:nth-child(2) { animation-delay: .3s; }
.academy-card__dots span:nth-child(3) { animation-delay: .6s; }
@keyframes dotPulse {
  0%,100% { opacity: .25; transform: scale(1); }
  50%      { opacity: .9;  transform: scale(1.25); }
}
.academy__ring {
  position: absolute;
  border-radius: 50%;
  border: 1px solid rgba(201,168,76,.08);
  pointer-events: none;
}
.academy__ring--1 {
  width: 360px; height: 360px;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  animation: ringRotate 18s linear infinite;
}
.academy__ring--2 {
  width: 480px; height: 480px;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  border-color: rgba(201,168,76,.04);
  animation: ringRotate 28s linear infinite reverse;
}
@keyframes ringRotate { to { transform: translate(-50%,-50%) rotate(360deg); } }

/* ————————————————————————————————
   ACADEMY — Produza seu curso online
———————————————————————————————— */
.academy__divider {
  display: flex;
  align-items: center;
  gap: 1.5rem;
  margin: clamp(3rem,6vw,5rem) 0 clamp(2.5rem,5vw,4rem);
  color: var(--text-3);
  font-family: var(--font-caps);
  font-size: .6rem;
  letter-spacing: .3em;
  text-transform: uppercase;
}
.academy__divider::before, .academy__divider::after {
  content: '';
  flex: 1;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(201,168,76,.2), transparent);
}
.academy__produce {
  display: flex;
  gap: clamp(1.5rem,3vw,3rem);
  align-items: flex-start;
  background: rgba(201,168,76,.04);
  border: 1px solid rgba(201,168,76,.14);
  border-radius: 20px;
  padding: clamp(2rem,3.5vw,3rem);
}
.academy__produce-badge {
  width: 52px; height: 52px;
  background: rgba(201,168,76,.1);
  border: 1px solid rgba(201,168,76,.25);
  border-radius: 14px;
  display: flex; align-items: center; justify-content: center;
  color: var(--gold);
  font-size: 1.25rem;
  flex-shrink: 0;
  margin-top: .2rem;
}
.academy__produce-body { flex: 1; min-width: 0; }
.academy__produce-eyebrow {
  font-family: var(--font-caps);
  font-size: .6rem;
  font-weight: 700;
  letter-spacing: .3em;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: .6rem;
}
.academy__produce-title {
  font-family: var(--font-serif);
  font-size: clamp(1.4rem,2.8vw,2rem);
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: -0.02em;
  color: var(--text-1);
  margin-bottom: .875rem;
}
.academy__produce-title em {
  font-style: italic;
  background: linear-gradient(135deg, var(--gold-bright), var(--gold));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.academy__produce-desc {
  font-size: .88rem;
  color: var(--text-3);
  line-height: 1.75;
  margin-bottom: 1.25rem;
}
.academy__produce-list {
  list-style: none;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .45rem .75rem;
  margin-bottom: 1.75rem;
}
.academy__produce-list li {
  font-size: .82rem;
  color: var(--text-2);
  display: flex;
  align-items: flex-start;
  gap: .45rem;
  line-height: 1.5;
}
.academy__produce-list li i {
  color: var(--gold);
  font-size: .65rem;
  flex-shrink: 0;
  margin-top: .25em;
}
.academy__produce-visual {
  flex-shrink: 0;
  width: clamp(190px,20vw,230px);
  align-self: center;
}
.apc {
  background: rgba(255,255,255,.025);
  border: 1px solid var(--border);
  border-radius: 14px;
  overflow: hidden;
}
.apc__top {
  background: rgba(201,168,76,.08);
  border-bottom: 1px solid rgba(201,168,76,.18);
  padding: .875rem 1.125rem;
  display: flex; align-items: center; gap: .65rem;
  color: var(--gold);
  font-size: .78rem;
  font-weight: 600;
  letter-spacing: .04em;
}
.apc__top i { font-size: .95rem; }
.apc__modules { list-style: none; padding: .5rem 0; }
.apc__modules li {
  padding: .5rem 1.125rem;
  font-size: .76rem;
  color: var(--text-3);
  display: flex; align-items: center; gap: .6rem;
  border-bottom: 1px solid rgba(255,255,255,.04);
}
.apc__modules li:last-child { border-bottom: none; }
.apc__num {
  font-family: var(--font-serif);
  font-size: .62rem;
  color: var(--gold);
  opacity: .65;
  flex-shrink: 0;
}
.apc__footer {
  background: rgba(201,168,76,.07);
  border-top: 1px solid rgba(201,168,76,.15);
  padding: .7rem 1.125rem;
  font-size: .7rem;
  color: var(--gold-light);
  display: flex; align-items: center; gap: .45rem;
}

@media (max-width:900px) {
  .academy__header { margin-bottom: 2.5rem; }
  .academy__grid { grid-template-columns: 1fr; gap: 3rem; }
  .academy__visual { order: -1; }
  .academy-card { max-width: 100%; }
  .academy__ring--1, .academy__ring--2 { display: none; }
  .academy__produce { flex-direction: column; }
  .academy__produce-badge { display: none; }
  .academy__produce-visual { width: 100%; }
  .academy__produce-list { grid-template-columns: 1fr; }
}
@media (max-width:480px) {
  .academy__actions { flex-direction: column; }
  .academy__actions .btn { width: 100%; justify-content: center; }
}

/* ————————————————————————————————
   CTA FINAL
   Background: amber dark #060400
———————————————————————————————— */
.cta {
  background: var(--bg-cta);
  text-align:center;
  background-image:
    radial-gradient(ellipse 60% 50% at 50% 0%, rgba(201,168,76,.1), transparent),
    radial-gradient(ellipse 35% 40% at 20% 80%, rgba(201,168,76,.05), transparent);
}
.cta__glow {
  position:absolute; top:0; left:50%; transform:translateX(-50%);
  width:700px; height:500px;
  background:radial-gradient(ellipse at top, rgba(201,168,76,.12), transparent 65%);
  pointer-events:none;
  z-index: 1;
}
.cta__inner { position:relative; z-index:2; max-width:700px; margin:0 auto; }
.cta__title {
  font-family:var(--font-serif);
  font-size:clamp(2.5rem,5vw,4rem);
  font-weight:900; line-height:1.1;
  letter-spacing: -0.03em;
  color:var(--text-1); margin-bottom:1.25rem;
}
.cta__title em { font-style:italic; color:var(--gold-light); text-shadow:0 0 60px rgba(201,168,76,.4); }
.cta__desc { font-size:1.05rem; color:var(--text-3); line-height:1.75; max-width:560px; margin:0 auto 2rem; }

.cta__urgency {
  display:inline-flex; align-items:center; gap:.625rem;
  background:linear-gradient(90deg,rgba(26,10,0,.8),rgba(40,20,0,.8));
  border:1px solid rgba(201,168,76,.3);
  border-radius:100px;
  padding:.5rem 1.25rem;
  font-family:var(--font-caps); font-size:.68rem; letter-spacing:.06em;
  color:var(--gold-light); margin-bottom:2rem;
}
.cta__urgency i { color:#ff6b35; }
.cta__urgency strong { color:var(--gold-bright); }

.cta__actions { display:flex; gap:1rem; justify-content:center; flex-wrap:wrap; margin-bottom:2rem; }
.cta__meta {
  display:flex; gap:2rem; justify-content:center; flex-wrap:wrap;
}
.cta__meta span,
.cta__meta a {
  display:flex; align-items:center; gap:.5rem;
  font-family:var(--font-caps); font-size:.68rem;
  letter-spacing:.08em; color:var(--text-4);
}
.cta__meta a:hover { color:var(--gold-light); }
.cta__meta i { color:var(--gold); }

/* ————————————————————————————————
   MAPA — LOCALIZAÇÃO DO ESTÚDIO
———————————————————————————————— */
.studio-map {
  background: #010101;
  padding: 0 0 60px;
  border-top: 1px solid var(--border-s);
}

.studio-map__inner {
  max-width: var(--container);
  margin: 0 auto;
  padding: 0 clamp(20px, 5vw, 60px);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1.5rem;
}

.studio-map__label {
  display: flex;
  align-items: center;
  gap: .625rem;
  padding-top: 2.5rem;
  font-family: var(--font-caps);
  font-size: .65rem;
  font-weight: 700;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--gold);
}

.studio-map__frame {
  width: 100%;
  border-radius: 12px;
  overflow: hidden;
  border: 1px solid var(--border-s);
  position: relative;
  /* Sombra sutil — profundidade sem peso visual */
  box-shadow: 0 8px 48px rgba(0,0,0,.55), 0 0 0 1px rgba(201,168,76,.06);
}

/* Overlay de integração — escurece levemente o mapa */
.studio-map__frame::after {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, .15);
  pointer-events: none;
  border-radius: 12px;
}

.studio-map__frame iframe {
  display: block;
  width: 100%;
  height: 400px;
  border-radius: 12px;
  filter: grayscale(0.6) brightness(0.88) contrast(1.05);
}

.studio-map__cta {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  font-family: var(--font-caps);
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--gold);
  border: 1px solid var(--border);
  padding: .75rem 1.5rem;
  border-radius: 2px;
  transition: color .2s, border-color .2s, background .2s;
}
.studio-map__cta:hover {
  color: var(--gold-light);
  border-color: var(--gold);
  background: var(--gold-glow-xs);
}

/* Link de endereço no footer */
.footer-map-link {
  color: inherit;
  transition: color .2s;
}
.footer-map-link:hover {
  color: var(--gold-light);
}
.footer-map-link i {
  color: var(--gold);
}

/* ————————————————————————————————
   RODAPÉ
———————————————————————————————— */
.footer { background:var(--bg-hero); border-top:1px solid var(--border-s); padding:70px 0 0; }
.footer-grid { display:grid; grid-template-columns:2fr 1fr 1fr 1.5fr; gap:3rem; padding-bottom:3rem; border-bottom:1px solid var(--border-s); }
.footer-brand p { font-size:.85rem; color:var(--text-4); line-height:1.75; margin:1.25rem 0 1.5rem; }
.footer-social { display:flex; gap:.625rem; }
.footer-social a {
  width:36px; height:36px; background:var(--bg-card);
  border:1px solid var(--border-s); border-radius:4px;
  display:flex; align-items:center; justify-content:center;
  color:var(--text-4); font-size:.85rem;
  transition:all .2s;
}
.footer-social a:hover { border-color:var(--gold); color:var(--gold); }
.footer-nav h4,.footer-contact h4 { font-family:var(--font-caps); font-size:.62rem; font-weight:700; letter-spacing:.2em; text-transform:uppercase; color:var(--text-1); margin-bottom:1.25rem; }
.footer-nav ul,.footer-contact ul { display:flex; flex-direction:column; gap:.6rem; }
.footer-nav li a { font-size:.85rem; color:var(--text-4); transition:color .18s; white-space:nowrap; }
.footer-nav li a:hover { color:var(--gold-light); }
.footer-contact li { display:flex; align-items:flex-start; gap:.625rem; font-size:.82rem; color:var(--text-4); }
.footer-contact li a { display:flex; align-items:flex-start; gap:.625rem; color:inherit; }
.footer-contact li a:hover { color:var(--gold-light); }
.footer-contact i { color:var(--gold); font-size:.72rem; margin-top:3px; flex-shrink:0; }
.footer-bottom { display:flex; justify-content:space-between; align-items:center; padding:1.5rem 0; gap:1rem; }
.footer-bottom p { font-size:.75rem; color:var(--text-4); }

/* ————————————————————————————————
   WHATSAPP FLUTUANTE
———————————————————————————————— */
.whatsapp-float {
  position:fixed; bottom:2rem; right:2rem;
  width:58px; height:58px;
  background:#25D366; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  font-size:1.5rem; color:#fff;
  z-index:900;
  box-shadow:0 8px 32px rgba(37,211,102,.4);
  transition:transform .2s var(--ease-spring), box-shadow .2s;
}
.whatsapp-float:hover { transform:scale(1.1); box-shadow:0 12px 40px rgba(37,211,102,.55); }
.wa-pulse {
  position:absolute; inset:-4px;
  border:2px solid rgba(37,211,102,.4);
  border-radius:50%;
  animation:waPulse 2.5s ease-in-out infinite;
}
@keyframes waPulse {
  0%,100%{transform:scale(1);opacity:.6}
  50%    {transform:scale(1.35);opacity:0}
}

/* ————————————————————————————————
   ASSINATURA DA MARCA — Live Music Gold Line
   Elemento visual exclusivo: linha orgânica dourada animada
   Aparece no hero, entre seções e no rodapé
———————————————————————————————— */

/* Canvas da assinatura — inserido via JS em #hero, .footer */
.brand-signature {
  display: block;
  width: 100%;
  height: 48px;
  pointer-events: none;
  position: relative;
  z-index: 3;
  opacity: .7;
}

/* Versão compacta nas divisórias entre seções */
.brand-signature--divider {
  height: 32px;
  opacity: .4;
  margin: 0;
}

/* Versão no rodapé */
.brand-signature--footer {
  height: 28px;
  opacity: .25;
  margin-bottom: 2rem;
}

/* ————————————————————————————————
   IDENTIDADE SONORA VISUAL
   Frequência / onda nos cards de diff e depoimentos
———————————————————————————————— */

/* Micro-vibração no hover dos diff-cards */
.diff-card:hover {
  animation: microVibrate .18s ease-in-out;
}
@keyframes microVibrate {
  0%   { transform: translateY(-5px) rotate(0deg); }
  25%  { transform: translateY(-5px) rotate(.15deg); }
  50%  { transform: translateY(-6px) rotate(-.15deg); }
  75%  { transform: translateY(-5px) rotate(.1deg); }
  100% { transform: translateY(-5px) rotate(0deg); }
}

/* Equalizer bars decorativos no eyebrow de seções com `data-eq` */
.section-eyebrow--eq::before {
  content: '';
  display: inline-block;
  width: 18px;
  height: 10px;
  margin-right: .6rem;
  background-image:
    linear-gradient(var(--gold), var(--gold)),
    linear-gradient(var(--gold), var(--gold)),
    linear-gradient(var(--gold), var(--gold)),
    linear-gradient(var(--gold), var(--gold));
  background-size: 3px 60%, 3px 100%, 3px 40%, 3px 80%;
  background-position: 0 bottom, 5px bottom, 10px bottom, 15px bottom;
  background-repeat: no-repeat;
  vertical-align: middle;
  animation: eqAnim 1.2s ease-in-out infinite alternate;
}
@keyframes eqAnim {
  0%   { background-size: 3px 60%,  3px 100%, 3px 40%,  3px 80%; }
  33%  { background-size: 3px 90%,  3px 55%,  3px 100%, 3px 45%; }
  66%  { background-size: 3px 40%,  3px 80%,  3px 60%,  3px 100%; }
  100% { background-size: 3px 70%,  3px 30%,  3px 90%,  3px 55%; }
}

/* Variação de luz no scroll — glow que "respira" baseado em posição */
/* Aplicado via JS adicionando classe .in-view em cada section */
.section.in-view::after {
  animation: sectionBreath 6s ease-in-out infinite;
}
@keyframes sectionBreath {
  0%,100% { opacity: .6; }
  50%     { opacity: 1; }
}

/* ————————————————————————————————
   RESPONSIVIDADE
———————————————————————————————— */
@media (max-width:1100px) {
  .pricing-grid { grid-template-columns:repeat(3,1fr); }
  .pricing-card--featured { transform:none; }
  .pricing-card--featured:hover { transform:translateY(-4px); }
  .hero-services-bar .hsb-item { padding:1rem 1.25rem; }
  .numbers__grid { grid-template-columns: repeat(2, 1fr); }
  .numbers__quote { border-left: none; border-top: 2px solid var(--gold); grid-column: span 2; padding: 2rem; }
}

@media (max-width:960px) {
  /* Desabilita clip-path em mobile para evitar cortes abruptos */
  .about, .differentials, .numbers { clip-path: none; padding-bottom: var(--section-pad); }

  .hero-inner       { grid-template-columns:1fr; }
  .hero-visual      { display:none; }
  .hero-content     { text-align:center; }
  .hero-actions     { justify-content:center; }
  .hero-proof       { justify-content:center; }
  .hero-subtitle    { max-width:100%; margin-inline:auto; }
  .hero-stat        { display:none; }
  .ht-line--3       { font-size: clamp(3.5rem, 12vw, 6rem); }

  .split-layout     { grid-template-columns:1fr; }
  .studio-mockup    { max-width:500px; margin:0 auto; }
  .service-block    { grid-template-columns:1fr; gap:2.5rem; }
  .service-block--text-right .service-block__visual { order:0; }
  .service-block--text-right .service-block__content{ order:0; }
  .jean-barros__grid  { grid-template-columns:1fr; text-align:center; }
  .jb-photo-wrap { margin: 0 auto; }
  .jb-quote      { text-align:left; }
  .jb-credentials{ max-width:380px; margin:2rem auto; }
  .jean-barros__content > .btn { margin:0 auto; display:flex; width:fit-content; }
  .jean-barros__content { padding-left: 0; }
  .jean-barros__content::before { display: none; }

  .diff-grid     { grid-template-columns:repeat(2,1fr); }
  .portfolio-grid{ grid-template-columns:repeat(2,1fr); grid-auto-rows:200px; }
  .pf-item--large{ grid-column:span 2; }
  .footer-grid   { grid-template-columns:1fr 1fr; }
  .testimonial-card { min-width:calc(50% - .75rem); }
  .numbers__grid { grid-template-columns: repeat(2, 1fr); }
  .numbers__item { padding: 2rem 1.5rem; }
  .numbers__quote { grid-column: span 2; }
}

@media (max-width:768px) {
  .studio-map__frame iframe { height: 280px; }

  /* Logo header — tablet */
  .logo-header__img { height: 52px; }
  .navbar.scrolled .logo-header__img { height: 44px; }

  /* Logo footer */
  .logo-footer__img { height: 70px; }

  /* Watermark: menor e mais discreta no mobile */
  .hero-bg__watermark { width: clamp(120px, 28%, 200px); opacity: 0.03; }

  .urgency-bar { font-size:.6rem; gap:.4rem; padding:.5rem 1rem; }
  .navbar { top:28px; }

  .nav-menu {
    position:fixed; top:0; left:0; right:0; height:100vh;
    background:rgba(2,2,2,.97); backdrop-filter:blur(24px);
    flex-direction:column; justify-content:center; align-items:center; gap:.4rem;
    transform:translateX(100%); transition:transform .4s var(--ease-out);
    z-index:999;
  }
  .nav-menu.is-open { transform:translateX(0); }
  .nav-link { font-size:.88rem; padding:1rem 2rem; letter-spacing:.15em; }
  .nav-cta  { margin:.5rem 0 0; }
  .nav-toggle { display:flex; z-index:1000; }
  .nav-toggle.is-open span:nth-child(1) { transform:rotate(45deg) translate(4.5px,4.5px); }
  .nav-toggle.is-open span:nth-child(2) { opacity:0; transform:scaleX(0); }
  .nav-toggle.is-open span:nth-child(3) { transform:rotate(-45deg) translate(4.5px,-4.5px); }

  .hero { padding-top:100px; }
  .ht-line--2 { text-shadow:0 0 30px rgba(201,168,76,.5); }

  .hero-services-bar { flex-wrap:wrap; gap:0; }
  .hsb-item { flex:1 1 40%; justify-content:center; }
  .hsb-sep  { display:none; }

  .diff-grid     { grid-template-columns:1fr; }
  .portfolio-grid{ grid-template-columns:1fr; grid-auto-rows:220px; }
  .pf-item--large{ grid-column:span 1; }
  .pricing-grid  { grid-template-columns:1fr; }
  .testimonial-card { min-width:100%; }
  .footer-grid   { grid-template-columns:1fr; gap:1.75rem; }
  .footer-bottom { flex-direction:column; text-align:center; }
  .cta__actions  { flex-direction:column; align-items:center; }
  .cta__meta     { flex-direction:column; gap:.75rem; align-items:center; }
  .about-cta     { flex-direction:column; gap:1.5rem; }

  .numbers__grid { grid-template-columns: 1fr 1fr; }
  .numbers__item { padding: 1.5rem 1rem; }
  .numbers__quote { grid-column: span 2; padding: 1.5rem; }
  .jb-photo-wrap { margin-top: 0; }
}

@media (max-width:480px) {
  .logo-header__img { height: 46px; }
  .logo-footer__img { height: 62px; }
  .hero-bg__watermark { display: none; } /* abaixo de 480px a watermark compete com o texto */

  .hero-actions  { flex-direction:column; }
  .hero-actions .btn { width:100%; justify-content:center; }
  .portfolio-cta { flex-direction:column; text-align:center; }
  .numbers__grid { grid-template-columns: 1fr; }
  .numbers__item { border-right: none; border-bottom: 1px solid rgba(255,255,255,.06); }
  .numbers__quote { grid-column: span 1; }
  .ht-line--3 { font-size: clamp(3rem, 16vw, 5rem); }
}
