/* ============ URUTAU DIAMOND ============
   Paleta: preto quente + marfim + fio espectral
   Tipos: Cormorant Garamond (display) / Figtree (corpo)
=========================================== */

:root{
  --preto:#0b0a0d;
  --preto2:#121016;
  --marfim:#f0eae0;
  --marfim-fraco:rgba(240,234,224,.62);
  --ambar:#e8a24c;
  --espectro:linear-gradient(180deg,#37c7ff 0%,#7affb0 30%,#ffe14d 55%,#ff8a3d 75%,#ff3d7a 100%);
  --serif:'Cormorant Garamond',serif;
  --sans:'Figtree',sans-serif;
}

*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  background:var(--preto);
  color:var(--marfim);
  font-family:var(--sans);
  font-weight:300;
  line-height:1.6;
  overflow-x:hidden;
}
img{display:block;max-width:100%}
em{font-style:italic}
.centro{text-align:center}
.oculto{display:none !important}
.grifo{color:var(--ambar)}

/* ---- fio de luz (assinatura) ---- */
.fio{
  position:fixed;left:clamp(16px,4vw,56px);top:0;bottom:0;width:1px;
  background:var(--espectro);
  opacity:.35;z-index:5;pointer-events:none;
  animation:pulsar 7s ease-in-out infinite;
}
@keyframes pulsar{0%,100%{opacity:.2}50%{opacity:.5}}
@media (prefers-reduced-motion:reduce){
  .fio{animation:none;opacity:.25}
  html{scroll-behavior:auto}
}

/* ---- nav ---- */
.nav{
  position:fixed;top:0;left:0;right:0;z-index:20;
  display:flex;justify-content:space-between;align-items:center;
  padding:1.1rem clamp(1.5rem,6vw,4rem);
  background:linear-gradient(180deg,rgba(11,10,13,.85),transparent);
}
.nav-marca{
  font-family:var(--serif);letter-spacing:.35em;font-size:1rem;
  color:var(--marfim);text-decoration:none;
}
.nav-cta{
  font-size:.8rem;letter-spacing:.12em;text-transform:uppercase;
  color:var(--marfim);text-decoration:none;
  border:1px solid rgba(240,234,224,.3);border-radius:2rem;
  padding:.5rem 1.2rem;transition:border-color .3s,background .3s;
}
.nav-cta:hover{border-color:var(--ambar);background:rgba(232,162,76,.08)}

/* ---- hero ---- */
.hero{position:relative;min-height:100svh;display:grid;place-items:center;overflow:hidden}
.hero-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center}
.hero-veu{position:absolute;inset:0;background:radial-gradient(ellipse at center,rgba(11,10,13,.25) 0%,rgba(11,10,13,.78) 100%)}
.hero-conteudo{position:relative;z-index:2;text-align:center;padding:0 1.5rem;max-width:44rem}
.eyebrow{
  font-size:.72rem;letter-spacing:.3em;text-transform:uppercase;
  color:var(--marfim-fraco);margin-bottom:1.2rem;
}
.hero h1{
  font-family:var(--serif);font-weight:300;
  font-size:clamp(3.2rem,10vw,6.5rem);line-height:1.02;letter-spacing:.04em;
}
.hero h1 em{font-weight:400}
.hero-linha{
  font-family:var(--serif);font-style:italic;font-size:clamp(1.15rem,2.6vw,1.5rem);
  color:var(--marfim-fraco);margin-top:1rem;
}
.hero-acoes{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap;margin-top:2.4rem}
.hero-seta{
  position:absolute;bottom:1.6rem;left:50%;transform:translateX(-50%);
  color:var(--marfim-fraco);text-decoration:none;font-size:1.2rem;z-index:2;
}

/* ---- botões ---- */
.botao{
  display:inline-block;cursor:pointer;
  font-family:var(--sans);font-size:.85rem;font-weight:500;
  letter-spacing:.12em;text-transform:uppercase;text-decoration:none;
  color:var(--preto);background:var(--marfim);
  border:1px solid var(--marfim);border-radius:2rem;
  padding:.85rem 1.9rem;transition:background .3s,color .3s,border-color .3s;
}
.botao:hover{background:var(--ambar);border-color:var(--ambar);color:var(--preto)}
.botao-fantasma{background:transparent;color:var(--marfim);border-color:rgba(240,234,224,.35)}
.botao-fantasma:hover{background:rgba(240,234,224,.08);color:var(--marfim);border-color:var(--marfim)}
:focus-visible{outline:2px solid var(--ambar);outline-offset:3px}

/* ---- seções ---- */
.secao{padding:clamp(5rem,12vw,9rem) clamp(1.5rem,8vw,6rem)}

/* 2 · gesto */
.secao-gesto{display:grid;place-items:center;min-height:52svh}
.gesto-frase{
  font-family:var(--serif);font-weight:300;text-align:center;
  font-size:clamp(1.6rem,4.5vw,2.8rem);line-height:1.35;max-width:52rem;
}

/* 3 · detalhes */
.detalhes-grade{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
  gap:2.5rem;max-width:72rem;margin:3rem auto 0;
}
.detalhe img,.detalhe-abstrato{
  width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:.4rem;
  background:var(--preto2);
}
.detalhe-abstrato{display:grid;place-items:center;position:relative;overflow:hidden}
.detalhe-abstrato .ponto{
  width:14px;height:14px;border-radius:50%;background:var(--marfim);
  box-shadow:0 0 46px 14px rgba(240,234,224,.35);
}
.detalhe-haste .linha{width:1px;height:78%;background:var(--espectro);box-shadow:0 0 24px 2px rgba(122,255,176,.25)}
.detalhe h3{
  font-family:var(--serif);font-weight:400;font-size:1.5rem;
  margin:1.3rem 0 .4rem;
}
.detalhe p{color:var(--marfim-fraco);font-size:.95rem;max-width:32ch}

/* 4 · luz */
.secao-luz{
  display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,6vw,5rem);
  align-items:center;max-width:76rem;margin:0 auto;
}
.luz-img{border-radius:.4rem;width:100%}
.secao-luz h2{
  font-family:var(--serif);font-weight:300;
  font-size:clamp(2rem,4.5vw,3.2rem);line-height:1.15;margin:.6rem 0 1.2rem;
}
.luz-texto p{color:var(--marfim-fraco);max-width:44ch;margin-bottom:1.8rem}
@media (max-width:760px){.secao-luz{grid-template-columns:1fr}}

/* 5 · alma */
.secao-alma{background:var(--preto2)}
.alma-grade{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
  gap:2.5rem;max-width:70rem;margin:3rem auto 0;
}
.alma-item h3{
  font-family:var(--serif);font-weight:400;font-size:1.4rem;margin-bottom:.5rem;
}
.alma-item p{color:var(--marfim-fraco);font-size:.95rem}

/* 6 · sob medida */
.secao-medida{text-align:center}
.medida-frase{
  font-family:var(--serif);font-weight:300;
  font-size:clamp(1.8rem,5vw,3rem);line-height:1.3;
}
.medida-apoio{color:var(--marfim-fraco);max-width:46ch;margin:1.4rem auto 0}

/* 7 · lista ---- */
.secao-lista h2{
  font-family:var(--serif);font-weight:300;font-size:clamp(2.2rem,5vw,3.4rem);
}
.lista-apoio{color:var(--marfim-fraco);max-width:44ch;margin:1rem auto 2.5rem}
.form{max-width:26rem;margin:0 auto;display:grid;gap:1.2rem}
.form label{display:grid;gap:.4rem}
.form label span{font-size:.75rem;letter-spacing:.15em;text-transform:uppercase;color:var(--marfim-fraco)}
.form input{
  background:transparent;border:none;border-bottom:1px solid rgba(240,234,224,.3);
  color:var(--marfim);font-family:var(--sans);font-size:1rem;padding:.55rem 0;
  transition:border-color .3s;
}
.form input:focus{outline:none;border-bottom-color:var(--ambar)}
.form .botao{justify-self:center;margin-top:.6rem}
.form-titulo{font-family:var(--serif);font-size:1.3rem;text-align:center}
.opcional{color:var(--marfim-fraco);font-family:var(--sans);font-size:.8rem}
.form-acoes{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap}
.form-fim{
  text-align:center;font-family:var(--serif);font-style:italic;
  font-size:1.3rem;color:var(--ambar);max-width:34rem;margin:0 auto;
}

/* ---- rodapé ---- */
.rodape{
  border-top:1px solid rgba(240,234,224,.1);
  padding:2.5rem clamp(1.5rem,8vw,6rem);text-align:center;
}
.rodape p:first-child{font-family:var(--serif);letter-spacing:.25em;font-size:.95rem}
.rodape-credito{color:var(--marfim-fraco);font-size:.85rem;margin-top:.6rem}
.rodape-legal{color:rgba(240,234,224,.35);font-size:.75rem;margin-top:.4rem}

/* ---- modal ---- */
.modal{
  position:fixed;inset:0;z-index:50;background:rgba(11,10,13,.92);
  display:grid;place-items:center;padding:1.5rem;
}
.modal-caixa{width:min(60rem,100%);aspect-ratio:16/9}
.modal-caixa iframe{width:100%;height:100%;border:0;border-radius:.4rem}
.modal-fechar{
  position:absolute;top:1rem;right:1.4rem;background:none;border:none;
  color:var(--marfim);font-size:2.4rem;cursor:pointer;line-height:1;
}

/* preço */
.medida-preco{
  font-family:var(--serif);font-weight:400;
  font-size:clamp(2rem,5vw,2.8rem);color:var(--marfim);
  margin-top:2.2rem;display:grid;gap:.3rem;
}
.medida-preco-nota{
  font-family:var(--sans);font-weight:300;font-size:.85rem;
  letter-spacing:.08em;color:var(--marfim-fraco);
}

/* a chama */
.luz-chama{
  font-family:var(--serif);font-style:italic;font-size:1.1rem;
  color:var(--ambar) !important;border-left:1px solid var(--ambar);
  padding-left:1rem;
}

/* para arquitetos */
.secao-arquitetos{background:var(--preto2);text-align:center}
.arquitetos-titulo{
  font-family:var(--serif);font-weight:300;
  font-size:clamp(1.9rem,4.5vw,2.8rem);
}
.arquitetos-apoio{color:var(--marfim-fraco);max-width:46ch;margin:1.2rem auto 2rem}
.arquitetos-acoes{margin-bottom:1.4rem}
.arquitetos-nota{color:rgba(240,234,224,.4);font-size:.85rem}

/* gesto com imagem */
.gesto-grade{
  display:grid;grid-template-columns:minmax(240px,420px) 1fr;
  gap:clamp(2rem,6vw,5rem);align-items:center;
  max-width:72rem;margin:0 auto;
}
.gesto-img{width:100%;border-radius:.4rem}
.gesto-grade .gesto-frase{text-align:left}
@media (max-width:760px){
  .gesto-grade{grid-template-columns:1fr}
  .gesto-grade .gesto-frase{text-align:center}
}

/* legenda da cena */
.luz-legenda{
  font-size:.72rem;letter-spacing:.1em;color:rgba(240,234,224,.35);
  margin-top:.6rem;
}

/* hero em vídeo */
.hero-video{
  position:absolute;inset:0;width:100%;height:100%;
  object-fit:cover;object-position:center;
}
@media (prefers-reduced-motion:reduce){
  .hero-video{display:none}
}

/* nota do gesto */
.gesto-nota{
  color:var(--marfim-fraco);font-size:.95rem;margin-top:1.2rem;text-align:left;
}
@media (max-width:760px){.gesto-nota{text-align:center}}