/* Trang chủ — Đặc quyền (hwp) */
.hwp{--g:var(--gold,#C8A15A);--gd:var(--gold-deep,#9C7A3C);position:relative;overflow:hidden;isolation:isolate;background:#0d0d0e;color:#EDEAE4;padding:clamp(56px,7vw,112px) clamp(18px,6vw,110px)}
.hwp::before{content:"";position:absolute;inset:0;z-index:-2;background:
 radial-gradient(ellipse 60% 50% at 50% 0%,rgba(200,161,90,.16),transparent 70%),
 repeating-radial-gradient(circle at 50% 120%,rgba(200,161,90,.05) 0 1px,transparent 1px 9px)}
.hwp__dial{position:absolute;z-index:-1;width:min(900px,130vw);aspect-ratio:1;top:50%;left:50%;transform:translate(-50%,-50%);color:var(--g);opacity:.11;pointer-events:none}
.hwp__head{max-width:760px;margin:0 auto clamp(36px,4vw,60px);text-align:center}
.hwp__eyebrow{display:inline-flex;align-items:center;gap:14px;font-size:11px;letter-spacing:.32em;color:var(--g)}
.hwp__eyebrow::before,.hwp__eyebrow::after{content:"";width:34px;height:1px;background:linear-gradient(90deg,transparent,var(--g))}
.hwp__eyebrow::after{transform:scaleX(-1)}
.hwp__title{margin:14px 0 12px;font-family:var(--serif,Georgia,serif);font-weight:400;font-size:clamp(28px,3.4vw,46px);line-height:1.15;color:#fff;letter-spacing:.01em}
.hwp__lead{margin:0;font-size:clamp(14px,1.1vw,16px);line-height:1.7;color:#A9A6A0}
.hwp__grid{list-style:none;margin:0 auto;padding:0;max-width:1240px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-template-rows:repeat(2,minmax(200px,auto));grid-auto-rows:auto;gap:14px}
.hwp__card{position:relative;overflow:hidden;padding:clamp(22px,2.2vw,32px);background:linear-gradient(160deg,rgba(255,255,255,.045),rgba(255,255,255,.01));border:1px solid rgba(200,161,90,.18);display:flex;flex-direction:column;justify-content:flex-end;transition:border-color .4s,transform .4s,background .4s}
.hwp__card::after{content:"";position:absolute;inset:0;pointer-events:none;border:1px solid var(--g);opacity:0;transition:opacity .4s}
.hwp__card:hover{transform:translateY(-3px);border-color:rgba(200,161,90,.5);background:linear-gradient(160deg,rgba(200,161,90,.09),rgba(255,255,255,.01))}
.hwp__card:hover::after{opacity:.55}
.hwp__card--hero{grid-column:span 2;grid-row:span 2;background:radial-gradient(circle at 85% 15%,rgba(200,161,90,.18),transparent 55%),linear-gradient(160deg,rgba(255,255,255,.05),rgba(255,255,255,.01))}
.hwp__card:last-child:not(.hwp__card--hero){grid-column:1/-1;min-height:0;display:grid;grid-template-columns:auto minmax(0,1fr) minmax(0,1.4fr);align-items:center;gap:8px 32px}
.hwp__card:last-child:not(.hwp__card--hero) .hwp__icon{margin:0}
.hwp__card:last-child:not(.hwp__card--hero) .hwp__name{margin:0}
.hwp__num{position:absolute;top:-.12em;right:.08em;font-family:var(--serif,Georgia,serif);font-style:italic;font-size:clamp(84px,8vw,128px);line-height:1;color:transparent;-webkit-text-stroke:1px rgba(200,161,90,.22);transition:-webkit-text-stroke-color .4s}
.hwp__card:hover .hwp__num{-webkit-text-stroke-color:rgba(200,161,90,.5)}
.hwp__icon{width:40px;height:40px;margin-bottom:auto;fill:none;stroke:var(--g);stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round}
.hwp__card--hero .hwp__icon{width:56px;height:56px}
.hwp__stat{margin:24px 0 8px;display:flex;align-items:baseline;gap:14px}
.hwp__stat strong{font-family:var(--serif,Georgia,serif);font-weight:400;font-size:clamp(96px,11vw,170px);line-height:.85;background:linear-gradient(180deg,#F1D9A4,var(--g) 55%,var(--gd));-webkit-background-clip:text;background-clip:text;color:transparent}
.hwp__stat span{font-size:12px;letter-spacing:.28em;text-transform:uppercase;color:var(--g)}
.hwp__name{margin:22px 0 8px;font-family:var(--sans,inherit);font-weight:600;font-size:clamp(14px,1.05vw,16px);letter-spacing:.12em;color:#fff}
.hwp__card--hero .hwp__name{font-size:clamp(18px,1.6vw,22px)}
.hwp__desc{margin:0;font-size:14px;line-height:1.65;color:#A9A6A0;max-width:420px}
/* Hiện khi cuộn */
.hwp.js-hwp .hwp-in{opacity:0;transform:translateY(22px);transition:opacity .8s cubic-bezier(.2,.7,.2,1),transform .8s cubic-bezier(.2,.7,.2,1);transition-delay:calc(var(--d,0) * 90ms)}
.hwp.js-hwp .hwp-in.is-in{opacity:1;transform:none}
.hwp.js-hwp .hwp__card.is-in:hover{transform:translateY(-3px)}
@media (max-width:1024px){.hwp__grid{grid-template-columns:repeat(2,minmax(0,1fr))}.hwp__card--hero{grid-row:span 1}.hwp__grid{grid-template-rows:none;grid-auto-rows:minmax(200px,auto)}}
@media (max-width:640px){
 .hwp__grid{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:12px;margin:0 calc(-1 * clamp(18px,6vw,110px));padding:0 clamp(18px,6vw,110px) 14px;scrollbar-width:none}
 .hwp__grid::-webkit-scrollbar{display:none}
 .hwp__card{flex:0 0 78%;min-height:240px;scroll-snap-align:center}
 .hwp__card--hero{flex-basis:86%}
 .hwp__card:last-child:not(.hwp__card--hero){display:flex;min-height:240px}
 .hwp__card:last-child:not(.hwp__card--hero) .hwp__icon{margin-bottom:auto}
 .hwp__card:last-child:not(.hwp__card--hero) .hwp__name{margin:22px 0 8px}
 .hwp__stat strong{font-size:110px}
}
@media (prefers-reduced-motion:reduce){
 .hwp.js-hwp .hwp-in{opacity:1;transform:none;transition:none}
 .hwp__card,.hwp__card::after,.hwp__num{transition:none}
 .hwp__card:hover{transform:none}
}
