/* Waist-to-Hip Ratio Calculator — page-specific styles */
.whr-hero { padding-top: 22px; }
.whr-breadcrumb { display:flex; flex-wrap:wrap; gap:7px; align-items:center; margin-bottom:26px; color:var(--slate-500); font:12px/1.4 'Inter',sans-serif; }
.whr-breadcrumb a { color:var(--navy); font-weight:600; }
.whr-breadcrumb a:hover { color:var(--vitred); }
.whr-hero-grid { gap:48px; }
.whr-lead { font-size:17px; line-height:1.75; color:var(--slate-700); }
.whr-direct-answer { background:#fff; border:1px solid var(--slate-200); border-left:4px solid var(--vitred); border-radius:0 12px 12px 0; padding:14px 16px; margin:20px 0; color:var(--slate-700); font:14px/1.65 'Inter',sans-serif; box-shadow:0 3px 12px rgba(15,23,42,.04); }
.whr-direct-answer strong { color:var(--navy); }
.whr-stat-row { margin-top:20px; }
.whr-calculator-card { border-top:4px solid var(--vitred); }
.whr-calc-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:15px; margin-bottom:20px; }
.whr-calc-heading h2 { font-size:20px; margin:2px 0 0; }
.whr-kicker { color:var(--vitred); font:700 10px/1.2 'Inter',sans-serif; letter-spacing:.08em; text-transform:uppercase; }
.whr-field-label { margin:14px 0 6px; color:var(--slate-600); font:700 11px/1.3 'Inter',sans-serif; text-transform:uppercase; letter-spacing:.05em; }
.whr-toggle { display:grid; grid-template-columns:1fr 1fr; gap:4px; background:var(--slate-100); border:1px solid var(--slate-200); padding:4px; border-radius:10px; }
.whr-toggle-btn { border:0; border-radius:7px; padding:9px 12px; background:transparent; color:var(--slate-600); cursor:pointer; font:700 12px/1.2 'Lexend',sans-serif; transition:.2s ease; }
.whr-toggle-btn:hover { color:var(--navy); }
.whr-toggle-btn.active { background:var(--navy); color:#fff; box-shadow:0 3px 8px rgba(29,53,87,.18); }
.whr-input-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-top:16px; }
.whr-required { color:var(--vitred); }
.whr-muted { color:var(--slate-400); font-size:9px; text-transform:none; letter-spacing:0; }
.whr-unit-suffix { position:absolute; right:12px; top:50%; transform:translateY(-50%); color:var(--slate-500); font:700 12px/1 'Inter',sans-serif; pointer-events:none; }
.whr-calculator-card .calc-input { padding-right:45px; }
.whr-calculator-card .calc-input.whr-no-icon { padding-left:12px; }
.whr-context-toggle { width:100%; display:flex; flex-direction:column; align-items:flex-start; gap:3px; margin:14px 0 0; padding:11px 13px; border:1px dashed #94a3b8; border-radius:10px; background:#f8fafc; color:var(--navy); cursor:pointer; text-align:left; font:700 12px/1.3 'Lexend',sans-serif; }
.whr-context-toggle:hover { border-color:var(--navy); background:#f1f5f9; }
.whr-context-toggle small { color:var(--slate-500); font:500 10px/1.3 'Inter',sans-serif; }
.whr-extra-context { padding:2px 0 0; }
.whr-helper { margin:8px 0 0; font-size:10.5px; line-height:1.5; color:var(--slate-500); }
.whr-helper a { color:var(--vitred); font-weight:700; }
.whr-error { display:none; margin-top:12px; padding:10px 12px; border:1px solid #fecaca; border-radius:9px; background:#fef2f2; color:#991b1b; font:600 12px/1.5 'Inter',sans-serif; }
.whr-error.show { display:block; }
.whr-calculator-card .calc-btn { margin-top:14px; }
.whr-result { display:none; margin-top:18px; padding-top:18px; border-top:1px solid var(--slate-200); }
.whr-result.show { display:block; animation:whrFade .25s ease; }
@keyframes whrFade { from{opacity:0;transform:translateY(5px)} to{opacity:1;transform:none} }
.whr-result-top { display:flex; align-items:center; justify-content:space-between; gap:16px; }
.whr-result-label { color:var(--slate-500); font:700 10px/1.2 'Inter',sans-serif; letter-spacing:.06em; text-transform:uppercase; }
.whr-result-value { margin-top:2px; color:var(--navy); font:800 44px/1 'Lexend',sans-serif; }
.whr-result-badge { border-radius:999px; padding:6px 10px; background:#e2e8f0; color:#475569; font:700 10px/1.2 'Inter',sans-serif; text-align:center; }
.whr-result-badge.below { background:#dcfce7; color:#166534; }
.whr-result-badge.at { background:#fef3c7; color:#854d0e; }
.whr-result-badge.above { background:#fee2e2; color:#991b1b; }
.whr-gauge { margin:18px 0 12px; }
.whr-gauge-track { position:relative; height:10px; border-radius:999px; background:linear-gradient(90deg,#22c55e 0%,#84cc16 45%,#f59e0b 65%,#ef4444 100%); }
.whr-gauge-marker { position:absolute; top:50%; left:0; width:18px; height:18px; border:3px solid #fff; border-radius:50%; background:var(--navy); box-shadow:0 1px 7px rgba(15,23,42,.35); transform:translate(-50%,-50%); transition:left .35s ease; }
.whr-gauge-labels { display:flex; justify-content:space-between; gap:8px; margin-top:7px; color:var(--slate-500); font:600 9px/1.2 'Inter',sans-serif; }
.whr-result-text { padding:11px 13px; border-radius:10px; background:#f8fafc; color:var(--slate-700); font-size:12px; line-height:1.6; }
.whr-result-grid { display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-top:10px; }
.whr-mini-card { min-height:64px; padding:10px 11px; border:1px solid var(--slate-200); border-radius:10px; background:#fff; }
.whr-mini-card span { display:block; margin-bottom:5px; color:var(--slate-500); font:600 9px/1.2 'Inter',sans-serif; text-transform:uppercase; letter-spacing:.04em; }
.whr-mini-card strong { color:var(--navy); font:700 13px/1.35 'Lexend',sans-serif; }
.whr-optional-result { display:none; }
.whr-optional-result.show { display:block; }
.whr-result-note { margin-top:10px; padding:10px 12px; border-left:3px solid #3b82f6; background:#eff6ff; color:#1e3a8a; font:500 10.5px/1.55 'Inter',sans-serif; }
.whr-actions { display:grid; grid-template-columns:repeat(4,1fr); gap:6px; margin-top:10px; }
.whr-actions button { padding:8px 4px; border:1px solid var(--slate-200); border-radius:8px; background:#fff; color:var(--slate-600); cursor:pointer; font:700 9px/1.2 'Inter',sans-serif; }
.whr-actions button:hover { border-color:var(--navy); color:var(--navy); }
.whr-copy-status { min-height:16px; margin-top:5px; color:#166534; font:600 10px/1.4 'Inter',sans-serif; text-align:center; }

.whr-content-section { background:#fff; }
.whr-article { min-width:0; }
.whr-article .content-section { padding:8px 0 32px; scroll-margin-top:100px; }
.whr-article .content-section + .content-section { border-top:1px solid var(--slate-200); padding-top:32px; }
.whr-article p, .whr-article li { font-size:15.5px; }
.whr-article a { color:var(--vitred); font-weight:600; }
.whr-key-box { margin:22px 0 0; padding:18px 20px; border-radius:12px; border:1px solid #bfdbfe; background:#eff6ff; }
.whr-key-box h3 { margin:0 0 6px; font-size:16px; }
.whr-key-box p { margin:0; color:#1e3a8a; }
.whr-key-box-red { border-color:#fecaca; background:#fef2f2; }
.whr-key-box-red p { color:#7f1d1d; }
.whr-measure-visual { overflow:hidden; margin:24px 0; border:1px solid var(--slate-200); border-radius:16px; background:#f8fafc; }
.whr-measure-visual svg { display:block; width:100%; height:auto; }
.whr-steps { margin:0 0 24px 22px; color:var(--slate-600); }
.whr-steps li { margin-bottom:8px; padding-left:5px; line-height:1.65; }
.whr-formula-box { display:flex; flex-direction:column; gap:7px; margin:20px 0; padding:22px; border-radius:14px; background:linear-gradient(135deg,var(--navy),#2d4f7f); color:#fff; text-align:center; }
.whr-formula-box span { color:#cbd5e1; font:600 12px/1.3 'Inter',sans-serif; text-transform:uppercase; letter-spacing:.06em; }
.whr-formula-box strong { font:700 clamp(17px,3vw,24px)/1.4 'Lexend',sans-serif; }
.whr-example { display:flex; justify-content:space-between; align-items:center; gap:16px; margin:12px 0 22px; padding:14px 16px; border:1px solid var(--slate-200); border-radius:10px; background:#f8fafc; color:var(--slate-600); font:600 14px/1.4 'Inter',sans-serif; }
.whr-example strong { color:var(--vitred); font-family:'Lexend',sans-serif; }
.whr-table-wrap { overflow-x:auto; margin:20px 0; border:1px solid var(--slate-200); border-radius:12px; }
.whr-table { width:100%; min-width:620px; border-collapse:collapse; font:14px/1.5 'Inter',sans-serif; }
.whr-table th,.whr-table td { padding:14px 16px; border-bottom:1px solid var(--slate-200); text-align:left; }
.whr-table thead th { background:var(--navy); color:#fff; font:700 12px/1.4 'Lexend',sans-serif; }
.whr-table tbody th { color:var(--navy); }
.whr-table tbody tr:last-child th,.whr-table tbody tr:last-child td { border-bottom:0; }
.whr-table td:last-child { background:#fff7ed; color:#9a3412; font-weight:700; }
.whr-compare-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin:20px 0; }
.whr-compare-card { display:flex; flex-direction:column; min-height:190px; padding:18px; border:1px solid var(--slate-200); border-radius:12px; background:#f8fafc; }
.whr-compare-card h3 { margin-bottom:8px; font-size:16px; }
.whr-compare-card p { margin-bottom:12px; font-size:13.5px; }
.whr-compare-card span,.whr-compare-card a { margin-top:auto; color:var(--vitred); font:700 11px/1.4 'Inter',sans-serif; }
.whr-check-list { list-style:none; margin:20px 0; display:flex; flex-direction:column; gap:10px; }
.whr-check-list li { position:relative; padding:13px 14px 13px 42px; border:1px solid var(--slate-200); border-radius:10px; background:#f8fafc; color:var(--slate-600); }
.whr-check-list li::before { content:'✓'; position:absolute; left:14px; top:13px; display:grid; place-items:center; width:20px; height:20px; border-radius:50%; background:#dbeafe; color:#1d4ed8; font-weight:800; }
.whr-next-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin:20px 0; }
.whr-next-grid > div { position:relative; padding:18px; border:1px solid var(--slate-200); border-radius:12px; background:#fff; box-shadow:0 3px 12px rgba(15,23,42,.04); }
.whr-next-grid > div > strong { display:grid; place-items:center; width:28px; height:28px; margin-bottom:12px; border-radius:50%; background:var(--navy); color:#fff; font:700 12px 'Lexend',sans-serif; }
.whr-next-grid h3 { font-size:15px; margin-bottom:6px; }
.whr-next-grid p { margin:0; font-size:13px; }
.whr-related-cta { display:flex; align-items:center; justify-content:space-between; gap:24px; margin-top:24px; padding:24px; border-radius:16px; background:linear-gradient(135deg,var(--navy),#2d4f7f); }
.whr-related-cta span { color:#fca5a5; font:700 10px 'Inter',sans-serif; text-transform:uppercase; letter-spacing:.06em; }
.whr-related-cta h3 { margin:5px 0; color:#fff; }
.whr-related-cta p { margin:0; color:#cbd5e1; font-size:13px; }
.whr-related-cta > a { flex-shrink:0; padding:11px 15px; border-radius:9px; background:var(--vitred); color:#fff; font:700 12px 'Lexend',sans-serif; }
.whr-faq-list { display:flex; flex-direction:column; gap:9px; }
.whr-faq-list details { border:1px solid var(--slate-200); border-radius:10px; background:#fff; overflow:hidden; }
.whr-faq-list summary { position:relative; padding:15px 45px 15px 16px; color:var(--navy); cursor:pointer; list-style:none; font:700 14px/1.4 'Lexend',sans-serif; }
.whr-faq-list summary::-webkit-details-marker { display:none; }
.whr-faq-list summary::after { content:'+'; position:absolute; right:16px; top:12px; color:var(--vitred); font-size:22px; }
.whr-faq-list details[open] summary::after { content:'−'; }
.whr-faq-list details p { margin:0; padding:0 16px 16px; font-size:14px; }
.whr-sources ol { margin:14px 0 16px 22px; }
.whr-sources li { margin-bottom:9px; }
.whr-reviewed { color:var(--slate-500); font-size:12px !important; font-style:italic; }
.whr-sidebar { align-self:start; }
.whr-sidebar .sidebar-card { margin-bottom:16px; }
.whr-sidebar .sidebar-card > p { font-size:12.5px; line-height:1.6; }
.whr-author-card { padding:0; border:0; background:transparent; }
.whr-toc nav { display:flex; flex-direction:column; }
.whr-toc .toc-link { padding:8px 0; border-bottom:1px solid var(--slate-100); color:var(--slate-600); font:600 12px/1.4 'Inter',sans-serif; }
.whr-toc .toc-link.active,.whr-toc .toc-link:hover { color:var(--vitred); }
.whr-sidebar .health-item { margin-bottom:9px; padding:9px; border:1px solid var(--slate-200); border-radius:10px; }
.whr-source-card { border-top:3px solid var(--navy); }
.whr-source-card > a { color:var(--vitred); font:700 12px 'Inter',sans-serif; }

@media (max-width:1024px) {
  .whr-sidebar { position:static; }
}
@media (max-width:768px) {
  .whr-hero { padding-top:16px; }
  .whr-lead { font-size:15.5px; }
  .whr-calculator-card { padding:20px 16px; }
  .whr-input-grid,.whr-compare-grid,.whr-next-grid { grid-template-columns:1fr; }
  .whr-related-cta { align-items:flex-start; flex-direction:column; }
  .whr-related-cta > a { width:100%; text-align:center; }
  .whr-compare-card { min-height:0; }
}
@media (max-width:480px) {
  .whr-result-top { align-items:flex-start; }
  .whr-result-value { font-size:38px; }
  .whr-result-grid { grid-template-columns:1fr; }
  .whr-actions { grid-template-columns:1fr 1fr; }
  .whr-example { align-items:flex-start; flex-direction:column; gap:6px; }
  .whr-measure-visual { display:none; }
}
@media print {
  .whr-breadcrumb,.whr-actions,.whr-sidebar,.whr-context-toggle,.calc-btn,header,footer,#progress-bar { display:none !important; }
  .whr-result { display:block !important; }
  .grid-2,.grid-3 { display:block; }
  .whr-calculator-card { box-shadow:none; border:1px solid #999; }
}