/* XIPALAPLUTS · CALCULADORAS V1 */
.calculator-page {
  min-height: 100vh;
  color: var(--text, #0b1b33);
  background:
    radial-gradient(circle at 9% 0%, rgba(245,158,11,.11), transparent 30rem),
    radial-gradient(circle at 96% 4%, rgba(37,99,235,.08), transparent 27rem),
    linear-gradient(180deg,#fbfcff 0%,#f6f8fc 50%,#eef3f9 100%);
}
.calculator-page * { box-sizing: border-box; }
.calculator-page .container { width: min(1160px, calc(100% - 32px)); margin-inline: auto; }
.calc-header {
  position: sticky; top: 0; z-index: 30;
  border-bottom: 1px solid rgba(30,58,96,.08);
  background: rgba(255,255,255,.87);
  backdrop-filter: blur(18px) saturate(150%);
}
.calc-header__inner { min-height: 72px; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.calc-brand { display: inline-flex; align-items: center; gap: 11px; color: #0b1b33; text-decoration: none; font-weight: 950; letter-spacing: .05em; }
.calc-brand::before { content:"⚡"; display:grid; place-items:center; width:38px; height:38px; border-radius:13px; color:#fff; background:linear-gradient(135deg,#2563eb,#7c3aed); box-shadow:0 12px 28px rgba(49,92,214,.25); }
.calc-nav { display:flex; align-items:center; gap:22px; }
.calc-nav a { color:#586b82; text-decoration:none; font-weight:780; font-size:.92rem; }
.calc-nav a:hover { color:#0b1b33; }
.theme-toggle { width:42px; height:42px; border:1px solid rgba(30,58,96,.11); border-radius:13px; background:rgba(255,255,255,.94); color:#18304d; cursor:pointer; box-shadow:0 8px 24px rgba(30,58,96,.06); }
.tool-hero { padding:62px 0 32px; }
.breadcrumbs { display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin-bottom:24px; color:#718198; font-size:.88rem; }
.breadcrumbs a { color:#315f9f; text-decoration:none; font-weight:780; }
.tool-hero-grid { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:end; gap:36px; }
.category-badge { display:inline-flex; align-items:center; gap:8px; padding:8px 12px; border:1px solid rgba(245,158,11,.20); border-radius:999px; background:rgba(245,158,11,.09); color:#a15b08; font-size:.76rem; font-weight:900; letter-spacing:.09em; text-transform:uppercase; }
.tool-hero h1 { margin:17px 0 14px; max-width:820px; color:#0b1b33; font-size:clamp(2.6rem,6vw,5.2rem); line-height:.97; letter-spacing:-.045em; }
.tool-hero p { max-width:760px; margin:0; color:#5f7188; font-size:1.04rem; line-height:1.75; }
.tool-trust { display:flex; flex-wrap:wrap; gap:9px; margin-top:23px; }
.tool-trust span { padding:8px 11px; border:1px solid rgba(30,58,96,.09); border-radius:999px; background:rgba(255,255,255,.78); color:#52657d; font-size:.8rem; font-weight:760; }
.tool-icon-large { display:grid; place-items:center; width:110px; height:110px; border-radius:30px; color:#fff; font-size:2.3rem; font-weight:950; background:linear-gradient(135deg,#f59e0b 0%,#f97316 45%,#2563eb 100%); box-shadow:0 28px 70px rgba(218,117,15,.25); }
.workspace-section { padding:30px 0 76px; }
.workspace-grid { display:grid; grid-template-columns:minmax(0,1fr) 270px; gap:22px; align-items:start; }
.tool-app-card { position:relative; padding:clamp(20px,4vw,34px); border:1px solid rgba(31,57,94,.10); border-radius:28px; background:rgba(255,255,255,.97); box-shadow:0 28px 72px rgba(31,55,91,.13); overflow:hidden; }
.tool-app-card::before { content:""; position:absolute; inset:0 0 auto; height:4px; background:linear-gradient(90deg,#f59e0b,#f97316,#2563eb); }
.tool-app-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:20px; margin-bottom:26px; }
.tool-app-heading h2 { margin:0 0 7px; color:#0b1b33; font-size:1.35rem; }
.tool-app-heading p { margin:0; color:#708096; line-height:1.55; }
.available-pill { flex:0 0 auto; padding:8px 11px; border-radius:999px; background:rgba(34,197,94,.10); color:#15803d; font-size:.76rem; font-weight:900; }
.tool-side { display:grid; gap:14px; }
.side-card { padding:20px; border:1px solid rgba(31,57,94,.09); border-radius:20px; background:rgba(255,255,255,.80); box-shadow:0 14px 38px rgba(31,55,91,.07); }
.side-card h3 { margin:0 0 12px; color:#0b1b33; font-size:1rem; }
.side-list { list-style:none; padding:0; margin:0; display:grid; gap:12px; }
.side-list li { position:relative; padding-left:24px; color:#63748a; font-size:.9rem; line-height:1.45; }
.side-list li::before { content:"✓"; position:absolute; left:0; top:0; color:#f59e0b; font-weight:950; }
.editor-layout { display:grid; gap:18px; }
.calculator-fields { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
.calculator-fields-three { grid-template-columns:repeat(3,minmax(0,1fr)); }
.field { display:grid; gap:8px; }
.field label { color:#18304d; font-weight:850; font-size:.92rem; }
.tool-input,.tool-select,.tool-textarea { width:100%; border:1px solid rgba(31,57,94,.12); border-radius:15px; outline:none; color:#0b1b33; background:#f9fbfe; transition:border-color .2s ease,box-shadow .2s ease,background .2s ease; }
.tool-input,.tool-select { min-height:48px; padding:0 14px; }
.tool-textarea { min-height:160px; padding:15px; resize:vertical; line-height:1.65; }
.tool-input:focus,.tool-select:focus,.tool-textarea:focus { border-color:#5f79e8; background:#fff; box-shadow:0 0 0 4px rgba(96,116,232,.10); }
.input-with-addon { display:grid; grid-template-columns:1fr auto; align-items:center; border:1px solid rgba(31,57,94,.12); border-radius:15px; background:#f9fbfe; overflow:hidden; }
.input-with-addon .tool-input { border:0; border-radius:0; box-shadow:none; }
.input-with-addon span { padding:0 14px; color:#6d7e93; font-weight:850; }
.compound-input { display:grid; grid-template-columns:1fr 120px; gap:8px; }
.calc-tabs { display:flex; flex-wrap:wrap; gap:8px; }
.calc-tab { padding:10px 13px; border:1px solid rgba(31,57,94,.10); border-radius:12px; background:#f7f9fc; color:#53667e; font-weight:820; cursor:pointer; }
.calc-tab.active { color:#fff; border-color:transparent; background:linear-gradient(135deg,#f59e0b,#ea6c17); box-shadow:0 10px 23px rgba(229,112,19,.20); }
.button { display:inline-flex; align-items:center; justify-content:center; min-height:46px; padding:0 18px; border-radius:13px; border:1px solid transparent; font:inherit; font-weight:880; cursor:pointer; transition:transform .18s ease,box-shadow .18s ease,opacity .18s ease; }
.button:hover { transform:translateY(-2px); }
.button-primary { color:#fff; background:linear-gradient(135deg,#f59e0b 0%,#f97316 52%,#2563eb 100%); box-shadow:0 15px 30px rgba(222,113,20,.22); }
.button-secondary { color:#18304d; border-color:rgba(31,57,94,.11); background:#fff; box-shadow:0 8px 22px rgba(31,55,91,.055); }
.button-ghost-danger { color:#be3151; border-color:rgba(190,49,81,.13); background:rgba(251,113,133,.055); }
.button-wide { width:100%; }
.button:disabled { opacity:.45; cursor:not-allowed; transform:none; box-shadow:none; }
.tool-actions { display:flex; flex-wrap:wrap; gap:10px; }
.tool-status { min-height:22px; margin:0; color:#6e7f94; font-size:.87rem; font-weight:700; }
.tool-status.success { color:#168143; }
.tool-status.error { color:#c53b59; }
.result-panel { padding:24px; border:1px solid rgba(245,158,11,.18); border-radius:20px; background:linear-gradient(145deg,#fff9eb,#f5f8ff); text-align:center; }
.result-kicker { display:block; color:#9a610f; font-size:.74rem; font-weight:900; text-transform:uppercase; letter-spacing:.09em; }
.result-panel strong { display:block; margin:8px 0 4px; color:#0b1b33; font-size:clamp(2rem,5vw,3.3rem); }
.result-panel p { margin:0; color:#6f7f93; line-height:1.55; }
.result-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:11px; }
.result-card { padding:18px; border:1px solid rgba(31,57,94,.09); border-radius:17px; background:linear-gradient(155deg,#fff,#f4f7fc); text-align:center; }
.result-card.featured { border-color:rgba(245,158,11,.22); background:linear-gradient(145deg,#fff8e7,#fff); }
.result-card span { color:#74849a; font-size:.78rem; }
.result-card strong { display:block; margin-top:7px; color:#0b1b33; font-size:1.35rem; }
.panel-soft { padding:19px; border:1px solid rgba(31,57,94,.09); border-radius:18px; background:#f5f8fc; }
.field-heading { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:12px; }
.micro-copy { color:#76869a; font-size:.78rem; font-weight:700; }
.table-shell { overflow-x:auto; border:1px solid rgba(31,57,94,.09); border-radius:14px; background:#fff; }
.result-table { width:100%; border-collapse:collapse; min-width:580px; }
.result-table th,.result-table td { padding:11px 12px; border-bottom:1px solid rgba(31,57,94,.08); text-align:right; }
.result-table th:first-child,.result-table td:first-child { text-align:left; }
.result-table th { color:#52667e; background:#f4f7fb; font-size:.74rem; text-transform:uppercase; letter-spacing:.05em; }
.result-table td { color:#354d68; font-size:.85rem; }
.table-empty { padding:26px !important; color:#7d8ca0 !important; text-align:center !important; }
.growth-bars { display:grid; gap:13px; padding:18px; border:1px solid rgba(31,57,94,.09); border-radius:16px; background:#f7f9fc; }
.growth-bars > div { display:grid; grid-template-columns:110px 1fr; align-items:center; gap:12px; color:#61738a; font-size:.82rem; font-weight:800; }
.growth-track { height:10px; overflow:hidden; border-radius:999px; background:#e6ebf2; }
.growth-track i { display:block; width:0; height:100%; border-radius:inherit; background:linear-gradient(90deg,#f59e0b,#2563eb); transition:width .3s ease; }
.formula-box { display:grid; gap:7px; padding:17px; border-radius:15px; color:#b6c6d9; background:#0d1d34; }
.formula-box span { font-size:.74rem; text-transform:uppercase; letter-spacing:.08em; }
.formula-box code { color:#8fd3ff; font-size:.94rem; }
.bmi-result { display:grid; gap:18px; padding:22px; border:1px solid rgba(31,57,94,.09); border-radius:20px; background:#f7f9fc; }
.bmi-score { text-align:center; }
.bmi-score span { color:#718198; font-size:.8rem; }
.bmi-score strong { display:block; margin:4px 0; color:#0b1b33; font-size:3rem; }
.bmi-score small { color:#60728a; font-weight:800; }
.bmi-scale { position:relative; display:grid; grid-template-columns:1fr 2fr 1.3fr 2fr; height:12px; border-radius:999px; overflow:visible; }
.bmi-scale i { display:block; }
.bmi-scale .under { border-radius:999px 0 0 999px; background:#38bdf8; }
.bmi-scale .normal { background:#22c55e; }
.bmi-scale .over { background:#f59e0b; }
.bmi-scale .obese { border-radius:0 999px 999px 0; background:#ef4444; }
.bmi-scale span { position:absolute; top:-5px; left:0; width:4px; height:22px; border-radius:999px; background:#0b1b33; transform:translateX(-50%); transition:left .3s ease; }
.bmi-labels { display:grid; grid-template-columns:1fr 2fr 1.3fr 2fr; color:#78889c; font-size:.7rem; text-align:center; }
.notice-box { padding:14px 16px; border:1px solid rgba(245,158,11,.15); border-radius:14px; background:rgba(245,158,11,.06); color:#765b31; font-size:.84rem; line-height:1.55; }
.detail-list { display:grid; gap:9px; }
.detail-list > div { display:flex; justify-content:space-between; gap:20px; padding:12px 14px; border:1px solid rgba(31,57,94,.08); border-radius:13px; background:#f7f9fc; color:#65768b; }
.detail-list strong { color:#213b59; }
.check-card { display:flex; align-items:flex-start; gap:10px; padding:13px; border:1px solid rgba(31,57,94,.09); border-radius:14px; background:#f8fafd; cursor:pointer; }
.check-card input { margin-top:3px; accent-color:#f59e0b; }
.check-card span { display:grid; gap:3px; }
.check-card strong { color:#203a59; font-size:.86rem; }
.check-card small { color:#7a899d; line-height:1.4; }
.single-check { width:100%; }
.hidden { display:none !important; }
.proportion-grid { display:grid; grid-template-columns:1fr auto 1fr; align-items:end; gap:12px; }
.proportion-symbol { padding-bottom:13px; color:#75859a; font-size:1.5rem; font-weight:900; }
.unknown-box { display:grid; place-items:center; min-height:48px; border:1px dashed rgba(245,158,11,.35); border-radius:15px; color:#c16c08; background:rgba(245,158,11,.07); font-size:1.35rem; font-weight:950; }
.option-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.option-grid-compact { grid-template-columns:repeat(2,minmax(0,1fr)); }
.metrics-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
.metrics-grid-six { grid-template-columns:repeat(6,minmax(0,1fr)); }
.metric-card { padding:16px 12px; border:1px solid rgba(31,57,94,.09); border-radius:16px; background:linear-gradient(155deg,#fff,#f4f7fc); text-align:center; }
.metric-card strong { display:block; color:#0b1b33; font-size:1.35rem; overflow-wrap:anywhere; }
.metric-card span { color:#74849a; font-size:.76rem; }
.number-list { margin:0; color:#4f647d; line-height:1.65; overflow-wrap:anywhere; }
.quick-tip-buttons { display:flex; flex-wrap:wrap; gap:8px; }
.quick-tip-buttons button { padding:9px 13px; border:1px solid rgba(31,57,94,.10); border-radius:11px; background:#f7f9fc; color:#53667e; font-weight:850; cursor:pointer; }
.quick-tip-buttons button.active { color:#fff; border-color:transparent; background:#f59e0b; }
.info-section { padding:76px 0; }
.info-section.alt { border-block:1px solid rgba(31,57,94,.07); background:rgba(255,255,255,.52); }
.section-heading { max-width:720px; margin-bottom:28px; }
.section-kicker { color:#b56509; font-size:.76rem; font-weight:900; letter-spacing:.11em; text-transform:uppercase; }
.section-heading h2 { margin:9px 0 10px; color:#0b1b33; font-size:clamp(1.8rem,4vw,3rem); }
.section-heading p { margin:0; color:#66778d; line-height:1.7; }
.steps-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:15px; }
.step-card { padding:22px; border:1px solid rgba(31,57,94,.09); border-radius:20px; background:#fff; box-shadow:0 14px 38px rgba(31,55,91,.07); }
.step-card span { display:grid; place-items:center; width:34px; height:34px; border-radius:11px; color:#fff; background:linear-gradient(135deg,#f59e0b,#f97316); font-weight:900; }
.step-card h3 { margin:16px 0 7px; color:#0b1b33; font-size:1rem; }
.step-card p { margin:0; color:#708096; line-height:1.55; }
.related-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }
.related-card { display:block; padding:20px; border:1px solid rgba(31,57,94,.09); border-radius:19px; background:#fff; color:inherit; text-decoration:none; box-shadow:0 14px 36px rgba(31,55,91,.065); transition:transform .2s ease,box-shadow .2s ease; }
.related-card:hover { transform:translateY(-4px); box-shadow:0 22px 48px rgba(31,55,91,.11); }
.related-card span { display:inline-grid; place-items:center; width:42px; height:42px; margin-bottom:13px; border-radius:13px; background:rgba(245,158,11,.10); font-size:1.15rem; font-weight:900; }
.related-card h3 { margin:0 0 6px; color:#0b1b33; font-size:1rem; }
.related-card p { margin:0; color:#718198; font-size:.86rem; line-height:1.5; }
.faq-list { display:grid; gap:10px; max-width:900px; }
.faq-item { border:1px solid rgba(31,57,94,.09); border-radius:16px; background:#fff; overflow:hidden; }
.faq-item summary { padding:17px 19px; color:#193451; font-weight:850; cursor:pointer; }
.faq-item p { margin:0; padding:0 19px 18px; color:#6b7c92; line-height:1.65; }
.calc-footer { padding:44px 0; color:#a8b9cd; background:linear-gradient(145deg,#071426,#0c1d36); }
.footer-inner { display:flex; align-items:center; justify-content:space-between; gap:20px; flex-wrap:wrap; }
.footer-inner strong { color:#fff; }
.footer-inner a { color:#a8b9cd; text-decoration:none; }
.footer-inner a:hover { color:#fff; }

html[data-theme="dark"] .calculator-page { color:#f8fafc; background:radial-gradient(circle at 10% 0%,rgba(245,158,11,.14),transparent 30rem),radial-gradient(circle at 96% 4%,rgba(37,99,235,.13),transparent 27rem),linear-gradient(180deg,#07111f,#0a1729 48%,#07111f); }
html[data-theme="dark"] .calc-header { border-color:rgba(148,163,184,.14); background:rgba(7,17,31,.84); }
html[data-theme="dark"] .calc-brand,html[data-theme="dark"] .tool-hero h1,html[data-theme="dark"] .tool-app-heading h2,html[data-theme="dark"] .side-card h3,html[data-theme="dark"] .field label,html[data-theme="dark"] .result-card strong,html[data-theme="dark"] .result-panel strong,html[data-theme="dark"] .bmi-score strong,html[data-theme="dark"] .detail-list strong,html[data-theme="dark"] .section-heading h2,html[data-theme="dark"] .step-card h3,html[data-theme="dark"] .related-card h3,html[data-theme="dark"] .faq-item summary { color:#f8fafc; }
html[data-theme="dark"] .calc-nav a,html[data-theme="dark"] .tool-hero p,html[data-theme="dark"] .side-list li,html[data-theme="dark"] .tool-app-heading p,html[data-theme="dark"] .section-heading p,html[data-theme="dark"] .step-card p,html[data-theme="dark"] .related-card p,html[data-theme="dark"] .faq-item p { color:#9fb0c8; }
html[data-theme="dark"] .tool-app-card,html[data-theme="dark"] .side-card,html[data-theme="dark"] .step-card,html[data-theme="dark"] .related-card,html[data-theme="dark"] .faq-item { border-color:rgba(148,163,184,.15); background:rgba(15,29,51,.96); box-shadow:0 25px 65px rgba(2,8,23,.35); }
html[data-theme="dark"] .tool-input,html[data-theme="dark"] .tool-select,html[data-theme="dark"] .tool-textarea,html[data-theme="dark"] .input-with-addon { color:#f8fafc; border-color:rgba(148,163,184,.17); background:#081526; }
html[data-theme="dark"] .result-panel,html[data-theme="dark"] .result-card,html[data-theme="dark"] .panel-soft,html[data-theme="dark"] .growth-bars,html[data-theme="dark"] .bmi-result,html[data-theme="dark"] .detail-list>div,html[data-theme="dark"] .check-card,html[data-theme="dark"] .metric-card { border-color:rgba(148,163,184,.14); background:#0a182b; }
html[data-theme="dark"] .button-secondary,html[data-theme="dark"] .calc-tab,html[data-theme="dark"] .quick-tip-buttons button { color:#dce7f5; border-color:rgba(148,163,184,.15); background:#0a182b; }
html[data-theme="dark"] .result-table th { color:#b4c3d6; background:#0d1c31; }
html[data-theme="dark"] .result-table td { color:#dce7f5; border-color:rgba(148,163,184,.10); }
html[data-theme="dark"] .table-shell { border-color:rgba(148,163,184,.14); background:#0a182b; }
html[data-theme="dark"] .info-section.alt { border-color:rgba(148,163,184,.10); background:rgba(255,255,255,.018); }
html[data-theme="dark"] .notice-box { color:#e5c995; background:rgba(245,158,11,.08); }
html[data-theme="dark"] .detail-list strong,html[data-theme="dark"] .check-card strong { color:#e9f0f9; }
html[data-theme="dark"] .number-list { color:#b9c8da; }

@media(max-width:940px){
  .workspace-grid{grid-template-columns:1fr}.tool-side{grid-template-columns:repeat(2,minmax(0,1fr))}
  .calculator-fields-three,.metrics-grid-six{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:700px){
  .calculator-page .container{width:min(100% - 22px,1160px)}.calc-header__inner{min-height:66px}.calc-nav{display:none}
  .tool-hero{padding-top:45px}.tool-hero-grid{grid-template-columns:1fr;gap:22px}.tool-icon-large{width:82px;height:82px;border-radius:23px;font-size:1.7rem}
  .workspace-section{padding-bottom:56px}.tool-app-card{border-radius:22px}.tool-app-heading{display:grid}.available-pill{width:max-content}
  .calculator-fields,.calculator-fields-three,.option-grid,.option-grid-compact,.steps-grid,.related-grid,.tool-side{grid-template-columns:1fr}
  .result-grid,.metrics-grid,.metrics-grid-six{grid-template-columns:repeat(2,minmax(0,1fr))}
  .proportion-grid{grid-template-columns:1fr auto 1fr}.tool-actions .button{flex:1 1 100%}.info-section{padding:58px 0}.footer-inner{display:grid}
}
@media(max-width:460px){.result-grid,.metrics-grid,.metrics-grid-six{grid-template-columns:1fr}.compound-input{grid-template-columns:1fr}.proportion-grid{grid-template-columns:1fr}.proportion-symbol{display:none}}
