/* ============================================================
   TUMISSION CENTER INC. — CSS BASE COMPARTIDO v3
   Fuente: Baloo 2 · Mínimo: 0.75rem (12px)
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Baloo+2:wght@400;500;600;700;800&display=swap');

:root {
  --verde:      #75B962;
  --verde-lt:   #8FCB7A;
  --verde-dk:   #5EA34D;
  --azul:       #1C3377;
  --azul-md:    #3365AE;
  --azul-lt:    #4B7EC8;
  --blanco:     #FFFFFF;
  --crema:      #F7F9FC;
  --arena:      #EDF2F8;
  --gris:       #5E6E8A;
  --texto:      #1A2744;
  --font:       'Baloo 2', system-ui, sans-serif;
  /* font scale actualizado */
  --fs-xs:   0.844rem;  /* 13.5px */
  --fs-sm:   0.875rem;  /* 14px   */
  --fs-base: 1rem;      /* 16px   */
  --fs-md:   1.125rem;  /* 18px   */
  --fs-lg:   1.188rem;  /* 19px   */
}

*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { font-family:var(--font); background:var(--crema); color:var(--texto); overflow-x:hidden; }

/* ===== NAV ===== */
.tm-nav {
  position:fixed; top:0; left:0; right:0; z-index:1000;
  background:rgba(28,51,119,0.97); backdrop-filter:blur(14px);
  display:flex; align-items:center; justify-content:space-between;
  padding:0 5%; height:70px;
  border-bottom:1px solid rgba(255,255,255,0.07);
  transition:background 0.3s;
}
.tm-nav.scrolled { background:rgba(28,51,119,1); }
.tm-nav-logo img { height:38px; width:auto; display:block; }
.tm-nav-links { display:flex; gap:1.1rem; list-style:none; margin-left:2.5rem; }
.tm-nav-links a {
  color:rgba(255,255,255,0.72); text-decoration:none;
  font-size:0.8rem; font-weight:600; letter-spacing:0.03em;
  text-transform:uppercase; transition:color 0.2s;
  padding-bottom:2px; border-bottom:2px solid transparent;
}
.tm-nav-links a:hover,
.tm-nav-links a.active { color:var(--verde-lt); border-bottom-color:var(--verde-lt); }
.tm-nav-actions { display:flex; align-items:center; gap:1rem; }
.btn-nav-donate {
  background:var(--verde); color:white; font-weight:700;
  font-size:var(--fs-sm); text-transform:uppercase; letter-spacing:0.06em;
  padding:10px 22px; border-radius:6px; text-decoration:none; transition:all 0.2s;
}
.btn-nav-donate:hover { background:var(--verde-lt); transform:translateY(-1px); box-shadow:0 6px 20px rgba(117,185,98,0.4); }
.tm-hamburger { display:none; flex-direction:column; gap:5px; cursor:pointer; padding:4px; background:none; border:none; }
.tm-hamburger span { display:block; width:24px; height:2px; background:white; border-radius:2px; transition:all 0.3s; }
.tm-mobile-menu {
  display:none; position:fixed; top:70px; left:0; right:0;
  background:rgba(28,51,119,0.99); padding:1.5rem 5%;
  flex-direction:column; z-index:999;
  border-bottom:1px solid rgba(255,255,255,0.1);
}
.tm-mobile-menu.open { display:flex; }
.tm-mobile-menu a {
  color:rgba(255,255,255,0.85); text-decoration:none; font-size:var(--fs-md);
  font-weight:600; padding:0.9rem 0; border-bottom:1px solid rgba(255,255,255,0.08);
  text-transform:uppercase; letter-spacing:0.05em; transition:color 0.2s;
}
.tm-mobile-menu a:hover { color:var(--verde-lt); }
.tm-mobile-menu a:last-child { border-bottom:none; }

/* ===== BUTTONS ===== */
.btn-primary {
  background:var(--verde); color:white; padding:15px 34px;
  border-radius:6px; font-weight:700; font-size:var(--fs-base);
  text-transform:uppercase; letter-spacing:0.06em; text-decoration:none;
  transition:all 0.25s; display:inline-flex; align-items:center;
  gap:0.5rem; border:2px solid var(--verde); cursor:pointer; font-family:var(--font);
}
.btn-primary:hover { background:var(--verde-lt); border-color:var(--verde-lt); transform:translateY(-2px); box-shadow:0 12px 30px rgba(117,185,98,0.35); }
.btn-secondary {
  background:transparent; color:white; padding:15px 34px;
  border-radius:6px; font-weight:600; font-size:var(--fs-base);
  text-transform:uppercase; letter-spacing:0.06em; text-decoration:none;
  border:2px solid rgba(255,255,255,0.45); transition:all 0.25s;
  display:inline-flex; align-items:center; gap:0.4rem;
}
.btn-secondary:hover { border-color:white; background:rgba(255,255,255,0.12); }
.btn-azul { background:var(--azul); border-color:var(--azul); }
.btn-azul:hover { background:#1d3d80; border-color:#1d3d80; box-shadow:0 12px 30px rgba(28,51,119,0.35); }
.btn-azulmd { background:var(--azul-md); border-color:var(--azul-md); }
.btn-azulmd:hover { background:var(--azul-lt); border-color:var(--azul-lt); box-shadow:0 12px 30px rgba(51,101,174,0.35); }
.btn-outline-white { background:transparent; color:white; border-color:rgba(255,255,255,0.5); }
.btn-outline-white:hover { background:rgba(255,255,255,0.1); border-color:white; }

/* ===== SECTION COMMONS ===== */
.tm-label {
  font-size:var(--fs-xs); font-weight:700; letter-spacing:0.2em;
  text-transform:uppercase; color:var(--verde); margin-bottom:0.85rem;
  display:flex; align-items:center; gap:0.65rem;
}
.tm-label::before { content:''; display:block; width:24px; height:2px; background:var(--verde); border-radius:2px; flex-shrink:0; }
.tm-label.centered { justify-content:center; }
.tm-label.centered::before { display:none; }
.tm-label.light { color:var(--verde-lt); }
.tm-label.light::before { background:var(--verde-lt); }
.tm-label.on-dark { color:rgba(255,255,255,0.55); }
.tm-label.on-dark::before { background:rgba(255,255,255,0.3); }
.tm-title {
  font-size:clamp(2rem, 4vw, 3.4rem);
  font-weight:800; color:var(--azul); line-height:1.12; letter-spacing:-0.01em;
}
.tm-title em { font-style:italic; color:var(--azul-md); font-weight:700; }
.tm-title.white { color:white; }
.tm-title.white em { color:var(--verde-lt); }
.tm-title.green em { color:var(--verde); }
.tm-intro { font-size:var(--fs-lg); color:var(--gris); line-height:1.75; font-weight:400; margin-top:1rem; }

/* ===== PAGE HERO (inner pages) ===== */
.tm-page-hero {
  padding-top:70px; min-height:380px;
  display:flex; align-items:flex-end; padding-bottom:4.5rem;
  padding-left:8%; padding-right:8%; position:relative; overflow:hidden;
  background:linear-gradient(150deg, rgba(28,51,119,0.97) 0%, rgba(51,101,174,0.90) 55%, rgba(117,185,98,0.38) 100%);
}
.tm-page-hero-bg { position:absolute; inset:0; background-size:cover; background-position:center; opacity:0.14; }
.tm-page-hero-content { position:relative; z-index:1; max-width:800px; }
.tm-page-hero h1 {
  font-size:clamp(2rem, 4.5vw, 3.8rem); font-weight:800;
  color:white; line-height:1.1; letter-spacing:-0.01em; margin-top:0.5rem;
}
.tm-page-hero h1 em { font-style:italic; color:var(--verde-lt); font-weight:700; }
.tm-page-hero p { color:rgba(255,255,255,0.75); font-size:var(--fs-lg); margin-top:1rem; max-width:560px; line-height:1.7; font-weight:400; }
.tm-breadcrumb {
  display:flex; gap:0.5rem; align-items:center;
  font-size:var(--fs-xs); color:rgba(255,255,255,0.4);
  text-transform:uppercase; letter-spacing:0.1em; margin-top:1rem; font-weight:600;
}
.tm-breadcrumb a { color:rgba(255,255,255,0.55); text-decoration:none; transition:color 0.2s; }
.tm-breadcrumb a:hover { color:white; }
.tm-breadcrumb span { color:rgba(255,255,255,0.22); }

/* ===== FOOTER ===== */
.tm-footer { background:var(--azul); padding:5rem 8% 2rem; }
.tm-footer-grid { display:grid; grid-template-columns:2fr 1fr 1fr 1.2fr; gap:4rem; padding-bottom:4rem; border-bottom:1px solid rgba(255,255,255,0.08); }
.tm-footer-logo img { height:38px; width:auto; display:block; margin-bottom:1rem; }
.tm-footer-tagline { font-size:var(--fs-base); color:rgba(255,255,255,0.5); line-height:1.65; font-weight:400; max-width:260px; margin-top:0.5rem; }
.tm-footer-col h4 { font-size:var(--fs-xs); font-weight:700; text-transform:uppercase; letter-spacing:0.18em; color:var(--verde-lt); margin-bottom:1.25rem; }
.tm-footer-col ul { list-style:none; }
.tm-footer-col ul li { margin-bottom:0.6rem; }
.tm-footer-col ul li a { color:rgba(255,255,255,0.55); text-decoration:none; font-size:var(--fs-base); transition:color 0.2s; font-weight:400; }
.tm-footer-col ul li a:hover { color:white; }
.tm-footer-newsletter p { font-size:var(--fs-base); color:rgba(255,255,255,0.5); margin-bottom:1rem; line-height:1.65; font-weight:400; }
.tm-footer-newsletter .input-row { display:flex; }
.tm-footer-newsletter input { flex:1; padding:11px 14px; background:rgba(255,255,255,0.07); border:1px solid rgba(255,255,255,0.12); border-right:none; border-radius:5px 0 0 5px; font-family:var(--font); font-size:var(--fs-base); color:white; outline:none; }
.tm-footer-newsletter input::placeholder { color:rgba(255,255,255,0.28); }
.tm-footer-newsletter button { background:var(--verde); color:white; border:none; padding:11px 16px; border-radius:0 5px 5px 0; font-size:var(--fs-xs); font-weight:700; cursor:pointer; font-family:var(--font); transition:background 0.2s; white-space:nowrap; }
.tm-footer-newsletter button:hover { background:var(--verde-lt); }
.tm-footer-bottom { padding-top:2rem; display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:1rem; }
.tm-footer-bottom p { font-size:var(--fs-xs); color:rgba(255,255,255,0.3); font-weight:400; }
.tm-footer-legal { display:flex; gap:1.5rem; }
.tm-footer-legal a { font-size:var(--fs-xs); color:rgba(255,255,255,0.3); text-decoration:none; transition:color 0.2s; text-transform:uppercase; letter-spacing:0.08em; }
.tm-footer-legal a:hover { color:rgba(255,255,255,0.7); }

/* ===== FOOTER HTML SNIPPET (reuse) ===== */
.tm-footer-inner { display:contents; }

/* ===== RESPONSIVE ===== */
@media (max-width:1024px) { .tm-footer-grid { grid-template-columns:1fr 1fr; } }
@media (max-width:768px) {
  .tm-nav-links { display:none; }
  .tm-hamburger { display:flex; }
  .tm-footer-grid { grid-template-columns:1fr; gap:2rem; }
  .tm-footer { padding:4rem 6% 2rem; }
  .tm-page-hero { min-height:300px; padding-bottom:3rem; padding-left:6%; padding-right:6%; }
  .tm-page-hero h1 { font-size:clamp(1.8rem,6vw,2.6rem); }
}

/* ===== LANGUAGE SWITCHER ===== */
.tm-lang-switch {
  font-size:var(--fs-xs); font-weight:700; color:rgba(255,255,255,0.6);
  text-decoration:none; border:1.5px solid rgba(255,255,255,0.2);
  padding:5px 12px; border-radius:5px; transition:all 0.2s;
  letter-spacing:0.05em; display:flex; align-items:center; gap:0.35rem;
}
.tm-lang-switch:hover { color:white; border-color:rgba(255,255,255,0.55); background:rgba(255,255,255,0.08); }