/* Home: direção editorial, fotos reais e ações acessíveis. */
.home { --nude:#f4eee7; --white:#fffcf8; --brown:#50382c; --text:#392b24; --text-2:#6a594c; --text-3:#796a5c; --gold:#967137; background:var(--white); }
.home section { scroll-margin-top:90px; }
.home .container { max-width:1240px; }
.home nav { height:88px; padding:0 5vw; background:rgba(255,252,248,.97); border-bottom:1px solid #e7ded3; }
.home nav.scrolled { height:76px; background:rgba(255,252,248,.98); padding:0 5vw; }
.nav-logo { text-decoration:none; gap:13px; color:var(--brown); }
.brand-monogram { font-family:'Playfair Display',serif; font-size:33px; border-right:1px solid #d8c9b6; padding-right:16px; letter-spacing:-5px; width:61px; }
.nav-logo-text { font-size:13px; letter-spacing:2.5px; font-weight:500; }
.nav-logo-text small { display:block; font-size:8px; letter-spacing:2px; margin-top:5px; }
.home .nav-links { gap:26px; }
.mobile-booking { display:none; }
.home .nav-links a { font-size:12px; text-transform:none; letter-spacing:.3px; padding:14px 0; }
.nav-btn-primary { display:inline-flex; align-items:center; gap:9px; background:var(--brown); color:white; text-decoration:none; padding:14px 20px; font-size:13px; border-radius:3px; }
.home .hero { margin-top:88px; min-height:660px; padding:62px max(5vw,calc((100vw - 1320px)/2)); display:grid; grid-template-columns:1fr 1fr; gap:6%; background:#f4eee7; align-items:center; overflow:hidden; }
.home .hero::before,.home .hero::after { display:none; }
.hero-copy { position:relative; z-index:2; padding:12px 0 30px; }
.home .eyebrow { font-size:11px; letter-spacing:2.2px; color:var(--gold); font-weight:500; }
.hero-copy h1 { font-size:clamp(44px,4.4vw,68px); font-weight:400; line-height:1.12; letter-spacing:-2px; margin:27px 0 25px; }
.hero-copy h1 em { color:#94724e; font-weight:400; }
.hero-copy p { font-size:16px; line-height:1.85; max-width:410px; color:var(--text-2); }
.hero-actions { display:flex; align-items:center; flex-wrap:wrap; gap:24px; margin-top:32px; }
.home .btn-primary { background:var(--brown); border-radius:3px; padding:17px 25px; color:#fff; font-size:13px; letter-spacing:.4px; text-transform:none; display:inline-flex; justify-content:center; align-items:center; gap:25px; min-height:48px; }
.home .btn-primary:hover,.nav-btn-primary:hover { background:#76523d; transform:translateY(-2px); }
.hero-link { color:var(--brown); text-decoration:none; border-bottom:1px solid #b9a58d; padding:10px 0; font-size:13px; }
.hero-signature { display:flex; align-items:center; gap:12px; margin-top:43px; color:var(--text-3); font-size:12px; }
.signature-line { width:28px; height:1px; background:#aa8a63; }
.hero-art { position:relative; padding:0 16px 27px 0; max-width:560px; width:100%; justify-self:end; }
.hero-feature { display:block; width:100%; height:510px; object-fit:cover; border-radius:160px 5px 5px 5px; }
.photo-index { writing-mode:vertical-rl; position:absolute; right:-8px; top:70px; font-size:9px; letter-spacing:2px; color:var(--text-3); }
.hero-photo-note { position:absolute; bottom:0; left:-30px; background:var(--white); border:1px solid #e3d8ca; padding:20px 76px 20px 25px; box-shadow:0 10px 35px #392b2408; }
.hero-photo-note > span:first-child { display:block; text-transform:uppercase; font-size:9px; letter-spacing:2px; margin-bottom:5px; }
.hero-photo-note em { font-family:'Playfair Display',serif; font-size:23px; }
.note-star { position:absolute; right:20px; top:22px; font-size:35px; color:var(--gold); }
.trust-strip { min-height:82px; padding:20px 5vw; display:flex; justify-content:space-between; align-items:center; gap:20px; border-bottom:1px solid #e8dfd3; font-size:12px; color:var(--text-2); }
.trust-strip i { color:#a88b63; font-size:14px; }
.trust-strip a { color:inherit; text-decoration:none; }
.home .instagram,.home .servicos,.home .sobre,.home .agendar,.home .manutencao { padding:85px 0; }
.home .instagram { background:var(--white); }
.home .section-header { margin-bottom:38px; }
.home .section-header h2 { font-size:clamp(32px,3.4vw,46px); letter-spacing:-1px; }
.home .section-header p { font-size:16px; max-width:540px; }
.home .gold-line { height:1px; }
.home .carousel-wrap { display:block; margin:0; padding:0; }
.home .carousel-viewport { overflow:visible; padding:0; }
.work-grid { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:15px; }
.work-item { display:block; aspect-ratio:3/4; position:relative; overflow:hidden; border-radius:3px; background:var(--nude); }
.work-item:nth-child(even) { margin-top:30px; margin-bottom:-30px; }
.work-item img { display:block; height:100%; width:100%; object-fit:cover; transition:transform .4s; }
.work-item:hover img { transform:scale(1.05); }
.work-item:hover .carousel-overlay,.work-item:focus-visible .carousel-overlay { opacity:1; }
.home .instagram-cta { margin-top:65px; }
.home .btn-instagram { font-size:12px; letter-spacing:.5px; text-transform:none; border-color:#d5c4b0; border-radius:3px; }
.home .btn-instagram::before { display:none; }
.home .btn-instagram:hover { color:var(--brown); background:var(--nude); }
.home .sobre { background:var(--nude); }
.home .sobre-grid { gap:8%; }
.home .sobre-moldura { padding:0; border:none; background:none; }
.home .sobre-img-frame { max-width:430px; max-height:none; margin-inline:auto; border-radius:5px; }
.home .sobre-img { width:100%; height:auto; max-height:none; display:block; border-radius:inherit; }
.home .sobre-text p,.home .manutencao-text p { font-size:16px; font-weight:400; }
.home .sobre-text h2 { font-size:42px; letter-spacing:-1px; }
.home .pill { background:transparent; font-size:12px; }
.home .servicos { background:var(--white); }
.home .servicos-grid { user-select:auto; grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr)); }
.home .servico-grupo { border:1px solid #e5d9cb; border-radius:5px; }
.home .servico-card { background:transparent; padding:16px 0; border-bottom:1px solid #e9dfd3; }
.home .servico-nota { font-size:14px; border:0; font-weight:400; }
.service-select { display:inline-flex; align-items:center; gap:24px; background:transparent; color:var(--brown); border:0; border-bottom:1px solid #B8913A; padding:12px 0 8px; margin-top:10px; min-height:44px; font:inherit; font-size:13px; cursor:pointer; }
.service-fallback { grid-column:1/-1; background:var(--nude); padding:40px; text-align:center; border-radius:5px; }
.service-fallback h3 { font-weight:400; font-size:28px; margin:16px 0; }
.service-fallback p { max-width:550px; margin:0 auto 20px; line-height:1.8; color:var(--text-2); }
.home .agendar { background:#eee4d8; }
.home .agendar-card { max-width:650px; background:var(--white); border:1px solid #dfd1c0; border-radius:7px; box-shadow:0 16px 50px #50382c06; }
.booking-progress { list-style:none; display:flex; gap:10px; counter-reset:step; margin:0 0 32px; padding:0 0 24px; border-bottom:1px solid #e8dfd3; }
.booking-progress li { flex:1; font-size:12px; color:var(--text-3); display:flex; align-items:center; gap:6px; }
.booking-progress li::before { counter-increment:step; content:counter(step); width:24px; height:24px; border:1px solid #d8caba; border-radius:50%; display:inline-grid; place-items:center; flex-shrink:0; }
.booking-progress [aria-current] { color:var(--brown); font-weight:500; }
.booking-progress [aria-current]::before { background:var(--brown); color:white; border-color:var(--brown); }
.booking-unavailable { text-align:center; padding:10px 0; }
.booking-unavailable > span { font-size:35px; color:var(--gold); }
.booking-unavailable h3 { font-size:28px; font-weight:400; margin:12px 0; }
.booking-unavailable p { line-height:1.8; color:var(--text-2); margin:0 0 25px; }
.home .ag-field input,.home .ag-field textarea,.home .ag-date-input { font-size:16px; border-radius:3px; min-height:48px; }
.home .ag-field label,.home .ag-step-label { font-size:12px; letter-spacing:.5px; }
.home .ag-qty-btn { min-width:44px; min-height:44px; }
.home [role=button]:focus-visible { outline:2px solid var(--brown); outline-offset:3px; }
.home .ag-resumo strong { display:block; border-top:1px solid #ddcebc; margin-top:12px; padding-top:12px; font-size:18px; }
.home .pagamento-nota { display:block; }
.home .cta-final { background:#3c2d25; }
.home .cta-final p { color:#dfd0c2; }
.home .footer-links a,.home .footer-copy,.home .footer-dev { color:#c7b5a5; font-size:12px; }
.home .wa-float { width:50px; height:50px; background:#426650; box-shadow:0 4px 18px #0002; }
@media(min-width:901px) and (max-width:1100px) { .home .nav-links { gap:15px; } .nav-logo-text { font-size:11px; } .nav-btn-primary { padding:13px; } }
@media(max-width:900px) {
 .home nav,.home nav.scrolled { height:76px; padding:0 24px; }
 .home .nav-action-group { display:none; }
 .home .nav-burger { width:44px; height:44px; padding:9px; }
 .home .nav-links { visibility:hidden; }
 .home .nav-links.open { visibility:visible; }
 .home .mobile-booking { display:block; }
 .home .hero { margin-top:76px; padding:45px 6vw; min-height:auto; gap:32px; }
 .hero-copy h1 { font-size:44px; }
 .hero-feature { height:440px; border-top-left-radius:110px; }
 .hero-actions { gap:15px; }
 .hero-photo-note { left:-15px; padding:17px; }
 .hero-photo-note em { font-size:19px; }
 .note-star { display:none; }
 .trust-strip { flex-wrap:wrap; justify-content:center; }
 .trust-strip i { display:none; }
 .work-grid { grid-template-columns:repeat(3,1fr); }
 .work-item:nth-child(even) { margin:0; }
 .work-item:nth-child(n+4) { display:none; }
 .home .sobre-grid { gap:36px; }
 .home .sobre-img-frame { max-width:430px; margin:auto; }
}
@media(max-width:600px) {
 .home .hero { grid-template-columns:1fr; padding:38px 24px 34px; gap:28px; }
 .hero-copy { padding:0; }
 .hero-copy h1 { font-size:44px; letter-spacing:-1.5px; margin:20px 0; }
 .hero-copy p { font-size:15px; }
 .hero-signature { margin-top:25px; }
 .hero-actions { margin-top:24px; }
 .hero-art { padding-right:12px; max-width:450px; justify-self:center; }
 .hero-feature { height:330px; border-top-left-radius:100px; }
 .hero-photo-note { left:14px; bottom:4px; padding:15px 22px; }
 .photo-index { right:-4px; font-size:8px; top:40px; }
 .trust-strip { gap:12px 22px; padding:22px; font-size:11px; }
 .home .instagram,.home .servicos,.home .sobre,.home .agendar,.home .manutencao { padding:56px 0; }
 .work-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
 .work-item:nth-child(n+4) { display:block; }
 .work-item:last-child { display:none; }
 .home .instagram-cta { margin-top:28px; }
 .home .sobre-text h2 { font-size:34px; }
 .home .section-header p { font-size:15px; }
 .service-fallback { padding:28px 20px; }
 .booking-progress { gap:5px; }
 .booking-progress li { flex-direction:column; font-size:10px; }
 .home .pagamento-wrap { gap:15px; flex-wrap:wrap; }
 .home .pagamento-nota { width:100%; margin:0; }
 .home .footer-inner { padding-bottom:45px; }
}
@media(prefers-reduced-motion:reduce) {
 .home *, .home *::before,.home *::after { animation:none!important; transition:none!important; scroll-behavior:auto!important; }
}

/* ── Lista de serviços do agendamento ──────────────────────────
   Antes, duração e preço disputavam a atenção: os dois em dourado,
   e a duração ainda vinha em negrito 700 dentro de uma pílula com
   fundo e borda — ou seja, o detalhe secundário gritava mais alto
   que o preço. Aqui a hierarquia é explícita: o preço é a
   informação principal (serifada, maior, dourada) e a duração é
   um apoio discreto, em tom neutro.
   Também saiu o emoji ⏱️: ele muda de desenho a cada sistema e
   destoa da tipografia do site. No lugar, um relógio em SVG que
   herda a cor do texto. */
.ag-servico-dur {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  margin-top: 4px;
  font-family: 'Jost', sans-serif;
  font-size: 11px;
  font-weight: 400;
  letter-spacing: .06em;
  /* Sem uppercase de proposito: "2h" virava "2H", e o h de hora e
     unidade de medida, nao rotulo. */
  color: var(--text-3, #9A7A68);
  white-space: nowrap;
}
.ag-servico-dur svg { width: 12px; height: 12px; flex: none; opacity: .85; }

.ag-servico-preco {
  font-family: 'Playfair Display', serif;
  font-size: 17px;
  font-weight: 500;
  color: var(--gold, #B8913A);
  white-space: nowrap;
  padding-left: 14px;
  line-height: 1.2;
}

/* Selecionado: o item ganha o dourado, e aí a duração pode
   acompanhar sem competir — o contexto já mudou. */
.ag-servico-item[aria-pressed="true"] .ag-servico-dur { color: var(--brown-2, #7A5544); }

/* ── Aviso de datas fechadas (abre ao entrar no site) ──────────
   Aparece só quando há fechamento próximo e só uma vez por
   conjunto de datas — ver o comentário em script.js. */
.aviso-fech { position: fixed; inset: 0; z-index: 9000; display: flex;
  align-items: center; justify-content: center; padding: 20px; }
.aviso-fech[hidden] { display: none; }

.aviso-fech-fundo { position: absolute; inset: 0;
  background: rgba(26, 15, 10, .62); backdrop-filter: blur(3px);
  animation: avisoFundo .35s ease both; }

.aviso-fech-caixa { position: relative; width: 100%; max-width: 440px;
  background: var(--white, #FDF9F6); border-top: 3px solid var(--gold, #B8913A);
  padding: 34px 30px 28px; text-align: center;
  box-shadow: 0 24px 60px rgba(26, 15, 10, .3);
  animation: avisoEntra .4s cubic-bezier(.16, 1, .3, 1) both;
  max-height: calc(100vh - 40px); overflow-y: auto; }

@keyframes avisoFundo { from { opacity: 0 } to { opacity: 1 } }
@keyframes avisoEntra { from { opacity: 0; transform: translateY(16px) } to { opacity: 1; transform: none } }

/* Quem prefere menos movimento não deve levar animação nenhuma. */
@media (prefers-reduced-motion: reduce) {
  .aviso-fech-fundo, .aviso-fech-caixa { animation: none; }
}

.aviso-fech-x { position: absolute; top: 10px; right: 12px;
  background: none; border: 0; font-size: 26px; line-height: 1;
  color: var(--text-3, #9A7A68); cursor: pointer; padding: 6px 10px;
  transition: color .2s; }
.aviso-fech-x:hover { color: var(--brown, #5C3D2E); }

.aviso-fech-eyebrow { display: block; font-family: 'Jost', sans-serif;
  font-size: 10px; letter-spacing: 3px; text-transform: uppercase;
  color: var(--gold, #B8913A); margin-bottom: 10px; }

.aviso-fech-titulo { font-family: 'Playfair Display', serif; font-weight: 400;
  font-size: 25px; line-height: 1.25; color: var(--text, #3A2318); margin: 0 0 20px; }
.aviso-fech-titulo em { font-style: italic; color: var(--gold, #B8913A); }

.aviso-fech-lista { list-style: none; margin: 0 0 18px; padding: 0;
  display: flex; flex-direction: column; gap: 8px; text-align: left; }
.aviso-fech-lista li { background: var(--nude, #F0E6DC); padding: 11px 15px;
  border-left: 2px solid var(--gold, #B8913A); }
.aviso-fech-quando { display: block; font-family: 'Jost', sans-serif;
  font-size: 14px; font-weight: 500; color: var(--text, #3A2318); }
.aviso-fech-motivo { display: block; font-family: 'Jost', sans-serif;
  font-size: 12px; color: var(--text-3, #9A7A68); margin-top: 2px; }

.aviso-fech-rodape { font-family: 'Jost', sans-serif; font-size: 12.5px;
  color: var(--text-2, #6B5040); margin: 0 0 20px; }

.aviso-fech-ok { width: 100%; }
/* No aviso de cursos o botão principal é um link (vai para curso.html). */
a.aviso-fech-ok { display: block; text-align: center; text-decoration: none; box-sizing: border-box; }

/* Saída discreta do aviso de cursos: não compete com o botão principal. */
.aviso-curso-depois { display: block; margin: 14px auto 0; background: none; border: 0;
  font-family: 'Jost', sans-serif; font-size: 12.5px; color: var(--text-3, #9A7A68);
  text-decoration: underline; text-underline-offset: 3px; cursor: pointer; padding: 4px 8px; }
.aviso-curso-depois:hover { color: var(--brown, #5C3D2E); }

@media (max-width: 480px) {
  .aviso-fech-caixa { padding: 30px 20px 24px; }
  .aviso-fech-titulo { font-size: 21px; }
}
