/* Labellissimo Collections */
.lbc{
  --maroon:#5A0F1F; --maroon-deep:#3F0A16; --navy:#0E1A3A; --soft:#4B5573; --line:#E8E1D2; --mat:#F6F1E7;
  background:#fff;color:var(--navy);width:100%;box-sizing:border-box;overflow:hidden;
  font-family:'Hanken Grotesk',system-ui,-apple-system,'Segoe UI',sans-serif;line-height:1.6;-webkit-font-smoothing:antialiased;
  padding:clamp(36px,4.6vw,68px) 0;
}
.lbc *{box-sizing:border-box}
.lbc-wrap{max-width:1380px;margin:0 auto;padding:0 clamp(20px,4vw,56px);container-type:inline-size}

.lbc-head{display:grid;grid-template-columns:7fr 5fr;gap:clamp(20px,4vw,72px);align-items:end;margin-bottom:clamp(24px,3vw,40px)}
.lbc-h{margin:0;font-weight:300;letter-spacing:-.038em;line-height:1.05;font-size:clamp(34px,4.6vw,66px);color:var(--navy)}
.lbc-h .ln{display:block;overflow:hidden;padding-bottom:.12em}
.lbc-h .ln>span{display:block;text-wrap:balance}
.lbc-h em{font-style:normal;color:var(--maroon)}
.lbc-rule{display:block;height:2px;width:72px;background:var(--maroon);margin-top:14px;transform-origin:left}
.lbc-sub{margin:0;color:var(--soft);font-size:clamp(15.5px,1.2vw,17.5px);line-height:1.65;max-width:50ch}

.lbc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(12px,1.6vw,24px)}
.lbc-card{position:relative;display:block;aspect-ratio:4/5.2;overflow:hidden;background:var(--c,#4A0E1B);color:#fff;text-decoration:none;outline-offset:4px}
.lbc-card:focus-visible{outline:2px solid var(--maroon)}
.lbc-img{position:absolute;inset:0;display:block}
.lbc-img img{width:100%;height:100%;object-fit:cover;display:block;transition:transform 1.4s cubic-bezier(.2,.7,.2,1)}
.lbc-card:hover .lbc-img img,.lbc-card:focus-visible .lbc-img img{transform:scale(1.07)}
.lbc-card::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(0deg,rgba(63,10,22,.92) 0%,rgba(63,10,22,.72) 26%,rgba(63,10,22,.22) 52%,rgba(63,10,22,0) 70%);transition:opacity .6s ease}
.lbc-card::after{content:"";position:absolute;inset:16px;z-index:2;border:1px solid rgba(255,255,255,0);pointer-events:none;transition:border-color .6s ease,inset .7s cubic-bezier(.2,.7,.2,1)}
.lbc-card:hover::after,.lbc-card:focus-visible::after{border-color:rgba(255,255,255,.55);inset:12px}
.lbc-count{position:absolute;left:18px;top:18px;z-index:3;background:#fff;color:var(--maroon-deep);font-size:13px;font-weight:500;padding:4px 12px}
.lbc-body{position:absolute;left:0;right:0;bottom:0;z-index:3;display:block;padding:clamp(22px,2.4vw,36px);transition:transform .7s cubic-bezier(.2,.7,.2,1)}
.lbc-card:hover .lbc-body,.lbc-card:focus-visible .lbc-body{transform:translateY(-6px)}
.lbc-name{display:block;font-weight:300;letter-spacing:-.03em;line-height:1.04;font-size:clamp(30px,3vw,46px);color:#fff}
.lbc-desc{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;margin-top:12px;font-size:clamp(14.5px,1.05vw,16px);line-height:1.6;color:rgba(255,255,255,.9);max-width:38ch}
.lbc-cta span{white-space:nowrap}
.lbc-cta{display:inline-flex;align-items:center;gap:14px;margin-top:20px;font-size:15px;font-weight:500;color:#fff}
.lbc-cta i{width:42px;height:42px;border:1px solid rgba(255,255,255,.7);border-radius:50%;display:flex;align-items:center;justify-content:center;transition:background .45s,transform .5s cubic-bezier(.2,.7,.2,1),border-color .45s}
.lbc-cta svg{width:18px;height:18px;fill:none;stroke:#fff;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;transition:stroke .45s}
.lbc-card:hover .lbc-cta i,.lbc-card:focus-visible .lbc-cta i{background:#fff;border-color:#fff;transform:translateX(6px)}
.lbc-card:hover .lbc-cta svg,.lbc-card:focus-visible .lbc-cta svg{stroke:var(--maroon-deep)}
.lbc-hint{border:1px dashed var(--maroon);background:var(--mat);color:var(--maroon-deep);padding:14px 18px;font-size:14px}

/* motion, only when JavaScript runs */
.lbc-js .lbc-h .ln>span{transform:translateY(112%);transition:transform 1s cubic-bezier(.2,.7,.2,1) .15s}
.lbc-js .lbc-rule{transform:scaleX(0);transition:transform 1s cubic-bezier(.2,.7,.2,1) .7s}
.lbc-js .lbc-sub{opacity:0;transform:translateY(14px);transition:opacity .9s ease .5s,transform .9s ease .5s}
.lbc-js .lbc-card{clip-path:inset(100% 0 0 0);transition:clip-path 1.3s cubic-bezier(.77,0,.18,1);transition-delay:calc(var(--i) * .14s + .35s)}
.lbc-js .lbc-img img{transform:scale(1.18)}
.lbc-js .lbc-body,.lbc-js .lbc-count{opacity:0}
.lbc-js .lbc-body{transform:translateY(22px);transition:opacity .9s ease,transform .9s cubic-bezier(.2,.7,.2,1);transition-delay:calc(var(--i) * .14s + .95s)}
.lbc-js .lbc-count{transition:opacity .9s ease;transition-delay:calc(var(--i) * .14s + 1.1s)}
.lbc.in .lbc-h .ln>span{transform:none}
.lbc.in .lbc-rule{transform:scaleX(1)}
.lbc.in .lbc-sub{opacity:1;transform:none}
.lbc.in .lbc-card{clip-path:inset(0 0 0 0)}
.lbc.in .lbc-img img{transform:scale(1.02)}
.lbc.in .lbc-body,.lbc.in .lbc-count{opacity:1}
.lbc.in .lbc-body{transform:none}
.lbc.in .lbc-card:hover .lbc-img img,.lbc.in .lbc-card:focus-visible .lbc-img img{transform:scale(1.07)}
.lbc.in .lbc-card:hover .lbc-body,.lbc.in .lbc-card:focus-visible .lbc-body{transform:translateY(-6px);transition-delay:0s}

/* Layout follows the width of the space the row sits in, not only the screen. */
@container (max-width:900px){.lbc-head{grid-template-columns:1fr;gap:14px}}
@container (max-width:780px){
  .lbc-grid{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;gap:12px;margin:0 calc(-1 * clamp(20px,4vw,56px));padding:0 clamp(20px,4vw,56px)}
  .lbc-grid::-webkit-scrollbar{display:none}
  .lbc-card{flex:0 0 78%;scroll-snap-align:center;aspect-ratio:4/5.4}
}
@media (prefers-reduced-motion:reduce){
  .lbc *,.lbc *::before,.lbc *::after{transition:none !important;animation:none !important}
  .lbc-js .lbc-h .ln>span,.lbc-js .lbc-sub,.lbc-js .lbc-body,.lbc-js .lbc-count,.lbc-js .lbc-rule{transform:none;opacity:1}
  .lbc-js .lbc-card{clip-path:none}
  .lbc-js .lbc-img img{transform:none}
}

/* =====================================================================
   PANELS: the default layout. Tall full-photo panels; the active one opens wide.
   ===================================================================== */
.lcp{display:flex;gap:10px;height:clamp(480px,47vw,700px)}
.lcp-p{position:relative;flex:1 1 0;min-width:0;overflow:hidden;display:block;background:var(--c,#4A0E1B);color:#fff;text-decoration:none;outline-offset:3px;transition:flex-grow 1s cubic-bezier(.2,.7,.2,1)}
.lcp-p:focus-visible{outline:2px solid var(--maroon)}
.lcp-p.is-active{flex-grow:6.2}
.lcp-img{position:absolute;inset:0;display:block}
.lcp-img img{width:100%;height:100%;object-fit:cover;object-position:50% 30%;display:block;transform:scale(1.14);transition:transform 2.6s cubic-bezier(.2,.7,.2,1),filter .8s ease}
.lcp-p.is-active .lcp-img img{transform:scale(1.02)}
.lcp-p:not(.is-active) .lcp-img img{filter:saturate(.8) brightness(.82)}
.lcp-p:not(.is-active):hover .lcp-img img{filter:saturate(1) brightness(.95);transform:scale(1.18)}
.lcp-shade{position:absolute;inset:0;pointer-events:none;background:linear-gradient(0deg,rgba(14,26,58,.82) 0%,rgba(14,26,58,.46) 28%,rgba(14,26,58,0) 58%);transition:opacity .8s ease}
.lcp-p:not(.is-active) .lcp-shade{background:linear-gradient(0deg,rgba(63,10,22,.74) 0%,rgba(63,10,22,.26) 55%,rgba(63,10,22,.18) 100%)}

.lcp-idx{position:absolute;left:clamp(16px,1.8vw,26px);top:clamp(16px,1.8vw,24px);z-index:3;display:flex;align-items:center;gap:12px;font-size:14px;font-weight:500;letter-spacing:.04em}
.lcp-idx::after{content:"";display:block;width:0;height:1px;background:#fff;transition:width .9s cubic-bezier(.2,.7,.2,1) .3s}
.lcp-p.is-active .lcp-idx::after{width:56px}
.lcp-count{position:absolute;right:clamp(16px,1.8vw,24px);top:clamp(14px,1.6vw,20px);z-index:3;background:#fff;color:var(--maroon-deep);font-size:13px;font-weight:500;padding:4px 12px;opacity:0;transform:translateY(-6px);transition:opacity .5s ease,transform .7s cubic-bezier(.2,.7,.2,1)}
.lcp-p.is-active .lcp-count{opacity:1;transform:none;transition-delay:.45s}

.lcp-vert{position:absolute;left:clamp(12px,1.4vw,20px);bottom:clamp(18px,2vw,28px);z-index:3;writing-mode:vertical-rl;transform:rotate(180deg);font-weight:300;letter-spacing:-.01em;line-height:1;white-space:nowrap;font-size:clamp(22px,2.1vw,32px);transition:opacity .45s ease}
.lcp-p.is-active .lcp-vert{opacity:0}
.lcp-plus{position:absolute;right:50%;transform:translateX(50%);bottom:clamp(18px,2vw,28px);z-index:3;width:36px;height:36px;border:1px solid rgba(255,255,255,.65);border-radius:50%;display:none;align-items:center;justify-content:center;transition:opacity .4s}
.lcp-plus svg{width:16px;height:16px;fill:none;stroke:#fff;stroke-width:1.5;stroke-linecap:round}
.lcp-p.is-active .lcp-plus{opacity:0}

.lcp-body{position:absolute;left:0;right:0;bottom:0;z-index:3;display:block;padding:clamp(24px,3vw,46px);opacity:0;transform:translateY(26px);transition:opacity .35s ease,transform .5s ease;pointer-events:none;min-width:min(520px,100%)}
.lcp-p.is-active .lcp-body{opacity:1;transform:none;transition:opacity .8s ease .38s,transform 1s cubic-bezier(.2,.7,.2,1) .38s}
.lcp-name{display:block;font-weight:300;letter-spacing:-.045em;line-height:.98;font-size:clamp(42px,5.6vw,92px);color:#fff}
.lcp-desc{display:block;margin-top:clamp(12px,1.4vw,20px);font-size:clamp(15px,1.2vw,18px);line-height:1.6;color:rgba(255,255,255,.92);max-width:44ch}
.lcp-cta{display:inline-flex;align-items:center;gap:16px;margin-top:clamp(18px,2vw,28px);font-size:16px;font-weight:500;color:#fff}
.lcp-cta span{white-space:nowrap}
.lcp-cta i{width:50px;height:50px;border:1px solid rgba(255,255,255,.75);border-radius:50%;display:flex;align-items:center;justify-content:center;transition:background .45s,transform .5s cubic-bezier(.2,.7,.2,1)}
.lcp-cta svg{width:20px;height:20px;fill:none;stroke:#fff;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;transition:stroke .45s}
.lcp-p:hover .lcp-cta i,.lcp-p:focus-visible .lcp-cta i{background:#fff;transform:translateX(6px)}
.lcp-p:hover .lcp-cta svg,.lcp-p:focus-visible .lcp-cta svg{stroke:var(--maroon-deep)}

/* thin progress line under the open panel: shows when the next one will open */
.lcp-bar{position:absolute;left:0;right:0;bottom:0;height:3px;z-index:4;background:rgba(255,255,255,.18);opacity:0;transition:opacity .4s}
.lcp-bar i{display:block;height:100%;width:0;background:#fff}
.lcp-p.is-active .lcp-bar{opacity:1}
.lcp-run .lcp-p.is-active .lcp-bar i{animation:lcpBar var(--auto,7s) linear forwards}
.lcp:hover .lcp-bar i,.lcp:focus-within .lcp-bar i{animation-play-state:paused}
@keyframes lcpBar{from{width:0}to{width:100%}}

/* entrance */
.lbc-js .lcp-p{clip-path:inset(0 0 100% 0)}
.lbc.in .lcp-p{animation:lcpIn 1.3s cubic-bezier(.77,0,.18,1) both;animation-delay:calc(var(--i) * .13s + .3s)}
@keyframes lcpIn{from{clip-path:inset(0 0 100% 0)}to{clip-path:inset(0 0 0 0)}}

/* narrow spaces and phones: a stack where the chosen collection opens downward */
@container (max-width:780px){ .lcp-unused{display:none} }
@media (prefers-reduced-motion:reduce){
  .lcp-p,.lcp-p *{transition:none !important;animation:none !important}
  .lbc-js .lcp-p{clip-path:none}
  .lcp-p.is-active .lcp-body{opacity:1;transform:none}
}

/* ---------- all sizes ---------- */
.lbc,.lcp-p{position:relative}
.lbc .screen-reader-text{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
@media (max-width:380px){.lbc-wrap{padding:0 14px}.lbc-h{font-size:32px}.lcp-name{font-size:38px}}
@media (max-height:500px) and (orientation:landscape){.lcp{height:min(78vh,420px)}}

@media (min-width:1900px){.lbc-wrap{max-width:1720px}.lcp{height:min(44vw,820px)}}
@media (min-width:2400px){.lbc-wrap{max-width:2060px}.lcp{height:min(42vw,980px)}}

/* ---------- the row is the container; panels can run edge to edge ---------- */
.lbc{container-type:inline-size}
.lbc-bleed .lcp{gap:6px;padding:0}
.lbc-bleed{width:100%}
.lbc .lbc-wrap:empty{display:none}
.lbc .lbc-head{margin-bottom:clamp(22px,3vw,40px)}

/* ---------- phones and narrow spaces: every collection is a full card, one under the other. Nothing hides. ---------- */
@container (max-width:780px){
  .lcp{display:grid;grid-template-columns:1fr;gap:6px;height:auto}
  .lcp .lcp-p,.lcp .lcp-p.is-active{flex:none;height:auto;aspect-ratio:4/5;min-height:340px;max-height:82vh;transition:none}
  .lcp .lcp-img img,.lcp .lcp-p:not(.is-active) .lcp-img img{transform:scale(1.03);filter:none}
  .lcp .lcp-shade,.lcp .lcp-p:not(.is-active) .lcp-shade{background:linear-gradient(0deg,rgba(14,26,58,.86) 0%,rgba(14,26,58,.5) 34%,rgba(14,26,58,0) 66%)}
  .lcp .lcp-vert,.lcp .lcp-plus,.lcp .lcp-bar{display:none}
  .lcp .lcp-idx{display:flex}
  .lcp .lcp-idx::after{width:40px}
  .lcp .lcp-body{opacity:1;transform:none;padding:clamp(20px,6vw,34px);pointer-events:auto}
  .lcp .lcp-name{font-size:clamp(40px,12.5vw,64px)}
  .lcp .lcp-desc{font-size:15.5px;max-width:34ch}
  .lbc-js .lcp-p{clip-path:none}
  .lbc.in .lcp-p{animation:none}
}