@charset "UTF-8";
:root { --ink:#20231f; --paper:#f5f5ef; --lime:#d6fc45; --muted:#62665e; --line:#d4d7cd; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:25px; }
body { margin:0; color:var(--ink); background:var(--paper); font:15px/1.7 Arial,Helvetica,sans-serif; }
a { color:inherit; text-decoration:none; }
img { display:block; width:100%; object-fit:cover; }
h1,h2,h3,p,figure { margin:0; }
h1,h2 { font-family:Impact,'Arial Narrow',Arial,sans-serif; font-weight:900; line-height:.98; letter-spacing:-2px; }
h2 { font-size:clamp(40px,4.5vw,66px); }
h3 { font-size:21px; line-height:1.3; letter-spacing:-.5px; }
p { color:var(--muted); }
em { font-style:normal; color:#7a8e26; }
.wrap { width:min(1340px,90%); margin-inline:auto; }
.skip { position:absolute; top:-100px; left:12px; padding:12px; background:white; z-index:20; }
.skip:focus { top:12px; }
a:focus-visible,summary:focus-visible { outline:3px solid #667d18; outline-offset:5px; }
.topline { display:flex; justify-content:space-between; padding:8px 5%; background:var(--ink); color:#fff; font-size:9px; letter-spacing:1.8px; }
.topline a { color:var(--lime); }
.header { display:flex; justify-content:space-between; align-items:center; min-height:104px; gap:20px; }
.wordmark { font-size:31px; font-weight:900; letter-spacing:-2px; }
.wordmark span { color:#80962b; padding-inline:3px; }
nav { display:flex; gap:30px; font-size:12px; font-weight:600; }
nav a:hover { text-decoration:underline; text-underline-offset:6px; }
.outline { padding:10px 18px; border:1px solid var(--ink); font-size:10px; font-weight:700; }
.hero { display:grid; grid-template-columns:1fr 1.04fr; min-height:625px; padding-block:25px 60px; gap:4%; }
.eyebrow { font-size:10px; font-weight:700; letter-spacing:1.5px; margin-bottom:25px; }
h1 { font-size:clamp(63px,7.6vw,110px); margin-bottom:25px; }
h1 span { font-size:.72em; }
.hero-copy>p:not(.eyebrow) { max-width:430px; font-size:14px; }
.button { display:inline-flex; justify-content:space-between; gap:35px; padding:16px 22px; background:var(--ink); color:#fff; font-weight:700; font-size:11px; margin-top:27px; }
.button:hover { background:#45502a; }
.hero-meta { display:flex; justify-content:space-between; gap:15px; border-top:1px solid var(--line); margin-top:35px; padding-top:17px; font-size:8px; letter-spacing:.6px; }
.hero-photo { position:relative; background:#e6e8df; overflow:hidden; }
.hero-photo>img { height:100%; min-height:570px; }
.stamp { position:absolute; top:25px; right:25px; width:100px; height:100px; padding:15px; background:var(--lime); font-size:21px; font-weight:900; line-height:1; transform:rotate(7deg); }
.stamp span { display:block; text-align:right; font-size:29px; }
.hero-photo figcaption { position:absolute; bottom:0; left:0; right:0; padding:18px; background:var(--ink); color:white; font-size:10px; display:flex; justify-content:space-between; gap:12px; }
.hero-photo figcaption span { font-size:8px; }
.ribbon { background:var(--lime); display:flex; justify-content:space-around; gap:22px; padding:22px 5%; font-size:22px; line-height:1.2; font-weight:900; letter-spacing:-.5px; }
.section { padding-block:85px; }
.section-head { display:flex; justify-content:space-between; align-items:end; gap:50px; margin-bottom:38px; }
.section-head>p { max-width:355px; font-size:14px; }
.categories { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.category-image { position:relative; overflow:hidden; height:340px; background:#e9e9e3; }
.category-image img { height:100%; transition:transform .3s; }
.category:hover img { transform:scale(1.035); }
.category-image span { position:absolute; bottom:15px; left:15px; padding:5px 10px; background:var(--paper); font-size:9px; font-weight:700; }
.apparel img { object-position:50% 20%; }
.category h3 { display:flex; justify-content:space-between; margin:18px 0 6px; }
.category p,.photo-note { font-size:12px; }
.photo-note { margin-top:22px; font-size:10px; }
.outdoor { background:var(--ink); color:white; padding-block:65px; }
.outdoor-grid { display:grid; grid-template-columns:1fr 1fr; gap:7%; align-items:center; }
.outdoor-image { position:relative; }
.outdoor-image img { height:625px; }
.outdoor-image>span { position:absolute; bottom:20px; left:20px; background:var(--lime); padding:10px 16px; color:var(--ink); font-size:10px; font-weight:700; }
.outdoor-copy .eyebrow { color:var(--lime); }
.outdoor em { color:var(--lime); }
.outdoor-copy>p:not(.eyebrow) { color:#c3c7bd; font-size:14px; margin-top:25px; }
dl { margin:25px 0; }
dl>div { display:grid; grid-template-columns:100px 1fr; gap:15px; border-top:1px solid #4b5045; padding:15px 0; }
dt { font-size:9px; font-weight:700; }
dd { margin:0; font-size:12px; color:#c3c7bd; }
.text-link { color:var(--lime); font-size:10px; font-weight:700; border-bottom:1px solid #7f8b56; padding-bottom:7px; }
.style-section { display:grid; grid-template-columns:1fr 1fr; gap:8%; align-items:center; }
.style-copy>p:not(.eyebrow) { font-size:14px; margin-top:25px; max-width:420px; }
.look { border-top:1px solid var(--line); margin-top:25px; padding-top:16px; display:grid; grid-template-columns:75px 1fr; gap:8px 12px; }
.look>span { font-size:9px; padding-top:5px; }
.look h3 { font-size:19px; }
.look p { grid-column:2; font-size:12px; }
.style-image img { height:690px; object-position:50% 25%; }
.style-image figcaption { font-size:10px; font-weight:700; padding-top:15px; }
.collab { background:var(--lime); padding-block:65px; }
.collab h2 { font-size:clamp(43px,6vw,85px); }
.collab h2 span { color:#4b5c1b; }
.collab-bottom { display:grid; grid-template-columns:1fr 1fr; gap:7%; margin-top:30px; max-width:1040px; }
.collab-bottom p { color:#35401d; font-size:14px; }
.articles { display:grid; grid-template-columns:repeat(3,1fr); gap:30px; }
.articles article { border-top:2px solid var(--ink); padding-top:20px; }
.article-number { font-size:35px; font-weight:900; color:#7f8d59; }
.articles h3 { margin:20px 0; }
.articles p { font-size:13px; margin-top:15px; }
.faq { display:grid; grid-template-columns:.8fr 1.2fr; gap:5%; padding-bottom:85px; }
details { border-top:1px solid var(--line); padding:20px 0; }
details:last-child { border-bottom:1px solid var(--line); }
summary { cursor:pointer; font-size:14px; font-weight:600; }
details p { padding-top:15px; font-size:13px; }
.footer { background:var(--ink); color:white; padding-block:40px; }
.footer-top,.footer-bottom { display:flex; justify-content:space-between; align-items:center; gap:20px; }
.footer-top p { color:var(--lime); font-size:11px; font-weight:700; }
.footer-top>a:last-child { font-size:9px; }
.footer-bottom { border-top:1px solid #45493f; padding-top:22px; margin-top:30px; font-size:9px; color:#bbc2af; }
@media(max-width:950px) { .header>.outline { display:none; } .hero { gap:25px; } .hero-photo>img { min-height:540px; } .hero-photo figcaption { flex-direction:column; } .ribbon { font-size:18px; } .category-image { height:270px; } .outdoor-grid { gap:30px; } .style-section { gap:35px; } .style-image img { height:720px; } }
@media(max-width:650px) { .topline { font-size:8px; letter-spacing:.3px; gap:10px; } .header { flex-direction:column; align-items:start; justify-content:center; padding-block:20px; gap:15px; } nav { width:100%; justify-content:space-between; gap:10px; font-size:11px; } .hero { grid-template-columns:1fr; padding-top:15px; padding-bottom:35px; gap:30px; } h1 { font-size:76px; } .hero-photo>img { min-height:0; height:440px; } .hero-photo figcaption { flex-direction:row; } .ribbon { flex-wrap:wrap; font-size:15px; padding-block:17px; gap:15px; } .ribbon span:last-child,.ribbon b:last-of-type { display:none; } .section { padding-block:55px; } .section-head { display:block; } .section-head>p { margin-top:25px; } .categories,.articles { grid-template-columns:1fr; gap:35px; } .category-image { height:340px; } .outdoor { padding-block:40px; } .outdoor-grid,.style-section,.collab-bottom,.faq { grid-template-columns:1fr; } .outdoor-image img { height:420px; } .outdoor-copy { margin-top:10px; } .style-image img { height:540px; } .collab { padding-block:45px; } .collab-bottom { gap:18px; } .faq { padding-bottom:55px; gap:30px; } .footer-top,.footer-bottom { flex-direction:column; align-items:start; gap:12px; } }
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } * { transition:none!important; } }