:root{
  --bg0:#ffffff;
  --bg1:#f7fafc;
  --ink:#0b1220;
  --muted:#54627a;
  --brand:#f4c542;
  --brand2:#0f1a2b;
  --accent:#2dd4bf;
  --card:#ffffff;
  --stroke:rgba(11,18,32,.10);
  --shadow:0 18px 60px rgba(11,18,32,.10);
  --shadow2:0 10px 30px rgba(11,18,32,.08);
  --radius:20px;
  --radius2:28px;
  --max:1120px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  color:var(--ink);
  background:
    radial-gradient(900px 500px at 15% 8%, rgba(45,212,191,.18), transparent 58%),
    radial-gradient(900px 500px at 85% 12%, rgba(244,197,66,.22), transparent 55%),
    linear-gradient(180deg, var(--bg0), var(--bg1));
}

a{color:inherit; text-decoration:none}
img{max-width:100%; display:block}

.container{max-width:var(--max); margin:0 auto; padding:0 20px}

.skip-link{
  position:absolute; left:-999px; top:12px; z-index:9999;
  background:var(--ink); color:white; padding:10px 12px; border-radius:12px;
}
.skip-link:focus{left:12px}

.header{
  position:sticky; top:0; z-index:50;
  background:rgba(255,255,255,.72);
  backdrop-filter:saturate(140%) blur(14px);
  border-bottom:1px solid var(--stroke);
}
.header__inner{
  display:flex; align-items:center; justify-content:space-between;
  padding:14px 0;
}
.brand{display:flex; align-items:center; gap:12px}
.brand__logo{height:42px; width:auto; filter:drop-shadow(0 10px 20px rgba(11,18,32,.10))}

.nav{display:flex; align-items:center; gap:12px}
.nav__toggle{
  display:none;
  width:44px; height:44px;
  border:1px solid var(--stroke);
  background:rgba(255,255,255,.8);
  border-radius:14px;
  box-shadow:var(--shadow2);
}
.nav__toggleBars{
  display:block; width:18px; height:2px; margin:0 auto;
  background:var(--ink); border-radius:2px;
  position:relative;
}
.nav__toggleBars::before,.nav__toggleBars::after{
  content:""; position:absolute; left:0; right:0;
  height:2px; background:var(--ink); border-radius:2px;
}
.nav__toggleBars::before{top:-6px}
.nav__toggleBars::after{top:6px}

.nav__menu{
  display:flex; align-items:center; gap:14px;
  padding:6px;
  border:1px solid var(--stroke);
  border-radius:999px;
  background:rgba(255,255,255,.78);
}
.nav__link{
  font-weight:600;
  font-size:14px;
  color:rgba(11,18,32,.78);
  padding:10px 12px;
  border-radius:999px;
}
.nav__link:hover{background:rgba(11,18,32,.06); color:rgba(11,18,32,.92)}
.nav__link.is-active{background:rgba(244,197,66,.25); color:rgba(11,18,32,.95)}
.nav__cta{
  font-weight:700;
  font-size:14px;
  padding:10px 14px;
  border-radius:999px;
  background:linear-gradient(135deg, var(--brand), #ffe08a);
  border:1px solid rgba(244,197,66,.55);
  box-shadow:0 12px 30px rgba(244,197,66,.25);
}
.nav__cta:hover{transform:translateY(-1px)}

.hero{
  padding:64px 0 42px;
  position:relative;
  overflow:hidden;
}
.hero__bg{
  position:absolute;
  inset:0;
  background-image:
    radial-gradient(820px 520px at 18% 78%, rgba(255,255,255,.72) 0%, rgba(255,255,255,.34) 30%, rgba(255,255,255,0) 62%),
    url("../assets/hero-photo.png");
  background-size:cover;
  background-position:center right;
  filter:saturate(1.03) contrast(1.00);
  transform:scale(1.08);
  z-index:0;
  animation: heroZoom 16s ease-out both;
}

@keyframes heroZoom{
  from{ transform:scale(1.14) }
  to{ transform:scale(1.08) }
}
.hero__inner{
  display:grid;
  grid-template-columns: 1.15fr .85fr;
  gap:26px;
  align-items:stretch;
  position:relative;
  z-index:1;
}
.hero__copy{
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
}
.hero__brand{
  display:flex;
  align-items:center;
  justify-content:center;
  width:fit-content;
  margin-bottom:6px;
}
.hero__logo{
  height:126px;
  width:auto;
  filter:drop-shadow(0 12px 24px rgba(11,18,32,.14));
}
.pill{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:10px 14px;
  border-radius:999px;
  border:1px solid rgba(45,212,191,.35);
  background:rgba(255,255,255,.72);
  font-weight:700;
  color:rgba(11,18,32,.86);
}
.hero__title{
  margin:16px 0 10px;
  font-size:54px;
  line-height:1.08;
  letter-spacing:-.03em;
  font-weight:800;
}
.hero__titleLead{
  display:inline;
  color:#ffffff;
  font-weight:900;
  text-shadow:
    0 1px 0 rgba(11,18,32,.25),
    0 2px 12px rgba(11,18,32,.55),
    0 8px 40px rgba(11,18,32,.35);
}
.hero__titleRest{
  display:inline;
  color:rgba(255,248,235,.96);
  font-weight:700;
  text-shadow:
    0 1px 0 rgba(11,18,32,.2),
    0 2px 10px rgba(11,18,32,.5),
    0 0 1px rgba(244,197,66,.35);
}
.hero__subtitle{
  margin:0;
  font-size:18px;
  line-height:1.55;
  color:rgba(255,255,255,.92);
  max-width:56ch;
  text-shadow:
    0 1px 2px rgba(11,18,32,.4),
    0 4px 20px rgba(11,18,32,.45);
}
.hero__actions{display:flex; gap:12px; margin-top:18px; flex-wrap:wrap; justify-content:center}

.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  padding:12px 16px;
  border-radius:16px;
  border:1px solid var(--stroke);
  font-weight:700;
  background:rgba(255,255,255,.80);
  box-shadow:var(--shadow2);
  transition:transform .15s ease, box-shadow .15s ease, background .15s ease;
  cursor:pointer;
}
.btn:hover{transform:translateY(-1px); box-shadow:0 18px 40px rgba(11,18,32,.10)}
.btn:active{transform:translateY(0)}
.btn--primary{
  border:1px solid rgba(244,197,66,.60);
  background:linear-gradient(135deg, var(--brand), #ffe39e);
}
.btn--ghost{
  background:rgba(255,255,255,.62);
}
.btn--whatsapp{
  border:1px solid rgba(45,212,191,.55);
  background:linear-gradient(135deg, rgba(45,212,191,.22), rgba(199,255,246,.70));
}
.btn__dot{
  width:10px;
  height:10px;
  border-radius:999px;
  background:#18c39a;
  box-shadow:0 0 0 4px rgba(45,212,191,.18);
}
.btn--full{width:100%}

.hero__trust{
  display:flex; gap:14px; margin-top:22px; flex-wrap:wrap;
  justify-content:center;
}
.stat{
  padding:14px 14px;
  border-radius:18px;
  background:rgba(255,255,255,.70);
  border:1px solid var(--stroke);
  box-shadow:var(--shadow2);
  min-width:150px;
}
.stat__value{font-weight:800; font-size:18px}
.stat__label{color:var(--muted); font-weight:600; font-size:13px; margin-top:4px}

.hero__card{display:flex}
.heroCard{
  width:100%;
  border-radius:var(--radius2);
  border:1px solid var(--stroke);
  background:
    radial-gradient(700px 320px at 18% 18%, rgba(45,212,191,.18), transparent 60%),
    radial-gradient(700px 320px at 82% 18%, rgba(244,197,66,.18), transparent 60%),
    rgba(255,255,255,.72);
  box-shadow:var(--shadow);
  padding:18px;
  display:flex;
  flex-direction:column;
  min-height:100%;
}
.heroCard__top{display:flex; gap:10px; flex-wrap:wrap}
.heroCard__badge{
  font-weight:700;
  font-size:12px;
  padding:9px 12px;
  border-radius:999px;
  border:1px solid rgba(11,18,32,.10);
  background:rgba(255,255,255,.85);
}
.heroCard__badge--soft{
  border:1px solid rgba(45,212,191,.30);
  background:rgba(45,212,191,.10);
}
.heroCard__body{padding:10px 4px 0}
.heroCard__title{margin:12px 0 8px; font-size:20px; letter-spacing:-.01em}
.heroCard__text{margin:0; color:var(--muted); line-height:1.55}
.heroCard__list{display:flex; flex-wrap:wrap; gap:10px; margin-top:14px}
.chip{
  font-weight:700;
  font-size:12px;
  padding:9px 12px;
  border-radius:999px;
  border:1px solid rgba(11,18,32,.10);
  background:rgba(255,255,255,.84);
}
.heroCard__footer{margin-top:auto; padding-top:14px}
.heroCard__note{margin:10px 0 0; color:rgba(84,98,122,.9); font-size:12px}

.section{
  padding:64px 0;
}
.section--alt{
  background:rgba(255,255,255,.52);
  border-top:1px solid rgba(11,18,32,.06);
  border-bottom:1px solid rgba(11,18,32,.06);
}
.section--tight{padding:54px 0}
.section__inner{padding:0}

.sectionHeader{
  display:flex; align-items:flex-end; justify-content:space-between; gap:18px;
  margin-bottom:18px;
}
.sectionHeader__title{
  margin:0;
  font-size:28px;
  letter-spacing:-.02em;
}
.sectionHeader__subtitle{
  margin:0;
  color:var(--muted);
  max-width:62ch;
  line-height:1.5;
}

.cardsGrid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:14px;
  margin-top:14px;
}

.card{
  border-radius:var(--radius);
  border:1px solid var(--stroke);
  background:rgba(255,255,255,.80);
  box-shadow:var(--shadow2);
  padding:18px;
}
.card--link{
  display:flex;
  align-items:center;
  gap:14px;
  transition:transform .15s ease, box-shadow .15s ease;
}
.card__thumb{
  width:74px;
  height:74px;
  flex:0 0 74px;
  border-radius:18px;
  border:1px solid rgba(11,18,32,.10);
  background:rgba(255,255,255,.88);
  box-shadow:0 10px 24px rgba(11,18,32,.08);
  object-fit:cover;
}
.card__thumb--contact{
  display:flex;
  align-items:center;
  justify-content:center;
  width:74px;
  height:74px;
  flex:0 0 74px;
  border-radius:18px;
  border:1px solid rgba(11,18,32,.10);
  background:linear-gradient(135deg, rgba(244,197,66,.30), rgba(45,212,191,.18));
  box-shadow:0 10px 24px rgba(11,18,32,.08);
}
.card__thumbIcon{font-size:24px}
.card--link:hover{transform:translateY(-2px); box-shadow:var(--shadow)}
.card__icon{
  width:44px; height:44px;
  border-radius:16px;
  display:flex; align-items:center; justify-content:center;
  background:linear-gradient(135deg, rgba(244,197,66,.30), rgba(45,212,191,.18));
  border:1px solid rgba(11,18,32,.08);
  font-size:20px;
}
.card__content{flex:1}
.card__title{margin:0; font-size:16px; letter-spacing:-.01em}
.card__text{margin:6px 0 0; color:var(--muted); line-height:1.45; font-size:13px}
.card__arrow{font-weight:900; color:rgba(11,18,32,.55)}

.twoCol{
  display:grid;
  grid-template-columns:1.05fr .95fr;
  gap:18px;
  align-items:start;
}
.sectionTitle{
  margin:0 0 10px;
  font-size:34px;
  letter-spacing:-.03em;
}
.sectionLead{
  margin:0;
  color:var(--muted);
  font-size:16px;
  line-height:1.6;
  max-width:62ch;
}
.bullets{
  margin:14px 0 0;
  padding-left:18px;
  color:rgba(11,18,32,.82);
  line-height:1.7;
}
.sectionActions{display:flex; gap:12px; flex-wrap:wrap; margin-top:18px}

.featureCard{
  border-radius:var(--radius2);
  border:1px solid var(--stroke);
  background:rgba(255,255,255,.78);
  box-shadow:var(--shadow);
  padding:18px;
}

.mediaCard{
  border-radius:var(--radius2);
  border:1px solid var(--stroke);
  background:rgba(255,255,255,.78);
  box-shadow:var(--shadow);
  overflow:hidden;
}
.mediaCard__img{
  width:100%;
  height:auto;
  display:block;
  aspect-ratio: 4 / 3;
  object-fit:cover;
}
.mediaCard__caption{
  padding:14px 16px 16px;
  border-top:1px solid rgba(11,18,32,.08);
  background:rgba(255,255,255,.62);
}
.mediaCard__title{font-weight:900; letter-spacing:-.01em}
.mediaCard__text{margin-top:6px; color:var(--muted); font-size:12px; line-height:1.45}
.featureCard__row{
  display:flex; align-items:baseline; justify-content:space-between;
  padding:10px 0;
}
.featureCard__label{
  color:var(--muted);
  font-weight:700;
  font-size:13px;
}
.featureCard__value{
  font-weight:800;
  letter-spacing:-.01em;
}
.featureCard__divider{
  height:1px;
  background:rgba(11,18,32,.08);
  margin:12px 0;
}
.featureCard__note{margin:0; color:var(--muted); line-height:1.55}
.featureCard__title{margin:0 0 10px; font-size:16px; letter-spacing:-.01em}
.package{padding:12px 12px; border-radius:16px; border:1px solid rgba(11,18,32,.08); background:rgba(255,255,255,.72); margin-top:10px}
.package__name{font-weight:900}
.package__desc{color:var(--muted); font-size:13px; margin-top:4px; line-height:1.4}
.chipRow{display:flex; gap:10px; flex-wrap:wrap}

.logoRow{
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom:14px;
}
.logoRow--center{
  justify-content:center;
  margin-bottom:18px;
}
.logoRow__img{
  max-height:52px;
  width:auto;
  border-radius:0;
  padding:0;
  background:transparent;
  border:none;
  box-shadow:none;
}
.logoRow__img--big{
  max-height:110px;
  filter:drop-shadow(0 16px 34px rgba(11,18,32,.14));
}

.contactGrid{
  display:grid;
  grid-template-columns:1.1fr .9fr;
  gap:16px;
  margin-top:14px;
}
.form{
  border-radius:var(--radius2);
  border:1px solid var(--stroke);
  background:rgba(255,255,255,.78);
  box-shadow:var(--shadow);
  padding:18px;
}
.form__row{display:flex; flex-direction:column; gap:8px; margin-top:12px}
.form__row:first-child{margin-top:0}
.form__hint{
  margin:0;
  font-size:12px;
  line-height:1.45;
  color:var(--muted);
  font-weight:600;
}
.label{font-weight:800; font-size:13px}
.input{
  width:100%;
  border-radius:16px;
  border:1px solid rgba(11,18,32,.12);
  background:rgba(255,255,255,.92);
  padding:12px 14px;
  font:inherit;
  outline:none;
  box-shadow:0 10px 20px rgba(11,18,32,.05);
}
.input:focus{
  border-color:rgba(45,212,191,.65);
  box-shadow:0 0 0 4px rgba(45,212,191,.18), 0 10px 22px rgba(11,18,32,.06);
}
.input--textarea{resize:vertical; min-height:120px}
.form__actions{display:flex; gap:12px; flex-wrap:wrap; margin-top:14px}

.contactCard{
  border-radius:var(--radius2);
  border:1px solid var(--stroke);
  background:
    radial-gradient(700px 260px at 20% 20%, rgba(244,197,66,.18), transparent 62%),
    radial-gradient(700px 260px at 80% 18%, rgba(45,212,191,.16), transparent 62%),
    rgba(255,255,255,.72);
  box-shadow:var(--shadow);
  padding:18px;
}
.contactCard__title{font-weight:900; font-size:18px; letter-spacing:-.01em}
.contactCard__text{margin:10px 0 0; color:var(--muted); line-height:1.55}
.contactCard__list{margin-top:14px; display:flex; flex-direction:column; gap:10px}
.contactItem{
  border:1px solid rgba(11,18,32,.08);
  border-radius:18px;
  padding:12px 12px;
  background:rgba(255,255,255,.78);
}
.contactItem__label{color:var(--muted); font-weight:800; font-size:12px}
.contactItem__value{font-weight:900; margin-top:4px}
.contactCard__note{margin-top:14px; color:rgba(11,18,32,.78); font-weight:700; line-height:1.5}
.contactCard__cta{margin-top:14px}

.fineprint{margin:10px 0 0; color:rgba(84,98,122,.9); font-size:12px; line-height:1.45}

.hpField{
  position:absolute !important;
  left:-9999px !important;
  top:auto !important;
  width:1px !important;
  height:1px !important;
  overflow:hidden !important;
}

.thankYou{
  border-radius:var(--radius2);
  border:1px solid var(--stroke);
  background:
    radial-gradient(900px 340px at 20% 20%, rgba(45,212,191,.16), transparent 62%),
    radial-gradient(900px 340px at 80% 18%, rgba(244,197,66,.16), transparent 62%),
    rgba(255,255,255,.78);
  box-shadow:var(--shadow);
  padding:22px;
  text-align:center;
  max-width:720px;
  margin:0 auto;
}
.thankYou__logo{
  height:84px;
  width:auto;
  margin:0 auto 8px;
  filter:drop-shadow(0 14px 28px rgba(11,18,32,.14));
}
.thankYou__title{
  margin:10px 0 8px;
  font-size:40px;
  letter-spacing:-.03em;
}
.thankYou__text{
  margin:0;
  color:var(--muted);
  line-height:1.6;
}
.thankYou__actions{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  justify-content:center;
  margin-top:18px;
}

.footer{
  padding:26px 0 44px;
  background:rgba(255,255,255,.68);
  border-top:1px solid rgba(11,18,32,.06);
}
.footer__inner{display:flex; justify-content:space-between; gap:18px; align-items:center; flex-wrap:wrap}
.footer__left{display:flex; gap:12px; align-items:center}
.footer__logo{height:34px; width:auto}
.footer__name{font-weight:900}
.footer__small{color:var(--muted); font-size:12px; margin-top:4px}
.footer__right{display:flex; gap:12px; flex-wrap:wrap}
.footer__link{
  font-weight:800;
  font-size:13px;
  padding:10px 12px;
  border-radius:999px;
  border:1px solid rgba(11,18,32,.10);
  background:rgba(255,255,255,.80);
}
.footer__link:hover{background:rgba(11,18,32,.06)}

.footer__legalRow{
  margin-top:18px;
  padding-top:18px;
  border-top:1px solid rgba(11,18,32,.08);
}
.footer__legal{
  margin:0;
  max-width:72ch;
  font-size:12px;
  line-height:1.55;
  color:var(--muted);
  font-weight:600;
}
.footer__legal--center{max-width:none; text-align:center}
.footer__legalLinks{
  margin:10px 0 0;
  text-align:center;
  font-size:13px;
  font-weight:700;
  color:var(--muted);
}
.footer__legalLinks .footer__link{display:inline-flex; margin:0 4px}

.legalPage{padding:40px 0 56px}
.legalPage__inner{max-width:720px}
.legalPage__title{
  margin:0 0 12px;
  font-size:34px;
  letter-spacing:-.03em;
}
.legalPage__lead{
  margin:0 0 28px;
  font-size:16px;
  line-height:1.6;
  color:rgba(11,18,32,.88);
}
.legalPage__section{margin-top:22px}
.legalPage__h2{
  margin:0 0 8px;
  font-size:17px;
  letter-spacing:-.01em;
}
.legalPage__section p{
  margin:0;
  color:var(--muted);
  line-height:1.65;
  font-size:15px;
}
.legalPage__back{margin-top:32px}

.toast{
  position:fixed;
  left:50%;
  bottom:18px;
  transform:translateX(-50%);
  z-index:60;
  padding:0 14px;
}
.toast__inner{
  border-radius:999px;
  border:1px solid rgba(11,18,32,.10);
  background:rgba(11,18,32,.92);
  color:white;
  padding:12px 14px;
  font-weight:800;
  box-shadow:0 20px 60px rgba(11,18,32,.28);
}

@media (max-width: 980px){
  .hero__inner{grid-template-columns:1fr; gap:16px}
  .hero__title{font-size:44px}
  .hero__logo{height:114px}
  .logoRow__img--big{max-height:96px}
  .cardsGrid{grid-template-columns:repeat(2, minmax(0, 1fr))}
  .twoCol{grid-template-columns:1fr}
  .contactGrid{grid-template-columns:1fr}
  .hero__bg{
    background-image:
      radial-gradient(780px 520px at 18% 76%, rgba(255,255,255,.70) 0%, rgba(255,255,255,.28) 32%, rgba(255,255,255,0) 64%),
      url("../assets/hero-photo.png");
    background-position:center;
  }
  .nav__toggle{display:inline-flex; align-items:center; justify-content:center}
  .nav__menu{
    position:absolute;
    right:20px;
    top:68px;
    flex-direction:column;
    align-items:stretch;
    gap:6px;
    padding:10px;
    border-radius:20px;
    box-shadow:var(--shadow);
    width:min(320px, calc(100vw - 40px));
    transform-origin:top right;
    display:none;
  }
  .nav__menu.is-open{display:flex}
  .nav__link,.nav__cta{text-align:center}
}

@media (prefers-reduced-motion: reduce){
  .hero__bg{animation:none}
}

@media (max-width: 560px){
  .hero__title{font-size:36px}
  .hero__logo{height:99px}
  .logoRow__img--big{max-height:84px}
  .cardsGrid{grid-template-columns:1fr}
  .stat{min-width:unset; flex:1}
  .card__thumb,.card__thumb--contact{width:66px; height:66px; flex-basis:66px}
}

