/* ==========================================================================
   LifeSupport IT - Home page sections (uses global tokens + components)
   ========================================================================== */
.link-arrow { display: inline-flex; align-items: center; gap: .4rem; font-weight: var(--lsit-fw-semibold); font-size: var(--lsit-fs-sm); }
.link-arrow .icon { width: 1em; height: 1em; transition: transform var(--lsit-dur) var(--lsit-ease); }
.link-arrow:hover .icon { transform: translateX(4px); }
.section__more { text-align: center; margin: var(--lsit-space-7) 0 0; }
.btn .icon { width: 1.05em; height: 1.05em; }
.empty-state { max-width: 640px; margin-inline: auto; padding: var(--lsit-space-6); text-align: center; border: 1.5px dashed var(--lsit-border-strong); border-radius: var(--lsit-radius-lg); background: rgba(255,255,255,.6); }
.empty-state p { margin: 0; }

/* ---- Hero ---- */
.hero { position: relative; isolation: isolate; overflow: hidden; color: #fff; background: var(--lsit-grad-hero); padding: calc(var(--lsit-header-h) + clamp(3rem, 6vw, 5.5rem)) 0 clamp(6rem, 9vw, 9rem); }
.hero::before { content: ''; position: absolute; inset: -20%; z-index: -2; background: radial-gradient(40% 45% at 78% 30%, rgba(21,94,239,.55), transparent 70%), radial-gradient(35% 40% at 18% 88%, rgba(48,38,166,.5), transparent 70%), radial-gradient(16% 20% at 62% 10%, rgba(66,217,255,.2), transparent 70%); animation: lsit-drift 22s ease-in-out infinite alternate; }
.hero::after { content: ''; position: absolute; inset: 0; z-index: -1; background-image: linear-gradient(rgba(255,255,255,.045) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px); background-size: 64px 64px; -webkit-mask-image: radial-gradient(70% 70% at 70% 40%, #000, transparent 80%); mask-image: radial-gradient(70% 70% at 70% 40%, #000, transparent 80%); }
@keyframes lsit-drift { to { transform: translate3d(-3%, 2%, 0) scale(1.06); } }
.hero__grid { display: grid; grid-template-columns: 1.05fr .95fr; gap: clamp(2rem, 5vw, 4rem); align-items: center; }
.hero__badge { display: inline-flex; align-items: center; gap: .6rem; padding: .45rem 1rem; border-radius: var(--lsit-radius-pill); background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.16); backdrop-filter: blur(10px); font-size: var(--lsit-fs-xs); font-weight: var(--lsit-fw-semibold); letter-spacing: .12em; color: var(--lsit-text-on-dark); margin-bottom: var(--lsit-space-5); }
.hero__badge i { width: 8px; height: 8px; border-radius: 50%; background: var(--lsit-accent); box-shadow: 0 0 0 4px rgba(66,217,255,.2); }
.hero h1 { color: #fff; margin-bottom: var(--lsit-space-5); font-weight: 800; }
.hero__lead { max-width: 52ch; font-size: var(--lsit-fs-lg); color: var(--lsit-text-on-dark-muted); margin-bottom: var(--lsit-space-6); }
.hero__cta { display: flex; flex-wrap: wrap; gap: var(--lsit-space-3); margin-bottom: var(--lsit-space-6); }
.hero__trust { display: flex; align-items: center; gap: .75rem; margin: 0; font-size: var(--lsit-fs-sm); font-weight: var(--lsit-fw-medium); color: var(--lsit-text-on-dark-muted); }
.hero__trust span { width: 32px; height: 2px; background: var(--lsit-accent); border-radius: 2px; }

/* Hero visual (original CSS composition) */
.hv { position: relative; width: min(100%, 540px); aspect-ratio: 1 / 1; margin-inline: auto; }
.hv__orb { position: absolute; inset: 8%; border-radius: 50%; background: radial-gradient(circle at 35% 30%, rgba(66,217,255,.32), rgba(21,94,239,.34) 42%, rgba(48,38,166,.14) 70%, transparent 72%); filter: blur(4px); }
.hv__rings { position: absolute; inset: 0; width: 100%; height: 100%; }
.hv__panel { position: absolute; left: 9%; right: 3%; top: 15%; bottom: 22%; padding: 1.15rem 1.3rem; border-radius: 26px; background: linear-gradient(160deg, rgba(255,255,255,.14), rgba(255,255,255,.04)); border: 1px solid rgba(255,255,255,.2); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); box-shadow: 0 30px 70px rgba(2,6,23,.5), inset 0 1px 0 rgba(255,255,255,.18); }
.hv__bar { display: flex; align-items: center; gap: .4rem; margin-bottom: 1.2rem; }
.hv__bar span { width: 10px; height: 10px; border-radius: 50%; background: rgba(255,255,255,.28); }
.hv__bar span:first-child { background: var(--lsit-accent); }
.hv__bar em { margin-left: auto; font-style: normal; font-size: .72rem; letter-spacing: .08em; color: var(--lsit-text-on-dark-muted); }
.hv__lines i { display: block; height: 9px; border-radius: 99px; background: rgba(255,255,255,.14); margin-bottom: .7rem; }
.hv__lines i:nth-child(1) { width: 72%; } .hv__lines i:nth-child(2) { width: 90%; } .hv__lines i:nth-child(3) { width: 58%; } .hv__lines i:nth-child(4) { width: 80%; } .hv__lines i:nth-child(5) { width: 46%; }
.hv__lines i.is-accent { background: linear-gradient(90deg, var(--lsit-accent), var(--lsit-primary)); }
.hv__chips { display: flex; flex-wrap: wrap; gap: .45rem; margin-top: 1.1rem; }
.hv__chips span { padding: .3rem .7rem; border-radius: var(--lsit-radius-pill); font-size: .74rem; font-weight: var(--lsit-fw-semibold); background: rgba(21,94,239,.35); border: 1px solid rgba(255,255,255,.14); color: #fff; }
.hv__card { position: absolute; display: flex; align-items: center; gap: .65rem; padding: .85rem 1.1rem; border-radius: 18px; color: #fff; font-size: .85rem; font-weight: var(--lsit-fw-semibold); background: rgba(10,16,40,.78); border: 1px solid rgba(255,255,255,.18); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); box-shadow: 0 18px 40px rgba(2,6,23,.45); animation: lsit-float 7s ease-in-out infinite; }
.hv__card .icon { color: var(--lsit-accent); }
.hv__card--path { left: 0; bottom: 5%; }
.hv__card--path ul { list-style: none; margin: 0; padding: 0; display: grid; gap: .45rem; }
.hv__card--path li { display: flex; align-items: center; gap: .5rem; }
.hv__card--path li.is-now { color: var(--lsit-accent); }
.hv__card--ai { right: 0; top: 4%; animation-delay: -3s; }

/* ---- Stats ---- */
.stats { position: relative; z-index: 2; margin-top: calc(-1 * clamp(2.5rem, 4vw, 3.5rem)); }
.stats__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--lsit-space-4); }
.stat.card { padding: var(--lsit-space-5) var(--lsit-space-4); box-shadow: var(--lsit-shadow-md); }
.stat__num { font-size: clamp(1.9rem, 1.4rem + 1.6vw, 2.75rem); }

/* ---- About ---- */
.about__grid { display: grid; grid-template-columns: .95fr 1.05fr; gap: clamp(2rem, 5vw, 5rem); align-items: center; }
.about__visual { position: relative; }
.about__img { width: 100%; aspect-ratio: 4/3.4; object-fit: cover; border-radius: var(--lsit-radius-xl); box-shadow: var(--lsit-shadow-lg); }
.about__art { position: relative; aspect-ratio: 4/3.4; border-radius: var(--lsit-radius-xl); background: var(--lsit-grad-signature); display: grid; align-content: center; gap: .9rem; padding: clamp(1.5rem, 4vw, 3rem); overflow: hidden; box-shadow: var(--lsit-shadow-lg); }
.about__art::before { content: ''; position: absolute; width: 70%; aspect-ratio: 1; right: -15%; top: -20%; border-radius: 50%; background: radial-gradient(circle, rgba(66,217,255,.5), transparent 68%); }
.about__tile { position: relative; display: flex; align-items: center; gap: 1rem; padding: 1rem 1.25rem; border-radius: var(--lsit-radius-lg); background: rgba(255,255,255,.12); border: 1px solid rgba(255,255,255,.22); backdrop-filter: blur(12px); color: #fff; font-family: var(--lsit-font-heading); font-weight: var(--lsit-fw-semibold); font-size: 1.1rem; }
.about__tile:nth-child(2) { margin-left: 8%; } .about__tile:nth-child(3) { margin-left: 16%; }
.about__tile .icon { width: 28px; height: 28px; color: var(--lsit-accent); }
.about__mv { display: grid; grid-template-columns: 1fr 1fr; gap: var(--lsit-space-4); margin: var(--lsit-space-5) 0; }
.about__mv > div { padding: var(--lsit-space-4) var(--lsit-space-5); border-left: 3px solid var(--lsit-primary); background: var(--lsit-soft); border-radius: 0 var(--lsit-radius-md) var(--lsit-radius-md) 0; }
.about__mv h4 { margin-bottom: .25rem; font-size: 1rem; }
.about__mv p { margin: 0; font-size: var(--lsit-fs-sm); }
.checklist { list-style: none; margin: 0 0 var(--lsit-space-6); padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: .7rem 1.25rem; }
.checklist li { display: flex; align-items: center; gap: .6rem; font-weight: var(--lsit-fw-medium); color: var(--lsit-navy); }
.checklist .icon { width: 22px; height: 22px; padding: 4px; border-radius: 50%; background: var(--lsit-grad-primary); color: #fff; stroke-width: 2.5; }

/* ---- Course / service cards ---- */
.art { position: relative; width: 100%; height: 100%; display: grid; place-items: center; overflow: hidden; background: var(--lsit-grad-signature); }
.art--v1 { background: linear-gradient(135deg, #155EEF 0%, #1B3FBF 60%, #101B3D 100%); }
.art--v2 { background: linear-gradient(135deg, #3026A6 0%, #1E2C86 55%, #101B3D 100%); }
.art::before { content: ''; position: absolute; width: 60%; aspect-ratio: 1; right: -12%; top: -25%; border-radius: 50%; background: radial-gradient(circle, rgba(66,217,255,.45), transparent 68%); }
.art__ring { position: absolute; width: 46%; aspect-ratio: 1; border-radius: 50%; border: 1px solid rgba(255,255,255,.22); }
.art__icon { position: relative; width: 52px; height: 52px; color: #fff; stroke-width: 1.5; }
.course-card { display: flex; flex-direction: column; }
.course-card .card__body { display: flex; flex-direction: column; flex: 1; }
.course-card .card__body p { flex: 1; }
.course-card .badge { align-self: flex-start; margin-bottom: var(--lsit-space-3); }
.course-card__actions { display: flex; flex-wrap: wrap; gap: .6rem; margin-top: var(--lsit-space-4); }
.service-card .link-arrow { margin-top: var(--lsit-space-2); }

/* ---- Why (navy) ---- */
.why__glow { position: absolute; inset: 0; pointer-events: none; background: radial-gradient(40% 50% at 0% 0%, rgba(21,94,239,.35), transparent 70%), radial-gradient(40% 50% at 100% 100%, rgba(48,38,166,.4), transparent 70%); }
.why .container { position: relative; z-index: 1; }
.why-card { position: relative; }
.why-card p { color: var(--lsit-text-on-dark-muted); margin: 0; }
.why-card .card__title { color: #fff; }
.why-card__num { position: absolute; top: var(--lsit-space-5); right: var(--lsit-space-5); font-family: var(--lsit-font-heading); font-weight: 800; font-size: 1.1rem; color: rgba(255,255,255,.22); }
.icon-box--glass { background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.18); color: var(--lsit-accent); }

/* ---- Branches ---- */
.branch-card { display: flex; flex-direction: column; gap: var(--lsit-space-3); padding: var(--lsit-space-6); }
.branch-card .badge .icon { width: 1em; height: 1em; }
.branch-card__addr { font-style: normal; font-family: var(--lsit-font-heading); font-weight: var(--lsit-fw-semibold); font-size: var(--lsit-fs-lg); color: var(--lsit-navy); line-height: 1.5; }
.branch-card__phone { display: flex; align-items: center; gap: .6rem; margin: 0; font-weight: var(--lsit-fw-semibold); }
.branch-card__phone .icon { color: var(--lsit-primary); }
.branch-card__map { margin: var(--lsit-space-2) 0; border-radius: var(--lsit-radius-md); overflow: hidden; border: 1px solid var(--lsit-border); aspect-ratio: 16/9; background: var(--lsit-soft); }
.branch-card__map iframe { width: 100%; height: 100%; border: 0; display: block; }
.branch-card__actions { display: flex; flex-wrap: wrap; gap: .6rem; }

/* ---- Team ---- */
.team-card { text-align: center; }
.team-card__photo { width: 112px; height: 112px; margin: 0 auto var(--lsit-space-4); border-radius: 50%; overflow: hidden; display: grid; place-items: center; background: var(--lsit-grad-primary); color: #fff; font-family: var(--lsit-font-heading); font-weight: 800; font-size: 1.8rem; }
.team-card__photo img { width: 100%; height: 100%; object-fit: cover; }
.team-card__role { color: var(--lsit-primary); font-weight: var(--lsit-fw-semibold); font-size: var(--lsit-fs-sm); margin-bottom: .4rem; }
.team-card__social { display: flex; justify-content: center; gap: .9rem; font-size: var(--lsit-fs-xs); font-weight: var(--lsit-fw-semibold); }

/* ---- Testimonials ---- */
.testimonial { margin: 0; display: flex; flex-direction: column; gap: var(--lsit-space-4); }
.testimonial blockquote { margin: 0; color: var(--lsit-text); font-size: var(--lsit-fs-base); flex: 1; }
.testimonial figcaption { display: flex; align-items: center; flex-wrap: wrap; gap: .75rem; font-size: var(--lsit-fs-sm); }
.testimonial figcaption img { width: 48px; height: 48px; border-radius: 50%; object-fit: cover; }
.testimonial figcaption span { display: grid; }
.testimonial figcaption em { font-style: normal; color: var(--lsit-text-muted); font-size: var(--lsit-fs-xs); }

/* ---- CTA ---- */
.cta { padding-block: var(--lsit-section-y); }
.cta__box { position: relative; overflow: hidden; isolation: isolate; text-align: center; padding: clamp(2.5rem, 6vw, 5rem) clamp(1.5rem, 5vw, 4rem); border-radius: var(--lsit-radius-xl); background: var(--lsit-grad-signature); color: #fff; box-shadow: var(--lsit-shadow-lg); }
.cta__box::before { content: ''; position: absolute; z-index: -1; inset: 0; background: radial-gradient(45% 70% at 15% 0%, rgba(66,217,255,.32), transparent 70%), radial-gradient(40% 60% at 90% 100%, rgba(21,94,239,.5), transparent 70%); }
.cta__box h2 { color: #fff; max-width: 18ch; margin-inline: auto; }
.cta__box p { color: rgba(255,255,255,.82); max-width: 52ch; margin: 0 auto var(--lsit-space-6); font-size: var(--lsit-fs-lg); }
.cta__actions { display: flex; flex-wrap: wrap; gap: var(--lsit-space-3); justify-content: center; }

/* ---- FAQ ---- */
.faq { display: grid; gap: .85rem; }
.faq__item { background: #fff; border: 1px solid var(--lsit-border); border-radius: var(--lsit-radius-lg); overflow: hidden; transition: border-color var(--lsit-dur) var(--lsit-ease), box-shadow var(--lsit-dur) var(--lsit-ease); }
.faq__item.is-open { border-color: var(--lsit-border-strong); box-shadow: var(--lsit-shadow-sm); }
.faq__h { margin: 0; font-size: inherit; }
.faq__q { width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1.15rem 1.4rem; background: none; border: 0; cursor: pointer; text-align: left; font-family: var(--lsit-font-heading); font-weight: var(--lsit-fw-semibold); font-size: var(--lsit-fs-base); color: var(--lsit-navy); }
.faq__icon { width: 22px; height: 22px; color: var(--lsit-primary); transition: transform var(--lsit-dur) var(--lsit-ease); }
.faq__q[aria-expanded='true'] .faq__icon { transform: rotate(45deg); }
.faq__a { display: grid; grid-template-rows: 0fr; transition: grid-template-rows var(--lsit-dur) var(--lsit-ease); }
.faq__a > div { overflow: hidden; }
.faq__item.is-open .faq__a { grid-template-rows: 1fr; }
.faq__body { padding: 0 1.4rem 1.25rem; color: var(--lsit-text-muted); }
.faq__body p:last-child { margin: 0; }

/* ---- Responsive ---- */
@media (max-width: 1024px) {
  .hero__grid, .about__grid { grid-template-columns: 1fr; }
  .hero__visual { order: 2; }
  .hv { width: min(100%, 460px); }
  .stats__grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 768px) {
  .hero { padding-bottom: 6.5rem; }
  .hero__cta .btn { flex: 1 1 100%; }
  .about__mv, .checklist { grid-template-columns: 1fr; }
  .btn { min-height: 46px; }
  .section__more .btn { width: 100%; }
  .cta__actions .btn { flex: 1 1 100%; }
}
@media (max-width: 480px) {
  .stats__grid { gap: .6rem; }
  .hv__card--path { transform: scale(.9); transform-origin: left bottom; }
}
/* ---- Initiatives ---- */
.init-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--lsit-space-5); }
.init-card { margin: 0; padding: 0; overflow: hidden; text-align: center; }
.init-card__img { aspect-ratio: 1 / 1; background: var(--lsit-soft); overflow: hidden; }
.init-card__img img { width: 100%; height: 100%; object-fit: cover; transition: transform var(--lsit-dur-slow) var(--lsit-ease); }
.init-card:hover .init-card__img img { transform: scale(1.05); }
.init-card figcaption { padding: var(--lsit-space-4); font-family: var(--lsit-font-heading); font-weight: var(--lsit-fw-semibold); color: var(--lsit-navy); }
@media (max-width: 600px) { .init-grid { grid-template-columns: repeat(2, 1fr); gap: var(--lsit-space-3); } }

/* ==========================================================================
   Round 2: SEO hero typography, smaller initiative logos, light animations
   ========================================================================== */
.hero .hero__tagline { margin: 0 0 var(--lsit-space-4); font-family: var(--lsit-font-heading); font-size: var(--lsit-fs-h1); font-weight: 800; line-height: 1.12; letter-spacing: -.02em; color: #fff; }
.hero .hero__h1 { margin: 0 0 var(--lsit-space-5); padding-left: 1rem; border-left: 3px solid var(--lsit-accent); font-size: clamp(1rem, .92rem + .5vw, 1.3rem); font-weight: 600; line-height: 1.45; letter-spacing: 0; color: var(--lsit-text-on-dark); max-width: 36ch; }
.about__mv h3 { margin-bottom: .25rem; font-size: 1rem; }
.focus-grid { max-width: 940px; margin-inline: auto; }

/* Smaller initiative logos */
.init-grid { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--lsit-space-4); max-width: 900px; margin-inline: auto; }
.init-card { width: 150px; }
.init-card figcaption { padding: var(--lsit-space-3) var(--lsit-space-2); font-size: var(--lsit-fs-sm); }
@media (max-width: 600px) { .init-card { width: calc(50% - .5rem); } .init-grid { gap: var(--lsit-space-3); } }

/* ---- Light animations ---- */
@keyframes lsit-rise { from { opacity: 0; transform: translateY(22px); } to { opacity: 1; transform: none; } }
@keyframes lsit-drop { from { opacity: 0; transform: translateY(-24px); } to { opacity: 1; transform: none; } }
@keyframes lsit-shimmer { to { background-position: 200% center; } }
@keyframes lsit-pulse { 0% { box-shadow: 0 0 0 0 rgba(66,217,255,.5); } 100% { box-shadow: 0 0 0 10px rgba(66,217,255,0); } }
@keyframes lsit-glow { to { background-position: 12% 8%, 88% 92%; } }

.site-header__pill { animation: lsit-drop .8s var(--lsit-ease) .1s both; }
.hero__badge, .hero__tagline, .hero .hero__h1, .hero__lead, .hero__cta, .hero__trust { animation: lsit-rise .8s var(--lsit-ease) both; }
.hero__badge { animation-delay: .05s; } .hero__tagline { animation-delay: .15s; } .hero .hero__h1 { animation-delay: .28s; } .hero__lead { animation-delay: .4s; } .hero__cta { animation-delay: .52s; } .hero__trust { animation-delay: .64s; }
.hero__visual { animation: lsit-rise 1s var(--lsit-ease) .3s both; }
.hero .text-gradient { background-image: linear-gradient(90deg, #155EEF, #42D9FF, #7C6CFF, #155EEF); background-size: 200% auto; animation: lsit-shimmer 6s linear infinite; }
.hero__badge i { animation: lsit-pulse 2.2s ease-out infinite; }
.hv__lines i.is-accent { background: linear-gradient(90deg, var(--lsit-accent), var(--lsit-primary), var(--lsit-accent)); background-size: 200% 100%; animation: lsit-shimmer 4s linear infinite; }
.why__glow { background-size: 140% 140%; background-repeat: no-repeat; background-position: 0% 0%, 100% 100%; animation: lsit-glow 14s ease-in-out infinite alternate; }

.btn--primary, .btn--light, .btn--accent { position: relative; overflow: hidden; }
.btn--primary::after, .btn--light::after { content: ''; position: absolute; inset: 0; background: linear-gradient(110deg, transparent 30%, rgba(255,255,255,.4) 50%, transparent 70%); transform: translateX(-120%); transition: transform .7s var(--lsit-ease); pointer-events: none; }
.btn--light::after { background: linear-gradient(110deg, transparent 30%, rgba(21,94,239,.12) 50%, transparent 70%); }
.btn--primary:hover::after, .btn--light:hover::after { transform: translateX(120%); }
.icon-box { transition: transform var(--lsit-dur) var(--lsit-ease); }
.card--hover:hover .icon-box { transform: translateY(-3px) rotate(-5deg); }
.eyebrow::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.grid > .reveal:nth-child(3n+2) { transition-delay: .08s; }
.grid > .reveal:nth-child(3n+3) { transition-delay: .16s; }
.link-arrow, .nav-list a { position: relative; }

/* Hero visual: gentle pointer parallax (uses the individual 'translate' property so it never fights the float animation) */
.hv__rings { translate: calc(var(--px, 0) * -6px) calc(var(--py, 0) * -6px); transition: translate .3s ease-out; }
.hv__orb { translate: calc(var(--px, 0) * -16px) calc(var(--py, 0) * -16px); transition: translate .3s ease-out; }
.hv__panel { translate: calc(var(--px, 0) * 8px) calc(var(--py, 0) * 8px); transition: translate .3s ease-out; }
.hv__card { translate: calc(var(--px, 0) * 24px) calc(var(--py, 0) * 24px); transition: translate .3s ease-out; }

/* Scroll progress bar */
.scroll-progress { position: fixed; top: 0; left: 0; width: 100%; height: 3px; transform-origin: left; transform: scaleX(0); background: linear-gradient(90deg, var(--lsit-accent), var(--lsit-primary), var(--lsit-secondary)); z-index: calc(var(--lsit-z-header) + 1); pointer-events: none; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-iteration-count: 1 !important; }
  .hero__badge, .hero__tagline, .hero .hero__h1, .hero__lead, .hero__cta, .hero__trust, .hero__visual, .site-header__pill { animation: none; opacity: 1; transform: none; }
  .hv__rings, .hv__orb, .hv__panel, .hv__card { translate: none; }
}
/* ---- Social icons, premium map, poster team cards ---- */
.soc-row{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center}
.soc-row--center{justify-content:center;margin-top:.8rem}
.soc{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:var(--lsit-soft,#eef3ff);color:var(--lsit-primary,#1a4bd1);border:1px solid var(--lsit-border,#dfe6f5);transition:transform .25s,background .25s,color .25s,box-shadow .25s}
.soc svg{width:18px;height:18px}
.soc:hover,.soc:focus-visible{transform:translateY(-3px) scale(1.06);color:#fff;box-shadow:0 10px 22px rgba(20,50,140,.28)}
.soc--facebook:hover{background:#1877f2}.soc--whatsapp:hover{background:#25d366}.soc--instagram:hover{background:linear-gradient(45deg,#f9a03f,#e1306c,#833ab4)}.soc--youtube:hover{background:#ff0000}.soc--tiktok:hover{background:#111}.soc--linkedin:hover{background:#0a66c2}
.branch-card__top{display:flex;flex-wrap:wrap;gap:.8rem;align-items:center;justify-content:space-between}
.bmap{position:relative;margin:var(--lsit-space-2,8px) 0;border-radius:22px;padding:3px;overflow:hidden;isolation:isolate;box-shadow:0 18px 40px rgba(15,40,110,.16)}
.bmap::before{content:'';position:absolute;inset:-70%;z-index:-1;background:conic-gradient(from 0deg,transparent 0 62%,var(--lsit-primary,#1a4bd1) 80%,var(--lsit-accent,#ff8a2a) 92%,transparent 100%);animation:bmapSpin 7s linear infinite}
.bmap__frame{position:relative;border-radius:19px;overflow:hidden;aspect-ratio:16/9;background:var(--lsit-soft,#eef3ff)}
.bmap__frame iframe{width:100%;height:100%;border:0;display:block;transform:scale(1.12);transition:transform 1.4s cubic-bezier(.2,.7,.2,1)}
.branch-card.is-in .bmap__frame iframe,.branch-card.is-visible .bmap__frame iframe,.branch-card.revealed .bmap__frame iframe,.bmap:hover .bmap__frame iframe{transform:scale(1)}
.bmap__pulse{position:absolute;left:50%;top:50%;width:0;height:0;pointer-events:none}
.bmap__pulse i{position:absolute;left:-60px;top:-60px;width:120px;height:120px;border-radius:50%;border:2px solid var(--lsit-primary,#1a4bd1);opacity:0;animation:bmapPulse 3s ease-out infinite}
.bmap__pulse i:nth-child(2){animation-delay:1s}.bmap__pulse i:nth-child(3){animation-delay:2s}
.bmap__live{position:absolute;top:12px;left:12px;display:inline-flex;align-items:center;gap:.45rem;padding:.35rem .75rem;border-radius:999px;font-size:.78rem;font-weight:600;color:#fff;background:rgba(10,25,70,.62);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);pointer-events:none}
.bmap__live b{width:8px;height:8px;border-radius:50%;background:#37e08a;animation:bmapBlink 1.6s ease-in-out infinite}
.bmap__chip{position:absolute;left:12px;bottom:12px;display:inline-flex;align-items:center;gap:.4rem;padding:.5rem .9rem;border-radius:999px;font-size:.82rem;font-weight:600;color:#fff;text-decoration:none;background:rgba(10,25,70,.66);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.22);transition:transform .25s,background .25s}
.bmap__chip svg{width:14px;height:14px}
.bmap__chip:hover{transform:translateY(-2px);background:var(--lsit-primary,#1a4bd1);color:#fff}
@keyframes bmapSpin{to{transform:rotate(360deg)}}
@keyframes bmapPulse{0%{transform:scale(.2);opacity:.7}100%{transform:scale(1.5);opacity:0}}
@keyframes bmapBlink{0%,100%{opacity:1}50%{opacity:.35}}
html[data-theme='dark'] .bmap__frame iframe{filter:invert(.9) hue-rotate(180deg) saturate(.8)}
html[data-theme='dark'] .soc{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.16);color:#cfe0ff}
/* team: the uploaded poster is the card */
#team .team-grid{display:flex;flex-wrap:wrap;justify-content:center;gap:var(--lsit-space-6,28px)}
#team .team-grid>.team-card--poster{flex:0 1 340px;min-width:240px;max-width:420px;padding:0;overflow:hidden;text-align:left}
.team-card__poster{display:block;background:var(--lsit-soft,#eef3ff);line-height:0}
.team-card__poster img{width:100%;height:auto;display:block;transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.team-card--poster:hover .team-card__poster img{transform:scale(1.04)}
.team-card__poster>span{display:grid;place-items:center;aspect-ratio:4/5;font-size:3rem;font-weight:800;color:#fff;background:var(--lsit-grad-primary,linear-gradient(135deg,#1a4bd1,#12307a));line-height:1}
.team-card__text{padding:1.1rem 1.3rem 1.3rem;text-align:center}
@media (prefers-reduced-motion:reduce){.bmap::before,.bmap__pulse i,.bmap__live b{animation:none}.bmap__frame iframe,.team-card__poster img{transition:none;transform:none}}
.bmap .bmap__live{left:auto;right:12px;top:12px}
.bmap .bmap__chip{display:none}

/* ---- Review wall: 3 rows, 4 cards visible per row, rows move in opposite directions ---- */
.tm-wall{overflow:hidden}
.tm-rows{position:relative;display:grid;gap:22px;margin-top:8px;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 7%,#000 93%,transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 7%,#000 93%,transparent 100%)}
.tm-row{overflow:hidden;--tm-w:clamp(270px,23.4vw,360px)}
.tm-track{display:flex;width:max-content;animation:tmRtl var(--tm-dur,40s) linear infinite;will-change:transform}
.tm-row--ltr .tm-track{animation-name:tmLtr}
.tm-row:hover .tm-track,.tm-row:focus-within .tm-track{animation-play-state:paused}
.tm-set{display:flex;gap:22px;padding-right:22px}
.tm-card{position:relative;flex:0 0 var(--tm-w);width:var(--tm-w);margin:0;padding:28px 26px 24px;border-radius:24px;display:flex;flex-direction:column;gap:20px;justify-content:space-between;color:#e8efff;background:linear-gradient(160deg,rgba(255,255,255,.10),rgba(255,255,255,.04));border:1px solid rgba(255,255,255,.16);box-shadow:0 18px 40px rgba(2,10,40,.35),inset 0 1px 0 rgba(255,255,255,.14);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);transition:transform .35s,border-color .35s,box-shadow .35s}
.tm-card:hover{transform:translateY(-6px);border-color:rgba(127,176,255,.6);box-shadow:0 26px 54px rgba(2,10,40,.5),0 0 0 1px rgba(127,176,255,.25)}
.tm-card__q{position:absolute;top:6px;right:22px;font:700 5.5rem/1 Georgia,serif;color:rgba(127,176,255,.22);pointer-events:none}
.tm-card blockquote{margin:0;font-size:.98rem;line-height:1.75;color:#dbe6ff;position:relative}
.tm-card figcaption{display:flex;align-items:center;gap:14px;padding-top:18px;border-top:1px solid rgba(255,255,255,.14)}
.tm-card__av{flex:none;width:48px;height:48px;border-radius:50%;display:grid;place-items:center;overflow:hidden;font-weight:700;font-size:1.15rem;color:#fff;background:linear-gradient(135deg,#2f6bff,#ff8a2a);box-shadow:0 8px 18px rgba(20,60,200,.4)}
.tm-card__av img{width:100%;height:100%;object-fit:cover}
.tm-card__who{display:flex;flex-direction:column;gap:3px;min-width:0}
.tm-card__who strong{color:#fff;font-size:1rem}
.tm-card__who em{font-style:normal;font-size:.8rem;font-weight:600;color:#9fc0ff}
@keyframes tmRtl{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@keyframes tmLtr{from{transform:translateX(-50%)}to{transform:translateX(0)}}
@media (max-width:700px){.tm-row{--tm-w:82vw}.tm-rows{gap:16px}}
@media (prefers-reduced-motion:reduce){.tm-track{animation:none;width:auto;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:8px}.tm-row{overflow-x:auto}.tm-dup{display:none}.tm-card{scroll-snap-align:start}.tm-rows{-webkit-mask-image:none;mask-image:none}}
.tm-track{animation-delay:var(--tm-delay,0s)}

/* ---- Team spotlight: highlighted poster cards ---- */
@property --tmang{syntax:'<angle>';initial-value:0deg;inherits:false}
#team{position:relative;overflow:hidden;isolation:isolate}
#team::before{content:'';position:absolute;left:50%;top:58%;width:min(900px,92vw);height:560px;transform:translate(-50%,-50%);z-index:-1;background:radial-gradient(closest-side,rgba(47,107,255,.22),rgba(255,138,42,.10) 55%,transparent 75%);filter:blur(10px);pointer-events:none}
#team .team-grid{padding:18px 0 8px}
#team .team-grid>.team-card--poster{position:relative;overflow:visible;border:0;border-radius:26px;background:transparent;box-shadow:0 30px 70px rgba(20,60,200,.26),0 10px 24px rgba(10,30,90,.14);transition:transform .45s cubic-bezier(.2,.7,.2,1),box-shadow .45s}
#team .team-grid>.team-card--poster::before{content:'';position:absolute;inset:-4px;border-radius:30px;padding:4px;background:conic-gradient(from var(--tmang),#2f6bff,#7fb0ff,#ff8a2a,#ffd2a1,#2f6bff);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);mask-composite:exclude;animation:tmSpin 6s linear infinite;pointer-events:none}
#team .team-grid>.team-card--poster .team-card__poster{position:relative;border-radius:22px;overflow:hidden}
#team .team-grid>.team-card--poster .team-card__poster::after{content:'';position:absolute;top:0;left:-60%;width:40%;height:100%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.55),transparent);transform:skewX(-18deg);transition:left .9s ease;pointer-events:none}
#team .team-grid>.team-card--poster:hover{transform:translateY(-10px) scale(1.025);box-shadow:0 44px 90px rgba(20,60,200,.38),0 14px 30px rgba(10,30,90,.18)}
#team .team-grid>.team-card--poster:hover .team-card__poster::after{left:130%}
#team .team-grid--1>.team-card--poster{flex-basis:460px;max-width:480px}
#team .team-grid--2>.team-card--poster{flex-basis:400px;max-width:440px}
#team .team-card__text{border-radius:0 0 22px 22px;background:var(--lsit-card,#fff)}
@keyframes tmSpin{to{--tmang:360deg}}
html[data-theme='dark'] #team::before{background:radial-gradient(closest-side,rgba(47,107,255,.30),rgba(255,138,42,.12) 55%,transparent 75%)}
@media (prefers-reduced-motion:reduce){#team .team-grid>.team-card--poster::before{animation:none}#team .team-grid>.team-card--poster .team-card__poster::after{display:none}}