/* ==========================================================================
   Louvai Music (/gravacao) - estilos da landing de gravacao
   Complementa site.css (tema-louvai). Prefixo g- para nao colidir.
   ========================================================================== */

/* topo com botao */
.g-topo__inner{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:96px}
.g-topo__marca{display:flex;align-items:center;gap:14px;text-decoration:none;color:#fff}
.g-topo__marca img{width:120px;height:auto}
.g-topo__marca p{font-size:15px;line-height:1.35}
.g-topo__cta{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  min-height:46px;padding:10px 20px;border-radius:8px;
  background:#0b7a3b;color:#fff;font-weight:700;font-size:15px;text-decoration:none;white-space:nowrap;
}
.g-topo__cta:hover{background:#096a33;color:#fff}
.g-topo__cta svg{width:20px;height:20px;fill:currentColor}

/* hero em duas colunas */
.g-hero__grid{
  display:grid;grid-template-columns:1.05fr .95fr;gap:40px;align-items:center;
  text-align:left;padding:56px 20px 60px;position:relative;z-index:2;
}
.g-hero__grid h1{font-size:40px;line-height:1.25;font-weight:900;margin-bottom:16px}
.g-hero__grid h1 b{color:#ffd166}
.g-hero__lead{font-size:18px;line-height:1.6;margin-bottom:22px;max-width:560px}
.g-hero__acoes{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:22px}
.g-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  min-height:54px;padding:12px 26px;border-radius:8px;
  font-size:17px;font-weight:700;text-decoration:none;transition:background .2s,transform .2s;
}
.g-btn--zap{background:#0b7a3b;color:#fff}
.g-btn--zap:hover{background:#096a33;color:#fff;transform:translateY(-1px)}
.g-btn--zap svg{width:22px;height:22px;fill:currentColor}
.g-btn--linha{border:2px solid #fff;color:#fff;background:transparent}
.g-btn--linha:hover{background:rgba(255,255,255,.14);color:#fff}
.g-btn--laranja{background:var(--laranja-cta);color:#fff}
.g-btn--laranja:hover{background:#d94e1c;color:#fff}
.g-pills{display:flex;flex-wrap:wrap;gap:10px;list-style:none;margin:0;padding:0}
.g-pills li{
  font-size:13px;font-weight:600;padding:7px 12px;border-radius:999px;
  background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.35);
}
.g-hero__video .video{max-width:100%;border-radius:14px;box-shadow:0 20px 50px rgba(0,0,0,.45)}
.g-hero__legenda{font-size:13px;opacity:.85;margin-top:10px;text-align:center}

/* faixa de prova */
.g-prova{background:var(--azul-topo);color:#fff}
.g-prova__inner{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;padding:26px 20px;text-align:center}
.g-prova b{display:block;font-size:26px;line-height:1.2;font-weight:900;color:#ffd166}
.g-prova span{font-size:13px;line-height:1.4;opacity:.9}

/* secoes */
.g-secao{padding:64px 0}
.g-secao--cinza{background:var(--cinza-caixa)}
.g-titulo{font-size:38px;line-height:1.25;font-weight:900;color:var(--azul);text-align:center;margin-bottom:12px}
.g-sub{font-size:17px;line-height:1.6;text-align:center;max-width:760px;margin:0 auto 36px;color:#333}
.g-sub b{font-weight:700}

/* cards "o que voce pode gravar" */
.g-tipos{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.g-tipo{
  background:#fff;border:1px solid #e6e8f0;border-radius:14px;padding:26px 22px;
  box-shadow:0 6px 20px rgba(6,82,221,.06);display:flex;flex-direction:column;gap:10px;
}
.g-tipo__icone{
  width:56px;height:56px;border-radius:14px;background:var(--azul);color:#fff;
  display:flex;align-items:center;justify-content:center;font-size:30px;
}
.g-tipo h3{font-size:21px;line-height:1.3;font-weight:800}
.g-tipo p{font-size:14.5px;line-height:1.65;color:#333;flex:1}
.g-tipo__preco{font-size:14px;font-weight:700;color:var(--azul)}
.g-tipo a{font-size:14px;font-weight:700;color:var(--laranja-cta);text-decoration:none}
.g-tipo a:hover{text-decoration:underline}

/* planos */
.g-grupo{margin-bottom:44px}
.g-grupo__titulo{
  font-size:22px;font-weight:800;color:#111;margin-bottom:6px;
  display:flex;align-items:center;gap:12px;
}
.g-grupo__titulo span{
  font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.6px;
  background:var(--azul);color:#fff;padding:4px 10px;border-radius:999px;
}
.g-grupo__desc{font-size:15px;line-height:1.6;color:#444;margin-bottom:20px;max-width:820px}
.g-planos{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:22px;align-items:start}
.g-planos--4{grid-template-columns:repeat(4,1fr)}
.g-plano{
  position:relative;background:#fff;border:1px solid #e6e8f0;border-radius:16px;
  padding:22px;display:flex;flex-direction:column;gap:12px;
  box-shadow:0 8px 26px rgba(6,82,221,.07);
}
.g-plano--destaque{border:2px solid var(--laranja-louvai);box-shadow:0 12px 34px rgba(247,159,31,.22)}
.g-plano__badge{
  position:absolute;top:-13px;left:22px;
  background:var(--laranja-louvai);color:#fff;font-size:12px;font-weight:800;
  text-transform:uppercase;letter-spacing:.6px;padding:5px 12px;border-radius:999px;
}
.g-plano h3{font-size:22px;line-height:1.25;font-weight:800;color:#111}
.g-plano__preco{font-size:30px;line-height:1;font-weight:900;color:var(--azul)}
.g-plano__preco small{font-size:13px;font-weight:600;color:#555;margin-left:6px}
.g-plano__para{font-size:14px;line-height:1.55;color:#444;font-style:italic}
.g-plano ul{margin:0;padding-left:18px;font-size:14px;line-height:1.7;color:#222}
.g-plano ul li::marker{color:var(--laranja-louvai)}
.g-plano .video{max-width:100%;border-radius:10px;margin-top:4px}
.g-plano__exemplo{font-size:12.5px;line-height:1.45;color:#555}
.g-plano__exemplo b{color:#222}
.g-plano .g-btn{margin-top:auto;min-height:48px;font-size:15.5px}

/* combos e extras */
.g-extras{display:grid;grid-template-columns:1.35fr 1fr 1fr;gap:22px}
.g-caixa{background:#fff;border-radius:16px;padding:26px 24px;border:1px solid #e6e8f0}
.g-caixa h3{font-size:20px;font-weight:800;color:var(--azul);margin-bottom:8px}
.g-caixa p{font-size:14.5px;line-height:1.65;color:#333}
.g-caixa ul{margin:10px 0 0;padding-left:18px;font-size:14.5px;line-height:1.75}
.g-caixa .g-preco{font-size:26px;font-weight:900;color:var(--laranja-cta);margin:6px 0 4px}
.g-tabela{width:100%;border-collapse:collapse;margin-top:12px;font-size:14px}
.g-tabela th{text-align:left;font-size:12px;text-transform:uppercase;letter-spacing:.5px;color:#666;padding:8px 6px;border-bottom:2px solid #e6e8f0}
.g-tabela td{padding:10px 6px;border-bottom:1px solid #eef0f5;vertical-align:top;line-height:1.4}
.g-tabela td.d{text-align:right;white-space:nowrap}
.g-tabela .velho{color:#999;text-decoration:line-through;font-size:13px}
.g-tabela .novo{font-weight:800;color:var(--azul)}

/* projetos */
.g-projetos{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.g-projeto .video{max-width:100%;border-radius:12px}
.g-projeto p{font-size:14px;line-height:1.45;margin-top:10px;color:#222}
.g-projeto p b{display:block;font-weight:700}
.g-projeto p span{color:#666;font-size:13px}

/* pagamento */
.g-pagto{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.g-pagto__item{background:#fff;border-radius:14px;padding:22px;border:1px solid #e6e8f0;text-align:center}
.g-pagto__item b{display:block;font-size:20px;font-weight:900;color:var(--azul);margin-bottom:6px}
.g-pagto__item p{font-size:14px;line-height:1.55;color:#333}

/* faq */
.g-faq details{background:var(--cinza-caixa);border-radius:12px;padding:0 24px;margin-bottom:12px}
.g-faq summary{
  cursor:pointer;list-style:none;font-size:17px;font-weight:700;color:var(--azul);
  padding:18px 0;display:flex;justify-content:space-between;gap:12px;align-items:center;
}
.g-faq summary::-webkit-details-marker{display:none}
.g-faq summary::after{content:"+";font-size:24px;font-weight:400;color:var(--laranja-louvai);flex:0 0 auto}
.g-faq details[open] summary::after{content:"\2013"}
.g-faq details p{font-size:14.5px;line-height:1.75;padding:0 0 18px;color:#222}

/* rodape */
.g-rodape{background:var(--azul-topo);color:#fff;padding:36px 20px}
.g-rodape__inner{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:28px;align-items:start}
.g-rodape img{width:64px;height:auto;margin-bottom:10px}
.g-rodape p,.g-rodape a{font-size:14px;line-height:1.7;color:#e8e8ff;text-decoration:none}
.g-rodape a:hover{text-decoration:underline;color:#fff}
.g-rodape h4,.g-rodape__tit{font-size:13px;text-transform:uppercase;letter-spacing:.6px;color:#ffd166;margin:0 0 8px}
.g-rodape__copy{border-top:1px solid rgba(255,255,255,.15);margin-top:26px;padding-top:16px;font-size:13px;text-align:center;color:#bdbdea}

/* responsivo */
@media (max-width:980px){
  .g-tipos{grid-template-columns:repeat(2,1fr)}
  .g-planos--4{grid-template-columns:repeat(2,1fr)}
  .g-extras{grid-template-columns:1fr}
  .g-projetos{grid-template-columns:repeat(2,1fr)}
  .g-pagto{grid-template-columns:repeat(2,1fr)}
  .g-prova__inner{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:800px){
  .g-topo__inner{flex-direction:column;gap:12px;padding:14px 0}
  .g-topo__marca{flex-direction:column;text-align:center}
  .g-hero__grid{grid-template-columns:1fr;gap:28px;padding:36px 20px 40px;text-align:center}
  .g-hero__grid h1{font-size:28px}
  .g-hero__lead{font-size:16px;margin-left:auto;margin-right:auto}
  .g-hero__acoes{justify-content:center}
  .g-pills{justify-content:center}
  .g-btn{width:100%}
  .g-secao{padding:44px 0}
  .g-titulo{font-size:28px}
  .g-sub{font-size:15px}
  .g-tipos{grid-template-columns:1fr}
  .g-planos--4{grid-template-columns:1fr}
  .g-projetos{grid-template-columns:1fr}
  .g-pagto{grid-template-columns:1fr}
  .g-rodape__inner{grid-template-columns:1fr;text-align:center}
  .g-rodape img{margin-left:auto;margin-right:auto}
}

/* ---- versao curta (20/09): cards com video, nota dos valores, depoimentos ---- */
.g-tipo .video{max-width:100%;border-radius:10px;margin-bottom:4px}
.g-tipo__exemplo{font-size:12.5px;line-height:1.4;color:#666;margin:0 0 6px}
.g-tipo .g-btn{margin-top:8px;min-height:46px;font-size:15px;width:100%}
.g-nota-planos{
  max-width:860px;margin:28px auto 0;text-align:center;font-size:14.5px;line-height:1.7;color:#333;
  background:var(--cinza-caixa);border-radius:12px;padding:16px 22px;
}
.g-nota-planos b{color:var(--azul)}
/* ---- depoimentos: seletor de artistas + painel (Instagram + clipe) ---- */
.g-depo-nav{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;margin-bottom:22px}
.g-depo-chip{
  display:flex;align-items:center;gap:10px;padding:8px 16px 8px 8px;border-radius:999px;
  background:#fff;border:2px solid #e6e8f0;cursor:pointer;font:inherit;text-align:left;color:#222;
  transition:border-color .2s,box-shadow .2s,transform .2s;
}
.g-depo-chip img{width:44px;height:44px;border-radius:50%;object-fit:cover;flex:0 0 44px}
.g-depo-chip span{font-size:12.5px;line-height:1.3;color:#666}
.g-depo-chip span b{display:block;font-size:14.5px;color:#111}
.g-depo-chip:hover{border-color:#b9c6ff;transform:translateY(-1px)}
.g-depo-chip.is-on{border-color:var(--azul);box-shadow:0 8px 22px rgba(6,82,221,.16)}
.g-depo-chip.is-on span b{color:var(--azul)}
.g-depo-box{position:relative}
.g-depo-track{
  display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;
  scrollbar-width:none;border-radius:20px;background:#fff;border:1px solid #e6e8f0;box-shadow:0 12px 36px rgba(6,82,221,.08);
}
.g-depo-track::-webkit-scrollbar{display:none}
.g-depo-slide{
  flex:0 0 100%;scroll-snap-align:start;display:grid;grid-template-columns:400px 1fr;gap:32px;align-items:start;padding:28px;
}
.g-depo-slide__ig{display:flex;justify-content:center}
.g-depo-slide__ig blockquote.instagram-media{margin:0 !important;width:100% !important;max-width:400px !important;min-width:326px !important;border-radius:14px !important;box-shadow:none !important;border:1px solid #eef0f5 !important;min-height:420px}
.g-depo-slide__ig blockquote.instagram-media > a{display:flex;align-items:center;justify-content:center;min-height:420px;padding:20px;text-align:center;font-size:14px;font-weight:600;color:var(--azul);text-decoration:none}
.g-depo-slide__txt{position:relative;padding-top:6px;min-width:0}
.g-depo-slide__aspas{position:absolute;right:0;top:-18px;font-size:120px;line-height:1;font-weight:900;color:var(--azul);opacity:.08;pointer-events:none}
.g-depo-slide__tipo{display:inline-block;font-size:11.5px;font-weight:700;text-transform:uppercase;letter-spacing:.7px;color:#a8380b;background:#fff3e8;padding:5px 10px;border-radius:999px;margin-bottom:12px}
.g-depo-slide h3{font-size:28px;line-height:1.2;font-weight:900;color:#111;margin-bottom:4px}
.g-depo-slide__proj{font-size:16px;font-weight:600;color:var(--azul);margin-bottom:10px}
.g-depo-slide__fez{font-size:15px;line-height:1.65;color:#333;margin-bottom:18px;max-width:560px}
.g-depo-slide__rotulo{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.7px;color:#666;margin-bottom:8px}
.g-depo-slide__txt .video{max-width:560px;margin:0;border-radius:12px}
.g-depo-slide__link{display:inline-block;margin-top:14px;font-size:14px;font-weight:700;color:var(--azul);text-decoration:none}
.g-depo-slide__link:hover{text-decoration:underline}
.g-depo-seta{
  position:absolute;top:50%;transform:translateY(-50%);z-index:2;
  width:46px;height:46px;border-radius:50%;border:0;cursor:pointer;
  background:var(--azul);color:#fff;font-size:30px;line-height:1;font-weight:400;
  box-shadow:0 8px 20px rgba(6,82,221,.3);display:flex;align-items:center;justify-content:center;padding:0 0 3px;
}
.g-depo-seta:hover{background:#0546b8}
.g-depo-seta--esq{left:-23px}
.g-depo-seta--dir{right:-23px}
@media (max-width:980px){
  .g-depo-slide{grid-template-columns:1fr;gap:22px;padding:20px}
  .g-depo-slide__txt .video{max-width:100%}
}
@media (max-width:800px){
  .g-depo-nav{justify-content:flex-start;flex-wrap:nowrap;overflow-x:auto;padding:4px 2px 8px;margin:0 -20px 16px;padding-left:20px;scrollbar-width:none}
  .g-depo-nav::-webkit-scrollbar{display:none}
  .g-depo-chip{flex:0 0 auto;padding:6px 12px 6px 6px}
  .g-depo-chip img{width:36px;height:36px;flex-basis:36px}
  .g-depo-chip span{font-size:11.5px}
  .g-depo-chip span b{font-size:13px}
  .g-depo-slide{padding:14px}
  .g-depo-slide__ig blockquote.instagram-media{min-width:0 !important}
  .g-depo-slide h3{font-size:22px}
  .g-depo-slide__aspas{display:none}
  .g-depo-seta{width:38px;height:38px;font-size:24px;top:190px;transform:none}
  .g-depo-seta--esq{left:-8px}
  .g-depo-seta--dir{right:-8px}
}
.g-cta__nota{margin-top:22px;font-size:13.5px !important;line-height:1.6 !important;opacity:.85;max-width:620px;margin-left:auto;margin-right:auto}
@media (max-width:800px){ .g-depo{flex-basis:calc(100vw - 56px);max-width:360px} }
.g-tipo .g-btn,.g-tipo .g-btn:hover{color:#fff;text-decoration:none}
.g-tipo p.g-tipo__exemplo{flex:0 0 auto}
/* acessibilidade (25/10/2026): alvo de toque minimo de 24px nos links do rodape */
.g-rodape p a{display:inline-block;padding:3px 0;min-height:24px}
.botao-cta{background:#c4450f}
.botao-cta:hover{background:#a83a0c}
