/* NYT Distributions – Collections | Responsive vanilla CSS (no dependencies) */
:root{--red:#ed0024;--red-deep:#c9001e;--text:#101116;--muted:#45464e;--soft:#f6f6f7;--container:1328px;--radius:5px}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:#fff;color:var(--text);font-family:Arial,Helvetica,sans-serif;-webkit-font-smoothing:antialiased}
a{color:inherit}
button{font:inherit}
.container{max-width:var(--container);width:calc(100% - 9.3%);margin-inline:auto}
/* HERO – image on right and blackout gradient on left */
.collections-hero{min-height:clamp(158px,14.15vw,250px);isolation:isolate;position:relative;overflow:hidden;background:#120c0b;color:#fff}
.hero-scene{position:absolute;inset:0 0 0 auto;width:67%;background:url('../hero-books.webp') center center/cover no-repeat;z-index:-2;animation:heroDrift 20s ease-in-out infinite alternate}
.collections-hero::before{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#100b0b 0%,#100b0b 27%,rgba(15,10,10,.89) 39%,rgba(13,8,8,.22) 66%,rgba(14,5,7,.10) 100%);z-index:-1}
.hero-inner{max-width:1288px;width:calc(100% - 13%);padding-block:clamp(13px,1.25vw,26px) clamp(17px,1.4vw,24px);position:relative}
.breadcrumb{display:flex;align-items:center;gap:12px;font-size:clamp(9px,.8vw,12px);line-height:1.4;color:#e6e6e6;margin-bottom:clamp(9px,1vw,15px)}
.breadcrumb a{text-decoration:none;transition:color .2s}.breadcrumb a:hover{color:#ff536b}
.collections-hero h1{font-size:clamp(34px,3.55vw,56px);line-height:.99;letter-spacing:-.045em;margin:0 0 clamp(7px,.7vw,12px);font-weight:800}
.hero-lead{font-size:clamp(14px,1.42vw,22px);font-weight:500;margin:0 0 6px;line-height:1.2}
.hero-description{font-family:Georgia,'Times New Roman',serif;font-size:clamp(11px,1.05vw,16px);line-height:1.28;max-width:610px;margin:0;color:#fafafa}
/* FEATURED GRID */
.featured{padding:clamp(15px,1.55vw,24px) 0 clamp(17px,2.1vw,34px);background:linear-gradient(95deg,#fff 0%,#fafafb 50%,#fff 100%)}
.section-heading{margin-bottom:7px}
.section-heading h2{font-size:clamp(17px,1.6vw,24px);line-height:1.2;font-weight:800;letter-spacing:-.04em;margin:0 0 5px}
.red-rule{display:block;background:var(--red);height:2px;width:24px;transform-origin:left;animation:ruleIn .8s .2s both}
.collections-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(7px,.7vw,13px)}
.collection-card{position:relative;min-width:0;min-height:clamp(137px,13.35vw,194px);isolation:isolate;overflow:hidden;border-radius:var(--radius);box-shadow:0 1px 2px rgba(45,25,22,.025);background:#f6f3f0;transition:box-shadow .4s,transform .4s}
.collection-card:hover{box-shadow:0 12px 30px rgba(41,22,25,.13);transform:translateY(-4px)}
.collection-card::before{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#f4f1ef 0%,#f6f3f1 45%,rgba(247,244,241,.88) 50%,rgba(246,243,240,0) 63%);z-index:1;pointer-events:none}
.collection-card:nth-child(2)::before{background:linear-gradient(90deg,#f7f4f2 0%,#f6f4f2 45%,rgba(247,244,241,.88) 50%,rgba(247,244,241,0) 63%)}
.card-photo{position:absolute;right:0;top:0;bottom:0;width:60%;background-image:var(--image);background-size:cover;background-position:center;transition:transform .7s cubic-bezier(.2,.7,.2,1);z-index:0}
.collection-card:hover .card-photo{transform:scale(1.075)}
.card-content{position:relative;z-index:2;width:70%;height:100%;min-height:inherit;padding:clamp(13px,1.6vw,23px) 0 clamp(13px,1.2vw,19px) clamp(17px,1.8vw,27px);display:flex;flex-direction:column;align-items:flex-start}
.eyebrow{text-transform:uppercase;letter-spacing:.085em;font-size:clamp(7px,.7vw,11px);line-height:1.3;font-weight:700;color:#be1431;margin:0 0 clamp(5px,.55vw,9px)}
.collection-card h3{font-size:clamp(13px,1.22vw,19px);letter-spacing:-.04em;font-weight:800;line-height:1.04;margin:0 0 6px;max-width:95%}
.card-description{font-family:Georgia,'Times New Roman',serif;color:#2e2c31;font-size:clamp(10px,.97vw,14px);line-height:1.16;margin:0 0 10px;max-width:94%}
.red-button{border:1px solid var(--red);background:linear-gradient(120deg,#d7001e,var(--red));color:#fff;display:inline-flex;align-items:center;justify-content:center;gap:9px;border-radius:3px;padding:clamp(6px,.65vw,10px) clamp(15px,1.5vw,24px);font-size:clamp(9px,.86vw,13px);font-weight:600;line-height:1.1;min-height:26px;white-space:nowrap;cursor:pointer;transition:background .25s,transform .25s,box-shadow .25s;box-shadow:0 2px 3px rgba(168,0,27,.06)}
.red-button:hover,.red-button:focus-visible{background:linear-gradient(110deg,#a9001d,#d00020);transform:translateY(-2px);box-shadow:0 7px 15px rgba(192,0,28,.24)}
.red-button span,.cta-button span{display:inline-block;font-size:1.25em;line-height:.7;transition:transform .25s}
.red-button:hover span,.cta-button:hover span{transform:translateX(5px)}
.collection-card .red-button{margin-top:auto}
.collection-card:focus-within{outline:2px solid var(--red);outline-offset:2px}
/* CTA */
.collections-cta{margin-top:clamp(9px,1vw,15px);min-height:clamp(87px,8.65vw,132px);background:linear-gradient(105deg,#960010 0%,#ae001b 41%,#e00027 100%);border-radius:var(--radius);position:relative;isolation:isolate;display:grid;grid-template-columns:31% minmax(0,1fr) auto;align-items:center;gap:clamp(12px,1.2vw,24px);overflow:hidden;padding-right:clamp(30px,3.2vw,48px);color:#fff;box-shadow:0 2px 4px rgba(110,0,25,.08)}
.collections-cta::before{content:'';position:absolute;inset:-150% auto -150% -50%;width:45%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.07),transparent);transform:rotate(18deg);animation:ctaShine 9s 2s infinite;z-index:2;pointer-events:none}
.cta-books{height:100%;align-self:stretch;background:linear-gradient(90deg,rgba(113,0,15,0) 65%,#ad001b 100%),url('../collections-banner.webp') left center/cover no-repeat;transition:transform .65s ease}
.collections-cta:hover .cta-books{transform:scale(1.04)}
.cta-message{min-width:0;position:relative;z-index:3}.cta-message h2{font-size:clamp(16px,1.8vw,28px);font-weight:800;letter-spacing:-.035em;line-height:1.2;margin:0 0 5px}.cta-message p{font-family:Georgia,'Times New Roman',serif;font-size:clamp(10px,1vw,15px);color:#fff;margin:0;line-height:1.3}
.cta-button{display:inline-flex;align-items:center;justify-content:center;gap:10px;border:1px solid rgba(255,255,255,.6);border-radius:3px;padding:clamp(7px,.85vw,13px) clamp(13px,1.7vw,27px);background:#fff;color:#c50020;position:relative;z-index:3;font-weight:700;font-size:clamp(9px,.85vw,13px);white-space:nowrap;text-decoration:none;transition:transform .25s,box-shadow .25s}.cta-button:hover{transform:translateY(-2px);box-shadow:0 9px 17px rgba(40,0,10,.17)}
/* DETAILS MODAL */
.collection-dialog{max-width:min(720px,calc(100vw - 28px));width:100%;padding:0;border:0;border-radius:10px;box-shadow:0 22px 85px #08050566;overflow:visible;color:var(--text)}
.collection-dialog::backdrop{background:rgba(10,6,8,.72);backdrop-filter:blur(4px)}
.dialog-layout{display:grid;grid-template-columns:40% 60%;background:#fff;border-radius:10px;overflow:hidden}.dialog-layout img{width:100%;height:100%;min-height:300px;object-fit:cover;object-position:center}.dialog-copy{padding:40px 28px 28px}.dialog-copy h2{font-size:clamp(23px,3vw,33px);line-height:1.05;margin:8px 0 14px}.dialog-copy>p{font-family:Georgia,serif;line-height:1.55}.featured-book{padding-top:12px;font-size:14px}.dialog-copy .red-button{margin-top:12px}
.modal-close{position:absolute;right:-12px;top:-12px;background:#e40020;color:white;border:0;width:36px;height:36px;border-radius:100%;font-size:26px;cursor:pointer;line-height:1;z-index:3}
/* SCROLL REVEAL */
.reveal{opacity:0;transform:translateY(20px);transition:opacity .7s ease,transform .7s cubic-bezier(.25,.6,.2,1),box-shadow .4s;transition-delay:var(--delay,0s)}
.reveal.is-visible{opacity:1;transform:translateY(0)}
.reveal.is-visible:hover{transform:translateY(-4px)}
.collections-cta.reveal.is-visible:hover{transform:translateY(0)}
@keyframes heroDrift{from{transform:scale(1.01) translateX(0)}to{transform:scale(1.06) translateX(-1.5%)}}
@keyframes ruleIn{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes ctaShine{0%,65%,100%{left:-50%}85%{left:140%}}
/* TABLET */
@media (max-width:1020px){
 .card-content{width:73%}.collection-card h3{font-size:clamp(12px,1.3vw,15px)}.card-description{font-size:clamp(9px,1vw,12px)}.red-button{padding:7px 12px}.collections-cta{grid-template-columns:28% 1fr auto}
}
@media (max-width:860px){
 .container{width:calc(100% - 48px)}.hero-inner{width:calc(100% - 62px)}
 .collections-hero{min-height:190px}.hero-scene{width:74%}
 .collections-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
 .collection-card{min-height:180px}.collection-card h3{font-size:17px}.card-description{font-size:12px}.eyebrow{font-size:9px}.red-button{font-size:11px}
 .collections-cta{min-height:122px;grid-template-columns:28% 1fr auto;padding-right:16px;gap:10px}.cta-message h2{font-size:20px}.cta-message p{font-size:11px}.cta-button{font-size:10px;padding:10px 12px}
}
/* PHONES */
@media(max-width:600px){
 .container,.hero-inner{width:calc(100% - 32px)}
 .collections-hero{min-height:240px}.hero-scene{width:100%;background-position:57% center;opacity:.67}
 .collections-hero::before{background:linear-gradient(90deg,#11090b 0%,rgba(16,8,10,.95) 34%,rgba(17,8,10,.47) 100%)}
 .hero-inner{padding-block:20px 25px}.breadcrumb{font-size:11px;margin-bottom:20px}
 .collections-hero h1{font-size:42px}.hero-lead{font-size:16px;max-width:320px;margin-top:12px}.hero-description{font-size:12px;max-width:320px;line-height:1.45}
 .hero-break{display:none}
 .featured{padding-top:22px}.section-heading{margin-bottom:13px}.section-heading h2{font-size:20px}
 .collections-grid{grid-template-columns:1fr;gap:13px}
 .collection-card{min-height:174px}.card-content{width:74%;padding:20px 0 17px 21px}.collection-card h3{font-size:19px;max-width:185px}.card-description{font-size:12px}.eyebrow{font-size:9px}.red-button{font-size:11px;padding:8px 15px}.card-photo{width:61%}
 .collections-cta{grid-template-columns:1fr;gap:0;align-items:start;margin-top:15px;padding:0 21px 20px;min-height:0}.cta-books{height:103px;margin:0 -21px 12px;background-size:cover;background-position:left 43%;width:calc(100% + 42px)}.cta-message h2{font-size:22px}.cta-message p{font-size:13px;line-height:1.4}.cta-button{margin-top:16px;width:max-content;font-size:11px;padding:11px 16px}
 .dialog-layout{grid-template-columns:1fr}.dialog-layout img{max-height:170px;min-height:0}.dialog-copy{padding:20px}.dialog-copy h2{font-size:23px}
}
@media(max-width:380px){.collection-card{min-height:181px}.card-content{width:78%;padding-left:15px}.collection-card h3{font-size:17px}.card-description{font-size:11px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition-duration:.01ms!important;scroll-behavior:auto!important}.reveal{opacity:1;transform:none}}