/* Skardata — hoja de estilo común */

:root{
  --bg:#eef0f2;
  --bg-alt:#dfe3e7;
  --bg-dark:#1b2733;
  --text:#151a20;
  --text-2:#636d78;
  --text-inv:#eef0f2;
  --accent:#2c4a7c;
  --accent-2:#a35a2a;
  --line:#c2c9d0;
  --line-dark:#3a4855;
  --serif:Georgia,"Times New Roman",serif;
  --sans:system-ui,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
}

*{box-sizing:border-box}

html{-webkit-text-size-adjust:100%}

body{
  margin:0;
  background:var(--bg);
  color:var(--text);
  font-family:var(--sans);
  font-size:18px;
  line-height:1.9;
  overflow-x:hidden;
}

p{margin:0 0 1.5em}
p:last-child{margin-bottom:0}

a{color:var(--accent);text-decoration:underline;text-underline-offset:3px}
a:hover{text-decoration-thickness:2px}
a:focus-visible,
li a:focus-visible{outline:2px solid var(--accent);outline-offset:3px;background:#dde3ec}

img{max-width:100%;height:auto;display:block}

h1,h2,h3{font-family:var(--serif);font-weight:400;line-height:1.3;margin:0}
h1{font-size:2.35rem;letter-spacing:.005em}
h2{font-size:1.62rem;margin-bottom:.7em}
h3{font-size:1.18rem;margin-bottom:.5em}

.wrap{max-width:1160px;margin:0 auto;padding:0 24px}

/* ---------- rejilla de celdas ---------- */

.cells{
  display:grid;
  grid-template-columns:repeat(12,minmax(0,1fr));
  gap:1px;
  background:var(--line);
  border:1px solid var(--line);
}
.cell{background:var(--bg);padding:26px 24px;min-width:0}
.alt .cell{background:var(--bg-alt)}
.c3{grid-column:span 3}
.c4{grid-column:span 4}
.c5{grid-column:span 5}
.c6{grid-column:span 6}
.c7{grid-column:span 7}
.c8{grid-column:span 8}
.c9{grid-column:span 9}
.c12{grid-column:span 12}
.cell--empty{padding:0}

/* ---------- separador tejido ---------- */

.rule{border:0;margin:0;padding:0;height:9px;position:relative}
.rule::before,.rule::after{content:"";position:absolute;left:0;right:0}
.rule::before{top:0;height:2px;background:var(--accent)}
.rule::after{top:8px;height:1px;background:var(--accent-2)}

/* ---------- cabecera y navegación ---------- */

.site-head{border-bottom:1px solid var(--line);background:var(--bg)}
.site-head .wrap{
  display:flex;flex-wrap:wrap;align-items:baseline;
  justify-content:space-between;gap:12px;padding-top:20px;padding-bottom:20px;
}
.brand{font-family:var(--serif);font-size:1.32rem;letter-spacing:.14em;text-transform:uppercase;text-decoration:none;color:var(--text)}
.brand:hover{color:var(--accent)}
.site-nav ul{list-style:none;display:flex;flex-wrap:wrap;gap:6px 22px;margin:0;padding:0}
.site-nav a{font-size:.92rem;text-decoration:none;color:var(--text);border-bottom:1px solid transparent;padding-bottom:2px}
.site-nav a:hover{border-bottom-color:var(--accent);color:var(--accent)}
.site-nav a[aria-current="page"]{border-bottom-color:var(--accent-2);color:var(--text)}

/* ---------- portada ---------- */

.hero{padding:64px 0 0}
.hero-title{
  border-top:2px solid var(--text);
  border-bottom:1px solid var(--accent-2);
  padding:30px 0 34px;
}
.hero-title h1{max-width:none;width:100%}
.hero-grid{margin-top:34px}
.kicker{
  font-size:.8rem;letter-spacing:.2em;text-transform:uppercase;
  color:var(--accent-2);margin:0 0 14px;
}
.lead{font-size:1.06rem}

/* listas */

.tlist{list-style:none;margin:0;padding:0}
.tlist li{position:relative;padding-left:22px;margin-bottom:.55em;line-height:1.65;font-size:.98rem}
.tlist li::before{
  content:"";position:absolute;left:0;top:.62em;
  width:7px;height:7px;background:var(--accent);
}
.tlist--copper li::before{background:var(--accent-2)}
.tlist li:last-child{margin-bottom:0}

.check{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
  gap:1px;background:var(--line);border:1px solid var(--line);margin:26px 0 0;
}
.check > div{background:var(--bg);padding:20px 22px}
.alt .check > div{background:var(--bg-alt)}
.check h3{font-family:var(--sans);font-size:.82rem;letter-spacing:.16em;text-transform:uppercase;color:var(--accent-2);margin-bottom:12px}

/* ---------- secciones ---------- */

.band{padding:72px 0}
.band--alt{background:var(--bg-alt)}
.band--dark{background:var(--bg-dark);color:var(--text-inv)}
.band--dark h2,.band--dark h3{color:var(--text-inv)}
.band--dark a{color:#a8bcdc}
.band--dark .kicker{color:#c58a5c}
.band--dark .cells{background:var(--line-dark);border-color:var(--line-dark)}
.band--dark .cell{background:var(--bg-dark)}
.band--dark .tlist li::before{background:#a8bcdc}
.band--dark .caption{color:#9aa8b6}

.snum{
  font-family:var(--serif);font-size:.9rem;color:var(--accent-2);
  letter-spacing:.14em;display:block;margin-bottom:8px;
}
.prose{max-width:74ch}
.prose h2{margin-top:0}
.sec + .sec{margin-top:56px}

/* ---------- imágenes ---------- */

.figure{margin:0;border:1px solid var(--line);padding:10px;background:var(--bg)}
.alt .figure,.band--alt .figure{background:var(--bg-alt)}
.caption{font-size:14px;line-height:1.6;color:var(--text-2)}
.caption .capnum{color:var(--accent-2);letter-spacing:.14em;display:block;margin-bottom:6px;font-size:.78rem;text-transform:uppercase}
.media{align-items:start}
.detail-fig{border:1px solid var(--line-dark);padding:10px;margin:0}

/* ---------- about ---------- */

.about-grid{
  display:grid;grid-template-columns:minmax(0,3fr) 1px minmax(0,8fr);
  gap:34px;align-items:stretch;
}
.about-rail{position:relative}
.about-line{background:var(--line)}
.about-rail .tlist li{font-size:.9rem;color:var(--text-2)}

/* ---------- pie ---------- */

.site-foot{background:var(--bg-alt);border-top:2px solid var(--accent);padding:0 0 48px}
.foot-rule{height:1px;background:var(--accent-2);margin-bottom:44px}
.foot-cells{
  display:grid;grid-template-columns:repeat(4,minmax(0,1fr));
  gap:1px;background:var(--line);border:1px solid var(--line);
}
.foot-cells > div{background:var(--bg-alt);padding:24px 22px;font-size:.94rem;line-height:1.7}
.foot-cells h2{font-family:var(--sans);font-size:.78rem;letter-spacing:.18em;text-transform:uppercase;color:var(--accent-2);margin-bottom:12px}
.foot-cells ul{list-style:none;margin:0;padding:0}
.foot-cells li{margin-bottom:.4em}
.foot-cells a{color:var(--text)}
.foot-cells a:hover{color:var(--accent)}
.foot-name{font-family:var(--serif);font-size:1.2rem;letter-spacing:.12em;text-transform:uppercase}
.foot-note{color:var(--text-2);font-size:.88rem}

/* ---------- páginas internas ---------- */

.page-head{padding:56px 0 0}
.page-head h1{border-top:2px solid var(--text);border-bottom:1px solid var(--accent-2);padding:26px 0 30px;font-size:2rem}
.doc h2{margin-top:2.2em}
.doc h2:first-of-type{margin-top:1.4em}
.doc h3{margin-top:1.8em}
.doc{padding-bottom:72px}

/* ---------- responsive ---------- */

@media (max-width:900px){
  body{font-size:17px;line-height:1.8}
  h1{font-size:1.95rem}
  h2{font-size:1.42rem}
  .band{padding:44px 0}
  .hero{padding:40px 0 0}
  .sec + .sec{margin-top:40px}
  .c3,.c4,.c5,.c6,.c7,.c8,.c9,.c12{grid-column:span 12}
  .cell--empty{display:none}
  .about-grid{grid-template-columns:minmax(0,1fr);gap:24px}
  .about-line{height:1px;width:100%}
  .foot-cells{grid-template-columns:minmax(0,1fr)}
  .check{grid-template-columns:minmax(0,1fr)}
  .site-head .wrap{flex-direction:column;align-items:flex-start}
}

@media (max-width:520px){
  .wrap{padding:0 16px}
  h1{font-size:1.7rem}
  .cell{padding:20px 18px}
  .site-nav ul{gap:4px 16px}
}