/* 6 뉴발란스 · CREW — editorial / warm / serif. Everything scoped to html[data-variant="nb"]. */
html[data-variant="nb"]{--ink:#151515;--mute:#6b6b6b;--line:#e4dfd6;--surface:#F3F0EA;--warm:#F3F0EA;--red:#CF0A2C;--serif:'Instrument Serif',Georgia,'Times New Roman',serif;--nbsec:64px}
@media (min-width:960px){html[data-variant="nb"]{--nbsec:112px}}
html[data-variant="nb"] body{color:var(--ink)}
html[data-variant="nb"] .display{font-family:var(--serif);font-weight:400;text-transform:none;letter-spacing:-.01em;line-height:1.02}
html[data-variant="nb"].js-anim .display[data-r] .ln{padding:.1em 0 .2em;margin:-.1em 0 -.2em}

/* buttons: square, sentence case */
html[data-variant="nb"] .nb-btn{display:inline-flex;align-items:center;justify-content:center;height:48px;padding:0 24px;font:600 15px/1 var(--body);text-decoration:none;white-space:nowrap;border:0;border-radius:0;cursor:pointer;transition:background-color .15s,color .15s}
html[data-variant="nb"] .nb-btn--join{background:var(--join);color:#fff}
html[data-variant="nb"] .nb-btn--join:hover{background:var(--join-press)}
html[data-variant="nb"] .nb-btn--line{box-shadow:inset 0 0 0 1.5px var(--ink);color:var(--ink)}
html[data-variant="nb"] .nb-btn--line:hover{background:var(--ink);color:#fff}
html[data-variant="nb"] .nb-ctas{display:flex;gap:12px;flex-wrap:wrap;margin-top:36px;--d:3}

/* type */
html[data-variant="nb"] .nb-h1{font-size:46px}
html[data-variant="nb"] .nb-h2{font-size:38px}
html[data-variant="nb"] .nb-kicker{font-size:14px;font-weight:500;margin-top:14px}
html[data-variant="nb"] .nb-rule{display:block;width:32px;height:2px;background:var(--red)}
html[data-variant="nb"] .nb-lede{margin-top:16px;color:var(--mute);max-width:22em;--d:2}
html[data-variant="nb"] .nb-p{margin-top:16px;color:var(--mute);max-width:26em}
html[data-variant="nb"] .nb-sec{padding:var(--nbsec) 0}

/* hero */
html[data-variant="nb"] .nb-hero__media{aspect-ratio:390/290;overflow:hidden;background:#e9e6e0}
html[data-variant="nb"] .nb-hero__media img{object-position:50% 60%}
html[data-variant="nb"] .nb-hero__copy{padding:22px var(--g) 56px}
html[data-variant="nb"] .nb-h1{margin-top:12px}
@media (min-width:960px){
 html[data-variant="nb"] .nb-hero{display:grid;grid-template-columns:5fr 7fr;height:648px;margin:0 var(--g);padding:0;background:var(--warm)}
 html[data-variant="nb"] .nb-hero__media{order:2;aspect-ratio:auto;height:100%}
 html[data-variant="nb"] .nb-hero__copy{order:1;display:flex;flex-direction:column;justify-content:center;padding:0 40px 0 56px}
 html[data-variant="nb"] .nb-h1{font-size:68px;margin-top:20px}
 html[data-variant="nb"] .nb-kicker{margin-top:20px;font-size:15px}
 html[data-variant="nb"] .nb-lede{font-size:18px;margin-top:24px}
 html[data-variant="nb"] .nb-h2{font-size:54px}
 html[data-variant="nb"] .nb-p{font-size:18px;margin-top:20px}
}

/* facts: serif values, thin warm lines */
html[data-variant="nb"] .nb-facts{display:grid;grid-template-columns:1fr 1fr;margin:0 var(--g);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
html[data-variant="nb"] .nb-fact{padding:24px 0 24px 20px}
html[data-variant="nb"] .nb-fact:nth-child(odd){padding-left:0;padding-right:16px;border-right:1px solid var(--line)}
html[data-variant="nb"] .nb-fact:nth-child(-n+2){border-bottom:1px solid var(--line)}
html[data-variant="nb"] .nb-fact__i{display:block;width:24px;height:24px;color:var(--ink)}
html[data-variant="nb"] .nb-fact b{display:block;font:400 26px/1.1 var(--serif);letter-spacing:-.005em;margin-top:14px}
html[data-variant="nb"] .nb-fact span{display:block;font-size:14px;line-height:1.4;color:var(--mute);margin-top:4px}
@media (min-width:960px){
 html[data-variant="nb"] .nb-facts{grid-template-columns:repeat(4,1fr);margin-top:56px}
 html[data-variant="nb"] .nb-fact,html[data-variant="nb"] .nb-fact:nth-child(odd){padding:32px 28px;border-right:0;border-bottom:0}
 html[data-variant="nb"] .nb-fact:first-child{padding-left:0}
 html[data-variant="nb"] .nb-fact:not(:first-child){border-left:1px solid var(--line)}
 html[data-variant="nb"] .nb-fact b{font-size:27px;margin-top:16px}
}

/* league: editorial split */
html[data-variant="nb"] .nb-league{display:grid;gap:32px;padding-left:var(--g);padding-right:var(--g)}
html[data-variant="nb"] .nb-league__m{aspect-ratio:4/5;overflow:hidden}
@media (min-width:960px){html[data-variant="nb"] .nb-league{grid-template-columns:1fr 1fr;gap:96px;align-items:center}html[data-variant="nb"] .nb-league__m{aspect-ratio:648/720}}

/* social */
html[data-variant="nb"] .nb-social{padding-top:0}
html[data-variant="nb"] .nb-social__head{padding:0 var(--g)}
html[data-variant="nb"] .nb-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:28px;padding-top:18px;border-top:1px solid var(--line);max-width:760px}
html[data-variant="nb"] .nb-stats b{display:block;font:400 36px/1 var(--serif);font-variant-numeric:tabular-nums}
html[data-variant="nb"] .nb-stats span{display:block;font-size:14px;line-height:1.35;color:var(--mute);margin-top:6px}
html[data-variant="nb"] .nb-track{margin-top:40px}
html[data-variant="nb"] .nb-card{flex:0 0 74%;scroll-snap-align:start}
html[data-variant="nb"] .nb-card__m{aspect-ratio:4/5;overflow:hidden;background:#eee}
html[data-variant="nb"] .nb-card h3{font:600 16px/1.35 var(--body);margin-top:14px}
html[data-variant="nb"] .nb-card p{font-size:14px;color:var(--mute);margin-top:2px}
html[data-variant="nb"] .nb-link{display:inline-block;margin:28px var(--g) 0;font-weight:500;font-size:15px;text-underline-offset:4px}
@media (min-width:960px){
 html[data-variant="nb"] .nb-social__head{display:grid;grid-template-columns:1fr 1fr;gap:96px;align-items:end}
 html[data-variant="nb"] .nb-stats{margin-top:0;padding-top:24px}
 html[data-variant="nb"] .nb-stats b{font-size:47px}
 html[data-variant="nb"] .nb-stats span{font-size:14px}
 html[data-variant="nb"] .nb-track{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;overflow:visible;margin-top:56px}
 html[data-variant="nb"] .nb-card h3{font-size:17px;margin-top:16px}
}

/* where: warm band */
html[data-variant="nb"] .nb-where{background:var(--warm)}
html[data-variant="nb"] .nb-where__in{display:grid;gap:32px;padding:0 var(--g)}
html[data-variant="nb"] .nb-where__m{aspect-ratio:4/5;overflow:hidden}
html[data-variant="nb"] .nb-where .trains{margin-top:28px}
html[data-variant="nb"] .nb-addr{margin-top:20px;font-size:14px;color:var(--mute);max-width:26em}
@media (min-width:960px){html[data-variant="nb"] .nb-where__in{grid-template-columns:1fr 1fr;gap:96px;align-items:center}html[data-variant="nb"] .nb-where__m{order:2;aspect-ratio:648/720}html[data-variant="nb"] .nb-where__t{order:1}html[data-variant="nb"] .nb-where .trains{margin-top:40px}}

/* trophy: white page, trophy on white */
html[data-variant="nb"] .nb-trophy{display:grid;gap:32px;padding-left:var(--g);padding-right:var(--g)}
html[data-variant="nb"] .nb-trophy__m{aspect-ratio:1/1;overflow:hidden;background:#fff}
html[data-variant="nb"] .nb-label{font-size:14px;font-weight:500;margin:14px 0 12px}
@media (min-width:960px){html[data-variant="nb"] .nb-trophy{grid-template-columns:1fr 1fr;gap:96px;align-items:center}html[data-variant="nb"] .nb-label{font-size:15px;margin:20px 0 20px}}

/* how to join: numbered, light */
html[data-variant="nb"] .nb-how{padding-top:0}
html[data-variant="nb"] .nb-how__t{padding:0 var(--g);margin-bottom:28px}
html[data-variant="nb"] .nb-steps{list-style:none;margin:0 var(--g);border-top:1px solid var(--line)}
html[data-variant="nb"] .nb-steps li{display:flex;align-items:baseline;gap:20px;padding:20px 0;border-bottom:1px solid var(--line)}
html[data-variant="nb"] .nb-step__n{font:400 26px/1 var(--serif);color:var(--mute);min-width:32px;font-variant-numeric:tabular-nums}
html[data-variant="nb"] .nb-steps h3{font:500 17px/1.35 var(--body)}
@media (min-width:960px){
 html[data-variant="nb"] .nb-how__t{margin-bottom:40px}
 html[data-variant="nb"] .nb-steps{display:grid;grid-template-columns:repeat(3,1fr);border-bottom:1px solid var(--line)}
 html[data-variant="nb"] .nb-steps li{flex-direction:column;gap:20px;padding:32px 28px;border-bottom:0}
 html[data-variant="nb"] .nb-steps li:first-child{padding-left:0}
 html[data-variant="nb"] .nb-steps li:not(:first-child){border-left:1px solid var(--line)}
 html[data-variant="nb"] .nb-step__n{font-size:27px}
 html[data-variant="nb"] .nb-steps h3{font-size:18px}
}

/* faq */
html[data-variant="nb"] .nb-faq__t{padding:0 var(--g);margin-bottom:28px}
@media (min-width:960px){html[data-variant="nb"] .nb-faq__t{margin-bottom:40px}}

/* final */
html[data-variant="nb"] .nb-final{padding:0 var(--g) 72px}
html[data-variant="nb"] .nb-final__m{aspect-ratio:4/5;overflow:hidden}
html[data-variant="nb"] .nb-final__t{margin-top:32px}
html[data-variant="nb"] .nb-final__h{font-size:46px}
html[data-variant="nb"] .nb-lock{display:flex;flex-direction:column;align-items:flex-start;gap:10px;margin-top:40px}
html[data-variant="nb"] .nb-slogan{display:block;width:300px;height:auto}
html[data-variant="nb"] .nb-lock .logo{width:72px}
@media (min-width:960px){
 html[data-variant="nb"] .nb-final{display:grid;grid-template-columns:1fr 1fr;gap:96px;align-items:center;padding-bottom:112px}
 html[data-variant="nb"] .nb-final__m{aspect-ratio:648/760}
 html[data-variant="nb"] .nb-final__t{margin:0}
 html[data-variant="nb"] .nb-final__h{font-size:79px}
 html[data-variant="nb"] .nb-slogan{width:400px}
 html[data-variant="nb"] .nb-lock{margin-top:56px}
}

/* shared chrome restyled */
html[data-variant="nb"] .nav__menu a,html[data-variant="nb"] .nav__ig{font-size:15px}
html[data-variant="nb"] .dock .pill{border-radius:0;height:44px;font-weight:600;font-size:15px}
html[data-variant="nb"] .foot{border-top-color:var(--line)}
html[data-variant="nb"] .qr__box{border-radius:0}
html[data-variant="nb"] .qr__x{border-radius:0;background:var(--warm)}
html[data-variant="nb"] .qr__code{border-radius:0;border-color:var(--line)}
html[data-variant="nb"] .qr__t{font-size:48px}

html[data-variant="nb"] .hcards{margin-top:0}
html[data-variant="nb"] .hcard__n{font:400 48px/.85 var(--serif);color:var(--mute);font-variant-numeric:tabular-nums}
@media (min-width:960px){html[data-variant="nb"] .hcard__n{font-size:50px}}
@media (min-width:960px){html[data-variant="nb"] .nb-hero__copy .trust{margin-top:20px}}