/* ===== Nails da Tata — estilos ===== */
:root{
  --bg:#fbf8f5; --alt:#f4ebe6; --card:#fff; --ink:#3b2f2f; --muted:#7d6e6a;
  --rose:#e9c9c4; --nude:#d9b8a8; --gold:#b8925a; --gold-d:#9a7745;
  --r:22px; --shadow:0 10px 34px rgba(120,80,70,.10);
  --serif:"Cormorant Garamond",Georgia,serif; --sans:"Jost",system-ui,-apple-system,"Segoe UI",sans-serif;
}
*{box-sizing:border-box;margin:0}
html{scroll-behavior:smooth;scroll-padding-top:80px}
body{font-family:var(--sans);font-weight:300;color:var(--ink);background:var(--bg);line-height:1.7;font-size:17px}
img{max-width:100%;display:block}
a{color:inherit}
h1,h2,h3,.logo{font-family:var(--serif);font-weight:600;line-height:1.1}
h1{font-size:clamp(2.8rem,7vw,5rem);margin-bottom:1rem}
h2{font-size:clamp(2rem,4.5vw,3rem);margin-bottom:.8rem}
h3{font-size:1.5rem;margin-bottom:.4rem}
.container{width:min(1120px,92%);margin-inline:auto}
.section{padding:clamp(3.5rem,9vw,7rem) 0}
.section--alt{background:var(--alt)}
.center{text-align:center}
.lead{color:var(--muted);max-width:56ch;margin-bottom:2rem}
.center.lead,.center .lead{margin-inline:auto}
.small{font-size:.9rem;color:var(--muted)}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
.skip{position:absolute;left:-999px;background:#fff;padding:.5rem 1rem;z-index:99}
.skip:focus{left:8px;top:8px}

/* botões */
.btn{display:inline-block;padding:.85rem 1.7rem;border-radius:999px;font:500 .95rem var(--sans);text-decoration:none;cursor:pointer;border:1px solid transparent;transition:.25s}
.btn--gold{background:var(--gold);color:#fff}
.btn--gold:hover{background:var(--gold-d);transform:translateY(-2px)}
.btn--ghost{border-color:var(--gold);color:var(--gold-d)}
.btn--ghost:hover{background:var(--gold);color:#fff}

/* header */
.header{position:fixed;inset:0 0 auto;z-index:50;background:rgba(251,248,245,.92);backdrop-filter:blur(10px);transition:box-shadow .3s}
.header.scrolled{box-shadow:0 2px 20px rgba(120,80,70,.1)}
.header__in{display:flex;align-items:center;gap:1.5rem;height:72px}
.logo{font-size:1.7rem;text-decoration:none;color:var(--gold-d)}
.nav{display:flex;gap:1.4rem;margin-left:auto}
.nav a{text-decoration:none;font-size:.95rem;position:relative}
.nav a::after{content:"";position:absolute;left:0;bottom:-3px;width:0;height:1px;background:var(--gold);transition:.25s}
.nav a:hover::after{width:100%}
.burger{display:none;background:none;border:0;width:40px;height:40px;cursor:pointer;position:relative}
.burger span{position:absolute;left:8px;right:8px;height:2px;background:var(--ink);transition:.3s}
.burger span:first-child{top:15px}.burger span:last-child{top:23px}
.burger[aria-expanded=true] span:first-child{top:19px;transform:rotate(45deg)}
.burger[aria-expanded=true] span:last-child{top:19px;transform:rotate(-45deg)}

/* hero (única animação de entrada da página) */
.hero{padding:120px 0 70px;background:radial-gradient(circle at 85% 20%,var(--rose),transparent 55%),var(--bg)}
.hero__in{display:grid;grid-template-columns:1.05fr .95fr;gap:3rem;align-items:center}
.hero__text>*{animation:rise .9s both}
.hero__text>:nth-child(2){animation-delay:.12s}.hero__text>:nth-child(3){animation-delay:.24s}.hero__text>:nth-child(4){animation-delay:.36s}
@keyframes rise{from{opacity:0;transform:translateY(22px)}}
.hero p{font-size:1.2rem;color:var(--muted);max-width:44ch;margin-bottom:1.8rem}
.hero__btns{display:flex;gap:.8rem;flex-wrap:wrap}
.badges{list-style:none;padding:0;margin-top:2rem;display:flex;flex-wrap:wrap;gap:.6rem}
.badges li{font-size:.85rem;padding:.4rem 1rem;border-radius:999px;background:#fff;box-shadow:var(--shadow)}
.hero__img img,.about__img img{width:100%;aspect-ratio:4/5;object-fit: cover;object-position: center 30%;border-radius:200px 200px var(--r) var(--r);box-shadow:var(--shadow)}
.about__img img{border-radius:var(--r)}
img.ph{background:linear-gradient(145deg,var(--rose),var(--nude));min-height:260px}

/* layouts */
.about{display:grid;grid-template-columns:.9fr 1.1fr;gap:4rem;align-items:center}
.about p{color:var(--muted);margin-bottom:1rem}
.grid{display:grid;gap:1.5rem;margin-top:2.5rem}
.grid--3{grid-template-columns:repeat(3,1fr)}
.grid--4{grid-template-columns:repeat(4,1fr)}
.card{background:var(--card);border-radius:var(--r);padding:1.8rem;box-shadow:var(--shadow)}
.service{display:flex;flex-direction:column;gap:.5rem}
.service p{color:var(--muted);flex:1}
.price{font-family:var(--serif);font-size:1.4rem;color:var(--gold-d);font-weight:600}
.service .btn{align-self:flex-start;margin-top:.6rem}
.perk{border-left:3px solid var(--gold)}
.perk p{color:var(--muted)}
.quote p{font-family:var(--serif);font-size:1.25rem;font-style:italic;margin-bottom:1rem}
.quote span{font-size:.9rem;color:var(--muted)}

/* galeria */
.gallery{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;margin-top:2.5rem}
.gallery button{border:0;padding:0;background:none;cursor:zoom-in;border-radius:var(--r);overflow:hidden;box-shadow:var(--shadow)}
.gallery button:nth-child(5n+1){grid-row:span 2}
.gallery img{width:100%;height:100%;min-height:200px;object-fit:cover;aspect-ratio:1;transition:transform .5s}
.gallery button:nth-child(5n+1) img{aspect-ratio:auto}
.gallery button:hover img{transform:scale(1.05)}

/* formulário */
.booking{display:grid;grid-template-columns:.8fr 1.2fr;gap:3rem;align-items:start}
.form{display:grid;gap:1rem}
.form label{display:grid;gap:.3rem;font-size:.9rem;font-weight:400}
.form__row{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
input,select,textarea{font:inherit;padding:.75rem 1rem;border:1px solid #e3d3cc;border-radius:14px;background:var(--bg);color:var(--ink);width:100%}
input.err,select.err{border-color:#c0504d}
.form__msg{min-height:1.4em;font-size:.9rem;color:#b03a37}
.form__msg.ok{color:#4f7a52}

/* instagram, local, contato */
.insta{background:linear-gradient(135deg,var(--rose),var(--alt))}
.loc{display:grid;grid-template-columns:1fr 1.2fr;gap:3rem;align-items:center}
.loc p{margin-bottom:1rem}
.map{border-radius:var(--r);overflow:hidden;box-shadow:var(--shadow);min-height:320px;background:var(--alt);display:grid;place-items:center;text-align:center;color:var(--muted);padding:1rem}
.map iframe{width:100%;height:340px;border:0}
.contact .card{display:grid;gap:.3rem;align-content:start;word-break:break-word}
.contact strong{font-family:var(--serif);font-size:1.3rem;color:var(--gold-d)}

/* footer */
.footer{background:#3b2f2f;color:#eadfd9;padding:3.5rem 0 1.5rem}
.footer .logo{color:#e8cfa0}
.footer__in{display:flex;justify-content:space-between;gap:2rem;flex-wrap:wrap}
.footer__nav{display:grid;gap:.4rem;align-content:start}
.footer__nav a{text-decoration:none;font-size:.95rem}.footer__nav a:hover{color:#e8cfa0}
.footer .small{color:#b9aaa3}
.footer__bottom{display:flex;justify-content:space-between;flex-wrap:wrap;gap:.5rem;margin-top:2.5rem;padding-top:1.2rem;border-top:1px solid #57494a;font-size:.85rem}
.dev{opacity:.55;font-size:.78rem}

/* whatsapp + lightbox */
.wa-float{position:fixed;right:18px;bottom:18px;width:58px;height:58px;border-radius:50%;background:#25d366;display:grid;place-items:center;box-shadow:0 8px 24px rgba(0,0,0,.25);z-index:60;transition:transform .25s}
.wa-float:hover{transform:scale(1.08)}
.lightbox{position:fixed;inset:0;background:rgba(30,20,20,.92);z-index:100;display:grid;place-items:center;padding:2rem}
.lightbox[hidden]{display:none}
.lightbox img{max-height:86vh;max-width:min(92vw,900px);border-radius:14px}
.lb__close,.lb__nav{position:absolute;background:none;border:0;color:#fff;font-size:2.6rem;cursor:pointer;line-height:1;padding:.5rem 1rem}
.lb__close{top:10px;right:14px}.lb__prev{left:6px}.lb__next{right:6px}
.lb__nav{top:50%;transform:translateY(-50%)}

/* responsivo */
@media(max-width:900px){
  .burger{display:block;margin-left:auto}
  .header__cta{display:none}
  .nav{position:absolute;top:72px;left:0;right:0;flex-direction:column;gap:0;background:var(--bg);padding:.5rem 4%;box-shadow:0 14px 20px rgba(0,0,0,.08);margin:0;transform:translateY(-130%);transition:transform .35s;z-index:-1}
  .nav.open{transform:none}
  .nav a{padding:.9rem 0;border-bottom:1px solid var(--alt)}
  .hero__in,.about,.booking,.loc{grid-template-columns:1fr}
  .hero{padding-top:100px}.hero__img{order:-1;max-width:380px}
  .grid--3,.grid--4{grid-template-columns:1fr 1fr}
  .gallery{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:560px){
  .grid--3,.grid--4,.form__row{grid-template-columns:1fr}
  body{font-size:16px}
}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
#depoimentos {
  display: none !important;
}