:root{
  --wine-900:#2e0a0a;
  --wine-800:#501313;
  --wine-700:#671818;
  --wine-600:#791F1F;
  --wine-500:#9c3030;
  --gold-500:#FAC775;
  --gold-600:#e8ad4d;
  --gold-700:#c98f30;
  --cream:#FBF6EC;
  --cream-deep:#F3E9D5;
  --ink:#1d1714;
  --ink-soft:#4a3f3a;
  --paper:#FFFDF9;
  --border-soft:rgba(80,19,19,0.14);
  --glass-light:rgba(255,253,249,0.68);
  --glass-light-strong:rgba(255,253,249,0.82);
  --glass-dark:rgba(251,246,236,0.075);
  --glass-dark-strong:rgba(251,246,236,0.11);
  --glass-border:rgba(255,255,255,0.34);
  --glass-border-dark:rgba(250,199,117,0.22);
  --glass-shadow:0 24px 60px rgba(46,10,10,0.12), 0 8px 24px rgba(46,10,10,0.08);
  --glass-shadow-hover:0 30px 76px rgba(46,10,10,0.18), 0 12px 32px rgba(46,10,10,0.12);
  --max-w:1180px;
  --font-display:'Lora', serif;
  --font-body:'Inter', sans-serif;
  --font-mono:'JetBrains Mono', monospace;
}

*{margin:0;padding:0;box-sizing:border-box;}

html{scroll-behavior:smooth;}

body{
  font-family:var(--font-body);
  color:var(--ink);
  background:var(--paper);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}

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

a{color:inherit;text-decoration:none;}

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

h1,h2,h3,h4{
  font-family:var(--font-display);
  font-weight:600;
  line-height:1.15;
  letter-spacing:-0.01em;
}

.eyebrow{
  font-family:var(--font-mono);
  font-size:12.5px;
  letter-spacing:0.12em;
  text-transform:uppercase;
  color:var(--wine-600);
  display:flex;
  align-items:center;
  gap:10px;
  margin-bottom:18px;
}
.eyebrow::before{
  content:'';
  width:22px;
  height:1px;
  background:var(--gold-600);
  display:inline-block;
}

/* ===== HEADER ===== */
header{
  position:fixed;
  top:0;left:0;right:0;
  z-index:100;
  background:rgba(255,253,249,0.92);
  backdrop-filter:blur(8px);
  border-bottom:1px solid var(--border-soft);
}
.nav{
  display:flex;
  align-items:center;
  justify-content:space-between;
  height:72px;
}
.nav-brand{
  display:flex;
  align-items:center;
  gap:12px;
  font-family:var(--font-display);
  font-weight:600;
  font-size:18px;
  color:var(--wine-800);
}
.nav-brand img{height:36px;width:36px;}
.nav-links{
  display:flex;
  gap:28px;
  font-size:14.5px;
  font-weight:500;
}
.nav-links a{
  color:var(--ink-soft);
  position:relative;
  padding:6px 0;
  transition:color 0.2s;
}
.nav-links a:hover{color:var(--wine-700);}
.nav-dropdown{
  position:relative;
}
.nav-dropdown-toggle{
  background:none;
  border:none;
  cursor:pointer;
  font-family:inherit;
  font-size:14.5px;
  font-weight:500;
  color:var(--ink-soft);
  padding:6px 0;
  transition:color 0.2s;
}
.nav-dropdown-toggle:hover,
.nav-dropdown:focus-within .nav-dropdown-toggle{
  color:var(--wine-700);
}
.nav-dropdown-menu{
  position:absolute;
  top:100%;
  left:50%;
  transform:translateX(-50%) translateY(6px);
  min-width:180px;
  padding:8px 0;
  background:rgba(255,253,249,0.98);
  border:1px solid var(--border-soft);
  border-radius:8px;
  box-shadow:0 12px 32px rgba(46,10,10,0.12), 0 4px 12px rgba(46,10,10,0.08);
  opacity:0;
  visibility:hidden;
  transition:opacity 0.2s, visibility 0.2s, transform 0.2s;
  z-index:110;
}
.nav-dropdown:hover .nav-dropdown-menu,
.nav-dropdown:focus-within .nav-dropdown-menu{
  opacity:1;
  visibility:visible;
  transform:translateX(-50%) translateY(0);
}
.nav-dropdown-menu a{
  display:block;
  padding:10px 20px;
  font-size:14.5px;
  font-weight:500;
  color:var(--ink-soft);
  transition:color 0.2s, background 0.2s;
}
.nav-dropdown-menu a:hover{
  color:var(--wine-700);
  background:rgba(121,31,31,0.04);
}
.nav-cta{
  font-size:14px;
  font-weight:600;
  padding:10px 22px;
  border-radius:3px;
  background:var(--wine-700);
  color:var(--cream);
  transition:background 0.2s;
}
.nav-cta:hover{background:var(--wine-800);}

@media (max-width:880px){
  .nav-links{display:none;}
}

/* ===== HERO ===== */
.hero{
  position:relative;
  min-height:100vh;
  display:flex;
  align-items:center;
  background:var(--wine-900);
  overflow:hidden;
  padding-top:72px;
}
.hero::before{
  content:'';
  position:absolute;
  inset:0;
  background:
    radial-gradient(ellipse 900px 600px at 78% 30%, rgba(250,199,117,0.10), transparent 60%),
    linear-gradient(180deg, var(--wine-900) 0%, #200707 100%);
  z-index:0;
}
.hero-grid{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:1.05fr 0.95fr;
  align-items:center;
  gap:60px;
  width:100%;
}
.hero-copy .eyebrow{color:var(--gold-500);}
.hero-copy .eyebrow::before{background:var(--gold-500);}
.hero-copy h1{
  font-size:clamp(36px,5vw,58px);
  color:var(--cream);
  margin-bottom:22px;
}
.hero-copy h1 em{
  font-style:italic;
  color:var(--gold-500);
}
.hero-copy p.lede{
  font-size:18px;
  color:rgba(251,246,236,0.78);
  max-width:520px;
  margin-bottom:36px;
}
.hero-ctas{
  display:flex;
  gap:16px;
  flex-wrap:wrap;
  margin-bottom:48px;
}
.btn{
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-size:14.5px;
  font-weight:600;
  padding:14px 26px;
  border-radius:3px;
  transition:all 0.2s;
  border:1px solid transparent;
}
.btn-gold{
  background:var(--gold-500);
  color:var(--wine-900);
}
.btn-gold:hover{background:var(--gold-600);}
.btn-ghost{
  border-color:rgba(251,246,236,0.3);
  color:var(--cream);
}
.btn-ghost:hover{border-color:var(--gold-500);color:var(--gold-500);}

.hero-stats{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:28px;
  max-width:520px;
  border-top:1px solid rgba(251,246,236,0.14);
  padding-top:28px;
}
.stat-num{
  font-family:var(--font-display);
  font-size:28px;
  font-weight:600;
  color:var(--gold-500);
  margin-bottom:4px;
}
.stat-label{
  font-size:12.5px;
  color:rgba(251,246,236,0.6);
  line-height:1.4;
}

.hero-photo{
  position:relative;
  display:flex;
  justify-content:center;
}
.hero-photo-frame{
  position:relative;
  width:100%;
  max-width:420px;
}
.hero-photo-frame img{
  width:100%;
  border-radius:4px;
  filter:grayscale(1) contrast(1.05);
}
.hero-photo-frame::after{
  content:'';
  position:absolute;
  top:18px;right:-18px;bottom:-18px;left:18px;
  border:1px solid var(--gold-500);
  border-radius:4px;
  z-index:-1;
}
.hero-photo-tag{
  position:absolute;
  bottom:-22px;
  left:-22px;
  background:var(--gold-500);
  color:var(--wine-900);
  font-family:var(--font-mono);
  font-size:12px;
  padding:10px 16px;
  border-radius:3px;
  font-weight:500;
  box-shadow:0 8px 24px rgba(0,0,0,0.3);
}

@media (max-width:900px){
  .hero-grid{grid-template-columns:1fr;gap:48px;}
  .hero-photo{order:-1;}
  .hero-photo-frame{max-width:280px;margin:0 auto;}
  .hero-stats{grid-template-columns:1fr 1fr 1fr;max-width:100%;}
}

/* ===== SECTION GENERIC ===== */
section{
  padding:110px 0;
}
.section-head{
  max-width:680px;
  margin-bottom:64px;
}
.section-head h2{
  font-size:clamp(28px,3.4vw,40px);
  color:var(--wine-800);
}

/* ===== QUIEN SOY ===== */
.quien-soy{
  background:var(--cream);
}
.qs-grid{
  display:grid;
  grid-template-columns:0.9fr 1.1fr;
  gap:64px;
  align-items:start;
}
.qs-text p{
  font-size:17px;
  color:var(--ink-soft);
  margin-bottom:20px;
}
.qs-text p:first-of-type{
  font-size:19px;
  color:var(--ink);
}
.qs-quote{
  margin-top:36px;
  padding:28px 32px;
  background:linear-gradient(145deg, var(--glass-light-strong), rgba(243,233,213,0.58));
  border:1px solid var(--glass-border);
  border-left:3px solid var(--gold-600);
  border-radius:12px;
  box-shadow:var(--glass-shadow);
  backdrop-filter:blur(18px) saturate(1.18);
  -webkit-backdrop-filter:blur(18px) saturate(1.18);
  font-family:var(--font-display);
  font-style:italic;
  font-size:19px;
  color:var(--wine-800);
  line-height:1.5;
}
.qs-quote span{
  display:block;
  margin-top:14px;
  font-family:var(--font-body);
  font-style:normal;
  font-size:13px;
  color:var(--ink-soft);
  font-weight:500;
}

.timeline{
  border-left:1px solid var(--border-soft);
  padding-left:32px;
  display:flex;
  flex-direction:column;
  gap:28px;
}
.tl-item{position:relative;}
.tl-item::before{
  content:'';
  position:absolute;
  left:-37px;top:4px;
  width:9px;height:9px;
  border-radius:50%;
  background:var(--gold-600);
  border:2px solid var(--cream);
  outline:1px solid var(--wine-600);
}
.tl-year{
  font-family:var(--font-mono);
  font-size:12px;
  color:var(--wine-600);
  font-weight:500;
  margin-bottom:4px;
  display:block;
}
.tl-title{
  font-family:var(--font-display);
  font-size:17px;
  font-weight:600;
  color:var(--ink);
  margin-bottom:2px;
}
.tl-sub{
  font-size:13.5px;
  color:var(--ink-soft);
}

@media (max-width:880px){
  .qs-grid{grid-template-columns:1fr;gap:48px;}
}

/* ===== PERFIL DUAL ===== */
.dual{
  background:var(--paper);
}
.dual-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:0;
  border:1px solid var(--glass-border);
  border-radius:16px;
  overflow:hidden;
  box-shadow:var(--glass-shadow);
  backdrop-filter:blur(18px) saturate(1.12);
  -webkit-backdrop-filter:blur(18px) saturate(1.12);
}
.dual-col{
  padding:48px 44px;
  position:relative;
}
.dual-col.educador{
  background:linear-gradient(145deg, rgba(80,19,19,0.94), rgba(46,10,10,0.9));
  color:var(--cream);
}
.dual-col.dev{
  background:linear-gradient(145deg, rgba(29,23,20,0.94), rgba(80,19,19,0.74));
  color:var(--cream);
}
.dual-tag{
  font-family:var(--font-mono);
  font-size:12px;
  letter-spacing:0.1em;
  text-transform:uppercase;
  margin-bottom:18px;
  display:inline-block;
  padding:5px 12px;
  border-radius:2px;
}
.educador .dual-tag{background:rgba(250,199,117,0.16);color:var(--gold-500);}
.dev .dual-tag{background:rgba(250,199,117,0.14);color:var(--gold-500);}
.dual-col h3{
  font-size:25px;
  margin-bottom:18px;
  color:var(--cream);
}
.dual-list{
  list-style:none;
  display:flex;
  flex-direction:column;
  gap:16px;
  margin-top:24px;
}
.dual-list li{
  font-size:14.5px;
  color:rgba(251,246,236,0.82);
  padding-left:20px;
  position:relative;
  line-height:1.55;
}
.dual-list li::before{
  content:'';
  position:absolute;
  left:0;top:8px;
  width:6px;height:1px;
  background:var(--gold-500);
}
.dual-list strong{
  color:var(--cream);
  font-weight:600;
}
.dual-stack{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:28px;
}
.tag-pill{
  font-family:var(--font-mono);
  font-size:12px;
  padding:6px 12px;
  border:1px solid rgba(250,199,117,0.3);
  border-radius:3px;
  color:var(--gold-500);
}

@media (max-width:880px){
  .dual-grid{grid-template-columns:1fr;}
}

/* ===== IA APLICADA / CAPACITACIÓN ===== */
.ia-aplicada{
  background:var(--wine-900);
  color:var(--cream);
}
.ia-aplicada .section-head h2{color:var(--cream);}
.ia-aplicada .eyebrow{color:var(--gold-500);}
.ia-aplicada .eyebrow::before{background:var(--gold-500);}
.ia-grid{
  display:grid;
  grid-template-columns:0.85fr 1.15fr;
  gap:48px;
  align-items:start;
  margin-bottom:48px;
}
.ia-stat-block{
  display:flex;
  flex-direction:column;
  gap:32px;
}
.ia-stat-big{
  padding:36px;
  background:linear-gradient(145deg, var(--glass-dark-strong), rgba(250,199,117,0.035));
  border:1px solid var(--glass-border-dark);
  border-radius:16px;
  box-shadow:0 22px 54px rgba(0,0,0,0.22);
  backdrop-filter:blur(18px) saturate(1.16);
  -webkit-backdrop-filter:blur(18px) saturate(1.16);
}
.ia-stat-num{
  font-family:var(--font-display);
  font-size:clamp(48px,6vw,72px);
  font-weight:600;
  color:var(--gold-500);
  display:block;
  line-height:1;
  margin-bottom:16px;
}
.ia-stat-text{
  font-size:15px;
  color:rgba(251,246,236,0.72);
  line-height:1.6;
}
.ia-enfoques{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}
.ia-enfoque-pill{
  font-family:var(--font-mono);
  font-size:12px;
  padding:8px 14px;
  border:1px solid rgba(250,199,117,0.28);
  border-radius:3px;
  color:var(--gold-500);
}
.ia-servicios{
  display:flex;
  flex-direction:column;
  gap:20px;
}
.ia-servicio{
  padding:28px 32px;
  background:linear-gradient(145deg, var(--glass-dark), rgba(250,199,117,0.032));
  border:1px solid rgba(251,246,236,0.16);
  border-radius:16px;
  box-shadow:0 18px 44px rgba(0,0,0,0.18);
  backdrop-filter:blur(18px) saturate(1.14);
  -webkit-backdrop-filter:blur(18px) saturate(1.14);
  transition:border-color 0.2s, transform 0.2s, background 0.2s;
}
.ia-servicio:hover{
  border-color:rgba(250,199,117,0.35);
  background:linear-gradient(145deg, var(--glass-dark-strong), rgba(250,199,117,0.055));
  transform:translateY(-2px);
}
.ia-servicio-marca{
  font-family:var(--font-mono);
  font-size:12px;
  color:var(--gold-600);
  display:block;
  margin-bottom:10px;
}
.ia-servicio h3{
  font-size:19px;
  color:var(--cream);
  margin-bottom:8px;
}
.ia-servicio p{
  font-size:14.5px;
  color:rgba(251,246,236,0.68);
  line-height:1.55;
}
.ia-cta-row{
  display:flex;
  gap:16px;
  flex-wrap:wrap;
  padding-top:8px;
  border-top:1px solid rgba(251,246,236,0.12);
}

@media (max-width:880px){
  .ia-grid{grid-template-columns:1fr;gap:36px;}
}

/* ===== PROYECTOS ===== */
.proyectos{
  background:var(--cream);
}
.proy-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:24px;
}
.proy-card{
  background:linear-gradient(145deg, var(--glass-light-strong), rgba(243,233,213,0.52));
  border:1px solid var(--glass-border);
  border-radius:16px;
  padding:36px;
  box-shadow:var(--glass-shadow);
  backdrop-filter:blur(20px) saturate(1.18);
  -webkit-backdrop-filter:blur(20px) saturate(1.18);
  transition:border-color 0.2s, transform 0.2s, box-shadow 0.2s, background 0.2s;
}
.proy-card:hover{
  border-color:var(--wine-600);
  transform:translateY(-3px);
  background:linear-gradient(145deg, rgba(255,253,249,0.92), rgba(243,233,213,0.66));
  box-shadow:var(--glass-shadow-hover);
}
.proy-num{
  font-family:var(--font-mono);
  font-size:12px;
  color:var(--gold-700);
  margin-bottom:16px;
  display:block;
}
.proy-card h3{
  font-size:21px;
  color:var(--wine-800);
  margin-bottom:12px;
}
.proy-card p{
  font-size:14.5px;
  color:var(--ink-soft);
  margin-bottom:18px;
}
.proy-meta{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-bottom:18px;
}
.proy-meta span{
  font-family:var(--font-mono);
  font-size:11.5px;
  padding:4px 10px;
  background:var(--cream-deep);
  border-radius:2px;
  color:var(--wine-700);
}
.proy-link{
  font-size:13.5px;
  font-weight:600;
  color:var(--wine-700);
  display:inline-flex;
  align-items:center;
  gap:6px;
  border-bottom:1px solid var(--gold-600);
  padding-bottom:2px;
}

@media (max-width:880px){
  .proy-grid{grid-template-columns:1fr;}
}

/* ===== INVESTIGACION / CANAL ===== */
.investigacion{
  background:var(--wine-900);
  color:var(--cream);
}
.investigacion .section-head h2{color:var(--cream);}
.inv-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:24px;
}
.inv-card{
  background:linear-gradient(145deg, var(--glass-dark), rgba(250,199,117,0.035));
  border:1px solid rgba(251,246,236,0.16);
  border-radius:16px;
  padding:32px;
  box-shadow:0 20px 50px rgba(0,0,0,0.2);
  backdrop-filter:blur(18px) saturate(1.14);
  -webkit-backdrop-filter:blur(18px) saturate(1.14);
  transition:border-color 0.2s, transform 0.2s, background 0.2s;
}
.inv-card:hover{
  border-color:rgba(250,199,117,0.34);
  background:linear-gradient(145deg, var(--glass-dark-strong), rgba(250,199,117,0.055));
  transform:translateY(-2px);
}
.inv-icon{
  width:42px;height:42px;
  border-radius:50%;
  background:rgba(250,199,117,0.12);
  display:flex;align-items:center;justify-content:center;
  margin-bottom:20px;
  font-family:var(--font-display);
  font-size:18px;
  color:var(--gold-500);
}
.inv-card h3{
  font-size:19px;
  color:var(--cream);
  margin-bottom:10px;
}
.inv-card p{
  font-size:14px;
  color:rgba(251,246,236,0.68);
  margin-bottom:16px;
}
.inv-link{
  font-size:13px;
  font-weight:600;
  color:var(--gold-500);
}

@media (max-width:880px){
  .inv-grid{grid-template-columns:1fr;}
}

/* ===== CONTACTO ===== */
.contacto{
  background:var(--cream);
  text-align:center;
}
.contacto .section-head{
  margin:0 auto 40px;
  text-align:center;
}
.contacto .eyebrow{justify-content:center;}
.contacto-grid{
  display:flex;
  justify-content:center;
  gap:18px;
  flex-wrap:wrap;
}
.contact-pill{
  display:flex;
  align-items:center;
  gap:10px;
  padding:14px 24px;
  background:var(--paper);
  border:1px solid var(--border-soft);
  border-radius:30px;
  font-size:14px;
  font-weight:500;
  color:var(--ink);
  transition:border-color 0.2s;
}
.contact-pill:hover{border-color:var(--wine-600);}

/* ===== FOOTER ===== */
footer{
  background:var(--ink);
  color:rgba(251,246,236,0.5);
  padding:36px 0;
  text-align:center;
  font-size:13px;
}
footer strong{color:rgba(251,246,236,0.8);}