/* TuCalculadora Legal — glass.css (estilo "liquid glass" iOS 26) */
.tcl-glass {
  background: linear-gradient(160deg, rgba(255,255,255,.82), rgba(255,255,255,.55));
  backdrop-filter: blur(22px) saturate(160%);
  -webkit-backdrop-filter: blur(22px) saturate(160%);
  border: 1px solid rgba(255,255,255,.65);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.9),
    0 18px 44px rgba(13, 30, 70, .12);
  border-radius: var(--r-lg);
}

.tcl-glass-dark {
  background: linear-gradient(160deg, rgba(16, 24, 44, .78), rgba(16, 24, 44, .58));
  backdrop-filter: blur(22px) saturate(150%);
  -webkit-backdrop-filter: blur(22px) saturate(150%);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: var(--r-lg);
  color: #fff;
}

/* Tarjetas */
.tcl-card {
  display: block; padding: 26px; border-radius: var(--r-lg);
  background: linear-gradient(165deg, rgba(255,255,255,.9), rgba(255,255,255,.62));
  backdrop-filter: blur(16px);
  border: 1px solid rgba(255,255,255,.7);
  box-shadow: 0 10px 30px rgba(13,30,70,.08);
  color: inherit; text-decoration: none !important;
  transition: transform .22s cubic-bezier(.22,.8,.3,1), box-shadow .22s ease;
  position: relative; overflow: hidden;
}
.tcl-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-lg); color: inherit; }
.tcl-card-icon {
  width: 52px; height: 52px; border-radius: 16px; display: grid; place-items: center;
  font-size: 26px; margin-bottom: 16px;
  background: linear-gradient(145deg, rgba(37,99,235,.12), rgba(37,99,235,.05));
  border: 1px solid rgba(37,99,235,.15);
}
.tcl-card-title { font-size: 20px; font-weight: 600; margin-bottom: 8px; font-family: var(--font-body); }
.tcl-card-desc { font-size: 15.5px; color: var(--ink3); line-height: 1.55; margin-bottom: 12px; }
.tcl-card-tag { font-size: 14px; font-weight: 600; color: var(--blue-deep); }
.tcl-card-badge {
  position: absolute; top: 16px; right: 16px; font-size: 11px; font-weight: 700;
  letter-spacing: .06em; padding: 5px 11px; border-radius: 999px;
  background: rgba(15, 138, 79, .1); color: var(--green); border: 1px solid rgba(15,138,79,.2);
}

/* Pills / segmented control (selector de año) */
.tcl-seg {
  display: inline-flex; gap: 4px; padding: 4px; border-radius: 999px;
  background: rgba(12,18,32,.06); border: 1px solid var(--line);
  backdrop-filter: blur(10px);
}
.tcl-seg button {
  border: 0; background: transparent; padding: 9px 20px; border-radius: 999px;
  font: 600 14px var(--font-body); color: var(--ink3); cursor: pointer;
  transition: all .22s cubic-bezier(.22,.8,.3,1);
}
.tcl-seg button.active {
  background: #fff; color: var(--ink);
  box-shadow: 0 3px 10px rgba(13,30,70,.14), inset 0 1px 0 rgba(255,255,255,1);
}

/* Formularios */
.tcl-lbl { display: block; font-size: 13.5px; font-weight: 600; color: var(--ink2); margin-bottom: 7px; }
.tcl-input, .tcl-select {
  width: 100%; padding: 13px 15px; margin-bottom: 14px;
  border: 1.5px solid var(--line); border-radius: var(--r-md);
  background: rgba(255,255,255,.8); font: 400 16px var(--font-body); color: var(--ink);
  transition: border-color .2s, box-shadow .2s; -webkit-appearance: none; appearance: none;
}
.tcl-select { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%236e7689' stroke-width='2' fill='none' stroke-linecap='round'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 14px center; }
.tcl-input:focus, .tcl-select:focus { outline: none; border-color: var(--blue); box-shadow: 0 0 0 4px rgba(37,99,235,.12); }
