.eyebrow{
      display:inline-flex;
      align-items:center;
      gap:10px;
      color:var(--forest-700);
      font-size:0.875rem;
      font-weight:800;
      letter-spacing:.13em;
      text-transform:uppercase;
    }
.eyebrow::before{
      content:"";
      width:26px;height:2px;
      background:var(--gold-500);
      border-radius:999px;
    }
.section-title{
      margin-top:13px;
      font-family:"DM Serif Display",serif;
      font-size:clamp(2.1rem,4.4vw,4rem);
      line-height:1.03;
      font-weight:400;
      color:var(--forest-950);
      text-wrap:balance;
    }
.section-intro{
      margin-top:17px;
      max-width:760px;
      color:var(--ink-700);
      font-size:clamp(.98rem,1.5vw,1.08rem);
    }
.hero{
      position:relative;
      min-height:760px;
      display:flex;
      align-items:center;
      overflow:hidden;
      isolation:isolate;
      color:#fff;
      background:
        linear-gradient(90deg,rgba(7,26,19,.96) 0%,rgba(7,26,19,.76) 48%,rgba(7,26,19,.26) 100%),
        url("../img/fondo-huerta-mejorado.png") center 45% / cover no-repeat;
    }
.hero::after{
      content:"";
      position:absolute;
      z-index:-1;
      inset:auto 0 0 0;
      height:260px;
      background:linear-gradient(to top,rgba(7,26,19,.55),transparent);
    }
.hero-content{
      max-width:850px;
      padding-top:var(--header-h);
    }
.hero-badge{
      display:inline-flex;
      align-items:center;
      gap:9px;
      padding:9px 13px;
      border:1px solid rgba(255,255,255,.16);
      border-radius:999px;
      color:rgba(255,255,255,.88);
      background:rgba(255,255,255,.09);
      backdrop-filter:blur(8px);
      font-size:1.0rem;
      font-weight:800;
      text-transform:uppercase;
      letter-spacing:.06em;
    }
.hero-badge i{color:var(--gold-400)}
.hero h2{
      margin-top:22px;
      font-family:"DM Serif Display",serif;
      font-size:clamp(3.7rem,7.4vw,6.8rem);
      line-height:.91;
      font-weight:400;
      letter-spacing:-.025em;
      text-wrap:balance;
    }
.hero h2 span{color:var(--gold-400)}
.hero-copy{
      margin-top:24px;
      max-width:710px;
      color:rgba(255,255,255,.76);
      font-size:clamp(1.0rem,1.7vw,1.16rem);
    }
.hero-actions{
      margin-top:30px;
      display:flex;
      flex-wrap:wrap;
      gap:10px;
    }
.btn{
      min-height:49px;
      padding:0 17px;
      display:inline-flex;
      align-items:center;
      justify-content:center;
      gap:9px;
      border-radius:13px;
      font-size:0.875rem;
      font-weight:900;
      transition:transform .2s ease,background .2s ease;
    }
.btn:hover{transform:translateY(-2px)}
.btn.primary{
      color:var(--forest-950);
      background:var(--gold-400);
    }
.btn.secondary{
      color:#fff;
      border:1px solid rgba(255,255,255,.17);
      background:rgba(255,255,255,.09);
      backdrop-filter:blur(8px);
    }
.hero-stats{
      position:absolute;
      left:0;right:0;bottom:26px;
    }
.hero-stats-inner{
      display:grid;
      grid-template-columns:repeat(3,1fr);
      gap:10px;
      max-width:720px;
    }
.hero-stat{
      padding:15px 17px;
      border:1px solid rgba(255,255,255,.12);
      border-radius:16px;
      background:rgba(11,34,25,.42);
      backdrop-filter:blur(10px);
    }
.hero-stat strong{
      display:block;
      color:var(--gold-400);
      font-family:"DM Serif Display",serif;
      font-size:1.6rem;
      line-height:1;
      font-weight:400;
    }
.hero-stat span{
      display:block;
      margin-top:5px;
      color:rgba(255,255,255,.64);
      font-size:0.875rem;
      font-weight:700;
    }
.about{padding:100px 0}
.about-grid{
      display:grid;
      grid-template-columns:1.03fr .97fr;
      gap:70px;
      align-items:center;
    }
.about-copy p{
      margin-top:17px;
      color:var(--ink-700);
      font-size:0.96rem;
    }
.about-card{
      position:relative;
      min-height:480px;
      overflow:hidden;
      padding:30px;
      display:flex;
      flex-direction:column;
      justify-content:flex-end;
      border-radius:var(--radius-lg);
      color:#fff;
      background:
        linear-gradient(to top,rgba(11,34,25,.98) 0%,rgba(11,34,25,.78) 32%,rgba(11,34,25,.06) 72%),
        url("../img/formacion-agropecuaria-limpia.png") 65% center/cover no-repeat;
      box-shadow:var(--shadow-md);
    }
.about-card .mini{
      color:var(--gold-400);
      font-size:0.875rem;
      font-weight:900;
      text-transform:uppercase;
      letter-spacing:.08em;
    }
.about-card h3{
      margin-top:7px;
      max-width:500px;
      font-family:"DM Serif Display",serif;
      font-size:2.2rem;
      line-height:1.05;
      font-weight:400;
    }
.about-card p{
      margin-top:10px;
      max-width:500px;
      color:rgba(255,255,255,.94);
      font-size:1.0625rem;
      line-height:1.6;
    }
.environments{
      padding:100px 0 110px;
      background:var(--cream-100);
    }
.env-heading{
      display:flex;
      align-items:end;
      justify-content:space-between;
      gap:40px;
    }
.env-heading .section-intro{max-width:510px;margin-bottom:4px}
.env-grid{
      margin-top:42px;
      display:grid;
      grid-template-columns:1fr 1fr;
      gap:16px;
    }
.env-card{
      position:relative;
      min-height:510px;
      overflow:hidden;
      border-radius:var(--radius-lg);
      box-shadow:var(--shadow-md);
      isolation:isolate;
    }
.env-card::before{
      content:"";
      position:absolute;
      inset:0;
      z-index:-1;
      transition:transform .65s cubic-bezier(.2,.7,.25,1);
    }
.env-card:hover::before{transform:scale(1.035)}
.env-card.animal::before{
      background:
        linear-gradient(to top,rgba(7,26,19,.98) 0%,rgba(7,26,19,.68) 54%,rgba(7,26,19,.18) 100%),
        url("../img/animal1.jpg") center/cover no-repeat;
    }
.env-card.vegetal::before{
      background:
        linear-gradient(to top,rgba(7,26,19,.98) 0%,rgba(7,26,19,.66) 54%,rgba(7,26,19,.17) 100%),
        url("../img/vegetal1.jpg") center/cover no-repeat;
    }
.env-card-content{
      position:absolute;
      inset:auto 0 0 0;
      padding:31px;
      color:#fff;
    }
.env-icon{
      width:48px;height:48px;
      display:grid;
      place-items:center;
      border-radius:14px;
      color:var(--forest-950);
      background:var(--gold-400);
    }
.env-card h3{
      margin-top:17px;
      font-family:"DM Serif Display",serif;
      font-size:2.5rem;
      line-height:1;
      font-weight:400;
    }
.env-card p{
      margin-top:11px;
      max-width:510px;
      color:rgba(255,255,255,.68);
      font-size:0.875rem;
    }
.env-links{
      margin-top:18px;
      display:flex;
      flex-wrap:wrap;
      gap:7px;
    }
.env-links a{
      padding:7px 10px;
      border:1px solid rgba(255,255,255,.1);
      border-radius:999px;
      color:rgba(255,255,255,.82);
      background:rgba(255,255,255,.08);
      font-size:0.875rem;
      font-weight:800;
      transition:.15s ease;
    }
.env-links a:hover{
      color:var(--forest-950);
      background:var(--gold-400);
      border-color:transparent;
    }
.env-main-link{
      margin-top:20px;
      display:inline-flex;
      align-items:center;
      gap:8px;
      color:var(--gold-400);
      font-size:0.875rem;
      font-weight:900;
    }
.anniversary{padding:100px 0}
.anniversary-card{
      position:relative;
      overflow:hidden;
      padding:50px;
      display:grid;
      grid-template-columns:1fr auto;
      gap:40px;
      align-items:center;
      border-radius:var(--radius-lg);
      color:#fff;
      background:
        linear-gradient(110deg,rgba(11,34,25,.98),rgba(24,70,53,.89)),
        url("../img/foto-historia9.jpeg") center/cover no-repeat;
      box-shadow:var(--shadow-md);
    }
.anniversary-card::after{
      content:"40";
      position:absolute;
      right:15px;
      top:-50px;
      font-family:"DM Serif Display",serif;
      font-size:15.0rem;
      line-height:1;
      color:rgba(255,255,255,.045);
    }
.anniversary-copy{position:relative;z-index:2}
.anniversary-copy .eyebrow{color:var(--leaf-300)}
.anniversary-copy h2{
      margin-top:12px;
      max-width:720px;
      font-family:"DM Serif Display",serif;
      font-size:clamp(2.3rem,5vw,4.3rem);
      line-height:1;
      font-weight:400;
    }
.anniversary-copy p{
      margin-top:13px;
      max-width:650px;
      color:rgba(255,255,255,.68);
      font-size:0.875rem;
    }
.anniversary-number{
      position:relative;
      z-index:2;
      min-width:150px;
      text-align:center;
    }
.anniversary-number strong{
      display:block;
      color:var(--gold-400);
      font-family:"DM Serif Display",serif;
      font-size:4.7rem;
      line-height:.9;
      font-weight:400;
    }
.anniversary-number span{
      display:block;
      margin-top:8px;
      color:rgba(255,255,255,.66);
      font-size:0.875rem;
      font-weight:800;
      text-transform:uppercase;
      letter-spacing:.08em;
    }
.community{
      padding:100px 0;
      color:#fff;
      background:var(--forest-950);
    }
.community .eyebrow{color:var(--leaf-300)}
.community .section-title{color:#fff}
.community .section-intro{color:rgba(255,255,255,.64)}
.community-grid{
      margin-top:38px;
      display:grid;
      grid-template-columns:repeat(2,1fr);
      gap:14px;
    }
.community-card{
      padding:28px;
      border:1px solid rgba(255,255,255,.1);
      border-radius:20px;
      background:rgba(255,255,255,.055);
    }
.community-icon{
      width:45px;height:45px;
      display:grid;
      place-items:center;
      border-radius:13px;
      color:var(--forest-950);
      background:var(--gold-400);
    }
.community-card h3{
      margin-top:18px;
      font-family:"DM Serif Display",serif;
      font-size:1.8rem;
      font-weight:400;
      line-height:1.05;
    }
.community-card p{
      margin-top:9px;
      color:rgba(255,255,255,.65);
      font-size:0.875rem;
    }
.quick{padding:100px 0}
.quick-grid{
      margin-top:38px;
      display:grid;
      grid-template-columns:repeat(4,1fr);
      gap:12px;
    }
.quick-card{
      min-height:210px;
      padding:24px;
      display:flex;
      flex-direction:column;
      border:1px solid rgba(18,51,40,.08);
      border-radius:19px;
      background:#fff;
      box-shadow:var(--shadow-sm);
      transition:transform .2s ease,box-shadow .2s ease;
    }
.quick-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-md)}
.quick-icon{
      width:43px;height:43px;
      display:grid;
      place-items:center;
      border-radius:13px;
      color:var(--forest-800);
      background:#e7efe3;
    }
.quick-card h3{margin-top:17px;color:var(--forest-950);font-size:0.875rem}
.quick-card p{margin-top:7px;color:var(--ink-700);font-size:0.875rem;line-height:1.48}
.quick-card span{
      margin-top:auto;
      padding-top:20px;
      color:var(--forest-700);
      font-size:0.875rem;
      font-weight:900;
    }
[data-reveal]{
      opacity:0;
      transform:translateY(22px);
      transition:opacity .6s ease,transform .6s ease;
    }
[data-reveal].revealed{opacity:1;transform:none}
@media(max-width:1120px){
.about-grid{grid-template-columns:1fr;gap:45px}
.quick-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:720px){
.hero{
        min-height:760px;
        align-items:flex-end;
        padding:115px 0 165px;
        background:
          linear-gradient(to top,rgba(7,26,19,.98) 0%,rgba(7,26,19,.78) 64%,rgba(7,26,19,.24) 100%),
          url("../img/fondo-huerta-mejorado.png") 58% center/cover no-repeat;
      }
.hero-content{padding-top:0}
.hero h2{font-size:clamp(3.2rem,15vw,4.9rem)}
.hero-copy{font-size:1.0rem}
.hero-actions{display:grid;grid-template-columns:1fr}
.btn{width:100%}
.hero-stats{bottom:18px}
.hero-stats-inner{grid-template-columns:repeat(3,1fr);gap:6px}
.hero-stat{padding:12px 10px}
.hero-stat strong{font-size:1.25rem}
.hero-stat span{font-size:0.875rem}
.about{padding:80px 0 70px}
.about-card{min-height:360px;padding:25px}
.environments{padding:80px 0 90px}
.env-heading{display:block}
.env-grid{grid-template-columns:1fr}
.env-card{min-height:520px}
.env-card-content{padding:25px}
.env-card h3{font-size:2.2rem}
.anniversary{padding:80px 0}
.anniversary-card{
        padding:34px 25px;
        grid-template-columns:1fr;
      }
.anniversary-number{text-align:left}
.anniversary-card::after{font-size:10.0rem;right:-10px}
.community{padding:80px 0}
.community-grid{grid-template-columns:1fr}
.quick{padding:80px 0}
.quick-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:430px){
.quick-grid{grid-template-columns:1fr}
.hero-stats-inner{grid-template-columns:1fr 1fr 1fr}
}
@media(prefers-reduced-motion:reduce){
*,*::before,*::after{
        animation-duration:.01ms!important;
        transition-duration:.01ms!important;
      }
[data-reveal]{opacity:1;transform:none}
}
/* Institutional welcome precedes the educational proposal. */
.welcome{padding:calc(var(--header-h) + 44px) 0 44px;background:radial-gradient(ellipse at 90% 20%,rgba(108,154,98,.16),transparent 55%),linear-gradient(125deg,var(--forest-950),var(--forest-800));border-bottom:1px solid rgba(217,164,65,.25);color:var(--cream-50)}
.welcome-inner{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:48px;align-items:center}
.welcome .eyebrow{color:var(--leaf-300)}
.welcome h1{margin-top:18px;max-width:960px;font-family:"DM Serif Display",serif;font-size:clamp(2rem,3.8vw,3.4rem);font-weight:400;line-height:1.12;color:var(--cream-50);text-wrap:balance}
.welcome h1 span{display:inline-block;margin-top:10px;color:var(--gold-400)}
.welcome-location{display:flex;align-items:baseline;gap:10px;margin-top:24px;color:#d4dfd6;font-size:1rem}
.welcome-location i{color:var(--gold-400);flex-shrink:0}
.welcome-logo{width:200px;height:auto;object-fit:contain;filter:drop-shadow(0 12px 24px rgba(0,0,0,.3))}
@media(max-width:720px){
 .welcome{padding-top:calc(var(--header-h) + 36px);padding-bottom:36px}
 .welcome-inner{grid-template-columns:1fr;gap:24px}
 .welcome-logo{grid-row:1;width:112px}
 .welcome h1{font-size:clamp(1.85rem,7.5vw,2.6rem)}
 .welcome-location{font-size:.9375rem}
}
