/* =================================================
   VARIABLES
   ================================================= */
:root{
  --ink:#001524;
  --accent:#FF7B00;
  --teal:#15616D;
  --paper:#ffffff;
  --paper-text:#FFF8ED;
}

/* =================================================
   RESET
   ================================================= */
*{
  box-sizing:border-box;
}

html,body{
  margin:0;
  padding:0;
}

body{
  background:var(--paper);
  color:var(--ink);
  font-family:"Literata", serif;
  font-size:18px;
  line-height:1.85;
}

/* =================================================
   LAYOUT GENERAL
   ================================================= */
.page{
  max-width:1200px;
  margin:0 auto;
  padding:3rem 1.5rem 5rem;
}

/* =================================================
   HERO
   ================================================= */
.hero{
  position:relative;
  padding:4rem 0 6rem;
  overflow:hidden;
}

/* ---------------- MANCHA TIPOGRÁFICA ---------------- */
.bigtype{
  position:absolute;
  inset:0;
  pointer-events:none;
  z-index:0;
}

.bigtype span{
  position:absolute;
  font-family:"Literata", serif;
  font-weight:700;
  line-height:0.95;
  color:var(--ink);
  opacity:0.05;
}

/* Desktop */
.bigtype .m{ font-size:24rem; left:2%;  top:-4%; }
.bigtype .o{ font-size:21rem; left:46%; top:10%; }
.bigtype .r{ font-size:22rem; left:18%; top:42%; }
.bigtype .i{ font-size:17rem; left:74%; top:4%; }
.bigtype .a{ font-size:25rem; left:0%;  top:62%; }

/* ---------------- CONTENIDO HERO ---------------- */
.hero-content{
  position:relative;
  z-index:2;
  max-width:720px;
}

.logo{
  max-width:260px;
  display:block;
  margin-bottom:1.2rem;
}

.claim{
  font-family:"Lexend", sans-serif;
  font-size:0.8rem;
  letter-spacing:0.14em;
  text-transform:uppercase;
  color:var(--teal);
  margin-bottom:3rem;
}

/* =================================================
   DEFINICIÓN / DICCIONARIO
   ================================================= */
.manifesto{
  max-width:900px;
  margin-top:2rem;
}

.rule-top{
  width:56px;
  height:4px;
  background:var(--ink);
  margin-bottom:1.2rem;
}

.entry-title{
  font-size:3rem;
  margin:0 0 1.5rem 0;
}

.entry-ety{
  font-family:"Lexend", sans-serif;
  font-size:1rem;
  color:rgba(0,21,36,.8);
  margin-bottom:2.5rem;
}

.entry-senses{
  font-family:"Lexend", sans-serif;
  font-size:1.15rem;
  padding-left:1.4rem;
}

.entry-senses li{
  margin:1.4rem 0;
}

.sc{
  font-variant-caps:all-small-caps;
  letter-spacing:.04em;
}

/* =================================================
   BLOQUES EDITORIALES (LO QUE PEDÍAS)
   ================================================= */
.criteria{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:2.5rem;
  margin:5rem auto 0;
  max-width:1100px;
}

.criteria-box{
  background:var(--ink);
  padding:2.5rem 2.3rem;
  font-family:"Lexend", sans-serif;
  color:var(--paper-text);
  line-height:1.75;
}

.criteria-box h3{
  margin:0 0 1.6rem 0;
  font-size:.85rem;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--accent);
}

.criteria-box p{
  margin:.6rem 0;
  font-size:.95rem;
}

.criteria-box strong{
  font-weight:500;
  color:var(--paper-text);
}

/* =================================================
   CONTACTO
   ================================================= */
.contact{
  margin-top:5rem;
  padding-top:2rem;
  border-top:1px solid rgba(0,21,36,.15);
}

.contact-kicker{
  font-family:"Lexend", sans-serif;
  font-size:.75rem;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--teal);
  margin-bottom:.6rem;
}

.contact a{
  font-family:"Lexend", sans-serif;
  color:var(--ink);
  text-decoration:none;
  border-bottom:1px solid transparent;
}

.contact a:hover{
  border-color:var(--accent);
}

/* =================================================
   RESPONSIVE
   ================================================= */
@media(max-width:900px){

  .criteria{
    grid-template-columns:1fr;
    gap:1.8rem;
  }

  .bigtype .m{ font-size:18rem; }
  .bigtype .o{ font-size:16rem; }
  .bigtype .r{ font-size:16rem; }
  .bigtype .i{ font-size:12rem; }
  .bigtype .a{ font-size:18rem; }
}

@media(max-width:520px){

  body{ font-size:17px; }

  .hero{
    padding:3rem 0 4rem;
  }

  /* En móvil: SOLO M, lateral */
  .bigtype span{ display:none; }
  .bigtype .m{
    display:block;
    font-size:14rem;
    left:62%;
    top:30%;
    opacity:0.04;
  }

  .entry-title{
    font-size:2.4rem;
  }

  .criteria-box{
    padding:2rem 1.8rem;
  }
}
/* =========================
   CONTACTO
   ========================= */
.contact-section{
  margin-top:7rem;
  padding:4.5rem 0;
  border-top:1px solid rgba(0,21,36,.12);
}

.contact-wrap{
  max-width:1100px;
  margin:0 auto;
  padding:0 1.5rem;
}

.contact-title{
  margin:0 0 1.25rem 0;
  font-family:"Literata", serif;
  font-size:2.2rem;
  letter-spacing:-0.01em;
}

.contact-lead{
  margin:0 0 2.2rem 0;
  font-family:"Literata", serif;
  font-size:1.15rem;
  line-height:1.8;
}

.contact-mail{
  color:var(--teal);
  text-decoration:none;
  border-bottom:1px solid rgba(21,97,109,.35);
}
.contact-mail:hover{
  color:var(--ink);
  border-bottom-color:var(--accent);
}

.contact-grid{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap:2rem;
}

.contact-card{
  padding:2.2rem 2rem;
  border:1px solid rgba(0,21,36,.14);
}

.contact-card h3{
  margin:0 0 1rem 0;
  font-family:"Lexend", sans-serif;
  font-size:.85rem;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--ink);
}

.contact-card p{
  margin:.6rem 0;
  font-family:"Literata", serif;
}

.contact-note{
  font-family:"Lexend", sans-serif;
  color:rgba(0,21,36,.78);
  font-size:.95rem;
}

/* =========================
   FOOTER
   ========================= */
.site-footer{
  background:#001524;
  color:#FFF8ED;
  margin-top:6rem;
}

.footer-wrap{
  max-width:1100px;
  margin:0 auto;
  padding:2.8rem 1.5rem 2rem;
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:2rem;
}

.footer-brand{
  max-width:520px;
}

.footer-logo{
  display:block;
  width:160px;
  height:auto;
  margin-bottom:1rem;
}

.footer-elvish{
  margin:0;
  font-family:"Literata", serif;
  font-style:italic;
  color:#FFF8ED;
  opacity:.92;
}

.footer-nav{
  display:flex;
  gap:1.6rem;
  flex-wrap:wrap;
  align-items:flex-start;
  justify-content:flex-end;
  font-family:"Lexend", sans-serif;
  font-size:.85rem;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.footer-nav a{
  color:#FFF8ED;
  text-decoration:none;
  border-bottom:1px solid transparent;
  padding-bottom:.15rem;
}
.footer-nav a:hover{
  border-bottom-color:#FF7B00;
  color:#FF7B00;
}

.footer-bottom{
  border-top:1px solid rgba(255,248,237,.14);
  padding:1rem 1.5rem 1.2rem;
  font-family:"Lexend", sans-serif;
  font-size:.85rem;
  opacity:.9;
}

@media (max-width:900px){
  .contact-grid{ grid-template-columns:1fr; }
  .footer-wrap{ flex-direction:column; align-items:flex-start; }
  .footer-nav{ justify-content:flex-start; }
}
.site-footer{
  width:100%;
  max-width:none;
}