/* Instituto Mate-Online · Fase 1, revisión 2 · calidad final.
   Cabecera y portada únicamente. Tipografía del sistema y gráficos locales. */
.site-header,.welcome{font-family:"Segoe UI Variable Display","Segoe UI",Arial,sans-serif}
.site-header{padding:14px 0;background:#f1f7fd;border-bottom:0;backdrop-filter:none}
.site-nav{width:min(1280px,calc(100% - 64px));margin:auto;padding:13px 23px;min-height:84px;border:1px solid #dbe9f7;border-radius:22px;background:#fff;box-shadow:0 7px 25px #123d7210;display:flex;align-items:center;justify-content:space-between;gap:24px;position:relative}
.site-brand{display:flex;align-items:center;gap:10px;flex-shrink:0;color:#092852}
.site-brand img{display:block;width:58px;height:58px;object-fit:contain}
.site-wordmark{display:flex;flex-direction:column;align-items:flex-start;gap:4px;line-height:1;letter-spacing:-.025em}
.site-wordmark>span{font-size:18px;font-weight:700;padding-left:2px}
.site-wordmark strong{font-size:22px;font-weight:700;color:#fff;background:linear-gradient(110deg,#087cde,#0649ac);padding:4px 8px 5px;border-radius:6px}
.site-links{display:flex;align-items:center;gap:17px;font-size:13px;font-weight:600;color:#243c5b}
.site-links>a{padding:12px 0;white-space:nowrap;border-radius:9px;transition:color .15s,background .15s}
.site-links>a:hover{color:#0866cf}
.site-links .site-home{color:#0756b6;background:#eaf5ff;padding:10px 15px;border-radius:24px}
.site-links .site-contact{display:inline-flex;align-items:center;gap:8px;padding:12px 16px;margin-left:2px;border-radius:26px;background:#0759bd;color:#fff;box-shadow:0 4px 10px #1267bd1a}
.site-contact svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linejoin:round;stroke-linecap:round}
.site-links .site-contact:hover{background:#063f91;color:#fff}
.site-menu{display:none;align-items:center;gap:9px;justify-content:center;min-height:44px;padding:11px 12px;border:1px solid #cbdff3;border-radius:12px;background:#f8fbff;color:#123f76;font-size:13px;font-weight:600}
.menu-lines{width:19px;height:14px;border-top:2px solid currentColor;border-bottom:2px solid currentColor;position:relative}
.menu-lines:after{content:"";position:absolute;top:4px;left:0;width:19px;border-top:2px solid currentColor}
.site-menu[aria-expanded="true"] .menu-lines{border:0}
.site-menu[aria-expanded="true"] .menu-lines:before,.site-menu[aria-expanded="true"] .menu-lines:after{content:"";position:absolute;top:6px;left:0;width:19px;border-top:2px solid currentColor;transform:rotate(45deg)}
.site-menu[aria-expanded="true"] .menu-lines:after{transform:rotate(-45deg)}
.welcome{position:relative;isolation:isolate;overflow:hidden;padding:54px 0 60px;background:radial-gradient(ellipse at 34% 48%,#fff 10%,#f6fbff 46%,#eaf5ff 100%);border-bottom:1px solid #d9e8f7}
.welcome-landscape{position:absolute;inset:0;width:100%;height:100%;z-index:-1;pointer-events:none}
.welcome-grid{width:min(1240px,calc(100% - 96px));margin:auto;display:grid;grid-template-columns:1fr 1.08fr;gap:64px;align-items:center}
.brand-stage{position:relative;padding:25px 22px 18px;border:1px solid #dce9f7;background:#ffffffed;border-radius:30px;box-shadow:0 15px 44px #154d8710;min-width:0}
.brand-lockup{display:flex;align-items:center;justify-content:center;gap:11px;position:relative}
.brand-lockup>img{display:block;width:178px;height:178px;object-fit:contain;flex:0 0 auto}
.brand-name{display:flex;flex-direction:column;align-items:flex-start;gap:10px;min-width:0;line-height:1;letter-spacing:-.035em}
.brand-name>span{font-size:29px;font-weight:700;color:#092b59;padding-left:2px}
.brand-name>strong{display:block;font-size:35px;font-weight:700;white-space:nowrap;padding:9px 12px 12px;border-radius:10px;background:linear-gradient(110deg,#0a83e8,#074aab);color:#fff;box-shadow:0 5px 12px #0861bb18}
.brand-name>small{font-size:13px;line-height:1.4;letter-spacing:0;font-weight:600;color:#344f70;margin:2px 0 0 2px;white-space:nowrap}
.brand-illustration{margin-top:14px}
.brand-illustration>svg{display:block;width:100%;height:auto}
.learning-principles{display:flex;justify-content:center;align-items:center;gap:14px;margin-top:2px;color:#2c4e76;font-size:13px;font-weight:600;letter-spacing:.02em}
.learning-principles>i{width:4px;height:4px;border-radius:50%;background:#75aade}
.welcome-kicker{display:flex;align-items:center;gap:8px;font-size:11px;font-weight:700;letter-spacing:.11em;color:#34577d;margin-bottom:19px}
.welcome-kicker>span{width:22px;height:2px;background:#1085e4;border-radius:2px}
.welcome h1{margin:0;color:#092b59;font-size:clamp(38px,3.8vw,54px);font-weight:700;letter-spacing:-.045em;line-height:1.13}
.welcome h1>span{color:#0868d8}
.welcome-description{font-size:17px;line-height:1.75;color:#344f70;max-width:495px;margin:24px 0 26px}
.welcome-actions{display:flex;align-items:stretch;gap:10px;flex-wrap:wrap}
.welcome-button{display:inline-flex;align-items:center;justify-content:center;gap:9px;padding:14px 17px;min-height:54px;border:1px solid #648ec0;border-radius:28px;font-size:14px;font-weight:700;line-height:1.4;transition:background .15s,box-shadow .15s}
.welcome-button>svg{width:22px;height:22px;flex:0 0 auto;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.welcome-button>span{font-size:20px;font-weight:400;margin-left:7px;line-height:1}
.welcome-primary{background:linear-gradient(110deg,#0867c9,#064da9);color:#fff;border-color:#0763ca;box-shadow:0 6px 15px #0c63bb26}
.welcome-primary:hover{background:#064ea8;box-shadow:0 8px 20px #0c63bb30}
.welcome-secondary{background:#fff;color:#123e76;box-shadow:0 2px 6px #174b7c0a}
.welcome-secondary:hover{background:#eaf5ff}
.welcome-benefits{display:flex;align-items:center;gap:18px;flex-wrap:wrap;list-style:none;margin:23px 0 0;padding:0;color:#345577;font-size:12px;font-weight:600}
.welcome-benefits li{display:flex;align-items:center;gap:5px}
.welcome-benefits svg{display:block;width:18px;height:18px;fill:#e8f4ff;stroke:#1175d5;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.site-header a:focus-visible,.site-menu:focus-visible,.welcome a:focus-visible{outline:3px solid #063e98;outline-offset:4px}
@media(max-width:1200px){
  .site-nav{width:calc(100% - 40px);padding-inline:18px;gap:18px}.site-links{gap:12px;font-size:12px}.site-wordmark strong{font-size:20px}.site-wordmark>span{font-size:16px}
  .welcome-grid{width:calc(100% - 64px);gap:36px}.brand-stage{padding:25px 16px 20px}.brand-lockup>img{width:145px;height:145px}.brand-name>span{font-size:25px}.brand-name>strong{font-size:30px;padding:8px 9px 10px}.brand-name>small{font-size:12px}.welcome h1{font-size:45px}.welcome-description{font-size:16px}.welcome-button{font-size:13px;padding-inline:14px;gap:7px}.welcome-button>span{margin-left:3px}
}
@media(max-width:1100px){
  .site-header{padding:10px 0}.site-nav{min-height:76px;padding:9px 16px;border-radius:18px;flex-wrap:wrap}.site-brand img{width:54px;height:54px}.site-wordmark>span{font-size:16px}.site-wordmark strong{font-size:21px}
  .site-menu:not([hidden]){display:inline-flex}
  .site-links{flex-basis:100%;display:grid;grid-template-columns:1fr 1fr;gap:7px 12px;margin-top:12px;padding:14px 0 6px;border-top:1px solid #e1edf9;font-size:14px}
  .site-links>a{padding:12px 14px}.site-links .site-home{padding:12px 14px;border-radius:10px}.site-links .site-contact{margin:0;justify-content:center;border-radius:12px}
  .site-header.menu-ready .site-links{display:none}
  .site-header.menu-ready .site-links.is-open{display:grid;position:absolute;top:calc(100% + 8px);left:0;right:0;margin:0;padding:16px;border:1px solid #d5e6f7;border-radius:18px;background:#fff;box-shadow:0 16px 30px #123d7220;max-height:calc(100dvh - 116px);overflow:auto}
  .welcome{padding:45px 0 50px}.welcome-grid{gap:30px}.brand-lockup{gap:4px}.brand-lockup>img{width:120px;height:120px}.brand-name>span{font-size:22px}.brand-name>strong{font-size:27px}.brand-name>small{font-size:12px}.brand-stage{padding:26px 14px 21px}.brand-illustration{margin-top:24px}.welcome h1{font-size:42px}.welcome-kicker{font-size:10px;letter-spacing:.08em}.welcome-actions{gap:10px}.welcome-description{margin:20px 0 23px}.welcome-benefits{gap:12px;font-size:11px}
}
@media(max-width:800px){
  .welcome{padding:34px 0 42px}.welcome-grid{width:min(620px,calc(100% - 48px));grid-template-columns:1fr;gap:24px}
  .brand-stage{display:contents}.brand-lockup{order:0;gap:14px;justify-content:center}.brand-lockup>img{width:132px;height:132px}.brand-name>span{font-size:25px}.brand-name>strong{font-size:32px}.brand-name>small{font-size:12px}
  .welcome-copy{order:1;text-align:center}.welcome-kicker{justify-content:center;margin-bottom:15px}.welcome h1{font-size:43px;line-height:1.13}.welcome h1>span br{display:none}.welcome-description{margin:19px auto 22px;max-width:485px}.welcome-actions{justify-content:center}.welcome-benefits{justify-content:center;font-size:12px;gap:17px;margin-top:21px}
  .brand-illustration{order:2;margin:0 auto;width:min(400px,85%);padding-top:5px}.learning-principles{font-size:12px;margin-top:0}.welcome-landscape{opacity:.75}
}
@media(max-width:480px){
  .site-header{padding:8px 0}.site-nav{width:calc(100% - 24px);min-height:70px;border-radius:16px;padding:8px 11px;gap:8px}.site-brand{gap:6px}.site-brand img{width:46px;height:46px}.site-wordmark{gap:4px}.site-wordmark>span{font-size:14px}.site-wordmark strong{font-size:18px;padding:4px 6px}.site-menu{width:42px;min-height:42px;padding:10px}.menu-label{display:none}.site-header.menu-ready .site-links.is-open{left:0;right:0;padding:12px;font-size:13px;max-height:calc(100dvh - 104px)}
  .welcome{padding:24px 0 34px}.welcome-grid{width:calc(100% - 36px);gap:23px}.brand-lockup{gap:8px;justify-content:center}.brand-lockup>img{width:112px;height:112px}.brand-name{gap:8px}.brand-name>span{font-size:23px}.brand-name>strong{font-size:28px;padding:8px 9px 10px;border-radius:8px}.brand-name>small{font-size:11px;letter-spacing:0}
  .welcome-kicker{font-size:10px;letter-spacing:.06em;margin-bottom:15px;gap:6px}.welcome-kicker>span{width:14px}.welcome h1{font-size:clamp(30px,8.8vw,36px);line-height:1.16;letter-spacing:-.04em}.welcome h1>span br{display:initial}.welcome-description{font-size:15px;line-height:1.7;margin:17px auto 21px;max-width:330px}.welcome-actions{flex-direction:column;gap:10px}.welcome-button{min-height:52px;font-size:14px;padding:12px 18px;position:relative}.welcome-button>span{position:absolute;right:19px}.welcome-button>svg{width:22px;height:22px}.welcome-benefits{font-size:11px;gap:10px;margin-top:19px}.welcome-benefits svg{width:16px;height:16px}
  .brand-illustration{width:min(325px,96%);padding:0}.learning-principles{font-size:12px;gap:12px;margin-top:0}.welcome-landscape{opacity:.7}
}
@media(prefers-reduced-motion:reduce){.site-links>a,.welcome-button{transition:none}}