/* Brand Discovery v3 — editorial discovery and mobile polish */
[hidden]{display:none!important}
html{scroll-behavior:auto;scroll-padding-top:88px}
body{overflow-x:clip}
button,a,[role="button"]{-webkit-tap-highlight-color:transparent;touch-action:manipulation}
button:focus-visible,a:focus-visible,[role="button"]:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #7f9d21;outline-offset:3px}
.footer-install{background:none;border:0;padding:0;color:var(--white);text-align:left;font:inherit;text-transform:uppercase;cursor:pointer}
.footer-install:hover{text-decoration:underline}
.style-filter-heading{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:0 0 10px;font:700 10px var(--display);letter-spacing:1px}
.surprise-button{border:0;background:none;border-bottom:1px solid currentColor;font:700 10px var(--display);text-transform:uppercase;letter-spacing:.4px;padding:10px 0;cursor:pointer}
.style-chips{margin-bottom:2px}
.style-chips .filter-chip[aria-pressed="true"]{background:var(--acid);color:var(--ink);border-color:var(--ink)}
.saved-filter{min-height:44px;padding:11px 13px;border:1px solid var(--hair);background:var(--white);font:700 10px var(--display);text-transform:uppercase;cursor:pointer}
.saved-filter[aria-pressed="true"]{background:var(--acid);border-color:var(--ink)}
.brand-style-tags{display:flex;flex-wrap:wrap;gap:5px;margin-top:11px}
.brand-style-tags span{border:1px solid var(--hair);padding:5px 7px;color:var(--muted);font:700 9px var(--display);text-transform:uppercase}
.brand-photo .compare-on-photo{position:absolute;z-index:3;right:11px;bottom:11px;min-width:44px;height:44px;border:1px solid var(--white);background:var(--ink);color:var(--white);border-radius:50%;display:grid;place-items:center;font:500 27px var(--display);cursor:pointer}
.brand-photo .compare-on-photo[aria-pressed="true"]{background:var(--acid);color:var(--ink);border-color:var(--acid);font-size:21px}
.compare-tooltip{position:absolute;right:48px;padding:7px 9px;top:6px;white-space:nowrap;background:var(--ink);color:var(--white);font:700 9px var(--display);letter-spacing:.5px;opacity:0;pointer-events:none}
.compare-on-photo:hover .compare-tooltip,.compare-on-photo:focus-visible .compare-tooltip{opacity:1}
.editions-home{background:var(--paper)}
.edition-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.edition-card{display:block;position:relative;isolation:isolate;min-width:0;aspect-ratio:3/4.5;overflow:hidden;background:#777e70;color:#fff}
.edition-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:saturate(.65) contrast(1.08);transition:transform .45s}
.edition-card:hover img{transform:scale(1.04)}
.edition-card:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.22),transparent 34%,rgba(0,0,0,.78));z-index:0}
.edition-overlay{position:absolute;inset:0;padding:19px;display:flex;flex-direction:column;justify-content:space-between;z-index:1}
.edition-kicker{font:700 10px var(--display);letter-spacing:1.25px}
.edition-overlay h3{font:700 clamp(30px,3.1vw,50px)/.94 var(--display);letter-spacing:-.07em;margin:0 0 12px;overflow-wrap:anywhere}
.edition-overlay h3 span{color:var(--acid)}
.edition-overlay p{font:500 12px/1.4 var(--display);margin:0 0 22px;color:#eee}
.edition-overlay small{font:700 10px var(--display);letter-spacing:1px;border-top:1px solid #fff8;padding-top:12px;display:block}
.edition-page-grid .edition-card{aspect-ratio:3/3.2}
.edit-detail{margin:72px 0 20px;scroll-margin-top:85px}
.edit-detail-head{display:flex;align-items:end;justify-content:space-between;gap:25px;margin-bottom:28px;padding-bottom:22px;border-bottom:1px solid var(--hair)}
.edit-detail-head h2{font:700 clamp(42px,6vw,78px)/1 var(--display);letter-spacing:-.08em;margin:12px 0}
.edit-detail-head p:not(.overline){font-size:14px;line-height:1.6;color:var(--muted);max-width:500px}
.link-button{background:transparent;border:0;cursor:pointer}
.compare-head{display:flex;justify-content:space-between;gap:15px;margin:0 0 27px}
.compare-grid{display:grid;grid-template-columns:repeat(var(--compare-cols),minmax(0,1fr));gap:16px;max-width:1320px}
.compare-col{min-width:0;border:1px solid var(--hair);background:#f7f7f2}
.compare-photo{position:relative;height:clamp(180px,27vw,370px);background:var(--soft)}
.compare-photo img{width:100%;height:100%;object-fit:cover;filter:saturate(.6)}
.compare-photo button{position:absolute;top:12px;right:12px;width:44px;height:44px;border:0;background:var(--white);font-size:27px;cursor:pointer}
.compare-col h2{font:700 clamp(26px,3vw,43px)/1 var(--display);letter-spacing:-.055em;margin:23px 19px 8px;overflow-wrap:anywhere}
.compare-tag{margin:0 19px 22px;font:500 13px/1.4 var(--display);min-height:36px;color:var(--muted)}
.compare-col dl{margin:0 19px}
.compare-col dt{font:700 10px var(--display);text-transform:uppercase;letter-spacing:.7px;color:var(--muted);padding:15px 0 6px;border-top:1px solid var(--hair)}
.compare-col dd{margin:0 0 15px;font:500 13px/1.55 var(--display);overflow-wrap:anywhere}
.compare-actions{padding:15px 19px 22px;display:flex;flex-wrap:wrap;gap:8px}
.compare-actions .detail-save{display:inline-flex;align-items:center;min-height:50px}
.compare-actions .button{white-space:normal;flex:1;justify-content:center}
.compare-dock{position:fixed;z-index:70;bottom:24px;left:50%;transform:translateX(-50%);width:min(720px,calc(100% - 36px));min-height:72px;display:flex;align-items:center;gap:16px;background:var(--ink);color:var(--white);padding:12px 13px 12px 18px;border:1px solid #555;box-shadow:0 13px 40px #0003}
.compare-dock>span{font:700 10px var(--display);letter-spacing:.7px;white-space:nowrap}
.compare-dock-names{font:500 11px/1.4 var(--display);color:#bec7b8;min-width:0;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.compare-dock-go{padding:12px 15px;background:var(--acid);color:var(--ink);font:700 10px var(--display);white-space:nowrap;text-transform:uppercase}
.compare-dock>button{padding:6px;background:transparent;border:0;color:var(--white);font-size:25px;cursor:pointer}
.install-sheet{position:fixed;inset:0;z-index:100;background:#0009;display:grid;place-items:center;padding:20px}
.install-card{position:relative;width:min(460px,100%);background:var(--paper);padding:38px 28px;box-shadow:0 20px 70px #0005}
.install-card h2{font:700 clamp(34px,7vw,52px)/.98 var(--display);letter-spacing:-.065em;margin:17px 0}
.install-card p{line-height:1.6;font-size:14px;color:var(--muted);margin:0 0 26px}
.install-close{position:absolute;right:10px;top:10px;width:44px;height:44px;background:transparent;border:0;font-size:28px;cursor:pointer}
.install-open{overflow:hidden}
.detail-actions{flex-wrap:wrap}
.detail-save{cursor:pointer}
.detail-save[aria-pressed="true"]{background:var(--acid);border-color:var(--ink)}
@media(max-width:1100px){
 .topnav{gap:16px}.topnav a{font-size:10px}.top-actions{gap:12px}
 .edition-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .edition-card{aspect-ratio:4/4.2}
 .edition-overlay h3{font-size:clamp(32px,5vw,54px)}
}
@media(max-width:700px){
 html{scroll-padding-top:66px}
 .topbar{min-height:60px}
 .page-intro h1{font-size:clamp(43px,11vw,66px)}
 .page-section{padding-top:48px;padding-bottom:48px}
 .edition-grid{gap:9px}
 .edition-card,.edition-page-grid .edition-card{aspect-ratio:3/4.2}
 .edition-overlay{padding:13px}
 .edition-overlay h3{font-size:clamp(25px,6vw,39px)}
 .edition-overlay p{font-size:10px;margin-bottom:14px}
 .edition-kicker,.edition-overlay small{font-size:8px}
 .style-filter-heading{margin:2px 0 8px}
 .catalog{padding-bottom:calc(100px + env(safe-area-inset-bottom))}
 .searchbox input{font-size:16px}
 .compare-dock{bottom:calc(var(--navH) + env(safe-area-inset-bottom) + 8px);width:calc(100% - 16px);min-height:64px;gap:7px;padding:8px 8px 8px 10px}
 .compare-dock>span{font-size:9px}
 .compare-dock-names{display:none}
 .compare-dock-go{margin-left:auto;padding:12px 10px}
 .compare-dock>button{padding:4px}
 .compare-grid{grid-template-columns:repeat(var(--compare-cols),minmax(0,1fr));gap:7px}
 .compare-col h2{font-size:clamp(15px,4.8vw,27px);margin:12px 8px 6px}
 .compare-photo{height:clamp(128px,45vw,220px)}
 .compare-photo button{top:5px;right:5px;width:34px;height:34px}
 .compare-tag{margin:0 8px 12px;font-size:10px;min-height:45px}
 .compare-col dl{margin:0 8px}
 .compare-col dt{font-size:9px;padding:10px 0 4px}
 .compare-col dd{font-size:10px;margin-bottom:9px}
 .compare-actions{padding:10px 7px;display:grid}
 .compare-actions .button,.compare-actions .detail-save{font-size:9px;min-height:42px;padding:9px 6px;justify-content:center;text-align:center}
 .edit-detail{margin-top:36px;scroll-margin-top:70px}
 .edit-detail-head{display:block}.edit-detail-head h2{font-size:46px}
 .edit-detail-head .underlink{display:inline-block;margin-top:12px}
 .brand-style-tags{gap:4px}
 .brand-style-tags span{font-size:8px}
 .mobile-nav a{font-size:9px;gap:4px}
 .mobile-nav svg{width:21px;height:21px}
 .toast{bottom:calc(var(--navH) + env(safe-area-inset-bottom) + 16px)}
 .install-sheet{padding:16px}
 .footer-install{font-size:11px}
}
@media(max-width:359px){
 .mobile-nav{padding-left:1px;padding-right:1px}
 .mobile-nav a{font-size:8px}
 .edition-overlay h3{font-size:23px}
 .edition-overlay p{font-size:9px}
 .compare-col dl{margin:0 6px}
 .compare-col dd{font-size:9px}
}
@media(prefers-reduced-motion:reduce){.edition-card img,.brand-photo img{transition:none!important}}

/* Graceful editorial art direction when remote photographs are unavailable */
.hero-picture{background:linear-gradient(140deg,#4e594f 0%,#8d9581 40%,#2b342d 100%)}
.hero-fallback{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;padding:clamp(20px,4vw,65px);font:700 clamp(52px,7vw,105px)/.82 var(--display);letter-spacing:-.095em;color:#e0ebcf;z-index:0;overflow:hidden}
.hero-fallback span{font:700 11px var(--display);letter-spacing:2px;margin-top:45px}
.hero-picture>img{position:relative;z-index:1;object-fit:cover}
.hero-picture:after{z-index:2}.hero-picture-label{z-index:3}
.brand-photo{background:linear-gradient(155deg,#d5dbca,#b5bfb0 65%,#9fa994)}
.brand-fallback{position:absolute;inset:0;z-index:0;display:flex;flex-direction:column;justify-content:space-between;padding:20px 13px 16px;color:#354634}
.brand-fallback span,.brand-fallback small{font:700 9px var(--display);letter-spacing:1px}
.brand-fallback strong{font:700 clamp(26px,2.8vw,43px)/.94 var(--display);letter-spacing:-.075em;overflow-wrap:anywhere}
.brand-photo>img{position:relative;z-index:1;object-fit:cover}
.brand-photo .number{z-index:2}
.brand-photo .save-button{z-index:3}
.brand-photo .compare-on-photo{z-index:3}
@media(max-width:700px){.hero-fallback{font-size:clamp(47px,14vw,76px)}.brand-fallback{padding:12px 9px}.brand-fallback strong{font-size:clamp(24px,8vw,38px)}}
