/* ============================================================
   NovaNorte — Páginas de tratamiento (fichas)
   Hereda el sistema visual real de index.html (no la plantilla
   legal neutra). Fuentes self-hosted, paleta cálida de marca.
   Light-only, igual que el sitio principal.
   ============================================================ */

/* Self-hosted fonts (Clash Display, DM Sans, Cormorant Garamond) */
@font-face { font-family:'Cormorant Garamond'; font-style:italic; font-weight:300; font-display:swap; src:url('assets/fonts/cormorant-garamond-italic-latin-ext.woff2') format('woff2'); unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family:'Cormorant Garamond'; font-style:italic; font-weight:300; font-display:swap; src:url('assets/fonts/cormorant-garamond-italic-latin.woff2') format('woff2'); unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family:'DM Sans'; font-style:normal; font-weight:400; font-display:swap; src:url('assets/fonts/dm-sans-normal-latin-ext.woff2') format('woff2'); unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family:'DM Sans'; font-style:normal; font-weight:400; font-display:swap; src:url('assets/fonts/dm-sans-normal-latin.woff2') format('woff2'); unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family:'DM Sans'; font-style:normal; font-weight:500; font-display:swap; src:url('assets/fonts/dm-sans-normal-latin-ext.woff2') format('woff2'); unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family:'DM Sans'; font-style:normal; font-weight:500; font-display:swap; src:url('assets/fonts/dm-sans-normal-latin.woff2') format('woff2'); unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family:'DM Sans'; font-style:normal; font-weight:600; font-display:swap; src:url('assets/fonts/dm-sans-normal-latin-ext.woff2') format('woff2'); unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family:'DM Sans'; font-style:normal; font-weight:600; font-display:swap; src:url('assets/fonts/dm-sans-normal-latin.woff2') format('woff2'); unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family:'Clash Display'; font-style:normal; font-weight:500; font-display:swap; src:url('assets/fonts/clash-display-500.woff2') format('woff2'); }
@font-face { font-family:'Clash Display'; font-style:normal; font-weight:600; font-display:swap; src:url('assets/fonts/clash-display-600.woff2') format('woff2'); }

:root {
  --bg:         #F5F9FB;
  --surface:    #E8F2F6;
  --blush:      #D5E8EF;
  --text:       #14242B;
  --muted:      #566B73;
  --subtle:     #8FA4AC;
  --accent:     #0E7290;
  --accent-d:   #0A5A73;
  --border:     rgba(14,114,144,0.22);
  --border-lt:  rgba(26,26,26,0.06);

  --f-display: 'Clash Display', sans-serif;
  --f-body:    'DM Sans', sans-serif;
  --f-accent:  'Cormorant Garamond', Georgia, serif;

  --r-sm:  8px;
  --r-md:  14px;
  --r-lg:  20px;
  --r-xl:  28px;

  --sh-card: 0 16px 64px rgba(26,26,26,0.07), 0 4px 16px rgba(26,26,26,0.04);
  --sh-soft: 0 2px 24px rgba(26,26,26,0.04), 0 1px 4px rgba(26,26,26,0.03);
  --ease-out:  cubic-bezier(0.32,0.72,0,1);

  --container: min(760px, 92vw);
}

/* ===== reset & base ===== */
*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; font-size:16px; -webkit-text-size-adjust:100%; }
body {
  font-family:var(--f-body);
  background:var(--bg);
  color:var(--text);
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  overflow-x:hidden;
}
img, svg { display:block; max-width:100%; }
a { text-decoration:none; color:inherit; }
button { border:none; background:none; cursor:pointer; font-family:inherit; }
ul { list-style:none; }

/* ===== i18n (ES default, EN on toggle) ===== */
[data-lang-show="en"] { display:none; }
html[data-current-lang="en"] [data-lang-show="es"] { display:none; }
html[data-current-lang="en"] [data-lang-show="en"] { display:revert; }

/* ===== header ===== */
.t-header {
  position:sticky; top:0; z-index:50;
  background:color-mix(in srgb, var(--bg) 86%, transparent);
  -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px);
  border-bottom:1px solid var(--border-lt);
}
.t-header__inner {
  width:var(--container); margin:0 auto;
  display:flex; align-items:center; justify-content:space-between; gap:1rem;
  padding:0.95rem 0;
}
.t-logo { display:inline-flex; align-items:center; gap:0.5rem; font-family:var(--f-display); font-weight:600; font-size:1.05rem; letter-spacing:-0.01em; color:var(--text); }
.t-logo em { font-style:normal; color:var(--accent-d); font-weight:500; }
.t-feather { height:26px; width:auto; display:block; }
.t-nav-right { display:flex; align-items:center; gap:0.85rem; }

.t-lang { display:inline-flex; border:1px solid var(--border); border-radius:9999px; overflow:hidden; }
.t-lang button {
  font-size:0.7rem; font-weight:600; letter-spacing:0.04em;
  padding:0.3rem 0.6rem; color:var(--muted); background:none;
  transition:background .2s ease, color .2s ease;
}
.t-lang button.is-active { background:var(--text); color:var(--bg); }

.t-cta {
  display:inline-flex; align-items:center; gap:0.4rem;
  font-size:0.8rem; font-weight:600; letter-spacing:0.01em;
  padding:0.5rem 1.05rem; border-radius:9999px;
  background:var(--accent); color:var(--bg);
  transition:transform .25s var(--ease-out), background .25s var(--ease-out);
}
.t-cta:hover { background:var(--accent-d); transform:translateY(-1px); }

/* ===== layout ===== */
.t-main { width:var(--container); margin:0 auto; padding:2.75rem 0 1rem; }

.t-breadcrumb {
  font-size:0.74rem; letter-spacing:0.02em; color:var(--subtle);
  display:flex; flex-wrap:wrap; gap:0.4rem; align-items:center; margin-bottom:1.8rem;
}
.t-breadcrumb a { color:var(--muted); transition:color .2s ease; }
.t-breadcrumb a:hover { color:var(--accent-d); }
.t-breadcrumb .sep { color:var(--border); }

.t-eyebrow {
  display:inline-block; font-size:0.625rem; font-weight:700;
  letter-spacing:0.22em; text-transform:uppercase; color:var(--accent-d);
  margin-bottom:0.9rem;
}
.t-title {
  font-family:var(--f-display); font-weight:600;
  font-size:clamp(2rem, 5vw, 3.1rem); line-height:1.08; letter-spacing:-0.025em;
  color:var(--text); margin-bottom:1.1rem;
}
.t-lead {
  font-family:var(--f-accent); font-style:italic; font-weight:400;
  font-size:clamp(1.2rem, 2.6vw, 1.55rem); line-height:1.4; color:var(--muted);
  max-width:60ch; margin-bottom:2.4rem;
}

.t-rule { height:1px; background:var(--border-lt); border:0; margin:0 0 2.4rem; }

.t-body p { font-size:1.0rem; line-height:1.75; color:var(--muted); margin-bottom:1.1rem; }
.t-body p strong { color:var(--text); font-weight:600; }
.t-body h2 {
  font-family:var(--f-display); font-weight:600; font-size:1.3rem;
  letter-spacing:-0.01em; color:var(--text); margin:2.2rem 0 0.8rem;
}
.t-body ul.t-list { margin:0 0 1.2rem; display:grid; gap:0.55rem; }
.t-body ul.t-list li {
  position:relative; padding-left:1.4rem; font-size:1rem; line-height:1.6; color:var(--muted);
}
.t-body ul.t-list li::before {
  content:''; position:absolute; left:0; top:0.62em;
  width:7px; height:7px; border-radius:50%;
  background:var(--accent); opacity:0.85;
}

/* ===== FAQ accordion (<details>) ===== */
.t-faq { margin-top:2.8rem; }
.t-faq__hd {
  font-family:var(--f-display); font-weight:600; font-size:1.35rem;
  letter-spacing:-0.01em; color:var(--text); margin-bottom:0.4rem;
}
.faq-item { border-bottom:1px solid var(--border-lt); }
.faq-item summary {
  list-style:none; cursor:pointer; padding:1.05rem 0;
  display:flex; align-items:center; justify-content:space-between; gap:1rem;
  font-family:var(--f-body); font-weight:600; font-size:1.02rem; color:var(--text);
}
.faq-item summary::-webkit-details-marker { display:none; }
.faq-item summary:focus-visible { outline:2px solid var(--accent); outline-offset:3px; border-radius:var(--r-sm); }
.faq-ico {
  flex-shrink:0; width:20px; height:20px; color:var(--accent-d);
  transition:transform .3s var(--ease-out);
}
.faq-item[open] .faq-ico { transform:rotate(180deg); }
.faq-item__body { padding:0 0 1.15rem; }
.faq-item__body p { font-size:0.96rem; line-height:1.7; color:var(--muted); margin-bottom:0.7rem; }
.faq-item__body p:last-child { margin-bottom:0; }

/* ===== CTA band ===== */
.t-cta-band {
  margin:3.2rem 0 1rem; padding:2.6rem 2rem;
  background:var(--surface); border:1px solid var(--border); border-radius:var(--r-xl);
  text-align:center; box-shadow:var(--sh-soft);
}
.t-cta-band h2 {
  font-family:var(--f-display); font-weight:600; font-size:clamp(1.4rem,3vw,1.9rem);
  letter-spacing:-0.02em; color:var(--text); margin-bottom:0.6rem;
}
.t-cta-band p { color:var(--muted); font-size:0.98rem; margin-bottom:1.5rem; max-width:48ch; margin-left:auto; margin-right:auto; }
.t-cta-band .btn {
  display:inline-flex; align-items:center; gap:0.5rem;
  font-weight:600; font-size:0.92rem; padding:0.85rem 1.7rem; border-radius:9999px;
  background:var(--accent); color:var(--bg);
  transition:transform .25s var(--ease-out), background .25s var(--ease-out);
}
.t-cta-band .btn:hover { background:var(--accent-d); transform:translateY(-2px); }

/* ===== footer ===== */
.t-footer {
  border-top:1px solid var(--border-lt); margin-top:2rem;
  background:var(--bg);
}
.t-footer__inner {
  width:var(--container); margin:0 auto; padding:2.2rem 0;
  display:flex; flex-wrap:wrap; gap:1rem 1.5rem; align-items:center; justify-content:space-between;
}
.t-footer__brand { font-family:var(--f-display); font-weight:600; font-size:0.98rem; color:var(--text); }
.t-footer__brand em { font-style:normal; color:var(--accent-d); font-weight:500; }
.t-footer__nav { display:flex; flex-wrap:wrap; gap:0.5rem; font-size:0.8rem; color:var(--muted); align-items:center; }
.t-footer__nav a { color:var(--muted); transition:color .2s ease; }
.t-footer__nav a:hover { color:var(--accent-d); }
.t-footer__nav .sep { color:var(--border); }
.t-footer__copy { width:100%; font-size:0.74rem; color:var(--subtle); padding-top:0.4rem; }
.t-footer__copy a { color:var(--accent-d); font-weight:500; }
.t-footer__copy a:hover { text-decoration:underline; }

/* ===== responsive ===== */
@media (max-width:640px) {
  .t-main { padding-top:2rem; }
  .t-cta-band { padding:2rem 1.25rem; }
  .t-header__inner { gap:0.6rem; }
  .t-cta { padding:0.45rem 0.9rem; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition-duration:0.01ms !important; scroll-behavior:auto !important; }
}
