:root{
    --cream:#FBF6F3;
    --blush:#F4E6E1;
    --wine:#6B4A47;
    --mauve:#A67D7B;
    --terracotta:#E4B79E;
    --ink:#4A3B39;
    --wa:#25D366;
    --frame-dash:#A67D7B;
    --maxw:1140px;
  }

  *{box-sizing:border-box;margin:0;padding:0}
  html{scroll-behavior:smooth}
  @media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

  body{
    font-family:'Inter',sans-serif;
    color:var(--ink);
    background:var(--cream);
    line-height:1.65;
    -webkit-font-smoothing:antialiased;
    overflow-x:hidden;
  }

  h1,h2,h3,.serif{font-family:'Cormorant Garamond',serif;font-weight:500;color:var(--wine);line-height:1.1}
  a{color:inherit;text-decoration:none}
  img{max-width:100%;display:block}

  .wrap{max-width:var(--maxw);margin:0 auto;padding:0 24px}

  .eyebrow{
    font-family:'Inter',sans-serif;font-weight:500;
    letter-spacing:.22em;text-transform:uppercase;
    font-size:.72rem;color:var(--mauve);
  }

  /* ---------- Botões ---------- */
  .btn{
    display:inline-flex;align-items:center;gap:.55rem;
    font-family:'Inter',sans-serif;font-weight:500;font-size:.98rem;
    padding:.9rem 1.7rem;border-radius:999px;
    background:var(--wine);color:#fff;
    transition:background .25s ease,transform .25s ease;
    border:1px solid var(--wine);cursor:pointer;
  }
  .btn:hover{background:var(--mauve);border-color:var(--mauve);transform:translateY(-2px)}
  .btn svg{width:19px;height:19px}
  .btn-ghost{background:transparent;color:var(--wine)}
  .btn-ghost:hover{background:var(--wine);color:#fff}

  /* ---------- Header ---------- */
  header{
    position:fixed;top:0;left:0;right:0;z-index:50;
    background:rgba(251,246,243,.82);
    backdrop-filter:blur(10px);
    border-bottom:1px solid rgba(166,125,123,.18);
  }
  .nav{display:flex;align-items:center;justify-content:space-between;height:74px}
  /* LOGO */
  .logo{display:flex;flex-direction:column;line-height:1}
  .logo .mono{font-family:'Cormorant Garamond',serif;font-style:italic;font-size:1.75rem;font-weight:600;color:var(--wine);letter-spacing:.02em}
  .logo .name{font-family:'Cormorant Garamond',serif;font-size:.7rem;letter-spacing:.28em;text-transform:uppercase;color:var(--mauve);margin-top:1px}
  .nav-links{display:flex;align-items:center;gap:2rem}
  .nav-links a.lnk{font-size:.9rem;color:var(--ink);font-weight:400;transition:color .2s}
  .nav-links a.lnk:hover{color:var(--wine)}
  .menu-btn{display:none;background:none;border:none;cursor:pointer;padding:8px}
  .menu-btn span{display:block;width:24px;height:2px;background:var(--wine);margin:5px 0;transition:.3s}

  /* ---------- Hero ---------- */
  .hero{padding:140px 0 90px;position:relative}
  .hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:center}
  .hero-copy .eyebrow{margin-bottom:20px;display:block}
  .hero h1{font-size:3.7rem;font-weight:500;margin-bottom:22px}
  .hero h1 em{font-style:italic;color:var(--mauve)}
  .hero p.lead{font-size:1.12rem;max-width:30rem;margin-bottom:34px;color:var(--ink)}
  .hero-cta{display:flex;gap:14px;flex-wrap:wrap;align-items:center}
  .brush{
    position:absolute;width:340px;height:200px;
    background:radial-gradient(ellipse at center,var(--terracotta) 0%,transparent 68%);
    opacity:.5;filter:blur(8px);top:60px;left:-90px;z-index:0;pointer-events:none;
  }

  /* ---------- Moldura de foto (assinatura visual) ---------- */
  .photo-frame{
    position:relative;border-radius:34px;overflow:hidden;
    border:2px dashed var(--frame-dash);
    background:linear-gradient(160deg,var(--blush),#f7ece7);
    padding:10px;
  }
  .photo-frame .inner{
    border-radius:26px;overflow:hidden;aspect-ratio:4/5;
    display:flex;align-items:center;justify-content:center;
    background:linear-gradient(160deg,#efdcd6,#f6e9e4);
  }
  .photo-frame img{width:100%;height:100%;object-fit:cover}
  .ph-note{text-align:center;color:var(--mauve);padding:20px}
  .ph-note svg{width:44px;height:44px;margin:0 auto 10px;opacity:.7}
  .ph-note span{font-size:.82rem;letter-spacing:.04em;display:block}

  /* ---------- Sobre ---------- */
  .sobre{background:var(--blush);padding:96px 0}
  .sobre-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:60px;align-items:center}
  .sobre h2{font-size:2.9rem;margin-bottom:22px}
  .sobre h2 em{font-style:italic;color:var(--mauve)}
  .sobre p{margin-bottom:18px;font-size:1.05rem}
  .creds{display:flex;flex-wrap:wrap;gap:10px;margin-top:26px}
  .cred{
    font-size:.8rem;background:var(--cream);color:var(--wine);
    border:1px solid rgba(166,125,123,.35);
    padding:.5rem .9rem;border-radius:999px;font-weight:500;
  }
  .cred.strong{background:var(--wine);color:#fff;border-color:var(--wine)}

  /* ---------- Seções genéricas ---------- */
  .section{padding:96px 0}
  .section-head{text-align:center;max-width:40rem;margin:0 auto 56px}
  .section-head .eyebrow{display:block;margin-bottom:14px}
  .section-head h2{font-size:2.7rem}
  .section-head p{margin-top:14px;color:var(--ink)}

  /* Especialidades */
  .cards{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
  .card{
    display:block;background:#fff;border:1px solid rgba(166,125,123,.18);
    border-radius:22px;padding:32px 28px;transition:transform .25s ease,box-shadow .25s ease;
    text-decoration:none;color:inherit;cursor:pointer;
  }
  .card:hover{transform:translateY(-5px);box-shadow:0 18px 40px -22px rgba(107,74,71,.4)}
  .card .ico{width:46px;height:46px;color:var(--wine);margin-bottom:18px}
  .card .ico svg{width:100%;height:100%;stroke:var(--wine);stroke-width:1.5;fill:none}
  .card h3{font-size:1.5rem;margin-bottom:8px}
  .card p{font-size:.95rem;color:var(--ink)}

/* Atendimento */
  .clinics{display:grid;grid-template-columns:1fr;gap:20px;max-width:560px;margin:0 auto}
  .clinic{
    display:flex;align-items:center;gap:18px;
    background:#fff;border:1px solid rgba(166,125,123,.2);
    border-radius:18px;padding:22px 26px;
    cursor:pointer;transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease;
    outline:none;
  }
  .clinic:hover,.clinic:focus-visible{transform:translateY(-4px);box-shadow:0 12px 28px -12px rgba(107,74,71,.35);border-color:var(--wine)}
  .clinic:focus-visible{outline:2px solid var(--wine);outline-offset:2px}
  .clinic .pin{width:40px;height:40px;flex-shrink:0;color:var(--wine)}
  .clinic .pin svg{width:100%;height:100%;stroke:var(--wine);stroke-width:1.5;fill:none}
  .clinic-info{flex:1}
  .clinic h3{font-size:1.3rem;margin-bottom:2px}
  .clinic-address{font-size:.86rem;color:var(--mauve);letter-spacing:.03em;display:block;line-height:1.4}
  .clinic-arrow{font-size:.9rem;color:var(--wine);font-weight:500;flex-shrink:0;white-space:nowrap}

  /* Modal de rota */
  .route-modal{display:none;position:fixed;top:0;left:0;right:0;bottom:0;z-index:100}
  .route-modal.open{display:flex}
  .route-overlay{position:absolute;inset:0;background:rgba(0,0,0,.4);backdrop-filter:blur(4px);cursor:pointer}
  .route-content{
    position:relative;z-index:101;
    background:#fff;border-radius:24px;padding:40px 32px;
    max-width:420px;width:90vw;margin:auto;
    box-shadow:0 20px 60px -10px rgba(107,74,71,.25);
    text-align:center;
  }
  .route-close{
    position:absolute;top:12px;right:12px;
    background:none;border:none;font-size:2rem;color:var(--ink);
    cursor:pointer;width:40px;height:40px;display:flex;align-items:center;justify-content:center;
    transition:color .2s;padding:0;
  }
  .route-close:hover{color:var(--wine)}
  .route-pin{width:56px;height:56px;margin:0 auto 16px;color:var(--wine)}
  .route-pin svg{width:100%;height:100%;stroke:var(--wine);stroke-width:1.5;fill:none}
  .route-content h3{font-size:1.6rem;margin-bottom:8px}
  .route-address{font-size:.95rem;color:var(--ink);margin-bottom:28px;line-height:1.6;display:block}
  .route-buttons{display:flex;flex-direction:column;gap:12px}
  .route-btn{
    display:flex;align-items:center;justify-content:center;gap:.5rem;
    padding:.85rem 1.4rem;border-radius:12px;
    font-family:'Inter',sans-serif;font-weight:500;font-size:.95rem;
    transition:all .25s ease;border:1px solid transparent;cursor:pointer;
  }
  .route-btn svg{width:20px;height:20px}
  .route-btn-waze{background:#33ccff;color:#fff;border-color:#33ccff}
  .route-btn-waze:hover{background:#2eb8d9;border-color:#2eb8d9;transform:translateY(-2px)}
  .route-btn-gmaps{background:#fff;color:#1a73e8;border:1px solid #1a73e8}
  .route-btn-gmaps:hover{background:#f8f9fa;border-color:#1a73e8;transform:translateY(-2px)}

  /* CTA final */
  .final-cta{padding:110px 0;text-align:center;position:relative;overflow:hidden}
  .final-cta .eyebrow{color:var(--mauve)}
  .final-cta h2{font-size:3.1rem;margin:16px auto 20px;max-width:26rem}
  .final-cta h2 em{font-style:italic;color:var(--mauve)}
  .final-cta p{max-width:32rem;margin:0 auto 34px;font-size:1.08rem}

  /* Rodapé */
  footer{background:var(--wine);color:#f3e3de;padding:64px 0 30px}
  .foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:40px;margin-bottom:44px}
  footer .fmono{font-family:'Cormorant Garamond',serif;font-style:italic;font-size:2rem;font-weight:600;color:#fff}
  footer .fname{font-size:.72rem;letter-spacing:.26em;text-transform:uppercase;color:var(--terracotta);margin:4px 0 16px}
  footer p{font-size:.92rem;color:#e6cfc9;line-height:1.8}
  footer h4{font-family:'Inter',sans-serif;font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;color:var(--terracotta);margin-bottom:14px;font-weight:600}
  footer a.fl{display:block;font-size:.92rem;color:#f3e3de;margin-bottom:9px;transition:color .2s}
  footer a.fl:hover{color:#fff}
  .foot-bottom{border-top:1px solid rgba(243,227,222,.2);padding-top:24px;text-align:center;font-size:.8rem;color:#dcc4be}

  /* Botão flutuante WhatsApp */
  .wa-float{
    position:fixed;right:22px;bottom:22px;z-index:60;
    width:60px;height:60px;border-radius:50%;
    background:var(--wa);display:flex;align-items:center;justify-content:center;
    box-shadow:0 10px 26px -6px rgba(37,211,102,.6);
    transition:transform .25s ease;
  }
  .wa-float:hover{transform:scale(1.08)}
  .wa-float svg{width:32px;height:32px;fill:#fff}

  /* ---------- Responsivo ---------- */
  @media (max-width:900px){
    .hero-grid,.sobre-grid{grid-template-columns:1fr;gap:40px}
    .hero{padding:120px 0 70px}
    .hero h1{font-size:2.9rem}
    .hero-copy{order:2}
    .hero-visual{order:1;width:min(360px,82vw);max-width:380px;margin:0 auto}
    .cards{grid-template-columns:1fr 1fr}
    .foot-grid{grid-template-columns:1fr 1fr}
    .nav-links{
      position:fixed;top:74px;left:0;right:0;
      background:var(--cream);flex-direction:column;gap:0;
      padding:8px 0;border-bottom:1px solid rgba(166,125,123,.2);
      transform:translateY(-140%);transition:transform .32s ease;
    }
    .nav-links.open{transform:translateY(0)}
    .nav-links a.lnk{width:100%;text-align:center;padding:14px 0}
    .nav-links .btn{margin:10px auto 14px}
    .menu-btn{display:block}
  }
  @media (max-width:560px){
    .wrap{padding:0 18px}
    .hero h1{font-size:2.4rem}
    .section,.sobre{padding:66px 0}
    .cards,.clinics{grid-template-columns:1fr}
    .section-head h2,.sobre h2,.final-cta h2{font-size:2.1rem}
    .foot-grid{grid-template-columns:1fr}
    .step{grid-template-columns:1fr;gap:6px}
    .step .num{font-size:2rem}
    .clinic-arrow{display:none}
    .route-content{max-width:90vw}
  }

  /* ===== Foto real da Dra. Beatriz ===== */
  /* Foto do hero como <img> real: altura vem da propria imagem, sem depender de aspect-ratio (corrige some no mobile) */
  .hero-photo{position:relative;width:min(300px,66vw);margin:0 auto}
  .hero-photo .halo{
    position:absolute;left:50%;top:38%;transform:translate(-50%,-50%);
    width:120%;height:0;padding-bottom:120%;border-radius:50%;z-index:0;
    background:radial-gradient(circle at 50% 42%, #f0dbd4 0%, #f4e6e1 52%, rgba(244,230,225,0) 72%);
  }
  .hero-photo .halo::before{content:"";position:absolute;inset:10%;border-radius:50%;border:1.5px solid rgba(166,125,123,.42)}
  .hero-photo .halo::after{content:"";position:absolute;inset:24%;border-radius:50%;border:1px solid rgba(166,125,123,.26)}
  .hero-photo .dr-cut{
    position:relative;z-index:1;display:block;width:100%;height:auto;
    -webkit-mask-image:linear-gradient(to bottom,#000 82%,transparent 100%);
    mask-image:linear-gradient(to bottom,#000 82%,transparent 100%);
    filter:drop-shadow(0 18px 30px rgba(107,74,71,.20));
  }
  .sobre-frame{border:none;padding:0;border-radius:50%;aspect-ratio:1;width:min(400px,82vw);max-width:400px;margin:0 auto;
    background:radial-gradient(circle at 50% 40%,#f0dbd4,#f4e6e1 70%);position:relative}
  .sobre-frame::after{content:"";position:absolute;inset:22px;border-radius:50%;border:1px solid rgba(166,125,123,.42);z-index:3;pointer-events:none}
  .sobre-frame .inner{border-radius:50%;aspect-ratio:1;
    background:url("../assets/img/dra-beatriz-sobre2.webp") center top/cover no-repeat, linear-gradient(160deg,#efdcd6,#f6e9e4)}

  .logo-img{height:52px;width:auto;display:block}
  .flogo-img{height:74px;width:auto;display:block;margin-bottom:18px}
  @media (max-width:560px){.logo-img{height:44px}}

  /* ================= HERO 2 (novo, editorial) ================= */
  .hero2{position:relative;min-height:100vh;overflow:hidden;display:flex;flex-direction:column;--line:rgba(166,125,123,.3);
    background:linear-gradient(105deg,#faf1ec,#f3e6e0 55%,#efe0da);font-family:'Inter',sans-serif;color:var(--ink)}
  .hero2 .arc{position:absolute;right:2%;top:50%;transform:translateY(-50%);width:46vw;max-width:560px;height:46vw;max-height:560px;border-radius:50%;z-index:0;background:radial-gradient(circle at 46% 44%,#efdcd4,#f1e4de 55%,rgba(241,228,222,0) 72%)}
  .hero2 .arc::after{content:"";position:absolute;inset:-4%;border-radius:50%;border:1px solid var(--line)}
  .hero2 .hero-photo{position:absolute;right:0;bottom:0;height:88vh;max-height:760px;width:auto;margin:0;z-index:1;-webkit-mask-image:linear-gradient(to bottom,#000 88%,transparent 100%);mask-image:linear-gradient(to bottom,#000 88%,transparent 100%)}
  .hero2 .scrim{position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(100deg,var(--cream) 20%,rgba(250,241,236,.75) 40%,rgba(250,241,236,0) 62%)}
  .hero2 .wrap{position:relative;z-index:2;max-width:1200px;width:100%;margin:0 auto;padding:0 40px 24px;flex:1 0 auto}
  .hero2 .nav{display:flex;align-items:center;justify-content:space-between;height:auto;padding:24px 0 0}
  .hero2 .brand{display:block}
  .hero2 .brand img{height:clamp(40px,5vw,52px);width:auto}
  .hero2 .menu{display:flex;gap:26px;align-items:center}
  .hero2 .menu a:not(.btn){color:var(--ink);font-size:.9rem;text-decoration:none;transition:color .2s}
  .hero2 .menu a:not(.btn):hover{color:var(--wine)}
  .hero2 .btn{background:var(--wine);color:#fff;border:1px solid var(--wine);border-radius:999px;padding:.8rem 1.5rem;font-size:.9rem;font-weight:500;display:inline-flex;align-items:center;gap:.5rem;text-decoration:none}
  .hero2 .menu-btn{display:none;background:none;border:none;cursor:pointer;padding:8px;z-index:6}
  .hero2 .content{max-width:min(560px,56%);padding:clamp(34px,6vw,60px) 0 0}
  .hero2 .eyebrow{letter-spacing:.2em;text-transform:uppercase;font-size:clamp(.6rem,1.6vw,.72rem);color:var(--mauve);font-weight:500;margin-bottom:clamp(12px,2.4vw,22px);display:block}
  .hero2 h1{font-family:'Cormorant Garamond',serif;font-weight:500;color:var(--wine);font-size:clamp(2rem,5.6vw,3.9rem);line-height:1.04;letter-spacing:.005em}
  .hero2 h1 em{font-style:italic;color:var(--mauve)}
  .hero2 .content p{margin:clamp(12px,2.4vw,22px) 0 clamp(18px,3vw,30px);font-size:clamp(.86rem,1.9vw,1.05rem);max-width:29rem}
  .hero2 .big-cta{font-size:clamp(.82rem,1.8vw,.98rem);padding:.85rem 1.8rem;margin-top:clamp(22px,4vw,36px)}
  .hero2 .feats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(12px,2vw,18px) clamp(16px,2.5vw,26px);margin-top:clamp(26px,4vw,44px);max-width:400px}
  .hero2 .feat{display:flex;align-items:center;gap:10px}
  .hero2 .feat .ic{width:clamp(22px,2.4vw,26px);height:clamp(22px,2.4vw,26px);flex-shrink:0}
  .hero2 .feat .ic svg{width:100%;height:100%;stroke:var(--wine);stroke-width:1.4;fill:none}
  .hero2 .feat .lb{font-size:clamp(.74rem,1.7vw,.82rem);font-weight:500;line-height:1.2}
  .hero2 .creds{position:relative;z-index:3;display:block;text-align:left;line-height:1.5;padding-left:16px;border-left:2px solid var(--mauve);margin:0 0 14px 40px}
  .hero2 .creds .nm{font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--wine);font-weight:600}
  .hero2 .creds .rg{font-size:.8rem}
  .hero2 .hero-foot{position:relative;z-index:3;border-top:1px solid var(--line)}
  .hero2 .hero-foot .row{max-width:1200px;margin:0 auto;padding:15px 40px;display:flex;justify-content:space-between;align-items:center}
  .hero2 .loc{display:flex;align-items:center;gap:8px;font-size:.9rem}
  .hero2 .loc svg{width:16px;height:16px;stroke:var(--wine);stroke-width:1.5;fill:none}
  .hero2 .tagline{letter-spacing:.26em;text-transform:uppercase;font-size:.72rem;color:var(--mauve)}
  @media (max-width:820px){
    .hero2 .menu{display:none;position:absolute;top:64px;right:24px;flex-direction:column;align-items:flex-start;background:var(--cream);border:1px solid var(--line);border-radius:12px;padding:14px 18px;gap:14px;z-index:6;box-shadow:0 18px 40px -24px rgba(107,74,71,.5)}
    .hero2 .menu.open{display:flex}
    .hero2 .menu-btn{display:block}
    .hero2{min-height:auto}
    .hero2 .wrap{padding:0 24px 22px;flex:none}
    .hero2 .content{max-width:54%}
    .hero2 .arc{right:-6%;width:52vw;height:52vw}
    .hero2 .hero-photo{width:min(50vw,420px);height:auto;top:120px;bottom:auto;right:-14px}
    .hero2 .creds{margin:22px 0 14px 24px}
    .hero2 .hero-foot .row{padding:14px 24px}
  }
  @media (max-width:560px){
    .hero2 .big-cta{white-space:nowrap;width:-moz-fit-content;width:fit-content;padding:.6rem 1.05rem;font-size:.76rem;gap:.35rem;margin-top:20px}
    .hero2 .content{max-width:52%}
    .hero2 .hero-photo{width:62vw;height:auto;top:130px;bottom:auto;right:-12vw}
    .hero2 .arc{width:58vw;height:58vw;top:38%}
    .hero2 .feats{grid-template-columns:1fr;max-width:100%;gap:14px}
    .hero2 .tagline{display:none}
  }
  @media (max-width:400px){
    .hero2 .content{max-width:56%}
    .hero2 .hero-photo{width:58vw;right:-18vw}
  }
