
/* ================= LIFE AT HVT ================= */
.lf{background:#050609;color:#fff}
.lf-hero{position:relative;background:#050609;padding-top:var(--hdr-h);overflow:hidden}
.lf-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));grid-template-rows:auto auto;align-items:start}
.lf-copy{grid-column:1/7;grid-row:1;align-self:center;padding:clamp(40px,6vw,96px) clamp(24px,4vw,64px) clamp(32px,4vw,64px) max(var(--gl),calc((100vw - 1320px)/2 + var(--gl)))}
.lf-copy h1{font-family:var(--f-display);font-weight:300;font-size:clamp(2.8rem,6.4vw,6.2rem);line-height:.98;letter-spacing:-.045em;margin:18px 0 0}
.lf-copy h1 span{display:block}
.lf-copy h1 .gt{font-weight:600}
.lf-copy .lede{color:#c9cee0;max-width:46ch;margin-top:26px}
.lf-ph{position:relative;overflow:hidden;background:#11131c;margin:0}
.lf-ph img{width:100%;height:100%;object-fit:cover;display:block;will-change:transform}
.lf-a{grid-column:7/13;grid-row:1;aspect-ratio:7/5;border-radius:0 0 0 28px}
.lf-b{grid-column:4/7;grid-row:2;aspect-ratio:5/7;border-radius:28px 0 28px 28px}
.lf-c{grid-column:1/4;grid-row:2;align-self:end;aspect-ratio:4/3;border-radius:0 28px 0 0;margin-bottom:12%}
.lf-note{grid-column:8/12;padding-right:var(--gr)!important;grid-row:2;align-self:center;font-family:var(--f-display);font-weight:300;font-size:clamp(1.25rem,1.9vw,1.75rem);line-height:1.35;color:#e6e9f4;padding:40px 0;text-wrap:balance}
.lf-note b{font-weight:600}
.lf-crumbs{margin:0}
@media (max-width:900px){
  .lf-grid{grid-template-columns:repeat(6,minmax(0,1fr))}
  .lf-copy{grid-column:1/-1;grid-row:1;padding:40px var(--gr) 32px var(--gl)}
  .lf-a{grid-column:2/-1;grid-row:2;border-radius:28px 0 0 28px}
  .lf-b{grid-column:1/4;grid-row:3;border-radius:0 28px 28px 0;margin-top:-18%}
  .lf-c{display:none}
  .lf-note{grid-column:4/-1;grid-row:3;padding:24px var(--gr) 24px 20px;font-size:1.05rem;align-self:end}
}
/* pill tabs */
.lf-tabs{position:sticky;top:0;z-index:40;background:rgba(5,6,9,.86);backdrop-filter:blur(14px) saturate(150%);-webkit-backdrop-filter:blur(14px) saturate(150%);border-block:1px solid rgba(255,255,255,.08);transition:top var(--duration-fast,.25s) cubic-bezier(.22,1,.36,1)}
body.hdr-in .lf-tabs{top:var(--hdr-h)}
/* jumps from the tab bar land below the header and the bar */
#culture,#communities,#philippines,#join{scroll-margin-top:calc(var(--hdr-h) + 66px)}
.lf-tabs .wrap{display:flex;flex-wrap:nowrap;align-items:center;gap:10px;padding-block:12px;overflow-x:auto!important;scrollbar-width:none;min-width:0}
@media (max-width:640px){.lf-tabs .wrap{max-width:none;width:100%}.lf-tabs{overflow:hidden}}
.lf-tabs .wrap::-webkit-scrollbar{display:none}
.lf-tabs .arw{flex:none;width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:#fff;color:#050609}
.lf-tabs .arw svg{width:18px;height:18px}
.lf-tabs a{flex:none;display:inline-flex;align-items:center;min-height:42px;padding:0 20px;border-radius:999px;font:600 .9rem var(--f-body);color:#fff;text-decoration:none;background:rgba(255,255,255,.1);transition:background .35s cubic-bezier(.22,1,.36,1),color .35s cubic-bezier(.22,1,.36,1)}
.lf-tabs a:hover{background:rgba(255,255,255,.2);transition-duration:.25s}
.lf-tabs a[aria-current=true]{background:#fff;color:#050609}
/* culture */
.lf-sec{padding-block:clamp(80px,10vw,150px)}
.lf-head{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:28px 80px;align-items:end;margin-bottom:clamp(48px,6vw,88px)}
.lf-head .h-sec{margin:0;text-wrap:balance}
.lf-head .lede{margin:0;color:#c7ccdc}
.light .lf-head .lede{color:var(--muted-l)}
.lf-vals{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(24px,3vw,48px);list-style:none;margin:0;padding:0}
.lf-vals li{border-top:1px solid rgba(255,255,255,.22);padding-top:28px}
.lf-vals .ic{width:48px;height:48px;border-radius:14px;display:grid;place-items:center;background:linear-gradient(#0b0d16,#0b0d16) padding-box,var(--g-bright) border-box;border:1px solid transparent;color:#fff}
.lf-vals .ic svg{width:24px;height:24px}
.lf-vals h3{font-family:var(--f-display);font-weight:600;font-size:clamp(1.4rem,2.1vw,1.9rem);margin:24px 0 10px;letter-spacing:-.02em}
.lf-vals p{margin:0;color:#c7ccdc;max-width:36ch}
@media (max-width:900px){.lf-head{grid-template-columns:1fr}.lf-vals{grid-template-columns:1fr}}
/* photo strip: Spotify-style "stutter" slider. Every 1.5 s the row steps one photo left; the photo leaving shrinks
   into its bottom-right corner while the one arriving grows out of its bottom-left corner. */
.lf-stut{position:relative;margin-top:clamp(64px,8vw,112px);overflow:hidden}
.lf-st-track{display:flex;align-items:flex-end;will-change:transform}
.lf-st{flex:none;margin:0;padding:0 4px;box-sizing:border-box;width:calc(100% / 3)}
.lf-st img{display:block;width:100%;height:auto;object-fit:cover;border-radius:24px;background:#11131c}
.lf-st.r1 img{aspect-ratio:1/1}.lf-st.r2 img{aspect-ratio:413/580}.lf-st.r3 img{aspect-ratio:525/389}
.lf-st.out{animation:lfOut .7s cubic-bezier(.33,1,.68,1) forwards;transform-origin:100% 100%}
.lf-st.in{animation:lfIn .7s cubic-bezier(.33,1,.68,1);transform-origin:0 100%}
@keyframes lfOut{to{transform:scale(.5)}}
@keyframes lfIn{from{transform:scale(.5)}}
.lf-st-ctl{display:flex;justify-content:flex-end;gap:12px;margin-top:24px}
.lf-st-ctl .cbtn svg{width:18px;height:18px}
@media (max-width:1024px){.lf-st{width:50%}}
@media (max-width:640px){.lf-st{width:62%}}
/* communities */
.lf-comm{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(18px,2.2vw,28px);list-style:none;margin:0;padding:0}
.lf-card{position:relative;display:flex;flex-direction:column;height:100%;border-radius:24px;background:#fff;border:1px solid var(--line-l);overflow:hidden;transition:transform .35s cubic-bezier(.22,1,.36,1),box-shadow .35s cubic-bezier(.22,1,.36,1),border-color .35s}
.lf-card:hover{transform:translateY(-6px);border-color:transparent;background:linear-gradient(#fff,#fff) padding-box,var(--g-logo) border-box;box-shadow:0 30px 60px -34px rgba(19,46,161,.55);transition-duration:.25s}
.lf-card .ph{aspect-ratio:4/3;overflow:hidden;background:#e9ebf2}
.lf-card .ph img{width:100%;height:100%;object-fit:cover;transition:transform .5s cubic-bezier(.22,1,.36,1)}
.lf-card:hover .ph img{transform:scale(1.06)}
.lf-card .bd{position:relative;padding:34px clamp(22px,2.2vw,28px) 28px;display:flex;flex-direction:column;gap:10px}
.lf-card .ic{position:absolute;top:-26px;left:clamp(22px,2.2vw,28px);width:52px;height:52px;border-radius:16px;display:grid;place-items:center;background:var(--g-logo);color:#fff;box-shadow:0 14px 28px -12px rgba(19,46,161,.7)}
.lf-card .ic svg{width:26px;height:26px}
.lf-card h3{font-family:var(--f-display);font-weight:600;font-size:1.35rem;margin:6px 0 0;letter-spacing:-.01em}
.lf-card p{margin:0;color:var(--muted-l)}
.lf-comm.pre>li{opacity:0;transform:translateY(24px)}
.lf-comm.go>li{opacity:1;transform:none;transition:opacity .5s cubic-bezier(.22,1,.36,1),transform .5s cubic-bezier(.22,1,.36,1)}
.lf-comm.go>li:nth-child(1){transition-delay:0ms}.lf-comm.go>li:nth-child(2){transition-delay:40ms}.lf-comm.go>li:nth-child(3){transition-delay:80ms}.lf-comm.go>li:nth-child(4){transition-delay:120ms}.lf-comm.go>li:nth-child(5){transition-delay:160ms}.lf-comm.go>li:nth-child(6){transition-delay:200ms}
@media (max-width:1000px){.lf-comm{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:620px){.lf-comm{grid-template-columns:1fr}}
/* philippines */
.lf-ph-sec .lf-split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(40px,6vw,96px);align-items:center}
.lf-ph-sec .h-sec{margin-top:14px;text-wrap:balance}
.lf-ph-sec .h-2l{font-size:min(clamp(1.3rem,3.4vw,3.2rem),6.1cqi)}
.lf-ph-sec .lede{color:#c7ccdc;margin-top:22px}
.lf-pil{list-style:none;margin:36px 0 0;padding:0;display:grid;gap:22px}
.lf-pil li{display:grid;grid-template-columns:44px minmax(0,1fr);gap:16px;align-items:start}
.lf-pil .ic{width:44px;height:44px;border-radius:12px;display:grid;place-items:center;background:rgba(255,255,255,.08);color:#fff}
.lf-pil .ic svg{width:22px;height:22px}
.lf-pil b{display:block;font-family:var(--f-display);font-weight:600;font-size:1.1rem}
.lf-pil span{color:#c7ccdc}
.lf-duo{position:relative;display:grid;grid-template-columns:repeat(6,minmax(0,1fr))}
.lf-duo .lf-ph:first-child{grid-column:1/6;grid-row:1;aspect-ratio:4/5;border-radius:28px}
.lf-duo .lf-ph:last-child{grid-column:3/7;grid-row:1;align-self:end;aspect-ratio:4/3;border-radius:24px;margin-bottom:-14%;box-shadow:0 30px 60px -30px rgba(0,0,0,.8);border:6px solid #050609}
@media (max-width:900px){.lf-ph-sec .lf-split{grid-template-columns:1fr}.lf-duo{margin-bottom:12%}}
/* join */
.lf-join{text-align:center}
.lf-join .h-sec{margin:0 auto;max-width:18ch;text-wrap:balance}
.lf-join p{color:var(--muted-l);margin:20px auto 0;max-width:52ch}
.lf-join .ctas{display:flex;flex-wrap:wrap;justify-content:center;gap:16px 28px;margin-top:36px;align-items:center}
@media (prefers-reduced-motion:reduce){.lf-ph img,.lf-card,.lf-card .ph img,.lf-track img{transition:none!important;transform:none!important}}
