:root{--sh-yellow:#f5d900;--sh-green:#073e35;--sh-ink:#11130f;--sh-paper:#f4f3ed;--sh-line:#b7b8b1;--sh-pad:var(--portal-axis-gutter,clamp(24px,5vw,76px))}
.shop-hero,.shop-choice,.shop-note{box-sizing:border-box;font-family:Barlow,sans-serif;color:var(--sh-ink)}
.shop-hero{min-height:calc(78svh - 76px);padding:clamp(72px,8vw,130px) var(--sh-pad);display:grid;grid-template-columns:1.15fr .62fr;gap:clamp(40px,7vw,120px);align-content:center;background:var(--sh-yellow)}
.shop-hero small,.shop-copy small,.shop-note small{font-size:.78rem;font-weight:800;letter-spacing:.17em;text-transform:uppercase}
.shop-hero h1{grid-column:1/-1;max-width:1300px;margin:clamp(38px,5vw,68px) 0 34px;font-size:clamp(5rem,8.5vw,9.5rem);font-weight:620;line-height:.79;letter-spacing:-.067em;text-wrap:balance}
.shop-hero>p{max-width:620px;margin:0;font-size:clamp(1.2rem,1.65vw,1.65rem);line-height:1.43}
.shop-hero nav{align-self:end;display:grid;grid-template-columns:1fr 1fr;border-top:1px solid}
.shop-hero nav a,.shop-copy span,.shop-note a{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:18px 20px;border:1px solid;border-top:0;color:inherit;font-size:.78rem;font-weight:800;letter-spacing:.05em;text-decoration:none;text-transform:uppercase}
.shop-hero nav a+a{border-left:0}.shop-hero nav a.primary{background:var(--sh-ink);color:#fff;border-color:var(--sh-ink)}
.shop-hero i,.shop-copy i,.shop-note i{font-style:normal}
.shop-choice{background:#fff}
.shop-option{min-height:720px;display:grid;grid-template-columns:1fr 1fr;color:inherit;text-decoration:none;border-top:1px solid var(--sh-line)}
.shop-visual{min-width:0;min-height:620px;margin:0;overflow:hidden;background:#d9d8d2}
.shop-visual img{width:100%;height:100%;display:block;object-fit:cover;transition:transform .55s ease}
.shop-option:hover .shop-visual img{transform:scale(1.018)}
.shop-copy{padding:clamp(58px,7vw,112px) var(--sh-pad);display:flex;flex-direction:column;justify-content:center;background:#fff}
.shop-copy h2{margin:34px 0 28px;font-size:clamp(3.5rem,5.2vw,6rem);font-weight:600;line-height:.88;letter-spacing:-.055em;text-wrap:balance}
.shop-copy h2>span{display:block}.shop-copy h2 b{font-weight:inherit;white-space:nowrap}
.shop-copy p{max-width:530px;margin:0 0 48px;font-size:1.25rem;line-height:1.5}
.shop-copy span{width:min(100%,430px);margin-top:auto;padding-left:0;padding-right:0;border-left:0;border-right:0}
.shop-products .shop-visual{order:2}.shop-products .shop-copy{order:1;background:var(--sh-green);color:#fff}.shop-products .shop-copy p{color:#d6e0dc}
.shop-note{padding:clamp(70px,8vw,120px) var(--sh-pad);display:grid;grid-template-columns:.45fr 1fr auto;gap:clamp(32px,5vw,80px);align-items:end;background:var(--sh-paper)}
.shop-note p{max-width:690px;margin:0;font-size:clamp(1.35rem,2.2vw,2.35rem);line-height:1.22;letter-spacing:-.025em}.shop-note a{width:max-content;max-width:100%;padding-left:0;padding-right:0;border-left:0;border-right:0}
@media(max-width:900px){.shop-hero{grid-template-columns:1fr}.shop-hero h1{grid-column:auto}.shop-hero nav{max-width:620px}.shop-option{grid-template-columns:1fr}.shop-products .shop-visual,.shop-products .shop-copy{order:initial}.shop-visual{min-height:0;aspect-ratio:4/3}.shop-note{grid-template-columns:1fr}}
@media(max-width:620px){.shop-hero{min-height:0;padding:64px 24px 72px}.shop-hero h1{margin:42px 0 28px;font-size:16vw;line-height:.84}.shop-hero>p{font-size:1.12rem}.shop-hero nav{grid-template-columns:1fr;margin-top:16px}.shop-hero nav a+a{border-left:1px solid;border-top:0}.shop-copy{padding:62px 24px}.shop-copy h2{font-size:clamp(2.75rem,13vw,3.35rem);line-height:.9}.shop-copy p{font-size:1.08rem;margin-bottom:40px}.shop-copy span{margin-top:0}.shop-copy h2>span+span{margin-top:.12em}.shop-note{padding:68px 24px;gap:30px}.shop-note p{font-size:1.55rem}.shop-note a{line-height:1.35}}
