/* ============================================================
   Bigo Funcis — hoja de estilos compartida
   Sistema: papel de contabilidad / editorial financiero
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,400;9..144,500;9..144,600;9..144,700&family=Source+Serif+4:ital,wght@0,400;0,500;0,600;1,400&family=JetBrains+Mono:wght@400;500;600&display=swap');

:root{
  --paper:      #E9E3D3;
  --paper-2:    #E1D9C4;
  --ink:        #1E271F;
  --ink-soft:   #46523F;
  --ink-faint:  #6C7663;
  --copper:     #A2652F;
  --copper-dark:#7C4B21;
  --teal:       #35625A;
  --teal-dark:  #234139;
  --gold:       #B5891C;
  --line:       #C6BC9F;
  --line-soft:  #D8D0B9;
  --white:      #FBF9F2;
  --shadow:     0 1px 0 rgba(30,39,31,.06);

  --font-display: 'Fraunces', serif;
  --font-body:    'Source Serif 4', serif;
  --font-mono:    'JetBrains Mono', monospace;

  --measure: 68ch;
}

*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:var(--font-body);
  font-size:17px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
img{ max-width:100%; display:block; }
a{ color:var(--teal-dark); text-decoration-thickness:1px; text-underline-offset:3px; }
a:hover{ color:var(--copper-dark); }
a:focus-visible, button:focus-visible{
  outline:2px solid var(--copper);
  outline-offset:3px;
}
h1,h2,h3,h4{
  font-family:var(--font-display);
  font-weight:600;
  color:var(--ink);
  margin:0 0 .5em;
  letter-spacing:-0.01em;
}
p{ margin:0 0 1.1em; }
.eyebrow{
  font-family:var(--font-mono);
  font-size:.72rem;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--copper-dark);
}
.wrap{
  max-width:1180px;
  margin:0 auto;
  padding:0 clamp(1.25rem,4vw,3rem);
}
.measure{ max-width:var(--measure); }

/* ---------- disclaimer bar (home, top) ---------- */
.disclaimer-top{
  background:var(--teal-dark);
  color:var(--white);
  font-family:var(--font-mono);
  font-size:.82rem;
  line-height:1.55;
  padding:.85rem 0;
  border-bottom:3px solid var(--gold);
}
.disclaimer-top .wrap{ display:flex; gap:.75rem; align-items:flex-start; }
.disclaimer-top strong{ color:var(--gold); font-weight:600; }
.disclaimer-icon{ flex:0 0 auto; font-size:1rem; line-height:1.55; }

/* ---------- inline brand-mention notice ---------- */
.brand-notice{
  font-family:var(--font-mono);
  font-size:.76rem;
  color:var(--ink-faint);
  border-left:2px solid var(--line);
  padding:.4rem 0 .4rem .9rem;
  margin:.6rem 0 1.4rem;
}

/* ---------- header ---------- */
.site-header{
  border-bottom:1px solid var(--line);
  background:var(--paper);
  position:sticky; top:0; z-index:20;
  backdrop-filter:saturate(1.1);
}
.site-header .wrap{
  display:flex; align-items:center; justify-content:space-between;
  padding-top:1rem; padding-bottom:1rem; gap:1.5rem; flex-wrap:wrap;
}
.brand{ display:flex; align-items:baseline; gap:.65rem; }
.brand-name{
  font-family:var(--font-display);
  font-weight:700;
  font-size:1.5rem;
  color:var(--ink);
  text-decoration:none;
  letter-spacing:-.01em;
}
.brand-tag{
  font-family:var(--font-mono);
  font-size:.66rem;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--teal-dark);
  background:var(--paper-2);
  border:1px solid var(--line);
  padding:.28rem .55rem;
  border-radius:2px;
  white-space:nowrap;
}
nav.site-nav ul{
  list-style:none; display:flex; gap:1.6rem; margin:0; padding:0; flex-wrap:wrap;
}
nav.site-nav a{
  font-family:var(--font-mono);
  font-size:.82rem;
  text-transform:uppercase;
  letter-spacing:.04em;
  color:var(--ink-soft);
  text-decoration:none;
  padding-bottom:.2rem;
  border-bottom:2px solid transparent;
}
nav.site-nav a:hover, nav.site-nav a[aria-current="page"]{
  color:var(--ink);
  border-bottom-color:var(--copper);
}

/* ---------- hero (home) ---------- */
.hero{
  padding:clamp(2.5rem,6vw,5rem) 0 clamp(2rem,5vw,3.5rem);
  border-bottom:1px solid var(--line);
}
.hero .wrap{
  display:grid;
  grid-template-columns:1.15fr .85fr;
  gap:clamp(2rem,5vw,4rem);
  align-items:center;
}
.hero h1{
  font-size:clamp(2.1rem,4.4vw,3.4rem);
  line-height:1.05;
}
.hero h1 em{
  font-style:italic;
  color:var(--copper-dark);
}
.hero .lede{
  font-size:1.1rem;
  color:var(--ink-soft);
  max-width:52ch;
}
.hero-ring{ width:100%; height:auto; }
.hero-cta{
  display:inline-flex; gap:.6rem; align-items:center;
  font-family:var(--font-mono); font-size:.85rem; text-transform:uppercase;
  letter-spacing:.05em; color:var(--white); background:var(--teal-dark);
  padding:.75rem 1.15rem; border-radius:2px; text-decoration:none; margin-top:.5rem;
}
.hero-cta:hover{ background:var(--copper-dark); color:var(--white); }

/* ---------- what-it-is / what-it-isnt ---------- */
.identity-split{
  display:grid; grid-template-columns:1fr 1fr; gap:1px;
  background:var(--line); border:1px solid var(--line); margin:2.5rem 0;
}
.identity-split > div{ background:var(--paper); padding:1.6rem 1.8rem; }
.identity-split h3{
  font-family:var(--font-mono); font-size:.82rem; text-transform:uppercase;
  letter-spacing:.06em; margin-bottom:.8rem;
}
.identity-split .yes h3{ color:var(--teal-dark); }
.identity-split .no h3{ color:var(--copper-dark); }
.identity-split ul{ margin:0; padding-left:1.1rem; }
.identity-split li{ margin-bottom:.5rem; color:var(--ink-soft); }

/* ---------- section headers ---------- */
.section-head{
  display:flex; align-items:baseline; gap:1rem; justify-content:space-between;
  margin:3rem 0 1.4rem; flex-wrap:wrap;
}
.section-head h2{ font-size:1.7rem; }
.section-head .eyebrow{ margin-bottom:.3rem; display:block; }

/* ---------- article grid (home) ---------- */
.article-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(260px,1fr));
  gap:1.6rem;
  margin-bottom:3.5rem;
}
.article-card{
  background:var(--white);
  border:1px solid var(--line);
  border-top:4px solid var(--teal);
  padding:1.5rem 1.5rem 1.4rem;
  display:flex; flex-direction:column; gap:.7rem;
  text-decoration:none; color:inherit;
}
.article-card:nth-child(2n){ border-top-color:var(--copper); }
.article-card:nth-child(3n){ border-top-color:var(--gold); }
.article-card .stage{
  font-family:var(--font-mono); font-size:.68rem; text-transform:uppercase;
  letter-spacing:.08em; color:var(--ink-faint);
}
.article-card h3{
  font-size:1.18rem; margin-bottom:0; color:var(--ink);
}
.article-card p{ color:var(--ink-soft); font-size:.95rem; margin-bottom:0; }
.article-card .read-more{
  font-family:var(--font-mono); font-size:.78rem; color:var(--teal-dark);
  margin-top:auto;
}
.article-card:hover .read-more{ color:var(--copper-dark); }

/* ---------- two-column editorial (about) ---------- */
.editorial-split{
  display:grid; grid-template-columns:.85fr 1.15fr; gap:clamp(2rem,5vw,4rem);
  padding:clamp(2.5rem,5vw,4rem) 0;
  align-items:start;
}
.editorial-split figure{ margin:0; position:sticky; top:6.5rem; }
.editorial-split figcaption{
  font-family:var(--font-mono); font-size:.75rem; color:var(--ink-faint);
  margin-top:.6rem;
}
.editorial-split .col-text h2{ font-size:1.5rem; margin-top:1.8rem; }
.editorial-split .col-text h2:first-child{ margin-top:0; }

/* ---------- numbered policy list ---------- */
.policy-list{ list-style:none; margin:2rem 0; padding:0; counter-reset:policy; }
.policy-list li{
  counter-increment:policy;
  display:grid; grid-template-columns:3.2rem 1fr; gap:1.1rem;
  padding:1.4rem 0; border-top:1px solid var(--line);
}
.policy-list li:last-child{ border-bottom:1px solid var(--line); }
.policy-list .num{
  font-family:var(--font-mono); font-weight:600; color:var(--copper-dark);
  font-size:1rem; display:flex; align-items:flex-start; gap:.4rem;
}
.policy-list .num svg{ width:2rem; height:2rem; flex:0 0 auto; }
.policy-list h3{ font-size:1.08rem; margin-bottom:.35rem; }
.policy-list p{ color:var(--ink-soft); margin-bottom:0; font-size:.96rem; }

/* ---------- legal / document pages ---------- */
.doc-page{ padding:clamp(2.5rem,5vw,4rem) 0 5rem; }
.doc-page .wrap{ max-width:760px; }
.doc-page h1{ font-size:2rem; border-bottom:2px solid var(--ink); padding-bottom:.6rem; }
.doc-page .updated{
  font-family:var(--font-mono); font-size:.78rem; color:var(--ink-faint); margin-bottom:2rem;
}
.doc-page h2{ font-size:1.2rem; margin-top:2.4rem; color:var(--teal-dark); }
.doc-page p, .doc-page li{ color:var(--ink-soft); }
.doc-table{
  width:100%; border-collapse:collapse; margin:1.5rem 0 2rem;
  font-family:var(--font-mono); font-size:.86rem;
}
.doc-table th, .doc-table td{
  text-align:left; padding:.6rem .8rem; border:1px solid var(--line); vertical-align:top;
}
.doc-table th{ background:var(--paper-2); width:34%; color:var(--ink); }
.doc-page ul, .doc-page ol{ padding-left:1.3rem; }

/* ---------- general disclaimer callout (used in-article) ---------- */
.callout{
  background:var(--paper-2);
  border-left:3px solid var(--gold);
  padding:1rem 1.2rem;
  margin:1.6rem 0;
  font-size:.95rem;
  color:var(--ink-soft);
}
.callout strong{ color:var(--ink); }

/* ---------- data-point / "sabias que" box ---------- */
.databox{
  background:var(--teal-dark);
  color:var(--white);
  padding:1.6rem 1.8rem;
  margin:2rem 0;
  border-radius:2px;
}
.databox .eyebrow{ color:var(--gold); }
.databox p{ color:var(--white); margin-bottom:0; font-size:1.02rem; }

/* ---------- article detail ---------- */
.article-detail{ padding:clamp(2rem,5vw,3.5rem) 0 4rem; }
.article-detail .wrap{ max-width:760px; }
.article-detail h1{ font-size:clamp(1.9rem,3.6vw,2.6rem); }
.article-meta{
  font-family:var(--font-mono); font-size:.78rem; color:var(--ink-faint);
  display:flex; gap:1rem; flex-wrap:wrap; margin-bottom:2rem;
}
.article-detail h2{ font-size:1.3rem; color:var(--ink); margin-top:2.2rem; }
.sources{ font-size:.92rem; }
.sources li{ margin-bottom:.4rem; }
hr.rule{ border:none; border-top:1px solid var(--line); margin:2.4rem 0; }

/* ---------- footer ---------- */
footer.site-footer{
  background:var(--ink);
  color:var(--paper);
  padding:3rem 0 2rem;
  margin-top:3rem;
}
footer.site-footer .footer-disclaimer{
  font-family:var(--font-mono); font-size:.82rem; line-height:1.6;
  color:var(--paper-2); border-bottom:1px solid #3A463A; padding-bottom:1.8rem; margin-bottom:1.8rem;
  max-width:80ch;
}
footer.site-footer .footer-disclaimer strong{ color:var(--gold); }
.footer-grid{
  display:grid; grid-template-columns:1.2fr 1fr 1fr; gap:2rem;
  margin-bottom:2rem;
}
.footer-grid h4{
  font-family:var(--font-mono); font-size:.72rem; text-transform:uppercase;
  letter-spacing:.08em; color:var(--gold); margin-bottom:.8rem;
}
.footer-grid ul{ list-style:none; margin:0; padding:0; }
.footer-grid li{ margin-bottom:.5rem; }
.footer-grid a{ color:var(--paper-2); text-decoration:none; font-size:.92rem; }
.footer-grid a:hover{ color:var(--white); text-decoration:underline; }
.footer-meta{
  font-family:var(--font-mono); font-size:.78rem; color:var(--ink-faint);
  border-top:1px solid #3A463A; padding-top:1.4rem;
  display:flex; justify-content:space-between; flex-wrap:wrap; gap:.6rem;
}

@media (max-width:860px){
  .hero .wrap, .editorial-split, .identity-split{ grid-template-columns:1fr; }
  .editorial-split figure{ position:static; max-width:320px; }
  .footer-grid{ grid-template-columns:1fr; }
  .policy-list li{ grid-template-columns:2.4rem 1fr; }
}