/*
  Truly Nolen El Salvador — sistema visual compartido
  Este archivo contiene solamente decisiones globales aprobadas.
  Los estilos particulares de cada página deben vivir en su propio CSS.
*/
:root{
  --tn-yellow:#ffd639;
  --tn-red:#e20d18;
  --tn-green:#21d271;
  --tn-ink:#070707;
  --tn-paper:#f4f2ec;
  --tn-paper-alt:#ebe9e1;
  --tn-white:#fff;
  --tn-muted:#66645f;
  --tn-line:#d2cec4;
  --tn-dark-line:rgba(255,255,255,.13);

  --tn-font-sans:Inter,Arial,Helvetica,sans-serif;
  --tn-font-mono:ui-monospace,Consolas,monospace;
  --tn-type-hero:clamp(2.115rem,2.52vw,3.195rem);
  --tn-type-section:clamp(1.845rem,2.25vw,2.88rem);
  --tn-type-eyebrow:clamp(.88rem,.78vw,.98rem);
  --tn-type-card:clamp(1.45rem,1.62vw,1.8rem);
  --tn-type-lead:clamp(1.02rem,1.06vw,1.16rem);
  --tn-type-body:clamp(.98rem,.92vw,1.06rem);
  --tn-type-meta:clamp(.76rem,.7vw,.84rem);

  --tn-site-width:min(1380px,88vw);
  --tn-site-gutter:max(6vw,calc((100vw - 1380px)/2));
  --tn-section-space:12vh;
  --tn-section-space-mobile:88px;
  --tn-header-height:88px;
  --tn-header-height-mobile:76px;
  --tn-focus:3px solid var(--tn-yellow);
  --tn-radius-small:3px;
  --tn-shadow-button:0 14px 50px #ffd63925;
  --tn-shadow-button-hover:0 18px 60px #ffd63942;
}

*,*::before,*::after{box-sizing:border-box}

:focus-visible{
  outline:var(--tn-focus);
  outline-offset:4px;
}

img{max-width:100%}

.tn-container{
  width:var(--tn-site-width);
  margin-inline:auto;
}

/* Fondos a todo lo ancho con contenido alineado al contenedor global. */
.tn-full-bleed{
  width:100% !important;
  max-width:none !important;
  margin-inline:0 !important;
}

.tn-gutter-left{padding-left:var(--tn-site-gutter) !important}
.tn-gutter-right{padding-right:var(--tn-site-gutter) !important}

.tn-section{
  padding-block:var(--tn-section-space);
}

.tn-hero-title{
  max-width:740px;
  margin:0 0 26px;
  font:950 var(--tn-type-hero)/1.04 var(--tn-font-sans);
  letter-spacing:-.045em;
}

.tn-section-title{
  max-width:850px;
  margin:18px 0 24px;
  font:950 var(--tn-type-section)/1.02 var(--tn-font-sans);
  letter-spacing:-.045em;
}

.tn-hero-title em,
.tn-section-title em{
  color:var(--tn-title-accent,var(--tn-red));
  font-style:normal;
}

.tn-eyebrow{
  --tn-eyebrow-color:#44413c;
  --tn-eyebrow-accent:var(--tn-red);
  display:flex;
  align-items:center;
  gap:12px;
  margin:0;
  color:var(--tn-eyebrow-color);
  font:850 var(--tn-type-eyebrow)/1.4 var(--tn-font-mono);
  letter-spacing:1.45px;
  text-transform:uppercase;
}

.tn-eyebrow::before{
  content:"";
  width:31px;
  height:2px;
  flex:0 0 auto;
  background:var(--tn-eyebrow-accent);
}

.tn-eyebrow--dark{
  --tn-eyebrow-color:#ddd;
  --tn-eyebrow-accent:var(--tn-yellow);
}

.tn-lead{
  max-width:670px;
  margin:0;
  font:400 var(--tn-type-lead)/1.68 var(--tn-font-sans);
}

.tn-section-copy{
  max-width:720px;
  margin:0;
  color:var(--tn-muted);
  font:400 var(--tn-type-body)/1.72 var(--tn-font-sans);
}

.tn-card-title{
  margin:0;
  font:950 var(--tn-type-card)/1.16 var(--tn-font-sans);
  letter-spacing:-.025em;
}

.tn-actions{
  display:flex;
  align-items:center;
  gap:26px;
  margin-top:34px;
}

.tn-button{
  display:inline-flex;
  align-items:center;
  justify-content:space-between;
  gap:32px;
  border-radius:var(--tn-radius-small);
  font-family:var(--tn-font-sans);
  text-decoration:none;
}

.tn-button--primary{
  min-width:270px;
  padding:18px 22px;
  border:1px solid var(--tn-yellow);
  background:var(--tn-yellow);
  color:#050505;
  font-weight:950;
  box-shadow:var(--tn-shadow-button);
  transition:transform .22s,box-shadow .22s;
}

.tn-button--primary:hover{
  transform:translateY(-3px);
  box-shadow:var(--tn-shadow-button-hover);
}

.tn-button--secondary{
  padding:12px 0;
  border-bottom:1px solid var(--tn-yellow);
  border-radius:0;
  color:inherit;
  font-size:14px;
  font-weight:900;
}

.tn-context-link{
  color:inherit;
  font-weight:800;
  text-decoration-line:underline;
  text-decoration-thickness:1.5px;
  text-decoration-color:var(--tn-link-accent,var(--tn-red));
  text-underline-offset:4px;
  transition:color .2s,text-decoration-color .2s;
}

.tn-context-link:hover{color:var(--tn-link-accent,var(--tn-red))}

@media(max-width:760px){
  :root{
    --tn-site-width:calc(100% - 40px);
    --tn-site-gutter:20px;
  }

  .tn-section{
    padding-block:var(--tn-section-space-mobile);
  }

  .tn-hero-title{
    line-height:1.06;
  }

  .tn-section-title{
    line-height:1.06;
  }

  .tn-actions{
    align-items:stretch;
    flex-direction:column;
    gap:13px;
  }

  .tn-button--primary{
    width:100%;
    min-width:0;
  }

  .tn-button--secondary{
    justify-content:center;
    text-align:center;
  }
}

@media(max-width:590px){
  :root{
    --tn-type-hero:clamp(2.15rem,10vw,2.65rem);
    --tn-type-section:clamp(2rem,9vw,2.45rem);
    --tn-type-eyebrow:.88rem;
    --tn-type-lead:1.04rem;
    --tn-type-card:1.48rem;
    --tn-type-body:1rem;
    --tn-type-meta:.78rem;
  }
}

@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .tn-button--primary{transition:none}
}