﻿:root{--azul:#7aa6d1;--azul2:#226893;--azul3:#185779;--dark:#2f2f2f;--text:#666;--light:#f6f6f6;--gold:#d6a113}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:74px}body{margin:0;font-family:'Segoe UI',Arial,sans-serif;color:var(--text);background:#fff}.container{max-width:1120px;margin:auto}.topbar{height:44px;background:#2f2f2f;color:#bbb;font-size:13px}.topbar-inner{height:44px;display:flex;align-items:center;justify-content:space-between}.topbar a{color:#7fb0da;text-decoration:none}.social span{display:inline-block;margin-left:14px;color:#888}.brand-zone{background:white;height:128px}.brand-inner{position:relative;height:128px;display:flex;align-items:center;justify-content:center}.brand-logo{max-height:112px;max-width:360px;width:auto;object-fit:contain}.quick-links{position:absolute;right:0;top:32px;font-size:13px}.quick-links a{color:#aaa;text-decoration:none;margin-left:22px}.nav-wrap{background:#fff;border-top:1px solid #eee;border-bottom:1px solid #eee;position:sticky;top:0;z-index:900;box-shadow:0 8px 22px rgba(0,0,0,.08)}.main-nav{min-height:58px;display:flex;align-items:stretch;justify-content:center}.menu-toggle{display:none}.main-nav ul{list-style:none;margin:0;padding:0;display:flex}.main-nav li{position:relative}.main-nav a{height:58px;display:flex;align-items:center;padding:0 16px;border-left:1px solid #eee;color:#555;text-decoration:none;font-size:14px;white-space:nowrap}.main-nav li:last-child a{border-right:1px solid #eee}.main-nav li.active>a,.main-nav li:hover>a{color:var(--azul);background:#fafafa}.main-nav li.active:before{content:'';position:absolute;top:-5px;left:0;right:0;height:4px;background:var(--azul)}.dropdown{display:none;position:absolute;top:58px;left:0;width:205px;background:#f0f0f0;z-index:50;box-shadow:0 4px 12px #0002}.dropdown a{height:auto;padding:13px 18px;border:0;border-bottom:1px solid #ddd;color:#666;background:#eee;font-size:13px}.dropdown a:hover{background:#ddd;color:#333}.main-nav li:hover .dropdown{display:block}.phone-icon{font-size:22px;color:#4b342d!important}.page-section{display:none}.page-section.active{display:block}.hero{height:430px;position:relative;overflow:hidden;background:#020218}.slide{position:absolute;inset:0;background-position:center;background-size:cover;opacity:0;transition:opacity .7s}.slide.active{opacity:1}.hero:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#001221dd,#0f5f82aa)}.hero-layer{position:relative;z-index:2;height:100%;display:flex;align-items:center}.hero-card{width:430px;background:#ffffffee;border-left:5px solid var(--gold);padding:34px 38px;box-shadow:0 10px 30px #0003}.hero-card .tag{color:var(--azul2);font-weight:700;letter-spacing:2px;font-size:15px}.hero-card h1{margin:14px 0 16px;color:#253747;font-size:40px;line-height:1.05}.hero-card p{font-size:16px;line-height:1.7}.btn{display:inline-block;margin:12px 10px 0 0;padding:14px 24px;text-decoration:none;font-weight:700;font-size:13px}.btn.primary{background:var(--azul2);color:white}.btn.outline{border:2px solid var(--azul2);color:var(--azul2)}.btn.white{background:#fff}.dots{position:absolute;left:50%;bottom:20px;z-index:3}.dots span{display:inline-block;width:10px;height:10px;background:#fff8;border-radius:50%;margin:0 4px}.dots span.on{background:#fff}.section{padding:58px 0}.gray{background:var(--light)}.title{text-align:center;margin-bottom:34px}.title.left{text-align:left}.title h2{font-weight:400;color:#444;font-size:30px;margin:0}.title .line{width:80px;height:3px;background:var(--azul);margin:16px auto}.title.left .line{margin-left:0}.cards{display:grid;gap:24px}.cards.three{grid-template-columns:repeat(3,1fr)}.card{background:#fff;border:1px solid #eee;box-shadow:0 5px 18px #00000010;min-height:220px}.card img{width:100%;height:160px;object-fit:cover}.card .body{padding:20px}.card h3{margin:0 0 10px;color:var(--azul2);font-size:18px}.about{display:grid;grid-template-columns:1fr 1fr;gap:42px;align-items:center}.about img{width:100%;border:8px solid white;box-shadow:0 4px 18px #0002}.about h2,.about h3{font-size:30px;color:#333;margin-top:0}.about p{line-height:1.8}.inner-banner{height:270px;background:#020218;position:relative}.inner-banner:before{content:'';position:absolute;inset:0;background:linear-gradient(#00101fcc,#00101fcc),url('../img/cirugias-oftalmologo-chiclayo.jpg') center/cover}.inner-banner .container{position:relative;color:#fff;padding-top:88px}.inner-banner h1{font-size:38px;font-weight:400;margin:10px 0}.breadcrumbs{color:#9fc2dd}.content-box{background:#fff;margin-top:-42px;position:relative;z-index:2;padding:38px;box-shadow:0 5px 24px #0002}.submenu-grid{display:grid;grid-template-columns:260px 1fr;gap:30px}.side-menu a{display:block;padding:15px 18px;background:#eee;color:#666;text-decoration:none;border-bottom:1px solid #ddd}.side-menu a:hover,.side-menu a.active{background:#ddd;color:#333}.medical-list{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}.medical-item{border:1px solid #e8e8e8;padding:18px;background:#fafafa}.medical-item h3{margin-top:0;color:var(--azul2)}.timeline div{padding:17px 20px;border-left:4px solid var(--azul);background:#f7f7f7;margin-bottom:12px}.timeline b{display:block;color:#333}.timeline span{display:block;margin-top:4px}.avatar{width:90px;height:90px;border-radius:50%;background:var(--azul2);color:#fff;display:flex;align-items:center;justify-content:center;margin:24px auto 0;font-size:26px;font-weight:bold}.quotes{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.quotes blockquote{background:#f4f4f4;border-left:4px solid var(--azul);padding:22px;margin:0;font-style:italic}.contact-form{display:grid;gap:12px}.contact-form input,.contact-form textarea{width:100%;padding:14px;border:1px solid #ddd;font:inherit}.contact-form textarea{height:120px}.contact-form button{background:var(--azul2);color:#fff;border:0;padding:14px;font-weight:700}.video-box{height:280px;background:#020218;color:#fff;display:flex;align-items:center;justify-content:center;letter-spacing:2px}.contact-strip{background:var(--azul2);color:white;padding:34px 0}.contact-strip .container{display:flex;align-items:center;justify-content:space-between}.contact-strip h2{margin:0;font-weight:400}.footer{background:var(--dark);color:#aaa;padding:35px 0 20px}.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:30px}.footer h3{color:#fff;font-weight:400}.footer a{display:block;color:#bbb;text-decoration:none;margin:7px 0}.copy{border-top:1px solid #444;margin-top:26px;padding-top:18px;font-size:12px;text-align:center}.wa{position:fixed;right:24px;bottom:22px;background:#25D366;color:#fff;text-decoration:none;font-weight:700;border-radius:30px;padding:14px 22px;box-shadow:0 6px 18px #0003;z-index:100}@media(max-width:900px){.topbar{height:auto}.topbar-inner{height:auto;display:block;padding:10px}.brand-zone{height:auto}.brand-inner{height:auto;padding:20px}.quick-links{display:none}.menu-toggle{display:block;width:100%;border:0;background:var(--azul2);color:#fff;padding:14px;text-align:left;font-weight:700}.main-nav,.main-nav ul{height:auto;display:block}.main-nav ul{display:none}.main-nav ul.open{display:block}.main-nav a{height:auto;padding:14px}.dropdown{position:static;width:100%;display:block}.hero{height:auto}.hero-layer{height:auto}.hero-card{width:auto;margin:40px 16px}.cards.three,.about,.footer-grid,.submenu-grid,.medical-list,.quotes{grid-template-columns:1fr}.contact-strip .container{display:block}.brand-logo{max-width:280px}}.form-status{margin:10px 0 0;font-size:14px;font-weight:700;color:#0b5b65;line-height:1.4}.admin-headline{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:22px}.admin-headline h1{margin:0 0 6px;color:#253747}.admin-tabs{display:flex;gap:8px;background:#eef4f8;border:1px solid #d9e6ef;border-radius:14px;padding:6px}.admin-tabs button{border:0;border-radius:10px;background:transparent;color:#24546f;font-weight:900;padding:10px 14px;cursor:pointer}.admin-tabs button.active{background:#226893;color:#fff;box-shadow:0 8px 18px #22689322}.admin-tab-panel{display:none}.admin-tab-panel.active{display:block}.crm-metrics{display:grid;grid-template-columns:repeat(7,1fr);gap:12px;margin-bottom:22px}.crm-metric{border:1px solid #dfeaf2;background:linear-gradient(180deg,#fff,#f7fbff);border-radius:16px;padding:16px;box-shadow:0 10px 24px #0000000d}.crm-metric strong{display:block;color:#185779;font-size:28px;line-height:1;font-weight:900}.crm-metric span{display:block;margin-top:8px;color:#607488;font-size:12px;text-transform:uppercase;font-weight:800;letter-spacing:.03em}.crm-grid{align-items:start}.crm-toolbar{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:26px 0 12px}.crm-toolbar h2{margin:0;color:#253747}.crm-toolbar select{border:1px solid #d7e4ed;border-radius:12px;padding:11px 14px;background:#fff;font:inherit}.crm-list{display:grid;gap:12px}.crm-row{display:grid;grid-template-columns:1.4fr .8fr auto;gap:14px;align-items:center;border:1px solid #e5edf4;border-radius:16px;padding:14px;background:#fff;box-shadow:0 8px 22px #0000000a}.crm-row b{display:block;color:#253747;font-size:16px}.crm-row p{margin:5px 0;color:#536879}.crm-row small{display:block;color:#778899;line-height:1.45}.crm-row-meta{display:grid;gap:7px}.crm-badge{display:inline-flex;justify-content:center;width:max-content;border-radius:999px;padding:7px 10px;background:#eaf2f8;color:#24546f;font-size:12px;font-weight:900;text-transform:uppercase}.crm-nuevo{background:#eaf2f8;color:#185779}.crm-llamado{background:#fff2cc;color:#7a5200}.crm-pendiente{background:#fef0e7;color:#9a4b00}.crm-citado{background:#e8f7ef;color:#137333}.crm-atendido{background:#e7f0ff;color:#174ea6}.crm-no_responde{background:#fce8e6;color:#a50e0e}.crm-cerrado{background:#eeeeee;color:#555}.crm-actions{display:flex;flex-wrap:wrap;gap:8px;justify-content:flex-end}.crm-actions button{border:0;border-radius:999px;background:#eef4f8;color:#24546f;padding:8px 10px;font-size:12px;font-weight:900;cursor:pointer}.crm-actions button:hover{background:#226893;color:#fff}@media(max-width:1100px){.crm-metrics{grid-template-columns:repeat(4,1fr)}.crm-row{grid-template-columns:1fr}.crm-actions{justify-content:flex-start}}@media(max-width:700px){.admin-headline{display:block}.admin-tabs{margin-top:14px}.crm-metrics{grid-template-columns:repeat(2,1fr)}.crm-toolbar{display:block}.crm-toolbar select{margin-top:10px;width:100%}}@media(max-width:420px){.crm-metrics{grid-template-columns:1fr}}

/* WhatsApp embebido profesional */
.whatsapp-widget{position:fixed;right:24px;bottom:22px;z-index:1000;font-family:'Segoe UI',Arial,sans-serif}.whatsapp-widget .wa{position:static;border:0;cursor:pointer;background:#25D366;color:#fff;text-decoration:none;font-weight:800;border-radius:34px;padding:15px 26px;box-shadow:0 10px 28px #0003;font-size:16px}.wa-panel{display:none;position:absolute;right:0;bottom:66px;width:330px;background:#fff;border-radius:18px;box-shadow:0 18px 50px #0004;overflow:hidden;border:1px solid #e8e8e8}.whatsapp-widget.open .wa-panel{display:block;animation:waPop .18s ease-out}.wa-head{background:linear-gradient(135deg,#075E54,#128C7E);color:#fff;padding:15px 16px;display:flex;align-items:center;justify-content:space-between}.wa-head strong{display:block;font-size:16px}.wa-head span{display:block;font-size:12px;opacity:.9;margin-top:2px}.wa-head button{border:0;background:transparent;color:#fff;font-size:26px;line-height:1;cursor:pointer}.wa-body{padding:16px;background:#f7f7f7}.wa-msg{margin:0 0 12px;background:#fff;padding:12px 14px;border-radius:12px;color:#444;font-size:14px;line-height:1.45;box-shadow:0 2px 10px #0000000d}.wa-body input,.wa-body textarea{width:100%;border:1px solid #ddd;border-radius:12px;padding:12px;margin-bottom:10px;font:inherit;background:#fff}.wa-body textarea{height:96px;resize:vertical}.wa-body button{width:100%;border:0;border-radius:12px;background:#25D366;color:#fff;font-weight:800;padding:13px;cursor:pointer;font-size:15px}.wa-body small{display:block;margin-top:9px;color:#777;font-size:12px;line-height:1.35}@keyframes waPop{from{opacity:0;transform:translateY(10px) scale(.98)}to{opacity:1;transform:none}}@media(max-width:520px){.whatsapp-widget{right:14px;bottom:14px}.wa-panel{width:calc(100vw - 28px);right:0}.whatsapp-widget .wa{padding:14px 22px}}

/* Mejoras PRO Qhali Ã‘awi */
.session-bar{position:fixed;right:18px;top:82px;z-index:850;background:#ffffffee;border:1px solid #dce8f2;border-radius:20px;padding:8px 12px;box-shadow:0 8px 24px #0002;font-size:12px;color:#345;display:flex;gap:10px;align-items:center}.session-bar button{border:0;background:#226893;color:#fff;border-radius:16px;padding:7px 11px;cursor:pointer;font-weight:700}.card{transition:transform .18s ease,box-shadow .18s ease}.card:hover{transform:translateY(-4px);box-shadow:0 14px 34px #00000018}.brand-logo{filter:drop-shadow(0 10px 24px #00000018)}.hero-card{border-radius:2px}.login-page{min-height:100vh;background:linear-gradient(135deg,#001221,#185779);display:flex;align-items:center;justify-content:center}.login-shell{width:100%;min-height:100vh;display:flex;align-items:center;justify-content:center;padding:28px;background:radial-gradient(circle at top right,#7aa6d155,transparent 36%),linear-gradient(135deg,#001221ee,#0f5f82cc)}.login-card{width:min(440px,100%);background:#fffffff2;border-radius:26px;padding:34px 36px;box-shadow:0 26px 70px #0008;border:1px solid #ffffff66}.login-logo{display:block;margin:0 auto 12px;max-width:210px;max-height:110px;object-fit:contain}.login-kicker{font-weight:800;letter-spacing:2px;color:#226893;text-align:center;font-size:13px}.login-card h1{margin:10px 0 8px;color:#253747;font-size:36px;text-align:center}.login-subtitle{text-align:center;line-height:1.6;margin-bottom:24px}.login-form{display:grid;gap:14px}.login-form label{font-weight:700;color:#35495d;font-size:14px}.login-form input{width:100%;margin-top:7px;border:1px solid #d5e2eb;border-radius:14px;padding:14px 15px;font:inherit;background:#fff}.login-form button{border:0;border-radius:14px;padding:15px;background:#226893;color:#fff;font-weight:800;cursor:pointer;font-size:15px}.login-credit{text-align:center;margin-top:18px;font-size:12px;color:#667}
/* Panel administrativo y menÃº superior persistente */
.quick-links .admin-link{color:#226893;font-weight:700;border:1px solid #d6e4ef;border-radius:18px;padding:8px 14px;margin-left:24px;background:#fff}.nav-wrap{position:sticky;top:0;z-index:1200}.hidden{display:none!important}.admin-page{background:#eef4f8;min-height:100vh}.admin-shell{display:grid;grid-template-columns:300px 1fr;min-height:100vh}.admin-side{background:#102436;color:#dce8f2;padding:32px;position:sticky;top:0;height:100vh}.admin-side img{max-width:210px;background:#fff;border-radius:20px;padding:12px}.admin-side h2{color:#fff}.admin-side a,.admin-side button{display:block;width:100%;margin-top:14px;text-align:center;text-decoration:none;border:0;border-radius:14px;padding:13px;background:#226893;color:#fff;font-weight:800;cursor:pointer}.admin-main{padding:34px}.admin-card{background:#fff;border-radius:24px;padding:30px;box-shadow:0 18px 50px #0001;border:1px solid #dfeaf2}.admin-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px}.media-form{display:grid;gap:12px;border:1px solid #e5edf4;border-radius:18px;padding:18px;background:#fbfdff}.media-form input,.media-form textarea,.media-form select{padding:13px;border:1px solid #d7e4ed;border-radius:12px;font:inherit}.media-form button{border:0;border-radius:12px;padding:14px;background:#226893;color:#fff;font-weight:800}.media-list{display:grid;gap:12px}.media-row{display:grid;grid-template-columns:110px 1fr auto;gap:14px;align-items:center;border:1px solid #e5edf4;border-radius:16px;padding:12px}.media-row img{width:110px;height:76px;object-fit:cover;border-radius:12px}.video-mini{width:110px;height:76px;background:#102436;color:#fff;border-radius:12px;display:flex;align-items:center;justify-content:center;font-weight:800}.media-row button{border:0;background:#b93131;color:#fff;border-radius:12px;padding:10px 14px}.media-video-grid{display:grid;gap:18px}.public-video{width:100%;min-height:320px;border:0;border-radius:18px;background:#020218}.media-video-card{border:1px solid #e8e8e8;border-radius:18px;padding:16px;background:#fff;box-shadow:0 5px 18px #00000010}@media(max-width:900px){.admin-shell{grid-template-columns:1fr}.admin-side{position:relative;height:auto}.admin-grid{grid-template-columns:1fr}.quick-links{display:flex;position:static;gap:12px;flex-wrap:wrap;justify-content:center;margin-top:12px}.quick-links a{margin-left:0}}

/* ==========================================================
   BARRA PRINCIPAL STICKY PRO - QHALI Ã‘AWI
   - El menÃº se fija arriba al bajar con scroll.
   - Se desliza suavemente desde arriba para que no desaparezca.
   - No altera navegaciÃ³n, enlaces, login ni lÃ³gica del servidor.
   ========================================================== */
.nav-placeholder{display:none;height:0}
.nav-wrap{transition:box-shadow .25s ease, background .25s ease, transform .25s ease, border-color .25s ease}
.nav-wrap.nav-floating{
  position:fixed;
  top:0;left:0;right:0;width:100%;
  z-index:1500;
  background:#1a6fa3;
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  box-shadow:0 6px 28px rgba(22,95,142,.30);
  border-bottom:3px solid #c9931a;
  animation:qhaliNavSlideDown .28s ease-out both;
  min-height:58px;
}
.nav-wrap.nav-floating .main-nav a{height:58px;color:rgba(255,255,255,.92)!important}
.nav-wrap.nav-floating .main-nav li.active:before{top:auto;bottom:0;height:3px}
.nav-wrap.nav-floating .dropdown{top:58px}
.nav-wrap.nav-compact .main-nav a{font-size:13.5px;padding-left:15px;padding-right:15px}
.nav-placeholder.active{display:block;height:58px}
@keyframes qhaliNavSlideDown{from{transform:translateY(-100%);opacity:.86}to{transform:translateY(0);opacity:1}}
@media(max-width:900px){
  .nav-wrap.nav-floating{box-shadow:0 10px 28px rgba(24,87,121,.22)}
  .nav-placeholder.active{height:49px}
  .nav-wrap.nav-floating .main-nav a{height:auto}
  .nav-wrap.nav-floating .dropdown{top:auto}
}

.wa-quick{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 10px}
.wa-quick button{width:auto;background:#fff;color:#075E54;border:1px solid #cfe8dc;border-radius:999px;padding:8px 10px;font-size:12px;font-weight:800;box-shadow:none}
.wa-quick button:hover{background:#e9fbf1}
.wa-body button#waSend{transition:transform .15s ease,box-shadow .15s ease}
.wa-body button#waSend:hover{transform:translateY(-1px);box-shadow:0 8px 20px #25d36655}
.wa-status{min-height:18px;margin:8px 0 0;font-size:12px;font-weight:800;color:#0b5b65}
.wa-status[data-type="error"]{color:#b3261e}
.wa-status[data-type="ok"]{color:#137333}
.whatsapp-widget.open .wa{box-shadow:0 12px 32px #25d36655}
.wa-body button[disabled]{opacity:.55;cursor:not-allowed;transform:none!important;box-shadow:none!important}
.wa-fallback{display:block;margin-top:8px;text-align:center;color:#075E54;font-weight:800;text-decoration:none;font-size:13px}
.wa-fallback:hover{text-decoration:underline}
.whatsapp-widget[data-ready="false"] .wa{background:#6c757d}

.chatbot-widget{position:fixed;left:24px;bottom:22px;z-index:990;font-family:'Segoe UI',Arial,sans-serif}.chatbot-toggle{border:0;cursor:pointer;background:#226893;color:#fff;font-weight:900;border-radius:34px;padding:15px 22px;box-shadow:0 10px 28px #0003;font-size:15px}.chatbot-panel{display:none;position:absolute;left:0;bottom:66px;width:350px;background:#fff;border:1px solid #dfeaf2;border-radius:18px;box-shadow:0 18px 50px #0004;overflow:hidden}.chatbot-widget.open .chatbot-panel{display:block;animation:waPop .18s ease-out}.chatbot-head{background:linear-gradient(135deg,#102436,#226893);color:#fff;padding:15px 16px;display:flex;align-items:center;justify-content:space-between}.chatbot-head strong{display:block;font-size:16px}.chatbot-head span{display:block;font-size:12px;opacity:.9;margin-top:2px}.chatbot-head button{border:0;background:transparent;color:#fff;font-size:26px;line-height:1;cursor:pointer}.chatbot-messages{height:260px;overflow:auto;background:#f5f8fb;padding:14px;display:flex;flex-direction:column;gap:10px}.chat-msg{max-width:88%;border-radius:14px;padding:10px 12px;font-size:14px;line-height:1.4;box-shadow:0 2px 10px #0000000d}.chat-msg.bot{background:#fff;color:#334;align-self:flex-start;border:1px solid #e5edf4}.chat-msg.user{background:#226893;color:#fff;align-self:flex-end}.chatbot-quick{display:flex;flex-wrap:wrap;gap:8px;padding:12px 14px 0;background:#fff}.chatbot-quick button{border:1px solid #cfe0eb;background:#fff;color:#24546f;border-radius:999px;padding:8px 10px;font-size:12px;font-weight:800;cursor:pointer}.chatbot-quick button:hover{background:#eef6fb}.chatbot-form{display:grid;grid-template-columns:1fr auto;gap:8px;padding:12px 14px 14px;background:#fff}.chatbot-form input{border:1px solid #d9e5ee;border-radius:12px;padding:12px;font:inherit;min-width:0}.chatbot-form button{border:0;border-radius:12px;background:#226893;color:#fff;font-weight:900;padding:0 14px;cursor:pointer}@media(max-width:900px){.chatbot-widget{left:14px;right:auto;bottom:74px}.chatbot-panel{width:calc(100vw - 28px);left:0}.chatbot-toggle{padding:13px 18px}.chatbot-messages{height:230px}}@media(max-width:520px){.chatbot-toggle{font-size:13px}.chatbot-widget.open{left:14px;right:14px}.chatbot-widget.open .chatbot-panel{width:100%}}

.ownership-watermark{position:fixed;inset:-12vh -12vw;z-index:2147483000;pointer-events:none;display:grid;place-items:center;transform:rotate(-28deg);font-size:clamp(20px,4vw,54px);font-weight:900;line-height:1.25;text-align:center;text-transform:uppercase;letter-spacing:.08em;color:rgba(150,0,0,.16);text-shadow:0 1px 0 rgba(255,255,255,.65);background:repeating-linear-gradient(0deg,rgba(255,255,255,0) 0 92px,rgba(150,0,0,.045) 92px 94px)}.ownership-warning:before{content:'Sitio no autorizado';position:fixed;left:14px;top:14px;z-index:2147483001;background:#7f1d1d;color:#fff;border-radius:999px;padding:9px 13px;font-size:12px;font-weight:900;letter-spacing:.03em;box-shadow:0 12px 30px #0004}

/* Experiencia dinamica */
.hero{isolation:isolate}.hero:before{content:'';position:absolute;inset:auto 0 0 0;height:46%;z-index:1;background:linear-gradient(0deg,rgba(0,18,33,.82),transparent);pointer-events:none}.hero-card{animation:heroRise .55s ease-out both;transform-origin:left center}.hero-card .btn{transition:transform .18s ease,box-shadow .18s ease}.hero-card .btn:hover{transform:translateY(-2px);box-shadow:0 12px 24px #0002}.impact-strip{background:linear-gradient(90deg,#f7fbff,#eef6fb);border-bottom:1px solid #dbeaf3}.impact-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:0}.impact-grid div{padding:22px 20px;border-right:1px solid #d8e8f2;text-align:center}.impact-grid div:last-child{border-right:0}.impact-grid strong{display:block;color:#185779;font-size:34px;line-height:1;font-weight:900}.impact-grid strong:after{content:'+';font-size:18px;color:#d6a113;margin-left:2px}.impact-grid span{display:block;margin-top:7px;font-size:13px;color:#566b7b;text-transform:uppercase;letter-spacing:.04em}.smart-filter{display:flex;flex-wrap:wrap;gap:10px;margin:-10px 0 24px}.smart-filter button{border:1px solid #cfe0eb;background:#fff;color:#24546f;border-radius:999px;padding:10px 15px;font-weight:800;cursor:pointer;transition:background .18s ease,color .18s ease,transform .18s ease,box-shadow .18s ease}.smart-filter button:hover,.smart-filter button.active{background:#226893;color:#fff;box-shadow:0 10px 22px #22689322;transform:translateY(-1px)}.medical-item,.card{position:relative;overflow:hidden}.medical-item:before,.card:before{content:'';position:absolute;inset:0 0 auto 0;height:3px;background:linear-gradient(90deg,#7aa6d1,#d6a113);transform:scaleX(0);transform-origin:left;transition:transform .2s ease}.medical-item:hover:before,.card:hover:before{transform:scaleX(1)}.medical-item{transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}.medical-item:hover{transform:translateY(-3px);box-shadow:0 14px 28px #00000012;border-color:#cde1ee}.is-hidden-by-filter{display:none!important}.reveal-ready{opacity:0;transform:translateY(18px);transition:opacity .45s ease,transform .45s ease}.reveal-ready.is-visible{opacity:1;transform:none}.floating-cta{position:fixed;left:50%;bottom:18px;transform:translate(-50%,18px);z-index:950;background:#102436;color:#fff;border:1px solid #ffffff22;border-radius:999px;box-shadow:0 18px 40px #0004;display:flex;gap:12px;align-items:center;padding:10px 12px 10px 18px;opacity:0;pointer-events:none;transition:opacity .2s ease,transform .2s ease}.floating-cta.show{opacity:1;transform:translate(-50%,0);pointer-events:auto}.floating-cta span{font-size:13px;font-weight:700;white-space:nowrap}.floating-cta a{background:#25D366;color:#fff;text-decoration:none;border-radius:999px;padding:10px 14px;font-weight:900;font-size:13px}@keyframes heroRise{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}@media(max-width:900px){.impact-grid{grid-template-columns:repeat(2,1fr)}.impact-grid div:nth-child(2){border-right:0}.impact-grid div{border-bottom:1px solid #d8e8f2}.floating-cta{left:14px;right:14px;bottom:82px;transform:translateY(18px);justify-content:space-between}.floating-cta.show{transform:translateY(0)}}@media(max-width:520px){.impact-grid{grid-template-columns:1fr}.impact-grid div{border-right:0}.impact-grid strong{font-size:30px}.smart-filter{gap:8px}.smart-filter button{padding:9px 12px;font-size:12px}}
.chatbot-toggle{background:#25D366!important;color:#fff!important}.chatbot-head{background:linear-gradient(135deg,#075E54,#128C7E)!important}.chat-msg.user{background:#25D366!important;color:#073b2f!important}.chatbot-form button{background:#25D366!important;color:#073b2f!important}.chatbot-quick button[data-chat-question*=WhatsApp]{border-color:#25D366!important;color:#075E54!important}.chatbot-quick button[data-chat-question*=WhatsApp]:hover{background:#25D366!important;color:#073b2f!important}.chatbot-auth{display:grid;gap:9px;padding:14px;background:#fff;border-top:1px solid #dfeaf2}.chatbot-auth.hidden{display:none!important}.chatbot-auth p{margin:0 0 3px;color:#075E54;font-weight:900}.chatbot-auth input{width:100%;border:1px solid #d9e5ee;border-radius:12px;padding:11px;font:inherit;min-width:0}.chatbot-auth-title{color:#24546f;font-weight:900;font-size:13px;text-transform:uppercase}.chatbot-login,.chatbot-auth button{display:inline-flex;align-items:center;justify-content:center;text-decoration:none;border:0;border-radius:12px;background:#25D366;color:#073b2f;font-weight:900;padding:11px;cursor:pointer}.chatbot-check{display:flex;align-items:flex-start;gap:8px;color:#536879;font-size:12px;line-height:1.35}.chatbot-check input{width:auto;margin-top:2px}.chatbot-auth small{min-height:18px;color:#075E54;font-weight:800}.chatbot-form.hidden,.chatbot-quick.hidden{display:none!important}.whatsapp-widget{display:none!important}.topbar-contact span{color:#d6a113;font-weight:900}.phone-icon{font-family:Arial,sans-serif!important;font-size:21px!important;justify-content:center;min-width:58px;color:#226893!important}.phone-icon:hover{background:#eaf5ee!important;color:#075E54!important}.menu-toggle span{display:inline-block;margin-right:7px;font-size:18px}.social span{font-family:Arial,sans-serif}@media(max-width:900px){.topbar-inner{display:flex!important;flex-direction:column;gap:8px;align-items:flex-start!important}.topbar-contact{line-height:1.55}.phone-icon{justify-content:flex-start!important;min-width:0}}
.login-card-wide{width:min(520px,100%)}.login-switch{display:grid;grid-template-columns:1fr 1fr;gap:8px;background:#eef6fb;border:1px solid #d6e8f2;border-radius:16px;padding:6px;margin:0 0 20px}.login-switch button{border:0;border-radius:12px;background:transparent;color:#24546f;font-weight:900;padding:12px;cursor:pointer}.login-switch button.active{background:#226893;color:#fff;box-shadow:0 10px 22px #22689322}.login-page[data-login-mode="crm"] .login-card{border-top:5px solid #d6a113}.login-page[data-login-mode="usuario"] .login-card{border-top:5px solid #25D366}.login-help{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:14px;font-size:12px;color:#667}.login-help a{color:#226893;font-weight:900;text-decoration:none}.login-help a:hover{text-decoration:underline}@media(max-width:520px){.login-switch{grid-template-columns:1fr}.login-help{display:block}.login-help span{display:block;margin-top:8px}.login-card{padding:28px 22px}}
.crm-lines-card{border:1px solid #dfeaf2;background:#fbfdff;border-radius:18px;padding:18px;margin:0 0 22px}.crm-lines-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:14px}.crm-lines-head h2{margin:0;color:#253747}.crm-lines-head p{margin:5px 0 0;color:#607488}.crm-lines-head strong{background:#e8f7ef;color:#137333;border-radius:999px;padding:8px 12px;white-space:nowrap}.crm-line-form{display:grid;grid-template-columns:1.2fr 1fr 1fr 1fr 90px auto;gap:10px}.crm-line-form input{border:1px solid #d7e4ed;border-radius:12px;padding:11px 12px;font:inherit;min-width:0}.crm-line-form button{border:0;border-radius:12px;background:#226893;color:#fff;font-weight:900;padding:0 14px;cursor:pointer}.crm-line-list{display:grid;gap:10px;margin-top:12px}.crm-line-row{display:grid;grid-template-columns:1fr auto;gap:14px;align-items:center;border:1px solid #e5edf4;border-radius:14px;background:#fff;padding:12px}.crm-line-row b{display:block;color:#253747}.crm-line-row p{margin:4px 0;color:#536879}.crm-line-row small{color:#778899}.crm-line-row.is-paused{opacity:.62;background:#f7f7f7}.crm-actions a{display:inline-flex;align-items:center;text-decoration:none;border-radius:999px;background:#eef4f8;color:#24546f;padding:8px 10px;font-size:12px;font-weight:900}.crm-actions a:hover{background:#25D366;color:#073b2f}@media(max-width:1100px){.crm-line-form{grid-template-columns:1fr 1fr}.crm-line-form button{padding:12px}}@media(max-width:700px){.crm-lines-head{display:block}.crm-lines-head strong{display:inline-block;margin-top:10px}.crm-line-form,.crm-line-row{grid-template-columns:1fr}.crm-line-row .crm-actions{justify-content:flex-start}}

/* Accesos principales estilo clinica */
.service-shortcuts{background:#fff;border-bottom:1px solid #edf2f6;padding:46px 0 42px}.service-shortcuts-grid{display:grid;grid-template-columns:repeat(5,1fr);align-items:stretch}.service-shortcut{min-height:205px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;text-decoration:none;color:#444;padding:10px 24px;border-right:1px solid #edf0f3;transition:transform .18s ease,color .18s ease}.service-shortcut:first-child{border-left:1px solid #edf0f3}.service-shortcut strong{font-size:22px;line-height:1.18;font-weight:400;letter-spacing:0}.shortcut-icon{width:118px;height:118px;border-radius:50%;display:grid;place-items:center;margin:0 0 22px;background:repeating-linear-gradient(45deg,#fff 0 6px,#f7f9fb 6px 9px);border:1px solid #f0f3f6;box-shadow:inset 0 0 0 9px #fbfcfd,0 10px 22px #00000008}.shortcut-icon svg{width:56px;height:56px;fill:none;stroke:#7aa6d1;stroke-width:3.2;stroke-linecap:round;stroke-linejoin:round;transition:stroke .18s ease,transform .18s ease}.service-shortcut:hover{color:#185779;transform:translateY(-4px)}.service-shortcut:hover .shortcut-icon{box-shadow:inset 0 0 0 9px #f7fbff,0 16px 34px #22689318}.service-shortcut:hover svg{stroke:#226893;transform:scale(1.05)}@media(max-width:980px){.service-shortcuts-grid{grid-template-columns:repeat(2,1fr)}.service-shortcut{border-bottom:1px solid #edf0f3}.service-shortcut:nth-child(2n){border-right:1px solid #edf0f3}.service-shortcut strong{font-size:20px}.shortcut-icon{width:104px;height:104px}}@media(max-width:560px){.service-shortcuts{padding:28px 0}.service-shortcuts-grid{grid-template-columns:1fr}.service-shortcut{min-height:150px;border-left:1px solid #edf0f3}.shortcut-icon{width:90px;height:90px;margin-bottom:14px}.shortcut-icon svg{width:46px;height:46px}.service-shortcut strong{font-size:19px}}

/* ============================================================
   FAB - Botones flotantes WhatsApp + Llamar
   ============================================================ */
.fab-container{position:fixed;right:24px;bottom:28px;z-index:1800;display:flex;flex-direction:column;gap:13px;align-items:center}
.fab{width:58px;height:58px;border-radius:50%;display:flex;align-items:center;justify-content:center;text-decoration:none;box-shadow:0 6px 22px rgba(0,0,0,.30);transition:transform .2s ease,box-shadow .2s ease;position:relative}
.fab:hover{transform:scale(1.12) translateY(-2px);box-shadow:0 14px 36px rgba(0,0,0,.34)}
.fab svg{width:26px;height:26px;flex-shrink:0}
.fab::after{content:attr(title);position:absolute;right:68px;top:50%;transform:translateY(-50%);background:rgba(30,30,30,.88);color:#fff;font-size:12px;font-weight:700;white-space:nowrap;padding:6px 10px;border-radius:8px;opacity:0;pointer-events:none;transition:opacity .18s ease;letter-spacing:.02em}
.fab:hover::after{opacity:1}
.fab-whatsapp{
  background:#25D366;
  transform:translateZ(0);
  will-change:box-shadow;
  animation:fabWaPulse 3s ease-in-out infinite;
}
.fab-call{
  background:#1a6fa3;
  transform:translateZ(0);
  will-change:box-shadow;
  animation:fabCallPulse2 3s ease-in-out 1.5s infinite;
}
@keyframes fabWaPulse{
  0%,100%{box-shadow:0 4px 18px rgba(37,211,102,.45)}
  50%{box-shadow:0 4px 18px rgba(37,211,102,.45),0 0 0 8px rgba(37,211,102,.18),0 0 0 16px rgba(37,211,102,.07)}
}
@keyframes fabCallPulse2{
  0%,100%{box-shadow:0 4px 18px rgba(26,111,163,.45)}
  50%{box-shadow:0 4px 18px rgba(26,111,163,.45),0 0 0 8px rgba(26,111,163,.18),0 0 0 16px rgba(26,111,163,.07)}
}
@media(max-width:900px){.fab-container{right:14px;bottom:84px}.fab{width:52px;height:52px}.fab svg{width:23px;height:23px}.fab::after{display:none}}
@media(max-width:520px){.fab-container{bottom:90px}}

/* ============================================================
   BotÃ³n WhatsApp en hero + secciÃ³n contacto
   ============================================================ */
.btn.hero-wa{background:#25D366;color:#fff;border:2px solid #25D366;display:inline-flex;align-items:center}
.btn.hero-wa:hover{background:#1da851;border-color:#1da851;transform:translateY(-2px);box-shadow:0 10px 24px rgba(37,211,102,.35)}
.contact-action-btns{display:flex;gap:12px;flex-wrap:wrap;margin-top:18px}
.contact-action-btns .btn{display:inline-flex;align-items:center;margin:0}

/* ============================================================
   Footer botones de acciÃ³n rÃ¡pida
   ============================================================ */
.footer-action-btn{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:50%;text-decoration:none;transition:transform .18s ease,box-shadow .18s ease}
.footer-action-btn:hover{transform:scale(1.12)}
.footer-call{background:#226893}
.footer-wa{background:#25D366}

/* ============================================================
   Hero mejorado - tarjeta con mejor contraste y animaciÃ³n
   ============================================================ */
.hero{height:480px}
.hero-card{border-radius:4px;border-left:5px solid var(--gold);backdrop-filter:blur(2px)}
.hero-card .tag{font-size:12px;letter-spacing:3px;color:var(--azul2)}
.hero-card h1{font-size:36px;line-height:1.08;font-weight:700;color:#1a2e3d}
.hero-card p{font-size:15px;line-height:1.75;color:#445;margin-bottom:4px}
@media(max-width:900px){.hero{height:auto}.hero-card{margin:36px 14px 40px}.contact-action-btns{gap:10px}.fab-container{right:12px}}

/* ============================================================
   Mejoras cards y secciones (estilo clÃ­nica premium)
   ============================================================ */
.card{border-radius:6px;transition:transform .22s ease,box-shadow .22s ease}
.card:hover{transform:translateY(-6px);box-shadow:0 18px 40px rgba(0,0,0,.12)}
.card img{border-radius:6px 6px 0 0}
.inner-banner{height:240px;background-attachment:fixed}
.section h3{color:var(--azul2)}
.medical-item{border-radius:6px;transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}
.medical-item:hover{transform:translateY(-4px);box-shadow:0 12px 28px rgba(34,104,147,.12);border-color:#b8d4e8}
.medical-item h3{font-size:16px}

/* ============================================================
   Barra de anuncio superior (emergencias 24h)
   ============================================================ */
.topbar-emergency{display:flex;align-items:center;gap:8px;color:#fff;font-size:12px;font-weight:700;letter-spacing:.04em}
.topbar-emergency span.badge{background:var(--gold);color:#1a1a00;border-radius:4px;padding:2px 7px;font-size:11px;font-weight:900;letter-spacing:.06em}

/* ============================================================
   Mejora contact-strip con botones adicionales
   ============================================================ */
.contact-strip{background:linear-gradient(90deg,#185779,#226893)}
.contact-strip .container{gap:16px;flex-wrap:wrap}

/* ============================================================
   Quotes / Testimonios mejorados
   ============================================================ */
.quotes blockquote{border-radius:8px;border-left:4px solid var(--azul);box-shadow:0 4px 16px rgba(0,0,0,.06);transition:transform .2s ease,box-shadow .2s ease}
.quotes blockquote:hover{transform:translateY(-3px);box-shadow:0 10px 28px rgba(34,104,147,.12)}

/* ============================================================
   Timeline mejorado
   ============================================================ */
.timeline div{border-radius:6px;transition:transform .2s ease,box-shadow .2s ease}
.timeline div:hover{transform:translateX(4px);box-shadow:0 4px 16px rgba(34,104,147,.10)}

/* ============================================================
   NUEVOS ESTILOS v3 - Contenido completo Qhali Ã‘awi
   ============================================================ */

/* Pilares grid */
.pilares-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;margin-top:10px}
.pilar{background:#fafafa;border:1px solid #e5edf4;border-radius:8px;padding:28px 22px;text-align:center;transition:transform .2s,box-shadow .2s}
.pilar:hover{transform:translateY(-5px);box-shadow:0 14px 32px rgba(34,104,147,.14)}
.pilar-icon{font-size:32px;color:var(--azul2);margin-bottom:12px}
.pilar h3{color:#253747;margin:0 0 10px;font-size:18px}
.pilar p{color:var(--text);font-size:14px;line-height:1.7;margin:0}
@media(max-width:900px){.pilares-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:500px){.pilares-grid{grid-template-columns:1fr}}

/* Service shortcuts */
.service-shortcuts{background:var(--azul3);padding:0}
.service-shortcuts-grid{display:grid;grid-template-columns:repeat(5,1fr)}
.service-shortcut{display:flex;flex-direction:column;align-items:center;padding:22px 12px;color:#fff;text-decoration:none;border-right:1px solid rgba(255,255,255,.1);transition:background .2s}
.service-shortcut:last-child{border-right:0}
.service-shortcut:hover{background:rgba(255,255,255,.1)}
.shortcut-icon{width:52px;height:52px;margin-bottom:10px;opacity:.9}
.shortcut-icon svg{width:100%;height:100%;fill:none;stroke:#fff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.service-shortcut strong{font-size:13px;font-weight:700;text-align:center;line-height:1.4}
@media(max-width:900px){.service-shortcuts-grid{grid-template-columns:repeat(3,1fr)}.service-shortcut{border-right:1px solid rgba(255,255,255,.1);border-bottom:1px solid rgba(255,255,255,.1)}}
@media(max-width:500px){.service-shortcuts-grid{grid-template-columns:1fr 1fr}}

/* Staff cards */
.card.staff{text-align:center}
.card.staff .avatar{width:72px;height:72px;font-size:20px;margin:20px auto 0}
.card.staff .staff-photo{width:90px;height:90px;border-radius:50%;object-fit:cover;object-position:center top;margin:20px auto 0;display:block;border:3px solid var(--azul2)}
.card.staff .body{text-align:left}
.staff-tag{display:inline-block;background:#e9f3fa;color:var(--azul2);font-size:12px;font-weight:700;border-radius:20px;padding:4px 12px;margin-bottom:10px}

/* Testimonios */
.testimonios-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.testimonio{background:#fafafa;border:1px solid #e5edf4;border-radius:8px;padding:26px;transition:transform .2s,box-shadow .2s}
.testimonio:hover{transform:translateY(-4px);box-shadow:0 12px 28px rgba(34,104,147,.12)}
.stars{color:#f4c110;font-size:18px;margin-bottom:12px;letter-spacing:2px}
.testimonio blockquote{margin:0 0 14px;font-style:italic;color:#555;line-height:1.7;font-size:15px}
.testim-autor{font-size:13px;font-weight:700;color:var(--azul2)}
@media(max-width:900px){.testimonios-grid{grid-template-columns:1fr}}

/* Director card */
.director-card{display:flex;gap:28px;align-items:flex-start;background:#fafafa;border:1px solid #e5edf4;border-radius:8px;padding:28px}
.director-avatar{min-width:90px;height:90px;border-radius:50%;background:var(--azul2);color:#fff;display:flex;align-items:center;justify-content:center;font-size:28px;font-weight:900}
.director-photo{width:100px;height:100px;min-width:100px;border-radius:50%;object-fit:cover;object-position:center top;border:3px solid var(--azul2);flex-shrink:0}
.director-info h3{margin-top:0;color:var(--azul2)}
.director-tag{display:inline-block;background:#e9f3fa;color:var(--azul2);font-size:12px;font-weight:700;border-radius:20px;padding:4px 12px;margin-bottom:12px}
@media(max-width:700px){.director-card{flex-direction:column}.director-photo{margin:0 auto}}

/* MisiÃ³n visiÃ³n bloques */
.mv-block{background:#fafafa;border-left:4px solid var(--azul);border-radius:4px;padding:28px}
.mv-icon{font-size:34px;margin-bottom:10px}
.mv-block h3{margin-top:0;color:#253747}

/* Smart filter */
.smart-filter{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:22px}
.smart-filter button{border:1px solid #d0e3f0;background:#f4f9fd;color:var(--azul2);border-radius:20px;padding:8px 18px;font-size:13px;font-weight:700;cursor:pointer;transition:background .15s,color .15s}
.smart-filter button.active,.smart-filter button:hover{background:var(--azul2);color:#fff;border-color:var(--azul2)}

/* Cirugias tag */
.cirugia-tag{display:inline-block;background:#e9f3fa;color:#185779;font-size:11px;font-weight:700;border-radius:20px;padding:4px 10px;margin-top:10px}

/* Blog */
.blog-tag{display:inline-block;background:var(--azul2);color:#fff;font-size:11px;font-weight:700;border-radius:20px;padding:3px 10px;margin-bottom:8px}
.blog-fecha{display:block;font-size:12px;color:#999;margin-top:10px}

/* Card link */
.card-link{display:inline-block;margin-top:10px;color:var(--azul2);font-weight:700;text-decoration:none;font-size:13px}
.card-link:hover{text-decoration:underline}

/* Contact info list */
.contact-info-list{display:grid;gap:14px;margin-bottom:22px}
.cinfo-item{display:flex;align-items:flex-start;gap:14px}
.cinfo-icon{font-size:18px;color:var(--azul2);min-width:26px;margin-top:2px}
.cinfo-item strong{display:block;color:#253747;font-weight:700}
.cinfo-item p{margin:4px 0 0;color:var(--text)}
.cinfo-item a{color:var(--azul2);text-decoration:none}

/* Map placeholder */
.map-box{background:#f0f5f9;border:1px solid #d0e3f0;border-radius:8px;padding:28px;text-align:center;color:#445}
.map-box span{font-size:32px;display:block;margin-bottom:8px}
.map-box strong{display:block;margin-bottom:4px;color:#253747}

/* Footer grid pro */
.footer-grid-pro{display:grid;grid-template-columns:1.6fr 1fr 1fr 1.2fr;gap:32px}
.footer-grid-pro h3{color:#fff;font-weight:600;margin-bottom:14px;font-size:15px}
.footer-grid-pro a{display:block;color:#bbb;text-decoration:none;margin-bottom:8px;font-size:14px;transition:color .15s}
.footer-grid-pro a:hover{color:#fff}
.footer-grid-pro p{color:#999;font-size:13px;line-height:1.6;margin:0 0 8px}
@media(max-width:900px){.footer-grid-pro{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.footer-grid-pro{grid-template-columns:1fr}}

/* Impact strip */
.impact-strip{background:var(--azul2);padding:20px 0}
.impact-grid{display:grid;grid-template-columns:repeat(4,1fr);text-align:center;gap:10px}
.impact-grid>div{color:#fff;padding:10px}
.impact-grid strong{display:block;font-size:36px;font-weight:900;color:#fff}
.impact-grid span{display:block;font-size:13px;opacity:.9;margin-top:4px}
@media(max-width:700px){.impact-grid{grid-template-columns:repeat(2,1fr)}}

/* Social icons */
.soc-ico{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;border-radius:50%;background:#444;color:#ddd!important;text-decoration:none;font-size:11px;margin-left:6px;font-weight:900;transition:background .15s}
.soc-ico:hover{background:var(--azul2)}
.soc-wa{background:#25D366!important}

/* Emerg badge */
.emerg-badge{background:var(--gold);color:#1a1a00;border-radius:4px;padding:2px 8px;font-size:11px;font-weight:900;letter-spacing:.05em}

/* ============================================================
   MEJORA VISUAL PREMIUM v4 - Estilo profesional clinica
   ============================================================ */
:root{--azul:#2980b9;--azul2:#1a6fa3;--azul3:#155d8a;--azul-light:#ebf5fb;--dark:#1e3a4f;--text:#3d5166;--light:#f4f8fc;--gold:#c9931a;--green:#25D366;--shadow:0 8px 32px rgba(22,95,142,.10)}
body{font-family:'Segoe UI',system-ui,Arial,sans-serif;color:var(--text);font-size:15px;line-height:1.7}

/* â”€â”€ TOPBAR â”€â”€ */
.topbar{background:var(--dark);height:auto;padding:0;min-height:40px}
.topbar-inner{padding:9px 0;gap:8px;flex-wrap:wrap;height:auto;display:flex;align-items:center;justify-content:space-between}
.topbar a{color:#7ec8e3}
.topbar a:hover{color:#fff}

/* â”€â”€ BRAND ZONE (logo) â”€â”€ */
.brand-zone{
  height:auto;
  min-height:100px;
  padding:14px 0;
  border-bottom:4px solid var(--azul2);
  background:#fff;
  display:block;
}
.brand-inner{height:auto;min-height:72px;justify-content:space-between;align-items:center;padding:0;display:flex}
.brand-logo{
  max-height:82px;
  min-height:60px;
  width:auto;
  display:block;
  object-fit:contain;
}
/* Fallback: si la imagen no carga, mostrar el nombre de la clÃ­nica */
.brand-logo::after{
  content:'Qhali Ã‘awi';
  display:block;
  font-size:26px;
  font-weight:800;
  color:var(--azul3);
  letter-spacing:1px;
}
.quick-links{position:static;font-size:13px;display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.quick-links a{color:#888}
.quick-links .admin-link{color:var(--azul2);background:var(--azul-light);border-radius:20px;padding:7px 16px;border:1px solid #bee0f5;font-weight:700;margin-left:0}

/* â”€â”€ BARRA DE NAVEGACIÃ“N PRINCIPAL â”€â”€ */
.nav-wrap{
  background:#1a6fa3;
  border:0;
  border-bottom:3px solid #c9931a;
  box-shadow:0 4px 14px rgba(22,95,142,.20);
  min-height:58px;
}
.main-nav{justify-content:flex-start;padding:0;min-height:58px}
.main-nav a{
  color:rgba(255,255,255,.92)!important;
  border:0!important;
  font-size:13.5px;
  font-weight:600;
  letter-spacing:.3px;
  padding:0 15px;
  height:58px;
  border-right:1px solid rgba(255,255,255,.1)!important;
  transition:background .15s,color .15s;
  white-space:nowrap;
}
.main-nav li:last-child a{border-right:0!important}
.main-nav li.active>a,.main-nav li:hover>a{color:#fff!important;background:rgba(255,255,255,.16)!important}
.main-nav li.active:before{background:var(--gold);height:3px;top:auto;bottom:0;left:0;right:0}
.dropdown{background:var(--dark);border:1px solid rgba(255,255,255,.1);border-top:3px solid var(--gold);box-shadow:0 12px 36px rgba(0,0,0,.35);border-radius:0 0 8px 8px;top:58px}
.dropdown a{background:transparent!important;color:rgba(255,255,255,.8)!important;border-bottom:1px solid rgba(255,255,255,.06)!important;font-size:13px}
.dropdown a:hover{background:rgba(255,255,255,.1)!important;color:#fff!important}
.phone-icon{color:#7ec8e3!important;font-size:20px!important}
.menu-toggle{background:var(--azul3);font-size:15px;min-height:52px}
.hero{height:560px}
.hero:after{background:linear-gradient(100deg,rgba(10,30,55,.92) 40%,rgba(13,77,117,.72) 70%,rgba(13,77,117,.30) 100%)}
.hero-layer{padding:0 16px}
.hero-card{width:520px;background:transparent;border:0;border-left:5px solid var(--gold);padding:40px 44px;box-shadow:none;backdrop-filter:none}
.hero-card .tag{color:var(--gold);font-size:12px;letter-spacing:4px;font-weight:800;text-transform:uppercase}
.hero-card h1{font-size:48px;font-weight:800;color:#fff;line-height:1.1;margin:14px 0 18px;text-shadow:0 2px 18px rgba(0,0,0,.3)}
.hero-card p{color:rgba(255,255,255,.88);font-size:17px;line-height:1.75;margin-bottom:6px}
.btn{border-radius:4px;font-size:14px;padding:14px 28px;letter-spacing:.3px;transition:transform .15s,box-shadow .15s,background .15s}
.btn.primary{background:var(--azul2);box-shadow:0 6px 20px rgba(22,95,142,.4)}
.btn.primary:hover{background:var(--azul3);transform:translateY(-2px);box-shadow:0 10px 28px rgba(22,95,142,.5)}
.btn.outline{color:#fff;border:2px solid rgba(255,255,255,.8)}
.btn.outline:hover{background:#fff;color:var(--azul2)}
.impact-strip{background:linear-gradient(90deg,var(--azul3),var(--azul2));padding:28px 0}
.impact-grid strong{font-size:44px;font-weight:900}
.impact-grid span{font-size:14px;font-weight:600;opacity:.92}
.service-shortcuts{background:var(--dark)}
.service-shortcut{padding:28px 14px;border-right:1px solid rgba(255,255,255,.07)}
.service-shortcut:hover{background:var(--azul3)}
.service-shortcut strong{font-size:12px;font-weight:700;letter-spacing:.3px}
.section{padding:72px 0}
.section.gray{background:var(--light)}
.title h2{font-size:34px;font-weight:700;color:var(--dark)}
.title .line{background:linear-gradient(90deg,var(--azul2),var(--gold));width:70px;height:4px;border-radius:2px}
.title p{color:#607080;font-size:16px;margin-top:6px}
.card{border-radius:10px;border:0;box-shadow:0 4px 20px rgba(0,0,0,.08);overflow:hidden;transition:transform .22s ease,box-shadow .22s ease}
.card:hover{transform:translateY(-7px);box-shadow:0 18px 48px rgba(22,95,142,.18)}
.card img{height:190px;object-fit:cover}
.card .body{padding:24px}
.card h3{font-size:19px;font-weight:700;color:var(--dark);margin-bottom:10px}
.card .body p{font-size:14px;line-height:1.75;color:var(--text)}
.pilar{border-radius:10px;border:0;box-shadow:var(--shadow)}
.pilar:hover{background:var(--azul-light)}
.pilar h3{font-size:19px;color:var(--dark);font-weight:700}
.about h2,.about h3{font-size:32px;color:var(--dark);line-height:1.25}
.about p{font-size:15px;line-height:1.85}
.about img{border-radius:10px;border:0;box-shadow:0 12px 40px rgba(22,95,142,.15)}
.inner-banner{height:300px}
.inner-banner:before{background:linear-gradient(rgba(10,30,55,.88),rgba(10,30,55,.88)),url('../img/cirugias-oftalmologo-chiclayo.jpg') center/cover}
.inner-banner .container{padding-top:100px}
.inner-banner h1{font-size:42px;font-weight:700}
.breadcrumbs{color:rgba(255,255,255,.65);font-size:13px}
.content-box{border-radius:10px;border:0;box-shadow:0 8px 36px rgba(0,0,0,.10);padding:44px}
.side-menu a{background:#f4f8fc;border-left:4px solid transparent;border-bottom:1px solid #dde8f2;color:#3a5068;font-size:14px;font-weight:600;padding:14px 18px;transition:all .15s}
.side-menu a:hover,.side-menu a.active{background:var(--azul-light);border-left-color:var(--azul2);color:var(--azul2)}
.medical-item{border-radius:8px;border:1px solid #dde8f2;background:#fff;box-shadow:0 2px 12px rgba(22,95,142,.06)}
.medical-item:hover{border-color:#9ec8e8;box-shadow:0 8px 24px rgba(22,95,142,.12);transform:translateY(-3px)}
.medical-item h3{font-size:16px;font-weight:700;color:var(--dark)}
.medical-item p{font-size:14px;line-height:1.8}
.timeline div{border-radius:6px;border-left:4px solid var(--azul2);background:#f4f8fc;box-shadow:0 2px 10px rgba(22,95,142,.06)}
.timeline div:hover{border-left-color:var(--gold);background:var(--azul-light)}
.timeline b{color:var(--dark);font-weight:700;font-size:15px}
.testimonio{background:#fff;border:1px solid #dde8f2;border-radius:10px;box-shadow:0 4px 18px rgba(22,95,142,.07)}
.testimonio:hover{box-shadow:0 14px 36px rgba(22,95,142,.15);transform:translateY(-4px)}
.stars{color:#f4b400}
.testimonio blockquote{font-size:15px}
.contact-form input,.contact-form textarea,.contact-form select{border:1px solid #c8dce8;border-radius:8px;padding:14px 16px;font-size:15px;transition:border .15s,box-shadow .15s}
.contact-form input:focus,.contact-form textarea:focus{outline:0;border-color:var(--azul2);box-shadow:0 0 0 3px rgba(22,95,142,.12)}
.contact-form button{background:var(--azul2);border-radius:8px;font-size:15px;padding:16px;letter-spacing:.3px;transition:background .15s,transform .15s}
.contact-form button:hover{background:var(--azul3);transform:translateY(-1px)}
.contact-strip{background:linear-gradient(100deg,var(--azul3) 0%,var(--azul2) 100%);padding:52px 0}
.contact-strip h2{font-size:30px;font-weight:700}
.btn.outline.white{border-color:#fff;color:#fff}
.btn.outline.white:hover{background:#fff;color:var(--azul2)}
.footer{background:#0f1e2a;padding:56px 0 24px}
.footer-grid-pro h3{font-size:14px;font-weight:800;letter-spacing:.8px;text-transform:uppercase;color:#fff;border-bottom:2px solid var(--azul2);padding-bottom:10px;margin-bottom:18px}
.footer-grid-pro a{color:#8ba8bc;font-size:14px;transition:color .15s,padding-left .15s;padding-left:0}
.footer-grid-pro a:hover{color:#fff;padding-left:4px}
.footer-grid-pro p{color:#7a94a8;font-size:14px}
.copy{border-top:1px solid rgba(255,255,255,.1);color:#5a7a8e;font-size:12px;margin-top:40px;padding-top:22px}
.card.staff .avatar{background:var(--azul2);width:80px;height:80px;font-size:22px}
.staff-tag{background:var(--azul-light);color:var(--azul2);font-weight:700}
.director-card{background:var(--azul-light);border:1px solid #bee0f5;border-radius:10px}
.director-avatar{background:var(--azul2);min-width:100px;height:100px;font-size:32px}
.mv-block{background:#f4f8fc;border-left:5px solid var(--azul2);border-radius:0 8px 8px 0}
.mv-block h3{font-size:24px;color:var(--dark)}
.cirugia-tag{background:var(--azul-light);color:var(--azul3)}
.blog-tag{background:var(--azul2)}
.map-box{background:var(--azul-light);border:1px solid #bee0f5;border-radius:10px;padding:36px}
.map-box span{font-size:40px;color:var(--azul2)}
.card-link{color:var(--azul2);font-weight:700}
.smart-filter button.active,.smart-filter button:hover{background:var(--azul2);border-color:var(--azul2)}
.soc-ico{background:#2a3e50}
.soc-ico:hover{background:var(--azul2)}
.emerg-badge{background:var(--gold);animation:pulse-badge 2s infinite}
@keyframes pulse-badge{0%,100%{opacity:1}50%{opacity:.7}}
@media(max-width:900px){.hero{height:auto;min-height:420px}.hero-card{width:auto;margin:50px 16px 48px;padding:28px 24px;border-left:4px solid var(--gold)}.hero-card h1{font-size:34px}.hero-card p{font-size:15px}.title h2{font-size:26px}.section{padding:52px 0}.content-box{padding:24px 18px}.inner-banner h1{font-size:30px}.inner-banner{height:220px}.inner-banner .container{padding-top:72px}}
@media(max-width:600px){.hero-card h1{font-size:28px}.impact-grid strong{font-size:32px}}

/* ============================================================
   CIRUGÃAS â€” layout detallado con imagen + texto completo
   ============================================================ */
.cirugia-full-list { display:grid; gap:48px; margin-top:10px; }
.cirugia-item { display:grid; grid-template-columns:340px 1fr; gap:36px; align-items:start; border:1px solid #dde8f2; border-radius:12px; overflow:hidden; background:#fff; box-shadow:0 4px 24px rgba(22,95,142,.08); }
.cirugia-item.reverse { grid-template-columns:1fr 340px; }
.cirugia-item.reverse .cirugia-img { order:2; }
.cirugia-item.reverse .cirugia-body { order:1; }
.cirugia-img img { width:100%; height:100%; object-fit:cover; object-position:top center; min-height:280px; display:block; }
.cirugia-body { padding:32px 32px 32px 0; }
.cirugia-item.reverse .cirugia-body { padding:32px 0 32px 32px; }
.cirugia-num { display:inline-block; background:var(--azul2); color:#fff; font-size:11px; font-weight:900; letter-spacing:2px; padding:4px 12px; border-radius:20px; margin-bottom:10px; }
.cirugia-body h3 { font-size:22px; font-weight:700; color:var(--dark); margin:0 0 14px; line-height:1.3; }
.cirugia-body p { font-size:14.5px; line-height:1.85; color:var(--text); margin-bottom:12px; }
.cirugia-body p:last-of-type { margin-bottom:16px; }
.cirugia-tags-row { display:flex; gap:8px; flex-wrap:wrap; }
.cirugia-tags-row .cirugia-tag { background:var(--azul-light); color:var(--azul3); font-size:12px; font-weight:700; border-radius:20px; padding:5px 13px; border:1px solid #bee0f5; }
@media(max-width:900px){
  .cirugia-item, .cirugia-item.reverse { grid-template-columns:1fr; }
  .cirugia-item.reverse .cirugia-img { order:0; }
  .cirugia-item.reverse .cirugia-body { order:1; padding:24px; }
  .cirugia-body { padding:24px; }
  .cirugia-img img { min-height:200px; }
}

/* ============================================================
   EXÃMENES â€” etiqueta de tag y caja CTA
   ============================================================ */
.exam-intro-box { background:var(--azul-light); border-left:5px solid var(--azul2); padding:20px 24px; border-radius:0 8px 8px 0; margin-bottom:8px; font-size:15px; color:#3a5068; line-height:1.75; }
.exam-tag { display:inline-block; background:#e9f3fa; color:var(--azul3); font-size:11.5px; font-weight:700; border-radius:20px; padding:5px 13px; margin-top:12px; border:1px solid #bee0f5; }
.medical-item p { margin-bottom:8px; }
.medical-item p:last-of-type { margin-bottom:0; }

/* ============================================================
   PROCEDIMIENTOS â€” tarjetas expandidas con numeraciÃ³n
   ============================================================ */
.proc-list { display:grid; grid-template-columns:repeat(2,1fr); gap:22px; }
.proc-item { background:#fff; border:1px solid #dde8f2; border-radius:10px; padding:26px; box-shadow:0 3px 16px rgba(22,95,142,.07); transition:transform .2s,box-shadow .2s; }
.proc-item:hover { transform:translateY(-4px); box-shadow:0 12px 32px rgba(22,95,142,.13); border-color:#9ec8e8; }
.proc-num { display:inline-flex; align-items:center; justify-content:center; width:36px; height:36px; background:var(--azul2); color:#fff; font-weight:900; font-size:14px; border-radius:50%; margin-bottom:12px; }
.proc-item h3 { font-size:16px; font-weight:700; color:var(--dark); margin:0 0 10px; }
.proc-item p { font-size:14px; line-height:1.8; color:var(--text); margin:0 0 8px; }
@media(max-width:700px){ .proc-list { grid-template-columns:1fr; } }

/* ============================================================
   TERAPIA VISUAL â€” grid de beneficios responsive
   ============================================================ */
.terapia-beneficios > div { gap:14px; }
@media(max-width:800px){
  .terapia-beneficios > div[style*='grid-template-columns:repeat(3'] {
    grid-template-columns:1fr!important;
  }
}

/* ============================================================
   HOME â€” estadÃ­sticas en secciÃ³n "quiÃ©nes somos"
   ============================================================ */
.home-about-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:24px;background:var(--azul-light);border-radius:10px;padding:18px 20px}
.home-about-stats>div{text-align:center;padding:8px 4px}
.home-about-stats strong{display:block;font-size:28px;font-weight:900;color:var(--azul2);line-height:1.1}
.home-about-stats span{display:block;font-size:12px;color:#607080;font-weight:600;margin-top:4px;line-height:1.4}
@media(max-width:700px){.home-about-stats{grid-template-columns:repeat(2,1fr)}}

/* ============================================================
   PILAR â€” descripciÃ³n con mÃ¡s texto, altura uniforme
   ============================================================ */
.pilar{min-height:220px;display:flex;flex-direction:column;align-items:center}
.pilar p{font-size:14px;line-height:1.75;text-align:center}

/* ============================================================
   ABOUT .btn.outline corregido en fondo gris (visible)
   ============================================================ */
.section.gray .btn.outline{color:var(--azul2);border-color:var(--azul2)}
.section.gray .btn.outline:hover{background:var(--azul2);color:#fff}

/* ============================================================
   SERVICE SHORTCUTS â€” iconos visibles en fondo oscuro
   ============================================================ */
.service-shortcuts{background:var(--azul3)!important;padding:0}
.service-shortcuts-grid{display:grid;grid-template-columns:repeat(5,1fr)}
.service-shortcut{
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  padding:26px 16px;color:#fff;text-decoration:none;text-align:center;
  border-right:1px solid rgba(255,255,255,.12);
  transition:background .2s,transform .15s;min-height:130px;
}
.service-shortcut:last-child{border-right:0}
.service-shortcut:hover{background:rgba(255,255,255,.12);transform:translateY(-2px)}
.shortcut-icon{
  width:56px;height:56px;margin-bottom:12px;
  background:rgba(255,255,255,.15);
  border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  border:2px solid rgba(255,255,255,.3);
  box-shadow:none!important;
  opacity:1!important;
}
.shortcut-icon svg{
  width:30px;height:30px;
  fill:none;stroke:#fff;stroke-width:2.4;
  stroke-linecap:round;stroke-linejoin:round;
}
.service-shortcut strong{
  font-size:13px;font-weight:700;
  color:#fff;line-height:1.4;
  text-shadow:0 1px 4px rgba(0,0,0,.3);
  letter-spacing:.2px;
}
@media(max-width:900px){
  .service-shortcuts-grid{grid-template-columns:repeat(3,1fr)}
  .service-shortcut{border-bottom:1px solid rgba(255,255,255,.1)}
}
@media(max-width:500px){
  .service-shortcuts-grid{grid-template-columns:1fr 1fr}
  .service-shortcut{min-height:100px;padding:18px 10px}
}

/* ============================================================
   CONTACT STRIP PRO â€” emergencias + solicitar cita
   ============================================================ */
.contact-strip-pro{
  background:linear-gradient(100deg,var(--azul3) 0%,var(--azul2) 100%);
  padding:0;
  position:relative;
  overflow:hidden;
}
.contact-strip-pro::before{
  content:'';position:absolute;inset:0;
  background:url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.04'%3E%3Ccircle cx='30' cy='30' r='28'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
  pointer-events:none;
}
.cstrip-inner{
  display:grid;grid-template-columns:auto 1px 1fr;
  align-items:stretch;gap:0;position:relative;z-index:1;
}
.cstrip-emerg{
  display:flex;align-items:center;gap:18px;
  padding:28px 40px 28px 0;
  background:rgba(0,0,0,.18);
  padding-left:0;
  position:relative;
}
.cstrip-emerg-pulse{
  width:16px;height:16px;border-radius:50%;
  background:#ff4d4d;
  box-shadow:0 0 0 0 rgba(255,77,77,.5);
  animation:emerg-pulse 1.6s ease-in-out infinite;
  flex-shrink:0;
}
@keyframes emerg-pulse{
  0%{box-shadow:0 0 0 0 rgba(255,77,77,.6)}
  70%{box-shadow:0 0 0 12px rgba(255,77,77,0)}
  100%{box-shadow:0 0 0 0 rgba(255,77,77,0)}
}
.cstrip-emerg-text strong{
  display:block;color:#fff;font-size:16px;font-weight:900;
  letter-spacing:.5px;margin-bottom:4px;
}
.cstrip-emerg-text span{
  display:block;color:rgba(255,255,255,.8);font-size:13px;margin-bottom:8px;
}
.cstrip-emerg-tel{
  display:inline-block;color:#fff;font-size:22px;font-weight:900;
  text-decoration:none;letter-spacing:.5px;
  border-bottom:2px solid var(--gold);padding-bottom:2px;
  transition:color .15s;
}
.cstrip-emerg-tel:hover{color:var(--gold)}
.cstrip-divider{width:1px;background:rgba(255,255,255,.2);margin:20px 0}
.cstrip-cita{
  display:flex;align-items:center;justify-content:space-between;
  gap:24px;padding:28px 0 28px 40px;flex-wrap:wrap;
}
.cstrip-btns{display:flex;gap:12px;flex-wrap:wrap;align-items:center}
.cstrip-btn-cita{
  display:inline-flex;align-items:center;gap:8px;
  background:#fff;color:var(--azul3);
  font-weight:800;font-size:14px;letter-spacing:.4px;
  padding:14px 24px;border-radius:6px;text-decoration:none;
  transition:background .15s,transform .15s,box-shadow .15s;
  box-shadow:0 4px 14px rgba(0,0,0,.2);white-space:nowrap;
}
.cstrip-btn-cita:hover{background:var(--gold);color:#fff;transform:translateY(-2px);box-shadow:0 8px 22px rgba(0,0,0,.25)}
.cstrip-btn-wa{
  display:inline-flex;align-items:center;
  background:#25D366;color:#fff;
  font-weight:800;font-size:14px;
  padding:14px 22px;border-radius:6px;text-decoration:none;
  transition:background .15s,transform .15s;white-space:nowrap;
}
.cstrip-btn-wa:hover{background:#1ebe5c;transform:translateY(-2px)}
.cstrip-btn-tel{
  display:inline-flex;align-items:center;gap:6px;
  background:rgba(255,255,255,.15);color:#fff;
  font-weight:700;font-size:14px;
  padding:14px 20px;border-radius:6px;text-decoration:none;
  border:2px solid rgba(255,255,255,.35);
  transition:background .15s,border-color .15s;white-space:nowrap;
}
.cstrip-btn-tel:hover{background:rgba(255,255,255,.25);border-color:rgba(255,255,255,.6)}
@media(max-width:900px){
  .cstrip-inner{grid-template-columns:1fr;gap:0}
  .cstrip-divider{display:none}
  .cstrip-emerg{padding:22px;background:rgba(0,0,0,.25);border-radius:0}
  .cstrip-cita{padding:22px;flex-direction:column;align-items:flex-start}
  .cstrip-btns{gap:10px}
}
@media(max-width:500px){
  .cstrip-btn-cita,.cstrip-btn-wa,.cstrip-btn-tel{width:100%;justify-content:center;font-size:13px}
}

/* ============================================================
   CORRECCIONES CORPORATIVAS FINALES â€” legibilidad y limpieza
   ============================================================ */

/* 1. TOPBAR â€” emerg-badge refinado (sin bloque dorado sÃ³lido) */
.emerg-badge{
  background:transparent!important;
  color:#f5c842!important;
  border:1px solid rgba(245,200,66,.5)!important;
  border-radius:20px!important;
  padding:3px 10px!important;
  font-size:11px!important;
  font-weight:800!important;
  letter-spacing:.6px!important;
  animation:none!important;
}

/* 2. IMPACT STRIP â€” estadÃ­sticas con texto 100% legible */
.impact-strip{
  background:linear-gradient(90deg,var(--azul3),var(--azul2))!important;
  padding:32px 0!important;
  border:0!important;
}
.impact-grid{
  display:grid!important;
  grid-template-columns:repeat(4,1fr)!important;
  gap:0!important;
  text-align:center!important;
}
.impact-grid>div{
  color:#fff!important;
  padding:18px 20px!important;
  border-right:1px solid rgba(255,255,255,.15)!important;
  position:relative;
}
.impact-grid>div:last-child{border-right:0!important}
.impact-grid strong{
  display:block!important;
  color:#fff!important;
  font-size:46px!important;
  font-weight:900!important;
  line-height:1!important;
  text-shadow:0 2px 12px rgba(0,0,0,.2)!important;
}
.impact-grid strong::after{
  content:'+';
  font-size:22px;
  color:var(--gold);
  margin-left:3px;
  vertical-align:super;
}
.impact-grid span{
  display:block!important;
  color:rgba(255,255,255,.85)!important;
  font-size:12px!important;
  font-weight:700!important;
  letter-spacing:.8px!important;
  text-transform:uppercase!important;
  margin-top:8px!important;
  opacity:1!important;
}
@media(max-width:700px){
  .impact-grid{grid-template-columns:repeat(2,1fr)!important}
  .impact-grid>div:nth-child(2){border-right:0!important}
  .impact-grid>div{border-bottom:1px solid rgba(255,255,255,.12)!important}
  .impact-grid strong{font-size:36px!important}
}
@media(max-width:420px){
  .impact-grid{grid-template-columns:1fr!important}
  .impact-grid>div{border-right:0!important}
}

/* 3. SERVICE SHORTCUTS â€” sin bordes excesivos, diseÃ±o limpio */
.service-shortcuts{background:var(--dark)!important;border:0!important}
.service-shortcut{
  border-right:0!important;
  border-left:0!important;
  border-bottom:0!important;
  position:relative;
}
.service-shortcut+.service-shortcut::before{
  content:'';
  position:absolute;left:0;top:20%;bottom:20%;
  width:1px;
  background:rgba(255,255,255,.1);
}
.service-shortcut:hover::before{opacity:0}

/* 4. CARDS â€” sin bordes de borde excesivos */
.card{border:0!important;box-shadow:0 4px 24px rgba(0,0,0,.07)!important}
.card:hover{box-shadow:0 12px 36px rgba(22,95,142,.14)!important}

/* 5. TOPBAR â€” una sola fila, sin ruptura */
.topbar-inner{flex-wrap:nowrap!important;align-items:center!important}
.topbar-contact{
  display:flex;align-items:center;gap:10px;flex-wrap:nowrap;
  color:rgba(255,255,255,.82);font-size:12.5px;min-width:0;overflow:hidden;
  white-space:nowrap;
}
.topbar-contact span{color:rgba(255,255,255,.45);flex-shrink:0}
.topbar-contact a{color:#7ec8e3!important;text-decoration:none;white-space:nowrap}
.topbar-contact a:hover{color:#fff!important}
.social{flex-shrink:0;display:flex;align-items:center;gap:6px;margin-left:12px}
@media(max-width:700px){
  .topbar-contact .hide-sm{display:none}
  .topbar-contact{font-size:12px}
}

/* 6. LOGO ÃREA â€” wrapper limpio */
.brand-logo-wrap{display:flex;align-items:center}
.brand-logo-wrap .brand-logo{margin:0}

/* ============================================================
   SECCIÃ“N VIDEOS / YOUTUBE
   ============================================================ */
.yt-canal-banner{
  display:flex;align-items:center;justify-content:space-between;
  gap:24px;flex-wrap:wrap;
  background:#fff;
  border:2px solid #e8eff5;
  border-radius:16px;
  padding:28px 32px;
  margin-bottom:32px;
  box-shadow:0 4px 24px rgba(22,95,142,.07);
}
.yt-canal-info{display:flex;align-items:center;gap:20px}
.yt-canal-logo{flex-shrink:0}
.yt-canal-btn{
  display:inline-flex;align-items:center;gap:10px;
  background:#FF0000;color:#fff;
  font-weight:800;font-size:14px;letter-spacing:.3px;
  padding:13px 24px;border-radius:8px;text-decoration:none;
  transition:background .15s,transform .15s,box-shadow .15s;
  box-shadow:0 4px 16px rgba(255,0,0,.25);
  white-space:nowrap;flex-shrink:0;
}
.yt-canal-btn:hover{background:#cc0000;transform:translateY(-2px);box-shadow:0 8px 24px rgba(255,0,0,.35)}

.yt-videos-grid{
  display:grid;
  grid-template-columns:1.6fr 1fr 1fr;
  gap:20px;
  margin-bottom:32px;
}
.yt-video-card{
  border-radius:14px;overflow:hidden;
  border:1px solid #e4edf5;
  background:#fff;
  box-shadow:0 3px 16px rgba(22,95,142,.07);
  display:flex;flex-direction:column;
}
.yt-embed-wrap{
  position:relative;padding-top:56.25%;background:#000;
  flex-shrink:0;
}
.yt-embed-wrap iframe{
  position:absolute;inset:0;width:100%;height:100%;border:0;
}
.yt-video-info{
  padding:14px 16px;
}
.yt-tag{
  display:inline-block;background:#ffeaea;color:#cc0000;
  font-size:11px;font-weight:800;border-radius:20px;
  padding:3px 10px;margin-bottom:8px;letter-spacing:.5px;
}
.yt-redirect-card,.yt-info-card{min-height:280px}
.yt-redirect-inner{
  flex:1;display:flex;flex-direction:column;
  align-items:center;justify-content:center;
  text-align:center;padding:28px 20px;
  background:#fff8f8;
}
.yt-redirect-inner h4{
  font-size:17px;font-weight:800;color:#1e3a4f;
  margin:12px 0 8px;
}
.yt-redirect-inner p{font-size:13px;color:#607488;line-height:1.65;margin:0 0 4px}
.yt-suscribir-btn{
  display:inline-flex;align-items:center;gap:8px;
  background:#FF0000;color:#fff;font-weight:800;
  font-size:13px;padding:11px 20px;border-radius:8px;
  text-decoration:none;margin-top:16px;
  transition:background .15s,transform .15s;
}
.yt-suscribir-btn:hover{background:#cc0000;transform:translateY(-1px)}

.yt-cta-strip{
  background:linear-gradient(90deg,#ff0000,#cc2200);
  border-radius:12px;padding:22px 30px;
  display:flex;align-items:center;justify-content:space-between;
  gap:20px;flex-wrap:wrap;
}
.yt-cta-strip p{margin:0;color:#fff;font-size:15px;font-weight:700}

@media(max-width:900px){
  .yt-videos-grid{grid-template-columns:1fr}
  .yt-canal-banner{flex-direction:column;align-items:flex-start}
  .yt-cta-strip{flex-direction:column;text-align:center}
}
@media(max-width:600px){
  .yt-canal-info{flex-direction:column;text-align:center}
  .yt-canal-btn{width:100%;justify-content:center}
}

/* ============================================================
   REDISEÃ‘O PROFESIONAL PREMIUM v5 â€” Qhali Ã‘awi 2026
   Paleta corporativa, tipografÃ­a Inter, navbar blanca
   ============================================================ */

/* 1. Fuente premium */
body{font-family:'Inter','Segoe UI',system-ui,Arial,sans-serif}

/* 2. Nueva paleta corporativa */
:root{
  --azul:#1565C0;
  --azul2:#0d52a0;
  --azul3:#0a3d7a;
  --azul-light:#e8f1fd;
  --dark:#0d2040;
  --text:#475569;
  --light:#f8fafc;
  --gold:#d4a017;
  --green:#25D366;
  --shadow:0 4px 24px rgba(13,32,64,.10);
}

/* 3. TOPBAR â€” slim, muy oscuro, elegante */
.topbar{background:#071629!important;min-height:36px!important;padding:0!important}
.topbar-inner{padding:6px 0!important}
.topbar a{color:#60a5fa!important}
.topbar a:hover{color:#fff!important}
.emerg-badge{
  background:rgba(255,77,77,.18)!important;
  color:#ff6b6b!important;
  border:1px solid rgba(255,77,77,.35)!important;
  border-radius:20px!important;
  padding:2px 9px!important;
  font-size:10.5px!important;
  font-weight:800!important;
  letter-spacing:.7px!important;
  animation:none!important;
}
.soc-ico{background:#1e3a5f!important;color:#93c5fd!important}
.soc-ico:hover{background:var(--azul)!important;color:#fff!important}

/* 4. BRAND ZONE â€” limpia, blanca, sin bordes pesados */
.brand-zone{
  background:#fff!important;
  border-bottom:1px solid #e2e8f0!important;
  min-height:88px!important;
  padding:10px 0!important;
}
.brand-inner{min-height:68px!important}

/* 5. NAVBAR â€” BLANCA CORPORATIVA (el cambio mÃ¡s impactante) */
.nav-wrap{
  background:#ffffff!important;
  border:0!important;
  border-bottom:2px solid #e2e8f0!important;
  box-shadow:0 1px 12px rgba(0,0,0,.06)!important;
  min-height:56px!important;
}
.nav-wrap.nav-floating{
  background:#ffffff!important;
  border-bottom:3px solid var(--azul)!important;
  box-shadow:0 4px 24px rgba(0,0,0,.10)!important;
}
.main-nav{min-height:56px!important}
.main-nav a{
  color:#1e293b!important;
  border-right:1px solid #f1f5f9!important;
  font-size:13.5px!important;
  font-weight:600!important;
  letter-spacing:.15px!important;
  height:56px!important;
  padding:0 16px!important;
  transition:background .15s,color .15s!important;
}
.main-nav li:last-child a{border-right:0!important}
.main-nav li.active>a,.main-nav li:hover>a{
  color:var(--azul)!important;
  background:#f0f7ff!important;
}
.main-nav li.active:before{
  background:var(--azul)!important;
  height:3px!important;
  top:auto!important;bottom:0!important;
}
.nav-wrap.nav-floating .main-nav a{
  color:#1e293b!important;
  height:56px!important;
}
.dropdown{
  background:#fff!important;
  border:1px solid #e2e8f0!important;
  border-top:3px solid var(--azul)!important;
  box-shadow:0 12px 40px rgba(0,0,0,.12)!important;
  border-radius:0 0 10px 10px!important;
}
.dropdown a{
  color:#334155!important;
  background:transparent!important;
  border-bottom:1px solid #f1f5f9!important;
  font-size:13px!important;
}
.dropdown a:hover{background:#f0f7ff!important;color:var(--azul)!important}
.menu-toggle{background:var(--azul)!important}
.phone-icon{color:var(--azul)!important;font-size:20px!important}

/* 6. HERO â€” mÃ¡s impacto, tipografÃ­a grande */
.hero{height:580px!important}
.hero:after{background:linear-gradient(100deg,rgba(7,22,41,.95) 38%,rgba(10,61,122,.78) 68%,rgba(10,61,122,.22) 100%)!important}
.hero-card{
  width:550px!important;
  background:transparent!important;
  border:0!important;
  border-left:4px solid var(--gold)!important;
  padding:48px 46px!important;
  box-shadow:none!important;
  backdrop-filter:none!important;
}
.hero-card .tag{color:var(--gold)!important;font-size:11px!important;letter-spacing:4px!important;font-weight:800!important}
.hero-card h1{font-size:50px!important;font-weight:800!important;color:#fff!important;line-height:1.06!important;text-shadow:0 2px 20px rgba(0,0,0,.25)!important}
.hero-card p{color:rgba(255,255,255,.87)!important;font-size:17px!important;line-height:1.8!important}
.btn{border-radius:6px!important;font-weight:700!important;letter-spacing:.2px!important}
.btn.primary{background:var(--azul)!important;box-shadow:0 6px 20px rgba(21,101,192,.38)!important}
.btn.primary:hover{background:var(--azul2)!important;transform:translateY(-2px)!important;box-shadow:0 10px 28px rgba(21,101,192,.48)!important}
.btn.outline{border:2px solid rgba(255,255,255,.82)!important;color:#fff!important}
.btn.outline:hover{background:#fff!important;color:var(--azul)!important}
.btn.hero-wa{background:#25D366!important;border-color:#25D366!important;color:#fff!important}

/* 7. IMPACT STRIP â€” mÃ¡s limpio */
.impact-strip{background:linear-gradient(90deg,var(--azul3),var(--azul))!important;padding:30px 0!important}
.impact-grid strong{font-size:44px!important}
.impact-grid strong::after{color:var(--gold)!important}

/* 8. SECCIONES â€” mÃ¡s espacio blanco */
.section{padding:76px 0!important}
.section.gray{background:#f8fafc!important}
.title h2{font-size:34px!important;font-weight:800!important;color:var(--dark)!important}
.title .line{background:linear-gradient(90deg,var(--azul),var(--gold))!important;width:60px!important;height:3px!important}

/* 9. SERVICE SHORTCUTS â€” dark navy elegante */
.service-shortcuts{background:var(--dark)!important}
.service-shortcut:hover{background:rgba(255,255,255,.08)!important}

/* 10. CARDS */
.card{border:0!important;border-radius:12px!important;box-shadow:0 2px 16px rgba(0,0,0,.07)!important}
.card:hover{box-shadow:0 16px 48px rgba(21,101,192,.14)!important;transform:translateY(-6px)!important}
.card h3{color:var(--dark)!important}

/* 11. CONTENT BOX */
.content-box{border-radius:14px!important;box-shadow:0 4px 32px rgba(0,0,0,.08)!important;padding:48px!important}

/* 12. INNER BANNER */
.inner-banner{height:280px!important}
.inner-banner:before{background:linear-gradient(rgba(7,22,41,.88),rgba(7,22,41,.88)),url('../img/cirugias-oftalmologo-chiclayo.jpg') center/cover!important}
.inner-banner h1{font-size:40px!important;font-weight:800!important}

/* 13. TIMELINE */
.timeline div{border-left:4px solid var(--azul)!important;background:#f8fafc!important}
.timeline div:hover{border-left-color:var(--gold)!important;background:var(--azul-light)!important}
.timeline b{color:var(--dark)!important}

/* 14. CONTACT STRIP */
.contact-strip,.contact-strip-pro{background:linear-gradient(100deg,var(--azul3),var(--azul))!important}

/* 15. FOOTER */
.footer{background:#071629!important}
.footer-grid-pro h3{font-size:13px!important;letter-spacing:1px!important;border-bottom-color:var(--azul)!important}
.footer-grid-pro a{color:#94a3b8!important}
.footer-grid-pro a:hover{color:#fff!important;padding-left:5px!important}
.copy{border-top-color:rgba(255,255,255,.08)!important;color:#475569!important}

/* 16. SIDE MENU */
.side-menu a{background:#f8fafc!important;color:#334155!important;font-size:13.5px!important;font-weight:600!important}
.side-menu a:hover,.side-menu a.active{background:var(--azul-light)!important;border-left-color:var(--azul)!important;color:var(--azul)!important}

/* 17. FORMULARIO CONTACTO */
.contact-form input,.contact-form textarea,.contact-form select{border-color:#e2e8f0!important;border-radius:8px!important}
.contact-form input:focus,.contact-form textarea:focus{border-color:var(--azul)!important;box-shadow:0 0 0 3px rgba(21,101,192,.12)!important}
.contact-form button{background:var(--azul)!important;border-radius:8px!important}
.contact-form button:hover{background:var(--azul2)!important}

/* 18. MEDICAL ITEMS & PROC ITEMS */
.medical-item{border-color:#e2e8f0!important}
.medical-item:hover{border-color:var(--azul)!important;box-shadow:0 8px 28px rgba(21,101,192,.12)!important}
.proc-item:hover{border-color:var(--azul)!important}

/* 19. PILAR */
.pilar:hover{background:var(--azul-light)!important}

/* 20. DIRECTOR + STAFF */
.director-card{background:var(--azul-light)!important;border-color:#bee0f5!important}
.director-avatar,.card.staff .avatar{background:var(--azul)!important}

/* 21. MAP BOX */
.map-box{background:var(--azul-light)!important;border-color:#c7ddf5!important}

/* ============================================================
   NUEVA SECCIÃ“N VIDEOS â€” reproductor profesional
   ============================================================ */
.yt-featured-player{
  display:grid;
  grid-template-columns:1fr 340px;
  gap:24px;
  align-items:start;
  margin-bottom:40px;
}
.yt-featured-frame{
  position:relative;
  padding-top:56.25%;
  border-radius:14px;
  overflow:hidden;
  background:#000;
  box-shadow:0 8px 40px rgba(0,0,0,.18);
}
.yt-featured-frame iframe{
  position:absolute;inset:0;width:100%;height:100%;border:0;
}
.yt-featured-info{
  background:#fff;
  border-radius:14px;
  padding:28px;
  border:1px solid #e2e8f0;
  box-shadow:0 2px 16px rgba(0,0,0,.06);
  display:flex;
  flex-direction:column;
  gap:0;
}
.yt-content-list{
  list-style:none;padding:0;margin:0 0 20px;
  display:grid;gap:8px;
}
.yt-content-list li{
  font-size:13.5px;color:var(--text);
  display:flex;align-items:center;gap:8px;line-height:1.4;
}
.yt-check{
  display:inline-flex;align-items:center;justify-content:center;
  width:20px;height:20px;border-radius:50%;
  background:var(--azul-light);color:var(--azul);
  font-size:11px;font-weight:900;flex-shrink:0;
}
.yt-grid-3{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:20px;
}
.yt-video-card{
  border-radius:12px;overflow:hidden;
  border:1px solid #e2e8f0;
  background:#fff;
  box-shadow:0 2px 14px rgba(0,0,0,.06);
  display:flex;flex-direction:column;
  transition:box-shadow .2s,transform .2s;
}
.yt-video-card:hover{box-shadow:0 10px 32px rgba(21,101,192,.12);transform:translateY(-3px)}
.yt-embed-wrap{position:relative;padding-top:56.25%;background:#000;flex-shrink:0}
.yt-embed-wrap iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.yt-video-info{padding:14px 16px}
.yt-tag{display:inline-block;background:#e8f1fd;color:var(--azul);font-size:10.5px;font-weight:800;border-radius:20px;padding:3px 10px;margin-bottom:6px;letter-spacing:.5px}
.yt-canal-banner{
  display:flex;align-items:center;justify-content:space-between;
  gap:20px;flex-wrap:wrap;
  background:#fff;
  border:1px solid #e2e8f0;
  border-radius:14px;
  padding:22px 28px;
  margin-bottom:28px;
  box-shadow:0 2px 16px rgba(0,0,0,.06);
}
.yt-canal-info{display:flex;align-items:center;gap:16px}
.yt-suscribir-btn{
  display:inline-flex;align-items:center;gap:8px;
  background:#FF0000;color:#fff;font-weight:800;
  font-size:13.5px;padding:12px 22px;border-radius:8px;
  text-decoration:none;
  transition:background .15s,transform .15s;
  white-space:nowrap;
}
.yt-suscribir-btn:hover{background:#cc0000;transform:translateY(-1px)}
.yt-cta-strip{
  background:linear-gradient(90deg,#cc0000,#ff0000);
  border-radius:12px;padding:24px 32px;
  display:flex;align-items:center;justify-content:space-between;
  gap:20px;flex-wrap:wrap;
}
@media(max-width:960px){
  .yt-featured-player{grid-template-columns:1fr}
  .yt-grid-3{grid-template-columns:1fr 1fr}
  .yt-canal-banner{flex-direction:column;align-items:flex-start}
  .yt-cta-strip{flex-direction:column;text-align:center}
}
@media(max-width:600px){
  .yt-grid-3{grid-template-columns:1fr}
  .yt-canal-info{flex-direction:column}
}

/* Ajuste responsive hero */
@media(max-width:900px){
  .hero{height:auto!important;min-height:440px!important}
  .hero-card{width:auto!important;margin:48px 16px!important;padding:28px 24px!important}
  .hero-card h1{font-size:34px!important}
  .section{padding:56px 0!important}
  .content-box{padding:24px!important}
}
@media(max-width:600px){
  .hero-card h1{font-size:28px!important}
  .title h2{font-size:26px!important}
  .inner-banner h1{font-size:28px!important}
  .inner-banner{height:220px!important}
  .inner-banner .container{padding-top:72px!important}
}

/* ============================================================
   MEDICAL ITEMS & PROC ITEMS CON IMAGEN
   ============================================================ */
.medical-item.has-img{padding:0!important;overflow:hidden}
.medical-item.has-img .mi-img{width:100%;height:155px;object-fit:cover;display:block;border-radius:8px 8px 0 0}
.medical-item.has-img .mi-body{padding:18px}
.medical-item.has-img .mi-body h3{margin-top:0}
.proc-item.has-img{padding:0!important;overflow:hidden}
.proc-item.has-img .pi-img{width:100%;height:140px;object-fit:cover;display:block;border-radius:10px 10px 0 0}
.proc-item.has-img .pi-body{padding:22px}
.proc-item.has-img .pi-body .proc-num{margin-bottom:10px}

/* Pilares con imagen de fondo */
.pilar.pilar-visual{padding:0;overflow:hidden;text-align:left}
.pilar.pilar-visual .pilar-img{width:100%;height:160px;object-fit:cover;display:block}
.pilar.pilar-visual .pilar-body{padding:22px}
.pilar.pilar-visual .pilar-body .pilar-icon{font-size:24px;margin-bottom:8px}
.pilar.pilar-visual .pilar-body h3{font-size:17px;margin:0 0 10px}
.pilar.pilar-visual .pilar-body p{font-size:13.5px;line-height:1.7;margin:0;text-align:left}

/* Nosotros: imagen lateral profesional */
.nosotros-about{display:grid;grid-template-columns:1fr 400px;gap:36px;align-items:start;margin-top:28px}
.nosotros-about-img{border-radius:12px;overflow:hidden;box-shadow:0 8px 32px rgba(0,0,0,.12)}
.nosotros-about-img img{width:100%;height:520px;object-fit:cover;object-position:center 30%;display:block}
.about img.about-clinic-photo{height:480px;object-fit:cover;object-position:center 30%;border-radius:14px}
@media(max-width:900px){.nosotros-about{grid-template-columns:1fr}}

/* Video cards click-to-play */
.yt-play-card{
  border-radius:12px;overflow:hidden;
  border:1px solid #e2e8f0;
  background:#fff;
  box-shadow:0 2px 14px rgba(0,0,0,.07);
  cursor:pointer;
  display:flex;flex-direction:column;
  transition:box-shadow .2s,transform .2s;
}
.yt-play-card:hover{box-shadow:0 10px 32px rgba(21,101,192,.14);transform:translateY(-4px)}
.yt-thumb{
  position:relative;padding-top:56.25%;
  overflow:hidden;flex-shrink:0;
}
.yt-thumb-bg{
  position:absolute;inset:0;
}
.yt-play-icon{
  position:absolute;inset:0;
  display:flex;align-items:center;justify-content:center;
  transition:transform .2s;
}
.yt-play-card:hover .yt-play-icon{transform:scale(1.12)}
.yt-play-icon svg circle{transition:fill .2s}
.yt-play-card:hover .yt-play-icon svg circle{fill:rgba(255,255,255,.28)}
.yt-thumb-label{
  position:absolute;bottom:10px;left:12px;
  background:rgba(0,0,0,.55);color:#fff;
  font-size:11px;font-weight:800;letter-spacing:.5px;
  padding:3px 10px;border-radius:20px;
  text-transform:uppercase;
}
.yt-featured-player{
  display:grid;grid-template-columns:1fr;gap:0;margin-bottom:0;
}
.yt-featured-info{
  background:#fff;border-radius:14px;padding:24px 28px;
  border:1px solid #e2e8f0;box-shadow:0 2px 16px rgba(0,0,0,.06);
}
@media(max-width:700px){
  .yt-content-list{display:block!important}
  .yt-featured-info div[style*="grid-template-columns"]{grid-template-columns:1fr!important}
}

/* ============================================================
   HERO BANNER SLIDER â€” imagen completa sin recorte
   ============================================================ */
.hero-banner-slider{
  position:relative;
  width:100%;
  overflow:hidden;
  background:#0d1b2e;
}
.hbs-track{
  display:flex;
  width:100%;
  transition:none;
}
.hbs-slide{
  min-width:100%;
  display:none;
}
.hbs-slide.active{
  display:block;
}
.hbs-img{
  width:100%;
  height:auto;
  display:block;
}
@media(max-width:768px){
  .hero-banner-slider{max-height:none}
}
.hbs-dots{
  position:absolute;
  bottom:14px;
  left:50%;
  transform:translateX(-50%);
  display:flex;
  gap:9px;
  z-index:20;
}
.hbs-dot{
  width:11px;height:11px;
  border-radius:50%;
  background:rgba(255,255,255,.4);
  border:2px solid rgba(255,255,255,.7);
  cursor:pointer;
  transition:background .25s,transform .25s;
}
.hbs-dot.active{
  background:#fff;
  transform:scale(1.2);
}
@media(max-width:600px){
  .hbs-dots{bottom:8px}
  .hbs-dot{width:8px;height:8px}
}

/* Franja CTA debajo del banner */
.hero-cta-strip{
  background:#071629;
  padding:14px 0;
  border-bottom:3px solid var(--azul2);
}
.hero-cta-inner{
  display:flex;align-items:center;justify-content:space-between;
  gap:16px;flex-wrap:wrap;
}
.hero-cta-text{
  display:flex;flex-direction:column;gap:2px;
}
.hero-cta-text strong{color:#fff;font-size:15px;font-weight:700}
.hero-cta-text span{color:#90caf9;font-size:12px}
.hero-cta-btns{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
@media(max-width:768px){
  .hero.hero-clean .slide,.hero.hero-clean{height:260px!important;max-height:260px!important}
  .hero-cta-inner{flex-direction:column;align-items:flex-start}
  .hero-cta-btns{gap:8px}
}

/* ============================================================
   MEJORAS PROFESIONALES â€” 26 Jun 2026
   ============================================================ */

/* 1. QUITAR DORADO â€” todo azul corporativo */
.hero-card{border-left:4px solid #42a5f5!important}
.hero-card .tag{color:#90caf9!important}
.title .line{background:linear-gradient(90deg,var(--azul2),#42a5f5)!important}
.main-nav li.active:before{background:var(--azul2)!important}
.dropdown{border-top:3px solid var(--azul2)!important}
.emerg-badge,.topbar-emergency span.badge{background:#c0392b!important;color:#fff!important}
.timeline div:hover{border-left-color:var(--azul2)!important}
.cstrip-btn-cita:hover{background:var(--azul2)!important}
.cstrip-emerg-tel:hover{color:#90caf9!important}

/* 2. TEXTO JUSTIFICADO en todo el contenido */
.content-box p,.section p,.card p,.pilar-body p,.mi-body p,.pi-body p,
.nosotros-about p,.timeline span,.medical-item p,.proc-item p,
.exam-intro-box p,.staff-card p,.testimonio blockquote{text-align:justify!important}

/* 3. INNER-BANNER â€” imagen de equipos visible con gradiente lateral */
.inner-banner{height:300px!important}
.inner-banner:before{
  background:
    linear-gradient(100deg,rgba(7,22,41,.94) 35%,rgba(21,101,192,.65) 65%,rgba(21,101,192,.10) 100%),
    url('../img/hero-banner-3.png') right center/cover!important;
}
.inner-banner h1{font-size:42px!important;font-weight:800!important;letter-spacing:-.5px!important}
.inner-banner .breadcrumbs{color:rgba(255,255,255,.65)!important;font-size:13px!important}

/* 4. HERO â€” overlay mÃ¡s suave para ver mÃ¡s de la imagen */
.hero:after{
  background:linear-gradient(100deg,rgba(7,22,41,.90) 32%,rgba(21,101,192,.55) 62%,rgba(21,101,192,.04) 100%)!important;
}
.hero{height:600px!important}

/* 5. IMÃGENES MÃS COMPACTAS Y CENTRADAS */
.medical-item.has-img .mi-img{height:180px!important;object-position:top center!important}
.proc-item.has-img .pi-img{height:180px!important;object-position:top center!important}
.pilar.pilar-visual .pilar-img{height:130px!important;object-position:center center!important}
.nosotros-about-img img{height:420px!important;object-position:center 30%!important}
.nosotros-about{grid-template-columns:1fr 400px!important;gap:28px!important}

/* 6. CARDS MÃS COMPACTAS Y ORGANIZADAS */
.medical-item.has-img .mi-body{padding:14px 16px!important}
.medical-item.has-img .mi-body h3{font-size:15px!important;margin:0 0 8px!important;line-height:1.3!important}
.medical-item.has-img .mi-body p{font-size:13px!important;line-height:1.6!important;margin:0 0 8px!important}
.proc-item.has-img .pi-body{padding:16px 18px!important}
.proc-item.has-img .pi-body h3{font-size:15px!important;margin:0 0 8px!important}
.proc-item.has-img .pi-body p{font-size:13px!important;line-height:1.6!important;margin:0 0 8px!important}
.proc-num{width:32px!important;height:32px!important;font-size:13px!important;line-height:32px!important;margin-bottom:8px!important}

/* 7. TAGS MÃS COMPACTOS */
.exam-tag{font-size:11px!important;padding:4px 10px!important}

/* 8. MEDICAL-LIST: 3 columnas para mÃ¡s espacio visual */
.medical-list{grid-template-columns:repeat(auto-fill,minmax(240px,1fr))!important;gap:18px!important}

/* 9. PROC-LIST: 2 columnas bien distribuidas */
.proc-list{grid-template-columns:repeat(auto-fill,minmax(320px,1fr))!important;gap:20px!important}

/* 10. Pilares: 4 columnas en desktop */
.pilares-grid{grid-template-columns:repeat(auto-fill,minmax(210px,1fr))!important;gap:18px!important}

/* 11. RESPONSIVE AJUSTES */
@media(max-width:900px){
  .inner-banner{height:230px!important}
  .inner-banner h1{font-size:30px!important}
  .inner-banner .container{padding-top:78px!important}
  .nosotros-about{grid-template-columns:1fr!important}
  .medical-list{grid-template-columns:repeat(auto-fill,minmax(200px,1fr))!important}
  .proc-list{grid-template-columns:1fr!important}
}
@media(max-width:600px){
  .medical-list{grid-template-columns:1fr 1fr!important}
  .inner-banner h1{font-size:26px!important}
}

