:root{
  --paper:#FAFAF7; --card:#FFFFFF; --ink:#161616; --muted:#71716B;
  --line:#E7E6E1; --accent:#0d9488; --accent-ink:#FFFFFF; --accent2:#0891b2;
  --wa:#25D366;
}
@media (prefers-color-scheme: dark){
  :root{
    --paper:#141413; --card:#1B1B1A; --ink:#F1F0EC; --muted:#97968E;
    --line:#2B2B28; --accent:#2dd4bf; --accent-ink:#0f172a; --accent2:#38bdf8;
  }
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0; background:var(--paper); color:var(--ink);
  font-family:'Inter',system-ui,-apple-system,sans-serif;
  line-height:1.6; -webkit-font-smoothing:antialiased;
}
::selection{background:var(--accent);color:var(--accent-ink)}
a{color:var(--accent);text-decoration:none}
a:hover{text-decoration:underline}
img{max-width:100%;display:block}
.wrap{max-width:1080px;margin:0 auto;padding:0 20px}
.wrap-narrow{max-width:720px;margin:0 auto;padding:0 20px}

h1,h2,h3{font-family:'Fraunces',serif;font-weight:500;letter-spacing:-0.02em}
h1{letter-spacing:-0.03em;line-height:1.05}
.eyebrow{text-transform:uppercase;letter-spacing:.14em;font-size:.72rem;font-weight:600;color:var(--muted)}

/* HEADER */
header.top{border-bottom:1px solid var(--line);position:sticky;top:0;background:var(--paper);z-index:30}
.topbar{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;max-width:1080px;margin:0 auto}
.wordmark{font-family:'Fraunces',serif;font-style:italic;font-weight:600;font-size:1.35rem;letter-spacing:-0.01em;color:var(--ink);white-space:nowrap}
.wordmark .co{color:var(--accent)}
.topnav{display:flex;align-items:center;gap:22px}
.topnav a{color:var(--muted);font-size:.92rem;font-weight:500}
.topnav a:hover{color:var(--ink);text-decoration:none}
.topnav .cta-wa{background:var(--accent);color:var(--accent-ink);padding:9px 18px;border-radius:999px;font-weight:700}
.topnav .cta-wa:hover{opacity:.9;text-decoration:none}
.navmenu{display:none}
@media(max-width:760px){
  .topnav a:not(.cta-wa){display:none}
  .topbar{padding:14px 16px}
}

/* HERO (subpage: centered, narrow) */
.hero{padding:56px 20px 44px;border-bottom:1px solid var(--line)}
.hero-inner{max-width:760px;margin:0 auto;text-align:center}
.hero-inner .eyebrow{display:inline-block;margin-bottom:14px}
h1{font-size:2.1rem;margin:0 0 16px;color:var(--ink)}
.hero p.lead{color:var(--muted);font-size:1.05rem;line-height:1.65;max-width:620px;margin:0 auto 26px}
@media(min-width:640px){h1{font-size:2.5rem}}
.hero-ctas{display:flex;gap:12px;flex-wrap:wrap;justify-content:center}

/* HOME HERO (two-column, like reservy/barberias) */
.home-hero{padding:clamp(12px,2vw,28px) 0 0}
.hero-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:48px;align-items:center}
.hero-grid h1{font-size:clamp(2rem,4.4vw,2.9rem);margin:14px 0 18px}
.hero-grid .lead{color:var(--muted);font-size:1.05rem;line-height:1.65;max-width:480px;margin:0 0 28px}
.hero-grid .actions{display:flex;gap:12px;flex-wrap:wrap}
@media(max-width:820px){.hero-grid{grid-template-columns:1fr;gap:40px}.mock{max-width:420px;margin:0 auto}}

/* MOCK CARD (product-preview visual, right column of home hero) */
.mock{background:var(--card);border:1px solid var(--line);border-radius:20px;padding:18px 18px 16px}
.mock-top{display:flex;align-items:center;gap:8px;font-size:.74rem;font-weight:600;letter-spacing:.08em;
  text-transform:uppercase;color:var(--muted);margin-bottom:12px}
.mock-dot{width:8px;height:8px;border-radius:50%;background:#25D366}
.chat{display:flex;flex-direction:column;gap:8px}
.chat-b{max-width:82%;padding:9px 13px;border-radius:14px;font-size:.86rem;line-height:1.45}
.chat-in{background:var(--paper);border:1px solid var(--line);align-self:flex-start;border-bottom-left-radius:4px}
.chat-out{background:#DCF8C6;color:#1a1a1a;align-self:flex-end;border-bottom-right-radius:4px}
@media (prefers-color-scheme: dark){.chat-out{background:#0b5b45;color:#eafff2}}
.chat-time{font-size:.68rem;color:var(--muted);text-align:right;margin-top:-4px}

/* FEATURE STRIP (4-col, thin top border, like reservy/barberias) */
.feats{display:grid;grid-template-columns:repeat(4,1fr);gap:32px;padding:48px 0 60px}
.feat{border-top:1px solid var(--line);padding-top:18px}
.feat h3{font-size:1.15rem;margin-bottom:6px}
.feat p{color:var(--muted);font-size:.92rem;margin:0}
@media(max-width:820px){.feats{grid-template-columns:1fr 1fr;gap:24px}}
@media(max-width:520px){.feats{grid-template-columns:1fr}}

/* BUTTONS */
.btn{display:inline-flex;align-items:center;gap:8px;padding:13px 26px;border-radius:999px;font-weight:700;font-size:.95rem;border:1px solid transparent;cursor:pointer}
.btn:hover{text-decoration:none}
.btn-wa{background:var(--wa);color:#fff}
.btn-wa:hover{filter:brightness(1.05)}
.btn-ghost{background:var(--card);color:var(--ink);border-color:var(--line)}
.btn-ghost:hover{border-color:var(--ink)}

/* CARDS / SECTIONS */
main{padding:28px 0 0}
section{padding:40px 0}
section h2{font-size:1.5rem;font-weight:800;margin:0 0 14px;color:var(--ink)}
section p{color:var(--muted);line-height:1.75;margin:0 0 14px}
section p strong,article p strong{color:var(--ink)}
.card{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:24px}
.grid{display:grid;gap:16px}
.grid-2{grid-template-columns:repeat(2,1fr)}
.grid-3{grid-template-columns:repeat(3,1fr)}
@media(max-width:700px){.grid-2,.grid-3{grid-template-columns:1fr}}

/* DOCTOR BADGE */
.doc-badge{display:flex;align-items:center;gap:14px;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:14px 18px;margin:20px 0}
.doc-badge img{width:52px;height:52px;border-radius:50%;object-fit:cover;flex-shrink:0}
.doc-badge .name{font-weight:700;color:var(--ink);font-size:.95rem}
.doc-badge .role{color:var(--muted);font-size:.82rem}

/* HIGHLIGHT / NOTE */
.note{background:var(--card);border-left:3px solid var(--accent);border-radius:0 12px 12px 0;padding:16px 20px;margin:18px 0}
.note p{margin:0;font-size:.93rem}

/* FAQ */
.faq-item{border-bottom:1px solid var(--line);padding:18px 0}
.faq-item:last-child{border-bottom:none}
.faq-item h3{font-size:1rem;font-weight:700;color:var(--ink);margin:0 0 8px}
.faq-item p{margin:0;font-size:.92rem}

/* RELATED / LINKS LIST */
.rel{display:flex;flex-wrap:wrap;gap:10px;margin-top:8px}
.rel a{background:var(--card);border:1px solid var(--line);border-radius:999px;padding:8px 16px;font-size:.85rem;color:var(--ink)}
.rel a:hover{border-color:var(--accent);text-decoration:none;color:var(--accent)}

/* CTA BLOCK */
.cta-block{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:32px 24px;text-align:center;margin:32px 0}
.cta-block h2{margin-top:0}
.cta-block p{max-width:520px;margin-left:auto;margin-right:auto}

/* BREADCRUMBS */
.crumbs{font-size:.8rem;color:var(--muted);padding:16px 0 0}
.crumbs a{color:var(--muted)}
.crumbs a:hover{color:var(--accent)}

/* FOOTER */
footer.site{border-top:1px solid var(--line);padding:36px 20px;margin-top:50px}
.footnav{max-width:960px;margin:0 auto;display:flex;flex-wrap:wrap;gap:10px 22px;justify-content:center;font-size:.85rem;color:var(--muted)}
.footnav a{color:var(--muted)}
.footnav a:hover{color:var(--accent)}
.footbottom{text-align:center;color:var(--muted);font-size:.78rem;margin-top:20px}

/* WHATSAPP FLOAT */
.wa-float{position:fixed;bottom:20px;right:20px;z-index:40;display:flex;align-items:center;gap:9px;
  background:var(--wa);color:#fff;padding:13px 20px;border-radius:999px;font-weight:700;font-size:.9rem;
  box-shadow:0 6px 20px rgba(0,0,0,.18)}
.wa-float:hover{text-decoration:none;filter:brightness(1.05)}
.wa-float svg{width:20px;height:20px;fill:#fff;flex-shrink:0}
@media(max-width:600px){.wa-float span{display:none}.wa-float{padding:14px}.mock{padding-bottom:76px}}

/* QUIZ WIDGET (shared pattern across test-*.html) */
.quiz{max-width:600px;margin:0 auto;border:1px solid var(--line);border-radius:18px;padding:28px 22px;background:var(--card)}
@media(min-width:640px){.quiz{padding:36px 32px}}
.quiz-gauge{position:relative;height:10px;border-radius:6px;background:var(--line);overflow:hidden;margin:6px 0 22px}
.quiz-gauge-fill{height:100%;background:linear-gradient(90deg,var(--accent),var(--accent2));border-radius:6px;transition:width .5s ease}
.quiz-step{font-size:.78rem;color:var(--muted);margin-bottom:10px}
.quiz-q{font-size:1.08rem;font-weight:700;color:var(--ink);line-height:1.5;margin-bottom:20px;min-height:2.8em}
.quiz-opts{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.quiz-opt{padding:14px 10px;border:2px solid var(--line);border-radius:12px;background:var(--paper);
  font-size:.86rem;font-weight:600;color:var(--ink);text-align:center;cursor:pointer}
.quiz-opt:hover{border-color:var(--accent);color:var(--accent)}
.quiz-result-title{font-size:1.2rem;font-weight:800;margin-bottom:6px}
.quiz-badge{display:inline-block;padding:5px 14px;border-radius:999px;font-size:.82rem;font-weight:700;margin-bottom:16px}
.quiz-badge.low{background:#dcfce7;color:#166534}
.quiz-badge.mid{background:#fef9c3;color:#854d0e}
.quiz-badge.high{background:#fee2e2;color:#991b1b}
.quiz-text{color:var(--muted);font-size:.93rem;line-height:1.65;margin-bottom:22px}
.quiz-reset{display:block;margin:14px auto 0;background:none;border:none;color:var(--muted);font-size:.8rem;text-decoration:underline;cursor:pointer}
.quiz-disclaimer{font-size:.72rem;color:var(--muted);text-align:center;margin-top:16px;line-height:1.5}