/* The reference's black stage, pill navigation and fanned colour cards. */
body.home-page { --hp-bg:#111112; --hp-ink:#f5f5f1; --hp-muted:#a5a5aa; --hp-faint:#77777d; --hp-line:#303033; --hp-hover:#242426; --hp-fill:#f5f5f1; --hp-fill-ink:#111112; --hp-nav:#f5f5f1; }
body.home-page > header.sticky, body.home-page.hp-scrolled > header.sticky { background:rgba(17,17,18,.94)!important; border:0!important; backdrop-filter:blur(18px)!important; }
body.home-page > header.sticky > div { max-width:1440px; height:100px; padding:0 48px; gap:24px; }
body.home-page > header.sticky nav { background:#202021; border:1px solid #2a2a2c; border-radius:40px; padding:7px; gap:2px!important; font-size:12px!important; }
body.home-page > header.sticky nav a { padding:10px 15px; border-radius:30px; white-space:nowrap; color:#97979d!important; }
body.home-page > header.sticky nav a:hover, body.home-page > header.sticky nav a[href="/"] { color:#fff!important; background:#303032; }
body.home-page > header.sticky > div > a { color:#fff; gap:10px; }
body.home-page > header.sticky > div > a span { font-size:14px; }
body.home-page > header a > div.bg-gradient-to-br { background:transparent!important; width:30px; height:34px; border-radius:0!important; }
body.home-page > header a > div.bg-gradient-to-br::after { content:'✳'; font-size:34px; line-height:34px; color:#fff; }
body.home-page > header.sticky #loginBtn { border:0!important; color:#ddd!important; background:transparent!important; font-size:12px; padding:0 10px; }
body.home-page > header.sticky #themeToggle, body.home-page > header.sticky .h-6.w-px { display:none; }
.hero-contact { order:2; white-space:nowrap; color:#161617!important; background:#f5f5f1; padding:10px 18px; border-radius:14px; font-size:12px; }
.hero-menu-toggle { display:none; }
.hp .hp-hero { display:block; min-height:770px; padding:70px 0 0; overflow:hidden; background:radial-gradient(ellipse at 50% 90%,#212123 0, #111112 65%); }
.hp .hp-hero-inner { text-align:center; margin:auto; max-width:760px; position:relative; z-index:2; }
.hp .hp-hero .hp-eyebrow { font-size:11px; letter-spacing:.09em; color:#d0d0cc; gap:8px; align-items:center; margin-bottom:22px; }
.hp-eyebrow i { width:8px; height:8px; background:#e8fc8b; border-radius:2px; box-shadow:0 0 14px #e8fc8b44; }
.hp .hp-hero .hp-h1 { font-size:clamp(38px,4.6vw,66px); line-height:1.16; letter-spacing:-.05em; font-weight:500; }
.hp .hp-hero .grad { display:block; color:#c4c4c8; font-weight:400; }
.hp .hp-hero .hp-h1 br + .grad { display:inline; }
.hp .hp-en { margin-top:16px; font-size:14px; color:#bcbcc1; }
.hp .hp-hero p.lead { max-width:520px; margin:16px auto 0; font-size:13px; line-height:1.8; color:#949499; }
.hero-cursor { position:absolute; font-size:25px; z-index:1; }
.hero-cursor b { display:inline-block; font-size:10px; font-weight:400; border-radius:20px; padding:4px 12px; }
.cursor-one { left:12%; top:130px; color:#71cbc3; transform:rotate(-8deg); }
.cursor-one b { background:#71cbc3; color:#163431; }
.cursor-two { right:10%; top:235px; color:#f889a2; transform:rotate(9deg); }
.cursor-two b { background:#f889a2; color:#532936; }
.hero-spark { position:absolute; color:#454548; font-size:22px; }
.spark-one { top:340px; left:27%; }.spark-two { top:80px; right:20%; }
.hero-carousel { position:relative; margin:44px auto 0; width:100%; touch-action:pan-y; outline-offset:-4px; }
.hero-deck { position:relative; height:390px; max-width:1200px; margin:auto; }
.hero-card { position:absolute; top:0; left:50%; width:290px; height:365px; border-radius:28px; background:var(--card-color); overflow:hidden; transform-origin:50% 110%; box-shadow:inset 0 0 0 2px #ffffff26,0 14px 40px #0005; transition:transform .6s cubic-bezier(.22,.8,.25,1),filter .6s,opacity .5s; color:white; transform:translateX(-50%); }
.hero-card-heading { position:absolute; top:24px; left:24px; right:24px; z-index:2; pointer-events:none; }
.hero-card-heading h2 { font-size:25px; font-weight:600; letter-spacing:-.04em; margin:0; padding-right:76px; line-height:1.2; }
.hero-card-heading p { margin:9px 0 0; font-size:11px; opacity:.82; max-width:220px; }
.hero-card-art { position:absolute; width:100%; height:100%; object-fit:cover; inset:0; }
.hero-card-placeholder { position:absolute; bottom:12px; width:100%; text-align:center; font-size:220px; color:#fff9; text-shadow:12px 18px 0 #0002; }
.hero-card-link { position:absolute; right:18px; top:23px; z-index:5; background:#fffff5; color:#111!important; font-size:10px; padding:8px 10px; border-radius:24px; display:flex; align-items:center; gap:7px; }
.hero-card-link span { border-radius:50%; background:#e8fc8b; padding:3px 5px; font-size:14px; }
.hero-card-select { position:absolute; inset:0; z-index:4; border:0; background:transparent; cursor:pointer; }
.hero-card.is-active .hero-card-select { display:none; }
.hero-card:not(.is-active) .hero-card-link { visibility:hidden; }
.hero-card-number { position:absolute; bottom:18px; left:24px; font-size:10px; letter-spacing:.2em; opacity:.7; }
.hero-controls { display:flex; justify-content:center; align-items:center; gap:24px; padding:0 0 8px; position:relative; z-index:10; }
.hero-controls > button { width:38px; height:38px; border:1px solid #ffffff25; background:#202022; color:#eee; border-radius:50%; cursor:pointer; }
.hero-controls > button:hover { background:#39393d; }
.hero-dots { display:flex; gap:9px; max-width:50vw; flex-wrap:wrap; justify-content:center; }
.hero-dots button { width:6px; height:6px; padding:0; background:#626269; border:0; border-radius:20px; cursor:pointer; transition:width .3s,background .3s; }
.hero-dots button[aria-pressed="true"] { width:24px; background:#e8fc8b; }
.hero-status { text-align:center; font-size:10px; letter-spacing:.12em; color:#84848a; margin:8px 0 22px; }
.hero-carousel button:focus-visible,.hero-card-link:focus-visible { outline:2px solid #e8fc8b; outline-offset:4px; }
@media(min-width:1600px) { .hp .hp-hero { padding-top:95px; } }
@media(max-width:1200px) { body.home-page > header.sticky > div { padding:0 24px; gap:14px; } body.home-page > header.sticky nav a { padding:10px 9px; } body.home-page > header.sticky > div > a span { display:none; } }
@media(max-width:767px) {
 body.home-page > header.sticky > div { height:76px; padding:0 20px; }
 .hero-menu-toggle { display:block; margin-left:auto; border:0; background:transparent; color:#fff; font-size:23px; }
 body.home-page > header.sticky nav { display:none; }
 body.home-page > header.sticky nav.is-open { display:flex; position:absolute; top:70px; left:16px; right:16px; flex-wrap:wrap; border-radius:20px; padding:12px; }
 body.home-page > header.sticky nav a { flex:1 0 25%; text-align:center; }
 .hero-contact { padding:9px 12px; font-size:11px; }
 .hp .hp-hero { min-height:710px; padding-top:45px; }
 .hp .hp-hero .hp-h1 { font-size:42px; }
 .hp .hp-en { font-size:11px; }.hp .hp-hero p.lead { font-size:12px; max-width:310px; }
 .hero-cursor { display:none; }.hero-carousel { margin-top:36px; }.hero-deck { height:355px; }
 .hero-card { width:235px; height:330px; border-radius:24px; }.hero-card-heading { left:18px; top:23px; }.hero-card-heading h2 { font-size:22px; }.hero-card-heading p { max-width:160px; line-height:1.6; }
 .hero-card-link { top:auto; bottom:22px; right:18px; }.hero-card-number { bottom:64px; left:18px; }
}
@media(prefers-reduced-motion:reduce) { .hero-card,.hero-dots button { transition:none; } }

body.home-page > header.sticky > div > a .hero-brand-mark { display:block; color:white!important; font-size:36px; line-height:1; }
/* Polished resin surfaces, softly lit edges and a larger editorial headline. */
.hp .hp-hero { padding-top:46px; min-height:840px; background:radial-gradient(ellipse at 50% 82%,#232528 0,#141415 38%,#101011 75%); }
.hp .hp-hero-inner { max-width:1080px; }
.hp .hp-hero .hp-h1 { font-size:clamp(52px,6.2vw,88px); line-height:1.06; letter-spacing:-.055em; font-weight:500; }
.hp .hp-hero .grad { color:#bdbdc3; letter-spacing:-.06em; }
.hp .hp-hero .grad em { font-family:Georgia,'Times New Roman',serif; font-weight:400; }
.hp .hp-hero p.lead { margin-top:26px; color:#aaaab0; max-width:500px; font-size:14px; }
.hero-carousel { margin-top:58px; }
.hero-deck { height:460px; perspective:1400px; }
.hero-card { width:310px; height:425px; border-radius:30px; background:linear-gradient(145deg,#ffffff30,transparent 40%,#00000024),var(--card-color); box-shadow:inset 0 2px 2px #ffffff80,inset 2px 0 3px #ffffff35,inset -2px -3px 5px #00000045,0 24px 45px #0008,0 2px 5px #0005; transition:none; will-change:transform,opacity; }
.hero-card::before { content:''; position:absolute; inset:0; z-index:1; pointer-events:none; border-radius:inherit; background:linear-gradient(115deg,#fff2,transparent 35%,transparent 66%,#fff1); border:1px solid #ffffff40; box-shadow:inset 0 0 28px #ffffff0d; }
.hero-card::after { content:''; position:absolute; inset:0; z-index:3; pointer-events:none; opacity:.055; mix-blend-mode:soft-light; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.7' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23fff' filter='url(%23n)' d='M0 0h160v160H0z'/%3E%3C/svg%3E"); }
.hero-card-heading { top:26px; left:25px; }.hero-card-heading h2 { font-size:27px; text-shadow:0 1px 5px #0002; }
.hero-card-heading p { opacity:.9; text-shadow:0 1px 4px #0002; }
.hero-card-art { filter:drop-shadow(0 12px 12px #0002); }
.hero-card-link { box-shadow:0 2px 5px #0002,inset 0 1px 0 white; }
.hero-controls .hero-autoplay { width:30px; height:30px; font-size:11px; margin-left:-12px; color:#bcbcc1; }
@media(max-width:1000px) and (min-width:768px) { .hp .hp-hero .hp-h1 { font-size:62px; }.hero-card { width:290px; height:400px; }.hero-deck { height:435px; } }
@media(max-width:767px) { .hp .hp-hero { padding-top:42px; min-height:755px; }.hp .hp-hero .hp-h1 { font-size:clamp(38px,10.5vw,58px); letter-spacing:-.05em; }.hp .hp-hero .hp-wrap { padding:0 16px; }.hp .hp-hero p.lead { font-size:12px; margin-top:20px; max-width:310px; }.hero-carousel { margin-top:44px; }.hero-card { width:235px; height:350px; }.hero-deck { height:385px; }.hero-card-heading h2 { font-size:23px; }.hero-controls { gap:18px; } }