/* J. Specht — hero refinement, 2026-10-06
   Direct cPanel override. Kept separate from the generated Vite bundle. */

@media (min-width: 1024px) {
  #inicio {
    min-height: 720px !important;
  }

  #inicio > div:first-child {
    background-position: 66% 46% !important;
    opacity: .52 !important;
    filter: saturate(.48) contrast(1.06) brightness(.84);
    transform: scale(1.025);
  }

  #inicio .hero-overlay {
    background:
      radial-gradient(circle at 72% 42%, rgba(230,191,114,.12), transparent 26%),
      linear-gradient(90deg, rgba(2,2,2,.99) 0%, rgba(4,4,4,.94) 35%, rgba(5,5,5,.62) 67%, rgba(4,4,4,.90) 100%),
      linear-gradient(180deg, rgba(0,0,0,.06) 0%, rgba(0,0,0,.16) 56%, rgba(2,2,2,.92) 100%) !important;
  }

  #inicio > .relative.z-10 {
    min-height: 628px !important;
    grid-template-columns: minmax(0, 1.32fr) minmax(290px, .52fr) !important;
    gap: clamp(3rem, 5vw, 5.25rem) !important;
    padding-top: 3.5rem !important;
    padding-bottom: 3.5rem !important;
    align-items: center !important;
  }

  #inicio > .relative.z-10 > div:first-child {
    max-width: 850px !important;
  }

  #inicio .mb-6 {
    margin-bottom: 1.15rem !important;
  }

  #inicio .mb-6 p {
    font-size: 11px !important;
    letter-spacing: .24em !important;
    color: rgba(242,212,145,.92) !important;
  }

  #inicio h1 {
    max-width: 840px !important;
    font-size: clamp(3.9rem, 4.65vw, 5.2rem) !important;
    line-height: .95 !important;
    letter-spacing: -.048em !important;
    text-wrap: balance;
    text-shadow: 0 8px 36px rgba(0,0,0,.22);
  }

  #inicio h1 + p {
    max-width: 720px !important;
    margin-top: 1.55rem !important;
    font-size: 16px !important;
    line-height: 1.72 !important;
    color: rgba(255,255,255,.72) !important;
  }

  #inicio h1 + p + div {
    margin-top: 1.75rem !important;
    gap: .75rem !important;
  }

  #inicio h1 + p + div > a {
    min-height: 50px !important;
    padding-left: 1.45rem !important;
    padding-right: 1.45rem !important;
    font-size: 10px !important;
    letter-spacing: .105em !important;
  }

  #inicio h1 + p + div > a:first-child {
    box-shadow:
      0 18px 42px rgba(139,93,29,.18),
      inset 0 1px 0 rgba(255,255,255,.28) !important;
  }

  #inicio .mt-11 {
    margin-top: 2rem !important;
    gap: .8rem 1.7rem !important;
    font-size: 9px !important;
    letter-spacing: .14em !important;
    color: rgba(235,207,145,.82) !important;
  }

  #inicio aside {
    align-self: center !important;
    border-left: 0 !important;
    border: 1px solid rgba(242,212,145,.18) !important;
    border-radius: 26px !important;
    padding: 2rem 1.85rem !important;
    background:
      linear-gradient(150deg, rgba(255,255,255,.045), rgba(255,255,255,.012) 48%, rgba(198,146,63,.04)),
      rgba(7,7,7,.42) !important;
    box-shadow:
      0 28px 70px rgba(0,0,0,.22),
      inset 0 1px 0 rgba(255,255,255,.035) !important;
    backdrop-filter: blur(12px);
  }

  #inicio aside > p:first-child {
    font-size: clamp(2rem, 2.35vw, 2.7rem) !important;
    line-height: 1.03 !important;
  }

  #inicio aside > p:nth-child(2) {
    max-width: 250px !important;
    margin-top: 1.1rem !important;
    font-size: 13px !important;
    line-height: 1.72 !important;
    color: rgba(255,255,255,.58) !important;
  }

  #inicio aside > div:last-child {
    margin-top: 1.45rem !important;
    padding-top: 1.25rem !important;
    border-color: rgba(242,212,145,.20) !important;
  }

  header:not([data-sticky="true"]) {
    background:
      linear-gradient(180deg, rgba(4,4,4,.88), rgba(4,4,4,.54)) !important;
    border-bottom-color: rgba(242,212,145,.14) !important;
    backdrop-filter: blur(10px) !important;
  }

  header nav a {
    font-size: 10.5px !important;
    color: rgba(255,255,255,.78);
  }
}

@media (min-width: 1024px) and (max-height: 820px) {
  #inicio {
    min-height: 680px !important;
  }

  #inicio > .relative.z-10 {
    min-height: 588px !important;
    padding-top: 2.5rem !important;
    padding-bottom: 2.5rem !important;
  }

  #inicio h1 {
    font-size: clamp(3.65rem, 4.4vw, 4.85rem) !important;
  }

  #inicio .mt-11 {
    margin-top: 1.5rem !important;
  }
}

@media (max-width: 1023px) {
  #inicio {
    min-height: auto !important;
  }

  #inicio > div:first-child {
    background-position: 62% center !important;
    opacity: .48 !important;
    filter: saturate(.5) contrast(1.04) brightness(.82);
  }

  #inicio .hero-overlay {
    background:
      linear-gradient(90deg, rgba(2,2,2,.98), rgba(4,4,4,.82) 72%, rgba(4,4,4,.72)),
      linear-gradient(180deg, transparent 52%, rgba(2,2,2,.94) 100%) !important;
  }

  #inicio > .relative.z-10 {
    min-height: 0 !important;
    padding-top: 4rem !important;
    padding-bottom: 3.5rem !important;
  }

  #inicio h1 {
    max-width: 760px !important;
    font-size: clamp(3.15rem, 9.5vw, 4.9rem) !important;
    line-height: .96 !important;
    letter-spacing: -.045em !important;
    text-wrap: balance;
  }

  #inicio h1 + p {
    max-width: 650px !important;
    color: rgba(255,255,255,.72) !important;
  }
}

@media (max-width: 639px) {
  #inicio > .relative.z-10 {
    padding-top: 3.25rem !important;
    padding-bottom: 3rem !important;
  }

  #inicio .mb-6 {
    margin-bottom: 1rem !important;
  }

  #inicio h1 {
    font-size: clamp(2.8rem, 13vw, 3.85rem) !important;
    line-height: .97 !important;
  }

  #inicio h1 + p {
    margin-top: 1.35rem !important;
    font-size: 15px !important;
    line-height: 1.65 !important;
  }

  #inicio h1 + p + div {
    margin-top: 1.5rem !important;
  }

  #inicio .mt-11 {
    margin-top: 1.75rem !important;
  }
}


/* Official J. Specht logo */
.brand-lockup {
  display: inline-block !important;
  position: relative;
  width: 154px !important;
  height: 92px !important;
  min-width: 154px !important;
  background: url('/imagens/logotipo/jspecht_seguros_pelotas_corretora.png') center / contain no-repeat !important;
  filter: drop-shadow(0 7px 18px rgba(0,0,0,.22));
}

.brand-lockup > * {
  display: none !important;
}

.brand-lockup--compact {
  width: 138px !important;
  height: 82px !important;
  min-width: 138px !important;
}

header .brand-lockup {
  width: 126px !important;
  height: 78px !important;
  min-width: 126px !important;
}

header[data-sticky="true"] .brand-lockup {
  width: 108px !important;
  height: 64px !important;
  min-width: 108px !important;
}

#inicio aside .brand-lockup {
  width: 150px !important;
  height: 112px !important;
  min-width: 150px !important;
}

footer .brand-lockup {
  width: 158px !important;
  height: 118px !important;
  min-width: 158px !important;
}

@media (min-width: 1024px) {
  header:not([data-sticky="true"]) > div:first-of-type {
    min-height: 100px !important;
  }

  #inicio {
    padding-top: 100px !important;
  }
}

@media (max-width: 1023px) {
  header .brand-lockup,
  header .brand-lockup--compact {
    width: 96px !important;
    height: 64px !important;
    min-width: 96px !important;
  }
}

@media (max-width: 639px) {
  header .brand-lockup,
  header .brand-lockup--compact {
    width: 82px !important;
    height: 56px !important;
    min-width: 82px !important;
  }

  footer .brand-lockup {
    width: 132px !important;
    height: 99px !important;
    min-width: 132px !important;
  }
}


/* Fold compacting pass — 1920x953 review */
@media (min-width: 1024px) {
  #inicio {
    min-height: 700px !important;
  }

  #inicio > .relative.z-10 {
    min-height: 600px !important;
    grid-template-columns: minmax(0, 1.4fr) minmax(270px, .46fr) !important;
    gap: clamp(2.5rem, 4vw, 4.5rem) !important;
    padding-top: 2.8rem !important;
    padding-bottom: 2.8rem !important;
  }

  #inicio > .relative.z-10 > div:first-child {
    max-width: 900px !important;
  }

  #inicio h1 {
    max-width: 900px !important;
    font-size: clamp(3.75rem, 4.05vw, 4.55rem) !important;
    line-height: .96 !important;
  }

  #inicio h1 + p {
    margin-top: 1.25rem !important;
    max-width: 760px !important;
  }

  #inicio h1 + p + div {
    margin-top: 1.4rem !important;
  }

  #inicio .mt-11 {
    margin-top: 1.45rem !important;
  }

  #inicio aside {
    padding: 1.65rem 1.55rem !important;
    border-radius: 22px !important;
  }

  #inicio aside > p:first-child {
    font-size: clamp(1.8rem, 2.1vw, 2.35rem) !important;
  }
}

@media (min-width: 1440px) {
  header .brand-lockup {
    width: 118px !important;
    height: 74px !important;
    min-width: 118px !important;
  }

  header:not([data-sticky="true"]) > div:first-of-type {
    min-height: 94px !important;
  }

  #inicio {
    padding-top: 94px !important;
  }
}


/* Final fold polish — 1920x953 visual review */
@media (min-width: 1024px) {
  #inicio {
    min-height: 670px !important;
  }

  #inicio > div:first-child {
    opacity: .58 !important;
    filter: saturate(.52) contrast(1.04) brightness(.90) !important;
    background-position: 67% 44% !important;
  }

  #inicio .hero-overlay {
    background:
      radial-gradient(circle at 68% 43%, rgba(230,191,114,.13), transparent 27%),
      linear-gradient(90deg, rgba(2,2,2,.985) 0%, rgba(4,4,4,.91) 34%, rgba(5,5,5,.50) 66%, rgba(4,4,4,.84) 100%),
      linear-gradient(180deg, rgba(0,0,0,.04) 0%, rgba(0,0,0,.12) 56%, rgba(2,2,2,.88) 100%) !important;
  }

  #inicio > .relative.z-10 {
    min-height: 565px !important;
    padding-top: 2.25rem !important;
    padding-bottom: 2.25rem !important;
    transform: translateY(-6px);
  }

  #inicio h1 {
    font-size: clamp(3.7rem, 3.95vw, 4.45rem) !important;
  }

  #inicio .mt-11 {
    font-size: 9.5px !important;
    color: rgba(242,212,145,.88) !important;
  }

  header .brand-lockup,
  header .brand-lockup--compact {
    width: 142px !important;
    height: 82px !important;
    min-width: 142px !important;
  }

  header[data-sticky="true"] .brand-lockup,
  header[data-sticky="true"] .brand-lockup--compact {
    width: 124px !important;
    height: 70px !important;
    min-width: 124px !important;
  }

  header:not([data-sticky="true"]) > div:first-of-type {
    min-height: 96px !important;
  }

  #inicio {
    padding-top: 96px !important;
  }

  header > div:first-of-type > a[href="/contato"] {
    background: linear-gradient(120deg,#9c681f 0%,#d8aa54 28%,#f3d58e 48%,#c78b31 72%,#8b5d1d 100%) !important;
    color: #171108 !important;
    border-color: rgba(255,240,189,.52) !important;
    box-shadow: 0 10px 28px rgba(139,93,29,.20), inset 0 1px 0 rgba(255,255,255,.32) !important;
    opacity: 1 !important;
  }

  header > div:first-of-type > a[href="/contato"]:hover {
    filter: brightness(1.06);
    transform: translateY(-1px);
  }
}
