/* Brisamare Ubatuba — coastal editorial
   Display: Fraunces · Texto: Jost */

:root{
  --sand:#F7F2E9;
  --sand-2:#EFE7DA;
  --ink:#12212B;
  --deep:#0B2B3C;        /* azul-marinho: cor pedida pela Flávia */
  --sea:#1C5470;
  --coral:#C35131;
  --coral-claro:#D2694B;   /* só para detalhe decorativo, nunca atrás de texto */
  --brass:#B98F52;
  --line:rgba(18,33,43,.16);
  --line-soft:rgba(18,33,43,.08);
  --shadow:0 30px 60px -30px rgba(11,43,60,.45);
  --maxw:1240px;
  --r:2px;
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--sand);color:var(--ink);
  font-family:"Jost",-apple-system,BlinkMacSystemFont,sans-serif;
  font-size:clamp(17px,.6vw + 15.2px,19px);line-height:1.72;font-weight:380;
  letter-spacing:.005em;overflow-x:hidden;
}
body::before{
  content:"";position:fixed;inset:0;z-index:9999;pointer-events:none;opacity:.045;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
img{max-width:100%;display:block}
a{color:inherit}
h1,h2,h3,h4{font-family:"Fraunces",Georgia,serif;font-weight:400;line-height:1.05;letter-spacing:-.02em;margin:0}
h1{font-size:clamp(2.05rem,6.4vw,5.4rem);font-variation-settings:"SOFT" 0,"WONK" 1,"opsz" 144}
h2{font-size:clamp(1.75rem,4vw,3.4rem);font-variation-settings:"SOFT" 0,"WONK" 1,"opsz" 72}
h3{font-size:clamp(1.35rem,1.8vw,1.75rem)}
p{margin:0 0 1.1em}
em{font-style:italic;font-variation-settings:"WONK" 1}

.wrap{width:min(100% - 2.6rem,var(--maxw));margin-inline:auto}
.wrap-narrow{width:min(100% - 2.6rem,760px);margin-inline:auto}
.eyebrow{
  font-size:.8rem;letter-spacing:.18em;text-transform:uppercase;font-weight:500;
  color:var(--sea);display:flex;align-items:center;gap:.8rem;margin:0 0 1.3rem
}
.eyebrow::before{content:"";width:2.4rem;height:1px;background:var(--brass)}
.lead{font-size:1.18em;color:rgba(18,33,43,.88)}
section{padding:clamp(4rem,9vw,8rem) 0}

/* ---------- header ---------- */
.hdr{
  position:fixed;top:0;left:0;right:0;z-index:100;
  display:flex;align-items:center;justify-content:space-between;gap:1rem;
  padding:1.15rem clamp(1.3rem,4vw,3rem);
  transition:background .45s ease,backdrop-filter .45s ease,padding .45s ease,box-shadow .45s;
}
.hdr.solid{background:rgba(247,242,233,.93);backdrop-filter:blur(14px);padding-block:.75rem;box-shadow:0 1px 0 var(--line-soft)}
.brand{font-family:"Fraunces",serif;font-size:1.28rem;letter-spacing:.16em;text-transform:uppercase;text-decoration:none;line-height:1;font-variation-settings:"WONK" 1}
.brand small{display:block;font-family:"Jost",sans-serif;font-size:.55rem;letter-spacing:.42em;opacity:.6;margin-top:.35rem;text-transform:uppercase}
.nav{display:flex;align-items:center;gap:clamp(1rem,2.2vw,2.1rem)}
.nav a{font-size:.9rem;letter-spacing:.04em;text-decoration:none;opacity:1;position:relative;padding-block:.2rem}
.nav a::after{content:"";position:absolute;left:0;bottom:0;height:1px;width:0;background:var(--coral);transition:width .35s cubic-bezier(.2,.8,.2,1)}
.nav a:hover::after{width:100%}
.hdr.over-hero:not(.solid){color:var(--sand)}
.hdr.over-hero:not(.solid) .btn-ghost{border-color:rgba(247,242,233,.5);color:var(--sand)}
.menu-btn{display:none;background:none;border:0;font:inherit;cursor:pointer;letter-spacing:.14em;font-size:.78rem;text-transform:uppercase}

.btn{
  display:inline-flex;align-items:center;gap:.6rem;text-decoration:none;cursor:pointer;
  font-size:.88rem;letter-spacing:.1em;text-transform:uppercase;font-weight:500;
  padding:1rem 1.8rem;border:1px solid transparent;border-radius:var(--r);
  background:var(--coral);color:#fff;transition:transform .3s cubic-bezier(.2,.8,.2,1),background .3s,box-shadow .3s;
}
.btn:hover{background:#a8442a;transform:translateY(-2px);box-shadow:0 14px 28px -14px rgba(210,105,75,.8)}
.btn-ghost{background:none;border-color:var(--line);color:var(--ink)}
.btn-ghost:hover{background:var(--ink);color:var(--sand);border-color:var(--ink);box-shadow:none}
.btn-sm{padding:.75rem 1.25rem;font-size:.8rem}

/* ---------- hero ---------- */
.hero{position:relative;min-height:100svh;display:flex;flex-direction:column;justify-content:flex-end;color:var(--sand);overflow:hidden}
.hero-media{position:absolute;inset:0;z-index:0}
.hero-media img{width:100%;height:100%;object-fit:cover;animation:kb 24s ease-out forwards}
@keyframes kb{from{transform:scale(1.1)}to{transform:scale(1)}}
.hero::before{
  content:"";position:absolute;inset:0;z-index:1;
  background:linear-gradient(100deg,rgba(11,43,60,.62) 0%,rgba(11,43,60,.28) 42%,transparent 66%);
}
.hero::after{
  content:"";position:absolute;inset:0;z-index:1;
  background:linear-gradient(180deg,rgba(11,43,60,.55) 0%,rgba(11,43,60,.15) 32%,rgba(11,43,60,.72) 78%,rgba(11,43,60,.92) 100%);
}
.hero-inner{position:relative;z-index:2;width:min(100% - 2.6rem,var(--maxw));margin-inline:auto;padding-block:clamp(3rem,9vh,7rem)}
.hero h1{max-width:16ch;overflow-wrap:break-word}
.hero h1 .it{display:block;font-style:italic;color:var(--sand);opacity:.92}
.hero .eyebrow{color:rgba(247,242,233,.82)}
.hero .eyebrow::before{background:rgba(247,242,233,.6)}
.hero-sub{max-width:46ch;font-size:1.12rem;color:rgba(247,242,233,.96);margin:1.6rem 0 2.2rem}
.hero-cta{display:flex;flex-wrap:wrap;gap:.9rem;align-items:center}
.hero-cta .btn-ghost{border-color:rgba(247,242,233,.45);color:var(--sand)}
.hero-cta .btn-ghost:hover{background:var(--sand);color:var(--ink)}
.hero-facts{
  position:relative;z-index:2;border-top:1px solid rgba(247,242,233,.22);
  display:grid;grid-template-columns:repeat(4,1fr);
}
.hero-facts div{padding:1.4rem 0}
.hero-facts b{font-family:"Fraunces",serif;font-size:1.5rem;font-weight:400;display:block;line-height:1}
.hero-facts span{font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;opacity:.85}
.reveal{opacity:0;transform:translateY(22px);animation:up .95s cubic-bezier(.16,1,.3,1) forwards}
@keyframes up{to{opacity:1;transform:none}}
.d1{animation-delay:.1s}.d2{animation-delay:.25s}.d3{animation-delay:.4s}.d4{animation-delay:.55s}.d5{animation-delay:.7s}

/* ---------- selo / rating ---------- */
.stars{color:var(--brass);letter-spacing:.12em}
.badge{
  display:inline-flex;align-items:center;gap:.55rem;font-size:.76rem;letter-spacing:.16em;
  text-transform:uppercase;border:1px solid currentColor;padding:.42rem .85rem;border-radius:99px;opacity:.9
}

/* ---------- blocos ---------- */
.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,5vw,5rem);align-items:center}
.split.rev>*:first-child{order:2}
.stack-img{position:relative}
.stack-img img{aspect-ratio:4/5;object-fit:cover;box-shadow:var(--shadow)}
.stack-img .float{
  position:absolute;right:-8%;bottom:-8%;width:52%;aspect-ratio:1;object-fit:cover;
  border:8px solid var(--sand);box-shadow:var(--shadow)
}
.reasons{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(1.4rem,3vw,3rem);counter-reset:r}
.reason{border-top:1px solid var(--line);padding-top:1.4rem}
.reason::before{
  counter-increment:r;content:"0" counter(r);font-family:"Fraunces",serif;font-size:.9rem;
  color:var(--brass);display:block;margin-bottom:.9rem;letter-spacing:.1em
}
.reason h3{margin-bottom:.5rem;font-size:1.28rem}
.reason p{font-size:1rem;color:rgba(18,33,43,.86);margin:0}

.dark{background:var(--deep);color:var(--sand)}
.dark .eyebrow{color:var(--brass)}
.dark .lead,.dark p{color:rgba(247,242,233,.92)}
.dark .reason{border-color:rgba(247,242,233,.2)}
.dark .reason p{color:rgba(247,242,233,.88)}

/* ---------- cards imóveis ---------- */
.cards{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(1.6rem,3vw,2.6rem)}
.card{background:var(--sand);border:1px solid var(--line-soft);display:flex;flex-direction:column;overflow:hidden;transition:transform .5s cubic-bezier(.16,1,.3,1),box-shadow .5s}
.card:hover{transform:translateY(-6px);box-shadow:var(--shadow)}
.card-media{position:relative;overflow:hidden;aspect-ratio:3/2}
.card-media img{width:100%;height:100%;object-fit:cover;transition:transform 1.1s cubic-bezier(.16,1,.3,1)}
.card:hover .card-media img{transform:scale(1.06)}
.card-media .tag{position:absolute;left:1rem;top:1rem;background:rgba(11,43,60,.9);color:var(--sand);font-size:.78rem;letter-spacing:.1em;text-transform:uppercase;padding:.42rem .8rem;backdrop-filter:blur(6px)}
.card-body{padding:clamp(1.4rem,2.4vw,2.2rem);display:flex;flex-direction:column;gap:.9rem;flex:1}
.specs{display:flex;flex-wrap:wrap;gap:.5rem;list-style:none;padding:0;margin:0}
.specs li{font-size:.86rem;letter-spacing:.02em;border:1px solid var(--line);padding:.35rem .75rem;color:rgba(18,33,43,.88)}
.card .btn{margin-top:auto;align-self:flex-start}

/* ---------- galeria ---------- */
.gal{display:grid;grid-template-columns:repeat(12,1fr);gap:.7rem}
.gal figure{margin:0;overflow:hidden;position:relative;cursor:zoom-in;background:var(--sand-2)}
.gal img{width:100%;height:100%;object-fit:cover;transition:transform 1s cubic-bezier(.16,1,.3,1)}
.gal figure:hover img{transform:scale(1.05)}
.gal figure::after{
  content:attr(data-cap);position:absolute;left:0;right:0;bottom:0;padding:2.6rem .9rem .9rem;
  font-size:.85rem;line-height:1.4;color:var(--sand);opacity:0;transition:opacity .4s;
  background:linear-gradient(180deg,transparent,rgba(11,43,60,.88))
}
.gal figure:hover::after{opacity:1}
.g-a{grid-column:span 7;aspect-ratio:4/3}
.g-b{grid-column:span 5;aspect-ratio:1}
.g-c{grid-column:span 4;aspect-ratio:3/4}
.g-d{grid-column:span 8;aspect-ratio:16/10}
.g-e{grid-column:span 6;aspect-ratio:3/2}
.g-f{grid-column:span 3;aspect-ratio:1}

/* lightbox */
.lb{position:fixed;inset:0;z-index:200;background:rgba(8,24,23,.96);display:none;place-items:center;padding:clamp(1rem,4vw,3rem)}
.lb.on{display:grid}
.lb img{max-height:82svh;max-width:100%;object-fit:contain;box-shadow:0 40px 80px -40px #000}
.lb figcaption{color:rgba(247,242,233,.92);font-size:.95rem;max-width:70ch;margin-top:1rem;text-align:center}
.lb button{position:absolute;background:none;border:1px solid rgba(247,242,233,.35);color:var(--sand);width:3rem;height:3rem;cursor:pointer;font-size:1.1rem;border-radius:99px;transition:background .3s}
.lb button:hover{background:rgba(247,242,233,.15)}
.lb .x{top:1.4rem;right:1.4rem}
.lb .prev{left:1.4rem;top:50%}
.lb .next{right:1.4rem;top:50%}

/* ---------- comodidades ---------- */
.amn{display:grid;grid-template-columns:repeat(auto-fit,minmax(215px,1fr));gap:clamp(1.6rem,3vw,2.8rem)}
.amn h3{font-size:1rem;font-family:"Jost",sans-serif;letter-spacing:.2em;text-transform:uppercase;font-weight:500;margin-bottom:1rem;color:var(--sea)}
.dark .amn h3{color:var(--brass)}
.amn ul{list-style:none;margin:0;padding:0;font-size:.94rem}
.amn li{padding:.42rem 0;border-bottom:1px solid var(--line-soft);display:flex;gap:.6rem}
.dark .amn li{border-color:rgba(247,242,233,.14)}
.amn li::before{content:"—";color:var(--brass);flex:none}

/* ---------- por perto ---------- */
.near{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.near li{display:flex;justify-content:space-between;gap:.35rem 1.4rem;align-items:baseline;padding:1.05rem 0;border-bottom:1px solid var(--line);flex-wrap:wrap}
.near b{font-weight:400;font-size:1.1rem;min-width:0}
.near span{font-size:.86rem;letter-spacing:.08em;text-transform:uppercase;color:var(--sea);text-align:right;min-width:0}
.dark .near,.dark .near li{border-color:rgba(247,242,233,.18)}
.dark .near span{color:var(--brass)}

/* ---------- avaliações ---------- */
.rates{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:1.4rem;margin-top:2.4rem}
.rate{border-top:1px solid rgba(247,242,233,.22);padding-top:1rem}
.rate b{font-family:"Fraunces",serif;font-size:2rem;font-weight:400;display:block;line-height:1}
.rate span{font-size:.8rem;letter-spacing:.1em;text-transform:uppercase;opacity:.88}
.quotes{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(1.4rem,3vw,2.6rem);margin-top:3rem}
.quote{font-family:"Fraunces",serif;font-size:1.5rem;font-style:italic;line-height:1.25;position:relative;padding-top:2.4rem}
.quote::before{content:"“";position:absolute;top:-.6rem;left:0;font-size:4rem;color:var(--brass);opacity:.7}
.quote small{display:block;font-family:"Jost",sans-serif;font-style:normal;font-size:.8rem;letter-spacing:.1em;text-transform:uppercase;opacity:.85;margin-top:1rem}

/* ---------- form ---------- */
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,5vw,5rem);align-items:start}
form{display:grid;gap:1.05rem}
.f2{display:grid;grid-template-columns:1fr 1fr;gap:1.05rem}
label{display:block;font-size:.8rem;letter-spacing:.1em;text-transform:uppercase;margin-bottom:.5rem;opacity:.9}
input,select,textarea{
  width:100%;font:inherit;font-size:1.05rem;color:inherit;background:transparent;
  border:0;border-bottom:1px solid rgba(247,242,233,.32);padding:.62rem 0;border-radius:0;
  transition:border-color .3s;-webkit-appearance:none;appearance:none;
}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--coral)}
select option{color:#12212B}
input::placeholder,textarea::placeholder{color:rgba(247,242,233,.4)}
.field-err input,.field-err select{border-color:#E4886F}
.err{display:none;font-size:.76rem;color:#E4886F;margin-top:.4rem}
.field-err .err{display:block}
.consent{font-size:.86rem;opacity:.85;line-height:1.55}
.consent a{color:var(--brass)}
form .btn{justify-content:center;width:100%;padding-block:1.1rem}
.form-ok{display:none;border:1px solid var(--brass);padding:1.1rem;font-size:.9rem;line-height:1.5}
.form-ok.on{display:block}

/* ---------- faq ---------- */
.faq details{border-bottom:1px solid var(--line);padding:1.25rem 0}
.faq summary{
  cursor:pointer;list-style:none;font-family:"Fraunces",serif;font-size:clamp(1.1rem,1.5vw,1.35rem);
  display:flex;justify-content:space-between;gap:2rem;align-items:baseline
}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";color:var(--brass);font-size:1.3rem;transition:transform .3s}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq p{margin:1rem 0 0;color:rgba(18,33,43,.88);max-width:74ch}

/* ---------- artigo ---------- */
.article h2{margin:2.6rem 0 1rem}
.article h3{margin:2rem 0 .7rem}
.article ul,.article ol{margin:0 0 1.3em;padding-left:1.2rem}
.article li{margin-bottom:.5em}
.article figure{margin:2.4rem 0}
.article figcaption{font-size:.8rem;opacity:.6;margin-top:.6rem}
.article blockquote{margin:2rem 0;padding-left:1.4rem;border-left:2px solid var(--brass);font-family:"Fraunces",serif;font-size:1.25rem;font-style:italic}
.post-hero{aspect-ratio:21/9;object-fit:cover;width:100%;margin-bottom:2.4rem}
.meta{font-size:.82rem;letter-spacing:.1em;text-transform:uppercase;opacity:.8;margin-bottom:1.2rem}
.post-list{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(1.6rem,3vw,2.6rem)}
.post-card{text-decoration:none;display:flex;flex-direction:column;gap:.9rem}
.post-card img{aspect-ratio:3/2;object-fit:cover;transition:transform 1s cubic-bezier(.16,1,.3,1)}
.post-card:hover img{transform:scale(1.04)}
.post-card h3{font-size:1.3rem}
.post-card p{font-size:1rem;color:rgba(18,33,43,.86);margin:0}

/* ---------- mapa ---------- */
.map{position:relative;aspect-ratio:16/9;background:var(--sand-2);overflow:hidden;border:1px solid var(--line)}
.map iframe{width:100%;height:100%;border:0;filter:saturate(.75) contrast(1.02)}

/* ---------- rodapé ---------- */
.ft{background:var(--deep);color:rgba(247,242,233,.9);padding:clamp(3.4rem,7vw,6rem) 0 2.4rem}
.ft-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:clamp(2rem,5vw,4rem)}
.ft a{text-decoration:none;opacity:.8}
.ft a:hover{opacity:1;color:var(--brass)}
.ft h4{font-family:"Jost",sans-serif;font-size:.8rem;letter-spacing:.14em;text-transform:uppercase;color:var(--brass);margin-bottom:1.1rem}
.ft ul{list-style:none;margin:0;padding:0;font-size:1rem;display:grid;gap:.55rem}
.ft .brand{color:var(--sand)}
.ft-btm{margin-top:3.4rem;padding-top:1.6rem;border-top:1px solid rgba(247,242,233,.16);display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;font-size:.86rem;opacity:.8}

/* ---------- whatsapp flutuante ---------- */
.wa{
  position:fixed;right:1.4rem;bottom:1.4rem;z-index:90;
  display:inline-flex;align-items:center;gap:.6rem;text-decoration:none;
  padding:.9rem 1.25rem;border-radius:99px;
  background:var(--deep);color:var(--sand);border:1px solid rgba(185,143,82,.45);
  font-size:.82rem;letter-spacing:.08em;text-transform:uppercase;font-weight:500;
  box-shadow:0 18px 34px -14px rgba(11,43,60,.75);
  transition:transform .3s cubic-bezier(.2,.8,.2,1),background .3s
}
.wa:hover{transform:translateY(-2px);background:var(--sea)}
.wa svg{width:1.15rem;height:1.15rem;fill:currentColor;flex:none}

@media (max-width:900px){
  .split,.form-grid{grid-template-columns:1fr}
  .split.rev>*:first-child{order:0}
  .reasons,.quotes,.post-list{grid-template-columns:1fr}
  .cards{grid-template-columns:1fr}
  .hero-facts{grid-template-columns:repeat(2,1fr)}
  .hero-facts div{padding:1rem 0}
  .nav{display:none}
  .nav.open{display:flex;position:fixed;inset:0;background:var(--deep);flex-direction:column;justify-content:center;align-items:center;gap:2rem;color:var(--sand)}
  .nav.open a{font-size:1.3rem;font-family:"Fraunces",serif;letter-spacing:0}
  .nav.open .btn{background:var(--coral);color:#fff}
  .menu-btn{display:block;z-index:101}
  .gal>*{grid-column:span 6 !important;aspect-ratio:4/3 !important}
  .ft-grid{grid-template-columns:1fr;gap:2.4rem}
  .amn{grid-template-columns:1fr}
  .stack-img .float{display:none}
  .f2{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){
  *{animation:none !important;transition:none !important}
  .reveal{opacity:1;transform:none}
}

/* ---------- guia do hóspede ---------- */
.lugares{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(1.4rem,2.6vw,2.4rem)}
.lugar{position:relative;border-top:1px solid var(--line);padding:1.6rem 0 0}
.dark .lugar{border-color:rgba(247,242,233,.22)}
.lugar-n{
  position:absolute;top:1.5rem;right:0;font-family:"Fraunces",serif;font-size:.82rem;
  color:#fff;background:var(--coral);width:1.6rem;height:1.6rem;border-radius:99px;
  display:grid;place-items:center;line-height:1
}
.lugar h3{font-size:1.2rem;margin-bottom:.5rem;padding-right:2rem}
.lugar p{font-size:1rem;color:rgba(18,33,43,.86);margin:0 0 .55rem}
.dark .lugar p{color:rgba(247,242,233,.72)}
.lugar-end{font-size:.9rem !important;opacity:.85}
.lugar-dist{
  font-size:.8rem !important;letter-spacing:.09em;text-transform:uppercase;
  color:var(--sea) !important;margin-bottom:.9rem !important
}
.dark .lugar-dist{color:var(--brass) !important}
.lugar-hor{font-size:.9rem !important;font-style:italic;opacity:.85}
.lugar a{font-size:.84rem;letter-spacing:.08em;text-transform:uppercase;text-decoration:none;
  border-bottom:1px solid var(--brass);padding-bottom:.15rem}
.lugar a:hover{color:var(--coral);border-color:var(--coral)}

.praias-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(1.8rem,3.4vw,3rem)}
.praia-card img{aspect-ratio:16/10;object-fit:cover;margin-bottom:1.2rem}
.praia-card h3{font-size:1.45rem;margin-bottom:.4rem}
.praia-card p{font-size:1.02rem;color:rgba(18,33,43,.88);margin:0 0 .6rem}
.foto-cred{font-size:.8rem !important;opacity:.75;margin-top:.6rem !important}
.foto-cred a{color:inherit}
@media (max-width:900px){
  .lugares,.praias-grid{grid-template-columns:1fr}
}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

/* ---------- barra de ação no celular ---------- */
.barra-mob{display:none}
@media (max-width:900px){
  .near li{flex-direction:column;align-items:flex-start;gap:.3rem}
  .near span{text-align:left}
  .wa{display:none}
  .barra-mob{
    display:flex;position:fixed;left:0;right:0;bottom:0;z-index:95;gap:.6rem;
    padding:.7rem .8rem calc(.7rem + env(safe-area-inset-bottom));
    background:rgba(11,43,60,.96);backdrop-filter:blur(12px);
    border-top:1px solid rgba(247,242,233,.16);
    transform:translateY(110%);transition:transform .35s cubic-bezier(.2,.8,.2,1)
  }
  .barra-mob.on{transform:none}
  .barra-mob .btn{flex:1;justify-content:center;padding:.95rem .8rem;font-size:.78rem}
  .barra-mob .barra-wa{
    flex:none;width:3.1rem;display:grid;place-items:center;border:1px solid rgba(247,242,233,.32);
    border-radius:var(--r);color:var(--sand)
  }
  .barra-mob .barra-wa svg{width:1.35rem;height:1.35rem;fill:currentColor}
  /* o rodapé é que cresce, para a barra fixa não deixar uma faixa clara no fim da página */
  .ft{padding-bottom:calc(2.4rem + 4.6rem + env(safe-area-inset-bottom))}
  .lb{padding-bottom:5.4rem}
}

/* ---------- ajustes de celular (99% do tráfego) ---------- */
@media (max-width:900px){
  .hero-inner{padding-block:clamp(2rem,5vh,3.4rem)}
  .hero-sub{margin:1.1rem 0 1.6rem;font-size:1rem}
  .hero .eyebrow{margin-bottom:1rem;font-size:.66rem;letter-spacing:.2em}
  .hero-cta{gap:.7rem}
  .hero-cta .btn{width:100%;justify-content:center}
  .hero-facts div{padding:.9rem 0}
  .hero-facts b{font-size:1.3rem}

  /* galeria: arrastar para o lado, foto grande, legenda sempre à vista */
  .gal{
    display:flex;gap:.6rem;overflow-x:auto;scroll-snap-type:x mandatory;
    -webkit-overflow-scrolling:touch;scrollbar-width:none;
    margin-inline:-1.3rem;padding:0 1.3rem .4rem;
  }
  .gal::-webkit-scrollbar{display:none}
  .gal>*{
    grid-column:auto !important;flex:0 0 84%;scroll-snap-align:center;
    aspect-ratio:4/3 !important
  }
  .gal figure::after{
    opacity:1;font-size:.72rem;padding:2rem .8rem .8rem;
    display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden
  }
  .so-mob{display:inline}
  .so-desk{display:none}

  /* campos de formulário com área de toque de dedo */
  input,select,textarea{padding:.85rem 0;font-size:1rem}
  label{font-size:.66rem;margin-bottom:.35rem}
  form{gap:1.25rem}
  form .btn{padding-block:1.2rem}

  /* menu aberto fica acima da barra de ação, abaixo do cabeçalho */
  .nav.open{z-index:98}

  .article figure,.post-hero{margin-inline:-1.3rem;width:calc(100% + 2.6rem);max-width:none}
  .faq summary{gap:1rem;padding:.35rem 0}
  /* alvos de toque: links de lista e de ação ganham área de dedo */
  .ft ul li a{display:inline-block;padding:.4rem 0}
  .ft ul{gap:.2rem}
  .lugar a{display:inline-block;padding:.55rem 0}
  .near li a{display:inline-block;padding:.3rem 0}
  .post-card{padding-block:.3rem}
  .mapa-guia{aspect-ratio:4/5}

  /* cabeçalho sobre o menu aberto: some o fundo claro, texto volta a ser legível */
  body.menu-aberto .hdr{background:transparent !important;box-shadow:none !important}
  /* a marca e o botão precisam ficar ACIMA da camada do menu, senão somem atrás dela */
  body.menu-aberto .hdr .brand,
  body.menu-aberto .menu-btn{color:var(--sand) !important;position:relative;z-index:101}
  .nav.open{padding-top:3.5rem}
  .quote{font-size:1.3rem}
}
.gal-hint{display:block;font-size:.82rem;letter-spacing:.08em;text-transform:uppercase;opacity:.72;margin:.8rem 0 0}
.dark .gal-hint{opacity:.6}

.so-mob{display:none}
.so-desk{display:inline}

.mapa-guia{aspect-ratio:5/3}

/* ---------- acabamento ---------- */
.dark{
  background:
    radial-gradient(120% 90% at 50% 0%, rgba(28,84,112,.5) 0%, transparent 62%),
    var(--deep);
  position:relative
}
.dark::before{
  content:"";position:absolute;left:0;right:0;top:0;height:1px;
  background:linear-gradient(90deg,transparent,rgba(185,143,82,.65) 22%,rgba(185,143,82,.65) 78%,transparent)
}
h1,h2,h3{text-wrap:balance}
p,li{text-wrap:pretty}
.card{border-color:rgba(18,33,43,.12)}
.card:hover{border-color:rgba(185,143,82,.5)}
.btn{box-shadow:0 1px 0 rgba(255,255,255,.14) inset}
.hero-facts b{letter-spacing:-.01em}
::selection{background:rgba(185,143,82,.28)}
:focus-visible{outline:2px solid var(--brass);outline-offset:3px}