/* v340 – Bệnh viện website trang chủ. Mọi thay đổi được giới hạn trong section này. */
.os-home-v9 .os-v340-hospital { padding: 76px 0 80px !important; background: linear-gradient(180deg,#faf7f0 0%,#fffaf1 100%) !important; color:#000730; }
.os-home-v9 .os-v340-hospital * { box-sizing:border-box; }
.os-home-v9 .os-v340-hospital__heading { max-width:790px; margin:0 auto 30px; text-align:center; }
.os-home-v9 .os-v340-hospital__eyebrow { display:inline-flex; align-items:center; justify-content:center; gap:8px; color:#9a6b1d; font-size:11px; font-weight:800; letter-spacing:.12em; line-height:1.5; }
.os-home-v9 .os-v340-hospital__eyebrow svg { width:17px;height:17px; }
.os-home-v9 .os-v340-hospital__heading h2 { margin:12px auto 10px !important; color:#000730 !important; font-family:var(--onestack-font-heading) !important; font-weight:700; font-size:clamp(25px,2.8vw,37px); line-height:1.25; letter-spacing:-.035em; }
.os-home-v9 .os-v340-hospital__heading>p { margin:0 !important; color:#775e42 !important; font-size:clamp(13px,1.3vw,16px) !important; font-weight:600; line-height:1.6; }
.os-home-v9 .os-v340-hospital__heading>p span { padding:0 5px; color:#ca992f; }
.os-home-v9 .os-v340-hospital__panel { display:grid; grid-template-columns:minmax(0,.87fr) minmax(0,1.13fr); background:#fff; border:1px solid #eee3d1; border-radius:24px; box-shadow:0 18px 40px rgba(33,36,45,.065); overflow:hidden; }
.os-home-v9 .os-v340-hospital__visual { min-width:0; min-height:480px; background:linear-gradient(142deg,#000730 0%,#0c1646 100%); color:#fff; display:flex; flex-direction:column; justify-content:space-between; padding:26px 22px 22px; position:relative; isolation:isolate; overflow:hidden; }
.os-home-v9 .os-v340-hospital__visual-label { position:relative; z-index:1; display:flex; align-items:center; gap:8px; font-weight:800; font-size:11px; letter-spacing:.07em; color:#f3cf87; }
.os-home-v9 .os-v340-hospital__visual-label svg {width:18px;height:18px;}
.os-home-v9 .os-v340-hospital__visual img { display:block; width:100%; max-width:485px; margin:auto; height:auto !important; object-fit:contain; object-position:center; border-radius:12px; position:relative; z-index:1; transform:translate3d(0,0,0); transform-origin:center center; transition:transform 700ms cubic-bezier(.22,1,.36,1), filter 700ms ease; }
.os-home-v9 .os-v340-hospital__visual-bottom { display:flex; flex-wrap:wrap; justify-content:center; align-items:center; gap:8px; }
.os-home-v9 .os-v340-hospital__visual-bottom span { display:inline-flex; align-items:center; gap:6px; border:1px solid rgba(248,220,159,.25); background:rgba(255,255,255,.07); padding:8px 11px; border-radius:999px; font-size:11px; line-height:1.4; color:#f8fafc; white-space:normal; }
.os-home-v9 .os-v340-hospital__visual-bottom svg {width:15px;height:15px;color:#f4c76b;}

.os-home-v9 .os-v340-hospital__visual::before {
  content:"";
  position:absolute;
  z-index:2;
  left:9%;
  right:9%;
  top:22%;
  bottom:18%;
  border-radius:50%;
  pointer-events:none;
  background:conic-gradient(from 0deg,
    rgba(255,255,255,0) 0deg 88deg,
    rgba(255,255,255,.04) 98deg,
    rgba(255,255,255,.22) 114deg,
    rgba(255,245,208,.28) 124deg,
    rgba(255,255,255,.09) 138deg,
    rgba(255,255,255,0) 154deg 276deg,
    rgba(255,255,255,.03) 286deg,
    rgba(255,255,255,.14) 298deg,
    rgba(255,244,210,.18) 306deg,
    rgba(255,255,255,.05) 318deg,
    rgba(255,255,255,0) 334deg 360deg);
  -webkit-mask:radial-gradient(closest-side,
    transparent calc(100% - 15px),
    #000 calc(100% - 10px),
    #000 calc(100% - 5px),
    transparent 100%);
          mask:radial-gradient(closest-side,
    transparent calc(100% - 15px),
    #000 calc(100% - 10px),
    #000 calc(100% - 5px),
    transparent 100%);
  filter:blur(3px) drop-shadow(0 0 8px rgba(255,255,255,.08)) drop-shadow(0 0 14px rgba(239,176,0,.10));
  opacity:.50;
  mix-blend-mode:screen;
  transform:translate3d(0,0,0) rotate(0deg);
  animation:os-v362-hospital-orbit 16s linear infinite;
}
.os-home-v9 .os-v340-hospital__visual::after {
  content:"";
  position:absolute;
  z-index:2;
  left:18%;
  right:18%;
  top:30%;
  bottom:25%;
  border-radius:50%;
  pointer-events:none;
  background:
    radial-gradient(ellipse 34% 26% at 50% 52%, rgba(255,255,255,.04), transparent 72%),
    conic-gradient(from 180deg,
      rgba(255,255,255,0) 0deg 144deg,
      rgba(255,255,255,.03) 154deg,
      rgba(255,255,255,.12) 166deg,
      rgba(255,250,230,.16) 176deg,
      rgba(255,255,255,.04) 190deg,
      rgba(255,255,255,0) 202deg 326deg,
      rgba(255,255,255,.025) 336deg,
      rgba(255,255,255,.07) 347deg,
      rgba(255,255,255,0) 360deg);
  -webkit-mask:radial-gradient(closest-side,
    transparent calc(100% - 11px),
    #000 calc(100% - 7px),
    #000 calc(100% - 3px),
    transparent 100%);
          mask:radial-gradient(closest-side,
    transparent calc(100% - 11px),
    #000 calc(100% - 7px),
    #000 calc(100% - 3px),
    transparent 100%);
  filter:blur(3.4px);
  opacity:.34;
  mix-blend-mode:screen;
  animation:os-v362-hospital-orbit-reverse 11.5s linear infinite, os-v362-hospital-pulse 6.2s ease-in-out infinite;
}
.os-home-v9 .os-v340-hospital__visual-label,
.os-home-v9 .os-v340-hospital__visual-bottom {
  position:relative;
  z-index:4;
}
@keyframes os-v362-hospital-orbit {
  from { transform:translate3d(0,0,0) rotate(0deg); }
  to   { transform:translate3d(0,0,0) rotate(360deg); }
}
@keyframes os-v362-hospital-orbit-reverse {
  from { transform:translate3d(0,0,0) rotate(360deg); }
  to   { transform:translate3d(0,0,0) rotate(0deg); }
}
@keyframes os-v362-hospital-pulse {
  0%,100% { opacity:.28; }
  50%     { opacity:.40; }
}
@keyframes os-v362-hospital-photo-float {
  0%,100% { transform:translate3d(0,0,0); }
  50%     { transform:translate3d(0,-7px,0); }
}

.os-home-v9 .os-v340-hospital__content { min-width:0; padding:clamp(24px,3.1vw,43px); display:flex; flex-direction:column; justify-content:center; }
.os-home-v9 .os-v340-hospital__section-label { color:#946620; font-weight:800; font-size:11px; letter-spacing:.08em; line-height:1.5; }
.os-home-v9 .os-v340-hospital__content h3 { margin:8px 0 12px !important; color:#000730 !important; text-align:left !important; font-size:clamp(21px,2.2vw,31px); font-weight:800; line-height:1.3; letter-spacing:-.025em; }
.os-home-v9 .os-v340-hospital__content h3 span {color:#ac7a26;}
.os-home-v9 .os-v340-hospital__intro {color:#596679 !important; font-size:16px !important; line-height:1.62 !important; font-family:var(--onestack-font-body); font-weight:400; letter-spacing:normal; max-width:none !important; margin:0 0 22px !important; text-align:left !important;}
.os-home-v9 .os-v340-hospital__features { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px 17px; }
.os-home-v9 .os-v340-hospital__feature {display:flex;align-items:flex-start;gap:10px;min-width:0;text-align:left;}
.os-home-v9 .os-v340-hospital__feature-icon { display:grid;place-items:center; flex:0 0 38px; width:38px;height:38px; border:1px solid #f0debc; border-radius:12px; color:#b4812c; background:#fff7e6; }
.os-home-v9 .os-v340-hospital__feature-icon svg {width:19px;height:19px;}
.os-home-v9 .os-v340-hospital__feature strong {display:block; color:#000730 !important; font-size:12.5px; font-weight:800; line-height:1.43; margin:0 0 3px; }
.os-home-v9 .os-v340-hospital__feature p {margin:0 !important; max-width:none !important; color:#687587 !important; font-size:11.5px !important; line-height:1.55 !important; overflow-wrap:anywhere;}
.os-home-v9 .os-v340-hospital__actions {display:flex; flex-wrap:wrap; gap:11px; margin:25px 0 0;}
.os-home-v9 .os-v340-hospital__button {min-height:46px; display:inline-flex;align-items:center;justify-content:center;gap:8px; padding:11px 16px;border-radius:9px;border:1px solid transparent; font-weight:800; font-size:11px; line-height:1.4; text-decoration:none !important; text-align:center;transition:background .2s,transform .2s,border-color .2s;}
.os-home-v9 .os-v340-hospital__button svg {width:16px;height:16px;}
.os-home-v9 .os-v340-hospital__button--primary,.os-home-v9 .os-v340-hospital__button--primary:visited {background:linear-gradient(180deg,#f4cc72,#d9a441); border-color:#d9a441; color:#000730 !important;}
.os-home-v9 .os-v340-hospital__button--secondary,.os-home-v9 .os-v340-hospital__button--secondary:visited {background:#fff; border-color:#d5dbe4; color:#000730 !important;}
.os-home-v9 .os-v340-hospital__button:hover {transform:translateY(-2px);}
.os-home-v9 .os-v340-hospital__button--primary:hover {background:#f4cf76;}
.os-home-v9 .os-v340-hospital__button--secondary:hover {border-color:#d9a441; background:#fff9ed;}
.os-home-v9 .os-v340-hospital__button:focus-visible {outline:3px solid #c28d36;outline-offset:3px;}
.os-home-v9 .os-v340-hospital__note {display:flex;align-items:center; gap:7px; margin:15px 0 0 !important; color:#687587 !important;font-size:11px !important;line-height:1.5 !important; max-width:none !important;}
.os-home-v9 .os-v340-hospital__note svg {width:15px;height:15px;color:#b4812c;}
.os-home-v9 .os-v340-hospital__process {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px;margin-top:16px;}
.os-home-v9 .os-v340-hospital__process span {display:flex;align-items:center;justify-content:center;gap:10px;min-height:57px;padding:12px 15px;border:1px solid #eee3d1;border-radius:13px;background:#fff;color:#404a58;font-size:12px;font-weight:700;line-height:1.5;}
.os-home-v9 .os-v340-hospital__process b {color:#bc852c;font-size:16px;font-weight:800;}
@media(max-width:1050px) {
  .os-home-v9 .os-v340-hospital__panel {grid-template-columns:minmax(0,.80fr) minmax(0,1.20fr);}
  .os-home-v9 .os-v340-hospital__visual {padding:22px 15px;min-height:440px;}
  .os-home-v9 .os-v340-hospital__content {padding:27px 23px;}
  .os-home-v9 .os-v340-hospital__features {gap:15px 10px;}
  .os-home-v9 .os-v340-hospital__feature {gap:7px;}
  .os-home-v9 .os-v340-hospital__feature-icon {flex-basis:33px;width:33px;height:33px;}
}
@media(max-width:760px) {
  .os-home-v9 .os-v340-hospital {padding:47px 0 52px !important;}
  .os-home-v9 .os-v340-hospital__heading {margin-bottom:22px;}
  .os-home-v9 .os-v340-hospital__panel {grid-template-columns:minmax(0,1fr);border-radius:20px;}
  .os-home-v9 .os-v340-hospital__visual {min-height:300px; padding:20px 19px 17px;}
  .os-home-v9 .os-v340-hospital__visual img {max-height:265px;}
  .os-home-v9 .os-v340-hospital__content {padding:26px 20px 28px;}
  .os-home-v9 .os-v340-hospital__features {gap:20px 13px;}
  .os-home-v9 .os-v340-hospital__process {grid-template-columns:1fr;gap:8px;}
  .os-home-v9 .os-v340-hospital__process span {min-height:46px;justify-content:flex-start;}
}
@media(max-width:440px) {
  .os-home-v9 .os-v340-hospital__visual {min-height:240px;}
  .os-home-v9 .os-v340-hospital__visual img {max-height:220px;}
  .os-home-v9 .os-v340-hospital__content {padding:24px 18px;}
  .os-home-v9 .os-v340-hospital__features {grid-template-columns:1fr;gap:17px;}
  .os-home-v9 .os-v340-hospital__actions {flex-direction:column;}
  .os-home-v9 .os-v340-hospital__button {width:100%;}
}
@media (hover: hover) and (pointer: fine) {
  .os-home-v9 .os-v340-hospital__visual:hover > img {
    animation: os-v362-hospital-photo-float 3.1s ease-in-out infinite;
    filter: drop-shadow(0 10px 14px rgba(0,7,48,.18));
  }
  .os-home-v9 .os-v340-hospital__visual:hover::before {
    opacity: .64;
    filter: blur(2.8px) drop-shadow(0 0 10px rgba(255,255,255,.12)) drop-shadow(0 0 18px rgba(239,176,0,.14));
  }
}
@media(prefers-reduced-motion:reduce) {
  .os-home-v9 .os-v340-hospital__button {transition:none;}
  .os-home-v9 .os-v340-hospital__button:hover {transform:none;}
  .os-home-v9 .os-v340-hospital__visual::before,
  .os-home-v9 .os-v340-hospital__visual::after,
  .os-home-v9 .os-v340-hospital__visual:hover > img { animation:none !important; }
  .os-home-v9 .os-v340-hospital__visual img { transform:none !important; transition:none !important; }
}

/* v363 — Hover cho ba bước quy trình Bệnh viện website.
 * Các ô là thông tin, không phải nút bấm; chỉ thêm tương tác thị giác.
 * Áp dụng sau các quy tắc màu v342-v345 có !important.
 */
.os-home-v9 .os-v340-hospital__process > span {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  transition: transform 260ms cubic-bezier(.2,.8,.2,1),
              border-color 260ms ease,
              box-shadow 260ms ease,
              background-color 260ms ease;
}
.os-home-v9 .os-v340-hospital__process > span::before {
  content: '';
  position: absolute;
  top: 0;
  left: 50%;
  width: min(56%, 145px);
  height: 3px;
  border-radius: 0 0 5px 5px;
  background: linear-gradient(90deg, #EFB000, #F6D76A, #EFB000);
  opacity: 0;
  transform: translateX(-50%) scaleX(.25);
  transform-origin: center;
  transition: opacity 190ms ease, transform 260ms cubic-bezier(.2,.8,.2,1);
  pointer-events: none;
}
.os-home-v9 .os-v340-hospital__process > span > b {
  display: inline-block;
  transition: transform 260ms cubic-bezier(.2,.8,.2,1), color 260ms ease;
}
@media (hover: hover) and (pointer: fine) {
  .os-home-v9 .os-v340-hospital__process > span:hover {
    transform: translateY(-4px);
    background: #fff !important;
    border-color: #EFB000 !important;
    box-shadow: 0 12px 25px rgba(0,7,48,.09), 0 0 0 1px rgba(239,176,0,.11);
    color: #000730 !important;
  }
  .os-home-v9 .os-v340-hospital__process > span:hover::before {
    opacity: 1;
    transform: translateX(-50%) scaleX(1);
  }
  .os-home-v9 .os-v340-hospital__process > span:hover > b {
    color: #EFB000 !important;
    transform: translateY(-1px) scale(1.05);
  }
}
@media (prefers-reduced-motion: reduce) {
  .os-home-v9 .os-v340-hospital__process > span,
  .os-home-v9 .os-v340-hospital__process > span::before,
  .os-home-v9 .os-v340-hospital__process > span > b {
    transition: none !important;
  }
  .os-home-v9 .os-v340-hospital__process > span:hover,
  .os-home-v9 .os-v340-hospital__process > span:hover > b {
    transform: none !important;
  }
}

@media (max-width: 760px) {
  .os-home-v9 .os-v340-hospital__intro { font-size: 16px !important; }
}
