.shop-page { background: var(--paper); }
.site-nav__shop.is-current { color: var(--sun); }
.shop-hero { overflow: hidden; background: var(--ink-deep); color: var(--white); }
.shop-hero__grid { min-height: 610px; display: grid; grid-template-columns: minmax(0,1.08fr) minmax(320px,.72fr); gap: clamp(3rem,7vw,7rem); align-items: center; padding-block: clamp(5rem,9vw,8rem); }
.shop-hero__copy h1 { max-width: 980px; margin: 0; font-family: var(--display); font-size: clamp(4rem,8vw,8rem); line-height: .82; letter-spacing: -.065em; text-transform: uppercase; }
.shop-hero__copy h1 em { color: var(--sun); font-family: var(--serif); font-weight: 400; text-transform: none; }
.shop-hero__copy > p:not(.eyebrow) { max-width: 650px; margin-top: 1.5rem; color: rgba(255,255,255,.72); font-size: clamp(1rem,1.5vw,1.2rem); line-height: 1.7; }
.shop-hero__badges { margin-top: 1.8rem; display: flex; flex-wrap: wrap; gap: .65rem; }
.shop-hero__badges span { padding: .55rem .75rem; border: 1px solid rgba(255,255,255,.2); border-radius: 999px; color: rgba(255,255,255,.72); font-size: .68rem; font-weight: 900; letter-spacing: .09em; text-transform: uppercase; }
.shop-hero__art { min-height: 390px; position: relative; }
.shop-poster { position: absolute; width: 220px; height: 300px; padding: 1.5rem; border: 2px solid var(--ink); box-shadow: 16px 16px 0 rgba(0,0,0,.18); display: flex; flex-direction: column; justify-content: flex-end; }
.shop-poster b { font-family: var(--display); font-size: 2.4rem; line-height: .86; }
.shop-poster span { margin-top: .6rem; font-size: .7rem; font-weight: 900; letter-spacing: .14em; }
.shop-poster--sun { right: 7%; top: 0; background: var(--sun); color: var(--ink); transform: rotate(7deg); }
.shop-poster--aqua { left: 2%; bottom: 0; background: #71a7c8; color: var(--ink); transform: rotate(-7deg); }
.shop-notice { margin-bottom:1.2rem; padding:1rem 1.1rem; border-left:5px solid #71a7c8; background:#eef8fa; color:var(--ink); font-weight:800; line-height:1.5; }
.shop-notice[data-type="success"] { border-color:#2f8f5b; background:#edf8f1; }
.shop-notice[data-type="error"] { border-color:var(--coral); background:#fff0eb; color:var(--coral-deep); }
.shop-catalog__head { display: grid; grid-template-columns: minmax(0,1fr) minmax(300px,.55fr); gap: 3rem 6rem; align-items: end; }
.shop-catalog__head h2 { margin: 0; font-family: var(--display); font-size: clamp(3rem,6vw,6rem); line-height: .88; letter-spacing: -.055em; text-transform: uppercase; }
.shop-catalog__head > p { margin: 0; color: rgba(7,63,66,.65); line-height: 1.7; }
.shop-grid { margin-top: 3rem; display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1rem; }
.shop-card { overflow: hidden; border: 1px solid rgba(7,63,66,.15); background: #fff; }
.shop-card__art { height: 260px; position: relative; display: grid; place-items: center; overflow: hidden; }
.shop-card__art::after { content: "COMPLEXE HAVANA"; position: absolute; left: 1rem; bottom: 1rem; padding: .32rem .5rem; border-radius: 999px; background: rgba(255,255,255,.82); color: var(--ink); font-size: .55rem; font-weight: 900; letter-spacing: .08em; }
.shop-art { position: relative; filter: drop-shadow(0 18px 24px rgba(7,63,66,.18)); }
.shop-art b { position: absolute; inset: 0; display: grid; place-items: center; font-family: var(--display); color: var(--ink); }
.shop-art--shirt { width: 150px; height: 155px; border-radius: 28% 28% 14% 14%; background: #fff8e8; }
.shop-art--hoodie { width: 160px; height: 160px; border-radius: 30% 30% 15% 15%; background: var(--ink-deep); } .shop-art--hoodie b{color:var(--sun)}
.shop-art--cap { width: 170px; height: 90px; border-radius: 75% 75% 25% 25%; background: #fff8e8; }
.shop-art--towel { width: 115px; height: 175px; border-radius: 8px; background: repeating-linear-gradient(135deg,#fff8e8 0 24px,#71a7c8 24px 48px,#e86f4b 48px 72px,#f1a33c 72px 96px); transform:rotate(3deg); }
.shop-art--tote { width: 145px; height: 150px; border-radius: 10px; background:#fff8e8; }
.shop-art--tumbler { width: 88px; height: 165px; border-radius:14px 14px 22px 22px; background:#fff8e8; }
.shop-card__body { padding: 1.2rem; }
.shop-card__top { display:flex; justify-content:space-between; align-items:flex-start; gap:1rem; }
.shop-card__category { display:block; margin-bottom:.35rem; color:var(--coral-deep); font-size:.62rem; font-weight:900; letter-spacing:.12em; text-transform:uppercase; }
.shop-card h3 { margin:0; font-family:var(--serif); font-size:1.65rem; font-weight:400; line-height:1; }
.shop-card__price { flex:0 0 auto; font-weight:900; }
.shop-card__description { min-height:3.2em; margin:1rem 0 0; color:rgba(7,63,66,.63); font-size:.88rem; line-height:1.6; }
.shop-card__variants { margin-top:1rem; display:flex; flex-wrap:wrap; gap:.4rem; }
.shop-card__variants button { min-width:38px; padding:.5rem .6rem; border:1px solid rgba(7,63,66,.18); background:#fff; color:var(--ink); cursor:pointer; font-weight:900; }
.shop-card__variants button.is-active { background:var(--ink); color:#fff; border-color:var(--ink); }
.shop-card__add { width:100%; margin-top:1rem; min-height:44px; border:0; background:var(--ink); color:#fff; cursor:pointer; display:flex; justify-content:space-between; align-items:center; padding:.8rem 1rem; font-weight:900; }
.shop-account { background:var(--sun); }
.shop-account__grid { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:3rem 6rem; align-items:end; }
.shop-account h2 { max-width:900px; margin:0; font-family:var(--display); font-size:clamp(3rem,6vw,6rem); line-height:.88; letter-spacing:-.055em; text-transform:uppercase; }
.shop-account p:not(.eyebrow) { max-width:650px; margin-top:1rem; color:rgba(7,63,66,.68); line-height:1.7; }
.shop-cart-fab { position:fixed; right:1rem; bottom:1rem; z-index:45; min-height:50px; display:flex; align-items:center; gap:.55rem; padding:.75rem 1rem; border:1px solid rgba(7,63,66,.2); border-radius:999px; background:var(--sun); color:var(--ink); box-shadow:0 12px 30px rgba(7,63,66,.2); cursor:pointer; font-weight:900; }
.shop-cart-fab strong { min-width:20px; height:20px; display:grid; place-items:center; border-radius:999px; background:var(--coral); color:#fff; font-size:.68rem; }
.shop-cart[hidden] { display:none; }
.shop-cart { position:fixed; inset:0; z-index:100; }
.shop-cart__backdrop { position:absolute; inset:0; width:100%; border:0; background:rgba(3,30,32,.58); cursor:pointer; }
.shop-cart__panel { position:absolute; right:0; top:0; width:min(480px,100%); height:100%; display:flex; flex-direction:column; background:#fffdf8; box-shadow:-20px 0 60px rgba(0,0,0,.18); }
.shop-cart__head { padding:1.25rem; display:flex; justify-content:space-between; align-items:center; border-bottom:1px solid rgba(7,63,66,.12); }
.shop-cart__head p { margin:0 0 .2rem; color:var(--coral-deep); font-size:.62rem; font-weight:900; letter-spacing:.12em; text-transform:uppercase; }
.shop-cart__head h2 { margin:0; font-family:var(--display); font-size:2rem; text-transform:uppercase; }
.shop-cart__head button { width:40px; height:40px; border:1px solid rgba(7,63,66,.15); border-radius:50%; background:#fff; cursor:pointer; font-size:1.6rem; }
.shop-cart__body { flex:1; overflow:auto; padding:1rem 1.25rem; }
.shop-cart__empty { min-height:250px; display:grid; place-items:center; color:rgba(7,63,66,.55); text-align:center; }
.shop-cart-line { display:grid; grid-template-columns:60px 1fr auto; gap:.8rem; padding:.8rem 0; border-bottom:1px solid rgba(7,63,66,.1); }
.shop-cart-line__swatch { width:60px; height:60px; border-radius:10px; }
.shop-cart-line strong { display:block; font-size:.92rem; }
.shop-cart-line small { color:rgba(7,63,66,.5); }
.shop-cart-line__qty { margin-top:.5rem; display:inline-flex; align-items:center; border:1px solid rgba(7,63,66,.15); }
.shop-cart-line__qty button { width:28px; height:28px; border:0; background:#fff; cursor:pointer; }
.shop-cart-line__qty span { min-width:28px; text-align:center; font-size:.75rem; font-weight:900; }
.shop-cart__foot { padding:1rem 1.25rem 1.4rem; border-top:1px solid rgba(7,63,66,.12); background:#fff; }
.shop-cart__total { display:flex; align-items:center; justify-content:space-between; }
.shop-cart__total strong { font-size:1.6rem; }
.shop-cart__foot > p { margin:.35rem 0 0; color:rgba(7,63,66,.5); font-size:.72rem; }
.shop-cart__checkout { width:100%; margin-top:1rem; }
.shop-cart__continue { width:100%; margin-top:.55rem; border:0; background:transparent; color:rgba(7,63,66,.5); cursor:pointer; font-weight:800; }
@media (max-width:900px){.shop-hero__grid,.shop-catalog__head,.shop-account__grid{grid-template-columns:1fr}.shop-hero__art{display:none}.shop-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.shop-account__grid .button{justify-self:start}}
@media (max-width:560px){.shop-hero__grid{min-height:0;padding-block:4rem}.shop-hero__copy h1{font-size:clamp(3.4rem,16vw,5rem)}.shop-grid{grid-template-columns:1fr}.shop-catalog__head h2,.shop-account h2{font-size:clamp(2.8rem,13vw,4.1rem)}.shop-cart-fab{bottom:4.8rem}}