/* Sistema visual compartido para las herramientas públicas de El Capitalista. */
:root{
  --tool-ink:#142039;
  --tool-blue:#102d62;
  --tool-blue-2:#1c4b91;
  --tool-sky:#eef4fc;
  --tool-paper:#f7f4ed;
  --tool-white:#fff;
  --tool-yellow:#f5c625;
  --tool-teal:#157f79;
  --tool-muted:#667189;
  --tool-line:#d5ddeb;
  --tool-radius:22px;
  --tool-radius-sm:14px;
  --tool-shadow:0 22px 60px rgba(16,45,98,.12);
}

.tool-page{background:linear-gradient(180deg,#fff 0,#f7f4ed 680px)}
.tool-page .tool-hero{padding:0;background:transparent;border-bottom:0}
.tool-page .tool-hero-grid{
  display:grid;
  grid-template-columns:minmax(0,1.08fr) minmax(360px,.92fr);
  gap:clamp(36px,5vw,76px);
  align-items:center;
  padding-block:clamp(44px,6vw,76px);
}
.tool-hero-copy{min-width:0}
.tool-hero-eyebrow{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:18px}
.tool-hero-eyebrow .content-badge{margin:0}
.tool-hero-copy h1{
  max-width:12ch;
  margin:0;
  color:var(--tool-blue);
  font:700 clamp(3rem,5.8vw,5.7rem)/.92 Georgia,serif;
  letter-spacing:-.06em;
  text-wrap:balance;
}
.tool-hero-copy>p{
  max-width:640px;
  margin:22px 0 0;
  color:#43506a;
  font:italic clamp(1.08rem,1.8vw,1.3rem)/1.55 Georgia,serif;
}
.tool-hero-benefit{
  display:grid;
  gap:6px;
  max-width:680px;
  margin-top:26px;
  padding:17px 20px;
  background:var(--tool-sky);
  border-left:4px solid var(--tool-yellow);
  border-radius:0 12px 12px 0;
}
.tool-hero-benefit span,.tool-hero-meta span,.tool-copy-heading>span{
  color:var(--tool-blue);
  font-size:.69rem;
  font-weight:900;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.tool-hero-benefit strong{color:var(--tool-ink);font-size:.96rem;line-height:1.45}
.tool-hero-meta{display:flex;gap:9px;flex-wrap:wrap;margin-top:20px}
.tool-hero-meta span{
  display:inline-flex;
  align-items:center;
  gap:7px;
  padding:8px 11px;
  color:#3e4a61;
  background:#fff;
  border:1px solid var(--tool-line);
  border-radius:999px;
  letter-spacing:.04em;
  text-transform:none;
}
.tool-hero-meta b{color:var(--tool-teal)}
.tool-hero-copy .byline-card{margin-top:22px}
.tool-hero-visual{
  position:relative;
  min-width:0;
  margin:0;
  overflow:hidden;
  aspect-ratio:5/4;
  background:#dfe8f7;
  border:1px solid rgba(16,45,98,.2);
  border-radius:28px;
  box-shadow:var(--tool-shadow);
}
.tool-hero-visual img{width:100%;height:100%;object-fit:cover}
.tool-hero-visual figcaption{
  position:absolute;
  left:16px;
  right:16px;
  bottom:16px;
  padding:10px 13px;
  color:#fff;
  background:rgba(16,45,98,.88);
  backdrop-filter:blur(8px);
  border-radius:10px;
  font-size:.74rem;
  font-weight:800;
}

.tool-body{width:min(1260px,calc(100% - 40px));padding-bottom:96px}
.tool-stage{position:relative;margin-top:12px}
.tool-workspace{
  display:grid;
  grid-template-columns:minmax(0,1.08fr) minmax(390px,.92fr);
  gap:24px;
  align-items:start;
  margin:0;
  padding:0;
  background:transparent;
  border:0;
}
.tool-input-panel,.tool-result-panel{
  min-width:0;
  border:1px solid var(--tool-line);
  border-radius:var(--tool-radius);
  box-shadow:0 14px 42px rgba(16,45,98,.08);
}
.tool-input-panel{display:grid!important;grid-template-columns:1fr!important;gap:16px!important;padding:24px!important;background:#fff}
.calculator-intro{
  padding:4px 4px 18px;
  border-bottom:1px solid var(--tool-line);
}
.calculator-intro>span,.calculator-input-group>header>span,.result-breakdown>header>span,.result-summary>span,.result-interpretation>span,.comparison-reading>span{
  display:block;
  color:var(--tool-teal);
  font-size:.68rem;
  font-weight:900;
  letter-spacing:.13em;
  text-transform:uppercase;
}
.calculator-intro h2,.calculator-input-group h2,.result-breakdown h2{
  margin:5px 0 0;
  color:var(--tool-blue);
  font:700 1.75rem/1.08 Georgia,serif;
  letter-spacing:-.025em;
}
.calculator-intro p,.calculator-input-group header p{margin:8px 0 0;color:var(--tool-muted);font-size:.9rem;line-height:1.55}
.calculator-input-group{
  padding:21px;
  background:#fbfcfe;
  border:1px solid var(--tool-line);
  border-radius:17px;
}
.calculator-input-group>header{margin-bottom:18px}
.calculator-input-group>header>span{color:var(--tool-blue)}
.calculator-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:17px 15px}
.calculator-fields label{display:block;min-width:0;margin:0;color:var(--tool-ink);font-weight:800}
.calculator-field-wide{grid-column:1/-1}
.field-label{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:7px;font-size:.82rem}
.field-label small{color:var(--tool-muted);font-size:.65rem;font-weight:900;letter-spacing:.07em;text-transform:uppercase;text-align:right}
.tool-input-panel input[type=number],.tool-input-panel input[type=text],.tool-input-panel select{
  width:100%;
  min-width:0;
  min-height:50px;
  margin:0;
  padding:12px 13px;
  color:var(--tool-ink);
  background:#fff;
  border:1px solid #bdc8da;
  border-radius:11px;
  box-shadow:none;
  font:800 1rem/1.2 Inter,Arial,sans-serif;
  font-variant-numeric:tabular-nums;
  transition:border-color .18s ease,box-shadow .18s ease,background .18s ease;
}
.tool-input-panel input:hover{border-color:#8192ad}
.tool-input-panel input:focus,.tool-input-panel select:focus{
  outline:0;
  border-color:var(--tool-blue);
  box-shadow:0 0 0 4px rgba(28,75,145,.13);
}
.money-input{
  display:grid!important;
  grid-template-columns:42px minmax(0,1fr)!important;
  min-width:0;
  margin:0!important;
  border:1px solid #bdc8da!important;
  border-radius:11px!important;
  background:#fff!important;
  overflow:hidden;
}
.money-input:focus-within{border-color:var(--tool-blue)!important;box-shadow:0 0 0 4px rgba(28,75,145,.13)!important}
.money-input>b{display:grid;place-items:center;padding:0!important;color:var(--tool-blue);background:var(--tool-sky);border-right:1px solid var(--tool-line)}
.tool-input-panel .money-input input{min-width:0;border:0!important;border-radius:0!important;box-shadow:none!important}
.calculator-presets{display:flex;gap:7px;flex-wrap:wrap;margin-top:9px}
.calculator-presets button{
  min-height:34px;
  padding:7px 10px;
  color:#46536b;
  background:#fff;
  border:1px solid #c3cddd;
  border-radius:999px;
  font:800 .68rem Inter,Arial,sans-serif;
  cursor:pointer;
  transition:background .18s ease,border-color .18s ease,color .18s ease,transform .18s ease;
}
.calculator-presets button:hover{border-color:var(--tool-blue);color:var(--tool-blue)}
.calculator-presets button.active,.calculator-presets button[aria-pressed=true]{color:#fff;background:var(--tool-blue);border-color:var(--tool-blue)}

.tool-result-panel{
  position:sticky;
  top:112px;
  overflow:hidden;
  padding:0!important;
  color:#fff;
  background:linear-gradient(145deg,var(--tool-blue) 0%,#173f7c 100%)!important;
  border-color:rgba(16,45,98,.4);
}
.result-summary{padding:27px 28px 23px;border-bottom:1px solid rgba(255,255,255,.15)}
.result-summary>span{color:#d9e6fa}
.result-summary>strong{
  display:block;
  max-width:100%;
  margin:9px 0 4px;
  color:#fff;
  font:700 clamp(2.75rem,4.6vw,4.35rem)/.95 Georgia,serif;
  letter-spacing:-.045em;
  font-variant-numeric:tabular-nums;
  overflow-wrap:anywhere;
}
.result-summary>small{color:#bfcee4;font-size:.72rem}
.result-interpretation{
  margin:18px 20px 0!important;
  padding:16px 17px!important;
  color:var(--tool-ink)!important;
  background:#fff8d8!important;
  border:1px solid rgba(245,198,37,.55)!important;
  border-radius:13px!important;
}
.result-interpretation>span{color:var(--tool-blue)}
.result-interpretation p{margin:6px 0 0!important;color:#3e4a61!important;font-size:.88rem!important;line-height:1.55!important}
.result-breakdown{padding:21px 22px 0}
.result-breakdown>header{display:flex;justify-content:space-between;align-items:end;gap:16px;margin-bottom:10px}
.result-breakdown>header>span{color:var(--tool-yellow)}
.result-breakdown h2{color:#fff;font-size:1.45rem}
.result-breakdown dl,.comparison-option dl{display:grid;margin:0}
.result-breakdown dl>div{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:14px;
  align-items:center;
  min-width:0;
  padding:12px 2px;
  border-bottom:1px solid rgba(255,255,255,.13);
}
.result-breakdown dt{color:#cfdaeb;font-size:.79rem;line-height:1.35}
.result-breakdown dd{margin:0;color:#fff;font-size:.91rem;font-weight:900;text-align:right;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.calculator-actions{
  display:grid!important;
  grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr)!important;
  gap:9px!important;
  margin:23px 22px 0!important;
  padding:0!important;
}
.calculator-actions button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  min-width:0;
  min-height:48px;
  margin:0!important;
  padding:11px 13px!important;
  border-radius:11px!important;
  font:900 .78rem/1.2 Inter,Arial,sans-serif!important;
  cursor:pointer;
}
.calculator-actions .primary-action{color:var(--tool-blue)!important;background:var(--tool-yellow)!important;border:1px solid var(--tool-yellow)!important}
.calculator-actions .secondary-action{color:#fff!important;background:transparent!important;border:1px solid rgba(255,255,255,.42)!important}
.calculator-actions .quiet-action{
  grid-column:1/-1!important;
  justify-self:center!important;
  min-height:34px!important;
  color:#c9d5e7!important;
  background:transparent!important;
  border:0!important;
  text-decoration:underline;
  text-underline-offset:4px;
}
.calculator-disclaimer{margin:14px 22px 23px!important;color:#bac9de!important;font-size:.69rem!important;line-height:1.5!important}
.calculator-disclaimer strong{color:#fff}

/* Comparador */
.financing-comparator .comparator-input-panel{gap:17px!important}
.comparator-common{margin:0}
.comparator-scenarios{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.comparator-fields{min-width:0;margin:0;padding:20px;background:#fbfcfe;border:1px solid var(--tool-line);border-radius:17px}
.comparator-fields legend{display:grid;gap:3px;width:calc(100% - 12px);padding:0 7px 10px;color:var(--tool-blue)}
.comparator-fields legend>span{color:var(--tool-teal);font-size:.65rem;font-weight:900;letter-spacing:.12em;text-transform:uppercase}
.comparator-fields legend>b{font:700 1.48rem/1 Georgia,serif}
.comparator-fields legend>small{color:var(--tool-muted);font-size:.71rem;line-height:1.35}
.comparator-fields .calculator-fields{grid-template-columns:1fr}
.comparator-result{position:sticky}
.comparison-options{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important;margin:18px 18px 0!important}
.comparison-option{min-width:0;overflow:hidden;background:rgba(255,255,255,.07)!important;border:1px solid rgba(255,255,255,.18)!important;border-radius:14px!important}
.comparison-option header{min-height:116px;padding:16px!important;border-bottom:1px solid rgba(255,255,255,.16)!important}
.comparison-option header>span{display:block;color:var(--tool-yellow);font-size:.63rem;font-weight:900;letter-spacing:.12em;text-transform:uppercase}
.comparison-option h3{margin:4px 0 0!important;color:#fff!important;font:700 1.45rem/1.05 Georgia,serif!important}
.comparison-option header p{margin:7px 0 0!important;color:#cbd7e8!important;font-size:.72rem!important;line-height:1.4!important}
.comparison-option dl>div{display:grid!important;grid-template-columns:1fr!important;gap:3px!important;padding:11px 14px!important;border-bottom:1px solid rgba(255,255,255,.12)!important}
.comparison-option dt{color:#bdcbe0!important;font-size:.67rem!important;line-height:1.35!important}
.comparison-option dd{margin:0!important;color:#fff!important;font-size:.82rem!important;font-weight:900!important;text-align:left!important;overflow-wrap:anywhere}
.comparison-reading{margin:15px 18px 0!important;padding:16px!important;color:var(--tool-ink)!important;background:#fff!important;border-radius:13px!important}
.comparison-reading>span{color:var(--tool-blue)!important}
.comparison-reading p{margin:6px 0 0!important;color:#49556c!important;font-size:.82rem!important;line-height:1.5!important}

/* Panel de contacto y contenido editorial */
.tool-body .lead-panel{margin:30px 0 0;border-radius:var(--tool-radius);box-shadow:var(--tool-shadow)}
.tool-copy{
  width:min(900px,100%);
  margin:64px auto 0!important;
  padding:clamp(34px,5vw,66px)!important;
  border-color:var(--tool-line)!important;
  border-radius:var(--tool-radius)!important;
  box-shadow:0 16px 45px rgba(16,45,98,.07);
}
.tool-copy-heading{margin-bottom:28px;padding-bottom:20px;border-bottom:1px solid var(--tool-line)}
.tool-copy-heading h2{margin:6px 0 0!important;color:var(--tool-blue);font-size:clamp(2rem,4vw,3rem)!important}
.tool-copy>.tool-copy-heading+*{margin-top:0}

/* Calendario: la hoja se inyecta después del estilo histórico para prevalecer. */
.tax-calendar-page{background:linear-gradient(180deg,#fff 0,#f7f4ed 720px)!important}
.tax-calendar-page .tax-hero{color:var(--tool-ink)!important;background:transparent!important;border-bottom:0!important}
.tax-calendar-page .tax-hero .container{grid-template-columns:minmax(0,1.08fr) minmax(320px,.72fr)!important;gap:clamp(30px,5vw,70px)!important;padding-block:clamp(48px,6vw,76px)!important}
.tax-calendar-page .tax-hero h1{max-width:11ch;margin:12px 0 20px!important;color:var(--tool-blue)!important;font-size:clamp(3.2rem,7vw,6.3rem)!important}
.tax-calendar-page .tax-hero p{color:#46536b!important;font-size:clamp(1.08rem,1.8vw,1.28rem)!important}
.tax-calendar-page .tax-hero-card{padding:28px!important;border-color:var(--tool-line)!important;border-radius:24px!important;box-shadow:var(--tool-shadow)!important}
.tax-calendar-page .tax-hero-card strong{font-size:1.9rem!important}
.tax-calendar-page .tax-shell{padding-block:20px 92px!important}
.tax-calendar-page .tax-notice{margin-bottom:22px!important;padding:19px 21px!important;background:#fff8d8!important;border-color:#e1ca68!important;border-radius:14px!important}
.tax-calendar-page .tax-controls{
  top:102px!important;
  grid-template-columns:repeat(3,minmax(0,1fr)) auto!important;
  gap:12px!important;
  padding:17px!important;
  border-color:var(--tool-line)!important;
  border-radius:18px!important;
  box-shadow:0 16px 40px rgba(16,45,98,.1)!important;
}
.tax-calendar-page .tax-controls label{min-width:0}
.tax-calendar-page .tax-controls select{min-height:46px;margin-top:6px!important;border-color:#bdc8da!important;border-radius:10px!important}
.tax-calendar-page .tax-export-all{min-height:46px!important;padding-inline:17px!important;border-radius:10px!important}
.tax-calendar-page .tax-summary{margin:34px 0 15px!important}
.tax-calendar-page .tax-summary h2{color:var(--tool-blue);font-size:2.45rem!important}
.tax-calendar-page .tax-event-list{gap:12px!important}
.tax-calendar-page .tax-event{
  grid-template-columns:104px minmax(0,1fr)!important;
  border-color:var(--tool-line)!important;
  border-radius:17px!important;
  box-shadow:0 6px 24px rgba(16,45,98,.04);
}
.tax-calendar-page .tax-event time{position:relative;background:var(--tool-sky)!important;border-color:var(--tool-line)!important}
.tax-calendar-page .tax-event[data-urgency=soon] time{background:#fff4c6!important}
.tax-calendar-page .tax-event[data-urgency=urgent] time{color:#7c281f;background:#ffe3dd!important}
.tax-calendar-page .tax-event[data-urgency=past]{opacity:.74}
.tax-calendar-page .tax-event time::after{
  content:attr(data-status-label);
  position:absolute;
  left:8px;
  right:8px;
  bottom:7px;
  color:var(--tool-muted);
  font-size:.55rem;
  font-weight:900;
  letter-spacing:.06em;
  text-transform:uppercase;
}
.tax-calendar-page .tax-event-copy{padding:20px 22px!important}
.tax-calendar-page .tax-event h3{color:var(--tool-blue);font-size:1.45rem!important}
.tax-calendar-page .tax-event-meta span{max-width:100%;overflow-wrap:anywhere}
.tax-calendar-page .tax-event-actions a{min-height:36px;display:inline-flex;align-items:center;justify-content:center}
.tax-calendar-page .tax-sources{border-radius:20px!important}

@media (hover:hover) and (pointer:fine){
  .tool-hero-visual img{transition:transform .35s cubic-bezier(.2,.8,.2,1)}
  .tool-hero-visual:hover img{transform:scale(1.02)}
  .calculator-presets button:hover{transform:translateY(-1px)}
  .calculator-actions .primary-action:hover{transform:translateY(-2px);box-shadow:0 9px 24px rgba(245,198,37,.24)}
  .calculator-actions .secondary-action:hover{background:rgba(255,255,255,.1)!important}
}

@media(max-width:1100px){
  .tool-page .tool-hero-grid{grid-template-columns:minmax(0,1fr) minmax(320px,.8fr);gap:34px}
  .tool-workspace{grid-template-columns:1fr}
  .tool-result-panel,.comparator-result{position:static;top:auto}
  .tool-result-panel{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr)}
  .result-summary{border-right:1px solid rgba(255,255,255,.15);border-bottom:0}
  .result-interpretation{grid-column:1;margin:18px!important;align-self:start}
  .result-breakdown{grid-column:2;grid-row:1/3;padding-top:25px}
  .calculator-actions,.calculator-disclaimer{grid-column:1/-1}
  .comparator-result{display:block}
  .tax-calendar-page .tax-controls{position:static!important;grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .tax-calendar-page .tax-export-all{grid-column:1/-1!important}
}

@media(max-width:850px){
  .tool-page .tool-hero-grid,.tax-calendar-page .tax-hero .container{grid-template-columns:1fr!important}
  .tool-hero-visual{aspect-ratio:16/9}
  .tool-hero-copy h1{max-width:13ch}
  .comparator-scenarios{grid-template-columns:1fr}
  .comparison-options{grid-template-columns:1fr!important}
  .comparison-option header{min-height:0}
}

@media(max-width:680px){
  .tool-body{width:min(100% - 26px,1260px);padding-bottom:70px}
  .tool-page .tool-hero-grid{padding-block:34px}
  .tool-hero-copy h1{font-size:clamp(2.65rem,13vw,4.1rem)}
  .tool-hero-copy>p{margin-top:16px;font-size:1.05rem}
  .tool-hero-benefit{margin-top:20px;padding:15px 16px}
  .tool-hero-meta{gap:7px}
  .tool-hero-meta span{padding:7px 9px;font-size:.62rem}
  .tool-hero-visual{border-radius:19px}
  .tool-hero-visual figcaption{left:10px;right:10px;bottom:10px}
  .tool-input-panel{padding:14px!important;border-radius:17px}
  .calculator-intro{padding:4px 2px 15px}
  .calculator-intro h2{font-size:1.6rem}
  .calculator-input-group,.comparator-fields{padding:16px 13px}
  .calculator-fields{grid-template-columns:1fr;gap:15px}
  .calculator-field-wide{grid-column:auto}
  .calculator-presets button{flex:1;min-width:78px}
  .tool-result-panel{display:block;border-radius:17px}
  .result-summary{padding:24px 20px 20px;border-right:0;border-bottom:1px solid rgba(255,255,255,.15)}
  .result-summary>strong{font-size:clamp(2.45rem,13vw,3.35rem)}
  .result-interpretation{margin:14px!important}
  .result-breakdown{padding:19px 17px 0}
  .result-breakdown dl>div{grid-template-columns:1fr;gap:4px}
  .result-breakdown dd{text-align:left;font-size:1rem}
  .calculator-actions{grid-template-columns:1fr!important;margin:20px 16px 0!important}
  .calculator-actions .quiet-action{grid-column:auto!important}
  .calculator-disclaimer{margin:13px 17px 20px!important}
  .comparison-options{margin-inline:14px!important}
  .comparison-reading{margin-inline:14px!important}
  .tool-copy{margin-top:42px!important;padding:30px 22px!important;border-radius:17px!important}
  .tax-calendar-page .tax-controls{grid-template-columns:1fr!important}
  .tax-calendar-page .tax-export-all{grid-column:auto!important}
  .tax-calendar-page .tax-event{grid-template-columns:82px minmax(0,1fr)!important}
  .tax-calendar-page .tax-event-copy{padding:17px 14px!important}
  .tax-calendar-page .tax-event h3{font-size:1.2rem!important}
  .tax-calendar-page .tax-event-actions{display:grid!important;grid-template-columns:1fr!important}
}

@media(prefers-reduced-motion:reduce){
  .tool-page *, .tax-calendar-page *{scroll-behavior:auto!important;animation:none!important;transition-duration:.01ms!important}
}