/*
  Jalisco Academy 2026 — versión clara
  Conserva la estructura y componentes de la maqueta original,
  adaptándolos a la línea validada: marfil, blanco, degradados suaves,
  naranja, magenta y verde.
*/
:root{
  --bg:#fbfaf7;
  --bg-soft:#f6f2ec;
  --panel:#ffffff;
  --panel-2:#fffaf5;
  --line:rgba(38,54,62,.12);
  --text:#26333a;
  --muted:#69777e;
  --cream:#fffdf9;
  --shadow:0 24px 64px rgba(74,53,38,.12);
}

body{
  background:
    radial-gradient(circle at 10% 8%,rgba(239,0,96,.055),transparent 25%),
    radial-gradient(circle at 88% 10%,rgba(255,122,0,.10),transparent 31%),
    linear-gradient(180deg,#fffdf9 0%,#fbfaf7 48%,#f8f4ee 100%);
  color:var(--text);
}
body::before{
  background:
    radial-gradient(circle at 12% 10%,rgba(239,0,96,.055),transparent 27%),
    radial-gradient(circle at 86% 18%,rgba(255,122,0,.075),transparent 31%),
    linear-gradient(rgba(36,52,60,.025) 1px,transparent 1px),
    linear-gradient(90deg,rgba(36,52,60,.025) 1px,transparent 1px);
  background-size:auto,auto,64px 64px,64px 64px;
}
.noise{opacity:.014;mix-blend-mode:multiply}

.site-header{
  border-color:rgba(38,54,62,.11);
  background:rgba(255,253,249,.86);
  box-shadow:0 14px 42px rgba(68,48,35,.10);
}
.desktop-nav a{color:#66737a}
.desktop-nav a:hover,.desktop-nav a.active{color:#1f2b31}
.btn-primary{color:#fff}
.btn-ghost{
  color:#27343b;
  background:rgba(255,255,255,.74);
  border-color:rgba(38,54,62,.22);
  box-shadow:0 7px 24px rgba(46,57,63,.05);
}
.btn-ghost:hover{background:#fff;border-color:rgba(239,0,96,.30)}
.menu-toggle span{background:#26333a}
.mobile-menu{
  border-color:rgba(38,54,62,.12);
  background:rgba(255,253,249,.97);
  box-shadow:0 24px 60px rgba(68,48,35,.16);
}
.mobile-menu a:hover{background:rgba(239,0,96,.06)}

.hero{border-bottom-color:rgba(38,54,62,.08)}
.hero::before{
  background:
    linear-gradient(110deg,rgba(255,255,255,.98) 0%,rgba(255,252,247,.93) 49%,rgba(255,246,238,.88) 100%);
  border-color:rgba(255,122,0,.13);
  box-shadow:0 34px 90px rgba(97,64,40,.08);
}
.hero::after{
  content:"";
  position:absolute;
  z-index:-1;
  right:-7%;
  top:88px;
  width:58%;
  height:78%;
  background:url('assets/keyvisual-validado.webp') center/cover no-repeat;
  opacity:.10;
  filter:saturate(.95);
  -webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 32%,#000 100%);
  mask-image:linear-gradient(90deg,transparent 0%,#000 32%,#000 100%);
  pointer-events:none;
}
.eyebrow{color:#d95e00}
.hero-lead{color:#5f6d74}
.hero-tagline{color:#243139}
.hero-media{filter:drop-shadow(0 30px 50px rgba(83,52,33,.08))}
.live-card{box-shadow:0 28px 70px rgba(103,58,38,.16)}
.live-card::before{background:radial-gradient(circle,rgba(239,0,96,.12),transparent 64%)}
.live-topbar{background:rgba(255,255,255,.96);color:#253139}
.live-topbar button{
  border-color:rgba(38,54,62,.12);
  background:#f7f5f1;
  color:#47555d;
}
.live-pill{background:rgba(239,0,96,.08);color:#d50055;border-color:rgba(239,0,96,.22)}
.floating-chip{
  background:rgba(255,255,255,.94);
  border-color:rgba(38,54,62,.12);
  box-shadow:0 16px 34px rgba(79,52,36,.12);
}
.floating-chip span{color:#68757c}
.hero-tsikuri{opacity:.085;filter:saturate(.9)}
.hero-orbit{border-color:rgba(255,122,0,.12)}
.hero-orbit-b{border-color:rgba(239,0,96,.12)}

.stat-card{
  border-color:rgba(38,54,62,.10);
  background:linear-gradient(145deg,rgba(255,255,255,.98),rgba(255,249,243,.98));
  box-shadow:0 18px 44px rgba(86,58,38,.10);
}
.stat-card small{color:#748087}

.concept{
  position:relative;
  border-radius:34px;
  background:linear-gradient(135deg,rgba(255,255,255,.62),rgba(255,248,241,.48));
}
.concept-art{overflow:hidden;border-radius:30px}
.concept-art::before{
  width:520px;height:520px;
  background:radial-gradient(circle,rgba(255,122,0,.13),rgba(239,0,96,.045),transparent 70%);
}
.concept-art img{
  width:min(590px,96%);
  max-height:590px;
  object-fit:cover;
  object-position:center;
  border-radius:28px;
  filter:drop-shadow(0 28px 38px rgba(77,52,36,.15));
}
.concept-copy>p,.platform-head p,.legacy-copy>p,.venue-copy p{color:#65737a}
.concept-grid article{
  border-color:rgba(38,54,62,.10);
  background:rgba(255,255,255,.78);
  box-shadow:0 12px 30px rgba(72,51,38,.055);
}
.concept-grid p{color:#6e7a80}

.themes,.experience{position:relative}
.section-heading p{color:#69777e}
.theme-card,.experience-card{
  border-color:rgba(31,42,49,.09);
  box-shadow:0 18px 42px rgba(67,48,35,.10);
}
.theme-card p,.experience-card p{color:#e8edf0}

.platform{
  position:relative;
  border-radius:36px;
  background:
    linear-gradient(135deg,rgba(255,255,255,.76),rgba(255,244,236,.68));
}
.platform-ui{
  background:
    radial-gradient(circle at 96% 0%,rgba(239,0,96,.08),transparent 28%),
    linear-gradient(135deg,rgba(255,255,255,.98),rgba(255,248,241,.98));
  border-color:rgba(38,54,62,.12);
  box-shadow:0 30px 78px rgba(83,54,37,.12);
}
.platform-ui::after{
  border-color:rgba(239,0,96,.12);
  box-shadow:0 0 0 45px rgba(255,122,0,.025),0 0 0 90px rgba(239,0,96,.018);
}
.room-tabs button{
  border-color:rgba(38,54,62,.12);
  background:#f7f4ef;
  color:#58666d;
}
.room-tabs button:hover{background:#fff}
.room-tabs button.active{color:#fff}
.agenda-panel,.platform-features{
  background:rgba(255,255,255,.78);
  border-color:rgba(38,54,62,.10);
  color:#29363d;
  box-shadow:0 13px 34px rgba(77,52,36,.06);
}
.agenda-item{
  border-top-color:rgba(38,54,62,.09);
  color:#2a373e;
}
.agenda-item span small{color:#7d898f}
.agenda-item em{color:#879299}
.platform-features article{border-bottom-color:rgba(38,54,62,.08)}
.platform-features p{color:#718087}

.year-pills span{
  border-color:rgba(38,54,62,.14);
  color:#77848b;
  background:rgba(255,255,255,.56);
}
.year-pills .active{color:#b94d00;background:rgba(255,122,0,.09)}
.year-pills .next{color:#fff}
.legacy-media .video-cover{border-color:rgba(38,54,62,.10);box-shadow:0 22px 52px rgba(77,52,36,.11)}

.venue-list span{
  border-color:rgba(38,54,62,.13);
  background:rgba(255,255,255,.68);
}
.venue-image::before{opacity:.35}

.footer{
  border-top:1px solid rgba(38,54,62,.08);
}
.footer-brand p{color:#718087}
.footer-links a{color:#69777e}
.footer-links a:hover{color:#d50055}
.footer-bottom{
  border-top-color:rgba(38,54,62,.10);
  color:#7a878d;
}
.footer-bottom a{color:#344148}

@media (max-width:1180px){
  .mobile-menu{background:rgba(255,253,249,.985)}
}
@media (max-width:760px){
  .hero::after{width:100%;right:-35%;opacity:.07}
  .concept,.platform{border-radius:24px}
  .concept-art img{max-height:420px}
}