:root{
  --gold-light:#ffe4a2;
  --gold:#c88b39;
  --gold-dark:#5d3511;
  --white:#f8f5ee;
  --muted:rgba(255,255,255,.70);
  --black:#030403;
}

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

html,body{
  width:100%;
  min-height:100%;
  background:var(--black);
  color:var(--white);
  font-family:Inter, Arial, Helvetica, sans-serif;
}

body{overflow:hidden}

.bg-video{
  position:fixed;
  inset:0;
  z-index:0;
  overflow:hidden;
  background:#030403;
}

.bg-video video{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  opacity:.88;
  transform:scale(1.045);
  filter:blur(1px) saturate(1.22) contrast(1.10);
}

.video-fallback{
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 32% 46%, rgba(255,210,105,.50), rgba(198,102,24,.20) 22%, transparent 42%),
    radial-gradient(circle at 58% 45%, rgba(83,125,114,.28), transparent 30%),
    radial-gradient(circle at 78% 50%, rgba(110,47,27,.17), transparent 24%),
    linear-gradient(115deg, #030403 0%, #0a0a07 42%, #010202 100%);
  animation:fallbackMove 14s ease-in-out infinite alternate;
}

.video-fallback::before{
  content:"";
  position:absolute;
  width:42vw;
  max-width:620px;
  aspect-ratio:1;
  left:9vw;
  top:18vh;
  border-radius:50%;
  background:
    radial-gradient(circle, rgba(255,242,177,.54) 0 12%, rgba(255,176,54,.25) 22%, rgba(255,130,28,.10) 40%, transparent 62%);
  box-shadow:0 0 90px rgba(255,174,66,.22);
  animation:sunFire 5s ease-in-out infinite alternate;
}

.glass{
  position:fixed;
  inset:0;
  z-index:1;
  pointer-events:none;
  background:
    linear-gradient(90deg, rgba(0,0,0,.76), rgba(0,0,0,.16) 44%, rgba(0,0,0,.82)),
    linear-gradient(0deg, rgba(0,0,0,.92), rgba(0,0,0,.05) 47%, rgba(0,0,0,.70));
  backdrop-filter:blur(1.8px) contrast(1.08);
  -webkit-backdrop-filter:blur(1.8px) contrast(1.08);
}

.grain{
  position:fixed;
  inset:0;
  z-index:2;
  pointer-events:none;
  opacity:.15;
  mix-blend-mode:overlay;
  background-image:
    repeating-radial-gradient(circle at 25% 30%, rgba(255,255,255,.06) 0 1px, transparent 1px 3px),
    repeating-linear-gradient(90deg, rgba(255,255,255,.024) 0 1px, transparent 1px 5px);
  animation:grain .45s steps(2,end) infinite;
}

.page{
  position:relative;
  z-index:5;
  width:100%;
  min-height:100vh;
  padding:30px clamp(28px, 5vw, 95px);
  display:grid;
  grid-template-rows:auto 1fr auto;
  gap:24px;
}

/* TOPO
   Mantém a linha original, mas joga o texto para a esquerda,
   alinhado com a identidade do rodapé. */
.header{
  display:grid;
  grid-template-columns:1fr auto 1fr;
  align-items:start;
}

.menu{
  width:34px;
  height:24px;
  border:0;
  background:transparent;
  display:grid;
  gap:7px;
  cursor:pointer;
}

.menu span{
  display:block;
  height:2px;
  background:#fff;
  border-radius:30px;
}

/* Texto superior alinhado à esquerda */
.logo-top{
  grid-column:1;
  justify-self:start;
  text-align:left;
  font-family:Inter, Arial, Helvetica, sans-serif;
  color:var(--muted);
  background:none;
  -webkit-background-clip:initial;
  background-clip:initial;
  font-size:clamp(9.5px, .82vw, 14px);
  line-height:1.65;
  font-weight:500;
  text-transform:uppercase;
  letter-spacing:.14em;
  max-width:650px;
  text-shadow:none;
}

.search{
  justify-self:end;
  position:relative;
  width:37px;
  height:37px;
}

.search::before{
  content:"";
  position:absolute;
  width:21px;
  height:21px;
  border:2px solid #fff;
  border-radius:50%;
  left:1px;
  top:0;
}

.search::after{
  content:"";
  position:absolute;
  width:17px;
  height:2px;
  background:#fff;
  border-radius:20px;
  transform:rotate(45deg);
  right:1px;
  bottom:7px;
}

/* ÁREA PRINCIPAL */
.hero{
  position:relative;
  width:100%;
  display:grid;
  grid-template-columns:minmax(165px, 250px) minmax(0, 1fr);
  align-items:center;
  gap:clamp(28px, 4.5vw, 76px);
}

.hero-title{
  font-family:Georgia, "Times New Roman", serif;
  font-size:clamp(25px, 2.9vw, 45px);
  line-height:1;
  letter-spacing:-.055em;
  text-transform:uppercase;
  background:linear-gradient(180deg, #ffe5a4 0%, #c88b39 50%, #623812 100%);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  filter:drop-shadow(0 0 16px rgba(212,150,65,.22));
}

/* Logo centralizado no meio real da página */
.brand-area{
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%, -50%);
  width:min(760px, 72vw);
  min-width:0;
  display:flex;
  justify-content:center;
  align-items:center;
  text-align:center;
  overflow:visible;
}

.brand{
  width:100%;
  max-width:760px;
  min-width:0;
  padding-inline:12px;
}

/* IHIA com dourado original, brilho original e alto relevo por profundidade */
.ihia{
  position:relative;
  display:inline-block;
  isolation:isolate;
  font-family:Georgia, "Times New Roman", serif;
  font-weight:950;
  font-size:clamp(55px, 8.3vw, 137px);
  line-height:.78;
  letter-spacing:-.075em;
  text-transform:uppercase;

  /* COR DOURADA ORIGINAL */
  background:linear-gradient(180deg, #ffe7aa 0%, #cf963f 42%, #693d15 68%, #f1d185 100%);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  -webkit-text-fill-color:transparent;

  /* SOMBRA/BRILHO ORIGINAL */
  filter:drop-shadow(0 0 44px rgba(218,158,70,.25));

  animation:goldBreath 5.5s ease-in-out infinite;
}
/* Profundidade do alto relevo: fica atrás do dourado, não apaga o brilho */
.ihia::before{
  content:"IHIA";
  position:absolute;
  inset:0;
  z-index:-2;
  transform:translate(4px, 6px);
  font:inherit;
  letter-spacing:inherit;
  line-height:inherit;
  text-transform:inherit;
  color:rgba(24,12,4,.72);
  -webkit-text-fill-color:rgba(24,12,4,.72);
  text-shadow:
    0 3px 0 rgba(0,0,0,.58),
    0 8px 14px rgba(0,0,0,.72),
    0 18px 30px rgba(0,0,0,.62);
  pointer-events:none;
}

/* Filete de luz superior para dar relevo sem mudar o dourado original */
.ihia::after{
  content:"IHIA";
  position:absolute;
  inset:0;
  z-index:-1;
  transform:translate(-1px, -1px);
  font:inherit;
  letter-spacing:inherit;
  line-height:inherit;
  text-transform:inherit;
  color:rgba(255,238,184,.30);
  -webkit-text-fill-color:rgba(255,238,184,.30);
  text-shadow:
    0 -1px 0 rgba(255,246,213,.34),
    0 0 12px rgba(255,218,145,.18);
  pointer-events:none;
}

.tagline{
  width:100%;
  max-width:760px;
  margin:24px auto 0;
  color:var(--muted);
  text-transform:uppercase;
  letter-spacing:.14em;
  font-size:clamp(9.5px, .82vw, 14px);
  line-height:1.7;
  white-space:normal;
  overflow-wrap:normal;
  text-align:center;
}

/* Rodapé reduzido para não pesar visualmente */
.bottom{
  display:grid;
  grid-template-columns:minmax(210px, 420px) minmax(0, 1fr);
  align-items:end;
  gap:26px;
}

.identity{
  max-width:420px;
  transform:scale(.68);
  transform-origin:left bottom;
}

.identity-row{
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom:13px;
}

.seal{
  flex:0 0 auto;
  width:54px;
  height:54px;
  border:2px solid rgba(255,255,255,.86);
  border-radius:50%;
  display:grid;
  place-items:center;
  font-family:Georgia, "Times New Roman", serif;
  font-size:18px;
}

.company{
  color:#fff;
  font-weight:950;
  text-transform:uppercase;
  font-size:clamp(14px, .95vw, 18px);
  line-height:1.06;
}

.slogan{
  color:#fff;
  font-family:Georgia, "Times New Roman", serif;
  font-size:clamp(14px, .92vw, 18px);
  line-height:1.25;
}

.footer{
  justify-self:end;
  display:flex;
  align-items:end;
  gap:28px;
}

.footer-links{
  display:flex;
  align-items:center;
  gap:24px;
  color:#fff;
  font-size:14px;
  white-space:nowrap;
}

.footer-links a{
  color:#fff;
  text-decoration:none;
  opacity:.9;
}

.socials{
  display:flex;
  gap:15px;
}

.social{
  width:58px;
  height:58px;
  border-radius:50%;
  display:grid;
  place-items:center;
  color:#fff;
  background:rgba(255,255,255,.24);
  text-decoration:none;
  font-weight:900;
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  transition:.25s ease;
}

.social:hover{
  transform:translateY(-3px);
  background:rgba(202,141,57,.52);
}

.gold-mark{
  position:absolute;
  right:clamp(44px,5vw,100px);
  bottom:170px;
  width:56px;
  height:42px;
  opacity:.92;
}

.gold-mark span{
  position:absolute;
  display:block;
  width:33px;
  height:5px;
  border-radius:20px;
  background:linear-gradient(90deg,var(--gold-light),var(--gold));
  transform:rotate(-66deg);
}

.gold-mark span:nth-child(1){left:0;top:22px}
.gold-mark span:nth-child(2){left:14px;top:15px}
.gold-mark span:nth-child(3){left:28px;top:8px}

@keyframes fallbackMove{
  0%{transform:scale(1.03) translateX(-1.5%)}
  100%{transform:scale(1.10) translateX(2.5%)}
}

@keyframes sunFire{
  0%{transform:scale(.96); opacity:.55; filter:blur(9px) saturate(1.10)}
  100%{transform:scale(1.05); opacity:.78; filter:blur(13px) saturate(1.45)}
}

@keyframes grain{
  0%{transform:translate(0,0)}
  25%{transform:translate(-1%,1%)}
  50%{transform:translate(1%,-1%)}
  75%{transform:translate(1%,1%)}
  100%{transform:translate(0,0)}
}

@keyframes goldBreath{
  0%,100%{filter:drop-shadow(0 0 24px rgba(218,158,70,.18));opacity:.95}
  50%{filter:drop-shadow(0 0 58px rgba(255,218,145,.35));opacity:1}
}

@media (max-width:1180px){
  .brand{max-width:720px}
  .ihia{font-size:clamp(80px, 11.8vw, 170px)}
  .tagline{letter-spacing:.12em;max-width:650px}
  .identity{transform:scale(.64);transform-origin:left bottom}
}

@media (max-width:900px){
  body{overflow:auto}

  .page{
    min-height:100svh;
    padding:24px 22px;
    gap:34px;
  }

  .hero{
    grid-template-columns:1fr;
    justify-items:center;
    text-align:center;
    align-content:center;
    gap:30px;
  }

  .brand-area{
    position:relative;
    left:auto;
    top:auto;
    transform:none;
    order:1;
    width:100%;
  }

  .hero-left{
    order:2;
  }

  .hero-title{
    font-size:clamp(28px,7vw,48px);
  }

  .ihia{
    font-size:clamp(55px, 15.3vw, 97px);
  }

  .tagline{
    max-width:620px;
    letter-spacing:.10em;
    font-size:clamp(10px,2vw,14px);
  }

  .bottom{
    grid-template-columns:1fr;
    justify-items:center;
    text-align:center;
    gap:20px;
  }

  .identity{
    transform:none;
    max-width:520px;
  }

  .identity-row{
    justify-content:center;
  }

  .footer{
    justify-self:center;
    flex-direction:column;
    align-items:center;
    gap:18px;
  }

  .footer-links{
    justify-content:center;
    flex-wrap:wrap;
    gap:14px 20px;
  }

  .gold-mark{
    display:none;
  }
}

@media (max-width:560px){
  .page{
    padding:18px 16px 22px;
    gap:22px;
  }

  .menu{
    width:28px;
    height:20px;
    gap:6px;
  }

  .logo-top{
    font-size:9px;
    max-width:260px;
    letter-spacing:.10em;
    line-height:1.55;
  }

  .search{
    width:30px;
    height:30px;
  }

  .search::before{
    width:18px;
    height:18px;
  }

  .search::after{
    width:14px;
    bottom:6px;
  }

  .hero{
    gap:24px;
    padding-top:18px;
  }

  .ihia{
    font-size:clamp(48px, 18.5vw, 79px);
  }

  .tagline{
    margin-top:20px;
    max-width:320px;
    font-size:9.2px;
    letter-spacing:.08em;
    line-height:1.75;
  }

  .hero-title{
    font-size:clamp(25px, 9vw, 38px);
  }

  .identity-row{
    gap:10px;
  }

  .seal{
    width:48px;
    height:48px;
    font-size:16px;
  }

  .company{
    font-size:13px;
    text-align:left;
  }

  .slogan{
    font-size:15px;
    max-width:320px;
    margin-inline:auto;
  }

  .footer-links{
    font-size:12px;
  }

  .social{
    width:50px;
    height:50px;
  }
}