/* =========================================================
   Footloose 0.7.0 — home: brand worlds with real products, more worlds, category tiles
   ========================================================= */

/* worlds: products collage inside the media side */
.fl-world__media:has(.fl-stack){min-height:340px}
.fl-world__art.is-soft{opacity:.55}
.fl-world .fl-stack{inset:8% 4% 10%}
.fl-world .fl-stk{box-shadow:0 14px 34px rgba(0,0,0,.18)}
@media (min-width:900px){
  .fl-world__media:has(.fl-stack){min-height:0}
  .fl-world .fl-stack{inset:10% 6% 12%}
}
.fl-world--page .fl-world__media:has(.fl-stack){min-height:360px}

/* names of the newer worlds (text, no logos) */
.fl-world__name--sprox,.fl-camp__brand--sprox{text-transform:uppercase;font-stretch:75%;letter-spacing:.02em}
.fl-world__name--leomil,.fl-camp__brand--leomil{text-transform:uppercase;font-stretch:100%;letter-spacing:.12em;font-weight:800}
.fl-world__name--cubs,.fl-camp__brand--cubs{text-transform:uppercase;font-stretch:62%;letter-spacing:.01em}
@media (min-width:900px){.fl-world__name--leomil{font-size:40px}}

/* world styles: bold (Sprox) and wave (Leomil) */
.fl-world--bold .fl-world__chip,.fl-world--wave .fl-world__chip{border-radius:0}
.fl-world--wave .fl-world__chip{background:transparent;color:var(--w-ink);border-color:var(--w-ink)}
.fl .fl-world--wave .fl-world__chip:hover{background:var(--w-ink);color:var(--w-bg)}
.fl-art-wave,.fl-art-bold{position:absolute;inset:0;width:100%;height:100%}
.fl-art-wave path{fill:rgba(255,255,255,.08)}.fl-art-wave path.b{fill:rgba(255,255,255,.14)}
.fl-art-bold path{fill:rgba(0,0,0,.08)}.fl-art-bold path.b{fill:rgba(0,0,0,.14)}
.fl-world__art .fl-art-wave,.fl-world__art .fl-art-bold{height:100%}
.fl-camp__art--wave,.fl-camp__art--bold{position:absolute;inset:0}

/* world strip (when the brand has its own banner photo) */
.fl-wstrip{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;width:100%;max-width:520px}
.fl .fl-wstrip__i{display:flex;flex-direction:column;background:#fff;color:#111;text-decoration:none;min-width:0}
.fl .fl-wstrip__i:hover{color:#111;box-shadow:0 8px 20px rgba(0,0,0,.18)}
.fl-wstrip__img{display:block;aspect-ratio:1/1;background:#F5F5F4;position:relative;overflow:hidden}
.fl-wstrip__img img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;padding:8%;mix-blend-mode:multiply}
.fl-wstrip__b{display:flex;flex-direction:column;padding:6px 7px 8px;min-width:0;font-size:11.5px;line-height:1.3}
.fl-wstrip__b b{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fl-wstrip__b span{font-weight:700}
.fl-wstrip__b del{display:none}.fl-wstrip__b ins{text-decoration:none;color:var(--fl-red)}
@media (max-width:520px){.fl-wstrip{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* five worlds on the home: big blocks for the first two, a 3-up row for the rest on desktop */
@media (min-width:1100px){
  .fl-sec.fl-worlds{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:16px}
  .fl-sec.fl-worlds>.fl-world{grid-column:span 6}
  .fl-sec.fl-worlds>.fl-world:nth-child(n+3){grid-column:span 2;grid-template-columns:1fr;grid-template-rows:auto 300px;min-height:0}
  .fl-sec.fl-worlds>.fl-world:nth-child(n+3) .fl-world__txt{order:0;padding:32px 30px 24px;justify-content:flex-start;gap:12px}
  .fl-sec.fl-worlds>.fl-world:nth-child(n+3) .fl-world__title{font-size:52px}
  .fl-sec.fl-worlds>.fl-world:nth-child(n+3) .fl-world__name{font-size:34px}
  .fl-sec.fl-worlds>.fl-world:nth-child(n+3) .fl-world__text{font-size:14px}
  .fl-sec.fl-worlds>.fl-world:nth-child(n+3) .fl-world__ghost{font-size:150px}
  .fl-sec.fl-worlds>.fl-world:nth-child(n+3) .fl-stk__b b,.fl-sec.fl-worlds>.fl-world:nth-child(n+3) .fl-stk__p{font-size:12px}
  .fl-sec.fl-worlds>.fl-world:nth-child(n+3) .fl-wstrip{grid-template-columns:repeat(2,minmax(0,1fr))}
}

/* category tiles: real images (category photo, or a best-selling product on light grey) */
.fl .fl-cats--img .fl-cat__img{background:#F5F5F4}
.fl .fl-cats--img .fl-cat__img.is-prod img{object-fit:contain;padding:12%;mix-blend-mode:multiply}
.fl .fl-cats--img .fl-cat__img::after{content:"";position:absolute;inset:0;box-shadow:inset 0 0 0 0 var(--fl-ink);transition:box-shadow .2s var(--fl-ease);pointer-events:none}
.fl .fl-cats--img .fl-cat:hover .fl-cat__img::after{box-shadow:inset 0 0 0 2px var(--fl-ink)}
.fl .fl-cats--img .fl-cat__n{align-items:flex-start;border-bottom:1px solid var(--fl-line);padding-bottom:10px}
.fl .fl-cats--img .fl-cat__n>span{display:flex;flex-direction:column;gap:2px;min-width:0}
.fl .fl-cats--img .fl-cat__n b{font-weight:700;font-size:15px;text-transform:uppercase;letter-spacing:.04em;font-family:var(--fl-display);font-stretch:75%;font-size:20px;line-height:1}
.fl .fl-cats--img .fl-cat__n small{font-size:12px;color:var(--fl-mute);font-weight:500}
.fl .fl-cats--img .fl-cat__n svg{flex:none;margin-top:2px;transition:transform .2s var(--fl-ease)}
.fl .fl-cats--img .fl-cat:hover .fl-cat__n svg{transform:translateX(3px)}
[dir=rtl] .fl .fl-cats--img .fl-cat:hover .fl-cat__n svg{transform:translateX(-3px)}
@media (min-width:1100px){
  .fl-sec.fl-worlds>.fl-world:nth-child(n+3){grid-template-rows:auto 360px}
  .fl-sec.fl-worlds>.fl-world:nth-child(n+3) .fl-stack{inset:2% 5% 4%}
  .fl-sec.fl-worlds>.fl-world:nth-child(n+3) .fl-stk--1{top:0}
  .fl-sec.fl-worlds>.fl-world:nth-child(n+3) .fl-stk--2{top:12%}
  .fl-sec.fl-worlds>.fl-world:nth-child(n+3) .fl-stk--3{top:16%}
}
.fl-world .fl-stk__p{color:inherit}
