/* ==========================================
   NEVES & CO — DEV CINEMATOGRÁFICO
   Premium + animações vivas com performance
   ========================================== */

:root{
  --verde:#2E5D4A;
  --verde-claro:#3E8B63;
  --verde-hover:#276247;
  --bege:#F5F3EE;
  --bege-2:#EEEAE2;
  --dourado:#C6A969;
  --preto:#0B0E0C;
  --grafite:#111;
  --cinza:#8e8e8e;
  --branco:#fff;

  --grad-verde: linear-gradient(135deg,#2E5D4A 0%,#3E8B63 100%);
  --grad-dourado: linear-gradient(135deg,#C6A969 0%,#f1d07a 100%);
  --sombra: 0 10px 35px rgba(0,0,0,.45);
  --trans: all .3s ease;
}

*{margin:0;padding:0;box-sizing:border-box}
body{
  font-family:'Montserrat',sans-serif;
  background:radial-gradient(1200px 700px at 10% 10%,#0f1512,transparent),
             radial-gradient(900px 600px at 90% 20%,#0d1310,transparent),
             var(--preto);
  color:var(--bege);
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}


/* ===== Hero ===== */
.hero{
  position:relative;
  min-height:100svh;
  display:grid;
  place-items:center;
  overflow:hidden;
  border-bottom:1px solid rgba(255,255,255,.06);
}

.layer{
  position:absolute;inset:0;width:100%;height:100%;
  pointer-events:none;display:block
}
.layer--matrix{opacity:.45;mix-blend-mode:screen}
.layer--particles{opacity:.28}

.hero__glow{
  position:absolute;inset:-10%;
  background:radial-gradient(600px 300px at 20% 30%, rgba(198,169,105,.18), transparent 60%),
             radial-gradient(800px 400px at 80% 20%, rgba(62,139,99,.22), transparent 60%);
  filter: blur(40px);
  animation:glowMove 16s ease-in-out infinite alternate;
}
@keyframes glowMove{
  0%{transform:translate3d(-2%,0,0) scale(1)}
  100%{transform:translate3d(2%,1%,0) scale(1.05)}
}

.hero__content{
  position:relative;z-index:5;text-align:center;
  max-width:980px;padding:32px
}
.hero__content h1{
  font-size: clamp(2.2rem, 4vw + 1rem, 4rem);
  font-weight:800;letter-spacing:0.5px;line-height:1.1;
  text-shadow:0 0 18px rgba(198,169,105,.28);
}
.hero__content h1 span{
  background:var(--grad-dourado);
  -webkit-background-clip:text;-webkit-text-fill-color:transparent
}
.hero__content p{
  margin-top:14px;color:var(--bege-2);
  font-size: clamp(1rem, 1.2vw + .6rem, 1.25rem);
  opacity:.95
}
.hero__cta{display:flex;gap:14px;justify-content:center;margin-top:24px;flex-wrap:wrap}

.btn{
  position:relative;display:inline-block;
  padding:14px 28px;border-radius:14px;
  text-decoration:none;font-weight:800;letter-spacing:.5px;
  transition:var(--trans);will-change:transform,box-shadow
}
.btn--primary{
  color:#111;background:var(--grad-dourado);
  box-shadow:0 10px 26px rgba(198,169,105,.35)
}
.btn--primary:hover{transform:translateY(-3px) scale(1.03)}
.btn--ghost{
  color:var(--bege);border:1px solid rgba(255,255,255,.18);
  background:rgba(255,255,255,.03);backdrop-filter:blur(6px)
}
.btn--ghost:hover{border-color:var(--dourado);box-shadow:0 6px 20px rgba(198,169,105,.18)}
.btn--xl{padding:16px 40px;border-radius:18px}

.hero__meta{
  margin-top:20px;display:flex;gap:14px;flex-wrap:wrap;justify-content:center;
  color:#d7d3c6;font-size:.95rem;opacity:.9
}
.hero__meta span{background:rgba(255,255,255,.06);padding:8px 12px;border-radius:10px;border:1px solid rgba(255,255,255,.08)}

/* ===== Sections ===== */
.section{padding:96px 20px}
h2{
  text-align:center;margin-bottom:40px;
  font-size: clamp(1.6rem, 1.2rem + 2vw, 2.4rem);
  color:var(--dourado);letter-spacing:1px
}

/* ===== Benefits ===== */
.benefits{
  position:relative;
  background: radial-gradient(900px 500px at 50% 0%, rgba(62,139,99,.12), transparent 70%),
              #0F1110;
}
.benefits .grid{
  max-width:1120px;margin:0 auto;
  display:grid;gap:22px;
  grid-template-columns:repeat(auto-fit,minmax(250px,1fr));
}
.card{
  position:relative;overflow:hidden;
  background:linear-gradient(180deg, rgba(255,255,255,.04) 0%, rgba(255,255,255,.02) 100%);
  border:1px solid rgba(198,169,105,.22);
  border-radius:16px;padding:28px;box-shadow:var(--sombra);
  transition:var(--trans)
}
.card::after{
  content:"";position:absolute;inset:-1px;
  background:radial-gradient(300px 120px at 10% -10%, rgba(198,169,105,.22), transparent 60%);
  opacity:0;transition:var(--trans)
}
.card:hover{transform:translateY(-6px);border-color:var(--dourado)}
.card:hover::after{opacity:1}
.card h3{color:var(--verde-claro);margin-bottom:8px}
.card p{color:#d6d2c6;line-height:1.7}

/* ===== Offer ===== */
.offer{
  position:relative;text-align:center;overflow:hidden;
  background:var(--grad-verde);color:var(--bege);
}
.offer__wrap{position:relative;z-index:2;max-width:700px;margin:0 auto}
.offer__led{
  position:absolute;inset:0;z-index:1;pointer-events:none;
  background:
    radial-gradient(400px 120px at 50% 0%, rgba(255,255,255,.18), transparent 60%),
    url('../img/grid-lines.png') repeat;
  opacity:.07;mix-blend-mode:screen;animation:gridAnim 50s linear infinite
}
@keyframes gridAnim{from{background-position:0 0, 0 0}to{background-position:1000px 500px, 800px 300px}}
.offer .cut{text-decoration:line-through;color:#c9c3b1}
.offer__sub{opacity:.95}
.offer__price{
  font-size: clamp(2.2rem, 6vw, 3.6rem);
  background:var(--grad-dourado);
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;
  margin:8px 0 10px
}
.offer__desc{color:#f3eddc;margin-bottom:18px}
.offer__limit{margin-top:12px;color:#efe7cf;opacity:.9}
.btn--gold{
  color:#111;background:var(--grad-dourado);
  box-shadow:0 10px 30px rgba(198,169,105,.38)
}
.btn--gold:hover{transform:translateY(-3px) scale(1.03)}

/* ===== About ===== */
.about{
  text-align:center;background:#0e0f0e;
  border-top:1px solid rgba(255,255,255,.06)
}
.about p{
  max-width:880px;margin:0 auto;color:#d7d2c4;
  line-height:1.9;font-size:1.08rem
}

/* ===== Footer ===== */
.footer{
  display:grid;place-items:center;gap:8px;
  padding:46px 20px;background:#0b0e0c;color:#aaa;
  border-top:1px solid rgba(255,255,255,.06);position:relative
}
.back{color:var(--dourado);text-decoration:none;font-weight:700}
.back:hover{color:#f1d07a}
.to-top{
  position:absolute;right:16px;top:50%;transform:translateY(-50%);
  color:#cfcfcf;text-decoration:none;border:1px solid rgba(255,255,255,.12);
  padding:8px 10px;border-radius:10px
}
.to-top:hover{border-color:var(--dourado);color:var(--dourado)}

/* ===== Responsividade ===== */
@media (max-width: 860px){
  .hero__meta{gap:8px}
  .btn{padding:12px 20px;border-radius:12px}
  .btn--xl{padding:14px 28px}
  .section{padding:72px 16px}
}

/* ===== Acessibilidade: reduz movimento ===== */
@media (prefers-reduced-motion: reduce){
  .layer,.hero__glow,.offer__led{animation:none !important}
  .btn:hover,.card:hover{transform:none !important}
}

/* ===== SOBRE ===== */
.about__container {
  max-width: 1100px;
  margin: auto;
  text-align: center;
  padding: 80px 20px;
}

.about__container h2 {
  font-size: 2.2rem;
  color: var(--dourado);
  margin-bottom: 20px;
}

.about__container span {
  color: var(--verde-claro);
}

.about__container p {
  color: #ddd;
  font-size: 1.1rem;
  margin-bottom: 50px;
}

.about__grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: 40px;
}

.about__item {
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 14px;
  padding: 30px;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.about__item:hover {
  transform: translateY(-6px);
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2);
}

.about__item i {
  font-size: 2rem;
  color: var(--dourado);
  margin-bottom: 15px;
}

/* ===== DIVISOR ===== */
.divider {
  height: 80px;
  background: linear-gradient(90deg, transparent, var(--dourado), transparent);
  opacity: 0.2;
  margin: 0;
}

/* ===== RODAPÉ ===== */
.footer {
  background: var(--grafite);
  color: #ccc;
  padding: 60px 20px 30px;
}

.footer__grid {
  max-width: 1100px;
  margin: auto;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: 40px;
  align-items: start;
  text-align: center;
}

.footer__brand h3 {
  color: var(--dourado);
  font-weight: 700;
  margin-bottom: 10px;
}

.footer__links a {
  display: block;
  color: #ccc;
  margin-bottom: 10px;
  text-decoration: none;
  transition: color 0.3s;
}

.footer__links a:hover {
  color: var(--dourado);
}

.footer__socials a {
  color: var(--dourado);
  font-size: 1.4rem;
  margin: 0 8px;
  transition: opacity 0.3s;
}

.footer__socials a:hover {
  opacity: 0.7;
}

.footer__copy {
  text-align: center;
  margin-top: 40px;
  font-size: 0.9rem;
  color: #999;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
  padding-top: 20px;
}

/* ===== RESPONSIVIDADE MOBILE ===== */
@media (max-width: 600px) {
  body {
    font-size: 15px;
    text-align: center;
  }

  .hero {
    padding: 60px 10px;
    min-height: 90svh;
  }

  .hero__content {
    padding: 20px 10px;
  }

  .hero__content h1 {
    font-size: 2rem;
    line-height: 1.2;
  }

  .hero__content p {
    font-size: 1rem;
  }

  .hero__cta {
    flex-direction: column;
    gap: 10px;
  }

  .btn {
    width: 100%;
    text-align: center;
    padding: 14px;
  }

  .benefits .grid,
  .about__grid,
  .footer__grid {
    grid-template-columns: 1fr;
    gap: 24px;
  }

  .section {
    padding: 60px 12px;
  }

  h2 {
    font-size: 1.6rem;
  }

  .card {
    padding: 22px;
  }

  .offer__price {
    font-size: 2.4rem;
  }

  .footer {
    padding: 40px 15px;
  }

  .to-top {
    display: none; /* esconde o botão de voltar ao topo */
  }
}