.ch{ padding-block:0 var(--px-14); }
@media (min-width:1024px){ .ch{ padding-block:0 var(--px-16); } }
.ch+.ch{ border-top:var(--px-hair) solid color-mix(in srgb, var(--px-ink) 40%, transparent); }
.chtop{ position:sticky; top:44px; z-index:var(--px-z-rail);
background:color-mix(in srgb, var(--w-ground) 88%, transparent);
-webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px);
border-bottom:var(--px-hair) solid var(--w-rule-soft); }
@media (min-width:1024px){ .chtop{ top:64px; } }
.chtop>.wrap{ display:flex; align-items:center; gap:var(--px-3);
min-height:40px; font-size:var(--px-t-micro); color:var(--w-dim); }
.chtop .chno{ font-variant-numeric:tabular-nums; font-weight:700;
letter-spacing:.1em; color:var(--w-accent); }
.chtop .chwho{ font-family:var(--w-display); text-transform:var(--w-case);
font-size:var(--px-t-ui); color:var(--w-text); }
.chtop .chter{ display:none; }
@media (min-width:640px){
.chtop .chter{ display:block; margin-left:auto; letter-spacing:.14em;
text-transform:uppercase; white-space:nowrap; overflow:hidden;
text-overflow:ellipsis; }
}
.chgrid{ display:grid; gap:var(--px-5); padding-top:var(--px-10); }
@media (min-width:1024px){
.chgrid{ grid-template-columns:minmax(0,560px) minmax(0,1fr);
grid-template-areas:"art head" "art buy"; column-gap:var(--px-16);
row-gap:var(--px-6); align-content:center; padding-top:var(--px-14); }
.chart{ grid-area:art; } .chhead{ grid-area:head; align-self:end; }
.chbuy{ grid-area:buy; align-self:start; max-width:420px; }
}
.chhead{ position:relative; }
.chhead .label{ font-size:var(--px-t-micro); letter-spacing:.18em;
text-transform:uppercase; color:var(--w-dim); font-family:var(--px-font);
font-weight:600; }
.chhead h2{ font-family:var(--w-display); text-transform:var(--w-case);
font-weight:500; font-size:clamp(40px,10vw,52px); line-height:1.02;
letter-spacing:-.02em; margin-top:var(--px-3); color:var(--w-text); }
@media (min-width:1024px){ .chhead h2{ font-size:clamp(56px,4.6vw,72px); } }
.chlight{ font-family:var(--w-display); font-size:var(--px-t-h3);
line-height:1.45; margin-top:var(--px-4); color:var(--w-text);
max-width:44ch; }
@media (min-width:1024px){ .chlight{ font-size:22px; line-height:1.4; } }
.chmeta{ margin-top:var(--px-4); font-size:var(--px-t-ui); color:var(--w-dim);
max-width:52ch; }
.chart{ margin-top:var(--px-6); }
.chart .cmp{ border-color:var(--w-rule);
box-shadow:0 22px 50px color-mix(in srgb, var(--px-ink) 42%, transparent); }
@media (max-width:1023.98px){
.chart .cmp{ margin-inline:calc(50% - 50vw); width:100vw;
border-radius:0; border-inline:0; --cmp-ar:4/5; --cmp-handle:40px; }
}
@media (min-width:1024px){
.chart{ margin-top:0; }
.chart .cmp{ --cmp-ar:4/5; --cmp-handle:44px; width:100%; }
}
.chcap{ margin-top:var(--px-3); font-family:var(--w-display);
font-size:var(--px-t-ui); line-height:1.4; color:var(--w-dim); }
.chbuy{ margin-top:var(--px-6); padding-top:var(--px-6);
border-top:var(--px-hair) solid var(--w-rule-soft); }
@media (min-width:1024px){ .chbuy{ margin-top:0; } }
.chbuy .price{ margin-top:0; }
.chbuy .price .now{ font-size:38px; letter-spacing:-.03em; line-height:1; }
@media (min-width:1024px){ .chbuy .price .now{ font-size:46px; } }
.chbuy .trust{ color:var(--w-dim-2); }
.chbuy .reason{ margin-top:var(--px-2); font-size:var(--px-t-micro);
color:var(--w-dim-2); }
.chbuy .own{ font-size:var(--px-t-h3); font-weight:700; color:var(--px-owned); }
@media (min-width:1024px){ .chbuy .cta,.chbuy .btn2,.chbuy .express{ max-width:360px; } }
.chex{ margin-top:var(--px-10); padding-top:var(--px-6);
border-top:var(--px-hair) solid var(--w-rule-soft); }
.chex>.label{ font-size:var(--px-t-micro); letter-spacing:.16em;
text-transform:uppercase; color:var(--w-dim); font-family:var(--px-font);
font-weight:600; }
.exgrid{ list-style:none; padding:0; margin-top:var(--px-5);
display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--px-5); }
@media (min-width:760px){ .exgrid{ grid-template-columns:repeat(4,minmax(0,1fr)); } }
@media (min-width:1024px){ .exgrid{ gap:var(--px-6); } }
.ex{ min-width:0; }
.ex .cmp{ --cmp-ar:440/789; --cmp-handle:28px; border-color:var(--w-rule); }
.ex .cmp .cmp-tag{ font-size:11px; padding:2px 5px; }
.exno{ margin-top:var(--px-3); font-family:var(--px-font); font-size:11px;
letter-spacing:.14em; text-transform:uppercase; color:var(--w-dim);
font-variant-numeric:tabular-nums; }
.exname{ font-family:var(--w-display); text-transform:var(--w-case);
font-size:var(--px-t-h3); line-height:1.2; color:var(--w-text); margin-top:2px; }
.exint{ margin-top:var(--px-2); font-size:var(--px-t-micro); line-height:1.5;
color:var(--w-dim); }
.ch .exit{ display:inline-flex; min-height:44px; align-items:center;
margin-top:var(--px-8); color:var(--w-text);
border-bottom:var(--px-hair) solid var(--w-accent); }
.ch .exit:focus-visible{ outline:2px solid var(--px-focus); outline-offset:3px; }
.galgrid{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr));
gap:var(--px-4); margin-top:var(--px-5); }
@media (min-width:1024px){
.galgrid{ grid-template-columns:repeat(4,minmax(0,1fr)); gap:var(--px-6); }
}
.tile{ background:var(--px-ink-2); border:var(--px-hair) solid var(--px-rule);
border-radius:var(--px-r-card); overflow:hidden; position:relative;
display:flex; flex-direction:column; }
.tile .cmp{ border:0; border-radius:0; --cmp-ar:4/5; }
.tile .cmp-tag.before{ display:none; }
.tlink{ padding:var(--px-3) var(--px-3) var(--px-4); display:block; }
.tlink h3{ font-size:var(--px-t-h3); font-weight:700; line-height:1.25; }
.tlink .tmeta{ margin-top:2px; font-size:var(--px-t-micro); color:var(--px-dim);
font-variant-numeric:tabular-nums; }
@media (min-width:1024px){
.tile{ transition:border-color var(--px-t-enter) var(--px-e-enter); }
.tile:hover{ border-color:var(--px-dim); }
.tlink:hover h3{ text-decoration:underline; text-underline-offset:3px; }
}
.tlink:focus-visible{ outline:2px solid var(--px-focus); outline-offset:-2px; }
.galsub,.galmore{ margin-top:var(--px-10); padding-top:var(--px-5);
border-top:var(--px-hair) solid var(--px-rule); }
.gal .label{ font-size:var(--px-t-micro); font-weight:700; letter-spacing:.14em;
text-transform:uppercase; color:var(--px-dim); }
.subgrid{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr));
gap:0 var(--px-6); margin-top:var(--px-2); }
@media (min-width:640px){ .subgrid{ grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media (min-width:1024px){ .subgrid{ grid-template-columns:repeat(4,minmax(0,1fr)); } }
.subgrid a,.gal .tlinks a{ display:flex; align-items:center;
justify-content:space-between; gap:var(--px-3); min-height:48px;
font-size:var(--px-t-ui);
border-bottom:var(--px-hair) solid var(--px-rule); }
.subgrid a:hover,.gal .tlinks a:hover{ color:var(--px-chalk); }
.subgrid a:focus-visible,.gal .tlinks a:focus-visible{
outline:2px solid var(--px-focus); outline-offset:2px; }
.subgrid .n,.gal .tlinks .n{ color:var(--px-dim);
font-variant-numeric:tabular-nums; white-space:nowrap; }
.chstory .subline{ font-family:var(--w-display); font-size:var(--px-t-h3);
line-height:1.45; }
.chstory .chex{ border-top:0; padding-top:0; margin-top:var(--px-6); }
@keyframes ch-rise{ from{ opacity:0; transform:translateY(16px); } to{ opacity:1; transform:none; } }
@keyframes ch-open{ from{ opacity:0; transform:translateY(24px) scale(.985); } to{ opacity:1; transform:none; } }
@supports (animation-timeline: view()){
@media (prefers-reduced-motion:no-preference){
.chhead>*,.chart,.chbuy,.chex>.label,.ex{
animation:ch-rise linear both;
animation-timeline:view();
animation-range:entry 4% cover 22%}
.chart{ animation-name:ch-open; animation-range:entry 0% cover 26%; }
.chhead>*:nth-child(2){ animation-range:entry 6% cover 24%; }
.chhead>*:nth-child(3){ animation-range:entry 8% cover 26%; }
.chhead>*:nth-child(4){ animation-range:entry 10% cover 28%; }
.ex:nth-child(2){ animation-range:entry 6% cover 24%; }
.ex:nth-child(3){ animation-range:entry 8% cover 26%; }
.ex:nth-child(4){ animation-range:entry 10% cover 28%; }
}
}
@media (prefers-reduced-motion:reduce){
.chhead>*,.chart,.chbuy,.chex>.label,.ex,.tile{
animation:none !important; transition:none !important;
opacity:1 !important; transform:none !important; }
}
.px-cheap .chtop{ -webkit-backdrop-filter:none; backdrop-filter:none;
background:var(--w-ground); }
