/* TeLoCalculo Master v1.2 — Mobile/Tablet App UX. Desktop intentionally untouched. */
.tlc-master-shell,.tlc-master-shell *{box-sizing:border-box}
.tlc-master-shell{max-width:100%;min-width:0}

@media (max-width:1024px){
  /* Never alter the global Kadence/body geometry. Everything is contained here. */
  .tlc-master-shell{
    --tlc-blue:#1769f6;--tlc-blue2:#0f55d8;--tlc-ink:#102033;--tlc-muted:#617086;
    --tlc-line:#e4eaf2;--tlc-soft:#f5f8fc;--tlc-card:#fff;--tlc-good:#0a8f63;
    width:100%!important;max-width:100%!important;min-width:0!important;margin:0!important;
    padding:clamp(10px,2.2vw,22px)!important;overflow-x:clip!important;color:var(--tlc-ink);
    font-size:17px!important;line-height:1.55!important;background:linear-gradient(180deg,#f8fbff 0,#fff 300px)!important;
  }
  .tlc-master-shell *{min-width:0;overflow-wrap:break-word}
  .tlc-master-shell > *{width:100%!important;max-width:100%!important;margin-left:0!important;margin-right:0!important}
  .tlc-master-shell img,.tlc-master-shell svg,.tlc-master-shell canvas,.tlc-master-shell video{max-width:100%!important;height:auto!important}
  .tlc-master-shell h1{font-size:clamp(30px,5.5vw,46px)!important;line-height:1.06!important;letter-spacing:-.035em!important;margin-bottom:12px!important}
  .tlc-master-shell h2{font-size:clamp(25px,4.4vw,34px)!important;line-height:1.12!important;letter-spacing:-.025em!important}
  .tlc-master-shell h3{font-size:clamp(20px,3.3vw,26px)!important;line-height:1.18!important}
  .tlc-master-shell p,.tlc-master-shell li,.tlc-master-shell label{font-size:max(16px,1em)!important;line-height:1.55!important}
  .tlc-master-shell small,.tlc-master-shell .help,.tlc-master-shell [class*="hint"],.tlc-master-shell [class*="helper"]{font-size:14px!important;line-height:1.45!important;color:var(--tlc-muted)}

  /* App controls */
  .tlc-master-shell input:not([type=checkbox]):not([type=radio]):not([type=range]),
  .tlc-master-shell select,.tlc-master-shell textarea{
    width:100%!important;max-width:100%!important;min-height:56px!important;padding:13px 15px!important;
    font-size:17px!important;line-height:1.2!important;border:1.5px solid #d9e2ee!important;border-radius:15px!important;
    background:#fff!important;color:var(--tlc-ink)!important;box-shadow:0 1px 2px rgba(15,35,60,.03)!important;
  }
  .tlc-master-shell input:focus,.tlc-master-shell select:focus,.tlc-master-shell textarea:focus{outline:3px solid rgba(23,105,246,.14)!important;border-color:var(--tlc-blue)!important}
  .tlc-master-shell button,.tlc-master-shell [type=submit],.tlc-master-shell [role=button],.tlc-master-shell a[class*="btn"],.tlc-master-shell a[class*="button"]{
    min-height:52px!important;padding:12px 18px!important;border-radius:15px!important;font-size:16px!important;font-weight:800!important;line-height:1.2!important;touch-action:manipulation;
  }
  /* Segmented choices are large tappable pills */
  .tlc-master-shell :is([class*="tabs"],[class*="mode"],[class*="segmented"],[class*="chips"],[class*="presets"],[class*="formats"]){max-width:100%!important;gap:8px!important}
  .tlc-master-shell :is([class*="chip"],[class*="preset"],[class*="mode-btn"],[class*="type-btn"],[class*="type-option"]){min-height:46px!important;border-radius:13px!important;font-size:15px!important}

  /* Complex desktop layouts become a calm app feed. */
  .tlc-master-shell :is(.layout,.grid,[class$="-layout"],[class$="-grid"],[class*=" grid"],[class*="-stage"],[class*="-app"],[class*="-calculator"],[class*="-fields"]){max-width:100%!important;grid-template-columns:minmax(0,1fr)!important}
  .tlc-master-shell :is(.card,[class*="-card"],[class*=" panel"],[class$="-panel"],[class*="-step"],[class*="-form"],[class*="-results"],[class*="result-card"]){max-width:100%!important}
  .tlc-master-shell :is(.card,[class*="-card"],[class*=" panel"],[class$="-panel"]){border-radius:22px!important;border-color:var(--tlc-line)!important;box-shadow:0 8px 30px rgba(18,45,78,.07)!important}
  .tlc-master-shell :is([class*="-step"],.field,[class*="-field"]){margin-bottom:14px}

  /* Results should feel like the payoff, not another form. */
  .tlc-master-shell :is([class*="result"],[class*="-side"],[class*="-score"],[class*="-verdict"],[class*="-primary"]){max-width:100%!important;overflow-wrap:anywhere!important}
  .tlc-master-shell :is([class*="result"] strong,[class*="result"] b,[class*="-primary"],[class*="-sidebig"],[class*="-score"]){font-variant-numeric:tabular-nums}

  /* Tables/charts may scroll locally, never the page. */
  .tlc-master-shell table{max-width:100%!important;font-size:14px!important}
  .tlc-master-shell :is([class*="table"],[class*="chart"],[class*="calendar"]){max-width:100%!important;overflow-x:auto!important;-webkit-overflow-scrolling:touch}

  /* Specific calculators: collapse their known desktop multi-column areas. */
  .tlc-tool-hipoteca :is(.layout,.stats,.actions,.bank-grid,.news-grid,.amort-results,.market-summary),
  .tlc-tool-capacidad :is(.tlc-cap-layout,.tlc-cap-grid),
  .tlc-tool-gastos-vivienda :is(.tlc-gastos-layout,.tlc-field-grid),
  .tlc-tool-amortizacion :is(.tla2-calculator,.tla2-fields,.tla2-results),
  .tlc-tool-alquiler-comprar :is(.avc-app,.avc-grid,.avc-cards),
  .tlc-tool-fija-variable :is(.fvv-app,.fvv-grid,.fvv-cards),
  .tlc-tool-rentabilidad-alquiler :is(.ra-app,.ra-grid,.ra-flow,.ra-compare),
  .tlc-tool-alquiler-permitir :is(.grid,.scenarios,.results),
  .tlc-tool-gastos-alquiler :is(.grid,.two,.results),
  .tlc-tool-ahorro :is(.grid,.fields,.results),
  .tlc-tool-interes-compuesto :is(.tlc-ic-stage,.tlc-ic-fields,.tlc-ic-presets,.tlc-ic-milestones,.tlc-ic-comparison,.tlc-ic-info-grid,.tlc-ic-challenges),
  .tlc-tool-youtube-ganancias :is(.tlc-yt-calculator,.tlc-yt-picker-grid),
  .tlc-tool-youtube-sponsors :is(.tlc-sy-layout,.tlc-sy-picker-grid),
  .tlc-tool-youtube-visitas :is(.tlc-vgy-layout,.tlc-vgy-pickers),
  .tlc-tool-youtube-calendario :is(.top,.nav,.stats),
  .tlc-tool-test-iq :is(.tlc-iq-hero,.tlc-iq-hero-stats,.tlc-iq-start-grid,.tlc-iq-answers,.tlc-iq-result-stats,.tlc-iq-info-grid,.tlc-iq-seo){grid-template-columns:minmax(0,1fr)!important}
}

@media (max-width:767px){
  .tlc-master-shell{padding:8px 6px 24px!important;font-size:17px!important;background:#fff!important}
  .tlc-master-shell h1{font-size:31px!important}.tlc-master-shell h2{font-size:25px!important}.tlc-master-shell h3{font-size:21px!important}
  /* Make the first interaction visible quickly: remove decorative desktop-only visual weight. */
  .tlc-master-shell :is(.badges,[class*="mini-proof"],[class*="hero-visual"],[class*="float-card"],[class*="orbit"],[class*="benefits"],[class*="crumb"]){display:none!important}
  .tlc-master-shell :is(.intro,.hero,[class*="-hero"],[class*="-head"]){padding:16px 10px!important;margin:0 0 8px!important;min-height:0!important;text-align:left!important}
  .tlc-master-shell :is(.card,[class*="-card"],[class*=" panel"],[class$="-panel"]){border-radius:18px!important;box-shadow:none!important;border:1px solid var(--tlc-line)!important;padding:18px 14px!important}
  .tlc-master-shell :is([class*="-step"]){padding:14px 0!important}
  .tlc-master-shell button,.tlc-master-shell [type=submit],.tlc-master-shell a[class*="btn"],.tlc-master-shell a[class*="button"]{width:100%!important;min-height:56px!important;font-size:17px!important}
  /* Horizontal option rows are touch carousels instead of squeezed tiny buttons. */
  .tlc-master-shell :is([class*="chips"],[class*="presets"],[class*="type-row"],[class*="modebar"],[class*="segmented"],[class*="formats"]){display:flex!important;overflow-x:auto!important;flex-wrap:nowrap!important;padding-bottom:4px!important;scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch}
  .tlc-master-shell :is([class*="chip"],[class*="preset"],[class*="mode-btn"],[class*="type-btn"],[class*="type-option"]){flex:0 0 auto!important;width:auto!important;min-width:92px!important;scroll-snap-align:start}
  /* Long secondary SEO/explanation stays in DOM but doesn't overwhelm the app workflow on phones. */
  .tlc-master-shell :is([class*="-seo"],[class*="related"],[class*="info-grid"],[class*="challenges"],[class*="news-grid"],[class*="bank-grid"]){margin-top:22px!important}
  /* Calendar: five stats are cards, 2 columns + final full width. */
  .tlc-tool-youtube-calendario .stats{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important}
  .tlc-tool-youtube-calendario .stat{padding:12px!important;border-radius:15px!important}
  .tlc-tool-youtube-calendario .stat:last-child{grid-column:1/-1}
  /* IQ answers must be big one-per-row tap targets. */
  .tlc-tool-test-iq .tlc-iq-answers{display:grid!important;grid-template-columns:1fr!important;gap:10px!important}
}

@media (max-width:380px){
 .tlc-master-shell{padding-left:4px!important;padding-right:4px!important}
 .tlc-master-shell h1{font-size:28px!important}.tlc-master-shell h2{font-size:23px!important}
 .tlc-master-shell input:not([type=checkbox]):not([type=radio]):not([type=range]),.tlc-master-shell select{font-size:16px!important;padding-left:12px!important;padding-right:12px!important}
}
@media (prefers-reduced-motion:reduce){.tlc-master-shell *{scroll-behavior:auto!important;animation-duration:.01ms!important;transition-duration:.01ms!important}}

/* v2.7 Mobile readability: larger secondary copy without horizontal overflow */
@media (max-width: 900px){
  .tlc-master-shell small,
  .tlc-master-shell [class*="hint"],
  .tlc-master-shell [class*="helper"],
  .tlc-master-shell [class*="caption"],
  .tlc-master-shell [class*="note"]{font-size:15px!important;line-height:1.5!important;max-width:100%!important;white-space:normal!important;word-break:normal!important;overflow-wrap:break-word!important}
  .tlc-master-shell p,.tlc-master-shell label,.tlc-master-shell li{word-break:normal!important;overflow-wrap:break-word!important;max-width:100%!important}
}
@media (max-width: 480px){
  .tlc-master-shell small,
  .tlc-master-shell [class*="hint"],
  .tlc-master-shell [class*="helper"],
  .tlc-master-shell [class*="caption"],
  .tlc-master-shell [class*="note"]{font-size:15px!important}
}
