/* Amesons Aparelhos Auditivos — protótipo de prospecção */

:root{
  --vinho: #4A2321;
  --vinho-2: #5C2C29;
  --marrom: #6B4A3D;
  --vermelho: #D2574B;
  --vermelho-claro: #E58275;
  --vermelho-medio: #C24936;
  --vermelho-escuro: #B8402F;
  --creme: #FFFBF9;
  --creme-cartao: #FDF2EF;
  --texto: #3A2321;
  --texto-apagado: #6B5754;
  --texto-bem-apagado: #C4A199;
  --linha: #F1DCD7;
  --branco: #FFFFFF;
  --ease-premium: cubic-bezier(0.4, 0, 0.2, 1);
  --display: 'Fredoka', sans-serif;
  --body: 'Inter', sans-serif;
}

*{ margin:0; padding:0; box-sizing:border-box; }

html{ scroll-behavior:smooth; }

body{
  font-family: var(--body);
  color: var(--texto);
  background: var(--creme);
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}

img{ display:block; max-width:100%; }

a{ color:inherit; text-decoration:none; }

ul, ol{ list-style:none; }

@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  *{ animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; }
}

.eyebrow{
  display:block;
  font-size: 0.8rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--vermelho-escuro);
  margin-bottom: 0.9rem;
}

.titulo{
  font-family: var(--display);
  font-weight: 600;
  font-size: clamp(1.7rem, 1.3rem + 1.6vw, 2.5rem);
  line-height: 1.15;
  letter-spacing: -0.01em;
  color: var(--vinho);
}

.destaque{ color: var(--vermelho-escuro); }

/* ===== BOTÕES ===== */
.btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  padding: 0.95rem 1.7rem;
  border-radius: 999px;
  font-family: var(--body);
  font-weight: 600;
  font-size: 0.98rem;
  position: relative;
  overflow: hidden;
  white-space: nowrap;
  transition: transform .5s var(--ease-premium), box-shadow .5s var(--ease-premium);
}
.btn--solid{
  background: var(--vinho);
  color: var(--creme);
  box-shadow: 0 14px 30px -14px rgba(74,35,33,0.55);
}
.btn--gold{
  background: linear-gradient(135deg, var(--vermelho-medio), var(--vermelho-escuro));
  color: var(--branco);
  box-shadow: 0 14px 30px -14px rgba(184,64,47,0.5);
}
.btn--solid::after, .btn--gold::after{
  content:""; position:absolute; top:-50%; left:-60%; width:20%; height:200%;
  background: rgba(255,255,255,0.25); transform: rotate(30deg); pointer-events:none;
  transition: transform .7s var(--ease-premium);
}
.btn--solid:hover::after, .btn--gold:hover::after{ transform: translate(600%,0) rotate(30deg); }
.btn--solid:hover, .btn--gold:hover{ transform: scale(1.02); }
.btn--solid:active, .btn--gold:active{ transform: scale(0.97); }

/* ===== DEMO BAR ===== */
.demo-bar{
  background: var(--vinho);
  color: var(--texto-bem-apagado);
  font-size: 0.76rem;
  line-height: 1.4;
  text-align: center;
  padding: 9px 1.5rem;
}
.demo-bar strong{ color: var(--vermelho-claro); font-weight:700; }

/* ===== NAV ===== */
.nav{
  position: sticky; top:0; z-index: 40;
  background: rgba(255,251,249,0.92);
  backdrop-filter: blur(10px);
  transition: background-color .4s var(--ease-premium), box-shadow .4s var(--ease-premium);
}
.nav.is-scrolled{ box-shadow: 0 10px 30px -22px rgba(74,35,33,0.35); }
.nav__inner{
  max-width: 1180px; margin:0 auto;
  display:flex; align-items:center; gap: 1.5rem;
  padding: 1.1rem 1.5rem;
  transition: padding-block .4s var(--ease-premium);
}
.nav.is-scrolled .nav__inner{ padding-block: 0.7rem; }

.brand{ display:flex; align-items:center; gap:0.65rem; margin-right:auto; }
.brand__icon{ width:40px; height:40px; flex-shrink:0; object-fit:contain; }
.brand__text{ display:flex; flex-direction:column; line-height:1.1; }
.brand__nome{ font-family: var(--display); font-weight:600; font-size:1.3rem; color: var(--vinho); }
.brand__sub{ font-size:0.62rem; letter-spacing:0.14em; text-transform:uppercase; color: var(--texto-apagado); }

.nav__links{ display:flex; gap:1.8rem; }
.nav__links a{ font-size:0.92rem; font-weight:500; color: var(--marrom); position:relative; }
.nav__links a::after{
  content:""; position:absolute; left:0; bottom:-5px; width:0; height:1.5px;
  background: var(--vermelho); transition: width .35s var(--ease-premium);
}
.nav__links a:hover::after{ width:100%; }

.nav__cta{ padding: 0.7rem 1.3rem; font-size:0.88rem; }

.nav__burger{
  display:none; flex-direction:column; justify-content:center; gap:5px;
  width:40px; height:40px; background:none; border:none; cursor:pointer;
}
.nav__burger span{ display:block; width:22px; height:2px; background: var(--vinho); transition: transform .3s var(--ease-premium), opacity .3s var(--ease-premium); }
.nav__mobile{
  display:none; flex-direction:column; gap: 0.2rem;
  max-height:0; overflow:hidden;
  background: var(--creme-cartao);
  transition: max-height .4s var(--ease-premium);
  border-top: 1px solid var(--linha);
}
.nav__mobile a{ padding: 0.9rem 1.5rem; font-size:0.95rem; font-weight:500; border-bottom:1px solid var(--linha); }
.nav__mobile .btn{ margin: 0.9rem 1.5rem 1.1rem; }
.nav.is-open .nav__mobile{ max-height: 400px; }
.nav.is-open .nav__burger span:nth-child(1){ transform: translateY(7px) rotate(45deg); }
.nav.is-open .nav__burger span:nth-child(2){ opacity:0; }
.nav.is-open .nav__burger span:nth-child(3){ transform: translateY(-7px) rotate(-45deg); }

/* ===== HERO ===== */
.hero{ padding: clamp(2.5rem, 2rem + 2vw, 5rem) 1.5rem 4rem; }
.hero__inner{
  max-width: 1180px; margin:0 auto;
  display:grid; grid-template-columns: 1.05fr 0.85fr; gap: clamp(2rem, 3vw, 4rem);
  align-items:center;
}
.hero__headline{
  font-family: var(--display); font-weight:600;
  font-size: clamp(2.1rem, 1.5rem + 2.6vw, 3.4rem);
  line-height: 1.14; letter-spacing:-0.015em;
  color: var(--vinho);
  margin-bottom: 1.3rem;
}
.hero__lead{
  font-size: 1.08rem; line-height:1.6; color: var(--texto-apagado);
  max-width: 46ch; margin-bottom: 2rem;
}
.hero__acoes{ display:flex; flex-direction:column; align-items:flex-start; gap: 1rem; }
.hero__prova{ font-size:0.9rem; color: var(--vermelho-escuro); letter-spacing:0.02em; }
.hero__prova strong{ color: var(--vinho); font-size:1rem; }
.hero__prova span{ color: var(--texto-apagado); font-weight:400; }

.hero__frame{
  aspect-ratio: 4/5; overflow:hidden;
  border-radius: 10px; border-bottom-right-radius: 100px;
  box-shadow: 0 44px 70px -32px rgba(74,35,33,0.4);
}
.hero__frame img{ width:100%; height:100%; object-fit:cover; object-position: 15% 30%; }

/* ===== PROBLEMA (editorial) ===== */
.problema{ padding: clamp(3rem, 3vw, 5rem) 1.5rem; background: var(--vinho); }
.problema__inner{ max-width: 760px; margin:0 auto; text-align:center; }
.problema__texto{
  font-family: var(--display); font-weight:500;
  font-size: clamp(1.3rem, 1.05rem + 1.1vw, 1.9rem);
  line-height: 1.5; letter-spacing:-0.005em;
  color: var(--creme);
}

/* ===== COMO FUNCIONA ===== */
.funciona{ padding: clamp(3.5rem, 3vw, 6rem) 1.5rem; }
.funciona__inner{
  max-width: 1180px; margin:0 auto;
  display:grid; grid-template-columns: 0.8fr 1.2fr; gap: clamp(2rem, 4vw, 4.5rem);
  align-items:center;
}
.funciona__frame{
  aspect-ratio: 4/5; overflow:hidden; border-radius:10px; border-top-left-radius:100px;
  border: 10px solid var(--creme-cartao);
  box-shadow: 0 30px 60px -30px rgba(74,35,33,0.3);
}
.funciona__frame img{ width:100%; height:100%; object-fit:cover; object-position: center 25%; }

.passos{ margin-top: 1.8rem; display:flex; flex-direction:column; gap: 1.5rem; }
.passo{ display:flex; gap: 1.1rem; align-items:flex-start; }
.passo__num{
  flex-shrink:0; width:38px; height:38px; border-radius:50%;
  background: var(--creme-cartao); border:1.5px solid var(--linha);
  display:flex; align-items:center; justify-content:center;
  font-family: var(--display); font-weight:600; color: var(--vermelho-escuro); font-size:1rem;
}
.passo h3{ font-family: var(--display); font-weight:600; font-size:1.05rem; color: var(--vinho); margin-bottom:0.3rem; }
.passo p{ font-size:0.94rem; line-height:1.55; color: var(--texto-apagado); }

/* ===== ATENDIMENTO / EQUIPE ===== */
.equipe{ padding: clamp(3.5rem, 3vw, 6rem) 1.5rem; background: var(--creme-cartao); }
.equipe__inner{
  max-width: 1180px; margin:0 auto;
  display:grid; grid-template-columns: 1fr 1fr; gap: clamp(2.5rem, 4vw, 5rem);
  align-items:center;
}
.equipe__texto{ font-size:1.02rem; line-height:1.65; color: var(--texto-apagado); margin-top:1.2rem; max-width:42ch; }
.equipe__media{ position:relative; }
.equipe__frame{
  aspect-ratio: 4/5; overflow:hidden; border-radius:10px;
  box-shadow: 0 30px 60px -28px rgba(74,35,33,0.3);
}
.equipe__frame img{ width:100%; height:100%; object-fit:cover; object-position: center 20%; }
.equipe__frame--sobreposto{
  position:absolute; width: 52%; aspect-ratio: 4/5;
  right: -8%; bottom: -12%;
  border: 8px solid var(--creme);
  box-shadow: 0 24px 50px -20px rgba(74,35,33,0.35);
  transition: transform .6s var(--ease-premium);
}
.equipe__frame--sobreposto:hover{ transform: scale(1.03); }

/* ===== FAQ ===== */
.faq{ padding: clamp(3.5rem, 3vw, 6rem) 1.5rem; }
.faq__inner{ max-width: 780px; margin:0 auto; }
.faq__lista{ margin-top: 1.8rem; display:flex; flex-direction:column; gap: 0.7rem; }
.faq__item{
  background: var(--creme-cartao); border: 1px solid var(--linha); border-radius: 14px; overflow:hidden;
}
.faq__toggle{
  width:100%; display:flex; align-items:center; justify-content:space-between; gap:1rem;
  padding: 1.1rem 1.3rem; background:none; border:none; cursor:pointer; text-align:left;
  font-family: var(--body); font-weight:600; font-size:0.98rem; color: var(--vinho);
}
.faq__icon{ position:relative; width:16px; height:16px; flex-shrink:0; }
.faq__icon::before, .faq__icon::after{
  content:""; position:absolute; background: var(--vermelho-escuro); border-radius:2px;
  transition: transform .3s var(--ease-premium);
}
.faq__icon::before{ width:16px; height:2px; top:7px; left:0; }
.faq__icon::after{ width:2px; height:16px; top:0; left:7px; }
.faq__item.is-open .faq__icon::after{ transform: rotate(90deg); opacity:0; }
.faq__panel{ display:grid; grid-template-rows:0fr; transition: grid-template-rows .35s var(--ease-premium); }
.faq__item.is-open .faq__panel{ grid-template-rows: 1fr; }
.faq__panel-inner{ overflow:hidden; }
.faq__panel-inner p{ padding: 0 1.3rem 1.2rem; font-size:0.92rem; line-height:1.6; color: var(--texto-apagado); }

/* ===== CTA FINAL ===== */
.cta-final{
  padding: clamp(3.5rem, 4vw, 6rem) 1.5rem;
  background: linear-gradient(160deg, var(--vinho), var(--vinho-2));
  text-align:center;
}
.cta-final__inner{ max-width:640px; margin:0 auto; display:flex; flex-direction:column; align-items:center; gap:1.8rem; }
.cta-final h2{
  font-family: var(--display); font-weight:600;
  font-size: clamp(1.6rem, 1.3rem + 1.4vw, 2.3rem);
  line-height:1.25; color: var(--creme);
}

/* ===== FOOTER ===== */
.footer{ background: var(--vinho); color: var(--texto-bem-apagado); padding: 3rem 1.5rem 1.5rem; }
.footer__inner{
  max-width:1180px; margin:0 auto;
  display:grid; grid-template-columns: repeat(3, 1fr); gap: 2rem;
  padding-bottom: 2rem; margin-bottom: 1.5rem; border-bottom: 1px solid rgba(197,161,153,0.18);
}
.footer__nome{ color: var(--creme); font-size:1.2rem; display:block; margin-bottom:0.8rem; }
.footer h3{ font-family: var(--body); font-size:0.8rem; letter-spacing:0.1em; text-transform:uppercase; color: var(--vermelho-claro); margin-bottom:0.7rem; }
.footer p{ font-size:0.9rem; line-height:1.7; }
.footer a:hover{ color: var(--vermelho-claro); }
.footer__note{ max-width:70ch; margin: 0 auto; text-align:center; font-size:0.74rem; line-height:1.6; color: var(--texto-bem-apagado); opacity:0.85; }

/* ===== WHATSAPP FLOAT ===== */
.wa-float{
  position: fixed; right: 28px; bottom: 28px; z-index: 50;
  width: 80px; height: 80px; border-radius: 999px;
  background: linear-gradient(135deg, var(--vermelho-medio), var(--vermelho-escuro));
  display:grid; place-items:center;
  animation: pulse-wa 2.4s infinite var(--ease-premium);
  transition: transform .3s var(--ease-premium);
  box-shadow: 0 14px 30px -12px rgba(74,35,33,0.5);
}
.wa-float svg{ width:40px; height:40px; }
@keyframes pulse-wa{
  0%{ box-shadow: 0 0 0 0 rgba(184,64,47,0.5); }
  70%{ box-shadow: 0 0 0 16px rgba(184,64,47,0); }
  100%{ box-shadow: 0 0 0 0 rgba(184,64,47,0); }
}
.wa-float:hover{ transform: scale(1.08); }
.wa-float:active{ transform: scale(0.96); }
.wa-float__tip{
  position:absolute; right: calc(100% + 14px); white-space:nowrap;
  background: var(--branco); color: var(--vinho);
  padding: 0.5rem 0.85rem; border-radius:10px; font-size:0.85rem; font-weight:600;
  opacity:0; transform: translateX(6px); pointer-events:none;
  transition: opacity .3s var(--ease-premium), transform .3s var(--ease-premium);
}
.wa-float:hover .wa-float__tip{ opacity:1; transform:translateX(0); }

/* ===== RESPONSIVO ===== */
@media (max-width: 1023px) and (min-width: 760px){
  .hero__inner{ grid-template-columns: 1fr; }
  .hero__media{ order:-1; max-width:420px; margin:0 auto 1rem; }
  .funciona__inner{ grid-template-columns: 1fr; }
  .funciona__media{ max-width:380px; margin:0 auto; }
  .equipe__inner{ grid-template-columns: 1fr; }
  .equipe__media{ max-width:420px; margin:0 auto 2.5rem; }
}

@media (max-width: 759px){
  .nav__links, .nav__cta{ display:none; }
  .nav__burger{ display:flex; }
  .nav__mobile{ display:flex; }

  .hero__inner{ grid-template-columns:1fr; }
  .hero__media{ order:-1; max-width:320px; margin:0 auto 2rem; }
  .hero__text{ text-align:center; }
  .hero__lead{ margin-left:auto; margin-right:auto; }
  .hero__acoes{ align-items:center; }

  .funciona__inner{ grid-template-columns:1fr; }
  .funciona__media{ max-width:280px; margin:0 auto 2.5rem; }

  .equipe__inner{ grid-template-columns:1fr; }
  .equipe__media{ max-width:280px; margin:0 auto 3rem; }
  .equipe__frame--sobreposto{ right:-10%; bottom:-14%; }

  .footer__inner{ grid-template-columns:1fr; text-align:center; }

  .wa-float{ width:68px; height:68px; right:18px; bottom:18px; }
  .wa-float svg{ width:34px; height:34px; }
  .wa-float__tip{ display:none; }
}