/* =========================================================
   Dr. Alex Ramos — Fisioterapia Geriátrica
   Design tokens
   ========================================================= */
:root{
  --ink:#14262B;
  --teal-deep:#173634;
  --teal-mid:#2E5C56;
  --teal-pale:#DCE7E4;
  --gold:#B9915A;
  --gold-light:#E4CFA6;
  --sand:#F4EEE1;
  --white:#FFFFFF;
  --whatsapp:#25D366;
  --line:rgba(20,38,43,0.12);
  --shadow: 0 20px 50px -25px rgba(20,38,43,0.35);
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
  *{animation-duration:0.01ms !important; animation-iteration-count:1 !important; transition-duration:0.01ms !important;}
}
body{
  margin:0;
  font-family:'Inter',sans-serif;
  color:var(--ink);
  background:var(--sand);
  -webkit-font-smoothing:antialiased;
  line-height:1.6;
}
h1,h2,h3,.display{
  font-family:'Fraunces',serif;
  font-weight:600;
  letter-spacing:-0.01em;
  margin:0;
}
a{color:inherit;}
img{max-width:100%;display:block;}
.wrap{max-width:1180px;margin:0 auto;padding:0 32px;}
.eyebrow{
  font-family:'Inter',sans-serif;
  text-transform:uppercase;
  letter-spacing:0.16em;
  font-size:12.5px;
  font-weight:700;
  color:var(--gold);
}
:focus-visible{outline:3px solid var(--gold); outline-offset:3px;}
.skip-link{
  position:absolute;left:-9999px;top:0;background:var(--teal-deep);color:#fff;
  padding:12px 20px;border-radius:0 0 10px 0;z-index:100;font-weight:700;
}
.skip-link:focus{left:0;}

/* ===== NAV ===== */
header.nav{
  position:sticky; top:0; z-index:50;
  background:rgba(244,238,225,0.9);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line);
}
.nav-inner{
  max-width:1180px;margin:0 auto;padding:16px 32px;
  display:flex;align-items:center;justify-content:space-between;
}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;}
.brand-mark{
  width:38px;height:38px;border-radius:50%;
  background:var(--teal-deep);
  display:flex;align-items:center;justify-content:center;
  color:var(--gold-light); font-family:'Fraunces',serif; font-weight:600; font-size:17px;
  flex:none;
}
.brand-text{font-family:'Fraunces',serif;font-weight:600;font-size:18px;line-height:1.1;color:var(--ink);}
.brand-text span{display:block;font-family:'Inter',sans-serif;font-weight:600;font-size:11px;letter-spacing:0.08em;text-transform:uppercase;color:var(--teal-mid);margin-top:2px;}
nav.links{display:flex;gap:32px;font-size:14.5px;font-weight:600;}
nav.links a{text-decoration:none;color:var(--ink);opacity:0.75;transition:opacity .2s;}
nav.links a:hover{opacity:1;}
.btn{
  display:inline-flex;align-items:center;gap:10px;
  padding:12px 22px;border-radius:30px;
  font-weight:700;font-size:14.5px;text-decoration:none;
  border:1px solid transparent; cursor:pointer;
  transition:transform .18s ease, box-shadow .18s ease;
}
.btn:hover{transform:translateY(-2px);}
.btn-whatsapp{background:var(--whatsapp);color:#fff;box-shadow:0 10px 24px -10px rgba(37,211,102,0.6);}
.btn-whatsapp svg{width:18px;height:18px;flex:none;}
.btn-outline{border-color:var(--teal-deep);color:var(--teal-deep);background:transparent;}
.btn-gold{background:var(--gold);color:#fff;box-shadow:0 10px 24px -10px rgba(185,145,90,0.6);}
.nav-cta{display:flex;align-items:center;gap:10px;}

/* ===== MOBILE MENU TOGGLE ===== */
.menu-toggle{
  display:none;
  width:42px;height:42px;border-radius:10px;border:1px solid var(--line);
  background:var(--white); align-items:center;justify-content:center;
  cursor:pointer;
}
.menu-toggle span,.menu-toggle span::before,.menu-toggle span::after{
  content:"";display:block;width:20px;height:2px;background:var(--teal-deep);
  position:relative;transition:transform .25s ease, opacity .25s ease;
}
.menu-toggle span::before{position:absolute;top:-6px;}
.menu-toggle span::after{position:absolute;top:6px;}
.menu-toggle[aria-expanded="true"] span{background:transparent;}
.menu-toggle[aria-expanded="true"] span::before{transform:translateY(6px) rotate(45deg);}
.menu-toggle[aria-expanded="true"] span::after{transform:translateY(-6px) rotate(-45deg);}

.mobile-panel{
  display:none;
  position:fixed;inset:0 0 0 auto;top:73px;
  background:var(--sand);
  border-top:1px solid var(--line);
  width:100%;
  z-index:49;
  padding:24px 32px 32px;
  flex-direction:column;gap:18px;
  transform:translateY(-8px);opacity:0;
  transition:transform .22s ease, opacity .22s ease;
  pointer-events:none;
}
.mobile-panel.open{opacity:1;transform:translateY(0);pointer-events:auto;}
.mobile-panel a{font-family:'Fraunces',serif;font-size:22px;text-decoration:none;color:var(--teal-deep);}

/* ===== HERO ===== */
.hero{padding:72px 0 96px;}
.hero-grid{display:grid;grid-template-columns:1.05fr 0.95fr;gap:64px;align-items:center;}
.hero h1{font-size:clamp(34px,4.6vw,54px);line-height:1.08;margin:18px 0 22px;color:var(--teal-deep);}
.hero h1 em{font-style:italic;color:var(--gold);}
.hero p.lead{font-size:18px;color:#3B4E51;max-width:46ch;margin-bottom:32px;}
.hero-actions{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:40px;}
.hero-stats{display:flex;gap:0;border-top:1px solid var(--line);padding-top:24px;}
.stat{padding-right:32px;margin-right:32px;border-right:1px solid var(--line);}
.stat:last-child{border-right:none;margin-right:0;padding-right:0;}
.stat b{display:block;font-family:'Fraunces',serif;font-size:26px;color:var(--teal-deep);}
.stat span{font-size:12.5px;color:#5A6B6D;}

.hero-photo{position:relative;}
.hero-photo .frame{position:relative;border-radius:18px;overflow:hidden;box-shadow:var(--shadow);aspect-ratio:4/5;}
.hero-photo img{width:100%;height:100%;object-fit:cover;}
.hero-photo .tag{
  position:absolute; bottom:-22px; left:-22px;
  background:var(--white); border-radius:14px; padding:16px 20px;
  box-shadow:var(--shadow); display:flex; gap:12px; align-items:center;
  max-width:250px;
}
.hero-photo .tag .dot{width:10px;height:10px;border-radius:50%;background:var(--whatsapp);flex:none;margin-top:5px;}
.hero-photo .tag b{display:block;font-size:13.5px;}
.hero-photo .tag small{color:#5A6B6D;font-size:12px;}

/* ===== SECTION HEADS ===== */
section{padding:88px 0;}
.section-head{max-width:640px;margin-bottom:52px;}
.section-head h2{font-size:clamp(28px,3.4vw,38px);color:var(--teal-deep);margin-top:14px;}
.section-head p{color:#4A5A5C;font-size:16.5px;margin-top:14px;}

/* ===== SOBRE ===== */
.about{background:var(--white);}
.about-grid{display:grid;grid-template-columns:0.85fr 1.15fr;gap:64px;align-items:center;}
.about-photo{border-radius:18px;overflow:hidden;box-shadow:var(--shadow);}
.about-photo img{width:100%;object-fit:cover;}
.about-text p{color:#3B4E51;font-size:16.5px;margin-bottom:18px;}
.credentials{list-style:none;margin:28px 0 0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:14px 24px;}
.credentials li{display:flex;gap:10px;font-size:14.5px;font-weight:600;color:var(--teal-deep);align-items:flex-start;}
.credentials li::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--gold);margin-top:8px;flex:none;}

/* ===== ESPECIALIDADES ===== */
.specialties{background:var(--sand);}
.spec-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;}
.spec-card{background:var(--white); border-radius:16px; padding:30px 26px; border:1px solid var(--line); transition:transform .2s ease, box-shadow .2s ease;}
.spec-card:hover{transform:translateY(-4px);box-shadow:var(--shadow);}
.spec-icon{width:46px;height:46px;border-radius:12px;background:var(--teal-pale);display:flex;align-items:center;justify-content:center;margin-bottom:18px;}
.spec-icon svg{width:22px;height:22px;stroke:var(--teal-deep);}
.spec-card h3{font-size:18px;color:var(--teal-deep);margin-bottom:8px;}
.spec-card p{font-size:14.5px;color:#5A6B6D;margin:0;}

/* ===== TRAJETORIA / TIMELINE (signature element) ===== */
.journey{background:var(--teal-deep);color:var(--white);}
.journey .eyebrow{color:var(--gold-light);}
.journey .section-head h2{color:var(--white);}
.journey .section-head p{color:#C7D6D3;}
.timeline{position:relative;padding-left:40px;}
.timeline::before{
  content:"";position:absolute;left:9px;top:6px;bottom:6px;width:2px;
  background:repeating-linear-gradient(to bottom, var(--gold) 0 6px, transparent 6px 14px);
}
.t-item{position:relative;padding-bottom:40px;}
.t-item:last-child{padding-bottom:0;}
.t-item::before{
  content:"";position:absolute;left:-40px;top:2px;width:20px;height:20px;border-radius:50%;
  background:var(--teal-deep); border:3px solid var(--gold);
}
.t-item h3{font-family:'Fraunces',serif;font-size:19px;color:var(--gold-light);margin-bottom:6px;}
.t-item p{font-size:15px;color:#DCE7E4;margin:0;max-width:60ch;}

/* ===== DIFERENCIAIS ===== */
.diff{background:var(--white);}
.diff-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;}
.diff-card{padding:26px 4px;border-top:2px solid var(--gold);}
.diff-card b{display:block;font-family:'Fraunces',serif;font-size:20px;color:var(--teal-deep);margin-bottom:10px;}
.diff-card p{font-size:14.5px;color:#5A6B6D;margin:0;}

/* ===== CTA / CONTATO ===== */
.contact{background:var(--gold-light);}
.contact-card{
  background:var(--teal-deep); color:var(--white);
  border-radius:24px; padding:64px; display:grid; grid-template-columns:1.1fr 0.9fr; gap:48px; align-items:center;
}
.contact-card h2{color:var(--white);font-size:clamp(26px,3.2vw,36px);}
.contact-card p{color:#C7D6D3;font-size:16px;margin-top:14px;max-width:44ch;}
.contact-actions{display:flex;gap:14px;margin-top:30px;flex-wrap:wrap;}
.contact-list{display:flex;flex-direction:column;gap:18px;}
.contact-row{display:flex;align-items:center;gap:14px;padding:16px 18px;background:rgba(255,255,255,0.06);border-radius:12px;text-decoration:none;color:var(--white);border:1px solid rgba(255,255,255,0.1);transition:background .2s;}
.contact-row:hover{background:rgba(255,255,255,0.12);}
.contact-row .ic{width:20px;height:20px;flex:none;stroke:var(--gold-light);}
.contact-row span{font-size:14.5px;font-weight:600;}
.contact-row small{display:block;font-size:11.5px;color:#A9BFBB;font-weight:400;text-transform:uppercase;letter-spacing:0.06em;}

/* ===== FOOTER ===== */
footer{background:var(--teal-deep);color:#A9BFBB;padding:32px 0;border-top:1px solid rgba(255,255,255,0.08);}
.footer-inner{display:flex;justify-content:space-between;align-items:center;font-size:13px;flex-wrap:wrap;gap:12px;}

/* ===== FLOATING WHATSAPP ===== */
.float-wa{
  position:fixed;bottom:22px;right:22px;z-index:60;
  width:60px;height:60px;border-radius:50%;background:var(--whatsapp);
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 14px 30px -8px rgba(37,211,102,0.65);
  text-decoration:none;
}
.float-wa svg{width:28px;height:28px;fill:#fff;}
.float-wa:hover{transform:scale(1.06);}

/* ===== SCROLL REVEAL ===== */
.reveal{opacity:0;transform:translateY(18px);transition:opacity .6s ease, transform .6s ease;}
.reveal.in-view{opacity:1;transform:translateY(0);}

/* ===== RESPONSIVE ===== */
@media (max-width:900px){
  nav.links{display:none;}
  .menu-toggle{display:flex;}
  .hero-grid,.about-grid,.contact-card{grid-template-columns:1fr;}
  .hero-photo{order:-1;max-width:380px;margin:0 auto;}
  .spec-grid{grid-template-columns:1fr 1fr;}
  .diff-grid{grid-template-columns:1fr 1fr;}
  .credentials{grid-template-columns:1fr;}
  .contact-card{padding:40px 26px;}
  section{padding:64px 0;}
}
@media (max-width:560px){
  .wrap{padding:0 20px;}
  .spec-grid,.diff-grid{grid-template-columns:1fr;}
  .hero-stats{flex-wrap:wrap;gap:20px 0;}
  .stat{border-right:none;margin-right:0;padding-right:0;flex:1 1 45%;}
  .hero-photo .tag{position:static;margin-top:16px;max-width:none;}
}
