/* --------------------
   FONTS
-------------------- */
@font-face {
  font-family: 'Basic Commercial';
  src: url('../assets/fonts/basic-commercial/BasicCommercial-Bold.woff2') format('woff2');
  font-weight: 700;
  font-style: normal;
}
@font-face {
  font-family: 'Basic Commercial';
  src: url('../assets/fonts/basic-commercial/BasicCommercial-Roman.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
}
@font-face {
  font-family: 'Bradford';
  src: url('../assets/fonts/bradford/BradfordLL-Regular.otf') format('opentype');
  font-weight: 400;
  font-style: normal;
}
@font-face {
  font-family: 'Bradford';
  src: url('../assets/fonts/bradford/BradfordLL-Italic.otf') format('opentype');
  font-weight: 400;
  font-style: italic;
}
@font-face {
  font-family: 'Bradford';
  src: url('../assets/fonts/bradford/BradfordLL-Light.otf') format('opentype');
  font-weight: 300;
  font-style: normal;
}
@font-face {
  font-family: 'Bradford';
  src: url('../assets/fonts/bradford/BradfordLL-LightItalic.otf') format('opentype');
  font-weight: 300;
  font-style: italic;
}

/* --------------------
   VARIABLES
-------------------- */
:root {
  --bg-main: #F5F5EB;
  --bg-footer: #1E384E;
  --text-main: #1E384E;
  --font-sans: 'Basic Commercial', sans-serif;
  --font-serif: 'Bradford', serif;
}

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

html { scrollbar-gutter: stable; }

body {
  background-color: var(--bg-main);
  color: var(--text-main);
  font-family: var(--font-sans);
}

/* --------------------
   LOGO ANIMADO (Home)
-------------------- */
.logo-scroll {
  position: fixed; top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  width: 450px; z-index: 2000;
  pointer-events: none;
  display: flex; justify-content: center; align-items: center;
}
.logo-scroll-inner {
  width: 100%; position: relative;
  transition: transform 1.2s cubic-bezier(0.16, 1, 0.3, 1);
  will-change: transform;
  transform: translate(0, -60px) scale(1);
}
body.is-scrolled .logo-scroll-inner {
  transform: translateY(calc(-50vh + 22px)) scale(0.48);
}
.logo-scroll img {
  width: 100%; height: auto; display: block;
  image-rendering: -webkit-optimize-contrast;
  transition: opacity 0.6s ease;
}
.logo-blue { position: absolute; top: 0; left: 0; opacity: 0; }
body.is-scrolled .logo-offwhite { opacity: 0; }
body.is-scrolled .logo-blue     { opacity: 1; }

/* --------------------
   NAV — HOVER UNDERLINE
-------------------- */
.nav a::after {
  content: ""; position: absolute;
  left: 0; bottom: -2px; width: 100%; height: 1px;
  background-color: currentColor;
  transform: scaleX(0); transform-origin: left;
  transition: transform 0.35s ease;
}
.nav a:hover::after { transform: scaleX(1); }
/* --------------------
   ABOUT PAGE
-------------------- */
.about-page .logo-scroll { display: none !important; }
.about-container {
  position: relative; z-index: 5;
  background-color: var(--bg-main); padding-top: 100px;
}
.about-page .about-description {
  grid-column: 2 / 6; font-family: var(--font-sans);
  font-size: 14px; line-height: 1.5;
  color: var(--text-main); text-align: left; letter-spacing: 0.02em;
}
.about-page .about-description i {
  font-family: var(--font-serif); font-style: italic;
  font-size: 14px; letter-spacing: 0.01em;
}
.about-page .about-description p { margin-bottom: 2em; line-height: 1.5; }
.about-visual { grid-column: 8 / 12; }
.about-visual img { width: 100%; height: auto; display: block; }
.about-page .nav-logo-link {
  position: absolute; left: 50%; top: 50%;
  transform: translate(-50%, -50%);
  text-decoration: none !important; border: none !important;
  line-height: 0; display: flex; align-items: center;
}
.about-page .nav-logo-link::after { display: none !important; }
.about-page .nav-logo-link img {
  height: 11.2px !important; width: auto;
  opacity: 1 !important; visibility: visible !important; display: block;
}

/* --------------------
   MOBILE  ≤ 768px
   Solo afecta navbar — no toca about, contact ni press
-------------------- */
@media (max-width: 768px) {

  /* Ocultar links desktop del nav */
  .nav-left,
  
  /* Mostrar logo en nav, alineado izquierda */
  .nav { padding: 0 16px !important; }
      body.is-scrolled   body.menu-open 
  /* Ocultar logo animado */
  .logo-scroll { display: none !important; }

/* press padding mobile */
  .press-main { padding: 60px 16px 80px !important; }

  /* Neutralize old press-page blue background */
  .press-page-legacy { display: none; }
}