/* Trang Hợp tác XoayXoay — dùng chung font, logo, màu và header của Web V8. */
.partner-page { background: #fff; }
.partner-page .site-header { background: rgba(255,255,255,.87); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); }
.partner-page .partner-nav-active { color: var(--blue-deep); font-weight: 800; position: relative; }
.partner-page .partner-nav-active::after { content: ""; position: absolute; height: 4px; border-radius: 3px; left: 0; right: 0; bottom: -13px; background: var(--blue); }
.partner-hero { position: relative; isolation: isolate; overflow: hidden; min-height: 810px; padding: 132px 0 162px; background: radial-gradient(ellipse at 72% 20%,#f2f9ff 0%,#fff 55%); }
.partner-hero-inner { display: grid; grid-template-columns: 53% 47%; min-height: 520px; align-items: center; position: relative; z-index: 2; }
.partner-hero-copy { position: relative; z-index: 3; padding: 2px 0 60px 1%; }
.partner-eyebrow { color: var(--blue); font-size: 11px; letter-spacing: .17em; font-weight: 800; line-height: 1.6; margin-bottom: 28px; }
.partner-eyebrow span { font-size: 18px; letter-spacing: 0; vertical-align: -2px; }
.partner-hero h1 { font: 800 clamp(82px,8.6vw,137px)/.88 var(--display); letter-spacing: -.058em; color: var(--blue-deep); margin: 0 0 33px; }
.partner-hero h1 span { color: var(--blue); }
.partner-hero-lede { font-size: clamp(14px,1.15vw,18px); line-height: 1.85; font-weight: 500; color: var(--body); margin: 0 0 34px; }
.partner-hero-actions { display: flex; flex-wrap: wrap; gap: 25px; align-items: center; }
.partner-main-cta { min-width: 186px; min-height: 58px; font-size: 14px; box-shadow: 0 11px 26px #2e78bd1e; }
.partner-main-cta span { font-size: 20px; font-weight: 400; }
.partner-text-link { font-size: 13px; font-weight: 800; color: var(--blue-deep); border-bottom: 1px solid #bdd7f6; padding: 12px 0 8px; transition: color .2s; }
.partner-text-link:hover { color: var(--blue); }
.partner-hero-art { height: min(45vw,620px); position: relative; min-width: 0; }
.partner-ribbon { position: absolute; z-index: 1; width: 110%; height: 100%; left: -6%; top: -5%; pointer-events: none; }
.partner-ribbon path { fill: none; stroke: #b7d6f7; stroke-width: 18; stroke-linecap: round; }
.partner-washer { position: absolute; z-index: 2; right: -2%; top: 1%; width: min(97%,610px); height: 96%; object-fit: contain; filter: drop-shadow(0 22px 24px #073f8712); animation: image-arrive .9s var(--ease) both; }
.partner-hero-mascot { position: absolute; z-index: 3; width: clamp(158px,19vw,264px); left: -15%; bottom: 5%; height: auto; filter: drop-shadow(0 12px 12px #0750a31a); animation: mascot-arrive 1.1s .2s var(--ease) both; }
.partner-wave { position: absolute; bottom: -1px; left: 0; width: 100%; height: clamp(110px,10vw,155px); color: var(--blue); z-index: 1; }

.partner-model { position: relative; overflow: hidden; background: var(--blue); color: white; padding: 85px 0 190px; }
.partner-label-light { font-size: 11px; letter-spacing: .17em; font-weight: 800; color: #d7ebff; line-height: 1.6; }
.partner-model h2 { font: 800 clamp(57px,6.4vw,102px)/1.04 var(--display); letter-spacing: -.05em; margin: 19px 0 19px; color: white; }
.partner-model h2 span { color: white; }
.partner-model-intro { font-size: clamp(12px,1vw,15px); line-height: 1.92; max-width: 680px; color: #edf6ff; }
.partner-numbers { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); border-top: 1px solid #ffffff74; margin: 67px 0 0; padding-top: 32px; gap: 30px; }
.partner-number { min-width: 0; }
.partner-number:not(:first-child) { border-left: 1px solid #ffffff58; padding-left: clamp(22px,3.5vw,58px); }
.partner-number strong { display: block; color: white; font: 800 clamp(35px,4.1vw,69px)/1.08 var(--display); white-space: nowrap; letter-spacing: -.045em; }
.partner-number strong span { font-size: .5em; vertical-align: .14em; letter-spacing: -.015em; }
.partner-number p { color: #e3f1ff; font-size: 12px; line-height: 1.85; margin: 8px 0 0; }
.partner-model-footnote { max-width: 920px; margin: 31px 0 0; color: #ddedff; font-size: 10px; line-height: 1.8; }
.partner-model-wave { position: absolute; bottom: -1px; width: 100%; left: 0; height: clamp(76px,8vw,135px); pointer-events: none; }

.partner-support { background: white; padding: 95px 0 155px; }
.partner-support h2 { color: var(--blue-deep); font: 800 clamp(46px,5.4vw,82px)/1.1 var(--display); letter-spacing: -.047em; margin: 0 0 21px; }
.partner-support h2 span { color: var(--blue); }
.partner-support-lede { max-width: 680px; color: var(--body); font-size: 14px; line-height: 1.9; }
.partner-support-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 40px; margin-top: 73px; }
.partner-support-item { border-top: 1px solid #dce8f5; padding-top: 28px; }
.partner-icon { width: 67px; height: 67px; border-radius: 21px; background: #edf6ff; display: grid; place-items: center; margin-bottom: 25px; color: var(--blue); }
.partner-icon svg { width: 43px; height: 43px; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linejoin: round; stroke-linecap: round; }
.partner-step { display: block; font-size: 11px; letter-spacing: .1em; font-weight: 800; color: #80b0e6; margin-bottom: 8px; }
.partner-support-item h3 { font-size: clamp(17px,1.5vw,22px); color: var(--blue-deep); letter-spacing: -.04em; margin: 0 0 12px; }
.partner-support-item p { font-size: 12px; color: var(--body); line-height: 1.85; margin: 0; }

.partner-close-section { background: var(--blue); color: white; }
.partner-close-inner { padding: 85px 0 100px; display: flex; align-items: center; justify-content: space-between; gap: 30px; }
.partner-close-inner h2 { font: 800 clamp(59px,5.7vw,86px)/1.02 var(--display); letter-spacing: -.04em; color: white; margin: 15px 0; }
.partner-close-inner p:not(.partner-label-light) { font-size: 13px; line-height: 1.9; color: #eff7ff; max-width: 560px; }
.partner-bottom-button { background: white; color: var(--blue-deep); min-width: 178px; font-size: 15px; }
.partner-site-footer { border-top-color: #ffffff5a; }

/* Popup Zalo cùng ngôn ngữ thị giác popup đặt lịch V8. */
.partner-overlay[hidden] { display: none !important; }
.partner-overlay { position: fixed; z-index: 150; inset: 0; display: grid; place-items: center; padding: 22px; }
.partner-backdrop { position: absolute; inset: 0; background: rgba(7,39,86,.49); backdrop-filter: blur(9px); -webkit-backdrop-filter: blur(9px); cursor: pointer; }
.partner-dialog { position: relative; z-index: 1; width: min(100%,490px); max-height: min(calc(100dvh - 40px),760px); overflow-y: auto; overscroll-behavior: contain; border-radius: 30px; background: linear-gradient(160deg,#fff,#f4faff); box-shadow: 0 33px 90px #052c6890; padding: 30px 32px 24px; outline: none; animation: partner-popup-in .38s var(--ease) both; }
.partner-dialog-close { position: absolute; top: 19px; right: 19px; z-index: 4; border: 1px solid #dceafb; background: white; color: var(--blue-deep); border-radius: 50%; width: 37px; height: 37px; display: grid; place-items: center; }
.partner-dialog-close svg { width: 18px; height: 18px; stroke: currentColor; stroke-width: 2; fill: none; }
.partner-dialog-mascot { position: absolute; top: 23px; right: 44px; width: 99px; height: auto; object-fit: contain; pointer-events: none; }
.partner-dialog-content { text-align: center; padding-top: 106px; }
.partner-dialog-eyebrow { font-size: 10px; color: #6e9fd4; font-weight: 800; letter-spacing: .17em; margin-bottom: 11px; }
.partner-dialog h2 { color: var(--blue-deep); font: 800 clamp(32px,5vw,47px)/1.1 var(--display); letter-spacing: -.04em; margin: 0 0 9px; }
.partner-dialog-content > p#partner-dialog-intro { font-size: 12px; color: var(--body); line-height: 1.75; margin: 0 0 18px; }
.partner-qr-frame { display: block; width: min(100%,240px); padding: 9px; margin: 0 auto 8px; border: 1px solid #d9e8fa; background: white; border-radius: 18px; box-shadow: 0 8px 23px #054c9220; }
.partner-qr-frame img { width: 100%; height: auto; aspect-ratio: 1; object-fit: contain; image-rendering: pixelated; }
.partner-phone { display: block; width: max-content; max-width: 100%; margin: 0 auto 13px; font-size: clamp(21px,4.5vw,28px); color: var(--blue-deep); font-weight: 800; letter-spacing: -.025em; }
.partner-phone:hover { text-decoration: underline; }
.partner-zalo-cta { min-width: 180px; min-height: 47px; font-size: 13px; }
.partner-modal-note { color: #7896b6; font-size: 10px; line-height: 1.65; margin: 17px 0 0; }
.partner-is-open { overflow: hidden; }
@keyframes partner-popup-in { from { transform: translateY(22px) scale(.96); opacity: 0; } to { transform: none; opacity: 1; } }
.partner-js .partner-reveal { opacity: 0; transform: translateY(27px); transition: opacity .75s ease, transform .9s var(--ease); }
.partner-js .partner-reveal.partner-in { opacity: 1; transform: none; }
.partner-hero-copy { animation: text-arrive .9s var(--ease) both; }

@media (max-width:1050px) {
  .partner-hero { min-height: 730px; }
  .partner-hero-inner { grid-template-columns: 50% 50%; }
  .partner-hero h1 { font-size: clamp(69px,8.5vw,96px); }
  .partner-hero-art { height: min(47vw,520px); }
  .partner-numbers { gap: 18px; }
  .partner-number:not(:first-child) { padding-left: 24px; }
  .partner-support-grid { gap: 22px; }
}
@media (max-width:720px) {
  .partner-page .partner-nav-active::after { display: none; }
  .partner-page .primary-nav { box-shadow: 0 18px 25px #0b56a21a; }
  .partner-hero { padding: 128px 0 112px; min-height: auto; }
  .partner-hero-inner { display: flex; flex-direction: column; align-items: stretch; min-height: 0; }
  .partner-hero-copy { padding: 0; }
  .partner-eyebrow { font-size: 10px; margin-bottom: 21px; }
  .partner-hero h1 { font-size: clamp(60px,12.8vw,86px); margin-bottom: 23px; }
  .partner-hero-lede { font-size: 13px; line-height: 1.8; margin-bottom: 23px; }
  .partner-hero-actions { gap: 18px; }
  .partner-main-cta { min-width: 145px; min-height: 49px; font-size: 12px; }
  .partner-text-link { font-size: 11px; }
  .partner-hero-art { height: clamp(320px,91vw,480px); margin-top: 1px; }
  .partner-washer { width: 82%; right: 0; top: 1%; height: 96%; }
  .partner-hero-mascot { width: 37%; left: 0; bottom: 10%; }
  .partner-ribbon { left: -10%; }
  .partner-wave { height: 75px; }
  .partner-model { padding: 68px 0 112px; }
  .partner-model h2 { font-size: clamp(44px,10.6vw,70px); margin-top: 15px; }
  .partner-model-intro { font-size: 12px; }
  .partner-numbers { grid-template-columns: 1fr; gap: 0; padding-top: 0; margin-top: 36px; }
  .partner-number { padding: 23px 0 !important; border-left: 0 !important; border-bottom: 1px solid #ffffff56; }
  .partner-number strong { font-size: 51px; }
  .partner-number p { font-size: 11px; }
  .partner-model-footnote { font-size: 10px; }
  .partner-model-wave { height: 77px; }
  .partner-support { padding: 68px 0 90px; }
  .partner-support h2 { font-size: clamp(40px,9.6vw,61px); }
  .partner-support-lede { font-size: 12px; }
  .partner-support-grid { grid-template-columns: repeat(2,minmax(0,1fr)); column-gap: 18px; row-gap: 32px; margin-top: 36px; }
  .partner-support-item { padding-top: 18px; }
  .partner-icon { height: 53px; width: 53px; border-radius: 15px; margin-bottom: 17px; }
  .partner-icon svg { width: 33px; height: 33px; }
  .partner-support-item h3 { font-size: 16px; }
  .partner-support-item p { font-size: 10px; }
  .partner-close-inner { padding: 65px 0 56px; flex-direction: column; align-items: flex-start; gap: 12px; }
  .partner-close-inner h2 { font-size: 61px; }
  .partner-close-inner p:not(.partner-label-light) { font-size: 12px; }
  .partner-site-footer { flex-wrap: wrap; }
  .partner-dialog { padding: 24px 20px; border-radius: 24px; }
  .partner-dialog-mascot { width: 79px; right: 51px; top: 11px; }
  .partner-dialog-content { padding-top: 79px; }
  .partner-qr-frame { width: min(100%,226px); }
}
@media (max-width:375px) {
  .partner-hero h1 { font-size: 57px; }
  .partner-hero-actions { gap: 12px; }
  .partner-support-grid { grid-template-columns: 1fr; }
  .partner-dialog { padding: 19px 16px; }
  .partner-dialog-content { padding-top: 64px; }
  .partner-dialog-mascot { width: 65px; }
  .partner-dialog h2 { font-size: 31px; }
  .partner-qr-frame { width: min(100%,190px); }
}
@media (prefers-reduced-motion:reduce) {
  .partner-page * { scroll-behavior: auto !important; animation-duration: .01ms !important; transition-duration: .01ms !important; }
  .partner-js .partner-reveal { opacity: 1; transform: none; }
}
