/* Camada final de acabamento: materiais de vidro, molas e ótica tipográfica. */
:root{
  --ease-spring:cubic-bezier(.32,.72,0,1);
  --ease-press:cubic-bezier(.2,.8,.2,1);
  --radius-card:22px;--radius-photo:20px;
  --glass-tint:rgba(20,17,15,.52);--glass-tint-strong:rgba(20,17,15,.78);
  --glass-rim:rgba(230,211,184,.18);
  --glass-shadow:inset 0 1px 0 rgba(255,255,255,.10),inset 0 0 0 .5px rgba(255,255,255,.05),0 10px 34px rgba(0,0,0,.24);
  --card-shadow:0 1px 2px rgba(42,36,32,.05),0 14px 40px -12px rgba(42,36,32,.16);
  --card-shadow-hover:0 2px 4px rgba(42,36,32,.06),0 26px 60px -18px rgba(42,36,32,.28);
}
html{scroll-padding-top:110px}
body{text-rendering:optimizeLegibility}

/* Menu flutuante de vidro, igual em todas as páginas. */
nav.top{position:fixed;top:16px;left:50%;right:auto;transform:translateX(-50%);width:calc(100% - 48px);max-width:1320px;z-index:60;border-radius:999px;background:var(--glass-tint);-webkit-backdrop-filter:blur(24px) saturate(170%);backdrop-filter:blur(24px) saturate(170%);border:1px solid var(--glass-rim);box-shadow:var(--glass-shadow);transition:background .35s var(--ease-out),box-shadow .35s var(--ease-out),border-color .35s var(--ease-out)}
nav.top.is-scrolled{background:var(--glass-tint-strong);border-color:rgba(230,211,184,.24);box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 14px 40px rgba(0,0,0,.32)}
nav.top .wrap{height:64px;max-width:none;padding:0 9px 0 26px;transition:height .35s var(--ease-spring)}
nav.top.is-scrolled .wrap{height:58px}
nav.top img{height:34px;transition:height .35s var(--ease-spring)}
nav.top.is-scrolled img{height:30px}
nav.top ul{gap:30px;font-size:13px;letter-spacing:.01em}
nav.top li a{display:inline-flex;align-items:center;min-height:44px;color:rgba(243,233,218,.86)}
nav.top li a:hover,nav.top a[aria-current=page]{color:var(--marfim)}
nav.top li a::after{bottom:9px;height:1.5px;border-radius:2px;transition:transform .45s var(--ease-spring)}
nav.top .wrap>.btn{margin:0;min-height:46px;padding:11px 22px;border:0;background:var(--cobre);color:var(--noite);font-size:13px;box-shadow:inset 0 1px 0 rgba(255,255,255,.28)}
nav.top .wrap>.btn:hover{background:var(--cobre-claro);transform:none}
.scroll-progress{height:2px;opacity:.9}
.skip{z-index:120}

/* Respostas ao toque: reação imediata, sem atraso. */
.btn{transition:background .25s var(--ease-out),transform .45s var(--ease-spring),box-shadow .25s var(--ease-out)}
.btn:active,nav.top .wrap>.btn:active{transform:scale(.965);transition-duration:.12s}
.btn.cheio{box-shadow:inset 0 1px 0 rgba(255,255,255,.25),0 8px 22px -10px rgba(196,122,78,.7)}
.btn.claro{-webkit-backdrop-filter:blur(14px) saturate(160%);backdrop-filter:blur(14px) saturate(160%);background:rgba(243,233,218,.06)}

/* Ótica tipográfica: títulos apertados, textos com respiro. */
h1,h2{text-wrap:balance}
p{text-wrap:pretty}
h2{letter-spacing:-.018em}
h3{letter-spacing:-.008em}
.rot{letter-spacing:.2em}

/* Cards e fotos com cantos contínuos e profundidade suave. */
.ev,.mosaico a,.amb,.guia img,.instagram-post,.photo-reveal,.location>img,.form{border-radius:var(--radius-card)}
.ev,.mosaico a,.photo-reveal,.instagram-post{isolation:isolate}
.amb{box-shadow:var(--card-shadow);transition:transform .6s var(--ease-spring),box-shadow .6s var(--ease-spring)}
.ev,.mosaico a,.instagram-post{transition:transform .6s var(--ease-spring),box-shadow .6s var(--ease-spring)}
.guia img{box-shadow:var(--card-shadow);transition:transform .6s var(--ease-spring),box-shadow .6s var(--ease-spring)}
.ev img,.mosaico img,.amb img{transition:transform .9s var(--ease-spring)}
@media(hover:hover) and (pointer:fine){
  .ev:hover,.mosaico a:hover,.instagram-post:hover{transform:translateY(-4px);box-shadow:0 26px 50px -22px rgba(20,17,15,.55)}
  .amb:hover{transform:translateY(-4px);box-shadow:var(--card-shadow-hover)}
  .guia:hover img{transform:translateY(-4px);box-shadow:var(--card-shadow-hover)}
}
.ev:active,.mosaico a:active,.amb:active,.instagram-post:active{transform:scale(.985);transition-duration:.15s}

/* Entrada das fotos no scroll: mesmo ritmo calmo dos textos, com a imagem assentando por dentro. */
.reveal-ready:is(.ev,.mosaico>a,.amb,.guia,.food-story,.event-story){opacity:0;transform:translateY(40px) scale(.975);transition:opacity 1.2s var(--ease-out) var(--reveal-delay,0ms),transform 1.5s var(--ease-spring) var(--reveal-delay,0ms),box-shadow .6s var(--ease-spring)}
.reveal-ready:is(.ev,.mosaico>a) img,.reveal-ready:is(.food-story,.event-story) .photo-reveal img{transform:scale(1.1);transition:transform 1.9s var(--ease-spring) var(--reveal-delay,0ms)}
.reveal-ready.in-view:is(.ev,.mosaico>a,.amb,.guia,.food-story,.event-story){opacity:1;transform:none}
.reveal-ready.in-view:is(.ev,.mosaico>a) img,.reveal-ready.in-view:is(.food-story,.event-story) .photo-reveal img{transform:none}
@media(hover:hover) and (pointer:fine){
  .reveal-ready.in-view:is(.ev,.mosaico>a):hover{transform:translateY(-4px);transition-delay:0ms}
  .reveal-ready.in-view.amb:hover{transform:translateY(-4px);transition-delay:0ms}
  .reveal-ready.in-view.guia:hover img{transform:translateY(-4px);transition-delay:0ms}
  .reveal-ready.in-view:is(.ev,.mosaico>a):hover img,.reveal-ready.in-view:is(.food-story,.event-story) .photo-reveal:hover img{transform:scale(1.04);transition-delay:0ms}
}

/* Eventos: o casal aparece inteiro no topo. */
.inner-hero-image[src="img/valsa.jpg"]{object-position:50% 8%}

/* Legenda de vidro nos eventos. */
.ev div{left:12px;right:12px;bottom:12px;padding:14px 16px;border-radius:16px;background:rgba(20,17,15,.34);-webkit-backdrop-filter:blur(16px) saturate(160%);backdrop-filter:blur(16px) saturate(160%);box-shadow:inset 0 1px 0 rgba(255,255,255,.12),inset 0 0 0 .5px rgba(255,255,255,.08)}
.ev h3{font-size:28px;line-height:1.1;letter-spacing:-.01em}

/* Instagram: legendas curtas, sem invadir a foto. */
.instagram-post>span{gap:8px;padding:22px;background:linear-gradient(0deg,rgba(20,17,15,.92) 0%,rgba(20,17,15,.55) 42%,transparent 72%)}
.instagram-post b{font:italic 400 21px/1.22 var(--serif);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;letter-spacing:-.005em}
.instagram-post small{color:var(--champanhe)}
.instagram-controls button{transition:background .25s var(--ease-out),transform .45s var(--ease-spring)}
.instagram-controls button:active{transform:scale(.92)}

/* Formulário em superfície elevada. */
.form{box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 30px 70px -30px rgba(0,0,0,.6);border:1px solid rgba(230,211,184,.08)}
.form .chips label{transition:transform .35s var(--ease-spring)}
.form .chips label:active{transform:scale(.95)}

/* Diálogos como folhas: cantos amplos e fundo desfocado. */
dialog{border-radius:28px}
dialog::backdrop{background:rgba(8,7,6,.62);-webkit-backdrop-filter:blur(18px) saturate(140%);backdrop-filter:blur(18px) saturate(140%)}
dialog[open]{animation:sheet-in .5s var(--ease-spring)}
@keyframes sheet-in{from{opacity:0;transform:translateY(18px) scale(.98)}to{opacity:1;transform:none}}

@media(min-width:801px) and (max-width:1100px){
  nav.top{width:calc(100% - 32px)}
  nav.top .wrap{padding-left:20px}
  nav.top ul{gap:16px;font-size:12px}
  nav.top img{height:28px}
  nav.top .wrap>.btn{padding:10px 16px;font-size:12px}
}

/* Celular: a pílula abre um cartão de vidro logo abaixo. */
@media(max-width:800px){
  html{scroll-padding-top:90px}
  nav.top{top:10px;width:calc(100% - 20px)}
  nav.top .wrap{height:58px;padding:0 8px 0 20px}
  nav.top.is-scrolled .wrap{height:56px}
  nav.top img,nav.top.is-scrolled img{height:30px}
  nav.top .menu{display:inline-flex!important;align-items:center;gap:10px;min-height:44px;padding:0 18px;border:1px solid rgba(243,233,218,.22);border-radius:999px;background:rgba(243,233,218,.06);color:var(--marfim);font-size:12px;letter-spacing:.14em;transition:background .25s var(--ease-out),transform .45s var(--ease-spring)}
  nav.top .menu:active{transform:scale(.94)}
  nav.top .menu span{font-size:0;display:inline-grid;place-items:center;width:14px}
  nav.top .menu span::before{content:'☰';font-size:15px;line-height:1}
  nav.top .menu[aria-expanded=true]{background:rgba(243,233,218,.14)}
  nav.top .menu[aria-expanded=true] span::before{content:'✕';font-size:13px}
  nav.top ul{inset:auto;top:calc(100% + 10px);left:0;right:0;position:absolute;padding:10px;gap:2px;border-radius:26px;background:rgba(20,17,15,.9);-webkit-backdrop-filter:blur(30px) saturate(170%);backdrop-filter:blur(30px) saturate(170%);border:1px solid var(--glass-rim);box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 24px 60px rgba(0,0,0,.45);max-height:calc(100svh - 100px);overflow:auto;transform-origin:top center}
  nav.top ul.open{animation:menu-in .45s var(--ease-spring)}
  nav.top ul a{display:flex;padding:14px 16px;border-radius:16px;font-size:17px;color:var(--marfim)}
  nav.top ul a:active{background:rgba(243,233,218,.08)}
  nav.top ul a[aria-current=page]{background:rgba(217,153,111,.14);color:var(--cobre-claro)}
  nav.top li a::after{display:none}
  .ev div{left:8px;right:8px;bottom:8px;padding:11px 12px;border-radius:13px}
  .ev h3{font-size:22px}
  .ev,.mosaico a,.amb,.guia img,.instagram-post,.photo-reveal,.location>img,.form{border-radius:18px}
  dialog{border-radius:24px}
}
@keyframes menu-in{from{opacity:0;transform:translateY(-8px) scale(.97)}to{opacity:1;transform:none}}

/* Acessibilidade: movimento, transparência e contraste. */
@media(prefers-reduced-motion:reduce){
  nav.top,nav.top .wrap,nav.top img,.btn,.ev,.mosaico a,.amb,.guia img,.instagram-post,.ev img,.mosaico img,.amb img{transition:opacity .2s linear!important}
  nav.top ul.open,dialog[open]{animation:none}
  .ev:hover,.mosaico a:hover,.amb:hover,.instagram-post:hover,.guia:hover img{transform:none}
}
@media(prefers-reduced-transparency:reduce){
  nav.top,nav.top ul,.ev div,.btn.claro{background:#14110f;-webkit-backdrop-filter:none;backdrop-filter:none}
}
@media(prefers-contrast:more){
  nav.top,nav.top ul{border-color:var(--marfim)}
}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  nav.top{background:rgba(20,17,15,.94)}
  .ev div{background:rgba(20,17,15,.7)}
}
@media(forced-colors:active){
  nav.top,nav.top ul{background:Canvas;border-color:CanvasText;backdrop-filter:none}
}