/* Collection V3: all display typography and vinyl groove imagery lifted from the approved homepage Collection artwork. */
:root{--cv3-cream:#f5ebd7;--cv3-navy:#071e2b;--cv3-copper:#b8562c}
.col3-main{overflow:hidden;background:#f5ebd7;color:#091e2b}
.col3-main *{box-sizing:border-box}
.col3-main a{text-decoration:none}
.col3-sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.col3-intro{background:#f5ebd7;position:relative;border-bottom:4px solid #a54f2d}
.col3-desktop-banner{display:block;width:100%;max-height:none}
.col3-desktop-banner img{display:block;width:100%;height:auto;aspect-ratio:1672 / 339;object-fit:cover}
.col3-mobile-banner{display:none}
.col3-catalog{position:relative;padding:24px clamp(20px,2.5vw,42px) 45px;background:#082a3a;isolation:isolate}
.col3-catalog:before{content:"";position:absolute;inset:0;opacity:.96;background-image:url('assets/collection-v3-edge-strip.webp');background-size:80px auto;background-position:left top;background-repeat:repeat-y;width:74px;pointer-events:none}
.col3-catalog:after{content:"";position:absolute;inset:0;opacity:.05;background:repeating-linear-gradient(97deg,transparent 0 3px,#f8dfb5 3px 4px,transparent 4px 17px);pointer-events:none;mix-blend-mode:screen}
.col3-paper{position:relative;max-width:1640px;margin:auto;padding:clamp(28px,3vw,51px) clamp(23px,3.2vw,59px) 21px;background:#f5ebd7;color:#0c2835;box-shadow:12px 13px 0 #03131f77,0 0 0 1px #9f896e;border:1px solid #d6b996;background-image:radial-gradient(#9b5b3230 .7px,transparent 1.2px),radial-gradient(#c5a77f25 .5px,transparent 1.5px),linear-gradient(110deg,#ffffff71,transparent 55%);background-size:6px 6px,9px 9px,100% 100%}
.col3-paper:before{content:"";inset:7px;position:absolute;z-index:0;pointer-events:none;box-shadow:inset 0 0 32px #b48a6055;border:1px solid #d1b7976b}
.col3-paper:after{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;background:repeating-linear-gradient(91deg,transparent 0 87px,#99745317 88px,transparent 89px 174px);opacity:.18}
.col3-catalog-label{position:relative;z-index:2;border-block:1px solid #806c58;padding:12px 2px;margin:0 1% clamp(25px,3vw,45px);display:flex;justify-content:space-between;gap:20px;color:#173b49;font:700 clamp(9px,.9vw,12px)/1.3 'Courier New',monospace;letter-spacing:.16em}
.col3-catalog-label span:last-child{color:#a9502d}
.col3-grid{position:relative;z-index:1;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));align-items:start;gap:clamp(22px,2vw,38px);padding:0 1%}
.col3-track{min-width:0;position:relative;transform:translateY(0);transition:transform .26s ease}
.col3-track:hover,.col3-track:focus-within{z-index:5;transform:translateY(-9px)}
.col3-album-link{position:relative;display:block;color:inherit}
.col3-album-link:focus-visible{outline:3px solid #a64b25;outline-offset:5px}
.col3-sleeve{display:block;position:relative;z-index:2;width:100%;border:4px solid #f5ebd7;aspect-ratio:342 / 345;box-shadow:0 9px 11px #12273245,0 0 0 1px #baa78c;transform:rotate(-.5deg);transition:transform .27s ease}
.col3-blues .col3-sleeve{transform:rotate(.65deg)}
.col3-classic-rock .col3-sleeve{transform:rotate(-.65deg)}
.col3-jazz-fusion .col3-sleeve{transform:rotate(.5deg)}
.col3-sleeve>img{width:100%;height:100%;object-fit:cover;display:block}
.col3-track:hover .col3-sleeve,.col3-track:focus-within .col3-sleeve{transform:rotate(0)}
.col3-vinyl{position:absolute;z-index:1;top:3%;right:-13%;width:95%;aspect-ratio:1;filter:drop-shadow(4px 5px 5px #0b1d27a6);transform:translateX(0) rotate(0deg);transition:transform .3s ease;pointer-events:none}
.col3-vinyl>img{width:100%;height:100%;display:block;object-fit:contain}
.col3-track:hover .col3-vinyl,.col3-track:focus-within .col3-vinyl{transform:translateX(11%) rotate(9deg)}
.col3-title-art{position:relative;z-index:3;display:block;margin:4px 0 0;width:100%;background:#f5ebd7}
.col3-title-art img{display:block;width:100%;height:auto;aspect-ratio:3.03/1;object-fit:cover;mix-blend-mode:multiply}
.col3-visit{position:relative;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:8px;margin:7px 0 0;padding:11px 8px;border-top:2px solid #8d7054;border-bottom:1px solid #c7b193;color:#224257;font:700 clamp(9px,.82vw,12px)/1.25 'Courier New',monospace;letter-spacing:.075em;transition:background .2s}
.col3-visit b{font:700 18px/1 Arial,sans-serif;color:var(--track-accent)}
.col3-track:hover .col3-visit,.col3-track:focus-within .col3-visit{background:#e3cbb0}
.col3-bottom{position:relative;z-index:2;border-top:1px solid #9e8368;margin:37px 1% 0;padding:16px 0 7px;display:flex;align-items:center;justify-content:space-between;gap:10px;font:700 10px/1.4 'Courier New',monospace;letter-spacing:.13em;color:#53616a}
.col3-bottom span:nth-child(2){font:700 12px/1.2 'Courier New',monospace;color:#b8592e;letter-spacing:.12em}
@media (max-width:1120px){.col3-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:42px clamp(24px,6vw,75px);padding:0 4%}.col3-catalog-label span:last-child{text-align:right}.col3-title-art{margin-top:6px}.col3-visit{font-size:12px}}
@media (max-width:760px){.col3-desktop-banner{display:none}.col3-mobile-banner{display:block;position:relative;overflow:hidden;padding:21px clamp(20px,5.4vw,39px) 31px;background:#f5ebd7;background-image:radial-gradient(#9c68452d .8px,transparent 1.2px),linear-gradient(114deg,#fffbef93,transparent 50%);background-size:7px 7px,100% 100%}.col3-mobile-banner:before{content:"";position:absolute;inset:0 auto 0 0;width:7px;background:linear-gradient(180deg,#0e3b52 0 35%,#d89b3d 35% 60%,#ae432f 60% 100%)}.col3-mobile-topline{display:flex;justify-content:space-between;gap:8px;border-bottom:1px solid #886e58;padding-bottom:10px;font:700 10px/1.2 'Courier New',monospace;letter-spacing:.16em;color:#1d4554}.col3-mobile-type{width:100%;height:auto;display:block;margin:16px 0 17px;mix-blend-mode:multiply}.col3-mobile-banner p{font:13px/1.55 'Courier New',monospace;color:#364957;margin:0 0 10px;max-width:520px}.col3-mobile-banner p:last-child{margin-bottom:0}.col3-catalog{padding:16px 13px 33px}.col3-catalog:before{width:13px;background-size:55px auto}.col3-paper{padding:25px 17px 16px}.col3-catalog-label{margin-bottom:26px}.col3-grid{gap:32px 22px;padding:0 2%}.col3-bottom span:nth-child(2){font-size:11px}}
@media (max-width:440px){.col3-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:25px 12px;padding:0}.col3-paper{padding:20px 12px 15px}.col3-sleeve{border-width:2px}.col3-vinyl{right:-11%;width:95%}.col3-title-art{margin:2px -4px 0;width:calc(100% + 8px)}.col3-visit{margin-top:2px;padding:9px 2px;letter-spacing:0;font-size:7.5px;border-top-width:1px}.col3-visit b{font-size:16px}.col3-catalog-label{font-size:8px;gap:5px;letter-spacing:.04em;margin:0 0 18px;padding:8px 2px}.col3-bottom{font-size:7px;margin-top:20px;padding-top:12px}.col3-bottom span:nth-child(2){font-size:9px}.col3-bottom span:last-child{display:none}}
@media(prefers-reduced-motion:reduce){.col3-main *{transition:none!important}}


/* V4 — INTRO EXPANSION / WORN ALBUM MATERIALS
   Reuses the original approved headline artwork and photographic vinyl;
   no new display font, mock record drawing, or changes to product sleeves. */
.col4-desktop-story{display:grid;grid-template-columns:minmax(0,1.58fr) minmax(270px,.42fr);min-height:272px;background:#f5ebd7;border-bottom:5px solid #b45429;overflow:hidden;position:relative}
.col4-story-paper{background-color:#f5ebd7;background-image:linear-gradient(95deg,#fff6e982,#f1dbc218),url('assets/collection-v4-paper-grain.webp');background-size:100% 100%,540px 270px;position:relative;padding:23px 5.8% 27px 8.2%;border-left:10px solid #113f54;box-shadow:inset 0 2px #927b5e, inset 0 -8px 16px #b59a7255}
.col4-story-paper:before{content:'';position:absolute;left:0;top:0;bottom:0;width:8px;background:url('assets/collection-v4-worn-edge.webp') center center / 90px auto repeat-y;pointer-events:none}
.col4-story-marker{font:700 clamp(10px,.78vw,13px)/1.3 'Courier New',monospace;letter-spacing:.19em;color:#9a502e;border-bottom:1px solid #9f8b74;padding-bottom:10px;margin-bottom:15px}
.col4-story-marker span{color:#385363}
.col4-story-paper p{font:clamp(13px,1.04vw,17px)/1.56 'Courier New',Courier,monospace;color:#28404d;max-width:86ch;margin:0 0 11px}
.col4-story-paper a,.col4-mobile-story a{color:#a34c2b;border-bottom:1px solid #a34c2b;text-decoration:none;font-weight:700}
.col4-story-paper a:hover,.col4-mobile-story a:hover{color:#123d4e;border-color:#123d4e}
.col4-story-paper .col4-story-close{font-weight:700;color:#173747;margin:14px 0 0}
.col4-story-vinyl{position:relative;overflow:hidden;background:#072333 url('assets/collection-v4-worn-navy.webp') center/cover repeat;color:#f4e8d3}
.col4-story-vinyl:before{content:'';inset:0;position:absolute;z-index:1;background-image:linear-gradient(145deg,transparent 40%,#061824bd 100%);pointer-events:none}
.col4-story-vinyl img{position:absolute;top:-38%;right:-23%;width:126%;max-width:none;height:auto;filter:drop-shadow(-10px 6px 6px #0008)}
.col4-mobile-story{display:none}
@media(max-width:1000px){
  .col3-desktop-banner,.col4-desktop-story{display:none!important}
  .col3-mobile-banner{display:block}
  .col3-mobile-banner{background-color:#f2e3cb;background-image:linear-gradient(102deg,#fff7e946,#d6b28e25),url('assets/collection-v4-paper-grain.webp');background-size:100% 100%,460px auto;border-inline:7px solid #0d3345;border-bottom:5px solid #ac512d;box-shadow:inset 0 0 0 2px #c6aa86,inset 0 0 42px #9d775650;padding:23px clamp(22px,6.2vw,52px) 29px}
  .col3-mobile-banner:before{width:9px;left:0;z-index:1;background-image:url('assets/collection-v4-worn-edge.webp');background-position:left center;background-size:90px auto}
  .col3-mobile-banner:after{content:'';position:absolute;right:0;top:0;bottom:0;width:8px;background:url('assets/collection-v4-worn-navy.webp') right center/100px auto repeat-y;pointer-events:none}
  .col3-mobile-topline,.col3-mobile-type,.col4-mobile-story{position:relative;z-index:2}
  .col4-mobile-story{display:block}
  .col3-mobile-banner .col4-mobile-story p{font:clamp(13px,1.72vw,16px)/1.64 'Courier New',Courier,monospace;color:#283e4b;margin:0 0 15px;max-width:67ch}
  .col3-mobile-banner .col4-mobile-story p.col4-mobile-close{font-weight:700;color:#123444;border-top:1px solid #a78c71;padding-top:12px;margin:16px 0 0}
  .col3-catalog{background-color:#082939;background-image:linear-gradient(#092533e6,#071e2ad9),url('assets/collection-v4-worn-navy.webp');background-size:100% 100%,180px 100%}
  .col3-paper{background-color:#f4e4cd;background-image:linear-gradient(120deg,#fff9ee34,#c9a17d13),url('assets/collection-v4-paper-grain.webp');background-size:100% 100%,490px auto;box-shadow:inset 0 0 30px #a785635e,6px 8px 0 #0005,0 0 0 2px #bc9870}
  .col3-catalog:before{background-image:url('assets/collection-v4-worn-edge.webp')}
  .col3-catalog:after{background-image:url('assets/collection-v4-worn-navy.webp');background-size:100px auto;background-position:right;opacity:.4;left:auto;right:0;width:14px;mix-blend-mode:normal;z-index:1}
  .col3-title-art{background:#f4e4cd}
}
@media(min-width:761px) and (max-width:1000px){.col3-mobile-banner{padding:36px 8% 44px}.col3-mobile-type{max-width:720px}.col3-catalog{padding:22px 20px 34px}}

/* V5 — repair the introductory sleeve as ONE art direction.
   Desktop headline and its single photo-real vinyl remain the original V3 homepage image.
   Story is a full-width continuation of that worn paper, NOT a second card/record.
   The four interactive sleeves and vinyl hover animation above remain unchanged. */
@media (min-width:1001px){
  .col4-desktop-story{display:block!important;min-height:0;border:0;border-bottom:6px solid #b45429;position:relative;isolation:isolate;background:#f5ebd7;overflow:hidden}
  .col4-story-paper{margin:0;position:relative;border:0;box-shadow:none;padding:22px 8.4% 35px 8.05%;background-color:#f5ebd7;background-image:linear-gradient(96deg,#fff8ec62,#e9d2b526),url('assets/collection-v4-paper-grain.webp');background-size:100% 100%,620px 280px}
  .col4-story-paper:before{position:absolute;inset:0 auto 0 0;content:'';display:block;width:5.35%;background:url('assets/collection-v4-worn-edge.webp') left center / 100% auto repeat-y;pointer-events:none}
  .col4-story-marker{font-size:12px;letter-spacing:.17em;border:0;border-top:1px solid #957c60;border-bottom:1px solid #957c60;margin:0 0 15px;padding:10px 0;color:#9d522c}
  .col5-story-columns{display:grid;grid-template-columns:1fr 1fr;gap:clamp(26px,4.5vw,76px)}
  .col5-story-columns p{font:clamp(13.5px,1vw,17px)/1.64 'Courier New',Courier,monospace;max-width:none;margin:0;color:#344b55}
  .col4-story-paper .col4-story-close{font:700 clamp(12px,.98vw,17px)/1.5 'Courier New',Courier,monospace;max-width:none;margin:17px 0 0;border-top:1px solid #c0a689;padding-top:13px;color:#133949}
  .col4-story-vinyl{display:none!important}
}
@media (max-width:1000px){
  .col5-mobile-record{display:block;position:relative;z-index:2;margin:5px 0 22px;overflow:hidden;border:4px solid #eee2cf;outline:1px solid #af9171;background:#0b2935;box-shadow:5px 7px 0 #a685644d,0 6px 18px #24313a26;aspect-ratio:552/272}
  .col5-mobile-record img{display:block;width:100%;height:100%;object-fit:cover;object-position:center 24%}
  .col3-mobile-banner .col4-mobile-story{border-top:1px solid #b79a7a;padding-top:13px}
}
@media (max-width:480px){
  .col5-mobile-record{margin:6px 0 18px;aspect-ratio:552/286}
}
@media (min-width:761px) and (max-width:1000px){
  .col3-mobile-topline{display:flex;justify-content:space-between;gap:12px;border-bottom:1px solid #886e58;padding-bottom:12px;margin-bottom:14px;font:700 11px/1.3 'Courier New',monospace;letter-spacing:.14em;color:#1d4554}
  .col3-mobile-type{width:100%;max-width:720px;margin:14px 0 18px}
}
