:root{--bg:#f5f2eb;--paper:#fffdf8;--panel:#fbfaf6;--ink:#20302d;--ink-dim:#61706c;--accent:#567b78;--accent-dark:#315957;--accent-soft:#dce8e5;--line:#d7ddd8;--hero-img:url('fondo.png')}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
html,body{background:var(--bg);color:var(--ink);font-family:'Inter',system-ui,-apple-system,'Segoe UI',sans-serif;line-height:1.65;-webkit-font-smoothing:antialiased}
h1,h2,h3,.brand{font-family:Georgia,'Times New Roman',serif;font-weight:600;letter-spacing:-.025em}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.container{max-width:1160px;margin:0 auto;padding:0 clamp(22px,4vw,52px)}
.nav{position:sticky;top:0;z-index:10;background:rgba(255,253,248,.96);border-bottom:1px solid var(--line)}
.nav-inner{display:flex;align-items:center;justify-content:space-between;height:72px}
.brand{font-size:19px;letter-spacing:-.02em}.brand span{color:var(--accent)}
.nav-links{display:flex;gap:30px;font-size:13px;color:var(--ink-dim)}
.nav-links a{padding:7px 0;border-bottom:1px solid transparent}.nav-links a:hover{color:var(--accent-dark);border-color:var(--accent)}
.btn{display:inline-block;padding:11px 20px;border-radius:4px;border:1px solid transparent;font-weight:600;font-size:13px;letter-spacing:.01em;transition:background .18s,color .18s,border-color .18s}
.btn-primary{background:var(--accent-dark);color:#fff}.btn-primary:hover{background:#244745}
.btn-ghost{border-color:rgba(32,48,45,.32);color:var(--ink);background:rgba(255,253,248,.78)}.btn-ghost:hover{border-color:var(--accent-dark);color:var(--accent-dark)}
.hero{min-height:660px;padding:112px 0 104px;position:relative;display:flex;align-items:center;overflow:hidden;background:var(--hero-img) center/cover no-repeat}
.hero::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(247,244,237,.98) 0%,rgba(247,244,237,.93) 34%,rgba(247,244,237,.48) 58%,rgba(247,244,237,.05) 82%);pointer-events:none}
.hero .container{position:relative;z-index:1;width:100%}
.eyebrow{display:inline-block;font-size:11px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;color:var(--accent-dark);margin-bottom:20px;border-bottom:1px solid var(--accent);padding-bottom:5px}
.hero h1{font-size:clamp(40px,5.2vw,67px);line-height:1.02;max-width:15ch}
.hero p.lead{margin-top:25px;color:#4f5e5a;font-size:16px;max-width:54ch}
.hero-cta{margin-top:36px;display:flex;gap:10px;flex-wrap:wrap}
.section{padding:86px 0 74px;border-top:1px solid var(--line)}.section:nth-of-type(even){background:var(--paper)}
.section h2{font-size:clamp(30px,3.6vw,46px);line-height:1.12;max-width:19ch}.section p.sub{color:var(--ink-dim);margin-top:15px;max-width:64ch}
.grid{display:grid;gap:0 34px;margin-top:42px;grid-template-columns:repeat(auto-fit,minmax(270px,1fr))}
.card{background:transparent;border:0;border-top:1px solid var(--line);border-radius:0;padding:22px 0 30px}.card:nth-child(3n+1){border-top-color:var(--accent)}
.card h3{font-size:20px;line-height:1.25;margin-bottom:10px}.card p{color:var(--ink-dim);font-size:14px;max-width:42ch}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:0;margin-top:48px;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.kpi{padding:27px 18px;background:transparent;border:0;border-right:1px solid var(--line);border-radius:0;text-align:left}.kpi:last-child{border-right:0}
.kpi b{display:block;font-size:32px;line-height:1;color:var(--accent-dark);font-family:Georgia,'Times New Roman',serif;font-weight:600}.kpi span{display:block;margin-top:8px;color:var(--ink-dim);font-size:12px;text-transform:uppercase;letter-spacing:.06em}
.cta-band{margin:92px 0 70px;padding:54px clamp(26px,6vw,72px);border-radius:6px;background:var(--accent-dark);border:0;color:#fff;text-align:left}
.cta-band h2{max-width:18ch;font-size:clamp(30px,4vw,46px);line-height:1.1}.cta-band .sub{color:#dce8e5!important;max-width:58ch!important}.cta-band .btn{margin-top:28px;background:var(--paper);color:var(--accent-dark)}
footer{padding:34px 0;border-top:1px solid var(--line);color:var(--ink-dim);font-size:12px;text-align:left}footer a{color:var(--accent-dark);font-weight:600}
.badge{display:inline-block;padding:0 0 5px;border-radius:0;border-bottom:1px solid var(--accent);background:transparent;color:var(--accent-dark);font-size:11px;font-weight:700;letter-spacing:1.4px;text-transform:uppercase;margin-bottom:16px}
@media (max-width:760px){.nav-links{display:none}.hero{min-height:620px;padding:82px 0 70px;background-position:62% center}.hero::before{background:linear-gradient(90deg,rgba(247,244,237,.98),rgba(247,244,237,.86))}.section{padding:64px 0 52px}.grid{grid-template-columns:1fr;margin-top:34px}.kpis{grid-template-columns:repeat(2,1fr)}.kpi{border-bottom:1px solid var(--line)}.kpi:nth-child(2n){border-right:0}.cta-band{margin:66px 0 48px;padding:38px 24px}}
/* WDS local hero background override */
:root { --hero-img: url('fondo.png'); }
.hero {
  min-height: 730px;
  padding: 470px 0 96px;
  background-image: linear-gradient(180deg, rgba(var(--bg-rgb, 12, 13, 15), .68), rgba(var(--bg-rgb, 12, 13, 15), .90)), var(--hero-img);
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}
.hero h1,
.hero h2 { max-width: 27ch; }
.hero p.lead { max-width: 79ch; }
@media (max-width: 640px) {
  .hero {
    min-height: 360px;
    padding: 360px 0 56px;
  }
}
/* WDS dentist hero readability */
.hero::before {
  background: linear-gradient(90deg, rgba(245, 242, 235, .36) 0%, rgba(245, 242, 235, .22) 42%, rgba(15, 22, 20, .28) 100%);
}
.hero .container {
  width: min(980px, calc(100% - 48px));
  padding: clamp(26px, 4vw, 44px);
  border-radius: 10px;
  background: linear-gradient(90deg, rgba(255, 253, 248, .88), rgba(255, 253, 248, .64));
  box-shadow: 0 22px 70px rgba(18, 28, 26, .18);
  backdrop-filter: blur(3px);
}
.hero h1 {
  max-width: 27ch;
  color: #20302d;
}
.hero .lead {
  max-width: 79ch;
  color: #354640;
}
@media (max-width: 640px) {
  .hero .container {
    width: min(100% - 30px, 1160px);
    padding: 24px;
  }
}
/* WDS premium readable section headings */
@media (min-width: 821px) {
  .section h2,
  .cta-band h2 {
    max-width: none;
    white-space: nowrap;
    overflow-wrap: normal;
    word-break: normal;
  }
}
@media (max-width: 820px) {
  .section h2,
  .cta-band h2 {
    white-space: normal;
  }
}