/* ==========================================================================
   MEMORIAL PARK ITAPEVA — página provisória (hero + contato + localização)
   Recorte do site definitivo (../site): mesma marca, paleta e tipografia,
   sem as demais páginas e sem o vídeo do hero (aqui só a imagem, estática).
   Zero JavaScript, zero build — só abrir o index.html no navegador.
   ========================================================================== */

@font-face{font-family:'Montserrat';font-style:normal;font-weight:300 700;font-display:swap;src:url('../fonts/montserrat-latin.woff2') format('woff2')}
@font-face{font-family:'Newsreader';font-style:normal;font-weight:400 700;font-display:swap;src:url('../fonts/newsreader-latin.woff2') format('woff2')}
@font-face{font-family:'Newsreader';font-style:italic;font-weight:400 600;font-display:swap;src:url('../fonts/newsreader-italic-latin.woff2') format('woff2')}

:root{
  --green-900:#0F4D3A;
  --green-700:#2E6B4F;
  --gold:#C4A962;
  --sand:#D9C79A;
  --green-950:#0A3628;
  --paper:#F7F3EA;
  --ink:#16261F;
  --ink-soft:#485950;
  --line:rgba(15,77,58,.2);
  --line-dark:rgba(217,199,154,.28);

  --font-serif:'Newsreader','Iowan Old Style','Palatino Linotype',Georgia,serif;
  --font-sans:'Montserrat',system-ui,-apple-system,'Segoe UI',sans-serif;

  --max:1280px;
  --margin:clamp(20px,5vw,72px);
  --s2:1rem;--s3:1.5rem;--s4:2rem;--s5:3rem;--s6:4.5rem;

  --r:10px;
  --r-btn:12px;
  --r-card:20px;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font:400 1.0625rem/1.7 var(--font-sans);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img,svg{display:block;max-width:100%}
h1,p,ul,address{margin:0}
ul{padding:0;list-style:none}
a{color:inherit}
address{font-style:normal}
:focus-visible{outline:3px solid var(--sand);outline-offset:3px;border-radius:2px}
::selection{background:var(--sand);color:var(--green-950)}
.icon{width:1.25rem;height:1.25rem;flex:none}
.container{width:100%;max-width:calc(var(--max) + var(--margin)*2);margin-inline:auto;padding-inline:var(--margin)}
.skip-link{position:absolute;left:var(--margin);top:-60px;z-index:100;background:var(--green-900);color:#fff;padding:.75rem 1rem;transition:top .2s}
.skip-link:focus{top:12px}

/* ---------- Tipografia ---------- */
.display{font-family:var(--font-serif);font-weight:400;color:#fff;text-wrap:balance;font-size:clamp(2.25rem,3.8vw,3.75rem);line-height:1.06;text-shadow:0 2px 28px rgba(6,32,24,.45)}
.display span,.display em{display:block}
.display em{font-style:italic;color:var(--sand)}
.h3{font-family:var(--font-serif);font-weight:500;font-size:clamp(1.375rem,2vw,1.625rem);line-height:1.25;letter-spacing:-.006em;color:var(--green-900)}
.label{display:inline-flex;align-items:center;gap:.9rem;font:600 .75rem/1.3 var(--font-sans);letter-spacing:.18em;text-transform:uppercase;color:var(--green-700)}
.small{font-size:.875rem;line-height:1.6;color:var(--ink-soft)}

/* ---------- Botões ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.7rem;min-height:3.25rem;padding:0 1.6rem;border:1px solid transparent;border-radius:var(--r-btn);font:600 .8125rem/1.2 var(--font-sans);letter-spacing:.11em;text-transform:uppercase;text-decoration:none;cursor:pointer;transition:background .25s,color .2s,border-color .2s,transform .25s,box-shadow .25s}
.btn--primary{background:linear-gradient(135deg,#348362 0%,#0F4D3A 100%);color:#fff;border-color:rgba(255,255,255,.16);box-shadow:0 12px 24px -16px rgba(15,77,58,.95),inset 0 1px 0 rgba(255,255,255,.2)}
.btn--primary:hover{background:linear-gradient(135deg,#3F9673 0%,#14624A 100%);transform:translateY(-2px)}
.btn--gold{background:linear-gradient(135deg,#DCC688 0%,#BE9F55 100%);color:var(--green-950);box-shadow:0 12px 24px -16px rgba(0,0,0,.6),inset 0 1px 0 rgba(255,255,255,.35)}
.btn--gold:hover{background:linear-gradient(135deg,#E6D3A0 0%,#C9AC63 100%);transform:translateY(-2px)}
.btn--outline{border-color:var(--green-900);color:var(--green-900)}
.btn--outline:hover{background:var(--green-900);color:#fff}

/* ---------- Cabeçalho: só a marca, sobre a foto ---------- */
.top{position:absolute;top:0;left:0;right:0;z-index:5;display:flex;justify-content:center;padding:var(--s3) var(--margin)}
.logo{display:inline-flex;flex:none;line-height:0}
.logo img{height:3.1rem;width:auto}
@media (max-width:520px){.logo img{height:2.5rem}}

/* ==========================================================================
   HERO — mesma composição do site definitivo (fachada + selo + título + CTA),
   mas em imagem estática: sem vídeo, sem scroll-scrub, sem JavaScript.
   ========================================================================== */
.hero{--hero-h:max(560px,100svh);position:relative;isolation:isolate;height:var(--hero-h);overflow:hidden;background:var(--green-950);color:#fff}
.hero__img{--dw:max(100vw,calc(var(--hero-h) * 1.778));--dh:max(calc(100vw / 1.778),var(--hero-h));position:absolute;inset:0;z-index:-2}
.hero__img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 46%}
.hero::before{content:'';position:absolute;inset:0 0 auto 0;height:200px;z-index:1;pointer-events:none;background:linear-gradient(180deg,rgba(6,32,24,.62),rgba(6,32,24,0))}
.hero::after{content:'';position:absolute;inset:auto 0 0 0;height:52%;z-index:-1;background:linear-gradient(0deg,rgba(6,32,24,.92),rgba(6,32,24,.62) 45%,rgba(6,32,24,0))}
.hero__copy{position:absolute;left:0;right:0;bottom:0;display:grid;justify-items:center;gap:var(--s3);padding:0 var(--margin) clamp(2rem,6vh,3.75rem);text-align:center}

/* Selo redondo de vidro: símbolo ao centro, texto em anel. Posição amarrada à
   quina da fachada (fração da imagem original: x=.7245, y=.2456), como no site definitivo. */
.seal{--ox:.5;--oy:.46;position:absolute;left:calc(50% + var(--dw) * .2245 - 2.8rem);top:calc(var(--hero-h) * .46 - var(--dh) * .2144 - 2.8rem);width:5.6rem;aspect-ratio:1;display:grid;place-items:center;border-radius:50%;background:rgba(10,54,40,.52);border:1px solid rgba(255,255,255,.24);-webkit-backdrop-filter:blur(14px) saturate(140%);backdrop-filter:blur(14px) saturate(140%);box-shadow:0 22px 40px -22px rgba(0,0,0,.75),inset 0 1px 0 rgba(255,255,255,.2)}
.seal__ring{position:absolute;inset:0;width:100%;height:100%}
.seal__ring text{font:700 11.6px var(--font-sans);fill:#fff}
.seal__mark{position:relative;width:2.3rem;height:auto;color:var(--gold)}
@media (prefers-reduced-motion:no-preference){.seal__ring{animation:seal-spin 48s linear infinite}}
@keyframes seal-spin{to{transform:rotate(360deg)}}

@media (max-width:1100px){
  .hero{height:100svh;display:flex;flex-direction:column}
  .hero::after{display:none}
  .hero__img{--box-h:min(60svh,44rem);--ox:.5;--seal:5.6rem;--dw:max(100vw,calc(var(--box-h) * 1.778));--dh:max(calc(100vw / 1.778),var(--box-h));position:relative;inset:auto;z-index:0;height:var(--box-h);flex:none}
  .seal{--cx:calc(var(--ox) * 100% + (.7245 - var(--ox)) * var(--dw));--cy:calc(50% + (.2456 - .5) * var(--dh));z-index:1;width:var(--seal);left:calc(min(var(--cx), 100% - var(--seal) / 2 - .5rem) - var(--seal) / 2);top:calc(max(var(--cy), var(--seal) / 2 + 4.75rem) - var(--seal) / 2)}
  .seal__mark{width:2rem}
  .hero__img::after{content:'';position:absolute;inset:auto 0 -1px 0;height:50%;background:linear-gradient(180deg,rgba(10,54,40,0),var(--green-950))}
  .hero__copy{position:relative;margin-top:-4rem;padding-bottom:var(--s5)}
}
@media (max-width:620px){.hero__img{--box-h:min(56svh,30rem)}.hero__img img{object-position:44% 50%}.seal{--seal:4.75rem}}
@media (prefers-reduced-motion:reduce){.hero{height:auto}.hero__img{position:relative;height:min(80svh,50rem)}.hero__copy{position:relative;margin-top:-4rem;padding-bottom:var(--s5)}}

/* dois botões (WhatsApp + endereço), lado a lado e centralizados; empilha se não couber */
.hero__actions{display:flex;flex-wrap:wrap;justify-content:center;gap:.9rem;pointer-events:auto}
.hero__actions .btn{max-width:100%}
@media (max-width:480px){.hero__actions{flex-direction:column;align-items:stretch}}

/* crédito discreto no canto, sem acrescentar altura à página (a página é só o hero) */
.credit-tag{position:fixed;right:.9rem;bottom:.7rem;z-index:6;margin:0;font:500 .6875rem/1 var(--font-sans);letter-spacing:.02em}
.credit-tag a{color:rgba(255,255,255,.65);text-decoration:none}
.credit-tag a:hover{color:#fff}