@import url('https://fonts.googleapis.com/css2?family=Libre+Baskerville:ital,wght@0,400;0,700;1,400&family=Inter:wght@300;400;500;600;700&display=swap');

:root{
  --ink:#15171B;
  --cream:#F7F3EC;
  --cream2:#EFE9DD;
  --gold:#B08D3F;
  --gold-light:#CBA968;
  --text:#2B2B2B;
  --grey:#6b6558;
  --hair:rgba(176,141,63,0.35);
  --maxw:1180px;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth; overflow-x:hidden;}
body{
  margin:0;
  overflow-x:hidden;
  max-width:100vw;
  background:var(--cream);
  color:var(--text);
  font-family:'Inter',sans-serif;
  font-weight:400;
  line-height:1.6;
  letter-spacing:0.4px;
  -webkit-font-smoothing:antialiased;
}

h1,h2,h3,.serif{ font-family:'Libre Baskerville', Georgia, serif; letter-spacing:0.5px; }

a{ color:inherit; text-decoration:none; }
img{ max-width:100%; display:block; border-radius:7px; }

/* Distinción: ninguna esquina a 90°, redondeo sutil de ~2mm en todo el sitio */
img, .card, .btn, .tag, .lineItem, .portCard, .contactCard, .pill-note,
.quoteGrid img, header.site, .navSide, .navSide a, section.panel-dark,
input, textarea, .cardGrid .card{
  border-radius:7px;
}
.hero .visual::after{ border-radius:0; }

.wrap{ max-width:var(--maxw); margin:0 auto; padding:0 32px; }

.eyebrow{
  font-family:'Inter',sans-serif;
  font-weight:600;
  font-size:12px;
  letter-spacing:3px;
  text-transform:uppercase;
  color:var(--gold);
}
.eyebrow.onDark{ color:var(--gold-light); }

.hair{ border:none; border-top:1px solid var(--hair); }

/* ---------- NAV ---------- */
/* Distinción: la barra de navegación no vive arriba como en cualquier sitio
   corporativo; se replegó a un listón vertical, discreto, sobre el borde
   derecho de la pantalla. El encabezado superior conserva únicamente el
   emblema. */
header.site{
  position:sticky; top:0; z-index:50;
  background:rgba(21,23,27,0.96);
  backdrop-filter:blur(6px);
  border-bottom:1px solid rgba(176,141,63,0.25);
}
header.site .wrap{
  display:flex; align-items:center; justify-content:flex-start;
  height:auto; padding-top:10px; padding-bottom:10px;
}
.brandmark{ display:flex; align-items:center; gap:12px; }
.brandmark img{ height:52px; width:auto; border-radius:0; }
.brandmark .word{ font-family:'Libre Baskerville',serif; font-size:20px; letter-spacing:3px; color:#F2EFE8; }

nav.main{
  position:fixed; top:92px; right:22px;
  z-index:60; display:flex; flex-direction:column; align-items:flex-end; gap:2px;
  background:rgba(21,23,27,0.94); backdrop-filter:blur(6px);
  border:1px solid rgba(176,141,63,0.35); border-radius:9px;
  padding:20px 10px; max-height:calc(100vh - 112px); overflow:visible;
}
nav.main::before{
  content:"\2022"; display:block; color:var(--gold-light); font-size:10px;
  text-align:center; width:100%; margin-bottom:10px; opacity:.8;
}
nav.main a{
  font-size:11px; letter-spacing:1.8px; text-transform:uppercase; font-weight:500;
  color:#C9C4B6; transition:color .2s ease, letter-spacing .2s ease;
  padding:9px 6px; writing-mode:vertical-rl; text-orientation:mixed;
}
nav.main a:hover, nav.main a.active{ color:var(--gold-light); letter-spacing:2.4px; }
/* pequeños detalles de distinción junto a ciertas pestañas */
nav.main a:nth-child(1)::after{ content:" \1F4CD"; writing-mode:horizontal-tb; font-size:10px; }
nav.main a:nth-child(2)::after{ content:" \2753"; writing-mode:horizontal-tb; font-size:9px; opacity:.8; }
nav.main a:nth-child(5)::after{ content:" \1F4BC"; writing-mode:horizontal-tb; font-size:10px; }
.navToggle{ display:none; background:none; border:none; color:#F2EFE8; font-size:24px; cursor:pointer; }

@media (max-width: 860px){
  header.site .wrap{ justify-content:space-between; }
  nav.main{
    display:none; position:fixed; top:72px; right:0; left:0; bottom:auto;
    flex-direction:column; align-items:stretch; gap:0; background:#15171B;
    border:none; border-bottom:1px solid rgba(176,141,63,0.25); border-radius:0;
    padding:0; max-height:calc(100vh - 72px); overflow-y:auto;
  }
  nav.main::before{ display:none; }
  nav.main.open{ display:flex; }
  nav.main a{ padding:16px 32px; border-top:1px solid rgba(255,255,255,0.06); writing-mode:horizontal-tb; }
  .navToggle{ display:block; }
}

/* ---------- HERO ---------- */
.hero{
  background:var(--ink); color:#EDE9E0; position:relative; overflow:hidden;
}
.hero .grid{
  display:grid; grid-template-columns:1.1fr 0.9fr; gap:0; align-items:stretch; min-height:640px;
}
.hero .copy{ padding:100px 56px 100px 0; display:flex; flex-direction:column; justify-content:center; }
.hero h1{
  font-size:clamp(34px,4.4vw,54px); line-height:1.15; margin:18px 0 22px 0; font-weight:700;
  max-width:15ch;
}
.hero .thesis{ font-size:18px; color:#C9C4B6; max-width:46ch; margin-bottom:36px; line-height:1.7; }
.hero .ctas{ display:flex; gap:16px; flex-wrap:wrap; }
.btn{
  display:inline-block; padding:14px 28px; font-size:13px; letter-spacing:1.5px; text-transform:uppercase;
  font-weight:600; border:1px solid var(--gold); transition:all .2s ease;
}
.btn.solid{ background:var(--gold); color:#15171B; }
.btn.solid:hover{ background:var(--gold-light); border-color:var(--gold-light); }
.btn.ghost{ color:#F2EFE8; }
.btn.ghost:hover{ background:rgba(176,141,63,0.12); }

.hero .visual{ position:relative; }
.hero .visual img{ width:100%; height:100%; object-fit:cover; filter:grayscale(15%); }
.hero .visual::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(90deg, rgba(21,23,27,0.9), rgba(21,23,27,0));
}

@media (max-width: 860px){
  .hero .grid{ grid-template-columns:1fr; }
  .hero .copy{ padding:64px 24px 40px 24px; }
  .hero .visual{ height:280px; }
}

/* ---------- SECTIONS ---------- */
section{ padding:96px 0; }
section.tight{ padding:64px 0; }
.sectionHead{ max-width:640px; margin-bottom:56px; }
.sectionHead h2{ font-size:clamp(26px,3vw,36px); margin:14px 0 0 0; }

/* Lineas index list */
.lineList{ counter-reset:none; }
.lineItem{
  display:grid; grid-template-columns:70px 1fr; gap:24px;
  padding:30px 0; border-bottom:1px solid var(--hair);
}
/* Escalonado: cada línea inicia en un margen izquierdo distinto — detalle de distinción */
.lineList .lineItem:nth-child(3n+2){ margin-left:34px; }
.lineList .lineItem:nth-child(3n){ margin-left:68px; }
.lineList.unified .lineItem:nth-child(3n+2),
.lineList.unified .lineItem:nth-child(3n){ margin-left:0; }
@media (max-width:700px){ .lineList .lineItem{ margin-left:0 !important; } }
.lineItem:first-child{ border-top:1px solid var(--hair); }
.lineItem .n{ font-family:'Libre Baskerville',serif; font-size:26px; color:var(--gold-light); }
.lineItem h3{ font-size:20px; margin:0 0 8px 0; }
.lineItem p{ margin:0; color:var(--ink); font-size:15px; max-width:60ch; }
.lineItem .tags{ margin-top:10px; }
.sector{ font-size:11px; letter-spacing:0.4px; color:#A9A392; margin-top:8px; }

.tag{
  display:inline-block; font-size:10.5px; letter-spacing:1px; text-transform:uppercase;
  font-weight:600; color:var(--gold); border:1px solid var(--hair); padding:3px 9px; margin-right:8px;
}

/* Dark panel (about teaser, quote) */
.panel-dark{ background:var(--ink); color:#EDE9E0; }
.panel-dark .eyebrow{ color:var(--gold-light); }
.quoteGrid{ display:grid; grid-template-columns:0.85fr 1.15fr; gap:56px; align-items:center; }
.quoteGrid img{ width:100%; border:1px solid rgba(176,141,63,0.35); filter:grayscale(10%); }
.quoteGrid blockquote{ font-family:'Libre Baskerville',serif; font-style:italic; font-size:22px; line-height:1.6; margin:0 0 20px 0; color:#F2EFE8; }
.quoteGrid .who{ font-size:14px; color:var(--gold-light); letter-spacing:0.5px; }
@media (max-width:860px){ .quoteGrid{ grid-template-columns:1fr; } }
@media (max-width:900px){ .bioGrid{ grid-template-columns:1fr !important; } }

/* Cards */
.cardGrid{ display:grid; grid-template-columns:repeat(3,1fr); gap:28px; }
@media (max-width:960px){ .cardGrid{ grid-template-columns:1fr 1fr; } }
@media (max-width:640px){ .cardGrid{ grid-template-columns:1fr; } }
.card{ border:1px solid var(--hair); padding:32px 26px; background:var(--cream2); }
.card .n{ font-family:'Libre Baskerville',serif; color:var(--gold); font-size:22px; }
.card h3{ font-size:17px; margin:10px 0 10px 0; }
.card p{ font-size:14px; color:var(--grey); margin:0; }

/* Footer */
footer.site{ background:var(--ink); color:#9C9689; padding:56px 0 28px 0; font-size:13px; }
footer.site .cols{ display:grid; grid-template-columns:2fr 1fr 1fr; gap:40px; margin-bottom:40px; }
footer.site h4{ color:#EDE9E0; font-size:12px; letter-spacing:2px; text-transform:uppercase; margin:0 0 16px 0; font-weight:600; }
footer.site a{ display:block; padding:6px 0; color:#9C9689; }
footer.site a:hover{ color:var(--gold-light); }
footer.site .bottom{ border-top:1px solid rgba(176,141,63,0.2); padding-top:24px; display:flex; justify-content:space-between; flex-wrap:wrap; gap:12px; }
@media (max-width:760px){ footer.site .cols{ grid-template-columns:1fr; } }

/* Metodología: los tres criterios escalonados izquierda / centro / derecha */
.stagger3 .lineItem:nth-child(1){ margin-right:auto; }
.stagger3 .lineItem:nth-child(2){ margin-left:8%; margin-right:8%; }
.stagger3 .lineItem:nth-child(3){ margin-left:16%; }
@media (max-width:760px){ .stagger3 .lineItem{ margin:0 !important; } }

.justify{ text-align:justify; }

/* marca de agua discreta: código interno, apenas perceptible */
.wm{
  position:absolute; font-size:10px; letter-spacing:2px; color:rgba(176,141,63,0.16);
  pointer-events:none; user-select:none; font-family:'Inter',sans-serif;
}

/* Legal pages */
.legal h1{ font-size:30px; margin-bottom:6px; }
.legal .updated{ color:var(--grey); font-size:13px; margin-bottom:40px; font-style:italic; }
.legal h2{ font-size:19px; margin:40px 0 12px 0; }
.legal p, .legal li{ font-size:15.5px; line-height:1.75; color:var(--text); text-align:justify; }
.legal ul{ padding-left:20px; }

/* Contact */
.contactCard{
  border:1px solid var(--hair); padding:56px; text-align:center; background:var(--cream2);
}
.contactCard .mail{ font-family:'Libre Baskerville',serif; font-size:28px; margin:18px 0 24px 0; }
.contactCard .mail a{ border-bottom:1px solid var(--gold); }

.pill-note{
  display:inline-block; font-size:13px; color:var(--grey); border:1px dashed var(--hair);
  padding:10px 18px; margin-top:22px;
}