:root{
  --navy:#1f3a74;
  --lav:#f3eff8;
  --gold:#b89a63;
  --purple:#4b3a78;

  /* ART DIRECTION (recomendado) */
  --hero-desktop:url('img/hero-desktop.jpg');
  --hero-mobile:url('img/hero-mobile.jpg');
  --hero: var(--hero-desktop);

  --ink:#0b0f1c;
  --muted:rgba(11,15,28,.62);

  --lineD:rgba(11,15,28,.12);
  --shadow: 0 18px 60px rgba(11,15,28,.18);

  --font: Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  --display: Montserrat, var(--font);

  --w: 980px;

  --ease: cubic-bezier(.2,.8,.2,1);
  --dur: 260ms;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  font-family:var(--font);
  color:var(--ink);
  background:#fff;
}
a{color:inherit;text-decoration:none;}
img{max-width:100%;display:block;}

.skip{position:absolute;left:-999px;top:auto;width:1px;height:1px;overflow:hidden;}
.skip:focus{
  left:14px;top:14px;width:auto;height:auto;padding:10px 12px;border-radius:999px;
  background:#fff;border:1px solid var(--lineD);z-index:999;box-shadow:var(--shadow);
}

.wrap{width:min(var(--w), calc(100% - 40px)); margin:0 auto;}
.tiny{font-size:12px;color:rgba(11,15,28,.48);margin:12px 0 0;}
.muted{color:var(--muted);}

.kicker{
  font-family:var(--display);
  letter-spacing:.14em;
  font-size:11px;
  color:rgba(31,58,116,.70);
  font-weight:700;
  margin:0 0 10px;
  text-transform:uppercase;
}
.kicker--center{text-align:center;}

/* TOP */
.top{
  position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 50;
    background: linear-gradient(-17deg, rgb(255 255 255 / 0%) 100%, rgba(11, 15, 28, .52) 55%, rgba(11, 15, 28, .78) 10%);
    transition: background var(--dur) var(--ease), border-color var(--dur) var(--ease);
}
.top.is-solid{
  background:rgba(255,255,255,.92);
  backdrop-filter: blur(10px);
  border-bottom:1px solid var(--lineD);
}
.top__inner{
  width:min(var(--w), calc(100% - 40px));
  margin:0 auto;
  padding:18px 0;
  display:flex;
  align-items:center;
  justify-content:space-between;
}

/* Topbar centralizada (logo no meio) */
.top__inner--center{
  display:grid !important;
  grid-template-columns: 44px 1fr 44px;
  align-items:center;
}
.top__side{ width:44px; height:44px; }

/* Logo imagem (top + drawer) sem crescer a nav */
.brandImg{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  height:44px;
}
.brandImg img{
  height:44px;
  max-height:44px;
  width:auto;
  object-fit:contain;
  display:block;
}
.brandImg--center{ justify-self:center; }

/* Avatar da bolha (imagem) */
.float-atendimento__icon{
  width:44px;
  height:44px;
  border-radius:999px;
  overflow:hidden;
  display:grid;
  place-items:center;
  background:#fff;
  border:1px solid rgba(11,15,28,.12);
}
.float-atendimento__icon img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

@media (max-width:480px){
  .top__inner--center{ grid-template-columns: 40px 1fr 40px; }
  .top__side{ width:40px; height:40px; }
  .brandImg{ height:40px; }
  .brandImg img{ height:40px; max-height:40px; }
  .hamb{ width:40px; height:40px; }
}


.logo{display:inline-flex;color:#fff; height: 44px;line-height: 0;}
.top.is-solid .logo{color:var(--navy);}
.logo__stack{display:flex;flex-direction:column;gap:6px;}
.logo__big{
  font-family:var(--display);
  font-weight:800;
  letter-spacing:.04em;
  line-height:1.0;
  font-size:22px;
  text-transform:uppercase;
  -webkit-text-stroke: 1px rgba(255,255,255,.92);
  color:transparent;
}
.top.is-solid .logo__big{-webkit-text-stroke: 1px rgba(31,58,116,.72);}
.logo__sub{
  font-family:var(--display);
  font-weight:600;
  letter-spacing:.18em;
  font-size:11px;
  opacity:.9;
}

.logo__img{
 height: 44px;            /* base */
  width: auto;
  display:block;
  object-fit: contain;
  transform: scale(1.35);  /* <<< aqui aumenta sem crescer a nav */
  transform-origin: left center;
  will-change: transform;
}

@media (max-width: 719px){
  .logo{ height: 40px; }
  .logo__img{
    height: 40px;
    transform: scale(1.22);
  }
}

/* no mobile menu, respeita o layout do topo */
.mnav__logo{
  display:inline-flex;
  align-items:center;
}


.hamb{
  width:44px;height:44px;border:0;background:transparent;
  display:inline-flex;flex-direction:column;justify-content:center;
  gap:6px;cursor:pointer;
}
.hamb span{width:22px;height:2px;border-radius:2px;background:rgba(255,255,255,.92);}
.top.is-solid .hamb span{background:rgba(31,58,116,.92);}

/* HERO */
.hero{
  /* svh dá comportamento mais estável no mobile (barra do navegador) */
  min-height: 92svh;
  background:var(--navy);
  position:relative;
  display:flex;
  align-items:flex-end;
  padding: 110px 0 58px;
  overflow:hidden;
}

/* BG separado (evita duplicar background no .hero) */
.hero__bg{
  position:absolute; inset:0;
  background-image: var(--hero);
  background-size: cover;
  background-repeat: no-repeat;
  /* ajuste fino: “segura” o assunto mais à direita no desktop */
  background-position: 70% 30%;
  transform: translateZ(0);
}

.hero__veil{
  position:absolute; inset:0;
  background: linear-gradient(180deg,
    rgba(31,58,116,.12) 0%,
    rgba(31,58,116,.76) 62%,
    rgba(31,58,116,.94) 100%
  );
}

.hero__content{
  position:relative;
  width:min(var(--w), calc(100% - 40px));
  margin:0 auto;
  color:#fff;
}
.hero__title{margin:0 0 14px;line-height:1.0;}
.hero__thin{
  display:block;font-family:var(--display);font-weight:500;letter-spacing:.02em;
  font-size:34px;opacity:.92;
}
.hero__bold{
  display:block;font-family:var(--display);font-weight:800;letter-spacing:.01em;
  font-size:35px;
}
.hero__lead{
  margin:0 0 18px;max-width: 36ch;
  color: rgba(255,255,255,.84);font-size:14px;line-height:1.5;
}
.cta{
  display:inline-flex;align-items:center;justify-content:center;
  padding: 14px 18px;border-radius: 10px;
  background: var(--gold);color:#fff;font-weight:700;
  box-shadow: 0 10px 30px rgba(0,0,0,.18);
}
.cta:active{transform:translateY(1px);}

/* SEÇÕES */
.stats{background: var(--lav);padding: 64px 0;}
.stats__inner{
  width:min(var(--w), calc(100% - 40px));
  margin:0 auto;
  display:grid;gap: 36px;justify-items:center;
}
.stats__num{
  font-family:var(--display);font-weight:500;font-size:35px;letter-spacing:.02em;color:#000;
}
.stats__lab{margin-top:6px;font-size:14px;color:#000;}

.about{padding: 54px 0 18px;}
.about__h{
  font-family:var(--display);font-size:30px;letter-spacing:-.02em;margin: 0 0 16px;
}
.checks{
  list-style:none;padding:0;margin: 0 0 22px;
  display:grid;gap: 14px;
}
.checks li{
  position:relative;padding-left: 28px;
  font-family:var(--display);font-weight:700;font-size:22px;letter-spacing:-.02em;
}
.checks li::before{
  content:"✓";
  position:absolute; left:0; top:6px;
  width:18px;height:18px;display:inline-flex;align-items:center;justify-content:center;
  color: var(--navy);font-weight:800;
}
.about__text{color: rgba(11,15,28,.70);font-size:14px;line-height:1.75;margin-bottom: 22px;}
.about__photo{border-top: 1px solid var(--lineD);padding-top: 18px;}
.about__photo img{width:100%;border-radius: 16px;box-shadow: var(--shadow);}

.quote{background: var(--navy);padding: 54px 0;}
.quote__p{
  margin:0;font-family:var(--display);font-weight:500;font-size:28px;
  line-height:1.25;letter-spacing:-.02em;color:#fff;opacity:.96;
}

.media{background:#fff;padding: 48px 0;}
.media__grid{
  margin-top: 18px;
  display:grid;grid-template-columns: 1fr 1fr;
  gap: 20px 18px;align-items:center;justify-items:center;
}
.media__logo{
  font-family:var(--display);font-weight:800;font-size:44px;
  color: rgba(11,15,28,.18);text-transform:lowercase;user-select:none;
}

.proc{background: var(--lav);padding: 48px 0;}
.card__img{border-radius: 22px;overflow:hidden;box-shadow: var(--shadow);}
.card__body{padding: 18px 6px 0;}
.card__h{
  margin: 0 0 12px;font-family:var(--display);font-weight:800;
  letter-spacing:-.02em;font-size:26px;
}
.card__p{margin: 0 0 14px;color: rgba(11,15,28,.72);line-height:1.7;font-size:14px;}
.btn{
  display:inline-flex;align-items:center;justify-content:center;
  padding: 14px 18px;border-radius: 8px;
  background: var(--gold);color:#fff;font-weight:700;border:0;
  box-shadow: 0 12px 28px rgba(75,58,120,.24);
}

.exclusive{background:#fff;padding: 46px 0;}
.exclusive__wrap{display:grid;gap:18px;}
.exclusive__h{margin:0 0 10px;font-family:var(--display);font-weight:800;font-size:24px;}
.exclusive__p{margin:0 0 18px;color: rgba(11,15,28,.72);line-height:1.7;font-size:14px;}
.exclusive__img img{width:100%;border-radius: 22px;box-shadow: var(--shadow);}

/* ===== Promo card (texto dentro da foto) ===== */
.promo{
  position: relative;
  border-radius: 22px;
  overflow: hidden;
  box-shadow: var(--shadow);
  min-height: 420px;
}

.promo__img{
  width: 100%;
  height: 100%;
  min-height: 420px;
  object-fit: cover;
  display:block;
}

.promo__overlay{
  position:absolute;
  inset:0;
  background:
    linear-gradient(180deg,
      rgba(11,15,28,.10) 0%,
      rgba(11,15,28,.52) 55%,
      rgba(11,15,28,.78) 100%
    );
}

/* Conteúdo por cima */
.promo__content{
  position:absolute;
  left: 18px;
  right: 18px;
  bottom: 18px;
  color: #fff;
  z-index: 2;

  /* “card dentro do card” (pílula com blur) */

}

.promo__h{
  margin: 0 0 8px;
  font-family: var(--display);
  font-weight: 800;
  letter-spacing: -.02em;
  font-size: 22px;
  line-height: 1.1;
}

.promo__p{
  margin: 0 0 14px;
  color: rgba(255,255,255,.88);
  font-size: 14px;
  line-height: 1.55;
  max-width: 52ch;
}

.promo__btn{
  align-self:flex-start;
}

/* Desktop: deixa mais “lado a lado” no mesmo card */
@media (min-width: 720px){
  .promo{ min-height: 420px; }
  .promo__img{ min-height: 420px; }

  .promo__content{
    left: 22px;
    bottom: 22px;
    right: auto;
    width: min(520px, calc(100% - 44px));
    padding: 18px 18px 16px;
  }

  .promo__h{ font-size: 26px; }
}


.inst{background: var(--navy);padding: 52px 0 38px;}
.inst__card{
  position:relative;border-radius: 26px;overflow:hidden;box-shadow: var(--shadow);
  background: linear-gradient(180deg, rgba(0,0,0,.18), rgba(31,58,116,.78)), var(--inst);
  background-size: cover;background-position:center;
  min-height: 360px;display:flex;align-items:flex-end;
}
.inst__veil{position:absolute;inset:0;background: linear-gradient(180deg, rgba(31,58,116,.10), rgba(31,58,116,.78));}
.inst__content{
  position:relative;padding: 22px;color:#fff;width: 100%;text-align:center;
}
.inst__h{margin:0 0 10px;font-family:var(--display);font-weight:800;font-size:34px;}
.inst__p{margin:0 auto 16px;max-width: 40ch;color: rgba(0, 0, 0, 0.82);}
.inst__btn{
  display:inline-flex;align-items:center;justify-content:center;
  padding: 14px 18px;width: 180px;border-radius: 10px;
  background:var(--gold);color: #fff;font-weight:800;
}

.inst__logo{
  width: 255px;
  height: auto;
  display:block;
  margin: 0 auto 10px;
  object-fit: contain;
  filter: drop-shadow(0 12px 18px rgba(0,0,0,.25));
}

@media (min-width: 720px){
  .inst__logo{
    width: 130px;
    margin-bottom: 12px;
  }
}


.foot{background: var(--navy);color:#fff;padding: 46px 0 28px;}
.foot__wrap{display:grid;gap:26px;}
.foot__social{display:flex;gap:10px;margin-top:14px;}
.foot__cols{display:grid;gap: 18px;padding-top: 10px;}
.foot__cols a{display:block;padding: 8px 0;color: rgba(255,255,255,.82);}
.foot__cols a:hover{color:#fff;}
.foot__title{font-weight:800;margin-bottom:6px;}
.foot__wa{font-weight:800;color:#fff;}
.foot__bottom{border-top:1px solid rgba(255,255,255,.18);padding-top:18px;color:rgba(255,255,255,.70);font-size:12px;}

/* ===== MOBILE MENU ===== */
.drawer{
  position: fixed;
  inset: 0;
  z-index: 999;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity var(--dur) var(--ease), visibility var(--dur) var(--ease);
}
.drawer.is-open{
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

.drawer__backdrop{
  position:absolute;
  inset:0;
  background: rgba(11,15,28,.22);
  opacity: 0;
  transition: opacity var(--dur) var(--ease);
}
.drawer.is-open .drawer__backdrop{ opacity: 1; }

.mnav{
  position: absolute;
  inset:0;
  background:#fff;
  color:#000;
  display:flex;
  flex-direction:column;
  padding: 18px 18px 22px;
  transform: translateY(8px);
  opacity: 0;
  transition: transform var(--dur) var(--ease), opacity var(--dur) var(--ease);
}
.drawer.is-open .mnav{
  transform: translateY(0);
  opacity: 1;
}

.mnav__top{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
}

.mnav__logo{ color: var(--navy); }
.mnav__logo .logo__big{ -webkit-text-stroke: 1px rgba(31,58,116,.55); }
.mnav__logo .logo__sub{ color: rgba(31,58,116,.70); }

.mnav__close{
  width:44px;
  height:44px;
  border:0;
  border-radius:999px;
  background: transparent;
  color: rgba(11,15,28,.82);
  font-size:20px;
  cursor:pointer;
}

.mnav__links{
  flex:1;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:flex-start;
  padding-top: 34px;
  gap: 22px;
  text-align:center;
}

.mnav__links > a,
.mnav__drop{
  font-family: var(--display);
  font-weight:700;
  font-size:18px;
  letter-spacing:-.01em;
  color:#000;
  transition: transform 180ms var(--ease), opacity 180ms var(--ease);
}

.mnav__drop{
  border:0;
  background:transparent;
  cursor:pointer;
  display:flex;
  align-items:center;
  gap:10px;
}

.mnav__chev{
  font-size:22px;
  color: rgba(11,15,28,.55);
  transform: translateY(-1px);
}

.mnav__sub{
  width: 100%;
  max-width: 420px;
  margin-top: -10px;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:14px;
  padding: 8px 0 2px;

  max-height: 0;
  opacity: 0;
  overflow: hidden;
  transition: max-height var(--dur) var(--ease), opacity var(--dur) var(--ease);
}
.mnav__sub.is-open{
  max-height: 240px;
  opacity: 1;
}

.mnav__sub a{
  font-family: var(--font);
  font-weight:600;
  font-size:15px;
  color: rgba(11,15,28,.76);
}

.mnav__bottom{
  padding-top: 18px;
}
.mnav__cta{
  display:flex;
  align-items:center;
  justify-content:center;
  width: 100%;
  min-height: 56px;
  border-radius: 6px;
  background: var(--gold);
  color:#fff;
  font-weight:800;
  font-family: var(--display);
  letter-spacing:-.01em;
}

/* Focus visibility (UX) */
:focus-visible{
  outline: 3px solid rgba(31,58,116,.22);
  outline-offset: 3px;
}

/* ===== RESPONSIVO / HERO ART DIRECTION ===== */
@media (max-width: 719px){
  :root{
    --hero: var(--hero-mobile);
  }

  .hero{
    min-height: 100svh;
    padding: 92px 0 44px;
  }

  /* no mobile, normalmente queremos o assunto mais “centralizado” */
  .hero__bg{
    background-position: 50% 20%;
  }

  .hero__thin{font-size:32px;}
  .hero__bold{font-size:34px;}
  .media__grid{grid-template-columns: 1fr 1fr;}
}

@media (min-width: 720px){
  .hero__thin{font-size:40px;}
  .hero__bold{font-size:56px;}
  .stats__inner{grid-template-columns:1fr 1fr; gap: 20px; justify-items:center;}
  .media__grid{grid-template-columns: repeat(5, 1fr);}
  .media__logo{font-size:46px;}
  .exclusive__wrap{grid-template-columns: 1fr 1fr; align-items:center;}
}


/* ===== Floating Atendimento (WhatsApp) ===== */
.float-atendimento{
  position: fixed;
  right: 16px;
  bottom: calc(16px + env(safe-area-inset-bottom));
  z-index: 120; /* abaixo do drawer (999), acima do conteúdo */

  display: inline-flex;
  align-items: center;
  gap: 10px;

  padding: 12px 14px;
  border-radius: 10px;

  background: rgba(255,255,255,.92);
  color: var(--navy);
  border: 1px solid rgba(11,15,28,.10);
  box-shadow: 0 18px 50px rgba(11,15,28,.22);

  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);

  transform: translateZ(0);
}

.float-atendimento__icon{
  width: 42px;
  height: 42px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;

  background: var(--gold);
  color: #fff;

  box-shadow: 0 14px 34px rgba(0,0,0,.18);
}

.float-atendimento__text{
  display: inline-flex;
  flex-direction: column;
  line-height: 1.05;
}

.float-atendimento__title{
  font-family: var(--display);
  font-weight: 800;
  font-size: 14px;
  letter-spacing: -.01em;
}

.float-atendimento__sub{
  font-family: var(--font);
  font-weight: 600;
  font-size: 12px;
  color: rgba(11,15,28,.62);
  margin-top: 2px;
}

.float-atendimento:hover{
  transform: translateY(-1px);
}

.float-atendimento:active{
  transform: translateY(0);
}

@media (max-width: 420px){
    .float-atendimento {
        padding: 3px 5px;
        right: 19px;
        bottom: calc(44px + env(safe-area-inset-bottom));
    }
  .float-atendimento__icon{ width: 40px; height: 40px; }
}

/* acessibilidade */
.float-atendimento:focus-visible{
  outline: 3px solid rgba(31,58,116,.22);
  outline-offset: 4px;
}