:root{--paper:#f3f2e9;--ink:#2b3928;--accent:#425632}
*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.52 system-ui,sans-serif}
a{color:inherit}a:focus-visible{outline:3px solid var(--ink);outline-offset:4px}
header,footer{padding:16px max(5vw,16px);display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
header{border-bottom:1px solid currentColor}footer{border-top:1px solid currentColor;margin-top:26px}nav{display:flex;gap:12px;flex-wrap:wrap}
.wordmark{font-weight:800;letter-spacing:.08em}.kicker{font-size:.78rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase}
main{width:min(1140px,90%);margin:auto;padding:22px 0 30px}h1,h2,h3,p,figure{margin:0 0 12px}
h1{font-size:clamp(2.2rem,6vw,5.7rem);line-height:.98;letter-spacing:-.06em;max-width:12ch}
h2{font-size:clamp(1.55rem,3vw,2.65rem);line-height:1.08;letter-spacing:-.025em}
img{display:block;width:100%;height:auto;object-fit:contain;background:#fff7}
.cta{display:inline-flex;min-height:46px;align-items:center;padding:10px 15px;background:var(--accent);color:#fff;border-radius:8px;text-decoration:none;font-weight:700}
.layout{display:grid;grid-template-columns:1fr 1fr;gap:18px;align-items:center}.layout>*{min-width:0}
.layout figure{margin:0}.layout img{aspect-ratio:4/3;object-fit:contain}
.pane{padding:clamp(14px,3vw,34px);background:#fff7;border-radius:16px;min-width:0}
.choices{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:16px 0}.choices>*{min-width:0}
.card{background:#fff8;border-radius:14px;overflow:hidden}.card img{aspect-ratio:4/3;object-fit:contain}.card .pane{background:none}
.catalog{margin:28px 0}.guide{margin-top:22px;padding:18px;border:1px solid currentColor;border-radius:12px}
.detail img{width:min(100%,520px)}.details h1{font-size:clamp(2rem,5vw,4rem)}.narrow{max-width:680px}
.swatches{display:flex;gap:9px;padding:4px 0;list-style:none;flex-wrap:wrap}.swatches li{border:1px solid currentColor;border-radius:999px;padding:5px 10px}
.index-strip{display:flex;gap:10px;flex-wrap:wrap;list-style:none;padding:0}.index-strip li{flex:1 1 160px}
.mono{font-family:ui-monospace,monospace}.feature{background:var(--ink);color:var(--paper)}
.split-reverse{grid-template-columns:1.3fr 1fr}.trip{grid-template-columns:1.4fr 1fr}
.feature .cta{background:#fff;color:var(--ink)}.mini img{max-height:245px}
@media(max-width:700px){header,footer{padding:12px 5vw}header nav{font-size:.86rem}
main{padding-top:16px}.layout{grid-template-columns:1fr;gap:12px}.layout img{max-height:300px}
.choices{gap:9px}.card .pane{padding:10px}.card h3{font-size:1rem}.card .cta{padding:8px 10px;font-size:.9rem}
.guide{padding:13px}.mini img{max-height:220px}}

.flx h1{font-size:clamp(2.15rem,5.4vw,4.8rem);max-width:16ch;line-height:1.02}
.flx figure{margin:0;min-width:0}.flx img{width:100%;height:100%;object-fit:contain}
.flx .cta{border-radius:4px}.flx .guide a{display:inline-flex;align-items:center;min-height:44px;margin-right:14px}
.flx-street{display:grid;grid-template-columns:.85fr 1.15fr;align-items:center;gap:24px;background:#f0d8c4;padding:clamp(16px,3vw,36px)}
.flx-street h1,.flx-season h1{font-family:Georgia,serif;font-weight:normal;letter-spacing:-.045em}
.flx-pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;align-items:start}
.flx-pair figure{height:clamp(180px,26vw,320px);background:#e9c7ad}
.flx-pair figure+figure{margin-top:24px;background:#ddad90}
.flx-shelf{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.flx-shelf article{border-top:3px solid #ac634a;background:#fff8}
.flx-shelf figure{height:150px;background:#efdccc}
.flx-shelf article>div{padding:14px}.flx-shelf h3{font-size:1.05rem}
.flx-selector{background:#d1e5e2;border-block:2px solid #3c7473;padding:clamp(16px,4vw,38px)}
.flx-selector h1{max-width:20ch}.flx-selector div{display:flex;gap:8px;flex-wrap:wrap}
.flx-compare{border-top:1px solid #5c8180}
.flx-compare article{display:grid;grid-template-columns:140px minmax(0,1fr) auto;gap:18px;align-items:center;padding:12px 0;border-bottom:1px solid #5c8180}
.flx-compare h3,.flx-compare p{margin:0 0 5px}.flx-compare figure{height:112px;background:#dfeae9}
.flx details{padding:8px 0}.flx summary{cursor:pointer;font-weight:700;padding:6px 0}
.flx-season{text-align:center;background:#e4e5d1;padding:clamp(16px,4vw,34px);border-bottom:3px solid #7c8966}
.flx-season h1{max-width:none;margin-inline:auto}
.flx-window{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.flx-window article{background:#efe0cb}.flx-window article+article{background:#dce4d6}
.flx-window figure{height:265px;background:#fff4}.flx-window article>div{padding:16px}
.flx-daily{display:flex;align-items:center;gap:8px 14px;flex-wrap:wrap;margin-top:16px}
.flx-daily p{margin:0}
@media(max-width:700px){
 .flx-street{grid-template-columns:1fr;gap:14px}.flx-pair figure{height:137px}.flx-pair figure+figure{margin-top:12px}
 .flx-shelf{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.flx-shelf figure{height:116px}.flx-shelf article>div{padding:10px}
 .flx-compare article{grid-template-columns:72px minmax(0,1fr);gap:6px 12px}.flx-compare figure{grid-row:span 2;height:90px}.flx-compare .cta{justify-self:start}
 .flx-window{grid-template-columns:1fr;gap:12px}.flx-window article{display:grid;grid-template-columns:.75fr 1fr;align-items:center}
 .flx-window figure{height:158px}.flx-window article>div{padding:10px}
}
