:root {
 --navy: #0c1d36;
 --navy-80: rgba(12, 29, 54, 0.8);
 --navy-60: rgba(12, 29, 54, 0.6);
 --navy-40: rgba(12, 29, 54, 0.4);
 --navy-10: rgba(12, 29, 54, 0.1);
 --navy-05: rgba(12, 29, 54, 0.05);
 --gold: #b08a2e;
 --gold-light: #c9a33d;
 --gold-dark: #8d6e24;
 --gold-10: rgba(176, 138, 46, 0.1);
 --gold-20: rgba(176, 138, 46, 0.2);
 --white: #ffffff;
 --off-white: #fafbfc;
 --gray-50: #f8f9fa;
 --gray-100: #f1f3f5;
 --gray-200: #e9ecef;
 --gray-300: #dee2e6;
 --gray-400: #ced4da;
 --gray-500: #adb5bd;
 --gray-600: #868e96;
 --gray-700: #495057;
 --gray-800: #343a40;
 --gray-900: #212529;
 --green: #1a7a48;
 --green-bg: rgba(26, 122, 72, 0.08);
 --red: #9b2335;
 --red-bg: rgba(155, 35, 53, 0.08);
 --blue: #1a5f96;
 --blue-bg: rgba(26, 95, 150, 0.08);
 --sans: "Source Sans 3", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
 --serif: "Crimson Pro", Georgia, "Times New Roman", serif;
 --mono: "JetBrains Mono", "Fira Code", monospace;
 --shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.05);
 --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.06), 0 1px 2px rgba(0, 0, 0, 0.04);
 --shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.07), 0 2px 4px -2px rgba(0, 0, 0, 0.05);
 --shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.08), 0 4px 6px -4px rgba(0, 0, 0, 0.04);
 --shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.08), 0 8px 10px -6px rgba(0, 0, 0, 0.04);
 --radius: 8px;
 --radius-lg: 12px;
 --radius-xl: 16px;
 --transition: 0.25s cubic-bezier(0.4, 0, 0.2, 1);
 }

 *,
 *::before,
 *::after {
 box-sizing: border-box;
 margin: 0;
 padding: 0;
 }
 html {
 scroll-behavior: smooth;
 scroll-padding-top: 80px;
 }
 body {
 font-family: var(--sans);
 color: var(--gray-800);
 line-height: 1.6;
 background: var(--white);
 -webkit-font-smoothing: antialiased;
 }

 .container {
 max-width: 1200px;
 margin: 0 auto;
 padding: 0 24px;
 }
 .section {
 padding: 100px 0;
 }
 .section-alt {
 background: var(--gray-50);
 }
 .text-center {
 text-align: center;
 }

 .section-label {
 display: inline-flex;
 align-items: center;
 gap: 8px;
 font-family: var(--mono);
 font-size: 12px;
 font-weight: 500;
 letter-spacing: 2px;
 text-transform: uppercase;
 color: var(--gold);
 margin-bottom: 16px;
 }
 .section-label::before {
 content: "";
 width: 24px;
 height: 1px;
 background: var(--gold);
 }

 .section-title {
 font-family: var(--serif);
 font-size: clamp(32px, 4vw, 48px);
 font-weight: 600;
 color: var(--navy);
 line-height: 1.2;
 margin-bottom: 16px;
 letter-spacing: -0.5px;
 }
 .section-subtitle {
 font-size: 18px;
 color: var(--gray-600);
 max-width: 640px;
 line-height: 1.7;
 }
 .section-subtitle.center {
 margin: 0 auto;
 }

 /* ─── NAVIGATION ─── */
 .nav {
 position: fixed;
 top: 0;
 left: 0;
 right: 0;
 z-index: 1000;
 padding: 0 24px;
 height: 72px;
 display: flex;
 align-items: center;
 background: rgba(255, 255, 255, 0.85);
 backdrop-filter: blur(20px) saturate(1.8);
 -webkit-backdrop-filter: blur(20px) saturate(1.8);
 border-bottom: 1px solid transparent;
 transition: var(--transition);
 }
 .nav.scrolled {
 background: rgba(255, 255, 255, 0.95);
 border-bottom-color: var(--gray-200);
 box-shadow: var(--shadow-sm);
 }
 .nav-inner {
 max-width: 1200px;
 margin: 0 auto;
 width: 100%;
 display: flex;
 align-items: center;
 justify-content: space-between;
 }
 .nav-logo {
 display: flex;
 align-items: center;
 gap: 12px;
 text-decoration: none;
 }
 .nav-logo img {
 height: 42px;
 width: auto;
 }
 .nav-logo span {
 font-family: var(--serif);
 font-size: 16px;
 font-weight: 600;
 color: var(--navy);
 }
 .nav-links {
 display: flex;
 align-items: center;
 gap: 32px;
 list-style: none;
 }
 .nav-links a {
 font-size: 14px;
 font-weight: 500;
 color: var(--gray-700);
 text-decoration: none;
 transition: color var(--transition);
 position: relative;
 }
 .nav-links a::after {
 content: "";
 position: absolute;
 bottom: -4px;
 left: 0;
 right: 0;
 height: 2px;
 background: var(--gold);
 transform: scaleX(0);
 transition: transform var(--transition);
 transform-origin: center;
 }
 .nav-links a:hover {
 color: var(--navy);
 }
 .nav-links a:hover::after {
 transform: scaleX(1);
 }
 .nav-cta {
 display: inline-flex;
 align-items: center;
 gap: 8px;
 padding: 10px 24px;
 border-radius: 6px;
 background: var(--navy);
 color: var(--white) !important;
 font-size: 14px;
 font-weight: 600;
 text-decoration: none;
 transition: all var(--transition);
 border: none;
 cursor: pointer;
 }
 .nav-cta:hover {
 background: var(--gold);
 transform: translateY(-1px);
 box-shadow: var(--shadow-md);
 }
 .nav-cta::after {
 display: none !important;
 }
 .nav-menu-btn {
 display: none;
 background: none;
 border: none;
 cursor: pointer;
 width: 40px;
 height: 40px;
 }
 .nav-menu-btn span {
 display: block;
 width: 20px;
 height: 2px;
 background: var(--navy);
 margin: 0 auto 4px;
 transition: var(--transition);
 }

 /* ─── HERO (WHITE) ─── */
 .hero {
 position: relative;
 min-height: 100vh;
 display: flex;
 align-items: center;
 background: var(--white);
 overflow: hidden;
 overflow: hidden;
 padding-top: 72px;
 }
 .hero::before {
 content: "";
 position: absolute;
 top: 0;
 right: -200px;
 width: 600px;
 height: 600px;
 border-radius: 50%;
 background: radial-gradient(circle, rgba(176, 138, 46, 0.06), transparent 70%);
 }
 .hero::after {
 content: "";
 position: absolute;
 bottom: -100px;
 left: -100px;
 width: 400px;
 height: 400px;
 border-radius: 50%;
 background: radial-gradient(circle, rgba(12, 29, 54, 0.04), transparent 70%);
 }
 /* Hero dark mode (when inline style sets dark background) */
 .hero[style*="rgba(12,29,54"] h1 { color: var(--white); }
 .hero[style*="rgba(12,29,54"] h2 { color: var(--gold); }
 .hero[style*="rgba(12,29,54"] .hero-desc { color: rgba(255,255,255,0.8); }
 .hero[style*="rgba(12,29,54"] .hero-stat-num { color: var(--gold); }
 .hero[style*="rgba(12,29,54"] .hero-stat-label { color: rgba(255,255,255,0.7); text-transform: uppercase; }
 .hero[style*="rgba(12,29,54"] .hero-badge { background: rgba(176,138,46,0.15); border-color: rgba(176,138,46,0.3); color: var(--gold); }
 .hero[style*="rgba(12,29,54"] .hero-credentials { color: rgba(255,255,255,0.7); }
 .hero[style*="rgba(12,29,54"] .btn-outline { border-color: rgba(255,255,255,0.4); color: var(--white); }
 .hero[style*="rgba(12,29,54"] .btn-outline:hover { background: rgba(255,255,255,0.1); }
 .hero[style*="rgba(12,29,54"]::before { display: none; }
 .hero[style*="rgba(12,29,54"]::after { display: none; }
 .hero-inner {
 position: relative;
 z-index: 2;
 max-width: 1200px;
 margin: 0 auto;
 padding: 60px 24px 80px;
 width: 100%;
 text-align: center;
 }
 .hero-logo-img {
 width: 160px;
 height: auto;
 margin: 0 auto 32px;
 display: block;
 background: none !important;
 }
 .hero h1 {
 font-family: var(--serif);
 font-size: clamp(36px, 5vw, 56px);
 font-weight: 700;
 color: var(--navy);
 line-height: 1.15;
 letter-spacing: -1px;
 margin-bottom: 8px;
 }
 .hero h2 {
 font-family: var(--serif);
 font-size: clamp(22px, 3vw, 32px);
 font-weight: 400;
 color: var(--gold);
 line-height: 1.3;
 margin-bottom: 24px;
 letter-spacing: -0.3px;
 }
 .hero-desc {
 font-size: 18px;
 color: var(--gray-600);
 line-height: 1.7;
 max-width: 680px;
 margin: 0 auto 36px;
 }
 .hero-badge {
 display: inline-flex;
 align-items: center;
 gap: 8px;
 padding: 6px 16px;
 border-radius: 100px;
 background: var(--gold-10);
 border: 1px solid var(--gold-20);
 font-size: 13px;
 font-weight: 600;
 color: var(--gold-dark);
 margin-bottom: 28px;
 }
 .hero-badge .dot {
 width: 6px;
 height: 6px;
 border-radius: 50%;
 background: var(--gold);
 animation: pulse 2s ease-in-out infinite;
 }
 .hero-actions {
 display: flex;
 gap: 16px;
 justify-content: center;
 flex-wrap: wrap;
 margin-bottom: 56px;
 }
 .btn-primary {
 display: inline-flex;
 align-items: center;
 gap: 8px;
 padding: 14px 32px;
 border-radius: 8px;
 background: var(--gold);
 color: var(--white);
 font-size: 15px;
 font-weight: 600;
 text-decoration: none;
 transition: all var(--transition);
 border: none;
 cursor: pointer;
 }
 .btn-primary:hover {
 background: var(--gold-dark);
 transform: translateY(-2px);
 box-shadow: 0 8px 24px rgba(176, 138, 46, 0.35);
 }
 .btn-secondary {
 display: inline-flex;
 align-items: center;
 gap: 8px;
 padding: 14px 32px;
 border-radius: 8px;
 background: var(--white);
 color: var(--navy);
 font-size: 15px;
 font-weight: 500;
 text-decoration: none;
 transition: all var(--transition);
 border: 1px solid var(--gray-300);
 cursor: pointer;
 }
 .btn-secondary:hover {
 background: var(--gray-50);
 border-color: var(--gray-400);
 }

 .hero-stats {
 display: flex;
 gap: 48px;
 justify-content: center;
 flex-wrap: wrap;
 padding: 40px 0;
 border-top: 1px solid var(--gray-200);
 }
 .hero-stat {
 text-align: center;
 }
 .hero-stat-num {
 font-family: var(--serif);
 font-size: 40px;
 font-weight: 700;
 color: var(--navy);
 line-height: 1;
 }
 .hero-stat-label {
 font-size: 13px;
 color: var(--gray-500);
 margin-top: 4px;
 letter-spacing: 0.5px;
 }

 .hero-credentials {
 display: flex;
 justify-content: center;
 gap: 16px;
 flex-wrap: wrap;
 margin-top: 32px;
 }
 .hero-cred {
 padding: 14px 20px;
 border-radius: var(--radius);
 background: var(--gray-50);
 border: 1px solid var(--gray-200);
 display: flex;
 align-items: center;
 gap: 10px;
 transition: all var(--transition);
 }
 .hero-cred:hover {
 border-color: var(--gold-20);
 background: var(--gold-10);
 transform: translateY(-2px);
 }
 .hero-cred-icon {
 font-size: 18px;
 }
 .hero-cred-text {
 font-size: 13px;
 font-weight: 600;
 color: var(--navy);
 }

 @keyframes pulse {
 0%,
 100% {
 opacity: 1;
 }
 50% {
 opacity: 0.4;
 }
 }

 /* ─── FEATURE STRIP ─── */
 .feature-strip {
 background: var(--navy);
 padding: 20px 0;
 }
 .feature-strip-inner {
 max-width: 1200px;
 margin: 0 auto;
 padding: 0 24px;
 display: flex;
 justify-content: center;
 gap: 48px;
 flex-wrap: wrap;
 }
 .feature-strip-item {
 display: flex;
 align-items: center;
 gap: 10px;
 font-size: 14px;
 color: rgba(255, 255, 255, 0.85);
 font-weight: 500;
 }

 /* ─── CARDS ─── */
 .card {
 background: var(--white);
 border: 1px solid var(--gray-200);
 border-radius: var(--radius-lg);
 padding: 32px;
 transition: all var(--transition);
 }
 .card:hover {
 border-color: var(--gray-300);
 box-shadow: var(--shadow-lg);
 transform: translateY(-4px);
 }
 .card-icon {
 width: 48px;
 height: 48px;
 border-radius: 12px;
 display: flex;
 align-items: center;
 justify-content: center;
 font-size: 24px;
 margin-bottom: 20px;
 }
 .card-title {
 font-family: var(--serif);
 font-size: 20px;
 font-weight: 600;
 color: var(--navy);
 margin-bottom: 8px;
 }
 .card-text {
 font-size: 15px;
 color: var(--gray-600);
 line-height: 1.6;
 }

 .grid-2 {
 display: grid;
 grid-template-columns: repeat(2, 1fr);
 gap: 24px;
 }
 .grid-3 {
 display: grid;
 grid-template-columns: repeat(3, 1fr);
 gap: 24px;
 }

 /* ─── PROGRAMA ─── */
 .programa-grid {
 display: grid;
 grid-template-columns: 1fr 1.2fr;
 gap: 60px;
 align-items: start;
 margin-top: 48px;
 }
 .programa-features {
 display: flex;
 flex-direction: column;
 gap: 16px;
 }
 .programa-feature {
 display: flex;
 gap: 16px;
 padding: 20px;
 border-radius: var(--radius);
 transition: background var(--transition);
 }
 .programa-feature:hover {
 background: var(--gray-50);
 }
 .programa-feature .pf-icon {
 width: 40px;
 height: 40px;
 border-radius: 10px;
 flex-shrink: 0;
 display: flex;
 align-items: center;
 justify-content: center;
 font-size: 20px;
 background: var(--gold-10);
 }
 .programa-feature .pf-title {
 font-weight: 600;
 color: var(--navy);
 margin-bottom: 4px;
 }
 .programa-feature .pf-text {
 font-size: 14px;
 color: var(--gray-600);
 }

 .programa-highlight {
 background: linear-gradient(135deg, var(--navy) 0%, #1b3050 100%);
 border-radius: var(--radius-xl);
 padding: 40px;
 color: var(--white);
 position: relative;
 overflow: hidden;
 }
 .programa-highlight::after {
 content: "";
 position: absolute;
 top: -50%;
 right: -30%;
 width: 300px;
 height: 300px;
 border-radius: 50%;
 background: radial-gradient(circle, rgba(176, 138, 46, 0.15), transparent 70%);
 }
 .programa-highlight h3 {
 font-family: var(--serif);
 font-size: 28px;
 font-weight: 600;
 margin-bottom: 24px;
 position: relative;
 z-index: 1;
 }
 .ph-stats {
 display: grid;
 grid-template-columns: 1fr 1fr;
 gap: 20px;
 position: relative;
 z-index: 1;
 }
 .ph-stat {
 background: rgba(255, 255, 255, 0.08);
 border-radius: var(--radius);
 padding: 20px;
 border: 1px solid rgba(255, 255, 255, 0.1);
 }
 .ph-stat-num {
 font-family: var(--serif);
 font-size: 32px;
 font-weight: 700;
 color: var(--gold-light);
 line-height: 1;
 }
 .ph-stat-label {
 font-size: 13px;
 color: rgba(255, 255, 255, 0.6);
 margin-top: 4px;
 }

 /* ─── DOWNLOAD BUTTONS ─── */
 .dl-btn {
 display: inline-flex;
 align-items: center;
 gap: 8px;
 padding: 10px 20px;
 border-radius: 6px;
 background: var(--gold-10);
 color: var(--gold-dark);
 font-size: 13px;
 font-weight: 600;
 text-decoration: none;
 transition: all var(--transition);
 border: 1px solid var(--gold-20);
 }
 .dl-btn:hover {
 background: var(--gold);
 color: var(--white);
 transform: translateY(-1px);
 }
 .dl-btn svg {
 width: 14px;
 height: 14px;
 }
 .dl-group {
 display: flex;
 flex-wrap: wrap;
 gap: 10px;
 margin-top: 24px;
 }

 /* ─── CURRICULUM ─── */
 .curriculum-tabs {
 display: flex;
 gap: 4px;
 margin-bottom: 32px;
 padding: 4px;
 background: var(--gray-100);
 border-radius: var(--radius);
 width: fit-content;
 }
 .cur-tab {
 padding: 10px 24px;
 border-radius: 6px;
 border: none;
 font-size: 14px;
 font-weight: 600;
 cursor: pointer;
 background: transparent;
 color: var(--gray-600);
 transition: all var(--transition);
 font-family: var(--sans);
 }
 .cur-tab.active {
 background: var(--white);
 color: var(--navy);
 box-shadow: var(--shadow-sm);
 }
 .cur-tab:hover:not(.active) {
 color: var(--navy);
 }
 .cur-panel {
 display: none;
 }
 .cur-panel.active {
 display: block;
 animation: fadeIn 0.3s ease;
 }

 .module-card {
 border: 1px solid var(--gray-200);
 border-radius: var(--radius-lg);
 margin-bottom: 16px;
 transition: all var(--transition);
 overflow: hidden;
 }
 .module-card:hover {
 border-color: var(--gold-20);
 }
 .module-header {
 display: flex;
 gap: 16px;
 padding: 20px;
 cursor: pointer;
 align-items: center;
 transition: background var(--transition);
 }
 .module-header:hover {
 background: var(--gray-50);
 }
 .module-code {
 font-family: var(--mono);
 font-size: 12px;
 font-weight: 500;
 color: var(--gold);
 background: var(--gold-10);
 padding: 4px 10px;
 border-radius: 4px;
 height: fit-content;
 white-space: nowrap;
 }
 .module-title {
 font-weight: 600;
 color: var(--navy);
 }
 .module-info {
 font-size: 13px;
 color: var(--gray-600);
 }
 .module-arrow {
 margin-left: auto;
 color: var(--gray-400);
 transition: transform var(--transition);
 font-size: 18px;
 flex-shrink: 0;
 }
 .module-card.open .module-arrow {
 transform: rotate(180deg);
 }
 .module-classes {
 max-height: 0;
 overflow: hidden;
 transition: max-height 0.4s ease;
 border-top: 0px solid var(--gray-200);
 }
 .module-card.open .module-classes {
 max-height: 2000px;
 border-top-width: 1px;
 }
 .class-item {
 display: flex;
 gap: 12px;
 padding: 10px 20px 10px 56px;
 font-size: 13px;
 color: var(--gray-700);
 border-bottom: 1px solid var(--gray-100);
 align-items: flex-start;
 }
 .class-item:last-child {
 border-bottom: none;
 }
 .class-num {
 font-family: var(--mono);
 font-size: 11px;
 color: var(--gray-500);
 min-width: 24px;
 padding-top: 2px;
 }
 .class-name {
 line-height: 1.5;
 }

 /* ─── TEAM ─── */
 .team-card {
 text-align: center;
 padding: 32px 24px;
 border-radius: var(--radius-lg);
 background: var(--white);
 border: 1px solid var(--gray-200);
 transition: all var(--transition);
 }
 .team-card:hover {
 border-color: var(--gold-20);
 box-shadow: var(--shadow-lg);
 transform: translateY(-4px);
 }
 .team-avatar {
 width: 72px;
 height: 72px;
 border-radius: 50%;
 background: linear-gradient(135deg, var(--navy), #1b3050);
 display: flex;
 align-items: center;
 justify-content: center;
 margin: 0 auto 16px;
 font-size: 24px;
 color: var(--white);
 font-family: var(--serif);
 font-weight: 600;
 }
 .team-name {
 font-weight: 600;
 color: var(--navy);
 margin-bottom: 4px;
 }
 .team-role {
 font-size: 13px;
 color: var(--gray-600);
 }
 .team-tag {
 display: inline-block;
 margin-top: 8px;
 padding: 3px 10px;
 border-radius: 100px;
 font-size: 11px;
 font-weight: 600;
 background: var(--gold-10);
 color: var(--gold-dark);
 }

 /* ─── DOCENTES (no names) ─── */
 .docentes-info {
 max-width: 800px;
 margin: 48px auto 0;
 padding: 40px;
 background: var(--gray-50);
 border: 1px solid var(--gray-200);
 border-radius: var(--radius-xl);
 text-align: center;
 }
 .docentes-info h3 {
 font-family: var(--serif);
 font-size: 24px;
 color: var(--navy);
 margin-bottom: 12px;
 }
 .docentes-info p {
 font-size: 15px;
 color: var(--gray-600);
 line-height: 1.7;
 }
 .docentes-highlights {
 display: flex;
 gap: 24px;
 justify-content: center;
 flex-wrap: wrap;
 margin-top: 24px;
 }
 .docentes-highlight {
 padding: 12px 20px;
 border-radius: var(--radius);
 background: var(--white);
 border: 1px solid var(--gray-200);
 font-size: 14px;
 color: var(--navy);
 font-weight: 500;
 }

 /* ─── OPE ─── */
 .ope-grid {
 display: grid;
 grid-template-columns: repeat(3, 1fr);
 gap: 24px;
 margin-top: 48px;
 }
 .ope-card {
 padding: 32px;
 border-radius: var(--radius-lg);
 border: 1px solid var(--gray-200);
 background: var(--white);
 transition: all var(--transition);
 position: relative;
 overflow: hidden;
 }
 .ope-card::before {
 content: "";
 position: absolute;
 top: 0;
 left: 0;
 right: 0;
 height: 3px;
 background: var(--gold);
 transform: scaleX(0);
 transition: transform var(--transition);
 transform-origin: left;
 }
 .ope-card:hover::before {
 transform: scaleX(1);
 }
 .ope-card:hover {
 box-shadow: var(--shadow-lg);
 }
 .ope-icon {
 font-size: 32px;
 margin-bottom: 16px;
 }
 .ope-title {
 font-family: var(--serif);
 font-size: 20px;
 font-weight: 600;
 color: var(--navy);
 margin-bottom: 8px;
 }
 .ope-text {
 font-size: 14px;
 color: var(--gray-600);
 line-height: 1.6;
 }

 /* ─── CALC BOX ─── */
 .calc-box {
 margin-top: 40px;
 padding: 32px;
 border-radius: var(--radius-lg);
 background: linear-gradient(135deg, var(--navy), #1b3050);
 color: var(--white);
 }
 .calc-box h3 {
 font-family: var(--serif);
 font-size: 24px;
 margin-bottom: 16px;
 }
 .calc-row {
 display: flex;
 align-items: center;
 gap: 16px;
 margin-bottom: 12px;
 }
 .calc-label {
 flex: 1;
 font-size: 14px;
 color: rgba(255, 255, 255, 0.7);
 }
 .calc-value {
 font-family: var(--mono);
 font-size: 14px;
 font-weight: 600;
 color: var(--gold-light);
 }

 /* ─── ACCREDITATION ─── */
 .accred-grid {
 display: grid;
 grid-template-columns: repeat(3, 1fr);
 gap: 24px;
 margin-top: 48px;
 }
 .accred-card {
 padding: 28px;
 border-radius: var(--radius-lg);
 border: 1px solid var(--gray-200);
 background: var(--white);
 text-align: center;
 transition: all var(--transition);
 }
 .accred-card:hover {
 box-shadow: var(--shadow-lg);
 transform: translateY(-2px);
 }
 .accred-status {
 display: inline-flex;
 align-items: center;
 gap: 6px;
 padding: 4px 12px;
 border-radius: 100px;
 font-size: 12px;
 font-weight: 600;
 margin-bottom: 16px;
 }
 .status-progress {
 background: rgba(176, 138, 46, 0.1);
 color: var(--gold-dark);
 }
 .status-planned {
 background: var(--blue-bg);
 color: var(--blue);
 }
 .accred-name {
 font-family: var(--serif);
 font-size: 20px;
 font-weight: 600;
 color: var(--navy);
 margin-bottom: 8px;
 }
 .accred-detail {
 font-size: 14px;
 color: var(--gray-600);
 }

 /* ─── PRICING ─── */
 .pricing-grid {
 display: grid;
 grid-template-columns: repeat(2, 1fr);
 gap: 32px;
 max-width: 900px;
 margin: 48px auto 0;
 }
 .price-card {
 padding: 40px;
 border-radius: var(--radius-xl);
 border: 1px solid var(--gray-200);
 background: var(--white);
 position: relative;
 transition: all var(--transition);
 }
 .price-card:hover {
 box-shadow: var(--shadow-xl);
 }
 .price-card.featured {
 border-color: var(--gold);
 background: linear-gradient(180deg, var(--white) 0%, rgba(176, 138, 46, 0.03) 100%);
 }
 .price-card.featured::before {
 content: "RECOMENDADO";
 position: absolute;
 top: -12px;
 left: 50%;
 transform: translateX(-50%);
 padding: 4px 16px;
 border-radius: 100px;
 background: var(--gold);
 color: var(--white);
 font-size: 11px;
 font-weight: 700;
 letter-spacing: 1px;
 }
 .price-plan {
 font-size: 14px;
 font-weight: 600;
 color: var(--gray-600);
 text-transform: uppercase;
 letter-spacing: 1px;
 margin-bottom: 12px;
 }
 .price-amount {
 font-family: var(--serif);
 font-size: 56px;
 font-weight: 700;
 color: var(--navy);
 line-height: 1;
 }
 .price-amount span {
 font-size: 20px;
 color: var(--gray-500);
 }
 .price-period {
 font-size: 14px;
 color: var(--gray-500);
 margin-bottom: 28px;
 }
 .price-features {
 list-style: none;
 margin-bottom: 32px;
 }
 .price-features li {
 display: flex;
 align-items: flex-start;
 gap: 10px;
 padding: 8px 0;
 font-size: 14px;
 color: var(--gray-700);
 }
 .price-features li::before {
 content: "\2713";
 color: var(--green);
 font-weight: 700;
 font-size: 14px;
 flex-shrink: 0;
 margin-top: 2px;
 }
 .price-btn {
 display: block;
 width: 100%;
 padding: 14px;
 border-radius: 8px;
 text-align: center;
 font-size: 15px;
 font-weight: 600;
 text-decoration: none;
 transition: all var(--transition);
 cursor: pointer;
 border: none;
 }
 .price-btn-primary {
 background: var(--gold);
 color: var(--white);
 }
 .price-btn-primary:hover {
 background: var(--gold-dark);
 transform: translateY(-1px);
 }
 .price-btn-secondary {
 background: var(--gray-100);
 color: var(--navy);
 }
 .price-btn-secondary:hover {
 background: var(--gray-200);
 }
 /* Featured card gets gold button regardless of btn class */
 .price-card.featured .price-btn-secondary {
 background: var(--gold);
 color: var(--white);
 }
 .price-card.featured .price-btn-secondary:hover {
 background: var(--gold-dark);
 }
 /* Non-featured card gets gray button regardless of btn class */
 .price-card:not(.featured) .price-btn-primary {
 background: var(--gray-100);
 color: var(--navy);
 }
 .price-card:not(.featured) .price-btn-primary:hover {
 background: var(--gray-200);
 }

 
 .price-card {
 cursor: pointer;
 }
 .price-card:hover {
 border-color: var(--gold);
 transform: translateY(-4px);
 box-shadow: var(--shadow-xl);
 }
 .price-card:hover .price-amount {
 color: var(--gold-dark);
 }
 .price-card:hover .price-btn-secondary {
 background: var(--gold);
 color: var(--white);
 }

 .discount-banner {
 max-width: 900px;
 margin: 24px auto 0;
 padding: 20px 28px;
 border-radius: var(--radius-lg);
 background: var(--green-bg);
 border: 1px solid rgba(26, 122, 72, 0.15);
 display: flex;
 align-items: center;
 gap: 16px;
 }
 .discount-pct {
 font-family: var(--serif);
 font-size: 28px;
 font-weight: 700;
 color: var(--green);
 white-space: nowrap;
 }
 .discount-text {
 font-size: 14px;
 color: var(--gray-700);
 }
 .discount-text strong {
 color: var(--green);
 }

 /* ─── SPONSORS INTERACTIVE ─── */
 .sponsors-showcase {
 padding: 100px 0;
 background: linear-gradient(160deg, #050d1a 0%, #0c1d36 40%, #142d50 70%, #0c1d36 100%);
 position: relative;
 overflow: hidden;
 }
 .sponsors-showcase::before {
 content: "";
 position: absolute;
 inset: 0;
 background: radial-gradient(ellipse 80% 50% at 50% 0%, rgba(176, 138, 46, 0.06), transparent 60%);
 pointer-events: none;
 }

 .sponsor-tier-header {
 display: flex;
 align-items: center;
 gap: 16px;
 margin: 48px 0 24px;
 }
 .sponsor-tier-badge {
 font-family: var(--mono);
 font-size: 11px;
 font-weight: 700;
 letter-spacing: 2px;
 padding: 6px 20px;
 border-radius: 24px;
 text-transform: uppercase;
 white-space: nowrap;
 display: inline-flex;
 align-items: center;
 gap: 6px;
 }
 .sponsor-tier-badge.platinum {
 background: linear-gradient(135deg, #e8d48b, #b08a2e);
 color: #0c1d36;
 box-shadow: 0 2px 12px rgba(176, 138, 46, 0.3);
 }
 .sponsor-tier-badge.gold {
 background: linear-gradient(135deg, #f0c850, #c9a33d);
 color: #0c1d36;
 }
 .sponsor-tier-badge.silver {
 background: linear-gradient(135deg, #d0d0d0, #a0a0a0);
 color: #1a1a1a;
 }
 .sponsor-tier-badge.partners {
 background: rgba(255, 255, 255, 0.1);
 color: rgba(255, 255, 255, 0.7);
 border: 1px solid rgba(255, 255, 255, 0.15);
 }
 .sponsor-tier-line {
 flex: 1;
 height: 1px;
 background: linear-gradient(90deg, rgba(176, 138, 46, 0.25), transparent);
 }

 .sponsor-tier-grid {
 display: flex;
 justify-content: center;
 align-items: stretch;
 gap: 24px;
 flex-wrap: wrap;
 }
 .sponsor-tier-grid--plata {
 display: grid;
 grid-template-columns: repeat(5, 1fr);
 gap: 12px;
 max-width: 900px;
 margin: 0 auto;
 }

 /* Flip card */
 .sponsor-card {
 perspective: 800px;
 cursor: pointer;
 }
 .sponsor-card-inner {
 position: relative;
 width: 100%;
 height: 100%;
 transition: transform 0.6s cubic-bezier(0.4, 0, 0.2, 1);
 transform-style: preserve-3d;
 border-radius: 16px;
 }
 .sponsor-card:hover .sponsor-card-inner,
 .sponsor-card.flipped .sponsor-card-inner {
 transform: rotateY(180deg);
 }
 .sponsor-card-front,
 .sponsor-card-back {
 position: absolute;
 inset: 0;
 backface-visibility: hidden;
 -webkit-backface-visibility: hidden;
 border-radius: 16px;
 display: flex;
 flex-direction: column;
 align-items: center;
 justify-content: center;
 padding: 20px;
 }
 .sponsor-card-front {
 background: rgba(255, 255, 255, 0.96);
 box-shadow:
 0 4px 24px rgba(0, 0, 0, 0.15),
 0 1px 3px rgba(0, 0, 0, 0.08);
 border: 1px solid rgba(255, 255, 255, 0.2);
 }
 .sponsor-card-back {
 transform: rotateY(180deg);
 color: #fff;
 text-align: center;
 }
 .sponsor-card-name {
 font-family: var(--serif);
 font-size: 16px;
 font-weight: 700;
 margin-bottom: 8px;
 }
 .sponsor-card-cat {
 font-size: 12px;
 line-height: 1.5;
 opacity: 0.85;
 margin-bottom: 12px;
 }
 .sponsor-card-link {
 font-size: 12px;
 font-weight: 600;
 padding: 6px 16px;
 border: 1px solid rgba(255, 255, 255, 0.4);
 border-radius: 20px;
 transition: all 0.3s;
 }
 .sponsor-card-link:hover {
 background: rgba(255, 255, 255, 0.2);
 }

 /* Floating particles animation */
 .sponsor-particles {
 position: absolute;
 inset: 0;
 overflow: hidden;
 pointer-events: none;
 }
 .sponsor-particles span {
 position: absolute;
 width: 4px;
 height: 4px;
 background: rgba(176, 138, 46, 0.15);
 border-radius: 50%;
 animation: floatUp 8s infinite ease-in-out;
 }
 @keyframes floatUp {
 0% {
 transform: translateY(100vh) scale(0);
 opacity: 0;
 }
 50% {
 opacity: 1;
 }
 100% {
 transform: translateY(-20vh) scale(1);
 opacity: 0;
 }
 }

 /* Scrolling ticker for partners */
 .sponsor-ticker {
 overflow: hidden;
 position: relative;
 padding: 16px 0;
 }
 .sponsor-ticker::before,
 .sponsor-ticker::after {
 content: "";
 position: absolute;
 top: 0;
 bottom: 0;
 width: 80px;
 z-index: 2;
 pointer-events: none;
 }
 .sponsor-ticker::before {
 left: 0;
 background: linear-gradient(90deg, #0c1d36, transparent);
 }
 .sponsor-ticker::after {
 right: 0;
 background: linear-gradient(270deg, #0c1d36, transparent);
 }
 .sponsor-ticker-track {
 display: flex;
 gap: 32px;
 animation: tickerScroll 20s linear infinite;
 width: max-content;
 }
 .sponsor-ticker-track:hover {
 animation-play-state: paused;
 }
 @keyframes tickerScroll {
 0% {
 transform: translateX(0);
 }
 100% {
 transform: translateX(-50%);
 }
 }
 .sponsor-ticker-item {
 flex-shrink: 0;
 background: rgba(255, 255, 255, 0.06);
 border: 1px solid rgba(255, 255, 255, 0.08);
 border-radius: 12px;
 padding: 16px 32px;
 display: flex;
 align-items: center;
 gap: 12px;
 transition: all 0.3s;
 }
 .sponsor-ticker-item:hover {
 background: rgba(255, 255, 255, 0.12);
 border-color: rgba(176, 138, 46, 0.3);
 }
 .sponsor-ticker-item img {
 height: 35px;
 width: auto;
 max-width: 120px;
 object-fit: contain;
 }
 .sponsor-ticker-item span {
 color: rgba(255, 255, 255, 0.7);
 font-size: 14px;
 font-weight: 600;
 white-space: nowrap;
 }

 /* CTA sponsor box */
 .sponsor-cta-box {
 margin-top: 56px;
 background: linear-gradient(135deg, rgba(176, 138, 46, 0.12), rgba(176, 138, 46, 0.04));
 border: 1px solid rgba(176, 138, 46, 0.2);
 border-radius: 20px;
 padding: 48px;
 text-align: center;
 position: relative;
 overflow: hidden;
 }
 .sponsor-cta-box::before {
 content: "";
 position: absolute;
 inset: 0;
 background: radial-gradient(circle at 30% 50%, rgba(176, 138, 46, 0.08), transparent 60%);
 }
 .sponsor-cta-icon {
 width: 64px;
 height: 64px;
 border-radius: 50%;
 background: linear-gradient(135deg, #b08a2e, #d4b44a);
 display: flex;
 align-items: center;
 justify-content: center;
 margin: 0 auto 20px;
 box-shadow: 0 4px 20px rgba(176, 138, 46, 0.3);
 }
 .sponsor-cta-title {
 font-family: var(--serif);
 font-size: 24px;
 color: #fff;
 font-weight: 700;
 margin-bottom: 12px;
 position: relative;
 }
 .sponsor-cta-desc {
 color: rgba(255, 255, 255, 0.6);
 font-size: 15px;
 max-width: 600px;
 margin: 0 auto 28px;
 line-height: 1.6;
 position: relative;
 }
 .sponsor-cta-buttons {
 display: flex;
 gap: 16px;
 justify-content: center;
 flex-wrap: wrap;
 position: relative;
 }
 .sponsor-cta-btn {
 display: inline-flex;
 align-items: center;
 gap: 8px;
 padding: 14px 32px;
 border-radius: 30px;
 font-weight: 600;
 font-size: 14px;
 text-decoration: none;
 transition: all 0.3s;
 }
 .sponsor-cta-btn.primary {
 background: linear-gradient(135deg, #b08a2e, #d4b44a);
 color: #0c1d36;
 box-shadow: 0 4px 16px rgba(176, 138, 46, 0.3);
 }
 .sponsor-cta-btn.primary:hover {
 transform: translateY(-2px);
 box-shadow: 0 8px 24px rgba(176, 138, 46, 0.4);
 }
 .sponsor-cta-btn.secondary {
 border: 1px solid rgba(176, 138, 46, 0.3);
 color: var(--gold-light);
 }
 .sponsor-cta-btn.secondary:hover {
 background: rgba(176, 138, 46, 0.1);
 }

 /* Stats bar */
 .sponsor-stats {
 display: flex;
 justify-content: center;
 gap: 48px;
 margin-top: 40px;
 flex-wrap: wrap;
 }
 .sponsor-stat {
 text-align: center;
 }
 .sponsor-stat-num {
 font-family: var(--mono);
 font-size: 28px;
 font-weight: 700;
 color: var(--gold-light);
 }
 .sponsor-stat-label {
 font-size: 12px;
 color: rgba(255, 255, 255, 0.5);
 margin-top: 4px;
 text-transform: uppercase;
 letter-spacing: 1px;
 }

 /* Mobile responsive */
 @media (max-width: 768px) {
 .sponsors-showcase {
 padding: 60px 0;
 }
 .sponsor-tier-grid {
 gap: 16px;
 }
 .sponsor-tier-grid--plata {
 display: grid !important;
 grid-template-columns: repeat(3, 1fr) !important;
 gap: 12px !important;
 }
 .sponsor-card {
 width: 160px !important;
 height: 130px !important;
 }
 .sponsor-tier-grid--plata .sponsor-card {
 width: auto !important;
 height: 110px !important;
 }
 .sponsor-card-name {
 font-size: 14px;
 }
 .sponsor-card-cat {
 font-size: 11px;
 }
 .sponsor-cta-box {
 padding: 32px 20px;
 }
 .sponsor-cta-title {
 font-size: 20px;
 }
 .sponsor-stats {
 gap: 24px;
 }
 .sponsor-stat-num {
 font-size: 22px;
 }
 }

 /* ─── CTA ─── */
 .cta-section {
 padding: 100px 0;
 background: var(--navy);
 text-align: center;
 position: relative;
 overflow: hidden;
 }
 .cta-section::before {
 content: "";
 position: absolute;
 inset: 0;
 background: radial-gradient(ellipse 60% 60% at 50% 50%, rgba(176, 138, 46, 0.1), transparent 70%);
 }
 .cta-inner {
 position: relative;
 z-index: 1;
 }
 .cta-inner h2 {
 font-family: var(--serif);
 font-size: clamp(32px, 4vw, 48px);
 font-weight: 700;
 color: var(--white);
 margin-bottom: 16px;
 }
 .cta-inner p {
 font-size: 18px;
 color: rgba(255, 255, 255, 0.6);
 margin-bottom: 32px;
 }

 /* ─── FOOTER ─── */
 footer {
 background: var(--gray-900);
 padding: 48px 0 32px;
 }
 .footer-inner {
 max-width: 1200px;
 margin: 0 auto;
 padding: 0 24px;
 display: flex;
 justify-content: space-between;
 align-items: flex-start;
 flex-wrap: wrap;
 gap: 32px;
 }
 .footer-brand {
 max-width: 360px;
 }
 .footer-brand-name {
 font-family: var(--serif);
 font-size: 18px;
 font-weight: 600;
 color: var(--white);
 margin-bottom: 8px;
 }
 .footer-brand-text {
 font-size: 13px;
 color: var(--gray-500);
 line-height: 1.6;
 }
 .footer-links {
 display: flex;
 gap: 48px;
 }
 .footer-col h4 {
 font-size: 13px;
 font-weight: 600;
 color: var(--gray-400);
 text-transform: uppercase;
 letter-spacing: 1px;
 margin-bottom: 12px;
 }
 .footer-col a {
 display: block;
 font-size: 14px;
 color: var(--gray-500);
 text-decoration: none;
 padding: 4px 0;
 transition: color var(--transition);
 }
 .footer-col a:hover {
 color: var(--white);
 }
 .footer-bottom {
 max-width: 1200px;
 margin: 32px auto 0;
 padding: 24px 24px 0;
 border-top: 1px solid rgba(255, 255, 255, 0.08);
 display: flex;
 justify-content: space-between;
 align-items: center;
 font-size: 13px;
 color: var(--gray-600);
 }

 /* ─── FLOATING ─── */
 .fab-contact {
 position: fixed;
 bottom: 24px;
 right: 24px;
 z-index: 900;
 width: 56px;
 height: 56px;
 border-radius: 50%;
 background: var(--gold);
 color: var(--white);
 border: none;
 display: flex;
 align-items: center;
 justify-content: center;
 font-size: 24px;
 cursor: pointer;
 box-shadow: var(--shadow-lg);
 transition: all var(--transition);
 text-decoration: none;
 }
 .fab-contact:hover {
 background: var(--gold-dark);
 transform: scale(1.1);
 }
 .back-top {
 position: fixed;
 bottom: 24px;
 right: 96px;
 z-index: 900;
 width: 44px;
 height: 44px;
 border-radius: 50%;
 background: var(--white);
 color: var(--navy);
 border: 1px solid var(--gray-300);
 display: flex;
 align-items: center;
 justify-content: center;
 font-size: 18px;
 cursor: pointer;
 box-shadow: var(--shadow-md);
 transition: all var(--transition);
 opacity: 0;
 pointer-events: none;
 }
 .back-top.show {
 opacity: 1;
 pointer-events: all;
 }
 .back-top:hover {
 background: var(--gray-100);
 }

 /* ─── ANIMATIONS ─── */
 @keyframes fadeIn {
 from {
 opacity: 0;
 transform: translateY(12px);
 }
 to {
 opacity: 1;
 transform: translateY(0);
 }
 }

 /* Without JS: everything visible by default */

 .reveal.visible {
 opacity: 1;
 transform: translateY(0);
 }
 .reveal-d1 {
 transition-delay: 0.1s;
 }
 .reveal-d2 {
 transition-delay: 0.2s;
 }
 .reveal-d3 {
 transition-delay: 0.3s;
 }
 .reveal-d4 {
 transition-delay: 0.4s;
 }

 /* ─── MOBILE NAV MENU ─── */
 .nav-links.mobile-open {
 display: flex !important;
 flex-direction: column;
 position: absolute;
 top: 72px;
 left: 0;
 right: 0;
 background: var(--white);
 padding: 16px 24px 24px;
 gap: 0;
 border-bottom: 1px solid var(--gray-200);
 box-shadow: var(--shadow-lg);
 z-index: 999;
 }
 .nav-links.mobile-open li {
 padding: 12px 0;
 border-bottom: 1px solid var(--gray-100);
 }
 .nav-links.mobile-open li:last-child {
 border-bottom: none;
 }
 .nav-links.mobile-open a {
 font-size: 16px;
 }

 /* ─── RESPONSIVE ─── */
 @media (max-width: 1100px) {
 .programa-grid {
 grid-template-columns: 1fr;
 }
 }

 /* TABLET */
 @media (max-width: 900px) {
 .section {
 padding: 64px 0;
 }
 .container {
 padding: 0 20px;
 }
 .nav-links {
 display: none;
 }

 .grid-3,
 .ope-grid,
 .accred-grid {
 grid-template-columns: 1fr;
 }
 .pricing-grid {
 grid-template-columns: 1fr;
 max-width: 480px;
 }
 .footer-inner {
 flex-direction: column;
 }
 .footer-links {
 flex-direction: column;
 gap: 24px;
 }
 .footer-bottom {
 flex-direction: column;
 gap: 12px;
 text-align: center;
 }
 .hero {
 min-height: auto;
 padding-top: 72px;
 }
 .hero-inner {
 padding: 48px 20px 60px;
 }
 .hero h1 {
 font-size: 32px;
 letter-spacing: -0.5px;
 }
 .hero h2 {
 font-size: 22px;
 }
 .hero-desc {
 font-size: 16px;
 margin-bottom: 28px;
 }
 .hero-logo-img {
 width: 110px;
 margin-bottom: 24px;
 }
 .hero-stats {
 gap: 24px;
 padding: 32px 0;
 }
 .hero-stat-num {
 font-size: 32px;
 }
 .hero-credentials {
 gap: 10px;
 }
 .hero-cred {
 padding: 10px 14px;
 }
 .hero-cred-text {
 font-size: 12px;
 }
 .section-title {
 font-size: 28px;
 }
 .section-subtitle {
 font-size: 16px;
 }
 .card {
 padding: 24px;
 }
 .card-title {
 font-size: 18px;
 }
 .team-card {
 padding: 24px 16px;
 }
 .programa-highlight {
 padding: 28px;
 }
 .programa-highlight h3 {
 font-size: 22px;
 }
 .ope-card {
 padding: 24px;
 }
 .calc-box {
 padding: 24px;
 }
 .calc-box h3 {
 font-size: 20px;
 }
 .price-card {
 padding: 28px;
 }
 .price-amount {
 font-size: 44px;
 }
 .feature-strip-inner {
 gap: 16px;
 flex-direction: column;
 align-items: center;
 }
 .feature-strip-item {
 font-size: 13px;
 }
 .dl-group {
 gap: 8px;
 }
 .dl-btn {
 font-size: 12px;
 padding: 8px 14px;
 }
 .module-header {
 padding: 16px;
 }
 .class-item {
 padding: 8px 16px 8px 44px;
 }
 .sponsor-logos {
 gap: 32px;
 }
 .docentes-info {
 padding: 28px;
 }
 .docentes-highlights {
 gap: 12px;
 }
 .docentes-highlight {
 padding: 8px 14px;
 font-size: 13px;
 }
 }

 /* MOBILE */
 @media (max-width: 600px) {
 .section {
 padding: 48px 0;
 }
 .container {
 padding: 0 16px;
 }
 .grid-2 {
 grid-template-columns: 1fr;
 }
 .ph-stats {
 grid-template-columns: 1fr;
 }
 .discount-banner {
 flex-direction: column;
 text-align: center;
 gap: 12px;
 }
 .hero-credentials {
 flex-direction: column;
 align-items: center;
 }
 .hero-inner {
 padding: 36px 16px 48px;
 }
 .hero h1 {
 font-size: 26px;
 }
 .hero h2 {
 font-size: 18px;
 margin-bottom: 16px;
 }
 .hero-desc {
 font-size: 15px;
 margin-bottom: 24px;
 }
 .hero-logo-img {
 width: 90px;
 margin-bottom: 20px;
 }
 .hero-badge {
 font-size: 11px;
 padding: 4px 12px;
 margin-bottom: 20px;
 }
 .hero-actions {
 flex-direction: column;
 align-items: center;
 }
 .btn-primary,
 .btn-secondary {
 width: auto;
 max-width: none;
 justify-content: center;
 padding: 12px 28px;
 font-size: 14px;
 display: inline-flex;
 }
 .hero-stats {
 flex-direction: column;
 gap: 16px;
 padding: 24px 0;
 }
 .hero-stat {
 display: flex;
 align-items: baseline;
 gap: 8px;
 justify-content: center;
 }
 .hero-stat-num {
 font-size: 28px;
 }
 .hero-stat-label {
 font-size: 12px;
 }
 .hero-cred {
 width: 100%;
 max-width: 280px;
 justify-content: center;
 }
 .section-label {
 font-size: 11px;
 }
 .section-title {
 font-size: 24px;
 margin-bottom: 12px;
 }
 .section-subtitle {
 font-size: 15px;
 }
 .nav {
 height: 60px;
 padding: 0 16px;
 }
 .nav-logo img {
 height: 32px;
 }
 .nav-logo span {
 font-size: 14px;
 }
 .nav-cta {
 padding: 8px 16px;
 font-size: 13px;
 }
 .nav-links.mobile-open {
 top: 60px;
 }
 .card {
 padding: 20px;
 }
 .card-icon {
 width: 40px;
 height: 40px;
 font-size: 20px;
 margin-bottom: 14px;
 }
 .card-title {
 font-size: 17px;
 }
 .card-text {
 font-size: 14px;
 }
 .team-avatar {
 width: 56px;
 height: 56px;
 font-size: 18px;
 }
 .team-name {
 font-size: 15px;
 }
 .team-role {
 font-size: 12px;
 }
 .programa-feature {
 padding: 14px;
 gap: 12px;
 }
 .programa-feature .pf-icon {
 width: 36px;
 height: 36px;
 font-size: 18px;
 }
 .programa-feature .pf-title {
 font-size: 15px;
 }
 .programa-feature .pf-text {
 font-size: 13px;
 }
 .programa-highlight {
 padding: 24px;
 }
 .programa-highlight h3 {
 font-size: 20px;
 }
 .ph-stat-num {
 font-size: 28px;
 }
 .curriculum-tabs {
 flex-direction: column;
 width: 100%;
 }
 .cur-tab {
 text-align: center;
 }
 .module-header {
 padding: 14px;
 gap: 12px;
 }
 .module-code {
 font-size: 11px;
 padding: 3px 8px;
 }
 .module-title {
 font-size: 14px;
 }
 .module-info {
 font-size: 12px;
 }
 .class-item {
 padding: 8px 14px 8px 38px;
 font-size: 12px;
 }
 .class-num {
 font-size: 10px;
 min-width: 20px;
 }
 .ope-card {
 padding: 20px;
 }
 .ope-icon {
 font-size: 28px;
 margin-bottom: 12px;
 }
 .ope-title {
 font-size: 18px;
 }
 .calc-box {
 padding: 20px;
 }
 .calc-box h3 {
 font-size: 18px;
 }
 .calc-row {
 flex-direction: column;
 gap: 4px;
 }
 .accred-card {
 padding: 20px;
 }
 .accred-name {
 font-size: 18px;
 }
 .price-card {
 padding: 24px;
 }
 .price-card.featured::before {
 font-size: 10px;
 padding: 3px 12px;
 }
 .price-amount {
 font-size: 40px;
 }
 .price-amount span {
 font-size: 16px;
 }
 .price-features li {
 font-size: 13px;
 padding: 6px 0;
 }
 .discount-pct {
 font-size: 24px;
 }
 .discount-text {
 font-size: 13px;
 }
 .sponsor-section {
 padding: 48px 0;
 }
 .sponsor-logos {
 gap: 24px;
 }
 .sponsor-logo {
 height: 30px;
 }
 .cta-section {
 padding: 64px 0;
 }
 .cta-inner h2 {
 font-size: 24px;
 }
 .cta-inner p {
 font-size: 15px;
 }
 footer {
 padding: 32px 0 24px;
 }
 .footer-brand-name {
 font-size: 16px;
 }
 .footer-brand-text {
 font-size: 12px;
 }
 .footer-col h4 {
 font-size: 12px;
 }
 .footer-col a {
 font-size: 13px;
 }
 .footer-bottom {
 font-size: 11px;
 padding-top: 16px;
 }
 .fab-contact {
 width: 48px;
 height: 48px;
 bottom: 16px;
 right: 16px;
 }
 .fab-contact svg {
 width: 20px;
 height: 20px;
 }
 .back-top {
 width: 38px;
 height: 38px;
 right: 76px;
 bottom: 16px;
 }
 .dl-group {
 flex-direction: column;
 align-items: flex-start;
 }
 .dl-btn {
 width: 100%;
 justify-content: center;
 }
 .docentes-info {
 padding: 20px;
 }
 .docentes-info h3 {
 font-size: 20px;
 }
 .docentes-info p {
 font-size: 14px;
 }
 .docentes-highlights {
 flex-direction: column;
 }
 .docentes-highlight {
 width: 100%;
 text-align: center;
 }
 }

 /* SMALL MOBILE */
 @media (max-width: 380px) {
 .hero h1 {
 font-size: 22px;
 }
 .hero h2 {
 font-size: 16px;
 }
 .hero-logo-img {
 width: 72px;
 }
 .price-amount {
 font-size: 36px;
 }
 .section-title {
 font-size: 22px;
 }
 }

 @media print {
 .nav,
 .fab-contact,
 .back-top {
 display: none;
 }
 .hero {
 min-height: auto;
 padding: 40px 0;
 }
 .section {
 padding: 40px 0;
 }
 }

 /* ═══ MODERN ENHANCEMENTS 2026 ═══ */

 /* Smooth page-wide transitions */
 ::selection {
 background: var(--gold-20);
 color: var(--navy);
 }

 /* Subtle noise texture on hero for depth */
 .hero {
 background: var(--white);
 background-image:
 radial-gradient(ellipse 80% 50% at 50% -20%, rgba(176, 138, 46, 0.05), transparent),
 radial-gradient(ellipse 60% 40% at 80% 80%, rgba(12, 29, 54, 0.03), transparent);
 }

 /* Animated gradient on feature strip */
 .feature-strip {
 background: linear-gradient(135deg, var(--navy) 0%, #162b4a 50%, #0c1d36 100%);
 background-size: 200% 200%;
 animation: gradientShift 8s ease infinite;
 }
 @keyframes gradientShift {
 0% {
 background-position: 0% 50%;
 }
 50% {
 background-position: 100% 50%;
 }
 100% {
 background-position: 0% 50%;
 }
 }

 /* Glass card effect for team cards */
 .team-card {
 backdrop-filter: blur(10px);
 -webkit-backdrop-filter: blur(10px);
 background: rgba(255, 255, 255, 0.92);
 border: 1px solid rgba(255, 255, 255, 0.6);
 box-shadow: 0 4px 30px rgba(0, 0, 0, 0.04);
 }
 .team-card:hover {
 border-color: var(--gold-20);
 box-shadow: 0 12px 40px rgba(176, 138, 46, 0.12);
 transform: translateY(-6px);
 }

 /* Improved team avatar with ring */
 .team-avatar {
 position: relative;
 background: linear-gradient(135deg, var(--navy) 0%, #243b5e 100%);
 box-shadow: 0 4px 12px rgba(12, 29, 54, 0.2);
 }
 .team-avatar::after {
 content: "";
 position: absolute;
 inset: -4px;
 border-radius: 50%;
 border: 2px solid var(--gold-20);
 transition: border-color var(--transition);
 }
 .team-card:hover .team-avatar::after {
 border-color: var(--gold);
 }

 /* Modern module cards with left accent */
 .module-card {
 border-left: 3px solid transparent;
 transition:
 all var(--transition),
 border-left-color 0.3s ease;
 }
 .module-card:hover {
 border-left-color: var(--gold);
 }
 .module-card.open {
 border-left-color: var(--gold);
 border-color: var(--gold-20);
 }
 .module-card.open .module-header {
 background: var(--gold-10);
 }

 /* Class items with subtle hover */
 .class-item {
 transition: all var(--transition);
 }
 .class-item:hover {
 background: var(--gold-10);
 padding-left: 60px;
 }

 /* Price cards — floating glow on featured */
 .price-card.featured {
 box-shadow:
 0 0 0 1px var(--gold),
 0 20px 60px rgba(176, 138, 46, 0.12);
 }
 .price-card.featured:hover {
 box-shadow:
 0 0 0 1px var(--gold),
 0 24px 80px rgba(176, 138, 46, 0.2);
 transform: translateY(-6px);
 }

 /* Discount banner animated border */
 .discount-banner {
 position: relative;
 overflow: hidden;
 }
 .discount-banner::before {
 content: "";
 position: absolute;
 left: 0;
 top: 0;
 bottom: 0;
 width: 4px;
 background: linear-gradient(180deg, var(--green), #2ea168);
 border-radius: 2px 0 0 2px;
 }

 /* Download button improvements */
 .dl-btn {
 position: relative;
 overflow: hidden;
 }
 .dl-btn::before {
 content: "";
 position: absolute;
 inset: 0;
 background: linear-gradient(135deg, var(--gold), var(--gold-dark));
 opacity: 0;
 transition: opacity var(--transition);
 }
 .dl-btn:hover::before {
 opacity: 1;
 }
 .dl-btn:hover {
 color: var(--white);
 border-color: var(--gold);
 }
 .dl-btn:hover svg {
 position: relative;
 z-index: 1;
 stroke: var(--white);
 }
 .dl-btn span,
 .dl-btn svg {
 position: relative;
 z-index: 1;
 }

 /* Accreditation cards pulse on status */
 .accred-status::before {
 content: "";
 width: 6px;
 height: 6px;
 border-radius: 50%;
 background: currentColor;
 animation: pulse 2s ease-in-out infinite;
 }

 /* Docentes specialty tags — glassmorphism */
 .docentes-highlight {
 backdrop-filter: blur(8px);
 -webkit-backdrop-filter: blur(8px);
 background: rgba(255, 255, 255, 0.85);
 border: 1px solid rgba(12, 29, 54, 0.08);
 transition: all var(--transition);
 }
 .docentes-highlight:hover {
 background: var(--gold-10);
 border-color: var(--gold-20);
 transform: translateY(-2px);
 box-shadow: 0 4px 12px rgba(176, 138, 46, 0.1);
 }

 /* Docentes info card gradient border */
 .docentes-info {
 background:
 linear-gradient(var(--gray-50), var(--gray-50)) padding-box,
 linear-gradient(135deg, var(--gray-200) 0%, var(--gold-20) 50%, var(--gray-200) 100%) border-box;
 border: 1px solid transparent;
 }

 /* Nav CTA pulse ring */
 .nav-cta {
 position: relative;
 }
 .nav-cta::before {
 content: "";
 position: absolute;
 inset: -3px;
 border-radius: 9px;
 background: linear-gradient(135deg, var(--navy), var(--gold));
 opacity: 0;
 z-index: -1;
 transition: opacity var(--transition);
 }
 .nav-cta:hover::before {
 opacity: 0.3;
 }

 /* Hero badge glow */
 .hero-badge {
 box-shadow: 0 2px 12px rgba(176, 138, 46, 0.15);
 }

 /* Hero credential cards animated entry */
 .hero-cred {
 animation: fadeIn 0.6s ease both;
 }
 .hero-cred:nth-child(1) {
 animation-delay: 0.6s;
 }
 .hero-cred:nth-child(2) {
 animation-delay: 0.75s;
 }
 .hero-cred:nth-child(3) {
 animation-delay: 0.9s;
 }
 .hero-cred:nth-child(4) {
 animation-delay: 1.05s;
 }

 /* OPE card improvements */
 .ope-card {
 position: relative;
 }
 .ope-card:hover {
 transform: translateY(-4px);
 }

 /* CTA section animated glow */
 .cta-section {
 background: linear-gradient(135deg, #0c1d36 0%, #162b4a 40%, #0c1d36 100%);
 }
 .cta-section::after {
 content: "";
 position: absolute;
 bottom: 0;
 left: 0;
 right: 0;
 height: 1px;
 background: linear-gradient(90deg, transparent, var(--gold-20), transparent);
 }

 /* Floating action button (FAB) bounce */
 .fab-contact {
 animation: fabBounce 3s ease-in-out infinite;
 }
 @keyframes fabBounce {
 0%,
 100% {
 transform: translateY(0);
 }
 50% {
 transform: translateY(-4px);
 }
 }
 .fab-contact:hover {
 animation: none;
 transform: scale(1.12) translateY(-2px);
 box-shadow: 0 8px 32px rgba(176, 138, 46, 0.4);
 }

 /* Smooth counter numbers */
 .hero-stat-num {
 transition: color var(--transition);
 }
 .hero-stat:hover .hero-stat-num {
 color: var(--gold);
 }

 /* Section dividers via pseudo-elements */
 .section + .section:not(.section-alt)::before,
 .section-alt + .section::before {
 content: "";
 display: block;
 width: 60px;
 height: 2px;
 background: linear-gradient(90deg, var(--gold-20), var(--gold), var(--gold-20));
 margin: 0 auto;
 position: relative;
 top: -1px;
 }

 /* Improved focus states for accessibility */
 a:focus-visible,
 button:focus-visible {
 outline: 2px solid var(--gold);
 outline-offset: 3px;
 border-radius: 4px;
 }

 /* Scroll progress indicator */
 .scroll-progress {
 position: fixed;
 top: 0;
 left: 0;
 height: 3px;
 z-index: 1001;
 background: linear-gradient(90deg, var(--gold), var(--gold-light));
 width: 0%;
 transition: width 0.1s linear;
 }

 /* Improved curriculum tabs */
 .curriculum-tabs {
 border: 1px solid var(--gray-200);
 background: var(--white);
 box-shadow: var(--shadow-xs);
 }
 .cur-tab.active {
 background: var(--navy);
 color: var(--white);
 box-shadow: var(--shadow-md);
 }
 .cur-tab:hover:not(.active) {
 background: var(--gray-50);
 }

 /* Programa highlight improved */
 .programa-highlight {
 background: linear-gradient(135deg, var(--navy) 0%, #1a3454 50%, #0e2240 100%);
 }

 /* Sponsor logos smooth */
 .sponsor-logo {
 transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
 }
 .sponsor-logo:hover {
 transform: scale(1.08);
 }

 /* Subheadings in organigrama */
 #organizacion h3 {
 position: relative;
 display: inline-block;
 }
 #organizacion h3::after {
 content: "";
 position: absolute;
 bottom: -4px;
 left: 50%;
 transform: translateX(-50%);
 width: 40px;
 height: 2px;
 background: var(--gold);
 }
 #organizacion .text-center + h3,
 #organizacion h3 {
 display: block;
 }

 /* Footer improved hover */
 .footer-col a {
 position: relative;
 }
 .footer-col a::before {
 content: "";
 position: absolute;
 left: -12px;
 top: 50%;
 transform: translateY(-50%);
 width: 4px;
 height: 0;
 background: var(--gold);
 transition: height var(--transition);
 border-radius: 2px;
 }
 .footer-col a:hover::before {
 height: 14px;
 }

 /* Print styles */
 @media print {
 .nav,
 .fab-contact,
 .back-top,
 .scroll-progress,
 .feature-strip {
 display: none !important;
 }
 .hero {
 min-height: auto;
 padding: 40px 0;
 }
 .section {
 padding: 30px 0;
 }

 body {
 font-size: 12pt;
 }
 }

 /* ═══ MOBILE-FIRST COMPLETE OVERHAUL ═══ */

 /* Touch & iOS/Android basics */
 html {
 -webkit-text-size-adjust: 100%;
 -webkit-tap-highlight-color: transparent;
 touch-action: manipulation;
 }

 /* Safe area for notched phones (iPhone X+, Pixel) */
 body {
 padding-left: env(safe-area-inset-left);
 padding-right: env(safe-area-inset-right);
 }

 /* Prevent horizontal scroll everywhere */
 html,
 body {
 overflow-x: hidden;
 max-width: 100%;
 }

 /* Ensure all images scale */
 img {
 max-width: 100%;
 height: auto;
 }

 /* Better tap targets (min 44px per WCAG) */
 a,
 button {
 min-height: 44px;
 }

 /* Smoother momentum scrolling on iOS */
 .module-classes,




 @keyframes slideDown {
 from {
 opacity: 0;
 transform: translateY(-10px);
 }
 to {
 opacity: 1;
 transform: translateY(0);
 }
 }

 /* ─── HERO: STATS ROW ON MOBILE ─── */
 @media (max-width: 600px) {
 /* Stats in a 2x2 grid instead of vertical stack */
 .hero-stats {
 display: grid !important;
 grid-template-columns: 1fr 1fr;
 gap: 16px;
 padding: 24px 0;
 flex-direction: unset;
 }
 .hero-stat {
 flex-direction: column;
 display: flex;
 align-items: center;
 gap: 2px;
 }
 .hero-stat-num {
 font-size: 30px;
 }
 .hero-stat-label {
 font-size: 11px;
 text-align: center;
 }

 /* Credential badges horizontal scroll */
 .hero-credentials {
 flex-direction: row !important;
 flex-wrap: nowrap;
 overflow-x: auto;
 -webkit-overflow-scrolling: touch;
 scroll-snap-type: x mandatory;
 gap: 8px;
 padding-bottom: 8px;
 align-items: stretch;
 }
 .hero-cred {
 flex-shrink: 0;
 width: auto;
 max-width: none;
 scroll-snap-align: start;
 padding: 10px 14px;
 }
 .hero-credentials::-webkit-scrollbar {
 display: none;
 }
 .hero-credentials {
 -ms-overflow-style: none;
 scrollbar-width: none;
 }
 }

 /* ─── CURRICULUM TABS: SCROLLABLE ON MOBILE ─── */
 @media (max-width: 600px) {
 .curriculum-tabs {
 flex-direction: row !important;
 overflow-x: auto;
 -webkit-overflow-scrolling: touch;
 scroll-snap-type: x mandatory;
 width: 100%;
 gap: 2px;
 padding: 4px;
 }
 .cur-tab {
 flex-shrink: 0;
 white-space: nowrap;
 scroll-snap-align: start;
 padding: 10px 16px;
 font-size: 13px;
 text-align: center;
 min-width: fit-content;
 }
 .curriculum-tabs::-webkit-scrollbar {
 display: none;
 }
 .curriculum-tabs {
 -ms-overflow-style: none;
 scrollbar-width: none;
 }
 }

 /* ─── ORGANIGRAMA MOBILE: COMPACT CARDS ─── */
 @media (max-width: 600px) {
 #organizacion h3 {
 font-size: 17px !important;
 margin: 32px 0 12px !important;
 }
 #organizacion .grid-3 {
 gap: 12px;
 }
 .team-card {
 padding: 20px 16px;
 display: flex;
 flex-direction: column;
 align-items: center;
 }
 .team-avatar {
 width: 52px;
 height: 52px;
 font-size: 17px;
 margin-bottom: 10px;
 }
 .team-name {
 font-size: 14px;
 }
 .team-role {
 font-size: 11px;
 line-height: 1.4;
 }
 .team-tag {
 font-size: 10px;
 padding: 2px 8px;
 margin-top: 6px;
 line-height: 1.3;
 }
 }

 /* ─── PRICING MOBILE: FULL WIDTH ─── */
 @media (max-width: 600px) {
 .pricing-grid {
 max-width: 100% !important;
 gap: 20px;
 }
 .price-card {
 padding: 24px 20px;
 }
 .price-btn {
 padding: 16px;
 font-size: 16px;
 min-height: 52px;
 }
 }

 /* ─── DOCENTES MOBILE: TAGS AS PILLS ─── */
 @media (max-width: 600px) {
 .docentes-highlights {
 display: grid !important;
 grid-template-columns: 1fr 1fr;
 gap: 8px;
 flex-direction: unset !important;
 }
 .docentes-highlight {
 width: auto !important;
 text-align: center;
 padding: 10px 8px;
 font-size: 12px;
 }
 .docentes-info {
 padding: 20px 16px;
 }
 .docentes-info h3 {
 font-size: 18px;
 }
 .docentes-info p {
 font-size: 13px;
 }
 }

 /* ─── DOWNLOAD BUTTONS MOBILE ─── */
 @media (max-width: 600px) {
 .dl-btn {
 padding: 12px 16px;
 font-size: 13px;
 min-height: 44px;
 }
 }

 /* ─── FAB + BACK-TOP: SAFE AREA ─── */
 @media (max-width: 600px) {
 .fab-contact {
 bottom: calc(16px + env(safe-area-inset-bottom, 0px));
 right: 16px;
 width: 52px;
 height: 52px;
 }
 .back-top {
 bottom: calc(16px + env(safe-area-inset-bottom, 0px));
 right: 80px;
 width: 40px;
 height: 40px;
 }
 }

 /* ─── FOOTER MOBILE ─── */
 @media (max-width: 600px) {
 .footer-inner {
 padding: 0 16px;
 }
 .footer-links {
 width: 100%;
 }
 .footer-col {
 width: 100%;
 }
 .footer-col a {
 min-height: 40px;
 display: flex;
 align-items: center;
 }
 .footer-bottom {
 padding: 16px 16px calc(16px + env(safe-area-inset-bottom, 0px));
 }
 }

 /* ─── FEATURE STRIP MOBILE ─── */
 @media (max-width: 600px) {
 .feature-strip {
 padding: 12px 0;
 }
 .feature-strip-inner {
 gap: 8px;
 padding: 0 16px;
 }
 .feature-strip-item {
 font-size: 12px;
 gap: 6px;
 }
 }

 /* ─── OPE SECTION MOBILE ─── */
 @media (max-width: 600px) {
 .ope-card {
 padding: 20px;
 }
 .ope-title {
 font-size: 17px;
 }
 .ope-text {
 font-size: 13px;
 }
 .calc-row {
 gap: 2px;
 }
 .calc-label {
 font-size: 13px;
 }
 .calc-value {
 font-size: 13px;
 }
 }

 /* ─── ACCREDITATION MOBILE ─── */
 @media (max-width: 600px) {
 .accred-card {
 padding: 20px 16px;
 }
 .accred-name {
 font-size: 17px;
 }
 .accred-detail {
 font-size: 13px;
 }
 }

 /* ─── CTA SECTION MOBILE ─── */
 @media (max-width: 600px) {
 .cta-section {
 padding: 48px 0;
 }
 .cta-inner h2 {
 font-size: 22px;
 }
 .cta-inner p {
 font-size: 14px;
 margin-bottom: 24px;
 }
 .cta-inner .btn-primary {
 width: auto;
 max-width: none;
 justify-content: center;
 padding: 12px 28px;
 }
 }

 /* ─── MODULE CLASSES: EXPANDABLE ON TOUCH ─── */
 @media (max-width: 600px) {
 .module-header {
 min-height: 56px;
 padding: 12px;
 }
 .module-arrow {
 font-size: 14px;
 }
 .class-item {
 padding: 10px 12px 10px 36px;
 font-size: 13px;
 }
 .class-num {
 min-width: 18px;
 font-size: 10px;
 }
 }

 /* ─── SCROLL PROGRESS: THICKER ON MOBILE ─── */
 @media (max-width: 600px) {
 .scroll-progress {
 height: 3px;
 }
 }

 /* ─── LANDSCAPE MOBILE ─── */
 @media (max-height: 500px) and (orientation: landscape) {
 .hero {
 min-height: auto;
 padding-top: 60px;
 }
 .hero-inner {
 padding: 20px 16px 30px;
 }
 .hero-logo-img {
 width: 60px !important;
 margin-bottom: 12px;
 }
 .hero h1 {
 font-size: 24px;
 }
 .hero h2 {
 font-size: 16px;
 }
 .hero-desc {
 font-size: 14px;
 margin-bottom: 16px;
 }
 .hero-stats {
 padding: 16px 0;
 }
 .hero-credentials {
 display: none;
 }
 .section {
 padding: 32px 0;
 }
 }

 /* ─── iPAD MINI / TABLET PORTRAIT ─── */
 @media (min-width: 768px) and (max-width: 900px) {
 .grid-3 {
 grid-template-columns: repeat(2, 1fr);
 }
 .pricing-grid {
 grid-template-columns: repeat(2, 1fr);
 max-width: 100%;
 }
 .ope-grid {
 grid-template-columns: repeat(2, 1fr);
 }
 .accred-grid {
 grid-template-columns: repeat(2, 1fr);
 }
 .hero h1 {
 font-size: 36px;
 }
 .hero h2 {
 font-size: 24px;
 }
 }

 /* ─── ULTRA-WIDE SAFETY ─── */
 @media (min-width: 1600px) {
 .container {
 max-width: 1280px;
 }
 }

 /* ─── REDUCE MOTION for accessibility ─── */
 @media (prefers-reduced-motion: reduce) {
 *,
 *::before,
 *::after {
 animation-duration: 0.01ms !important;
 animation-iteration-count: 1 !important;
 transition-duration: 0.01ms !important;
 }

 html {
 scroll-behavior: auto;
 }
 }

 /* ─── DARK MODE HINT (respects OS preference) ─── */
 @media (prefers-color-scheme: dark) {
 /* Future: dark mode variables can be added here */
 }

 /* ═══ REAL MOBILE BROWSER FIXES ═══ */

 /* iOS Safari: prevent zoom on double-tap for buttons */
 button,
 a,
 input,
 select,
 textarea {
 touch-action: manipulation;
 }

 /* iOS Safari: fix 100vh issue (address bar) */
 .hero {
 min-height: 100vh;
 min-height: -webkit-fill-available;
 min-height: 100dvh;
 }

 /* iOS Safari: fix position:fixed on scroll */
 .nav {
 -webkit-transform: translateZ(0);
 transform: translateZ(0);
 }

 /* iOS Safari: prevent rubber-band scroll showing bg */
 html {
 background: var(--white);
 }

 /* Android Chrome: fix tap delay */
 a,
 button {
 touch-action: manipulation;
 }

 /* Fix for reveal not showing on slow mobile connections */

 /* Ensure no horizontal overflow on ANY element */
 /* max-width ahora se maneja en el bloque de mobile fixes al final */
 .container,
 .hero-inner,
 section {
 overflow-x: hidden;
 }
 /* .nav-inner removed from overflow-x:hidden to allow dropdown menus to appear */

 /* Fix: images in base64 that might be too wide */
 img,
 svg {
 max-width: 100%;
 }

 /* Hero: use dvh for modern mobile browsers */
 @supports (height: 100dvh) {
 .hero {
 min-height: 100dvh;
 }
 }

 /* iOS: safe area padding on nav */
 @supports (padding-top: env(safe-area-inset-top)) {
 .nav {
 padding-top: env(safe-area-inset-top);
 height: calc(72px + env(safe-area-inset-top));
 }
 .hero {
 padding-top: calc(72px + env(safe-area-inset-top));
 }
 @media (max-width: 600px) {
 .nav {
 height: calc(60px + env(safe-area-inset-top));
 }
 .hero {
 padding-top: calc(60px + env(safe-area-inset-top));
 }
 .nav-links.mobile-open {
 top: calc(60px + env(safe-area-inset-top));
 }
 }
 }

 /* Hamburger button: visible and tappable */
 .nav-menu-btn {
 -webkit-appearance: none;
 appearance: none;
 background: none;
 border: none;
 cursor: pointer;
 padding: 8px;
 min-width: 44px;
 min-height: 44px;
 display: none;
 align-items: center;
 justify-content: center;
 z-index: 1001;
 }


 /* Mobile open menu: solid background, no transparency issues */
 .nav-links.mobile-open {
 background: var(--white) !important;
 -webkit-backdrop-filter: none;
 backdrop-filter: none;
 }

 /* ============ EXPANDABLE CARDS ============ */
 .expandable-card {
 border-radius: var(--radius-lg);
 overflow: hidden;
 box-shadow: var(--shadow-sm);
 transition: box-shadow var(--transition);
 }
 .expandable-card:hover {
 box-shadow: var(--shadow-md);
 }
 .card-header {
 transition: background-color var(--transition);
 }
 .expandable-card:hover .card-header {
 background-color: rgba(176, 138, 46, 0.15) !important;
 }
 .card-header .expand-chevron {
 transition: transform var(--transition);
 }
 .expandable-card.expanded .card-header .expand-chevron {
 transform: rotate(180deg);
 }
 .card-content {
 overflow: hidden;
 }
 @keyframes slideDown {
 from {
 opacity: 0;
 max-height: 0;
 }
 to {
 opacity: 1;
 max-height: 2000px;
 }
 }

 /* ============ MOBILE NAVIGATION ============ */
 .mobile-menu-toggle {
 display: none;
 flex-direction: column;
 cursor: pointer;
 background: none;
 border: none;
 padding: 8px;
 gap: 5px;
 }
 .mobile-menu-toggle span {
 width: 24px;
 height: 2px;
 background: var(--navy);
 border-radius: 2px;
 transition: all 0.3s ease;
 }
 .mobile-menu-toggle.active span:nth-child(1) {
 transform: rotate(45deg) translate(7px, 7px);
 }
 .mobile-menu-toggle.active span:nth-child(2) {
 opacity: 0;
 }
 .mobile-menu-toggle.active span:nth-child(3) {
 transform: rotate(-45deg) translate(7px, -7px);
 }

 .mobile-menu-overlay {
 display: none;
 position: fixed;
 top: 0;
 left: 0;
 right: 0;
 bottom: 0;
 background: rgba(12, 29, 54, 0.5);
 z-index: 99;
 }
 .mobile-menu-overlay.active {
 display: block;
 }

 .mobile-menu-panel {
 display: none;
 position: fixed;
 top: 0;
 right: 0;
 width: 80%;
 max-width: 320px;
 height: 100vh;
 background: var(--white);
 box-shadow: var(--shadow-lg);
 z-index: 100;
 overflow-y: auto;
 transform: translateX(100%);
 transition: transform 0.3s ease;
 }
 .mobile-menu-panel.active {
 display: block;
 transform: translateX(0);
 }

 .mobile-menu-panel .menu-link {
 display: block;
 padding: 16px 20px;
 color: var(--navy);
 text-decoration: none;
 border-bottom: 1px solid var(--gray-100);
 transition: background-color var(--transition);
 }
 .mobile-menu-panel .menu-link:hover {
 background-color: var(--gold-10);
 }

 .mobile-menu-panel .menu-cta {
 display: block;
 margin: 20px;
 padding: 12px 20px;
 background: var(--gold);
 color: var(--white);
 text-align: center;
 border-radius: var(--radius);
 text-decoration: none;
 font-weight: 600;
 transition: background-color var(--transition);
 }
 .mobile-menu-panel .menu-cta:hover {
 background-color: var(--gold-dark);
 }

 @media (max-width: 768px) {
 .mobile-menu-toggle {
 display: flex;
 min-width: 44px;
 min-height: 44px;
 align-items: center;
 justify-content: center;
 }
 .header-cta {
 display: none;
 }
 }

 /* ============ MOBILE ACCORDION ============ */
 .accordion-group {
 display: flex;
 flex-direction: column;
 gap: 12px;
 }
 .accordion-item {
 border: 1px solid var(--gold-20);
 border-radius: var(--radius);
 overflow: hidden;
 }
 .accordion-header {
 padding: 16px;
 background: var(--gold-10);
 cursor: pointer;
 display: flex;
 justify-content: space-between;
 align-items: center;
 font-weight: 600;
 color: var(--navy);
 transition: background-color var(--transition);
 min-height: 44px;
 }
 .accordion-header:hover {
 background-color: rgba(176, 138, 46, 0.15);
 }
 .accordion-header .chevron {
 width: 20px;
 height: 20px;
 transition: transform var(--transition);
 }
 .accordion-item.active .accordion-header .chevron {
 transform: rotate(180deg);
 }
 .accordion-content {
 display: none;
 padding: 16px;
 border-top: 1px solid var(--gold-20);
 background: var(--white);
 }
 .accordion-item.active .accordion-content {
 display: block;
 }

 @media (max-width: 768px) {
 .section {
 padding: 60px 0;
 }
 .hero-section {
 padding: 40px 0 !important;
 }
 }

 /* ─── ACCORDION ORGANIGRAMA ─── */
 .org-accordion {
 margin: 12px 0;
 border-radius: 12px;
 overflow: hidden;
 border: 1px solid var(--gray-200);
 background: #fff;
 box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
 }
 .org-accordion-header {
 display: flex;
 align-items: center;
 justify-content: space-between;
 padding: 18px 24px;
 cursor: pointer;
 transition: background 0.2s;
 user-select: none;
 }
 .org-accordion-header:hover {
 background: var(--gray-50);
 }
 .org-accordion-header h4 {
 font-family: var(--serif);
 font-size: 17px;
 color: var(--navy);
 margin: 0;
 font-weight: 700;
 }
 .org-accordion-header .acc-count {
 font-size: 12px;
 color: var(--gray-500);
 margin-left: 8px;
 }
 .org-accordion-chevron {
 width: 20px;
 height: 20px;
 transition: transform 0.3s;
 flex-shrink: 0;
 }
 .org-accordion.open .org-accordion-chevron {
 transform: rotate(180deg);
 }
 .org-accordion-body {
 max-height: 0;
 overflow: hidden;
 transition: max-height 0.4s ease-out;
 }
 .org-accordion.open .org-accordion-body {
 max-height: 2000px;
 }
 .org-accordion-content {
 padding: 0 24px 20px;
 display: flex;
 gap: 24px;
 flex-wrap: wrap;
 }
 .org-accordion-content.list-style {
 flex-direction: column;
 gap: 0;
 }

 /* Formal organs (7-9) distinct style */
 .org-formal {
 background: linear-gradient(135deg, #f8f6f0, #fff);
 border: 1px solid var(--gold-20);
 }
 .org-formal .org-accordion-header {
 border-left: 4px solid var(--gold);
 }
 .org-formal .org-accordion-header h4 {
 color: var(--navy);
 }
 .org-formal-badge {
 font-size: 10px;
 font-weight: 700;
 color: var(--gold);
 background: var(--gold-10);
 padding: 2px 10px;
 border-radius: 10px;
 text-transform: uppercase;
 letter-spacing: 1px;
 margin-left: 8px;
 }
 .org-formal-functions {
 margin-top: 12px;
 padding: 12px 16px;
 background: rgba(176, 138, 46, 0.05);
 border-radius: 8px;
 border-left: 3px solid var(--gold-20);
 font-size: 12px;
 color: var(--gray-600);
 line-height: 1.6;
 }

 @media (max-width: 768px) {
 .org-accordion-content {
 padding: 0 16px 16px;
 }
 .org-accordion-header {
 padding: 14px 16px;
 }
 .org-accordion-header h4 {
 font-size: 15px;
 }
 }

 /* ========== PREMIUM ENHANCEMENTS ========== */

 /* Smooth scroll */
 html {
 scroll-behavior: smooth;
 }

 /* Better font rendering */
 body {
 -webkit-font-smoothing: antialiased;
 -moz-osx-font-smoothing: grayscale;
 text-rendering: optimizeLegibility;
 }

 /* Premium button hover */
 .btn-primary,
 .btn-outline {
 position: relative;
 overflow: hidden;
 transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
 }
 .btn-primary::after,
 .btn-outline::after {
 content: "";
 position: absolute;
 inset: 0;
 background: linear-gradient(120deg, transparent, rgba(255, 255, 255, 0.15), transparent);
 transform: translateX(-100%);
 transition: transform 0.6s ease;
 }
 .btn-primary:hover::after,
 .btn-outline:hover::after {
 transform: translateX(100%);
 }
 .btn-primary:hover {
 transform: translateY(-2px);
 box-shadow: 0 8px 25px rgba(176, 138, 46, 0.35);
 }

 /* Premium card hovers */
 .feature-card:hover,
 .audience-card:hover,
 .accred-card:hover {
 transform: translateY(-6px);
 box-shadow:
 0 20px 40px rgba(0, 0, 0, 0.08),
 0 1px 3px rgba(0, 0, 0, 0.04);
 }
 .feature-card,
 .audience-card,
 .accred-card {
 transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
 }

 /* Refined section spacing */
 .section {
 padding: 100px 0;
 }

 /* Premium section label */
 .section-label {
 letter-spacing: 3px;
 font-size: 11px;
 text-transform: uppercase;
 opacity: 0.6;
 }

 /* Better separator lines */
 .section-label::before,
 .section-label::after {
 content: "";
 display: inline-block;
 width: 40px;
 height: 1px;
 background: currentColor;
 vertical-align: middle;
 margin: 0 12px;
 opacity: 0.3;
 }

 /* Refined accordion styles */
 .org-accordion {
 transition: all 0.3s ease;
 border: 1px solid rgba(0, 0, 0, 0.06);
 }
 .org-accordion:hover {
 border-color: rgba(0, 0, 0, 0.12);
 box-shadow: 0 4px 12px rgba(0, 0, 0, 0.04);
 }

 /* Premium pricing card glow */
 .price-card {
 transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
 }
 .price-card:hover {
 transform: translateY(-8px);
 box-shadow:
 0 25px 50px rgba(0, 0, 0, 0.1),
 0 0 0 1px rgba(176, 138, 46, 0.1);
 }

 /* Sponsor card premium shadow */
 .sponsor-card-front {
 transition: box-shadow 0.3s ease;
 }
 .sponsor-card:hover .sponsor-card-front {
 box-shadow:
 0 8px 30px rgba(0, 0, 0, 0.18),
 0 2px 6px rgba(0, 0, 0, 0.1);
 }

 /* Navbar glass effect enhancement */
 .navbar {
 transition: all 0.3s ease;
 backdrop-filter: blur(12px);
 -webkit-backdrop-filter: blur(12px);
 }

 /* Selection color matching brand */
 ::selection {
 background: rgba(176, 138, 46, 0.2);
 color: inherit;
 }

 /* Focus visible for accessibility */
 :focus-visible {
 outline: 2px solid var(--gold);
 outline-offset: 3px;
 border-radius: 4px;
 }

 /* Smooth link underlines */
 a {
 text-decoration-skip-ink: auto;
 }

 /* CTA section premium gradient */
 .cta-section {
 position: relative;
 }
 .cta-section::before {
 content: "";
 position: absolute;
 inset: 0;
 background: radial-gradient(ellipse 60% 50% at 50% 50%, rgba(176, 138, 46, 0.08), transparent);
 pointer-events: none;
 }

 /* Curriculum accordion refined */
 .curriculum-module {
 transition: all 0.3s ease;
 }
 .curriculum-module:hover {
 background: rgba(176, 138, 46, 0.02);
 }

 /* Footer refined */
 footer {
 border-top: 1px solid rgba(255, 255, 255, 0.05);
 }

 /* Print styles */
 @media print {
 .navbar,
 .scroll-progress,
 .cta-section {
 display: none !important;
 }
 .section {
 page-break-inside: avoid;
 }
 body {
 font-size: 12pt;
 }
 }

 /* Reduced motion preference */
 @media (prefers-reduced-motion: reduce) {
 *,
 *::before,
 *::after {
 animation-duration: 0.01ms !important;
 animation-iteration-count: 1 !important;
 transition-duration: 0.01ms !important;
 }
 }

 .skip-link:focus {
 top: 0;
 }
 
 /* ─── MEMBER CARDS (v11 additions - square cards) ─── */
 .member-cards-grid .member-card {
 display: flex;
 flex-direction: column;
 align-items: center;
 text-align: center;
 gap: 6px;
 background: var(--gray-50);
 border: 1px solid var(--gray-100);
 border-radius: 8px;
 padding: 12px 8px;
 width: 110px;
 min-height: 110px;
 transition: transform 0.2s, box-shadow 0.2s;
 }
 .member-cards-grid .member-card:hover {
 transform: translateY(-2px);
 box-shadow: 0 4px 12px rgba(0,0,0,0.08);
 }
 .member-avatar {
 width: 40px;
 height: 40px;
 border-radius: 50%;
 background: var(--navy);
 color: var(--white);
 display: flex;
 align-items: center;
 justify-content: center;
 font-weight: 700;
 font-size: 0.8rem;
 flex-shrink: 0;
 }
 .member-name {
 font-size: 0.72rem;
 font-weight: 600;
 color: var(--navy);
 line-height: 1.2;
 word-break: break-word;
 }
 .member-role {
 font-size: 0.65rem;
 color: var(--gray-400);
 line-height: 1.1;
 }
 .member-pending {
 font-size: 0.65rem;
 color: var(--gold);
 font-style: italic;
 }
 .member-section-label {
 width: 100%;
 font-size: 0.8rem;
 font-weight: 600;
 color: var(--gray-400);
 text-transform: uppercase;
 letter-spacing: 0.5px;
 padding: 8px 20px 0;
 margin: 0;
 }
 /* Make accordion content display as flex grid for member cards */
 .org-accordion-content.member-cards-grid {
 display: flex;
 flex-wrap: wrap;
 gap: 10px;
 justify-content: flex-start;
 }

 /* Organos Formales differentiation */
 .organos-formales-section {
 background: linear-gradient(135deg, rgba(176,138,46,0.04), rgba(176,138,46,0.02));
 border-radius: 16px;
 padding: 32px 24px;
 margin-top: 40px;
 }
 .organos-formales-section .section-label {
 color: var(--gold-dark);
 }
 .org-formal .member-avatar {
 background: var(--gold);
 }

 @media (max-width: 768px) {
 .member-cards-grid .member-card {
 width: 95px;
 min-height: 95px;
 padding: 10px 6px;
 }
 .organos-formales-section {
 padding: 20px 12px;
 }
 }

 
 /* CSS-ONLY INTERACTIVE ELEMENTS (iOS Safari compatible) */

 /* (Checkbox hack removed — menu now uses JS classList + .active) */

 /* Mobile Menu Sections - Details/Summary */
 .mm-section summary {
 list-style: none;
 cursor: pointer;
 user-select: none;
 }

 .mm-section summary::-webkit-details-marker {
 display: none;
 }

 .mm-section[open] .mm-chevron {
 transform: rotate(180deg);
 }

 .mm-chevron {
 transition: transform 0.3s ease;
 }

 /* Curriculum Tabs - Radio Button Hack */
 .cur-radio {
 display: none;
 }

 .cur-panel {
 display: none !important;
 }

 #year1:checked ~ .cur-panel[data-panel="1"] {
 display: block !important;
 }

 #year2:checked ~ .cur-panel[data-panel="2"] {
 display: block !important;
 }

 #year3:checked ~ .cur-panel[data-panel="3"] {
 display: block !important;
 }

 /* CSS-only active tab highlighting */
 #year1:checked ~ .curriculum-tabs label[for="year1"],
 #year2:checked ~ .curriculum-tabs label[for="year2"],
 #year3:checked ~ .curriculum-tabs label[for="year3"] {
 background: #b08a2e !important;
 color: #fff !important;
 border-color: #b08a2e !important;
 }

/* ═══ AOS FALLBACK ═══ */
/* Fallback: if AOS.js fails to load, make everything visible after 2s */
 @keyframes aosRevealFallback { to { opacity: 1; transform: none; } }
 [data-aos] { animation: aosRevealFallback 0s 2s forwards; }
 

 /* ═══════════════════════════════════════════════════ */
 /* [MOBILE OVERRIDES MOVED TO END] */

/* ═══ MOBILE FIX ═══ */
/* ===== MOBILE RESPONSIVE FIX ===== */

/* Force no horizontal scroll */
html, body {
 overflow-x: hidden !important;
 -webkit-overflow-scrolling: touch;
}

/* ===== BANNER CLOSE BUTTON ===== */
#construction-banner #closeBannerBtn {
 -webkit-tap-highlight-color: transparent !important;
 touch-action: manipulation !important;
 cursor: pointer !important;
 z-index: 10001 !important;
 pointer-events: auto !important;
 min-width: 44px !important;
 min-height: 44px !important;
}

/* ===== BANNER MOBILE ===== */
@media screen and (max-width: 600px) {
 #construction-banner {
 padding: 8px 10px !important;
 font-size: 11px !important;
 gap: 6px !important;
 }
 #construction-banner span:first-of-type {
 font-size: 14px !important;
 }
 #construction-banner span:nth-of-type(2) {
 font-size: 11px !important;
 line-height: 1.3 !important;
 }
 #construction-banner #closeBannerBtn {
 padding: 4px 10px !important;
 font-size: 14px !important;
 min-width: 36px !important;
 min-height: 36px !important;
 }
}

/* ===== MOBILE NAV (<=900px) ===== */
@media screen and (max-width: 900px) {
 /* Hide desktop nav links */
 html body nav.nav .nav-inner .nav-links,
 .nav-links {
 display: none !important;
 visibility: hidden !important;
 }
 
 /* Hide desktop CTA buttons */
 html body nav.nav .nav-inner .nav-cta,
 .nav-cta {
 display: none !important;
 visibility: hidden !important;
 }
 
 /* Show hamburger */
 html body nav.nav .nav-inner .nav-menu-btn,
 .nav-menu-btn {
 display: flex !important;
 visibility: visible !important;
 opacity: 1 !important;
 flex-direction: column !important;
 justify-content: center !important;
 align-items: center !important;
 gap: 5px !important;
 background: transparent !important;
 border: none !important;
 cursor: pointer !important;
 padding: 8px !important;
 z-index: 10003 !important;
 -webkit-tap-highlight-color: transparent !important;
 touch-action: manipulation !important;
 position: relative !important;
 width: 40px !important;
 height: 40px !important;
 pointer-events: auto !important;
 }
 
 html body nav.nav .nav-inner .nav-menu-btn span,
 .nav-menu-btn span {
 display: block !important;
 width: 22px !important;
 height: 2px !important;
 background: #0c1b3a !important;
 border-radius: 2px !important;
 transition: all 0.3s ease !important;
 margin: 0 !important;
 }
 
 /* Hamburger → X animation */
 .nav-menu-btn.active span:nth-child(1) {
 transform: rotate(45deg) translate(5px, 5px) !important;
 }
 .nav-menu-btn.active span:nth-child(2) {
 opacity: 0 !important;
 }
 .nav-menu-btn.active span:nth-child(3) {
 transform: rotate(-45deg) translate(5px, -5px) !important;
 }
}

/* ===== MOBILE OVERLAY & PANEL ===== */
#mobileOverlay {
 position: fixed !important;
 top: 0 !important; left: 0 !important; right: 0 !important; bottom: 0 !important;
 background: rgba(0,0,0,0.5) !important;
 z-index: 10001 !important;
 opacity: 0 !important;
 visibility: hidden !important;
 transition: opacity 0.3s ease, visibility 0.3s ease !important;
 pointer-events: none !important;
}
#mobileOverlay.active {
 opacity: 1 !important;
 visibility: visible !important;
 pointer-events: auto !important;
}

#mobilePanel {
 position: fixed !important;
 top: 0 !important; right: 0 !important; bottom: 0 !important;
 width: 300px !important;
 max-width: 85vw !important;
 background: #fff !important;
 z-index: 10002 !important;
 transform: translateX(100%) !important;
 transition: transform 0.3s ease !important;
 display: flex !important;
 flex-direction: column !important;
 box-shadow: -4px 0 20px rgba(0,0,0,0.15) !important;
 overflow-y: auto !important;
 -webkit-overflow-scrolling: touch !important;
}
#mobilePanel.active {
 transform: translateX(0) !important;
}

/* Panel internals */
#mobilePanel .mm-header {
 display: flex !important;
 justify-content: space-between !important;
 align-items: center !important;
 padding: 16px 20px !important;
 border-bottom: 1px solid #eee !important;
 flex-shrink: 0 !important;
}
#mobilePanel .mm-title {
 font-weight: 700 !important; font-size: 18px !important; color: #0c1b3a !important;
}
#mobilePanel .mm-close {
 background: none !important; border: none !important; font-size: 24px !important;
 cursor: pointer !important; padding: 8px !important; color: #666 !important;
 -webkit-tap-highlight-color: transparent !important;
 touch-action: manipulation !important;
 min-width: 44px !important; min-height: 44px !important;
 display: flex !important; align-items: center !important; justify-content: center !important;
 pointer-events: auto !important;
}

#mobilePanel .mm-body {
 flex: 1 !important;
 overflow-y: auto !important;
 -webkit-overflow-scrolling: touch !important;
}

#mobilePanel .mm-section-header {
 display: flex !important;
 justify-content: space-between !important;
 align-items: center !important;
 padding: 14px 20px !important;
 cursor: pointer !important;
 border-bottom: 1px solid #f0f0f0 !important;
 font-weight: 600 !important;
 font-size: 15px !important;
 color: #0c1b3a !important;
 -webkit-tap-highlight-color: transparent !important;
 touch-action: manipulation !important;
 min-height: 48px !important;
 pointer-events: auto !important;
 user-select: none !important;
 -webkit-user-select: none !important;
}
#mobilePanel .mm-section-header:active {
 background: #f5f5f5 !important;
}

#mobilePanel .mm-chevron {
 width: 16px !important; height: 16px !important;
 transition: transform 0.3s ease !important;
 flex-shrink: 0 !important;
}
#mobilePanel .mm-section.open .mm-chevron {
 transform: rotate(180deg) !important;
}

#mobilePanel .mm-sub {
 max-height: 0 !important;
 overflow: hidden !important;
 transition: max-height 0.35s ease !important;
 background: #f9f9f9 !important;
}
#mobilePanel .mm-section.open .mm-sub {
 max-height: 600px !important;
}

#mobilePanel .mm-link {
 display: block !important;
 padding: 10px 20px 10px 40px !important;
 color: #444 !important;
 text-decoration: none !important;
 font-size: 14px !important;
 border-bottom: 1px solid #eee !important;
 -webkit-tap-highlight-color: transparent !important;
 touch-action: manipulation !important;
 min-height: 44px !important;
 line-height: 24px !important;
 pointer-events: auto !important;
}
#mobilePanel .mm-link:active { background: #eee !important; }

#mobilePanel .mm-footer {
 padding: 16px 20px !important;
 border-top: 1px solid #eee !important;
 display: flex !important;
 flex-direction: column !important;
 gap: 10px !important;
 flex-shrink: 0 !important;
}
#mobilePanel .mm-cta {
 display: block !important;
 text-align: center !important;
 padding: 12px 16px !important;
 border-radius: 8px !important;
 text-decoration: none !important;
 font-weight: 600 !important;
 font-size: 14px !important;
}
#mobilePanel .mm-cta-navy { background: #0c1b3a !important; color: #fff !important; }
#mobilePanel .mm-cta-gold { background: #b08a2e !important; color: #fff !important; }

/* ===== ORG ACCORDION - clickable ===== */
.org-accordion-header {
 cursor: pointer !important;
 -webkit-tap-highlight-color: transparent !important;
 touch-action: manipulation !important;
 pointer-events: auto !important;
 user-select: none !important;
 -webkit-user-select: none !important;
}

/* ===== CURRICULUM TABS ===== */
.cur-tab {
 cursor: pointer !important;
 -webkit-tap-highlight-color: transparent !important;
 touch-action: manipulation !important;
 pointer-events: auto !important;
}
.cur-panel { display: none !important; }
.cur-panel.active { display: block !important; }

/* ===== CARD HEADER ===== */
.card-header, .module-header {
 cursor: pointer !important;
 -webkit-tap-highlight-color: transparent !important;
 touch-action: manipulation !important;
 pointer-events: auto !important;
}

/* ===== FAQ ACCORDION ===== */
#faq .org-accordion-content {
 display: block !important;
 text-align: left !important;
}

/* ===== GENERAL MOBILE RESPONSIVE ===== */
@media screen and (max-width: 768px) {
 img, video, iframe, table, pre, code {
 max-width: 100% !important;
 overflow-x: auto !important;
 }
 
 .hero-section, .section, [class*="section"] {
 padding-left: 16px !important;
 padding-right: 16px !important;
 box-sizing: border-box !important;
 }
 
 /* Ensure all content fits */
 .container, .nav-inner, [class*="container"], [class*="inner"], [class*="wrapper"] {
 max-width: 100% !important;
 box-sizing: border-box !important;
 }
}

@media screen and (max-width: 480px) {
 .hero-section h1, h1 {
 font-size: 1.5rem !important;
 line-height: 1.3 !important;
 }
 h2, .section h2, [class*="section"] h2 {
 font-size: 1.3rem !important;
 line-height: 1.3 !important;
 }
}

/* === ORG ACCORDION AS DETAILS/SUMMARY === */
details.org-accordion summary.org-accordion-header {
 list-style: none !important;
 cursor: pointer !important;
 -webkit-tap-highlight-color: transparent !important;
 touch-action: manipulation !important;
}
details.org-accordion summary.org-accordion-header::-webkit-details-marker {
 display: none !important;
}
details.org-accordion[open] .org-accordion-chevron {
 transform: rotate(180deg) !important;
}
details.org-accordion .org-accordion-body {
 max-height: none !important;
 overflow: visible !important;
}
details.org-accordion:not([open]) .org-accordion-body {
 display: none !important;
}
details.org-accordion[open] .org-accordion-body {
 display: block !important;
}

/* ═══ MULTI-PAGE SPECIFIC ═══ */
.page-content {
 padding-top: 40px;
 min-height: 60vh;
}
.page-content .section:first-child {
 padding-top: 60px;
}

/* Landing cards grid */
.landing-cards {
 display: grid;
 grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
 gap: 24px;
 margin-top: 48px;
}
.landing-card {
 background: var(--white);
 border: 1px solid var(--gray-200);
 border-radius: var(--radius-lg);
 padding: 32px 28px;
 text-decoration: none;
 color: inherit;
 transition: transform var(--transition), box-shadow var(--transition), border-color var(--transition);
 display: flex;
 flex-direction: column;
 gap: 12px;
}
.landing-card:hover {
 transform: translateY(-4px);
 box-shadow: var(--shadow-lg);
 border-color: var(--gold);
}
.landing-card-icon {
 font-size: 32px;
 margin-bottom: 4px;
}
.landing-card-title {
 font-family: var(--serif);
 font-size: 22px;
 font-weight: 600;
 color: var(--navy);
}
.landing-card-desc {
 font-size: 15px;
 color: var(--gray-600);
 line-height: 1.6;
}
.landing-card-arrow {
 margin-top: auto;
 color: var(--gold);
 font-weight: 600;
 font-size: 14px;
 display: flex;
 align-items: center;
 gap: 6px;
}

/* Active nav link */
.nav-links a.active {
 color: var(--gold) !important;
}

@media screen and (max-width: 600px) {
 .landing-cards {
 grid-template-columns: 1fr;
 gap: 16px;
 margin-top: 32px;
 }
 .landing-card {
 padding: 24px 20px;
 }
}


/* ═══ NAV DROPDOWN MENUS ═══ */
/* CRITICAL: override any overflow that clips dropdowns */
.nav,
.nav-inner,
.nav-links {
 overflow: visible !important;
}
.nav-links {
 display: flex !important;
 align-items: center;
 gap: 0;
}
.nav-item {
 position: relative;
}
.nav-item > a {
 display: flex;
 align-items: center;
 gap: 4px;
 padding: 8px 14px;
 text-decoration: none;
 color: var(--gray-700);
 font-size: 14px;
 font-weight: 500;
 border-radius: 6px;
 transition: color 0.2s, background 0.2s;
 white-space: nowrap;
 cursor: pointer;
}
.nav-item > a:hover,
.nav-item > a.active {
 color: var(--gold);
 background: var(--gold-10);
}
.nav-item > a .dropdown-arrow {
 font-size: 10px;
 transition: transform 0.2s;
 opacity: 0.5;
}
.nav-item:hover > a .dropdown-arrow,
.nav-item.open > a .dropdown-arrow {
 transform: rotate(180deg);
 opacity: 1;
}

/* Remove underline decoration from dropdown links */
.nav-dropdown a::after {
 display: none !important;
}

/* Dropdown panel */
.nav-dropdown {
 display: none;
 position: absolute;
 top: 100%;
 left: 50%;
 transform: translateX(-50%);
 min-width: 240px;
 background: var(--white);
 border: 1px solid var(--gray-200);
 border-radius: var(--radius-lg);
 box-shadow: var(--shadow-xl);
 padding: 8px;
 z-index: 9998;
 margin-top: 4px;
 animation: dropdownFade 0.15s ease-out;
}
@keyframes dropdownFade {
 from { opacity: 0; transform: translateX(-50%) translateY(-4px); }
 to { opacity: 1; transform: translateX(-50%) translateY(0); }
}
.nav-item:hover .nav-dropdown,
.nav-item.open .nav-dropdown {
 display: block;
}
.nav-dropdown a {
 display: flex;
 align-items: center;
 gap: 10px;
 padding: 10px 14px;
 text-decoration: none;
 color: var(--gray-700);
 font-size: 13px;
 font-weight: 500;
 border-radius: 8px;
 transition: background 0.15s, color 0.15s;
 line-height: 1.3;
}
.nav-dropdown a:hover {
 background: var(--gold-10);
 color: var(--navy);
}
.nav-dropdown .dd-icon {
 font-size: 16px;
 flex-shrink: 0;
 width: 24px;
 text-align: center;
}
.nav-dropdown .dd-text {
 display: flex;
 flex-direction: column;
}
.nav-dropdown .dd-label {
 font-weight: 600;
 color: var(--navy);
 font-size: 13px;
}
.nav-dropdown .dd-desc {
 font-size: 11px;
 color: var(--gray-500);
 font-weight: 400;
 margin-top: 1px;
}
.nav-dropdown .dd-divider {
 height: 1px;
 background: var(--gray-200);
 margin: 6px 8px;
}

/* Hide dropdowns on mobile (use mobile menu instead) */
@media screen and (max-width: 900px) {
 .nav-dropdown { display: none !important; }
 .nav-item > a .dropdown-arrow { display: none; }
}


/* ═══ DROPDOWN CLICK TOGGLE ═══ */
/* On desktop: hover works, but clicking also toggles .open class */
/* On touch devices: only click works (no hover) */
@media (hover: none) {
 .nav-item:hover .nav-dropdown {
 display: none;
 }
 .nav-item.open .nav-dropdown {
 display: block;
 }
}

/* Backdrop to close dropdowns when clicking outside */
.nav-dropdown-backdrop {
 display: none;
 position: fixed;
 top: 0; left: 0; right: 0; bottom: 0;
 z-index: 9996;
 background: transparent;
}
.nav-dropdown-backdrop.active {
 display: block;
}


/* ═══ DROPDOWN HEADERS & WIDE VARIANT ═══ */
.nav-dropdown .dd-header {
 font-size: 10px;
 font-weight: 700;
 text-transform: uppercase;
 letter-spacing: 1.5px;
 color: var(--gray-500);
 padding: 8px 14px 4px;
 margin-top: 2px;
}
.nav-dropdown-wide {
 min-width: 300px;
}


/* ═══════════════════════════════════════════════════════
 MEJORAS VISUALES v2 — aplicadas sobre estilos existentes
 ═══════════════════════════════════════════════════════ */

/* ——— CARDS con hover refinado ——— */
.card,
.feature-card,
.programa-card,
.audience-card,
.team-card,
.price-card,
.accred-card {
 transition: transform 0.35s cubic-bezier(0.2, 0.8, 0.2, 1),
 box-shadow 0.35s cubic-bezier(0.2, 0.8, 0.2, 1),
 border-color 0.35s ease;
 will-change: transform;
}
.card:hover,
.feature-card:hover,
.programa-card:hover,
.audience-card:hover,
.team-card:hover,
.price-card:hover,
.accred-card:hover {
 transform: translateY(-6px);
 box-shadow: 0 20px 50px rgba(12, 27, 58, 0.12),
 0 6px 16px rgba(12, 27, 58, 0.08);
 border-color: rgba(176, 138, 46, 0.4);
}

/* ——— Sombras más suaves por defecto ——— */
.card,
.feature-card,
.programa-card,
.audience-card {
 box-shadow: 0 4px 20px rgba(12, 27, 58, 0.06);
}

/* ——— Link hover con subrayado dorado animado ——— */
.nav-links > .nav-item > a {
 position: relative;
}

/* ——— Botones CTA con efecto sutil ——— */
.btn,
.hero-cta,
.nav-cta {
 transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
}
.btn:hover,
.hero-cta:hover,
.nav-cta:hover {
 transform: translateY(-2px);
 box-shadow: 0 8px 20px rgba(176, 138, 46, 0.3);
}

/* ═══════════════════════════════════════════════════════
 FIXES MÓVIL — mejoras específicas para pantallas chicas
 ═══════════════════════════════════════════════════════ */

/* Hero stats en 2x2 en móvil */
@media (max-width: 640px) {
 .hero-stats {
 display: grid !important;
 grid-template-columns: 1fr 1fr !important;
 gap: 20px 16px !important;
 padding: 24px 0 !important;
 max-width: 320px;
 margin: 0 auto;
 }
 .hero-stat {
 text-align: center;
 }
 .hero-stat-num {
 font-size: 28px !important;
 }
 .hero-stat-label {
 font-size: 11px !important;
 }

 /* CTAs del hero full-width apilados */
 .hero-ctas,
 .hero-buttons {
 flex-direction: column !important;
 align-items: center !important;
 gap: 12px !important;
 width: auto;
 max-width: none;
 margin: 0 auto;
 }
 .hero-ctas .btn,
 .hero-ctas .hero-cta,
 .hero-buttons .btn,
 .hero-buttons a {
 width: auto !important;
 text-align: center;
 padding: 12px 28px !important;
 font-size: 14px !important;
 display: inline-flex !important;
 justify-content: center;
 }

 /* Audience cards más compactas */
 .audience-card {
 padding: 20px 18px !important;
 }

 /* Section padding reducido */
 .section {
 padding: 48px 0 !important;
 }
 .section-title {
 font-size: 24px !important;
 margin-bottom: 8px !important;
 }
 .section-subtitle {
 font-size: 14px !important;
 }

 /* Banner de construcción más compacto */
 #construction-banner {
 font-size: 11px !important;
 padding: 7px 12px !important;
 }
 #construction-banner span {
 font-size: 11px !important;
 }
 #closeBannerBtn {
 padding: 3px 8px !important;
 font-size: 11px !important;
 }

 /* Cookie banner responsive */
 #cookie-banner {
 bottom: 12px !important;
 left: 12px !important;
 right: 12px !important;
 padding: 16px 18px !important;
 font-size: 13px !important;
 }
}

/* Pantallas muy chicas (≤380px) */
@media (max-width: 380px) {
 .hero h1 {
 font-size: 26px !important;
 }
 .hero h2 {
 font-size: 18px !important;
 }
 .hero-stat-num {
 font-size: 24px !important;
 }
}

/* ——— Scroll suave ——— */
html {
 scroll-behavior: smooth;
}

/* ═══════════════════════════════════════════════════════
 MOBILE RESPONSIVENESS FIX — Abril 2026
 Corrige problemas de desbordamiento, breakpoints
 intermedios, y layouts que no colapsan bien en móvil
 ═══════════════════════════════════════════════════════ */

/* 1. GLOBAL: evitar desbordamiento horizontal */
html, body {
 overflow-x: hidden !important;
 width: 100%;
}
* {
 box-sizing: border-box;
}
/* Corregir max-width: 100vw que causa scroll por scrollbar */
*,
*::before,
*::after {
 max-width: 100% !important;
}
/* Excepciones que necesitan su ancho original */
body, html, .sidebar, .sidebar.mobile-open,
.nav, .nav-inner, .mobile-panel,
#mobilePanel, #mobileOverlay,
.nav-menu-btn, .nav-menu-btn span,
#mobilePanel img,
input, select, textarea, button, a,
svg, svg *, path, line, polyline, circle, rect,
[class*="icon"], .avatar, .badge,
.brand-logo, .sidebar-logo, .nav-logo {
 max-width: none !important;
}

/* 2. TABLET INTERMEDIO (768px) — nuevo breakpoint */
@media (max-width: 768px) {
 .container {
  padding: 0 16px;
 }
 .grid-2 {
  grid-template-columns: 1fr;
 }
 .hero h1 {
  font-size: 28px;
 }
 .hero h2 {
  font-size: 20px;
 }
 .hero-stats {
  flex-wrap: wrap;
  justify-content: center;
 }
 .hero-stat {
  min-width: 120px;
 }
 .sponsor-tier-grid {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  gap: 12px !important;
 }
 .sponsor-card {
  width: 140px !important;
  height: 110px !important;
  flex-shrink: 0;
 }
 .footer-inner {
  flex-direction: column;
  gap: 24px;
 }
 .pricing-grid {
  grid-template-columns: 1fr !important;
  max-width: 420px;
  margin: 0 auto;
 }
 /* FAQ items más compactos */
 .faq-question {
  font-size: 15px;
  padding: 14px 16px;
 }
 .faq-answer {
  padding: 12px 16px;
  font-size: 14px;
 }
}

/* 3. MOBILE (600px) — refuerzos */
@media (max-width: 600px) {
 .sponsor-tier-grid {
  gap: 8px !important;
 }
 .sponsor-tier-grid--plata {
  grid-template-columns: repeat(2, 1fr) !important;
 }
 .sponsor-card {
  width: 120px !important;
  height: 100px !important;
 }
 .sponsor-tier-grid--plata .sponsor-card {
  width: auto !important;
  height: 90px !important;
 }
 .sponsor-card-name {
  font-size: 12px !important;
 }
 .sponsor-card-cat {
  font-size: 10px !important;
 }
 /* Tablas responsive */
 table {
  display: block;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  font-size: 13px;
 }
 /* Imágenes nunca desborden */
 img {
  max-width: 100% !important;
 }
 /* Logos en nav y panel móvil mantienen su tamaño inline */
 .nav-logo img,
 .nav-brand img,
 #mobilePanel img {
  max-width: none !important;
  height: 30px !important;
  width: auto !important;
 }
 .hero-logo-img {
  max-width: 100% !important;
  height: auto !important;
 }
 /* Nav logo más chico */
 .nav-logo img {
  height: 28px !important;
 }
 .nav-logo span {
  font-size: 13px !important;
 }
 /* Módulos del curriculum */
 .module-header h3 {
  font-size: 14px;
 }
 .class-item {
  font-size: 13px;
  padding: 6px 12px 6px 36px;
 }
}

/* 4. PHONES PEQUEÑOS (480px) — nuevo breakpoint completo */
@media (max-width: 480px) {
 .container {
  padding: 0 12px !important;
 }
 .section {
  padding: 36px 0 !important;
 }
 .hero-inner {
  padding: 28px 12px 40px !important;
 }
 .hero h1 {
  font-size: 24px !important;
  line-height: 1.2 !important;
 }
 .hero h2 {
  font-size: 16px !important;
 }
 .hero-desc {
  font-size: 14px !important;
 }
 .hero-logo-img {
  width: 75px !important;
 }
 .card {
  padding: 16px !important;
 }
 .card-title {
  font-size: 16px !important;
 }
 .card-text {
  font-size: 13px !important;
 }
 .price-card {
  padding: 20px !important;
 }
 .price-amount {
  font-size: 36px !important;
 }
 .btn-primary, .btn-secondary {
  font-size: 14px !important;
  padding: 12px 20px !important;
 }
 .sponsor-card {
  width: 100px !important;
  height: 85px !important;
 }
 /* Ope cards */
 .ope-card {
  padding: 16px !important;
 }
 .ope-card h3 {
  font-size: 16px;
 }
 /* Accreditation cards */
 .accred-card {
  padding: 16px !important;
 }
 .accred-card h3 {
  font-size: 16px;
 }
 /* Team cards */
 .team-card {
  padding: 16px 12px !important;
 }
 .team-avatar {
  width: 48px !important;
  height: 48px !important;
  font-size: 16px !important;
 }
 .team-name {
  font-size: 14px !important;
 }
 /* Footer */
 .footer {
  padding: 32px 0 !important;
 }
 .footer-links {
  gap: 16px !important;
 }
 .footer-link-group h4 {
  font-size: 14px;
 }
 .footer-link-group a {
  font-size: 13px;
 }
}

/* ——— Focus visible mejorado para accesibilidad ——— */
a:focus-visible,
button:focus-visible {
 outline: 2px solid #b08a2e;
 outline-offset: 2px;
 border-radius: 4px;
}

/* ——— Separador de sección sutil ——— */
.section + .section {
 position: relative;
}
.section + .section::before {
 content: "";
 position: absolute;
 top: 0;
 left: 50%;
 transform: translateX(-50%);
 width: 60px;
 height: 2px;
 background: linear-gradient(90deg, transparent, #b08a2e, transparent);
 opacity: 0.5;
}

/* ═══════════════════════════════════════════════════
   DYNAMIC ENHANCEMENTS — April 2026
   Scroll animations, back-to-top, progress bar
   ═══════════════════════════════════════════════════ */

/* ——— Scroll Reveal Animations ——— */
.reveal {
 opacity: 0;
 transform: translateY(30px);
 transition: opacity 0.8s cubic-bezier(0.25, 0.8, 0.25, 1), transform 0.8s cubic-bezier(0.25, 0.8, 0.25, 1);
}

.reveal.visible {
 opacity: 1;
 transform: none;
}

/* Preserve 3D context inside reveal for flip cards */
.sponsors-showcase .reveal {
 transform-style: preserve-3d;
}
.sponsors-showcase .reveal.visible {
 transform: none;
}

.reveal-left {
 opacity: 0;
 transform: translateX(-30px);
 transition: opacity 0.8s ease, transform 0.8s ease;
}

.reveal-left.visible {
 opacity: 1;
 transform: translateX(0);
}

.reveal-right {
 opacity: 0;
 transform: translateX(30px);
 transition: opacity 0.8s ease, transform 0.8s ease;
}

.reveal-right.visible {
 opacity: 1;
 transform: translateX(0);
}

.reveal-scale {
 opacity: 0;
 transform: scale(0.95);
 transition: opacity 0.6s ease, transform 0.6s ease;
}

.reveal-scale.visible {
 opacity: 1;
 transform: scale(1);
}

/* ——— Staggered Children Animation Delays ——— */
.stagger > *:nth-child(1) {
 transition-delay: 0s;
}

.stagger > *:nth-child(2) {
 transition-delay: 0.1s;
}

.stagger > *:nth-child(3) {
 transition-delay: 0.2s;
}

.stagger > *:nth-child(4) {
 transition-delay: 0.3s;
}

.stagger > *:nth-child(5) {
 transition-delay: 0.4s;
}

.stagger > *:nth-child(6) {
 transition-delay: 0.5s;
}

/* ——— Back-to-Top Button ——— */
.back-to-top {
 position: fixed;
 bottom: 24px;
 right: 24px;
 width: 44px;
 height: 44px;
 border-radius: 50%;
 background: var(--navy);
 color: var(--white);
 border: none;
 cursor: pointer;
 display: flex;
 align-items: center;
 justify-content: center;
 opacity: 0;
 visibility: hidden;
 transform: translateY(10px);
 transition: all 0.3s ease;
 z-index: 99;
 box-shadow: 0 4px 12px rgba(12, 29, 54, 0.3);
}

.back-to-top.visible {
 opacity: 1;
 visibility: visible;
 transform: translateY(0);
}

.back-to-top:hover {
 background: var(--gold);
 transform: translateY(-2px);
 box-shadow: 0 6px 20px rgba(176, 138, 46, 0.4);
}

/* ——— Scroll Progress Bar ——— */
.scroll-progress-bar {
 position: fixed;
 top: 0;
 left: 0;
 height: 3px;
 background: linear-gradient(90deg, var(--gold), var(--gold-light));
 z-index: 10000;
 width: 0%;
 transition: width 0.1s linear;
 pointer-events: none;
}

/* ——— Enhanced Mobile Menu Animation ——— */
.mobile-menu-panel {
 transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1);
 box-shadow: -2px 0 8px rgba(12, 29, 54, 0.1);
}

.mobile-menu-panel.active {
 box-shadow: -4px 0 16px rgba(12, 29, 54, 0.2);
}

#mobilePanel {
 transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1) !important;
 box-shadow: -2px 0 8px rgba(12, 29, 54, 0.1) !important;
}

#mobilePanel.active {
 box-shadow: -4px 0 16px rgba(12, 29, 54, 0.2) !important;
}

/* ——— Card Hover Lift Effect ——— */
.card,
.ope-card,
.accred-card,
.price-card,
.feature-card {
 transition: transform 0.4s cubic-bezier(0.25, 0.8, 0.25, 1), box-shadow 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
}

.card:hover,
.ope-card:hover,
.accred-card:hover,
.price-card:hover,
.feature-card:hover {
 transform: translateY(-4px);
}

/* ——— Counter Animation Style ——— */
.counter {
 display: inline-block;
}

/* ——— Mobile Back-to-Top & FAB Contact Position Adjustment ——— */
@media (max-width: 600px) {
 .back-to-top {
  bottom: calc(16px + env(safe-area-inset-bottom, 0px));
  right: 16px;
  width: 40px;
  height: 40px;
 }

 .fab-contact {
  bottom: calc(16px + env(safe-area-inset-bottom, 0px));
  right: 68px;
 }
}

/* ═══════════════════════════════════════════════════════
   ANATOMY BACKGROUND SYSTEM
   Fondos decorativos con ilustraciones anatómicas clásicas
   (Reil, Meynert, Cajal, Gray) — dominio público.
   Uso: añadir .anatomy-bg + .bg-[nombre] a cualquier section.
   ═══════════════════════════════════════════════════════ */
.anatomy-bg {
 position: relative;
 overflow: hidden;
}
.anatomy-bg::before {
 content: "";
 position: absolute;
 /* Override hero decorative ::before (circle 600x600) */
 width: auto !important;
 height: auto !important;
 border-radius: 0 !important;
 top: -40px !important;
 right: -40px !important;
 bottom: -40px !important;
 left: -40px !important;
 background-size: cover !important;
 background-position: center !important;
 background-repeat: no-repeat !important;
 filter: blur(12px);
 opacity: 0.14;
 z-index: 0;
 pointer-events: none;
}
.anatomy-bg > * {
 position: relative;
 z-index: 1;
}

/* Dark variant (for navy / dark backgrounds) */
.anatomy-bg-dark::before {
 opacity: 0.22;
 filter: blur(10px) brightness(2.2);
}

/* Stronger variant (for dividers/accents) */
.anatomy-bg-strong::before {
 opacity: 0.18;
 filter: blur(8px);
}

/* Subtle variant (for light sections) */
.anatomy-bg-subtle::before {
 opacity: 0.10;
 filter: blur(14px);
}

/* ── Image assignments ────────────────────────────────── */
.bg-reil::before    { background-image: url('Dissection_of_the_human_brain,_Johann_Christian_Reil,_1812.jpg') !important; }
.bg-meynert::before { background-image: url('Meynert1885.png') !important; }
.bg-cajal::before   { background-image: url('Cajal_cortex_drawings.png') !important; }
.bg-gray765::before { background-image: url('Gray765.png') !important; }
.bg-gray661::before { background-image: url('Gray661.png') !important; background-position: center 30% !important; filter: blur(10px) saturate(0); }
.bg-gray796::before { background-image: url('Gray796.png') !important; filter: blur(10px) saturate(0); }

@media print {
 .anatomy-bg::before { display: none; }
}
