.clinical-dashboard { max-width: 1180px; margin: 0 auto; padding: 52px 20px 72px; position:relative; }
.clinical-dashboard::before { content:""; position:absolute; width:260px; height:260px; right:-90px; top:10px; border-radius:50%; background:radial-gradient(circle,#bfe9df 0,rgba(191,233,223,0) 70%); pointer-events:none; }
.dashboard-heading { display:flex; justify-content:space-between; gap:24px; align-items:end; margin:0 0 28px; position:relative; }
.dashboard-heading h1 { margin:0; font-size:clamp(32px,4vw,46px); color:var(--dark); letter-spacing:-1.2px; }
.dashboard-heading p { margin:8px 0 0; color:var(--muted); max-width:620px; }
.triage-card { display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:20px; padding:30px; border-radius:24px; background-image:linear-gradient(100deg,rgba(19,78,74,.98),rgba(15,118,110,.86),rgba(15,118,110,.38)),url('../inicio.jpeg'); background-size:cover; background-position:center; color:#fff; box-shadow:0 16px 38px #134e4a38; margin-bottom:32px; overflow:hidden; position:relative; }
.triage-card::after { content:"SIVE"; position:absolute; right:190px; bottom:-36px; font-size:120px; font-weight:900; letter-spacing:4px; color:#fff; opacity:.07; }
.triage-icon,.area-icon { display:grid; place-items:center; width:56px; height:56px; border-radius:17px; font-size:26px; background:#ffffff22; backdrop-filter:blur(8px); }
.triage-card h2 { margin:0 0 4px; font-size:26px; }.triage-card p { margin:0; color:#dff4ef; max-width:580px; }
.triage-card button { background:#fff; color:var(--dark); white-space:nowrap; box-shadow:0 8px 18px #0002; position:relative; z-index:1; }
.areas-title { margin:0 0 14px; font-size:18px; color:var(--dark); }
.areas-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }
.area-card { text-align:left; min-height:220px; background-color:#fff; border:1px solid var(--line); border-radius:20px; padding:22px; transition:transform .18s,box-shadow .18s,border-color .18s; background-size:cover; background-position:center; position:relative; overflow:hidden; }
.area-card::before { content:""; position:absolute; inset:0; background:linear-gradient(145deg,rgba(255,255,255,.97) 0%,rgba(255,255,255,.87) 63%,rgba(234,245,242,.78)); transition:background .18s; }
.area-card>* { position:relative; z-index:1; }.area-card:hover { transform:translateY(-4px); border-color:var(--teal); box-shadow:0 16px 32px #134e4a1c; }.area-card:hover::before{background:linear-gradient(145deg,rgba(255,255,255,.92),rgba(234,245,242,.72));}
.area-card .area-icon { background:var(--mint); margin-bottom:16px; box-shadow:0 6px 16px #134e4a12; }.area-card h3 { margin:0 0 5px; color:var(--dark); font-size:19px; }.area-card p { margin:0; color:#496560; font-size:13px; }.area-card small { display:block; margin-top:16px; color:var(--teal); font-weight:800; }
.area-card:nth-child(1){background-image:url('../servicio-medicina.jpg')}.area-card:nth-child(2){background-image:url('../servicio-fonoaudiologia.jpg')}.area-card:nth-child(3){background-image:url('../servicio-fisioterapia.jpg')}.area-card:nth-child(4){background-image:url('../servicio-odontologia.jpg')}.area-card:nth-child(5){background-image:url('../servicio-optometria.jpg')}.area-card:nth-child(6){background-image:url('../servicio-psicologia.jpg')}
.area-hero-back { border:0; background:transparent; color:var(--teal); font-weight:800; padding:0 0 8px; }
.area-label { display:inline-block; margin-bottom:8px; padding:5px 10px; border-radius:99px; background:var(--mint); color:var(--dark); font-size:12px; font-weight:800; }
.triage-form { margin-top:24px; }
.triage-form .form-actions { grid-column:1 / -1; }

/* Experiencia visual dentro del portal */
#clinicalPortal {
  min-height: 100vh;
  background:
    radial-gradient(circle at 92% 18%, rgba(125, 208, 191, .28), transparent 23%),
    radial-gradient(circle at 5% 70%, rgba(71, 149, 186, .14), transparent 28%),
    linear-gradient(135deg, #eef8f5 0%, #f8fbfd 48%, #edf5fb 100%);
}

#clinicalPortal .page { position:relative; }
.area-page .hero, .triage-page .hero {
  min-height: 235px;
  position: relative;
  border: 0;
  border-radius: 25px;
  color: #fff;
  padding: 34px;
  background-size: cover;
  background-position: center;
  box-shadow: 0 18px 42px rgba(19, 78, 74, .18);
  overflow: hidden;
}

.area-page .hero::before, .triage-page .hero::before {
  content: "";
  position:absolute;
  inset:0;
  background:linear-gradient(100deg, rgba(12, 54, 53, .95), rgba(15, 118, 110, .74), rgba(15, 118, 110, .28));
}

.area-page .hero > *, .triage-page .hero > * { position:relative; z-index:1; }
.area-page .hero h1, .triage-page .hero h1 { color:#fff; font-size:clamp(31px, 4vw, 47px); letter-spacing:-1.25px; }
.area-page .hero p, .triage-page .hero p { color:rgba(255,255,255,.85); max-width:580px; }
.area-page .hero .eyebrow, .triage-page .hero .eyebrow { color:#aee6d9; }
.area-page .hero .area-label, .triage-page .hero .area-label { background:rgba(255,255,255,.16); color:#fff; backdrop-filter:blur(8px); }
.area-page .hero .stat strong, .triage-page .hero .stat strong { color:#fff; }
.area-page .hero .stat span, .triage-page .hero .stat span { color:#d8f3ed; }
.area-hero-back { color:#d8f3ed; }.area-hero-back:hover { color:#fff; }

.area-medicina .hero { background-image:url('../servicio-medicina.jpg'); }
.area-fonoaudiologia .hero { background-image:url('../servicio-fonoaudiologia.jpg'); }
.area-fisioterapia .hero { background-image:url('../servicio-fisioterapia.jpg'); }
.area-odontologia .hero { background-image:url('../servicio-odontologia.jpg'); }
.area-optometria .hero { background-image:url('../servicio-optometria.jpg'); }
.area-psicologia .hero { background-image:url('../servicio-psicologia.jpg'); }
.triage-page .hero { background-image:url('../birigadaj.jpeg'); }

#clinicalPortal .form-card, #clinicalPortal .patient-card { box-shadow:0 10px 28px rgba(21, 69, 65, .07); }
#clinicalPortal .section-title { background:linear-gradient(90deg, #f2fbf8, #f9fcfe); }
#clinicalPortal .section-title h2 { color:var(--dark); font-size:20px; }
#clinicalPortal .field label { color:#285a55; letter-spacing:.1px; }
#clinicalPortal input, #clinicalPortal select, #clinicalPortal textarea { background:rgba(255,255,255,.92); }
#clinicalPortal input:focus, #clinicalPortal select:focus, #clinicalPortal textarea:focus { box-shadow:0 0 0 4px rgba(63, 170, 151, .18); }
#clinicalPortal .primary { box-shadow:0 8px 18px rgba(15,118,110,.2); }
@media(max-width:720px){.clinical-dashboard{padding:26px 14px 60px}.dashboard-heading{align-items:start;flex-direction:column}.triage-card{grid-template-columns:auto 1fr}.triage-card button{grid-column:1/-1;width:100%}.areas-grid{grid-template-columns:1fr}.area-card{padding:18px}}
