/* Escudero Odontologia - preto, cinza e dourado */
:root{
  --ink:#0c0d0f;
  --muted:#80838a;
  --paper:#ffffff;
  --bg:#0b0c0e;
  --gold:#C9A64E;        /* base */
  --gold-2:#E7C873;      /* light */
  --gold-3:#8A6B2F;      /* deep */
  --gray:#101216;
  --soft:#f5f7fa;
  --radius:18px;
  --max:1200px;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{font-family:Inter, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;color:var(--ink);background:#fff;line-height:1.5}
a{text-decoration:none;color:var(--gold-3)}
.container{max-width:var(--max);margin:0 auto;padding:0 20px}
.btn{display:inline-block;padding:12px 18px;border-radius:14px;background:linear-gradient(135deg,var(--gold),var(--gold-2));color:#1b1b1b;font-weight:800;letter-spacing:.2px}
.btn.ghost{background:transparent;color:var(--gold-2);border:2px solid var(--gold-2)}

.header{position:sticky;top:0;z-index:20;background:rgba(16,18,22,.9);backdrop-filter:blur(8px);border-bottom:1px solid #1d2026;color:#e9e9e9}
.header .wrap{display:flex;align-items:center;justify-content:space-between;padding:12px 0}
.brand{display:flex;align-items:center;gap:12px;color:#e9e9e9}
.brand img{height:40px}
.brand .name{font-weight:900;letter-spacing:.4px}
.nav{display:flex;gap:22px;align-items:center}
.nav a{color:#d7d7d7;opacity:.9}
.nav a:hover{color:#fff;opacity:1}
.menu-toggle{display:none;background:none;border:0;color:#fff;font-size:28px}

.hero{color:#eaeaea;background: radial-gradient(1000px 500px at 20% -10%, rgba(201,166,78,.35), transparent), 
       linear-gradient(180deg,#0e1218 0%, #0b0c0e 60%, #0b0c0e 100%);padding:80px 0 56px}
.hero .grid{display:grid;grid-template-columns:1.15fr 1fr;gap:36px;align-items:center}
h1{font-size:46px;line-height:1.1;margin:12px 0 10px}
.hero p{color:#c9cbd1;font-size:18px}
.h-eyebrow{display:inline-block;padding:6px 10px;border-radius:999px;border:1px solid rgba(231,200,115,.35);color:#e7c873;font-weight:700;font-size:12px;letter-spacing:.3px;text-transform:uppercase}
.kpis{display:flex;gap:18px;flex-wrap:wrap;margin-top:18px}
.kpi{background:#0f131a;border:1px solid #1b2028;border-radius:14px;padding:14px 16px;min-width:140px;color:#e3e6ef}
.kpi strong{display:block;font-size:24px;color:#e7c873}

.section{padding:60px 0}
.section h2{font-size:34px;margin:0 0 12px}
.section p.lead{color:#636a76;margin:0 0 26px}

.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.card{background:#fff;border:1px solid #ececec;border-radius:18px;padding:22px}
.card h3{margin:0 0 6px}
.badge{display:inline-block;padding:4px 10px;border-radius:999px;background:rgba(201,166,78,.12);color:#8a6b2f;font-weight:800;font-size:12px;letter-spacing:.3px}

.band{background:#0c0f15;color:#e9e9e9;padding:46px 0;border-top:1px solid #1d2026;border-bottom:1px solid #1d2026}
.band .wrap{display:flex;gap:20px;justify-content:space-between;align-items:center;flex-wrap:wrap}
.band .wrap p{margin:0;color:#c9cbd1}

.about{display:grid;grid-template-columns:1fr 1fr;gap:28px;align-items:center}
.about .pic{border-radius:18px;overflow:hidden;border:1px solid #ececec}

.testi{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.quote{background:#fff;border:1px solid #ececec;border-radius:16px;padding:18px}
.quote p{margin:0 0 10px;color:#333}
.quote .who{font-weight:700;color:#222}

.contact{display:grid;grid-template-columns:1fr 1fr;gap:28px}
.form input,.form textarea{width:100%;padding:12px 14px;border:1px solid #ddd;border-radius:12px;margin-bottom:12px}
.form textarea{min-height:120px;resize:vertical}

.info{background:#0f131a;color:#e9e9e9;border-radius:16px;padding:18px;border:1px solid #1b2028}
.info strong{color:#e7c873}

.footer{border-top:1px solid #ececec;padding:28px 0;color:#7a808a}
.footer a{color:inherit;}

@media (max-width:980px){
  .hero .grid, .about, .contact{grid-template-columns:1fr}
  .grid-3, .testi{grid-template-columns:1fr 1fr}
}
@media (max-width:640px){
  .grid-3, .testi{grid-template-columns:1fr}
  .nav{display:none}
  .menu-toggle{display:block}
}