:root{
  --bg:#08111f;
  --bg-soft:#0d1728;
  --surface:#101c30;
  --surface-2:#13233c;
  --surface-3:#0e1930;
  --text:#f5f9ff;
  --muted:#aab9d2;
  --blue:#1f8cff;
  --cyan:#2bd3ff;
  --orange:#ffb703;
  --orange-deep:#ff6a00;
  --green:#72dd35;
  --pink:#ff4b8b;
  --line:rgba(255,255,255,.08);
  --shadow:0 24px 48px rgba(0,0,0,.34);
  --container:min(1180px, calc(100% - 40px));
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:"Inter", Arial, sans-serif;
  color:var(--text);
  background:
    radial-gradient(circle at top left, rgba(43,211,255,.14), transparent 26%),
    radial-gradient(circle at top right, rgba(255,183,3,.10), transparent 26%),
    linear-gradient(180deg, #07101d 0%, #0a1322 45%, #0c1627 100%);
}
a{text-decoration:none;color:inherit}
img{display:block;max-width:100%}
.container{width:var(--container);margin:0 auto}

.header{
  position:sticky;
  top:0;
  z-index:50;
  background:rgba(7,16,29,.82);
  backdrop-filter:blur(14px);
  border-bottom:1px solid var(--line);
}
.nav{
  min-height:82px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
}
.brand img{
  width:128px;
  max-width:32vw;
  object-fit:contain;
}
.desktop-nav{
  display:flex;
  align-items:center;
  gap:28px;
  font-weight:700;
  color:var(--muted);
}
.desktop-nav a{position:relative}
.desktop-nav a::after{
  content:"";
  position:absolute;
  left:0;
  bottom:-7px;
  width:0;
  height:2px;
  background:linear-gradient(90deg,var(--cyan),var(--orange));
  transition:width .24s ease;
}
.desktop-nav a:hover{color:#fff}
.desktop-nav a:hover::after{width:100%}
.menu-btn{
  display:none;
  width:46px;
  height:46px;
  border-radius:14px;
  border:1px solid var(--line);
  background:var(--surface);
  cursor:pointer;
}
.menu-btn span{
  display:block;
  width:18px;
  height:2px;
  background:#fff;
  border-radius:999px;
  margin:4px auto;
}
.mobile-nav{display:none;padding:0 20px 16px}
.mobile-nav.open{display:grid;gap:10px}
.mobile-nav a{
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:14px;
  padding:14px 16px;
  font-weight:700;
  box-shadow:var(--shadow);
}

.hero{padding:72px 0 56px}
.hero-grid{
  display:grid;
  grid-template-columns:1.02fr .98fr;
  gap:34px;
  align-items:center;
}
.eyebrow,.section-tag,.product-pill,.feature-label{
  display:inline-flex;
  align-items:center;
  min-height:38px;
  padding:9px 14px;
  border-radius:999px;
  font-size:.82rem;
  font-weight:800;
}
.eyebrow,.section-tag{
  color:#dff7ff;
  background:linear-gradient(135deg, rgba(31,140,255,.18), rgba(255,183,3,.16));
  border:1px solid rgba(255,255,255,.09);
}
.hero-copy h1,.section-copy h2,.section-head h2,.product-copy h3,.contact-card h2,.info-panel h3,.feature-text h2{
  letter-spacing:-.045em;
}
.hero-copy h1{
  margin:18px 0 16px;
  font-size:clamp(2.4rem, 5vw, 4.4rem);
  line-height:1.03;
  max-width:720px;
}
.hero-copy p,.section-copy p,.section-head p,.product-copy p,.contact-card p,.feature-text p{
  color:var(--muted);
  line-height:1.82;
  font-size:1.03rem;
}
.hero-copy p{margin:0;max-width:620px}
.hero-actions{
  display:flex;
  flex-wrap:wrap;
  gap:14px;
  margin-top:28px;
}
.hero-points{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:20px;
}
.hero-points span{
  padding:10px 14px;
  border-radius:999px;
  background:rgba(255,255,255,.04);
  border:1px solid var(--line);
  color:#dce7fb;
  font-weight:700;
}
.hero-feature-card{
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(circle at top right, rgba(255,183,3,.18), transparent 28%),
    radial-gradient(circle at bottom left, rgba(43,211,255,.16), transparent 28%),
    linear-gradient(145deg, #0e1a2d, #12223c);
  border:1px solid rgba(255,255,255,.08);
  border-radius:30px;
  padding:28px;
  box-shadow:var(--shadow);
}
.feature-label{
  background:linear-gradient(135deg, var(--orange), var(--orange-deep));
  color:#fff;
}
.feature-logo{
  width:min(100%, 560px);
  margin:24px auto 10px;
  filter:drop-shadow(0 20px 40px rgba(0,0,0,.30));
}
.feature-text h2{
  margin:10px 0 10px;
  font-size:2rem;
}
.feature-text p{margin:0;max-width:520px}

.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:54px;
  padding:14px 24px;
  border-radius:14px;
  font-weight:800;
  transition:transform .2s ease, box-shadow .2s ease;
}
.btn:hover{transform:translateY(-2px)}
.btn-primary{
  background:linear-gradient(135deg,var(--orange) 0%, var(--orange-deep) 100%);
  color:#fff;
  box-shadow:0 14px 28px rgba(255,106,0,.22);
}
.btn-secondary{
  background:rgba(255,255,255,.05);
  color:#fff;
  border:1px solid rgba(255,255,255,.08);
}
.full{width:100%}

.section{padding:88px 0}
.section-soft{
  background:
    radial-gradient(circle at 15% 15%, rgba(43,211,255,.06), transparent 24%),
    radial-gradient(circle at 85% 85%, rgba(255,183,3,.06), transparent 24%),
    linear-gradient(180deg, #0b1524 0%, #0a1220 100%);
}
.section-grid{
  display:grid;
  grid-template-columns:1.02fr .98fr;
  gap:28px;
  align-items:start;
}
.section-copy h2,.section-head h2,.contact-card h2{
  margin:18px 0 14px;
  font-size:clamp(2rem,4vw,3rem);
  line-height:1.06;
}
.section-copy p,.section-head p,.product-copy p,.contact-card p{margin:0 0 14px}
.info-panel,.contact-card,.product-card{
  background:linear-gradient(180deg, rgba(18,32,54,.92), rgba(15,25,44,.96));
  border:1px solid rgba(255,255,255,.08);
  border-radius:26px;
  box-shadow:var(--shadow);
}
.info-panel{padding:28px}
.info-panel h3{margin:0 0 18px;font-size:1.28rem}
.info-panel ul,.product-copy ul{
  list-style:none;
  padding:0;
  margin:0;
  display:grid;
  gap:12px;
}
.info-panel li,.product-copy li{
  position:relative;
  padding-left:22px;
  color:var(--muted);
  line-height:1.72;
}
.info-panel li::before,.product-copy li::before{
  content:"•";
  position:absolute;
  left:0;
  top:0;
  color:var(--orange);
  font-weight:900;
}

.section-head{text-align:center;max-width:780px;margin:0 auto 34px}
.products-grid{display:grid;gap:28px}
.product-card{
  display:grid;
  grid-template-columns:.9fr 1.1fr;
  gap:28px;
  align-items:center;
  padding:28px;
}
.featured-product{
  border-color:rgba(255,183,3,.25);
  background:
    radial-gradient(circle at top right, rgba(255,183,3,.08), transparent 24%),
    linear-gradient(180deg, rgba(19,35,60,.98), rgba(15,26,45,.98));
}
.product-logo{
  background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.06);
  border-radius:22px;
  min-height:290px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:24px;
}
.dark-card{
  background:linear-gradient(145deg, #0d1830, #14284a);
}
.product-logo img{
  max-width:100%;
  max-height:240px;
  object-fit:contain;
}
.product-pill{
  background:rgba(43,211,255,.12);
  color:#dff7ff;
  border:1px solid rgba(43,211,255,.2);
}
.product-pill-alt{
  background:rgba(255,183,3,.14);
  color:#fff1c4;
  border:1px solid rgba(255,183,3,.24);
}
.product-copy h3{margin:10px 0 14px;font-size:1.8rem}

.contact-wrap{max-width:780px}
.contact-card{padding:34px}
.mail-link{
  display:inline-block;
  margin:8px 0 22px;
  color:#ffd27a;
  font-weight:700;
  word-break:break-word;
}

.footer{padding:28px 0 40px}
.footer-inner{
  border-top:1px solid var(--line);
  padding-top:22px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
}
.footer-brand img{
  width:112px;
  object-fit:contain;
}
.footer p{color:var(--muted);font-size:.92rem}

@media (max-width: 980px){
  .hero-grid,.section-grid,.product-card{grid-template-columns:1fr}
}
@media (max-width: 720px){
  .desktop-nav{display:none}
  .menu-btn{display:block}
  .hero{padding:44px 0 30px}
  .section{padding:68px 0}
  .hero-copy h1{font-size:clamp(2rem,10vw,3.1rem)}
  .footer-inner{flex-direction:column;text-align:center}
}
@media (max-width:560px){
  :root{--container:min(1180px, calc(100% - 22px))}
  .nav{min-height:74px}
  .brand img{width:108px}
  .btn{width:100%}
  .hero-feature-card,.info-panel,.product-card,.contact-card{border-radius:22px}
  .product-logo{min-height:220px}
  .feature-text h2{font-size:1.6rem}
}

.logo-header{width:32px;height:32px;object-fit:contain;}

.destaque{background:linear-gradient(135deg,#0f172a,#1e293b);color:#fff;padding:80px 0;}
.destaque-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:40px;align-items:center;}
.destaque-copy h1{font-size:2.6rem;margin:16px 0;}
.destaque-copy p{color:#cbd5e1;}
.tag{background:#f59e0b;color:#fff;padding:6px 14px;border-radius:999px;font-size:.8rem;font-weight:700;}



/* Ajuste fino da seção Produto em destaque */
.destaque{
  padding: 56px 0 36px;
}

.destaque-grid{
  grid-template-columns: minmax(0, 1.1fr) minmax(280px, 420px);
  gap: 28px;
}

.destaque-copy{
  max-width: 680px;
}

.destaque-copy h1{
  font-size: clamp(2rem, 4vw, 3rem);
  line-height: 1.08;
  margin: 14px 0 14px;
}

.destaque-copy p{
  max-width: 620px;
  line-height: 1.75;
  margin-bottom: 0;
}

.destaque-img{
  display: flex;
  align-items: center;
  justify-content: center;
}

.destaque-img img{
  width: 100%;
  max-width: 360px;
  height: auto;
  object-fit: contain;
  filter: drop-shadow(0 18px 34px rgba(0,0,0,.28));
}

@media (max-width: 900px){
  .destaque{
    padding: 44px 0 20px;
  }

  .destaque-grid{
    grid-template-columns: 1fr;
    gap: 22px;
    text-align: left;
  }

  .destaque-img{
    justify-content: flex-start;
  }

  .destaque-img img{
    max-width: 260px;
  }
}

@media (max-width: 560px){
  .destaque-copy h1{
    font-size: 1.9rem;
  }

  .destaque-img img{
    max-width: 220px;
  }
}


/* Seção sobre a marca */
.section-brand{
  padding: 72px 0 18px;
}

.brand-grid{
  display:grid;
  grid-template-columns: 1.02fr .98fr;
  gap: 34px;
  align-items:center;
}

.brand-copy h2{
  margin:18px 0 14px;
  font-size:clamp(2rem,4vw,3.1rem);
  line-height:1.08;
  letter-spacing:-.04em;
}

.brand-copy p{
  margin:0 0 14px;
  color:var(--muted);
  line-height:1.8;
  font-size:1.02rem;
}

.brand-card{
  background:#fff;
  border:1px solid var(--line);
  border-radius:28px;
  padding:14px;
  box-shadow:var(--shadow);
}

.brand-card img{
  width:100%;
  height:460px;
  object-fit:cover;
  border-radius:20px;
}

@media (max-width: 900px){
  .brand-grid{
    grid-template-columns:1fr;
  }

  .brand-card img{
    height:360px;
  }
}

@media (max-width: 560px){
  .section-brand{
    padding: 56px 0 8px;
  }

  .brand-card{
    border-radius:22px;
  }

  .brand-card img{
    height:280px;
    border-radius:16px;
  }
}