/* Montserrat LOCAL (fuente variable, subset latin — cubre inglés y español, incl. ñ/á/é/í/ó/ú/¿/¡). Sin CDN. */ @font-face{ font-family:'Montserrat'; font-style:normal; font-weight:400 800; font-display:swap; src:url('assets/fonts/montserrat-latin.woff2') format('woff2'); } :root{ --navy:#1B3A6B;--navy-l:#2352a0;--navy-d:#122748; --orange:#F5900A;--orange-l:#ffad38; --gray-bg:#f5f7fa;--footer-bg:#2b2b2b; --text:#1a2540;--text-m:#445577;--text-l:#8898aa; --border:#e0e8f0; } *{margin:0;padding:0;box-sizing:border-box;} html{scroll-behavior:smooth;overflow-x:hidden;} body{font-family:'Montserrat',sans-serif;color:var(--text);background:#fff;overflow-x:hidden;} strong,b{font-weight:800;} /* ── PAGE SYSTEM ── */ .page{display:none;min-height:100vh;flex-direction:column;} .page.active{display:flex;} /* Anti-flash del routing (solo hasta que el JS arranca): si el marcó data-route, muestra esa sección y oculta home desde el primer paint. Selector con id → gana a .page.active; una vez que gp() aplica estilos inline, éstos mandan y esto deja de influir. */ html[data-route] #page-home{display:none;} html[data-route="benefits"] #page-benefits, html[data-route="about"] #page-about, html[data-route="mexico"] #page-mexico, html[data-route="contact"] #page-contact, html[data-route="medprogram"] #page-medprogram, html[data-route="eligibility"] #page-eligibility{display:flex;} /* page enter animation */ .page.enter>*{animation:pageIn .65s cubic-bezier(.22,1,.36,1) both;} .page.enter>*:nth-child(2){animation-delay:.12s;} .page.enter>*:nth-child(3){animation-delay:.24s;} .page.enter>*:nth-child(4){animation-delay:.36s;} .page.enter>*:nth-child(5){animation-delay:.48s;} .page.enter>*:nth-child(6){animation-delay:.6s;} @keyframes pageIn{from{opacity:0;transform:translateY(30px);}to{opacity:1;transform:none;}} /* About us: entrada elemento por elemento */ #page-about.enter>section{animation:none;} #page-about.enter>footer{animation-delay:1s;} #page-about.enter .sec-h{animation:pageIn .8s cubic-bezier(.22,1,.36,1) .05s both;} #page-about.enter .about-card{animation:pageIn .8s cubic-bezier(.22,1,.36,1) .25s both;} #page-about.enter .pc{animation:pageIn .8s cubic-bezier(.22,1,.36,1) both;} #page-about.enter .pc:nth-child(1){animation-delay:.5s;} #page-about.enter .pc:nth-child(2){animation-delay:.66s;} #page-about.enter .pc:nth-child(3){animation-delay:.82s;} #page-about.enter .pc:nth-child(4){animation-delay:.98s;} /* Mexico Network: entrada elemento por elemento */ #page-mexico.enter>section{animation:none;} #page-mexico.enter>footer{animation-delay:1.15s;} #page-mexico.enter .sec-h{animation:pageIn .8s cubic-bezier(.22,1,.36,1) .05s both;} #page-mexico.enter .sec-sub{animation:pageIn .8s cubic-bezier(.22,1,.36,1) .18s both;} #page-mexico.enter .nc{animation:pageIn .7s cubic-bezier(.22,1,.36,1) both;} #page-mexico.enter .nc:nth-child(1){animation-delay:.34s;} #page-mexico.enter .nc:nth-child(2){animation-delay:.43s;} #page-mexico.enter .nc:nth-child(3){animation-delay:.52s;} #page-mexico.enter .nc:nth-child(4){animation-delay:.61s;} #page-mexico.enter .nc:nth-child(5){animation-delay:.7s;} #page-mexico.enter .nc:nth-child(6){animation-delay:.79s;} #page-mexico.enter .nc:nth-child(7){animation-delay:.88s;} #page-mexico.enter .nc:nth-child(8){animation-delay:.97s;} /* Contact: entrada elemento por elemento */ #page-contact.enter>.cont-page{animation:none;} #page-contact.enter>footer{animation-delay:1.15s;} #page-contact.enter .sec-h{animation:pageIn .8s cubic-bezier(.22,1,.36,1) .05s both;} #page-contact.enter .off-c{animation:pageIn .8s cubic-bezier(.22,1,.36,1) both;} #page-contact.enter .off-c:nth-child(1){animation-delay:.22s;} #page-contact.enter .off-c:nth-child(2){animation-delay:.38s;} #page-contact.enter .off-c:nth-child(3){animation-delay:.54s;} #page-contact.enter .off-c:nth-child(4){animation-delay:.7s;} #page-contact.enter .cont-form{animation:pageIn .8s cubic-bezier(.22,1,.36,1) .9s both;} @media (prefers-reduced-motion:reduce){.page.enter>*,.page.enter .sec-h,.page.enter .sec-sub,.page.enter .about-card,.page.enter .pc,.page.enter .nc,.page.enter .off-c,.page.enter .cont-form{animation:none;}} /* ── NAV ── */ nav{background:var(--navy);position:sticky;top:0;z-index:9000;box-shadow:0 2px 16px rgba(0,0,0,.3);} .nav-in{display:flex;align-items:center;justify-content:space-between;padding:0 40px;height:54px;max-width:1160px;margin:0 auto;} .logo-link{display:flex;align-items:center;gap:8px;cursor:pointer;text-decoration:none;} .logo-link img{height:34px;} .logo-txt{font-family:'Montserrat',sans-serif;font-weight:800;font-size:1.15rem;color:#fff;} .nav-links{display:flex;align-items:center;gap:2px;} .nav-links a{color:rgba(255,255,255,.88);font-size:.75rem;font-weight:700;text-decoration:none;padding:6px 9px;border-radius:6px;transition:.2s;white-space:nowrap;cursor:pointer;} .nav-links a:hover,.nav-links a.active{background:rgba(255,255,255,.15);color:#fff;} .nav-ph{color:var(--orange);font-weight:800;font-size:.82rem;display:flex;align-items:center;gap:5px;white-space:nowrap;} .ham{display:none;flex-direction:column;gap:5px;cursor:pointer;padding:6px;background:none;border:none;} .ham span{display:block;width:22px;height:2px;background:#fff;border-radius:2px;} /* ── MOBILE DRAWER ── */ .drawer{display:none;position:fixed;inset:0;z-index:9999;pointer-events:none;} .drawer.open{pointer-events:all;} .drw-ov{position:absolute;inset:0;background:rgba(0,0,0,.55);opacity:0;transition:.3s;} .drawer.open .drw-ov{opacity:1;} .drw-pnl{position:absolute;left:0;top:0;bottom:0;width:270px;background:var(--navy-d);transform:translateX(-100%);transition:.3s;padding:20px;} .drawer.open .drw-pnl{transform:none;} .drw-close{background:none;border:none;color:#fff;font-size:1.4rem;cursor:pointer;display:block;margin-bottom:16px;text-align:right;width:100%;} .drw-links{display:flex;flex-direction:column;gap:3px;} .drw-links a{color:rgba(255,255,255,.9);font-size:.95rem;font-weight:700;text-decoration:none;padding:10px 12px;border-radius:8px;transition:.2s;cursor:pointer;} .drw-links a:hover{background:rgba(255,255,255,.1);} .drw-ph{margin-top:20px;color:var(--orange);font-weight:800;display:flex;align-items:center;gap:8px;font-size:.9rem;} /* ── BUTTONS ── */ .btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:none;border-radius:30px;font-family:inherit;font-weight:700;cursor:pointer;transition:.15s;text-decoration:none;white-space:nowrap;} .btn:hover{transform:translateY(-1px);box-shadow:0 5px 18px rgba(0,0,0,.15);} .btn-o{background:var(--orange);color:#fff;padding:10px 24px;font-size:.87rem;} .btn-o:hover{background:var(--orange-l);} .btn-n{background:var(--navy);color:#fff;padding:10px 24px;font-size:.87rem;} .btn-n:hover{background:var(--navy-l);} .btn-sm{padding:7px 16px;font-size:.78rem;} .btn-block{width:100%;} /* ── HERO ── */ .hero{background:#fff;padding:56px 0 0;position:relative;overflow:hidden;} .hero::before{display:none;} .hero-in{max-width:1160px;margin:0 auto;padding:0 40px;display:flex;align-items:center;gap:40px;position:relative;z-index:1;min-height:420px;} .hero-txt{flex:1;min-width:0;padding-bottom:40px;} .hero-logo{display:flex;align-items:center;gap:10px;margin-bottom:16px;} .hero-logo img{height:56px;filter:invert(25%) sepia(100%) saturate(250%) hue-rotate(177deg) brightness(90%);} .hero-logo span{font-family:'Montserrat',sans-serif;font-weight:800;font-size:.84rem;color:var(--navy);line-height:1.3;} h1.hero-h{font-family:'Montserrat',sans-serif;font-weight:800;font-size:3.2rem;color:var(--navy);line-height:1.1;margin-bottom:12px;} .hero-sub{font-size:.9rem;color:var(--text-m);margin-bottom:22px;line-height:1.65;max-width:380px;} .hero-form{display:flex;gap:10px;margin-bottom:14px;flex-wrap:wrap;} .sel-w{position:relative;flex:1;min-width:200px;} .sel-w select{width:100%;padding:11px 32px 11px 14px;border:1.5px solid var(--border);border-radius:30px;font-family:inherit;font-size:.87rem;color:var(--text-m);appearance:none;background:#fff;cursor:pointer;outline:none;transition:border-color .2s;} .sel-w select:focus{border-color:var(--navy);} .sel-w::after{content:'\f0d7';font-family:'Font Awesome 6 Free';font-weight:900;position:absolute;right:13px;top:50%;transform:translateY(-50%);color:var(--text-l);pointer-events:none;font-size:.68rem;} .hero-img{flex:0 0 52%;align-self:flex-end;} .hero-ph{width:420px;height:320px;background:linear-gradient(135deg,#e8f0fb,#d0ddf4);border-radius:18px 18px 0 0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;} .hero-ph i{font-size:5rem;color:rgba(27,58,107,.2);} .hero-ph p{font-size:.8rem;color:rgba(27,58,107,.35);} /* ── INFO BAR ── */ .ibar{background:var(--navy);padding:13px 0;} .ibar-in{max-width:1160px;margin:0 auto;padding:0 40px;display:flex;align-items:center;gap:20px;flex-wrap:wrap;} .ibi{display:flex;align-items:center;gap:12px;flex:1;min-width:180px;} .ibi-ic{width:38px;height:38px;background:rgba(255,255,255,.12);border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;} .ibi-ic i{color:#fff;font-size:.95rem;} .ibi-lbl{font-family:'Montserrat',sans-serif;font-weight:800;font-size:.88rem;color:#fff;} .ibi-det{font-size:.7rem;color:rgba(255,255,255,.7);line-height:1.5;margin-top:2px;} .ibi-btn{background:var(--orange);color:#fff;font-family:inherit;font-weight:700;font-size:.8rem;line-height:1;padding:9px 20px;border-radius:30px;border:none;cursor:pointer;transition:.2s;white-space:nowrap;flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;gap:7px;} .ibi-btn:hover{background:var(--orange-l);} .ibi-btn i{font-size:.82em;line-height:1;} .ibi-div{width:1px;height:38px;background:rgba(255,255,255,.2);flex-shrink:0;} /* ── SECTIONS ── */ section{padding:60px 0;} .inner{max-width:1160px;margin:0 auto;padding:0 40px;} .sec-h{font-family:'Montserrat',sans-serif;font-weight:400;font-size:2.2rem;color:var(--text);text-align:center;margin-bottom:6px;line-height:1.2;} .sec-h .hl{color:var(--navy);font-weight:800;} .sec-h .bl{color:var(--navy);font-weight:800;} .sec-sub{text-align:center;color:var(--text-m);font-size:.91rem;margin-bottom:32px;} /* ── SERVICES CAROUSEL ── */ .svc-sec{background:#fff;position:relative;padding:60px 0 80px;z-index:3;} .globe-ring{position:absolute;inset:0;background-image:url('fondo webTATIS-web.webp');background-repeat:no-repeat;background-position:top center;background-size:1000px auto;pointer-events:none;z-index:0;} .track-wrap{position:relative;margin-top:32px;z-index:1;} .arr{position:absolute;top:55px;background:#fff;border:2px solid var(--border);border-radius:50%;width:40px;height:40px;display:flex;align-items:center;justify-content:center;cursor:pointer;z-index:20;box-shadow:0 2px 10px rgba(0,0,0,.1);transition:.2s;color:var(--navy);} .arr:hover{background:var(--navy);color:#fff;border-color:var(--navy);} .arr.lft{left:-14px;} .arr.rgt{right:-14px;} .track-clip{overflow:hidden;margin:0 14px;cursor:grab;touch-action:pan-y;user-select:none;-webkit-user-select:none;} .track-clip.dragging{cursor:grabbing;} .track{display:flex;gap:20px;will-change:transform;} .svc-card{flex-shrink:0;text-align:center;padding:20px 10px 10px;position:relative;} .svc-ic{width:120px;height:120px;background:var(--navy);border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 auto 16px;cursor:pointer;} .svc-ic i{color:#fff;font-size:2.6rem;} .svc-nm{font-family:'Montserrat',sans-serif;font-weight:800;font-size:.93rem;color:var(--text);margin-bottom:14px;min-height:2.2em;} .svc-dd{position:relative;display:inline-block;} .svc-btn{background:var(--orange);color:#fff;padding:8px 20px;border-radius:20px;font-size:.8rem;font-weight:700;border:none;cursor:pointer;transition:.2s;font-family:inherit;} .svc-btn:hover{background:var(--orange-l);} .svc-menu{display:none;background:#fff;border:1.5px solid var(--border);border-radius:10px;box-shadow:0 8px 28px rgba(0,0,0,.15);min-width:210px;overflow:hidden;} .svc-menu.open{display:block;} .svc-menu a{display:block;padding:9px 16px;font-size:.82rem;color:var(--text);text-decoration:none;transition:.15s;cursor:default;} .svc-menu a:hover{background:var(--navy);color:#fff;} .dots{display:flex;justify-content:center;gap:8px;margin-top:28px;} .dot{width:9px;height:9px;border-radius:50%;background:var(--border);cursor:pointer;transition:.2s;} .dot.active{background:var(--navy);} /* ── MED BANNER ── */ /* ── BRANDS CAROUSEL ── */ .brands-sec{background:#fff;padding:48px 0;} .co-marquee{overflow:hidden;position:relative;cursor:grab;touch-action:pan-y;user-select:none;-webkit-user-select:none;} .co-marquee.dragging{cursor:grabbing;} .co-track{display:flex;align-items:center;width:max-content;will-change:transform;padding:14px 0;} .co-track img{height:52px;max-width:150px;object-fit:contain;margin:0 44px;filter:grayscale(1);opacity:.55;} @media(max-width:700px){ .brands-sec{padding:32px 0;} .co-track img{height:40px;max-width:110px;margin:0 26px;} } /* ── VIDEO ── */ .video-sec{background:#fff;padding:0 0 70px;} .video-frame{max-width:880px;margin:0 auto;border-radius:42px;overflow:hidden;box-shadow:0 14px 40px rgba(27,58,107,.18);position:relative;} .video-frame video{display:block;width:100%;aspect-ratio:16/9;border-radius:42px;background:#0a162e;cursor:pointer;} .video-cover{position:absolute;inset:0;background:rgba(10,22,46,.45);border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;border-radius:42px;padding:0;transition:background .25s;} .video-cover:hover{background:rgba(10,22,46,.3);} .vc-play{width:86px;height:86px;border-radius:50%;background:var(--orange);color:#fff;display:flex;align-items:center;justify-content:center;font-size:1.7rem;padding-left:7px;box-shadow:0 10px 30px rgba(0,0,0,.35);transition:.2s;} .video-cover:hover .vc-play{transform:scale(1.08);background:var(--orange-l);} /* ── CONTROLES DE VIDEO (sutiles: solo tras darle play, se ocultan solos) ── */ .vid-ctrls{position:absolute;left:0;right:0;bottom:0;z-index:4;display:flex;align-items:center;gap:10px;padding:13px 18px 15px;background:linear-gradient(to top,rgba(10,22,46,.55),rgba(10,22,46,0));opacity:0;transform:translateY(6px);pointer-events:none;transition:opacity .35s ease,transform .35s ease;} .video-frame.started:hover .vid-ctrls,.video-frame.started.ctrls-show .vid-ctrls,.video-frame.started.paused .vid-ctrls{opacity:1;transform:none;pointer-events:auto;} .vcx-btn{background:none;border:none;color:#fff;cursor:pointer;font-size:.88rem;width:30px;height:30px;display:flex;align-items:center;justify-content:center;border-radius:50%;flex-shrink:0;opacity:.9;transition:opacity .2s ease,background .2s ease,transform .2s ease;} .vcx-btn:hover{opacity:1;background:rgba(255,255,255,.16);} .vcx-btn:active{transform:scale(.9);} .vcx-time{color:rgba(255,255,255,.85);font-size:.72rem;font-weight:700;font-variant-numeric:tabular-nums;flex-shrink:0;letter-spacing:.02em;} .vcx-seek{position:relative;flex:1;height:18px;display:flex;align-items:center;cursor:pointer;min-width:40px;touch-action:none;} .vcx-seek-track{position:absolute;left:0;right:0;height:3px;background:rgba(255,255,255,.28);border-radius:3px;transition:height .2s ease;} .vcx-seek:hover .vcx-seek-track,.video-frame.dragging .vcx-seek-track{height:5px;} .vcx-seek-fill{position:absolute;left:0;top:0;bottom:0;width:0;background:var(--orange);border-radius:3px;} .vcx-seek-knob{position:absolute;top:50%;left:0;width:11px;height:11px;border-radius:50%;background:#fff;box-shadow:0 1px 4px rgba(0,0,0,.45);transform:translate(-50%,-50%) scale(0);transition:transform .2s ease;pointer-events:none;} .vcx-seek:hover .vcx-seek-knob,.video-frame.dragging .vcx-seek-knob{transform:translate(-50%,-50%) scale(1);} .vcx-vol-wrap{display:flex;align-items:center;flex-shrink:0;} .vcx-vol{width:0;opacity:0;overflow:hidden;transition:width .28s ease,opacity .28s ease;display:flex;align-items:center;} .vcx-vol-wrap:hover .vcx-vol,.vcx-vol-wrap:focus-within .vcx-vol{width:70px;opacity:1;} input.vcx-range{-webkit-appearance:none;appearance:none;width:64px;height:3px;border-radius:3px;background:rgba(255,255,255,.32);outline:none;cursor:pointer;margin:0 2px 0 4px;} input.vcx-range::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:11px;height:11px;border-radius:50%;background:#fff;cursor:pointer;box-shadow:0 1px 3px rgba(0,0,0,.4);} input.vcx-range::-moz-range-thumb{width:11px;height:11px;border:none;border-radius:50%;background:#fff;cursor:pointer;} @media(max-width:600px){ .vid-ctrls{padding:9px 12px 11px;gap:7px;} .vcx-time{font-size:.66rem;} /* en el celular el volumen se maneja con los botones del teléfono: dejamos solo el mute */ .vcx-vol-wrap:hover .vcx-vol,.vcx-vol-wrap:focus-within .vcx-vol{width:0;opacity:0;} } @media (prefers-reduced-motion:reduce){ .vid-ctrls{transition:opacity .2s ease;} .vcx-seek-track,.vcx-seek-knob,.vcx-btn{transition:none;} } /* ── CONTACT STRIP ── */ .cs{background:#fff;padding:60px 0;} .cs-in{max-width:880px;margin:0 auto;display:flex;align-items:center;gap:56px;} .cs-img{flex:0 0 280px;} .cs-frame{width:280px;height:250px;background:var(--navy);border-radius:18px;display:flex;align-items:center;justify-content:center;} .cs-frame i{font-size:5rem;color:rgba(255,255,255,.18);} .cs-txt{flex:1;} .cs-txt h2{font-family:'Montserrat',sans-serif;font-weight:400;font-size:2.8rem;color:var(--text);line-height:1.15;margin-bottom:18px;} .cs-txt h2 .hl{color:var(--navy);font-weight:800;} .cs-txt h2 .bl{color:var(--navy);font-weight:800;} .cs-acts{display:flex;align-items:center;gap:12px;flex-wrap:wrap;} .cs-acts span{font-weight:700;color:var(--text-m);font-size:.88rem;} /* ── CHRONIC ── */ .chronic{background:linear-gradient(180deg,#fff 0,#f2f5f9 140px);padding:72px 0 96px;position:relative;overflow:hidden;} .chr-bg{position:absolute;right:-80px;top:50%;transform:translateY(-50%);width:480px;opacity:.07;pointer-events:none;user-select:none;} .chr-in{max-width:880px;margin:0 auto;display:flex;align-items:center;position:relative;z-index:1;} .chr-card{background:var(--navy);border-radius:28px;padding:52px 110px 52px 56px;flex:1;position:relative;overflow:visible;} .chr-txt h2{font-family:'Montserrat',sans-serif;font-weight:800;font-size:2.4rem;color:#fff;line-height:1.2;margin-bottom:16px;} .chr-txt h2 strong{font-weight:800;} .chr-txt p{color:rgba(255,255,255,.8);font-size:.95rem;margin-bottom:0;} .chr-ph{display:none;} .chr-btn-wrap{position:absolute;bottom:-26px;left:56px;} .chr-photo-wrap{flex:0 0 auto;margin-left:-80px;z-index:2;align-self:center;} .chr-ring{width:340px;height:340px;border-radius:50%;border:18px solid var(--orange);background:#f2f5f9;position:relative;overflow:hidden;} .chr-ring img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 20%;transform:scale(1.25);transform-origin:center 20%;} /* ── FOOTER ── */ footer{background:var(--footer-bg);padding:44px 0 20px;margin-top:auto;} .ft-g{max-width:1160px;margin:0 auto;padding:0 40px;display:grid;grid-template-columns:100px 1fr 1fr 1fr;gap:34px;align-items:start;} .ft-logo svg{width:78px;height:78px;fill:none;stroke:#fff;stroke-width:1.3;opacity:.8;} .ft-logo-img{width:78px;height:78px;object-fit:contain;opacity:.92;} .fc h4{font-family:'Montserrat',sans-serif;font-weight:800;font-size:.92rem;color:#fff;margin-bottom:12px;} .fc-lks{display:grid;grid-template-columns:1fr 1fr;gap:5px 14px;} .fc-lks a{color:rgba(255,255,255,.62);font-size:.78rem;text-decoration:none;transition:.2s;cursor:pointer;} .fc-lks a:hover{color:#fff;} .fc-ct p{color:rgba(255,255,255,.62);font-size:.78rem;line-height:1.85;} .ft-soc{display:flex;gap:10px;margin-top:4px;} .ft-soc a{width:34px;height:34px;border-radius:50%;background:rgba(255,255,255,.1);display:flex;align-items:center;justify-content:center;color:#fff;font-size:.82rem;text-decoration:none;transition:.2s;cursor:pointer;} .ft-soc a:hover{background:var(--orange);} .ft-bot{max-width:1160px;margin:20px auto 0;border-top:1px solid rgba(255,255,255,.1);padding:14px 40px 0;text-align:center;color:rgba(255,255,255,.32);font-size:.72rem;} /* ── MY BENEFITS PAGE ── */ .bpage{max-width:980px;margin:0 auto;} .bsrch{display:flex;gap:12px;align-items:center;justify-content:center;margin-bottom:28px;flex-wrap:wrap;} .tpa-grp{border:1.5px solid var(--border);border-radius:16px;overflow:visible;background:#fff;box-shadow:0 2px 12px rgba(0,0,0,.05);margin-bottom:22px;} /* Header */ .tpa-hd{text-align:center;padding:22px 20px 14px;border-bottom:1px solid var(--border);background:#fafbfd;border-radius:16px 16px 0 0;} .tpa-hd img{max-height:46px;max-width:200px;object-fit:contain;} .tpa-nm{font-family:'Montserrat',sans-serif;font-weight:800;font-size:1.1rem;color:var(--navy);margin-top:4px;} .tpa-note{font-size:.72rem;color:var(--text-l);margin-top:3px;} /* Logo de cada grupo como enlace al portal de elegibilidad */ .tpa-link{display:block;text-decoration:none;color:inherit;cursor:pointer;border-radius:12px;padding:2px 6px;transition:transform .25s cubic-bezier(.22,1,.36,1);} .tpa-link:hover{transform:translateY(-2px);} .tpa-link:hover img{filter:brightness(1.04);} .tpa-link:hover .tpa-note{color:var(--orange);} .tpa-link .tpa-note::after{content:'\f08e';font-family:'Font Awesome 6 Free';font-weight:900;font-size:.6rem;margin-left:5px;opacity:.65;vertical-align:middle;} /* Company chips */ .cos-wrap{padding:18px 24px;display:flex;flex-wrap:wrap;gap:12px;justify-content:center;} .co-chip{display:flex;flex-direction:column;align-items:center;gap:7px;padding:12px 14px;border-radius:10px;border:1.5px solid var(--border);cursor:pointer;transition:.2s;min-width:115px;max-width:155px;text-align:center;background:#fff;} .co-chip:hover{border-color:var(--navy-l);background:#f0f5ff;} .co-chip.sel{border-color:var(--orange);background:#fff9f0;box-shadow:0 0 0 2px rgba(245,144,10,.15);} .co-chip img{max-height:36px;max-width:100px;object-fit:contain;} .co-chip .co-nm{font-size:.7rem;font-weight:700;color:var(--text-m);line-height:1.3;} /* When image breaks, show icon */ .co-chip .ic-fallback{font-size:1.8rem;color:var(--navy-l);} /* Detail panel */ .co-detail{display:none;padding:22px 26px;border-top:1px solid var(--border);background:var(--gray-bg);} .co-detail.open{display:block;} .co-dh{display:flex;align-items:center;gap:14px;margin-bottom:14px;flex-wrap:wrap;} .co-dh img{max-height:40px;max-width:130px;object-fit:contain;} .co-dh h3{font-family:'Montserrat',sans-serif;font-weight:800;color:var(--navy);font-size:1rem;} .co-tags{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:14px;} .ctag{background:var(--navy);color:#fff;font-size:.7rem;font-weight:700;padding:4px 11px;border-radius:20px;} .co-note{font-size:.82rem;color:var(--text-m);line-height:1.7;margin-bottom:14px;background:#eef3ff;border-left:3px solid var(--navy);padding:10px 14px;border-radius:0 8px 8px 0;} .cpt{width:100%;border-collapse:collapse;font-size:.82rem;} .cpt th{background:var(--navy);color:#fff;padding:9px 14px;text-align:left;font-weight:700;} .cpt td{padding:8px 14px;border-bottom:1px solid var(--border);} .cpt tr:last-child td{border:none;} .cpt tr:nth-child(even) td{background:#eef2f8;} .tpa-ft{padding:10px 24px 18px;text-align:center;border-top:1px solid var(--border);} /* ── ABOUT ── */ .about-hero{background:#fff;background-image:url('fondo webTATIS-web.webp');background-repeat:no-repeat;background-position:top center;background-size:1000px auto;padding:60px 28px;position:relative;overflow:hidden;} .pcards{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:32px;} .pc{background:#fff;border:1.5px solid var(--border);border-radius:16px;padding:26px;position:relative;overflow:hidden;} .pc::before{content:'';position:absolute;top:0;left:0;width:4px;height:100%;background:var(--navy);} .pc-n{font-family:'Montserrat',sans-serif;font-weight:700;font-size:2.8rem;color:rgba(27,58,107,.07);position:absolute;top:8px;right:14px;} .pc-t{font-family:'Montserrat',sans-serif;font-weight:800;font-size:1.08rem;color:var(--navy);margin-bottom:8px;} .pc-tx{font-size:.85rem;color:var(--text-m);line-height:1.72;} /* ── MEXICO NETWORK ── */ .net-g{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:32px;} .nc{text-align:center;padding:22px 12px;background:#fff;border:1.5px solid var(--border);border-radius:16px;box-shadow:0 2px 10px rgba(0,0,0,.04);position:relative;} /* ── CONTACT ── */ .cont-page{padding:60px 28px;} .cont-in{max-width:1000px;margin:0 auto;} .off-g{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:28px;} .off-c{background:#fff;border:1.5px solid var(--border);border-radius:16px;padding:22px;box-shadow:0 2px 10px rgba(0,0,0,.05);display:flex;flex-direction:column;} .off-c h3{font-family:'Montserrat',sans-serif;font-weight:800;color:var(--navy);font-size:.95rem;margin-bottom:12px;display:flex;align-items:center;gap:8px;} .off-c h3 i{color:var(--orange);} .off-inf{font-size:.81rem;color:var(--text-m);line-height:1.85;flex:1;} .off-inf strong{color:var(--text);} .off-map{width:100%;height:170px;border-radius:10px;border:none;margin-top:12px;} .cont-form{background:#fff;border:1.5px solid var(--border);border-radius:18px;padding:30px;margin-top:24px;} .cont-form h3{font-family:'Montserrat',sans-serif;font-weight:800;font-size:1.2rem;color:var(--text);margin-bottom:20px;} .fg{margin-bottom:15px;} .fg label{display:block;font-weight:700;font-size:.8rem;color:var(--text);margin-bottom:4px;} .fg input,.fg select,.fg textarea{width:100%;padding:10px 13px;border:1.5px solid var(--border);border-radius:10px;font-family:inherit;font-size:.87rem;color:var(--text);outline:none;transition:border-color .2s;} .fg input:focus,.fg select:focus,.fg textarea:focus{border-color:var(--navy);} .fg textarea{height:108px;resize:vertical;} .fr{display:grid;grid-template-columns:1fr 1fr;gap:13px;} /* ── MED PROGRAM ── */ .med-pg{padding:60px 28px;text-align:center;position:relative;background-image:url('fondo webTATIS-web.webp');background-repeat:no-repeat;background-position:top center;background-size:1000px auto;} .med-pg h1{font-family:'Montserrat',sans-serif;font-weight:800;font-size:2.7rem;color:var(--navy);margin-bottom:12px;} .med-lead{max-width:540px;margin:0 auto 22px;color:var(--text-m);font-size:.92rem;line-height:1.7;} .med-lead strong{color:var(--navy);} .cond-tags{display:flex;flex-wrap:wrap;justify-content:center;gap:9px;margin:20px auto;max-width:480px;} .ctg{background:var(--navy);color:#fff;font-size:.82rem;font-weight:700;padding:7px 17px;border-radius:20px;} .med-steps{display:flex;justify-content:center;align-items:flex-end;gap:44px;margin-top:40px;flex-wrap:wrap;} .ms{text-align:center;flex:0 0 170px;} .ms-img{width:148px;height:148px;margin:0 auto 12px;background:var(--gray-bg);border-radius:16px;display:flex;align-items:center;justify-content:center;} .ms-img i{font-size:3.6rem;color:var(--navy-l);} .ms-lbl{display:inline-block;border:1.5px solid var(--border);border-radius:20px;padding:5px 17px;font-size:.79rem;font-weight:700;color:var(--text);} .med-info{max-width:680px;margin:40px auto 0;background:var(--gray-bg);border-radius:16px;padding:26px;text-align:left;} .med-info h2{font-family:'Montserrat',sans-serif;font-weight:800;color:var(--navy);margin-bottom:14px;font-size:1.05rem;} .med-scards{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;} .msc-n{font-weight:800;color:var(--orange);margin-bottom:4px;font-size:.83rem;} .msc p{font-size:.81rem;color:var(--text-m);line-height:1.7;} /* ── ELIGIBILITY ── */ .elig-pg{padding:60px 28px;} .elig-in{max-width:660px;margin:0 auto;} .elig-frm{background:#fff;border:1.5px solid var(--border);border-radius:18px;padding:34px;box-shadow:0 4px 20px rgba(0,0,0,.07);} /* ── RESPONSIVE ── */ @media(max-width:1024px){ .net-g{grid-template-columns:repeat(3,1fr);} .ft-g{grid-template-columns:80px 1fr 1fr;} .ft-g .fc:last-child{grid-column:1/-1;} } @media(max-width:768px){ .nav-links,.nav-ph{display:none;} .ham{display:flex;} .drawer{display:block;} h1.hero-h{font-size:2rem;} .hero{padding:36px 18px 0;} .hero-in{flex-direction:column;gap:20px;min-height:unset;} .hero-img{width:90%;max-width:420px;flex:none;margin:0 auto;} .hero-txt{padding-bottom:0;} .hero-ph{height:230px;} .ibar{padding:18px 20px;} .ibar-in{flex-direction:column;gap:0;align-items:stretch;} .ibi{flex-wrap:nowrap;align-items:center;gap:14px;padding:18px 0;} .ibi>div:not(.ibi-ic){flex:1;min-width:0;} .ibi-ic{width:42px;height:42px;flex-shrink:0;} .ibi-lbl{font-size:.9rem;} .ibi-det{font-size:.7rem;} .ibi-btn{margin-left:auto;flex-shrink:0;font-size:.8rem;padding:9px 20px;} .ibi-div{display:block;width:100%;height:1px;background:rgba(255,255,255,.2);flex-shrink:0;} section,.svc-sec,.cs,.cont-page,.elig-pg,.med-pg{padding:44px 0;} .inner,.hero-in,.ibar-in,.ft-g,.ft-bot,.nav-in{padding-left:20px;padding-right:20px;} .sec-h{font-size:1.65rem;} .svc-card{flex:0 0 100%!important;} .cs-in{flex-direction:column;gap:24px;} .cs-img,.cs-frame{width:100%;flex:none;} .cs-frame{height:200px;} .chronic{padding:60px 0 88px;} .chr-in{flex-direction:column-reverse;text-align:center;gap:0;} .chr-card{border-radius:20px;padding:90px 28px 52px;overflow:visible;width:100%;box-sizing:border-box;} .chr-photo-wrap{margin-left:0;margin-bottom:-50px;align-self:center;} .chr-btn-wrap{position:absolute;bottom:-24px;left:50%;transform:translateX(-50%);} .chr-ring{width:220px;height:220px;} .ft-g{grid-template-columns:1fr;gap:20px;text-align:center;} .ft-soc,.fc-lks{justify-content:center;} .ft-g .fc:last-child{grid-column:auto;} .pcards{grid-template-columns:1fr;} .net-g{grid-template-columns:1fr 1fr;} .off-g{grid-template-columns:1fr;} .fr{grid-template-columns:1fr;} .med-scards{grid-template-columns:1fr;} .med-steps{gap:22px;} } /* ── DOCTORS MODAL ── */ .modal-bg{display:none;position:fixed;inset:0;z-index:99999;background:rgba(0,0,0,.55);align-items:center;justify-content:center;padding:16px;} .modal-bg.open{display:flex;} .modal-box{background:#fff;border-radius:18px;width:100%;max-width:900px;max-height:90vh;display:flex;flex-direction:column;overflow:hidden;box-shadow:0 20px 60px rgba(0,0,0,.25);} .modal-hd{background:var(--navy);padding:20px 26px;display:flex;align-items:center;justify-content:space-between;flex-shrink:0;} .modal-hd h2{font-family:'Montserrat',sans-serif;font-weight:800;font-size:1.15rem;color:#fff;display:flex;align-items:center;gap:10px;} .modal-hd h2 i{color:var(--orange);} .modal-close{background:rgba(255,255,255,.15);border:none;color:#fff;width:34px;height:34px;border-radius:50%;cursor:pointer;font-size:1rem;display:flex;align-items:center;justify-content:center;transition:.2s;flex-shrink:0;} .modal-close:hover{background:rgba(255,255,255,.3);} .modal-search{padding:16px 26px 12px;flex-shrink:0;border-bottom:1px solid var(--border);} .modal-search input{width:100%;padding:10px 14px 10px 38px;border:1.5px solid var(--border);border-radius:30px;font-family:inherit;font-size:.87rem;outline:none;transition:.2s;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%238898aa' stroke-width='2'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cpath d='m21 21-4.35-4.35'/%3E%3C/svg%3E") no-repeat 12px center;} .modal-search input:focus{border-color:var(--navy);} .modal-body{overflow-y:auto;flex:1;} .doc-count{padding:10px 26px 4px;font-size:.78rem;color:var(--text-l);font-weight:700;} .doc-table{width:100%;border-collapse:collapse;font-size:.82rem;} .doc-table thead{position:sticky;top:0;z-index:10;} .doc-table th{background:var(--navy);color:#fff;padding:10px 16px;text-align:left;font-weight:700;font-size:.78rem;white-space:nowrap;} .doc-table td{padding:9px 16px;border-bottom:1px solid var(--border);vertical-align:top;} .doc-table tr:nth-child(even) td{background:#f8fafd;} .doc-table tr:hover td{background:#eef3ff;} .doc-name{font-weight:700;color:var(--navy);} .doc-spec{display:inline-block;background:rgba(27,58,107,.1);color:var(--navy);font-size:.7rem;font-weight:700;padding:2px 9px;border-radius:20px;margin-top:3px;} .doc-phone{color:var(--orange);font-weight:700;white-space:nowrap;} .doc-phone a{color:inherit;text-decoration:none;} .doc-addr{color:#1a1a1a;font-size:.78rem;line-height:1.45;} .no-results{text-align:center;padding:40px;color:var(--text-l);font-size:.9rem;} .staff-btn{background:none;border:none;color:var(--orange);cursor:pointer;font-size:.72rem;font-weight:700;padding:3px 0 0;display:block;letter-spacing:.01em;} .staff-btn:hover{text-decoration:underline;} .staff-row td{padding:0 12px 10px 12px;background:#f5f8fd;} .staff-tbl{width:100%;border-collapse:collapse;} .staff-tbl tr:first-child .st-name,.staff-tbl tr:first-child .st-spec{padding-top:8px;} .st-name{padding:4px 16px 4px 0;font-weight:700;font-size:.78rem;color:var(--navy);white-space:nowrap;} .st-spec{padding:4px 0;font-size:.78rem;color:var(--text-m);} .gs-item{display:flex;align-items:flex-start;gap:14px;padding:13px 26px;border-bottom:1px solid var(--border);cursor:pointer;transition:.15s;} .gs-item:nth-child(even){background:#f8fafd;} .gs-item:hover{background:#eef3ff;} .gs-icon{width:34px;height:34px;border-radius:50%;background:rgba(27,58,107,.1);color:var(--navy);display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:.85rem;margin-top:1px;} .gs-main{flex:1;min-width:0;} .gs-top{display:flex;align-items:center;gap:8px;flex-wrap:wrap;} .gs-city{color:var(--text-l);font-size:.68rem;font-weight:800;text-transform:uppercase;letter-spacing:.04em;white-space:nowrap;} .gs-matched{color:var(--text-l);font-size:.76rem;font-style:italic;margin-top:2px;} @media(max-width:480px){ .hero-form{flex-direction:column;} .net-g{grid-template-columns:1fr 1fr;} h1.hero-h{font-size:1.8rem;} .med-pg h1{font-size:2rem;} } /* ── WELCOME POPUP ── */ #welcomeOverlay{position:fixed;inset:0;background:rgba(10,22,46,.65);z-index:99998;display:flex;align-items:center;justify-content:center;padding:20px;opacity:0;pointer-events:none;transition:opacity .45s ease;} #welcomeOverlay.open{opacity:1;pointer-events:all;} #welcomePopup{position:relative;background:#fff;border-radius:18px;max-width:560px;width:100%;max-height:90vh;overflow-y:auto;box-shadow:0 24px 64px rgba(10,22,46,.35);transform:translateY(28px) scale(.97);transition:transform .45s cubic-bezier(.22,1,.36,1),opacity .45s ease;opacity:0;} #welcomeOverlay.open #welcomePopup{transform:translateY(0) scale(1);opacity:1;} #welcomeClose{position:absolute;top:14px;right:14px;background:#fff;border:none;width:34px;height:34px;border-radius:50%;cursor:pointer;font-size:.95rem;line-height:1;color:#1a2540;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 14px rgba(0,0,0,.3);transition:transform .2s cubic-bezier(.22,1,.36,1),background .2s ease,color .2s ease;z-index:5;} #welcomeClose:hover{background:#f0f2f6;color:#000;transform:scale(1.08);} #welcomeCall{position:absolute;left:4.7%;top:79.3%;width:29.7%;height:14%;display:flex;align-items:center;justify-content:center;gap:8px;background:var(--orange);color:#fff;border-radius:12px;font-weight:800;font-size:clamp(.72rem,2.4vw,.95rem);text-decoration:none;box-shadow:0 6px 18px rgba(245,144,10,.35);transition:.2s;} #welcomeCall:hover{background:var(--orange-l);transform:translateY(-2px);box-shadow:0 8px 22px rgba(245,144,10,.45);} #langSwitch{display:flex;align-items:center;background:rgba(255,255,255,.12);border:1.5px solid rgba(255,255,255,.28);border-radius:22px;padding:2px;cursor:pointer;gap:0;flex-shrink:0;} #langSwitch:hover{border-color:rgba(255,255,255,.45);} .ls-opt{display:flex;align-items:center;gap:4px;padding:3px 9px;border-radius:18px;font-size:.95rem;line-height:1;color:rgba(255,255,255,.6);transition:.2s;} .ls-opt span{font-size:.65rem;font-weight:800;letter-spacing:.04em;} .ls-opt.active{background:rgba(255,255,255,.22);color:#fff;} .nav-actions{display:flex;align-items:center;gap:10px;flex-shrink:0;} .global-search-btn{display:flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:50%;background:rgba(255,255,255,.12);border:1.5px solid rgba(255,255,255,.28);color:#fff;cursor:pointer;font-size:.8rem;transition:.2s;flex-shrink:0;padding:0;} .global-search-btn:hover{background:rgba(255,255,255,.22);border-color:rgba(255,255,255,.45);} /* ── SPLASH ── */ #splash{position:fixed;inset:0;background:var(--navy);z-index:999999;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0;transition:transform .65s cubic-bezier(.4,0,.2,1);} #splash.hide{transform:translateY(-100%);pointer-events:none;} #splash-logos{display:flex;flex-direction:row;align-items:center;justify-content:center;gap:140px;} #splash-logos img{opacity:0;animation:splashLogoIn .75s cubic-bezier(.22,1,.36,1) forwards;} #splash-logos img:nth-child(1){animation-delay:.1s;} #splash-logos img:nth-child(2){animation-delay:.35s;} #splash-logos img:nth-child(3){animation-delay:.6s;} #splash-logo{width:min(240px,32vw);filter:brightness(0) invert(1);} .splash-side-logo{width:min(110px,14vw);} .splash-invert{filter:brightness(0) invert(1);} #splash-bar{position:absolute;bottom:0;left:0;height:3px;background:var(--orange);width:0;animation:barGrow 1.5s cubic-bezier(.4,0,.2,1) .1s forwards;} @keyframes splashLogoIn{from{opacity:0;transform:translateY(14px);}to{opacity:1;transform:translateY(0);}} @keyframes barGrow{to{width:100%;}} @media(max-width:600px){ #splash-logos{flex-direction:column;gap:72px;} #splash-logo{width:min(180px,48vw);} .splash-side-logo{width:min(85px,28vw);} } /* ── PAGE ENTRANCE ── */ .anim-ready nav{animation:aniNavDown .8s cubic-bezier(.22,1,.36,1) both;} .anim-ready .hero-txt{animation:aniFadeUp 1s cubic-bezier(.22,1,.36,1) .2s both;} .anim-ready .hero-img{animation:aniFadeRight 1s cubic-bezier(.22,1,.36,1) .38s both;} .anim-ready .ibar{animation:aniFadeUp .9s cubic-bezier(.22,1,.36,1) .55s both;} .anim-ready .svc-sec{animation:aniFadeUp .9s cubic-bezier(.22,1,.36,1) .68s both;} .anim-ready .video-sec{animation:aniFadeUp .9s cubic-bezier(.22,1,.36,1) .78s both;} .anim-ready .brands-sec{animation:aniFadeUp .9s cubic-bezier(.22,1,.36,1) .88s both;} .anim-ready .cs{animation:aniFadeUp .9s cubic-bezier(.22,1,.36,1) .9s both;} @keyframes aniNavDown{from{transform:translateY(-100%);opacity:0;}to{transform:translateY(0);opacity:1;}} @keyframes aniFadeUp{from{transform:translateY(36px);opacity:0;}to{transform:translateY(0);opacity:1;}} @keyframes aniFadeRight{from{transform:translateX(48px);opacity:0;}to{transform:translateX(0);opacity:1;}} /* ══════════════════════════════════════════════════════════ CAPA DE PULIDO UI/UX — vista previa v2 Mismo layout, misma paleta (solo se usan los tokens que YA existían: --navy, --navy-l, --navy-d, --orange, --orange-l), misma composición. Lo que cambia: profundidad REAL y visible en reposo (degradados con esos mismos tonos, sombras en capas, glow en los CTA), tipografía más ajustada en títulos, además de las transiciones/foco/scrollbar de la v1. ══════════════════════════════════════════════════════════ */ /* Renderizado de texto más nítido */ body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility;} /* Selección de texto en la marca */ ::selection{background:var(--orange);color:#fff;} /* Scrollbar con la paleta de la marca (mismo tono navy) */ ::-webkit-scrollbar{width:10px;height:10px;} ::-webkit-scrollbar-track{background:transparent;} ::-webkit-scrollbar-thumb{background:rgba(27,58,107,.25);border-radius:20px;border:2.5px solid transparent;background-clip:padding-box;} ::-webkit-scrollbar-thumb:hover{background:rgba(27,58,107,.45);background-clip:padding-box;} html{scrollbar-width:thin;scrollbar-color:rgba(27,58,107,.3) transparent;} /* Estados de foco visibles y accesibles (navegación por teclado) */ a:focus-visible,button:focus-visible,.btn:focus-visible,.svc-btn:focus-visible, .staff-btn:focus-visible,.modal-close:focus-visible,.global-search-btn:focus-visible, .co-chip:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible, .arr:focus-visible,.dot:focus-visible{ outline:2.5px solid var(--orange);outline-offset:2px; } /* Tipografía de titulares — tracking más ajustado, look más "diseñado" */ h1.hero-h,.cs-txt h2,.chr-txt h2,.med-pg h1,.sec-h,.tpa-nm{letter-spacing:-.015em;} /* ── BOTONES: brillo (sheen) sutil sobre el color plano, ya no un degradado marcado de dos tonos ── */ .btn{transition:transform .3s cubic-bezier(.22,1,.36,1),box-shadow .3s cubic-bezier(.22,1,.36,1),filter .25s ease;} .btn:active{transform:translateY(0) scale(.97);} .btn-o{background:linear-gradient(180deg,rgba(255,255,255,.16) 0%,rgba(255,255,255,0) 55%),var(--orange);box-shadow:0 3px 9px rgba(245,144,10,.2);} .btn-o:hover{filter:brightness(1.04);box-shadow:0 5px 14px rgba(245,144,10,.28);} .btn-n{background:linear-gradient(180deg,rgba(255,255,255,.12) 0%,rgba(255,255,255,0) 55%),var(--navy);box-shadow:0 3px 9px rgba(27,58,107,.22);} .btn-n:hover{filter:brightness(1.06);box-shadow:0 5px 14px rgba(27,58,107,.3);} .svc-btn,.ibi-btn{ background:linear-gradient(180deg,rgba(255,255,255,.16) 0%,rgba(255,255,255,0) 55%),var(--orange); box-shadow:0 2px 7px rgba(245,144,10,.18); transition:transform .3s cubic-bezier(.22,1,.36,1),box-shadow .3s cubic-bezier(.22,1,.36,1),filter .25s ease; } .svc-btn:hover,.ibi-btn:hover{filter:brightness(1.04);transform:translateY(-1px);box-shadow:0 4px 12px rgba(245,144,10,.26);} .svc-btn:active{transform:translateY(0) scale(.96);} .staff-btn,.modal-close,.global-search-btn,.arr,.dot,.ft-soc a{ transition:transform .3s cubic-bezier(.22,1,.36,1),box-shadow .3s cubic-bezier(.22,1,.36,1),background-color .25s ease,border-color .25s ease,color .25s ease; } .modal-close:active,.global-search-btn:active{transform:scale(.92);} .arr:hover{box-shadow:0 6px 18px rgba(27,58,107,.22);} .arr:active{transform:scale(.94);} .dot:hover{transform:scale(1.3);} .ft-soc a:hover{transform:translateY(-2px);} /* ── NAV / CABECERAS NAVY: lavado sutil (no degradado marcado), mismo azul con un toque de volumen ── */ nav{background:linear-gradient(180deg,rgba(0,0,0,0) 0%,rgba(0,0,0,.14) 100%),var(--navy);box-shadow:0 4px 20px rgba(9,20,40,.28);} .modal-hd{background:linear-gradient(135deg,rgba(0,0,0,0) 0%,rgba(0,0,0,.14) 100%),var(--navy);} .doc-table thead th,.cpt th{background:linear-gradient(135deg,rgba(0,0,0,0) 0%,rgba(0,0,0,.14) 100%),var(--navy);} .chr-card{background:linear-gradient(135deg,var(--navy-l) 0%,var(--navy) 55%,var(--navy-d) 100%);box-shadow:0 22px 50px rgba(9,20,40,.4);} .cs-frame{background:linear-gradient(135deg,var(--navy-l) 0%,var(--navy) 100%);box-shadow:0 16px 36px rgba(27,58,107,.3);} .ctag,.ctg{background:linear-gradient(135deg,var(--navy-l) 0%,var(--navy) 100%);} /* ── ÍCONOS: degradado + glow permanente, no solo en hover ── */ .svc-ic{ background:linear-gradient(145deg,var(--navy-l) 0%,var(--navy) 55%,var(--navy-d) 100%); box-shadow:0 10px 22px rgba(27,58,107,.35),0 2px 4px rgba(255,255,255,.15) inset; transition:transform .35s cubic-bezier(.22,1,.36,1),box-shadow .35s cubic-bezier(.22,1,.36,1); } .svc-card:hover .svc-ic{transform:scale(1.06) translateY(-2px);box-shadow:0 16px 32px rgba(27,58,107,.42),0 2px 4px rgba(255,255,255,.2) inset;} .ibi-ic{transition:transform .35s cubic-bezier(.22,1,.36,1);} .ibi:hover .ibi-ic{transform:scale(1.08);} /* ── TARJETAS: sombra real en reposo (no solo al hover) + filo superior brillante ── */ .nc,.off-c,.pc,.tpa-grp{ box-shadow:0 1px 0 rgba(255,255,255,.8) inset,0 2px 6px rgba(10,22,46,.05),0 12px 26px rgba(10,22,46,.08); transition:transform .35s cubic-bezier(.22,1,.36,1),box-shadow .35s cubic-bezier(.22,1,.36,1),border-color .25s ease; } .co-chip{transition:transform .35s cubic-bezier(.22,1,.36,1),box-shadow .35s cubic-bezier(.22,1,.36,1),border-color .25s ease;} .tpa-grp:hover{box-shadow:0 1px 0 rgba(255,255,255,.8) inset,0 4px 14px rgba(10,22,46,.06),0 22px 44px rgba(10,22,46,.1);} /* ── SOMBRAS EN CAPAS (ambient + key light) en overlays existentes, mismo tono navy ── */ .modal-box{box-shadow:0 2px 6px rgba(10,22,46,.1),0 26px 64px rgba(10,22,46,.22);} .elig-frm{box-shadow:0 2px 8px rgba(10,22,46,.05),0 18px 40px rgba(10,22,46,.1);} .video-frame{box-shadow:0 4px 14px rgba(27,58,107,.12),0 26px 60px rgba(27,58,107,.2);} .svc-menu{box-shadow:0 3px 10px rgba(10,22,46,.08),0 14px 34px rgba(10,22,46,.16);} /* Lavado de fondo muy sutil en el hero — solo profundidad, no niebla sobre el contenido */ .hero{background:radial-gradient(1100px 560px at 12% -12%,rgba(27,58,107,.05),transparent 60%),#fff;} /* ── Modales: entrada suave por elemento (fade + leve elevación), igual patrón que el resto del sitio ── */ .modal-bg.open{animation:modalBgIn .25s ease both;} .modal-bg.open .modal-box{animation:modalBoxIn .35s cubic-bezier(.22,1,.36,1) both;} @keyframes modalBgIn{from{opacity:0;}to{opacity:1;}} @keyframes modalBoxIn{from{opacity:0;transform:translateY(14px) scale(.98);}to{opacity:1;transform:none;}} /* ── DESPLIEGUES: todo lo que se abre con un clic entra animado, ya no aparece de golpe ── */ /* Menú "Ver más ▾" de cada servicio (se reposiciona por JS, por eso el keyframe respeta el translateX(-50%) final) */ .svc-menu{transform-origin:top center;} .svc-menu.open{animation:svcMenuIn .22s cubic-bezier(.22,1,.36,1) both;} @keyframes svcMenuIn{from{opacity:0;transform:translateX(-50%) translateY(-8px) scale(.96);}to{opacity:1;transform:translateX(-50%);}} /* Lista de médicos/equipo al abrir "Ver médicos ▾" / "Ver equipo ▾" en Hospitales y Proveedores */ .staff-tbl tr{animation:staffRowIn .3s cubic-bezier(.22,1,.36,1) both;} @keyframes staffRowIn{from{opacity:0;transform:translateY(-6px);}to{opacity:1;transform:none;}} .staff-tbl tr:nth-child(1){animation-delay:.02s} .staff-tbl tr:nth-child(2){animation-delay:.045s} .staff-tbl tr:nth-child(3){animation-delay:.07s} .staff-tbl tr:nth-child(4){animation-delay:.095s} .staff-tbl tr:nth-child(5){animation-delay:.12s} .staff-tbl tr:nth-child(6){animation-delay:.145s} .staff-tbl tr:nth-child(7){animation-delay:.17s} .staff-tbl tr:nth-child(n+8){animation-delay:.19s} /* Panel de detalle de aseguradora en "My Benefits" (pickCo) */ .co-detail.open{animation:coDetailIn .3s cubic-bezier(.22,1,.36,1) both;} @keyframes coDetailIn{from{opacity:0;transform:translateY(-10px);}to{opacity:1;transform:none;}} /* Filas de tabla — transición suave de hover */ .doc-table tr td{transition:background-color .2s ease;} /* Inputs — anillo de foco sutil, mismos colores de marca */ .sel-w select:focus,.fg input:focus,.fg select:focus,.fg textarea:focus,.modal-search input:focus{ box-shadow:0 0 0 4px rgba(27,58,107,.08); } /* ── "Pick your company": dropdown propio en vez del