/* ============================================================
   Elhadi Yahia – Rediseño v2
   Paleta: verde (nutrición/naturaleza) + azul original #056EB9
   Tipografía: Poppins (profesional) + Inter (cuerpo)
   ============================================================ */

:root {
  --blue:       #056EB9;
  --blue-d:     #044f87;
  --blue-l:     #e8f4fd;
  --green:      #1e8c4e;
  --green-d:    #145c35;
  --green-m:    #27ae60;
  --green-l:    #e8f5ee;
  --orange:     #E8750A;
  --orange-l:   #fff3e8;
  --yellow:     #D4A017;
  --yellow-l:   #fdf6e3;
  --purple:     #7B3FA0;
  --purple-l:   #f3ecfa;
  --teal:       #0E8C7C;
  --teal-l:     #e5f5f3;
  --red:        #C0392B;
  --red-l:      #fbecea;

  --dark:       #1c2b1e;
  --text:       #2d3a2e;
  --muted:      #607060;
  --border:     #d8e4d8;
  --bg:         #f5f9f5;
  --white:      #ffffff;
  --nav-h:      66px;

  --r-sm: 4px;
  --r-md: 8px;
  --r-lg: 12px;
  --r-xl: 18px;
  --shadow:     0 2px 10px rgba(0,0,0,.07);
  --shadow-md:  0 5px 20px rgba(0,0,0,.10);
  --shadow-lg:  0 14px 40px rgba(0,0,0,.13);
  --transition: .2s ease;

  --font-head: 'Poppins', 'Inter', system-ui, sans-serif;
  --font-body: 'Inter', system-ui, sans-serif;
}

/* ---------- Reset ---------- */
*,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }
html { scroll-behavior:smooth; }
body { font-family:var(--font-body); color:var(--text); background:var(--white); overflow-x:hidden; line-height:1.6; }
img { max-width:100%; display:block; }
a { text-decoration:none; color:inherit; }
ul { list-style:none; }

/* ---------- Utility ---------- */
.container { max-width:1180px; margin:0 auto; padding:0 24px; }
.section-pad { padding:80px 0; }
.text-center { text-align:center; }

.eyebrow {
  display:inline-flex; align-items:center; gap:7px;
  font-size:.7rem; font-weight:700; letter-spacing:.13em; text-transform:uppercase;
  color:var(--green); margin-bottom:10px;
}
.eyebrow::before { content:''; display:inline-block; width:22px; height:2px; background:currentColor; border-radius:1px; }

.section-title {
  font-family:var(--font-head);
  font-size:clamp(1.6rem,3vw,2.2rem);
  font-weight:800;
  color:var(--dark);
  line-height:1.25;
  margin-bottom:12px;
}
.section-sub { font-size:1rem; color:var(--muted); max-width:580px; line-height:1.65; }
.section-sub.c { margin:0 auto 48px; text-align:center; }

.btn {
  display:inline-flex; align-items:center; gap:8px;
  padding:12px 26px; border-radius:var(--r-md); font-weight:600; font-size:.88rem;
  cursor:pointer; border:2px solid transparent; transition:all var(--transition);
  letter-spacing:.01em;
}
.btn-blue   { background:var(--blue);  color:#fff; border-color:var(--blue); }
.btn-blue:hover { background:var(--blue-d); border-color:var(--blue-d); }
.btn-green  { background:var(--green); color:#fff; border-color:var(--green); }
.btn-green:hover { background:var(--green-d); border-color:var(--green-d); }
.btn-outline { background:transparent; color:#fff; border-color:rgba(255,255,255,.55); }
.btn-outline:hover { background:rgba(255,255,255,.12); border-color:#fff; }
.btn-orange { background:var(--orange); color:#fff; border-color:var(--orange); }
.btn-orange:hover { background:#c4630a; border-color:#c4630a; }

/* ============================================================
   NAVBAR
   ============================================================ */
#navbar {
  position:fixed; top:0; left:0; right:0; z-index:1000;
  height:var(--nav-h);
  background:var(--green-d);
  box-shadow:0 2px 14px rgba(14,60,30,.3);
}
.nav-inner { display:flex; align-items:center; justify-content:space-between; height:var(--nav-h); }
.nav-logo img { height:42px; }
.nav-menu { display:flex; align-items:center; gap:2px; }
.nav-menu > li { position:relative; }
.nav-menu > li > a {
  display:block; padding:8px 13px; color:rgba(255,255,255,.9);
  font-size:.875rem; font-weight:600; border-radius:6px;
  transition:background var(--transition);
}
.nav-menu > li > a:hover,
.nav-menu > li > a.active { background:rgba(255,255,255,.15); color:#fff; }
.nav-menu .has-sub > a::after { content:" ▾"; font-size:.6rem; }

.sub-menu {
  position:absolute; top:calc(100% + 8px); left:0; min-width:200px;
  background:#fff; border-radius:var(--r-md); box-shadow:var(--shadow-lg);
  padding:8px 0; opacity:0; visibility:hidden; transform:translateY(6px);
  transition:all var(--transition); border:1px solid var(--border); z-index:100;
}
.sub-menu li a { display:block; padding:9px 18px; color:var(--text); font-size:.85rem; font-weight:500; transition:background var(--transition),color var(--transition); }
.sub-menu li a:hover { background:var(--blue-l); color:var(--blue); }
.has-sub:hover .sub-menu { opacity:1; visibility:visible; transform:translateY(0); }

.nav-cta { background:var(--green) !important; border-radius:var(--r-md) !important; padding:8px 18px !important; color:#fff !important; }
.nav-cta:hover { background:var(--green-d) !important; }

.nav-hamburger { display:none; flex-direction:column; gap:5px; cursor:pointer; padding:8px; }
.nav-hamburger span { display:block; width:22px; height:2px; background:#fff; border-radius:2px; }

#mobile-nav { display:none; position:fixed; top:var(--nav-h); left:0; right:0; background:var(--green); padding:12px 0 20px; z-index:999; box-shadow:0 8px 24px rgba(0,0,0,.2); }
#mobile-nav.open { display:block; }
#mobile-nav a { display:block; padding:10px 24px; color:rgba(255,255,255,.85); font-size:.95rem; font-weight:600; border-bottom:1px solid rgba(255,255,255,.07); }
#mobile-nav a:hover { background:rgba(255,255,255,.08); color:#fff; }

/* ============================================================
   HERO
   ============================================================ */
#hero {
  padding-top:var(--nav-h);
  min-height:88vh;
  background:#0a2d12;
  position:relative; overflow:hidden;
  display:flex; align-items:center;
}
/* Imagen de fondo en un pseudo-elemento para poder animarla con transform (zoom lento). */
#hero::before {
  content:''; position:absolute; inset:0; z-index:0;
  background:url('/wp-content/uploads/2022/02/Fruits-Elhadi-Yahia-Slide.jpg') center/cover no-repeat;
  transform:scale(1);
  animation:heroZoom 24s ease-in-out infinite alternate;
  will-change:transform;
}
/* Degradado por encima de la imagen (fijo, no se anima). */
#hero::after {
  content:''; position:absolute; inset:0; z-index:0;
  background:linear-gradient(to right, rgba(10,45,18,.55) 0%, rgba(10,45,18,.30) 50%, rgba(10,45,18,.10) 100%);
}
@keyframes heroZoom {
  from { transform:scale(1); }
  to   { transform:scale(1.12); }
}
@media (prefers-reduced-motion: reduce) {
  #hero::before { animation:none; }
}
.hero-bubbles { display:none; }
.hero-inner {
  display:grid; grid-template-columns:1fr;
  gap:48px; align-items:center;
  padding:64px 0;
  position:relative; z-index:1;
  width:100%;
}
.hero-inner .hero-text { text-align:left; }
.hero-inner .hero-desc { max-width:620px; }

/* Left text */
.hero-welcome {
  display:inline-block;
  color:rgba(255,255,255,.95); font-size:.9rem; font-weight:700;
  letter-spacing:.14em; text-transform:uppercase; margin-bottom:14px;
}
.hero-welcome i { color:#a8ffcd; }
.hero-title {
  font-family:var(--font-head);
  font-size:clamp(1.9rem, 4.2vw, 3.1rem);
  font-weight:700;
  color:#fff;
  line-height:1.18;
  margin-bottom:18px;
}
.hero-title .hl { color:#a8ffcd; }
.hero-title .hl-b { color:#7dd3fc; }
.hero-title-script {
  font-family:'Caveat', cursive;
  font-weight:700;
  font-size:clamp(3.4rem, 9vw, 6.8rem);
  line-height:.95;
  margin-bottom:10px;
}
.hero-desc { font-size:1.15rem; color:rgba(255,255,255,.85); line-height:1.6; margin-bottom:30px; max-width:490px; }
.hero-actions { display:flex; gap:12px; flex-wrap:wrap; margin-bottom:36px; }

.hero-pills { display:flex; gap:8px; flex-wrap:wrap; }
.hero-pill {
  display:inline-flex; align-items:center; gap:6px;
  background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.2);
  padding:6px 13px; border-radius:var(--r-sm); color:rgba(255,255,255,.88); font-size:.78rem; font-weight:500;
}
.hero-pill i { font-size:.72rem; opacity:.8; }

/* Right: Image mosaic */
.hero-mosaic {
  display:grid;
  grid-template-columns:1fr 1fr;
  grid-template-rows:200px 200px;
  gap:12px;
}
.mosaic-img {
  border-radius:var(--r-lg); overflow:hidden;
  box-shadow:0 6px 28px rgba(0,0,0,.30);
}
.mosaic-img img { width:100%; height:100%; object-fit:cover; }
.mosaic-img.tall { grid-row:span 2; }
.mosaic-placeholder {
  width:100%; height:100%;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:8px; color:#fff;
}
.mosaic-placeholder i { font-size:2.2rem; opacity:.45; }
.mosaic-placeholder span { font-size:.7rem; opacity:.4; text-transform:uppercase; letter-spacing:.06em; }

/* ============================================================
   STRIP (numbers bar)
   ============================================================ */
#strip {
  background:var(--white);
  border-bottom:3px solid var(--blue-l);
  padding:0;
}
.strip-inner {
  display:grid; grid-template-columns:repeat(2,1fr);
}
.strip-item {
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  padding:28px 16px; text-align:center;
  border-right:1px solid var(--border);
  transition:background var(--transition);
}
.strip-item:last-child { border-right:none; }
.strip-item:hover { background:var(--green-l); }
.strip-num {
  font-family:var(--font-head);
  font-size:2.1rem; font-weight:700;
  color:var(--green); display:block; line-height:1;
}
.strip-lbl { font-size:.78rem; color:var(--muted); margin-top:4px; font-weight:500; }

/* ============================================================
   WELCOME (personal about strip)
   ============================================================ */
#welcome { background:var(--white); }
.welcome-grid { display:grid; grid-template-columns:1fr 1fr; gap:64px; align-items:center; }
.welcome-img-wrap { position:relative; }
.welcome-img {
  width:100%; aspect-ratio:4/5; object-fit:cover;
  border-radius:var(--r-xl); box-shadow:var(--shadow-lg);
}
.welcome-img-badge {
  position:absolute; bottom:28px; right:-18px;
  background:var(--green); color:#fff;
  padding:14px 20px; border-radius:var(--r-md);
  text-align:center; box-shadow:0 8px 24px rgba(30,140,78,.38);
  min-width:96px;
}
.welcome-img-badge strong { display:block; font-family:var(--font-head); font-size:1.8rem; font-weight:900; }
.welcome-img-badge span { font-size:.7rem; opacity:.88; letter-spacing:.04em; text-transform:uppercase; }
.welcome-text p { color:var(--muted); line-height:1.75; margin-bottom:16px; font-size:.975rem; }
.welcome-chips { display:flex; flex-wrap:wrap; gap:8px; margin:20px 0 28px; }
.wchip {
  display:inline-flex; align-items:center; gap:6px;
  padding:6px 14px; border-radius:50px;
  font-size:.78rem; font-weight:700;
  border:2px solid transparent;
}
.wchip-blue  { background:var(--blue-l);   color:var(--blue);   border-color:rgba(5,110,185,.15); }
.wchip-green { background:var(--green-l);  color:var(--green);  border-color:rgba(39,174,96,.15); }
.wchip-orange{ background:var(--orange-l); color:var(--orange); border-color:rgba(255,107,44,.15); }
.wchip-purple{ background:var(--purple-l); color:var(--purple); border-color:rgba(142,68,173,.15); }
.wchip i { font-size:.72rem; }

/* ============================================================
   WHAT WE WORK WITH (old "What We Study")
   ============================================================ */
#focus { background:var(--bg); }
.focus-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.focus-card {
  border-radius:var(--r-lg); padding:28px 24px;
  display:flex; flex-direction:column;
  background:#fff; border:1px solid var(--border);
  border-top:4px solid transparent;
  transition:transform var(--transition), box-shadow var(--transition);
}
.focus-card:hover { transform:translateY(-3px); box-shadow:var(--shadow-md); }
.focus-card.blue   { border-top-color:var(--blue); }
.focus-card.green  { border-top-color:var(--green); }
.focus-card.orange { border-top-color:var(--orange); }
.focus-card.purple { border-top-color:var(--purple); }
.focus-card.teal   { border-top-color:var(--teal); }
.focus-card.yellow { border-top-color:var(--yellow); }
.focus-icon {
  width:52px; height:52px; border-radius:var(--r-md);
  display:flex; align-items:center; justify-content:center;
  font-size:1.3rem; margin-bottom:18px;
}
.focus-card.blue   .focus-icon { background:var(--blue-l);   color:var(--blue); }
.focus-card.green  .focus-icon { background:var(--green-l);  color:var(--green); }
.focus-card.orange .focus-icon { background:var(--orange-l); color:var(--orange); }
.focus-card.purple .focus-icon { background:var(--purple-l); color:var(--purple); }
.focus-card.teal   .focus-icon { background:var(--teal-l);   color:var(--teal); }
.focus-card.yellow .focus-icon { background:var(--yellow-l); color:var(--yellow); }
.focus-card h3 { font-family:var(--font-head); font-size:1rem; font-weight:700; color:var(--dark); margin-bottom:10px; }
.focus-card p  { font-size:.875rem; color:var(--muted); line-height:1.65; flex:1; }

/* ============================================================
   PUBLICATIONS (colorful cards like original)
   ============================================================ */
#publications { background:var(--white); }
.pub-row { display:grid; grid-template-columns:repeat(5,1fr); gap:16px; }
.pub-card {
  border-radius:var(--r-lg); overflow:hidden;
  box-shadow:var(--shadow);
  transition:transform var(--transition), box-shadow var(--transition);
  display:flex; flex-direction:column;
}
.pub-card:hover { transform:translateY(-6px); box-shadow:var(--shadow-lg); }
.pub-card-img { width:100%; height:150px; object-fit:cover; display:block; }
.pub-card-img-placeholder {
  width:100%; height:150px;
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px;
  color:#fff;
}
.pub-card-img-placeholder i { font-size:2rem; opacity:.8; }
.pub-card-img-placeholder span { font-size:.7rem; text-transform:uppercase; letter-spacing:.06em; opacity:.7; }
.pub-card-body { padding:16px; flex:1; display:flex; flex-direction:column; background:#fff; }
.pub-card-body h3 { font-family:var(--font-head); font-size:.9rem; font-weight:800; color:var(--dark); margin-bottom:6px; line-height:1.3; }
.pub-card-body p { font-size:.78rem; color:var(--muted); flex:1; line-height:1.5; }
.pub-card-link {
  display:inline-flex; align-items:center; gap:5px;
  font-size:.8rem; font-weight:700; margin-top:12px;
  transition:gap var(--transition);
}
.pub-card-link:hover { gap:9px; }

.pub-c1 { background:linear-gradient(135deg, #0085d4, #056EB9); }
.pub-c2 { background:linear-gradient(135deg, #27AE60, #1e8449); }
.pub-c3 { background:linear-gradient(135deg, #E74C3C, #c0392b); }
.pub-c4 { background:linear-gradient(135deg, #F39C12, #d68910); }
.pub-c5 { background:linear-gradient(135deg, #8E44AD, #7d3c98); }
.pub-c1 .pub-card-link { color:var(--blue); }
.pub-c2 .pub-card-link { color:var(--green); }
.pub-c3 .pub-card-link { color:var(--red); }
.pub-c4 .pub-card-link { color:var(--yellow); }
.pub-c5 .pub-card-link { color:var(--purple); }

/* ============================================================
   NEWS
   ============================================================ */
#news { background:var(--bg); }
.news-row { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.news-card {
  background:var(--white); border-radius:var(--r-lg); overflow:hidden;
  border:1px solid var(--border); display:flex; flex-direction:column;
  transition:transform var(--transition), box-shadow var(--transition);
}
.news-card:hover { transform:translateY(-5px); box-shadow:var(--shadow-md); }
.news-img { width:100%; height:195px; object-fit:cover; }
.news-img-placeholder { width:100%; height:195px; display:flex; align-items:center; justify-content:center; font-size:2.5rem; color:rgba(5,110,185,.25); }
.news-body { padding:22px; flex:1; display:flex; flex-direction:column; }
.news-cat {
  display:inline-block; margin-bottom:10px;
  font-size:.68rem; font-weight:800; letter-spacing:.1em; text-transform:uppercase;
  color:var(--blue); background:var(--blue-l); padding:3px 10px; border-radius:50px;
}
.news-card h3 { font-family:var(--font-head); font-size:1rem; font-weight:800; color:var(--dark); margin-bottom:8px; line-height:1.4; flex:1; }
.news-card p { font-size:.845rem; color:var(--muted); line-height:1.6; margin-bottom:14px; }
.news-footer { display:flex; align-items:center; justify-content:space-between; border-top:1px solid var(--border); padding-top:12px; font-size:.78rem; color:var(--muted); }
.news-footer a { color:var(--blue); font-weight:700; }

/* ============================================================
   PARTNERS
   ============================================================ */
#partners { background:var(--white); padding:56px 0; }
.partners-strip {
  display:flex; align-items:center; justify-content:center;
  flex-wrap:wrap; gap:48px; margin-top:32px;
}
.partner { opacity:.55; filter:grayscale(1); transition:all var(--transition); }
.partner:hover { opacity:1; filter:grayscale(0); }
.partner img { height:48px; width:auto; }

/* ============================================================
   CONTACT
   ============================================================ */
#contact { background:var(--green-d); position:relative; overflow:hidden; }
#contact::before {
  content:''; position:absolute; top:-100px; right:-100px;
  width:400px; height:400px; border-radius:50%;
  background:rgba(255,255,255,.05);
}
#contact::after {
  content:''; position:absolute; bottom:-80px; left:-60px;
  width:300px; height:300px; border-radius:50%;
  background:rgba(255,255,255,.04);
}
.contact-grid { display:grid; grid-template-columns:1fr 1.2fr; gap:56px; align-items:start; position:relative; z-index:1; }
.contact-info-side .eyebrow { color:rgba(255,255,255,.7); }
.contact-info-side h2 { font-family:var(--font-head); font-size:clamp(1.6rem,3vw,2rem); font-weight:900; color:#fff; margin-bottom:14px; }
.contact-info-side p { color:rgba(255,255,255,.72); line-height:1.7; margin-bottom:28px; }
.cinfo { display:flex; flex-direction:column; gap:16px; }
.cinfo-item { display:flex; align-items:flex-start; gap:14px; color:rgba(255,255,255,.8); }
.cinfo-icon { width:42px; height:42px; background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.2); border-radius:10px; display:flex; align-items:center; justify-content:center; color:#FFD700; flex-shrink:0; }
.cinfo-item strong { display:block; color:#fff; font-size:.875rem; margin-bottom:1px; }
.cinfo-item span { font-size:.845rem; }
.csocial { display:flex; gap:10px; margin-top:28px; }
.csocial a { width:40px; height:40px; background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.2); border-radius:50%; display:flex; align-items:center; justify-content:center; color:rgba(255,255,255,.8); font-size:.95rem; transition:all var(--transition); }
.csocial a:hover { background:var(--orange); border-color:var(--orange); color:#fff; }

.contact-form-card { background:#fff; border-radius:var(--r-xl); padding:36px; box-shadow:var(--shadow-lg); }
.contact-form-card h3 { font-family:var(--font-head); font-size:1.2rem; font-weight:800; color:var(--dark); margin-bottom:22px; }
.form-row { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.fg { display:flex; flex-direction:column; gap:5px; margin-bottom:14px; }
.fg label { font-size:.8rem; font-weight:700; color:var(--text); }
.fg input, .fg textarea {
  padding:11px 15px; border:1.5px solid var(--border); border-radius:var(--r-sm);
  font-family:var(--font-body); font-size:.875rem; color:var(--dark);
  outline:none; transition:border-color var(--transition), box-shadow var(--transition);
}
.fg input:focus, .fg textarea:focus { border-color:var(--blue); box-shadow:0 0 0 3px rgba(5,110,185,.12); }
.fg textarea { resize:vertical; min-height:110px; }
.form-btn { width:100%; padding:14px; background:var(--blue); color:#fff; border:none; border-radius:50px; font-family:var(--font-head); font-size:.95rem; font-weight:800; cursor:pointer; transition:background var(--transition); }
.form-btn:hover { background:var(--blue-d); }

/* ============================================================
   FOOTER
   ============================================================ */
footer { background:#091f0e; color:rgba(255,255,255,.6); padding:56px 0 24px; }
.footer-grid { display:grid; grid-template-columns:1.5fr 1fr 1fr 1.2fr; gap:40px; margin-bottom:40px; }
.footer-brand img { height:42px; margin-bottom:14px; filter:brightness(10); }
.footer-brand p { font-size:.85rem; line-height:1.65; margin-bottom:18px; }
.fsocial { display:flex; gap:8px; }
.fsocial a { width:34px; height:34px; background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.1); border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:.85rem; color:rgba(255,255,255,.6); transition:all var(--transition); }
.fsocial a:hover { background:var(--orange); border-color:var(--orange); color:#fff; }
.footer-col h4 { color:#fff; font-size:.875rem; font-weight:800; margin-bottom:16px; }
.footer-links { display:flex; flex-direction:column; gap:8px; }
.footer-links a { font-size:.84rem; color:rgba(255,255,255,.55); transition:color var(--transition); }
.footer-links a:hover { color:#fff; }
.footer-cinfo { display:flex; flex-direction:column; gap:10px; }
.footer-cinfo div { display:flex; gap:8px; align-items:flex-start; font-size:.82rem; }
.footer-cinfo i { color:var(--orange); margin-top:3px; flex-shrink:0; }
.footer-cinfo a { color:rgba(255,255,255,.55); transition:color var(--transition); }
.footer-cinfo a:hover { color:#fff; }
.footer-bottom { display:flex; align-items:center; justify-content:space-between; border-top:1px solid rgba(255,255,255,.07); padding-top:22px; font-size:.78rem; flex-wrap:wrap; gap:8px; }
.footer-bottom a { color:var(--orange); }

/* Scroll top */
#scroll-top { position:fixed; bottom:24px; right:24px; width:44px; height:44px; background:var(--blue); color:#fff; border:none; border-radius:50%; display:flex; align-items:center; justify-content:center; cursor:pointer; font-size:1rem; box-shadow:var(--shadow-md); opacity:0; visibility:hidden; transition:all var(--transition); z-index:999; }
#scroll-top.visible { opacity:1; visibility:visible; }
#scroll-top:hover { background:var(--blue-d); transform:translateY(-3px); }

/* ============================================================
   INDEX PAGE – ADDITIONAL COMPONENTS
   ============================================================ */

/* Focus card typography helpers */
.focus-title { font-family:var(--font-head); font-size:1rem; font-weight:700; color:var(--dark); margin-bottom:10px; }
.focus-text  { font-size:.875rem; color:var(--muted); line-height:1.65; margin-bottom:14px; flex:1; }
.focus-link  {
  display:inline-flex; align-items:center; gap:6px; margin-top:14px;
  font-size:.8rem; font-weight:600; transition:gap var(--transition);
}
.focus-card.blue   .focus-link { color:var(--blue); }
.focus-card.green  .focus-link { color:var(--green); }
.focus-card.orange .focus-link { color:var(--orange); }
.focus-card.purple .focus-link { color:var(--purple); }
.focus-card.teal   .focus-link { color:var(--teal); }
.focus-card.yellow .focus-link { color:#b7770d; }
.focus-link:hover  { gap:10px; }

/* Pub stat cards (homepage only – different from pub-card book style) */
.pub-grid { display:grid; grid-template-columns:repeat(5,1fr); gap:16px; }
.pub-card {
  border-radius:var(--r-lg); overflow:hidden;
  box-shadow:var(--shadow);
  transition:transform var(--transition), box-shadow var(--transition);
  display:flex; flex-direction:column; align-items:center;
  padding:32px 20px 24px; text-align:center; color:#fff;
}
.pub-card:hover { transform:translateY(-6px); box-shadow:var(--shadow-lg); }
.pub-icon { font-size:2rem; margin-bottom:14px; opacity:.9; }
.pub-num  { font-family:var(--font-head); font-size:2.2rem; font-weight:900; line-height:1; }
.pub-label{ font-size:.75rem; font-weight:700; text-transform:uppercase; letter-spacing:.08em; opacity:.85; margin:4px 0 12px; }
.pub-desc { font-size:.8rem; opacity:.8; line-height:1.55; margin-bottom:18px; flex:1; }
.pub-link {
  display:inline-flex; align-items:center; gap:5px;
  font-size:.8rem; font-weight:700; color:#fff;
  border:1.5px solid rgba(255,255,255,.4); padding:7px 16px; border-radius:50px;
  transition:background var(--transition), border-color var(--transition);
}
.pub-link:hover { background:rgba(255,255,255,.15); border-color:rgba(255,255,255,.7); }

/* News grid (homepage 3-col) */
.news-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.news-card {
  background:var(--white); border-radius:var(--r-lg); overflow:hidden;
  border:1px solid var(--border); display:flex; flex-direction:column;
  transition:transform var(--transition), box-shadow var(--transition);
}
.news-card:hover { transform:translateY(-5px); box-shadow:var(--shadow-md); }
.news-img { position:relative; width:100%; height:200px; overflow:hidden; }
.news-img img { width:100%; height:100%; object-fit:cover; display:block; }
.news-badge {
  position:absolute; top:14px; left:14px;
  font-size:.68rem; font-weight:800; letter-spacing:.08em; text-transform:uppercase;
  color:#fff; padding:4px 12px; border-radius:50px;
}
.news-body { padding:22px; flex:1; display:flex; flex-direction:column; }
.news-date { font-size:.75rem; color:var(--muted); margin-bottom:10px; }
.news-title { font-family:var(--font-head); font-size:1rem; font-weight:800; color:var(--dark); margin-bottom:8px; line-height:1.4; flex:1; }
.news-excerpt { font-size:.845rem; color:var(--muted); line-height:1.6; margin-bottom:14px; }
.news-link { display:inline-flex; align-items:center; gap:6px; font-size:.82rem; font-weight:700; color:var(--blue); transition:gap var(--transition); }
.news-link:hover { gap:10px; }

/* Partners row */
.partners-row {
  display:flex; align-items:center; justify-content:center;
  gap:56px; flex-wrap:wrap;
}
.partner-item {
  opacity:.6; filter:grayscale(1); transition:all var(--transition);
  display:flex; align-items:center; justify-content:center;
}
.partner-item:hover { opacity:1; filter:grayscale(0); }
.partner-item img { height:72px; width:auto; object-fit:contain; }
.partner-gcca { flex-direction:column; gap:6px; }
.partner-gcca img { height:46px; }
.partner-caption { font-size:.72rem; font-weight:600; color:var(--muted); letter-spacing:.02em; }

/* Contact section */
.contact-section { background:var(--green-d); position:relative; overflow:hidden; }
.contact-section::before {
  content:''; position:absolute; top:-100px; right:-100px;
  width:400px; height:400px; border-radius:50%;
  background:rgba(255,255,255,.05);
}
.contact-section::after {
  content:''; position:absolute; bottom:-80px; left:-60px;
  width:300px; height:300px; border-radius:50%;
  background:rgba(255,255,255,.04);
}
.contact-grid { display:grid; grid-template-columns:1fr 1.2fr; gap:56px; align-items:start; position:relative; z-index:1; }
.contact-info { }
.contact-detail { display:flex; align-items:flex-start; gap:14px; color:rgba(255,255,255,.8); margin-bottom:16px; }
.contact-icon { width:42px; height:42px; background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.2); border-radius:10px; display:flex; align-items:center; justify-content:center; color:#FFD700; flex-shrink:0; }
.contact-label { font-size:.75rem; font-weight:700; color:rgba(255,255,255,.6); text-transform:uppercase; letter-spacing:.06em; margin-bottom:2px; }
.contact-value { font-size:.875rem; color:#fff; line-height:1.5; }
.contact-form-wrap { background:#fff; border-radius:var(--r-xl); padding:36px; box-shadow:var(--shadow-lg); }
.contact-form { }
.form-group { display:flex; flex-direction:column; gap:5px; margin-bottom:14px; }
.form-label { font-size:.8rem; font-weight:700; color:var(--text); }
.form-control {
  padding:11px 15px; border:1.5px solid var(--border); border-radius:var(--r-sm);
  font-family:var(--font-body); font-size:.875rem; color:var(--dark);
  outline:none; transition:border-color var(--transition), box-shadow var(--transition);
  width:100%;
}
.form-control:focus { border-color:var(--blue); box-shadow:0 0 0 3px rgba(5,110,185,.12); }
textarea.form-control { resize:vertical; min-height:110px; }

/* Footer extra helpers */
.footer-tagline { font-size:.85rem; line-height:1.65; color:rgba(255,255,255,.55); margin-bottom:18px; }
.footer-heading { color:#fff; font-size:.875rem; font-weight:800; margin-bottom:16px; }
.footer-socials { display:flex; gap:8px; }
.footer-socials a { width:34px; height:34px; background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.1); border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:.85rem; color:rgba(255,255,255,.6); transition:all var(--transition); }
.footer-socials a:hover { background:var(--orange); border-color:var(--orange); color:#fff; }

/* Views section */
.views-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.view-card {
  background:var(--white); border-radius:var(--r-lg); overflow:hidden;
  border:1px solid var(--border);
  transition:transform var(--transition), box-shadow var(--transition);
  display:flex; flex-direction:column;
}
.view-card:hover { transform:translateY(-4px); box-shadow:var(--shadow-md); }
.view-card-top { padding:22px 22px 0; flex:1; }
.view-type {
  display:inline-block; font-size:.68rem; font-weight:700; letter-spacing:.08em;
  text-transform:uppercase; padding:3px 10px; border-radius:var(--r-sm);
  margin-bottom:12px;
}
.view-type.opinion  { background:var(--blue-l);   color:var(--blue); }
.view-type.review   { background:var(--green-l);  color:var(--green); }
.view-type.interview{ background:var(--orange-l); color:var(--orange); }
.view-card h3 { font-family:var(--font-head); font-size:.98rem; font-weight:700; color:var(--dark); margin-bottom:10px; line-height:1.4; }
.view-card p  { font-size:.845rem; color:var(--muted); line-height:1.6; margin-bottom:14px; }
.view-card-foot { padding:14px 22px; border-top:1px solid var(--border); display:flex; align-items:center; justify-content:space-between; }
.view-author { font-size:.78rem; color:var(--muted); }
.view-link { display:inline-flex; align-items:center; gap:5px; font-size:.8rem; font-weight:600; color:var(--blue); transition:gap var(--transition); }
.view-link:hover { gap:8px; }

/* Gallery section */
.gallery-grid { display:grid; grid-template-columns:repeat(4,1fr); grid-template-rows:180px 180px; gap:10px; }
.gallery-thumb {
  border-radius:var(--r-md); overflow:hidden; position:relative;
  background:var(--green-l);
}
.gallery-thumb img { width:100%; height:100%; object-fit:cover; display:block; transition:transform .35s ease; }
.gallery-thumb:hover img { transform:scale(1.05); }
.gallery-thumb.wide { grid-column:span 2; }
.gallery-cta { text-align:center; margin-top:32px; }

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media(max-width:960px){
  .nav-menu,.nav-cta{display:none;}
  .nav-hamburger{display:flex;}
  .hero-inner{grid-template-columns:1fr; gap:32px; padding:40px 0;}
  .hero-mosaic{grid-template-rows:160px 160px;}
  .welcome-grid{grid-template-columns:1fr;}
  .focus-grid{grid-template-columns:repeat(2,1fr);}
  .pub-row,.pub-grid{grid-template-columns:repeat(3,1fr);}
  .news-row,.news-grid{grid-template-columns:1fr 1fr;}
  .views-grid{grid-template-columns:1fr 1fr;}
  .gallery-grid{grid-template-columns:repeat(2,1fr); grid-template-rows:150px 150px;}
  .gallery-thumb.wide{grid-column:span 1;}
  .contact-grid{grid-template-columns:1fr;}
  .footer-grid{grid-template-columns:1fr 1fr;}
  .strip-inner{grid-template-columns:repeat(2,1fr);}
}
@media(max-width:600px){
  .pub-row,.pub-grid{grid-template-columns:repeat(2,1fr);}
  .focus-grid{grid-template-columns:1fr;}
  .news-row,.news-grid{grid-template-columns:1fr;}
  .views-grid{grid-template-columns:1fr;}
  .gallery-grid{grid-template-columns:repeat(2,1fr); grid-template-rows:130px 130px;}
  .hero-mosaic{display:none;}
  .form-row{grid-template-columns:1fr;}
  .footer-grid{grid-template-columns:1fr;}
  .footer-bottom{flex-direction:column;text-align:center;}
  .strip-inner{grid-template-columns:repeat(2,1fr);}
  .welcome-img-badge{right:0;}
}

/* =============================================================
   AJUSTE GLOBAL DE ESPACIADO (aplica a TODAS las páginas)
   Usa selectores `body .x` para ganar por especificidad a los
   <style> que cada página define en su contenido, sin tener
   que editarlas una por una.
   ============================================================= */
/* Menos hueco entre el navbar (fijo, 66px) y el primer texto del hero */
body .page-hero        { padding-top: calc(var(--nav-h) + 24px); padding-bottom: 76px; }
body .page-hero-inner  { padding-top: 0; }
body .single-hero      { padding-top: calc(var(--nav-h) + 24px); padding-bottom: 76px; }
/* La curva inferior del hero, un poco más baja para que no "coma" texto */
body .page-hero::after,
body .single-hero::after { height: 48px; }
/* Secciones con un poco menos de aire vertical (80px -> 60px) */
body .section-pad      { padding: 60px 0; }

/* =============================================================
   NAVBAR BLANCO (v3) — máximo contraste, look moderno.
   Requiere el logo oscuro (header.php usa assets/img/logo-dark.png).
   Para REVERTIR: restaura assets/styles-v2.css y header.php desde
   la carpeta backup/.
   ============================================================= */
#navbar{
  background:#fff;
  border-bottom:1px solid var(--border);
  box-shadow:0 2px 18px rgba(0,0,0,.09);
}
#navbar .nav-logo img{ height:44px; }
/* Links: texto oscuro + subrayado verde animado */
#navbar .nav-menu > li > a{
  color:var(--dark); font-weight:600; letter-spacing:.01em; position:relative; padding:8px 15px;
}
#navbar .nav-menu > li > a::before{
  content:""; position:absolute; left:15px; right:15px; bottom:2px; height:2px;
  background:var(--green); border-radius:2px; transform:scaleX(0); transform-origin:left;
  transition:transform .25s ease;
}
#navbar .nav-menu > li > a:hover::before,
#navbar .nav-menu > li > a.active::before{ transform:scaleX(1); }
#navbar .nav-menu > li > a:hover,
#navbar .nav-menu > li > a.active{ background:transparent; color:var(--green); }
/* Botón Contact verde (resalta sobre blanco) */
#navbar .nav-cta{
  background:var(--green) !important; color:#fff !important; font-weight:700 !important;
  box-shadow:0 4px 14px rgba(30,140,78,.35);
  transition:transform var(--transition), background var(--transition);
}
#navbar .nav-cta::before{ display:none; }
#navbar .nav-cta:hover{ background:var(--green-d) !important; color:#fff !important; transform:translateY(-1px); }
/* Hamburguesa (móvil) en oscuro para que se vea sobre el blanco */
#navbar .nav-hamburger span{ background:var(--dark); }

/* =============================================================
   BARRA DE ADMIN DE WP (solo visible estando logeado): baja los
   elementos fijos 32px para que la barra de admin no los tape.
   ============================================================= */
body.admin-bar #navbar{ top:32px; }
body.admin-bar #mobile-nav{ top:calc(32px + var(--nav-h)); }
body.admin-bar .tab-nav{ top:calc(32px + var(--nav-h)); }
@media screen and (max-width:782px){
  body.admin-bar #navbar{ top:46px; }
  body.admin-bar #mobile-nav{ top:calc(46px + var(--nav-h)); }
  body.admin-bar .tab-nav{ top:calc(46px + var(--nav-h)); }
}

/* =============================================================
   CONTACT FORM 7 — hereda el diseño del formulario de contacto.
   ============================================================= */
.contact-form .wpcf7-form-control-wrap{ display:block; }
.contact-form .cf7-submit{ width:100%; cursor:pointer; }
.contact-form .wpcf7-not-valid-tip{ color:#e03131; font-size:.75rem; margin-top:5px; }
.contact-form .wpcf7-spinner{ margin:0 auto; }
.contact-form .wpcf7-response-output{ border-radius:8px; padding:11px 14px; margin:16px 0 0; font-size:.85rem; border-width:1.5px; }
.contact-form .wpcf7 form.sent .wpcf7-response-output{ border-color:var(--green); color:var(--green); background:var(--green-l); }
.contact-form .wpcf7 form.invalid .wpcf7-response-output,
.contact-form .wpcf7 form.failed .wpcf7-response-output,
.contact-form .wpcf7 form.spam .wpcf7-response-output{ border-color:#e03131; color:#c92a2a; background:#fff0f0; }
