/* ============================================================
   IRVING RODRÍGUEZ — Editorial art system
   Minimalismo editorial · luz, vacío, materia
   ============================================================ */

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

:root{
  /* Paper & ink */
  --paper:    #ffffff;
  --paper-2:  #faf8f5;
  --sand:     #f4efe8;
  --bone:     #e9e3d9;
  --ink:      #0c0b0a;
  --ink-2:    #1d1b18;
  --gray:     #6f6b62;
  --gray-soft:#928d83;
  --gray-2:   #ada89f;
  --line:     rgba(12,11,10,0.14);
  --line-2:   rgba(12,11,10,0.07);
  --rust:     #9a5a44;

  /* Type */
  --serif: 'Cormorant Garamond', 'Times New Roman', serif;
  --sans:  'Helvetica Neue', Helvetica, Arial, sans-serif;

  /* Tracking */
  --track-label: 0.34em;
  --track-wide:  0.22em;
  --track-mid:   0.12em;

  /* Motion */
  --ease: cubic-bezier(0.22, 0.61, 0.36, 1);
  --slow: 1.4s;
}

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

html{ -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; }

body{
  font-family:var(--sans);
  background:var(--paper);
  color:var(--ink);
  line-height:1.5;
  overflow-x:hidden;
}

::selection{ background:var(--ink); color:var(--paper); }

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

/* ---- Type primitives ---- */
.label{
  font-family:var(--sans);
  font-size:11.5px;
  font-weight:400;
  letter-spacing:var(--track-label);
  text-transform:uppercase;
  color:var(--gray);
}
.label--ink{ color:var(--ink); }

.serif{ font-family:var(--serif); font-weight:300; }

.display{
  font-family:var(--serif);
  font-weight:300;
  line-height:0.96;
  letter-spacing:-0.01em;
}

/* ---- Site chrome ---- */
.nav{
  position:fixed; inset:0 0 auto 0; z-index:60;
  display:flex; align-items:center; justify-content:space-between;
  padding:24px clamp(22px,5vw,64px);
  color:var(--ink); border-bottom:1px solid transparent;
  transition:background .55s var(--ease), color .4s var(--ease), border-color .5s var(--ease), padding .45s var(--ease);
}
.nav a{ color:inherit; }
.nav__brand{
  font-size:12px; letter-spacing:var(--track-wide); text-transform:uppercase;
}
.nav__links{ display:flex; gap:clamp(20px,3vw,48px); align-items:center; }
.nav__links a{
  font-size:11.5px; letter-spacing:var(--track-wide); text-transform:uppercase;
  position:relative; opacity:0.92; transition:opacity .4s var(--ease);
}
.nav__links a:hover{ opacity:0.5; }
.nav__links a.is-active::after{
  content:''; position:absolute; left:0; right:0; bottom:-6px; height:1px; background:currentColor;
}
/* white text while sitting over a photo hero */
.nav--over{ color:#fff; text-shadow:0 1px 22px rgba(0,0,0,0.32); }
/* delicate translucent panel once the page is scrolled */
.nav.is-solid{
  background:rgba(250,248,245,0.74);
  -webkit-backdrop-filter:blur(18px) saturate(1.3);
  backdrop-filter:blur(18px) saturate(1.3);
  border-bottom-color:var(--line-2);
  color:var(--ink); text-shadow:none;
  padding-top:15px; padding-bottom:15px;
}

/* ---- mobile menu ---- */
.nav__toggle{ display:none; flex-direction:column; gap:5px; background:none; border:none; cursor:pointer; padding:6px 2px; }
.nav__toggle span{ width:26px; height:1.5px; background:currentColor; transition:transform .4s var(--ease), opacity .3s; }
.navmenu{ display:none; }
@media (max-width:680px){
  .nav__links{ display:none; }
  .nav__toggle{ display:inline-flex; }
  .navmenu{
    display:flex; position:fixed; inset:0; z-index:80; background:var(--paper);
    flex-direction:column; justify-content:center; gap:2px; padding:0 clamp(22px,8vw,56px);
    opacity:0; visibility:hidden; transition:opacity .5s var(--ease), visibility .5s;
  }
  .navmenu.open{ opacity:1; visibility:visible; }
  .navmenu a{ font-family:var(--serif); font-weight:300; font-size:clamp(40px,13vw,68px); line-height:1.22; color:var(--ink); display:flex; align-items:baseline; gap:14px; }
  .navmenu a .n{ font-family:var(--sans); font-size:12px; letter-spacing:var(--track-wide); color:var(--gray); }
  .navmenu__close{ position:absolute; top:26px; right:clamp(22px,5vw,56px); background:none; border:none; cursor:pointer; font-size:11px; letter-spacing:var(--track-wide); text-transform:uppercase; color:var(--ink); }
  .navmenu__foot{ position:absolute; bottom:34px; left:clamp(22px,8vw,56px); font-size:11px; letter-spacing:0.08em; color:var(--gray); line-height:1.8; }
}

/* ---- Reveal on scroll ---- */
[data-reveal]{
  opacity:0; transform:translateY(26px);
  transition:opacity 1.5s var(--ease), transform 1.5s var(--ease);
}
[data-reveal].is-in{ opacity:1; transform:none; }
html.force-show [data-reveal]{ opacity:1 !important; transform:none !important; transition:none !important; }

@media (prefers-reduced-motion: reduce){
  [data-reveal]{ opacity:1 !important; transform:none !important; }
}

/* ---- Footer ---- */
.footer{
  padding:clamp(80px,12vw,160px) clamp(22px,5vw,64px) 56px;
  border-top:1px solid var(--line);
}
.footer__grid{
  display:grid; grid-template-columns:1fr 1fr 1fr; gap:48px;
  align-items:end;
}
.footer__big{
  grid-column:1 / -1;
  font-family:var(--serif); font-weight:300;
  font-size:clamp(48px,11vw,168px); line-height:0.9; letter-spacing:-0.02em;
  margin-bottom:clamp(48px,8vw,110px);
}
.footer__col p{ font-size:13.5px; letter-spacing:0.03em; color:var(--gray); line-height:1.95; }
.footer__col a{ color:var(--ink); border-bottom:1px solid var(--line); padding-bottom:2px; }
.footer__col a:hover{ color:var(--gray); }
.footer__meta{
  grid-column:1 / -1; display:flex; justify-content:space-between;
  margin-top:clamp(56px,9vw,120px); padding-top:24px; border-top:1px solid var(--line-2);
}
.footer__meta span{ font-size:11px; letter-spacing:var(--track-wide); text-transform:uppercase; color:var(--gray); }

@media (max-width:720px){
  .footer__grid{ grid-template-columns:1fr; gap:32px; }
  .footer__meta{ flex-direction:column; gap:10px; }
}