@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@600;700;800;900&family=Manrope:wght@400;500;600;700;800&display=swap');

/* HOME HERO V1 — visual refinement only. Existing copy, links and media are untouched. */
:root{
  --gb-hero-red:#e7232b;
  --gb-hero-red-deep:#850719;
  --gb-hero-cream:#f5f1eb;
  --gb-hero-ease:cubic-bezier(.22,1,.36,1);
}

body:has(.hero-card){
  font-family:"Manrope",Arial,Helvetica,sans-serif;
}

body:has(.hero-card) .site-header{
  background:linear-gradient(180deg,rgba(4,4,6,.82) 0%,rgba(4,4,6,.42) 58%,transparent 100%)!important;
  border-bottom:1px solid transparent!important;
  backdrop-filter:none!important;
  transition:background .42s var(--gb-hero-ease),backdrop-filter .42s var(--gb-hero-ease),border-color .42s ease,box-shadow .42s ease!important;
}

body:has(.hero-card) .site-header.gb-nav-scrolled,
body:has(.hero-card) .site-header.is-scrolled{
  background:rgba(6,6,8,.84)!important;
  -webkit-backdrop-filter:blur(20px) saturate(135%)!important;
  backdrop-filter:blur(20px) saturate(135%)!important;
  border-bottom-color:rgba(255,255,255,.08)!important;
  box-shadow:0 18px 54px rgba(0,0,0,.18)!important;
}

body:has(.hero-card) .header-inner{
  min-height:82px!important;
}

body:has(.hero-card) .nav a{
  font-family:"Manrope",sans-serif!important;
  font-size:10px!important;
  letter-spacing:.1em!important;
  text-transform:uppercase;
}

body:has(.hero-card) .hero{
  min-height:100svh!important;
  position:relative!important;
  isolation:isolate!important;
  overflow:hidden!important;
  background:#050507!important;
}

/* Cinematic image treatment and directional light. */
body:has(.hero-card) .hero::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:1;
  pointer-events:none;
  background:
    linear-gradient(90deg,rgba(3,3,5,.93) 0%,rgba(3,3,5,.80) 28%,rgba(3,3,5,.28) 61%,rgba(3,3,5,.58) 100%),
    linear-gradient(180deg,rgba(2,2,4,.06) 34%,rgba(3,3,5,.16) 59%,rgba(3,3,5,.88) 100%),
    linear-gradient(126deg,transparent 0 70%,rgba(231,35,43,.08) 73%,transparent 78%);
}

/* Oversized editorial signature in the background. */
body:has(.hero-card) .hero::after{
  content:"SERRA AZUL";
  position:absolute;
  right:-.025em;
  bottom:4.5vh;
  z-index:2;
  pointer-events:none;
  white-space:nowrap;
  font-family:"Barlow Condensed","Arial Narrow",sans-serif;
  font-size:clamp(96px,17vw,280px);
  line-height:.72;
  font-weight:900;
  letter-spacing:-.055em;
  color:transparent;
  -webkit-text-stroke:1px rgba(255,255,255,.10);
  opacity:.55;
  transform:translate3d(2%,0,0);
}

body:has(.hero-card) .hero-bg{
  transform:scale(1.045)!important;
  filter:saturate(.80) contrast(1.07) brightness(.88)!important;
  transform-origin:58% 48%!important;
  will-change:transform,filter;
  transition:transform 8s cubic-bezier(.2,.65,.25,1),filter 1s ease!important;
}

html.premium-ready body:has(.hero-card) .hero-bg{
  transform:scale(1.015)!important;
}

body:has(.hero-card) .hero-shade{
  opacity:.22!important;
}

body:has(.hero-card) .hero-grain{
  z-index:2!important;
  opacity:.10!important;
  mix-blend-mode:soft-light!important;
}

body:has(.hero-card) .hero-inner{
  position:relative!important;
  z-index:4!important;
  min-height:100svh!important;
  padding-top:clamp(150px,18vh,210px)!important;
  padding-bottom:clamp(110px,14vh,160px)!important;
  grid-template-columns:minmax(0,1.14fr) minmax(310px,.54fr)!important;
  align-items:center!important;
  gap:clamp(48px,7vw,118px)!important;
}

body:has(.hero-card) .hero-copy{
  position:relative;
  max-width:930px!important;
}

body:has(.hero-card) .hero-copy::before{
  content:"";
  position:absolute;
  left:-28px;
  top:7px;
  width:2px;
  height:86px;
  background:linear-gradient(180deg,var(--gb-hero-red),rgba(231,35,43,0));
  box-shadow:0 0 20px rgba(231,35,43,.35);
}

body:has(.hero-card) .hero .eyebrow{
  display:flex!important;
  align-items:center;
  gap:12px;
  margin-bottom:18px!important;
  font-family:"Manrope",sans-serif!important;
  font-size:9px!important;
  line-height:1!important;
  font-weight:800!important;
  letter-spacing:.22em!important;
  text-transform:uppercase!important;
  color:rgba(255,255,255,.74)!important;
}

body:has(.hero-card) .hero .eyebrow::before{
  content:"";
  width:36px;
  height:2px;
  flex:0 0 auto;
  background:var(--gb-hero-red);
  box-shadow:0 0 12px rgba(231,35,43,.35);
}

body:has(.hero-card) .hero h1{
  margin:0!important;
  max-width:980px!important;
  font-family:"Barlow Condensed","Arial Narrow",Impact,sans-serif!important;
  font-size:clamp(72px,9.6vw,150px)!important;
  line-height:.82!important;
  font-weight:900!important;
  letter-spacing:-.048em!important;
  text-transform:uppercase!important;
  text-wrap:balance;
  text-shadow:0 20px 58px rgba(0,0,0,.28);
}

body:has(.hero-card) .hero h1 em,
body:has(.hero-card) .hero h1 strong{
  color:#ff3038!important;
}

body:has(.hero-card) .hero-copy > p{
  max-width:590px!important;
  margin-top:27px!important;
  font-family:"Manrope",sans-serif!important;
  font-size:clamp(14px,1.15vw,18px)!important;
  line-height:1.72!important;
  font-weight:400!important;
  color:rgba(255,255,255,.70)!important;
}

body:has(.hero-card) .hero-actions{
  display:flex!important;
  flex-wrap:wrap!important;
  align-items:center!important;
  gap:12px!important;
  margin-top:34px!important;
}

body:has(.hero-card) .hero-actions .btn,
body:has(.hero-card) .hero .premium-button{
  min-height:54px!important;
  border-radius:999px!important;
  padding-inline:25px!important;
  font-family:"Manrope",sans-serif!important;
  font-size:10px!important;
  font-weight:800!important;
  letter-spacing:.105em!important;
  text-transform:uppercase!important;
}

body:has(.hero-card) .hero .btn-red{
  background:linear-gradient(110deg,#ba0b25 0%,var(--gb-hero-red) 56%,#ff4048 100%)!important;
  box-shadow:0 14px 42px rgba(185,10,35,.26)!important;
}

body:has(.hero-card) .hero .btn-outline{
  background:rgba(5,5,8,.22)!important;
  border-color:rgba(255,255,255,.34)!important;
  -webkit-backdrop-filter:blur(10px)!important;
  backdrop-filter:blur(10px)!important;
}

/* Existing hero information becomes a refined glass plaque. */
body:has(.hero-card) .hero-card{
  position:relative!important;
  overflow:hidden!important;
  padding:clamp(26px,2.4vw,34px)!important;
  border:1px solid rgba(255,255,255,.14)!important;
  border-radius:2px!important;
  background:
    linear-gradient(180deg,rgba(22,22,27,.50),rgba(7,7,10,.72))!important;
  -webkit-backdrop-filter:blur(22px) saturate(135%)!important;
  backdrop-filter:blur(22px) saturate(135%)!important;
  box-shadow:0 34px 100px rgba(0,0,0,.30)!important;
  transform:translateZ(0);
  transition:transform .5s var(--gb-hero-ease),border-color .5s ease,box-shadow .5s ease!important;
}

body:has(.hero-card) .hero-card::before{
  content:"";
  position:absolute;
  left:0;
  top:0;
  width:3px;
  height:100%;
  background:linear-gradient(180deg,var(--gb-hero-red),rgba(231,35,43,.08) 76%,transparent);
  box-shadow:0 0 20px rgba(231,35,43,.24);
}

body:has(.hero-card) .hero-card::after{
  content:"";
  position:absolute;
  inset:-40% -70%;
  pointer-events:none;
  background:linear-gradient(115deg,transparent 42%,rgba(255,255,255,.10) 49%,rgba(255,255,255,.02) 52%,transparent 58%);
  transform:translateX(-45%);
  transition:transform 1s var(--gb-hero-ease);
}

body:has(.hero-card) .hero-card:hover{
  transform:translateY(-6px)!important;
  border-color:rgba(255,255,255,.23)!important;
  box-shadow:0 42px 120px rgba(0,0,0,.38)!important;
}

body:has(.hero-card) .hero-card:hover::after{
  transform:translateX(45%);
}

body:has(.hero-card) .hero-card > strong{
  font-family:"Barlow Condensed",sans-serif!important;
  font-size:clamp(25px,2.3vw,34px)!important;
  line-height:.95!important;
  letter-spacing:-.01em!important;
  font-weight:800!important;
}

body:has(.hero-card) .hero-card-grid{
  gap:18px!important;
}

body:has(.hero-card) .hero-card-grid b{
  font-family:"Barlow Condensed",sans-serif!important;
  font-size:clamp(24px,2vw,32px)!important;
  line-height:1!important;
}

body:has(.hero-card) .hero-card-grid small{
  font-family:"Manrope",sans-serif!important;
  font-size:8px!important;
  letter-spacing:.10em!important;
  color:rgba(255,255,255,.48)!important;
}

body:has(.hero-card) .hero-bottom{
  z-index:5!important;
  font-family:"Manrope",sans-serif!important;
  font-size:8px!important;
  letter-spacing:.18em!important;
  text-transform:uppercase!important;
  color:rgba(255,255,255,.42)!important;
}

body:has(.hero-card) .hero-bottom i{
  width:48px!important;
  height:1px!important;
  background:linear-gradient(90deg,var(--gb-hero-red),transparent)!important;
}

/* The hero should feel like the continuation of the approved preloader reveal. */
html.premium-loading body:has(.hero-card) .hero-copy,
html.premium-loading body:has(.hero-card) .hero-card,
html.premium-loading body:has(.hero-card) .hero-bottom{
  opacity:0!important;
  transform:translateY(28px)!important;
}

html.premium-ready body:has(.hero-card) .hero-copy,
html.premium-ready body:has(.hero-card) .hero-card,
html.premium-ready body:has(.hero-card) .hero-bottom{
  opacity:1!important;
  transform:translateY(0)!important;
  transition:opacity .9s ease,transform 1.05s var(--gb-hero-ease)!important;
}

html.premium-ready body:has(.hero-card) .hero-card{
  transition-delay:.12s!important;
}

html.premium-ready body:has(.hero-card) .hero-bottom{
  transition-delay:.24s!important;
}

@media (max-width:1100px){
  body:has(.hero-card) .hero-inner{
    grid-template-columns:minmax(0,1fr) minmax(280px,.48fr)!important;
    gap:42px!important;
  }
  body:has(.hero-card) .hero h1{
    font-size:clamp(68px,10.3vw,120px)!important;
  }
}

@media (max-width:899px){
  body:has(.hero-card) .site-header{
    background:linear-gradient(180deg,rgba(4,4,6,.84),rgba(4,4,6,.24),transparent)!important;
  }
  body:has(.hero-card) .hero{
    min-height:100svh!important;
  }
  body:has(.hero-card) .hero::before{
    background:
      linear-gradient(180deg,rgba(3,3,5,.48) 0%,rgba(3,3,5,.28) 28%,rgba(3,3,5,.70) 66%,rgba(3,3,5,.96) 100%),
      linear-gradient(90deg,rgba(3,3,5,.62),rgba(3,3,5,.10) 72%);
  }
  body:has(.hero-card) .hero::after{
    right:-.02em;
    bottom:7vh;
    font-size:clamp(76px,26vw,150px);
    opacity:.30;
  }
  body:has(.hero-card) .hero-bg{
    transform:scale(1.075)!important;
    transform-origin:62% 45%!important;
    filter:saturate(.84) contrast(1.05) brightness(.83)!important;
  }
  html.premium-ready body:has(.hero-card) .hero-bg{
    transform:scale(1.045)!important;
  }
  body:has(.hero-card) .hero-inner{
    min-height:100svh!important;
    display:flex!important;
    flex-direction:column!important;
    justify-content:flex-end!important;
    align-items:stretch!important;
    gap:24px!important;
    padding-top:132px!important;
    padding-bottom:88px!important;
  }
  body:has(.hero-card) .hero-copy{
    max-width:100%!important;
  }
  body:has(.hero-card) .hero-copy::before{
    left:0;
    top:-20px;
    width:52px;
    height:2px;
    background:linear-gradient(90deg,var(--gb-hero-red),transparent);
  }
  body:has(.hero-card) .hero .eyebrow{
    margin-bottom:14px!important;
    font-size:8px!important;
  }
  body:has(.hero-card) .hero h1{
    max-width:720px!important;
    font-size:clamp(58px,16vw,94px)!important;
    line-height:.85!important;
  }
  body:has(.hero-card) .hero-copy > p{
    max-width:520px!important;
    margin-top:20px!important;
    font-size:14px!important;
    line-height:1.66!important;
  }
  body:has(.hero-card) .hero-actions{
    margin-top:25px!important;
  }
  body:has(.hero-card) .hero-card{
    width:100%!important;
    padding:22px!important;
    background:rgba(8,8,11,.62)!important;
    -webkit-backdrop-filter:blur(18px) saturate(125%)!important;
    backdrop-filter:blur(18px) saturate(125%)!important;
  }
  body:has(.hero-card) .hero-card:hover{
    transform:none!important;
  }
}

@media (max-width:560px){
  body:has(.hero-card) .hero-inner{
    padding-top:118px!important;
    padding-bottom:74px!important;
  }
  body:has(.hero-card) .hero h1{
    font-size:clamp(54px,17.2vw,78px)!important;
  }
  body:has(.hero-card) .hero-actions{
    display:grid!important;
    grid-template-columns:1fr!important;
  }
  body:has(.hero-card) .hero-actions .btn,
  body:has(.hero-card) .hero .premium-button{
    width:100%!important;
    min-height:52px!important;
  }
  body:has(.hero-card) .hero-card{
    display:none!important;
  }
  body:has(.hero-card) .hero::after{
    bottom:11vh;
  }
}

@media (prefers-reduced-motion:reduce){
  body:has(.hero-card) .hero-bg,
  body:has(.hero-card) .hero-copy,
  body:has(.hero-card) .hero-card,
  body:has(.hero-card) .hero-bottom{
    transition:none!important;
    transform:none!important;
  }
}