﻿
        /* Estilos exclusivos da vitrine pública e da identidade da marca. */
        :root { --ink:#202321; --muted:#68726b; --sage:#b7d5b0; --deep:#254d3c; --mint:#edf4eb; --line:#dfe8df; --paper:#fbfcf9; }
        * { box-sizing:border-box; margin:0; padding:0; }
        html { scroll-behavior:smooth; }
        body { background:var(--paper); color:var(--ink); font-family:'DM Sans',sans-serif; line-height:1.5; }
        a { color:inherit; text-decoration:none; } button { border:0; cursor:pointer; font:inherit; }
        .container { width:min(1160px, calc(100% - 48px)); margin:auto; }
        .topbar { align-items:center; display:flex; justify-content:space-between; padding:22px 0; }
        .brand { align-items:center; display:flex; gap:12px; }
        .brand-mark { align-items:center; background:var(--sage); border-radius:50%; display:flex; height:42px; justify-content:center; overflow:hidden; width:42px; }
        .brand-mark img { height:190%; max-width:none; object-fit:contain; width:190%; }
        .brand strong { font-family:'Playfair Display',serif; font-size:21px; font-weight:500; }
        .brand small { color:var(--deep); display:block; font-size:9px; letter-spacing:3px; margin-top:-3px; text-transform:uppercase; }
        .nav { align-items:center; display:flex; gap:30px; } .nav a { color:var(--muted); font-size:13px; } .nav a:hover { color:var(--deep); }
        .header-action, .primary { align-items:center; background:var(--deep); border-radius:3px; color:white; display:inline-flex; font-size:13px; gap:8px; padding:13px 18px; }
        .header-action { padding:10px 14px; } .primary { font-weight:700; padding:15px 22px; } .primary:hover { background:#18382b; }
        .hero { min-height:650px; overflow:hidden; position:relative; } .hero:after { background:linear-gradient(90deg, #edf4eb 0%, #edf4eb 53%, transparent 80%); content:''; inset:0; position:absolute; z-index:-1; }
        .hero-content { align-items:center; display:grid; grid-template-columns:1fr 1fr; min-height:590px; }
        .eyebrow { color:var(--deep); font-size:11px; font-weight:700; letter-spacing:3px; margin-bottom:20px; text-transform:uppercase; }
        h1, h2 { font-family:'Playfair Display',serif; font-weight:500; } h1 { font-size:clamp(44px,6vw,76px); line-height:1.05; max-width:570px; } h1 em { color:var(--deep); font-style:italic; }
        .hero-copy p { color:var(--muted); font-size:16px; margin:24px 0 30px; max-width:410px; } .hero-note { align-items:center; color:var(--muted); display:flex; font-size:12px; gap:8px; margin-top:22px; } .hero-note i { color:var(--deep); }
        .hero-visual { align-items:center; display:flex; justify-content:center; position:relative; } .hero-photo { background:var(--sage); border-radius:48% 48% 5px 5px; height:430px; overflow:hidden; position:relative; width:350px; }
        .hero-photo:before { border:1px solid rgba(255,255,255,.65); border-radius:48% 48% 5px 5px; content:''; inset:14px; position:absolute; z-index:1; } .hero-photo img { height:100%; object-fit:cover; object-position:center top; width:100%; }
        .seal { align-items:center; background:#fff; border-radius:50%; bottom:38px; display:flex; flex-direction:column; height:104px; justify-content:center; position:absolute; right:-38px; text-align:center; width:104px; } .seal span { color:var(--deep); font-size:9px; letter-spacing:1px; text-transform:uppercase; } .seal strong { font-family:'Playfair Display',serif; font-size:25px; font-weight:500; }
        .trust { background:var(--deep); color:white; padding:16px 0; } .trust-row { align-items:center; display:flex; gap:45px; justify-content:center; } .trust-item { align-items:center; display:flex; font-size:12px; gap:9px; opacity:.9; }
        .section { padding:100px 0; } .section-heading { align-items:end; display:flex; justify-content:space-between; margin-bottom:35px; } .section-heading h2 { font-size:43px; line-height:1.1; max-width:420px; } .section-heading p { color:var(--muted); font-size:14px; max-width:300px; }
        .services { display:grid; gap:14px; grid-template-columns:repeat(auto-fit, minmax(240px, 1fr)); } .services::-webkit-scrollbar { height:5px; } .services::-webkit-scrollbar-thumb { background:var(--line); border-radius:3px; } .service { scroll-snap-align:start; } .heading-lado { align-items:flex-end; display:flex; gap:22px; justify-content:space-between; } .carrossel-setas { display:flex; flex-shrink:0; gap:8px; } .carrossel-setas button { background:#fff; border:1px solid var(--line); color:var(--deep); cursor:pointer; font-size:20px; line-height:1; padding:8px 15px; transition:background .2s, color .2s; } .carrossel-setas button:hover { background:var(--deep); border-color:var(--deep); color:#fff; } .service { background:#fff; border:1px solid var(--line); min-height:250px; padding:28px; transition:transform .2s, box-shadow .2s; } .service:hover { box-shadow:0 15px 35px rgba(37,77,60,.1); transform:translateY(-4px); }
        .service-icon { align-items:center; background:var(--mint); border-radius:50%; color:var(--deep); display:flex; height:48px; justify-content:center; margin-bottom:38px; width:48px; } .service h3 { font-family:'Playfair Display',serif; font-size:24px; font-weight:500; } .service p { color:var(--muted); font-size:13px; margin:10px 0 17px; } .service .price { color:var(--deep); font-size:13px; font-weight:700; }
        .booking { background:var(--mint); } .booking-layout { align-items:start; display:grid; gap:80px; grid-template-columns:.8fr 1.2fr; } .booking h2 { font-size:46px; } .booking-copy p { color:var(--muted); font-size:14px; margin:20px 0 25px; max-width:330px; } .contact-list { display:grid; gap:13px; } .contact-list a { align-items:center; color:var(--deep); display:flex; font-size:13px; gap:10px; }
        .schedule { background:#fff; border:1px solid var(--line); padding:28px; } .schedule-head { align-items:center; display:flex; justify-content:space-between; margin-bottom:22px; } .schedule-head strong { font-family:'Playfair Display',serif; font-size:24px; font-weight:500; } .calendar { display:grid; gap:8px; grid-template-columns:repeat(3,1fr); } .slot { background:var(--mint); border:1px solid transparent; color:var(--deep); font-size:12px; padding:15px 10px; text-align:center; } .slot:hover, .slot.active { background:var(--deep); color:#fff; } .slot strong { display:block; font-size:13px; margin-bottom:5px; }
        .booking-modal { align-items:center; background:rgba(32,35,33,.55); display:flex; inset:0; justify-content:center; padding:20px; position:fixed; z-index:50; } .booking-modal.hidden { display:none; } .booking-modal-panel { background:#fff; border:1px solid var(--line); max-width:760px; padding:28px; position:relative; width:min(100%, 760px); } .booking-close { background:transparent; color:var(--muted); font-size:32px; line-height:1; position:absolute; right:18px; top:10px; } .modal-head h3 { font-family:'Playfair Display',serif; font-size:30px; font-weight:500; margin-bottom:18px; } .booking-form-grid { display:grid; gap:16px; grid-template-columns:repeat(2, minmax(0, 1fr)); } .booking-form-grid label, .textarea-label { display:flex; flex-direction:column; gap:8px; } .booking-form-grid span, .rating-block span, .textarea-label span { color:var(--deep); font-size:11px; font-weight:700; letter-spacing:1.8px; text-transform:uppercase; } .booking-form-grid input, .booking-form-grid select, .textarea-label textarea { background:#f7faf7; border:1px solid var(--line); color:var(--ink); font:inherit; padding:12px 14px; width:100%; } .booking-form-grid input[readonly] { background:#eef4ee; } .rating-block { align-items:center; display:flex; flex-wrap:wrap; gap:12px; justify-content:space-between; margin:22px 0 18px; } .rating-block.separate { justify-content:flex-start; flex-direction:column; align-items:flex-start; } .rating-note { color:var(--muted); font-size:13px; } .star-rating { display:flex; gap:8px; } .star { background:transparent; color:#d4d9d4; font-size:28px; line-height:1; padding:0; } .star.active { color:#f1b94a; } .textarea-label textarea { min-height:110px; resize:vertical; } .textarea-label small { color:var(--muted); font-size:11px; text-align:right; } .booking-actions { display:flex; gap:12px; justify-content:flex-end; margin-top:20px; } .secondary { background:#eaf0ea; border:1px solid var(--line); color:var(--deep); padding:12px 18px; } .secondary:hover { background:#e0e9e0; } .booking-form-error { background:#fdeaea; border:1px solid #efc1c1; color:#8b2f2f; font-size:12px; margin-top:12px; padding:10px 12px; }
        .quote { background:#fff; text-align:center; } .quote blockquote { font-family:'Playfair Display',serif; font-size:clamp(27px,4vw,43px); line-height:1.2; margin:0 auto 20px; max-width:770px; } .quote cite { color:var(--deep); font-size:12px; font-style:normal; letter-spacing:2px; text-transform:uppercase; }
        footer { background:var(--ink); color:white; padding:42px 0; } .footer-row { align-items:center; display:flex; justify-content:space-between; } footer .brand small, footer .brand { color:white; } footer .brand-mark { background:var(--sage); } .footer-contact { align-items:center; display:flex; gap:18px; } .footer-contact a { align-items:center; color:#dbe8dc; display:flex; font-size:12px; gap:7px; } .footer-contact a:hover { color:white; } .footer-social { align-items:center; border:1px solid #56605b; border-radius:3px; display:flex; gap:7px; min-height:35px; padding:0 11px; } .contact-icon { border-radius:9px; display:block; height:30px; object-fit:cover; width:30px; } .contact-list .contact-icon { height:30px; width:30px; } .footer-social .contact-icon { height:24px; width:24px; }
        .admin { background:#f5f7f3; display:none; min-height:100vh; } .admin.open { display:block; } .admin-nav { background:var(--deep); color:white; padding:20px 0; } .admin-nav .container, .admin-main .container { align-items:center; display:flex; justify-content:space-between; } .admin-nav span { font-size:12px; opacity:.75; } .admin-main { padding:55px 0; } .admin-title h2 { font-size:42px; } .back { background:transparent; color:var(--deep); font-size:13px; }
        .admin-grid { display:grid; gap:18px; grid-template-columns:1.1fr .9fr; margin-top:35px; } .panel { background:#fff; border:1px solid var(--line); padding:25px; } .panel h3 { font-family:'Playfair Display',serif; font-size:23px; font-weight:500; margin-bottom:18px; } .appointment { align-items:center; border-bottom:1px solid var(--line); display:flex; justify-content:space-between; padding:15px 0; } .appointment:last-child { border-bottom:0; } .appointment strong { display:block; font-size:13px; } .appointment span { color:var(--muted); font-size:12px; } .status { background:#e6f2e4; border-radius:20px; color:var(--deep); font-size:10px; padding:5px 9px; } .price-row { align-items:center; border-bottom:1px solid var(--line); display:grid; gap:9px; grid-template-columns:1fr 90px 60px; padding:10px 0; } .price-row input { border:1px solid var(--line); font:inherit; padding:7px; width:100%; } .price-row button { background:transparent; color:#b14e4e; } .add-price { color:var(--deep); font-size:12px; margin-top:15px; } .availability-form { display:grid; gap:9px; grid-template-columns:1fr 1fr auto; margin-bottom:18px; } .availability-form input { border:1px solid var(--line); font:inherit; min-width:0; padding:8px; } .availability-form button { background:var(--deep); color:#fff; padding:0 12px; } .availability-row { align-items:center; border-bottom:1px solid var(--line); display:flex; justify-content:space-between; padding:10px 0; } .availability-row span { font-size:12px; } .availability-row button { background:transparent; color:#b14e4e; }
        @media (max-width:760px) { .container { width:min(100% - 34px, 600px); } .topbar { align-items:flex-start; flex-wrap:wrap; gap:18px 0; } .nav { align-items:center; display:flex; flex-wrap:wrap; gap:12px 18px; justify-content:flex-start; width:100%; } .nav a { font-size:12px; } .header-action { font-size:12px; padding:9px 11px; } .hero-content, .booking-layout, .admin-grid { grid-template-columns:1fr; } .hero-content { padding:50px 0; } .hero-visual { margin-top:35px; } .hero-photo { height:330px; width:270px; } .section { padding:70px 0; } .section-heading, .footer-row { align-items:start; flex-direction:column; gap:20px; } .services { grid-template-columns:1fr; } .heading-lado { align-items:flex-start; flex-direction:column; gap:16px; width:100%; } .trust-row { flex-wrap:wrap; gap:14px 25px; justify-content:flex-start; } .calendar { grid-template-columns:repeat(2,1fr); } .booking-layout { gap:35px; } .seal { right:-14px; } }
    

        .reviews { background:#fbfcfb; } .reviews-average { color:var(--muted); font-size:13px; } .reviews-grid { display:grid; gap:18px; grid-template-columns:repeat(3,1fr); margin-top:8px; } .review { background:#fff; border:1px solid var(--line); display:flex; flex-direction:column; gap:12px; padding:24px; } .review-rating { color:#f1b94a; font-size:17px; letter-spacing:2px; } .review-text { color:var(--ink); font-size:14px; line-height:1.65; } .review-service { color:var(--deep); font-size:11px; font-weight:700; letter-spacing:1.6px; margin-top:auto; text-transform:uppercase; } .review-author { color:var(--muted); font-size:12px; } @media (max-width:760px) { .reviews-grid { grid-template-columns:1fr; } }

        .carrossel-setas button:disabled { color:var(--line); cursor:default; }
        .carrossel-setas button:disabled:hover { background:#fff; border-color:var(--line); color:var(--line); }

        /* Carrossel de fotografias acima dos cartoes: a do centro em destaque. */
        .palco { margin-bottom:30px; overflow:hidden; padding:6px 0 4px; }
        .trilho-fotos { align-items:center; display:flex; gap:18px; transition:transform .45s cubic-bezier(.22,.61,.36,1); will-change:transform; }
        .foto-servico { background:#fff; border:1px solid var(--line); cursor:pointer; flex:0 0 var(--larg-foto, 420px); opacity:.45; overflow:hidden; position:relative; transform:scale(.88); transition:opacity .45s, transform .45s, box-shadow .45s; width:var(--larg-foto, 420px); }
        .foto-servico.ativo { box-shadow:0 20px 48px rgba(37,77,60,.2); cursor:default; opacity:1; transform:scale(1); }
        .foto-servico img { aspect-ratio:16/9; display:block; height:auto; object-fit:cover; width:100%; }
        .foto-legenda { align-items:baseline; display:flex; flex-wrap:wrap; gap:4px 12px; justify-content:space-between; padding:16px 18px; }
        .foto-legenda strong { font-family:'Playfair Display',serif; font-size:19px; font-weight:500; }
        .foto-legenda span { color:var(--muted); font-size:12px; }
        .foto-servico:focus-visible { outline:2px solid var(--deep); outline-offset:3px; }
        .pontos { display:flex; gap:7px; justify-content:center; margin:-18px 0 30px; }
        .ponto { background:var(--line); border:0; border-radius:50%; cursor:pointer; height:8px; padding:0; transition:background .3s, width .3s; width:8px; }
        .ponto.ativo { background:var(--deep); border-radius:4px; width:22px; }
        .ponto:focus-visible { outline:2px solid var(--deep); outline-offset:2px; }
        @media (max-width:860px) { .palco { --larg-foto:72vw; } .trilho-fotos { gap:12px; } }
        @media (prefers-reduced-motion:reduce) { .trilho-fotos, .foto-servico { transition:none !important; } }
