/* FMKE event rentals slider — [fmke_event_rentals]
   These are CATEGORY tiles, not product cards: no price, no thumbnail grid —
   each one is a big banner (background photo + gradient, an icon badge, a
   headline and ONE call-to-action button) that sends the shopper to the
   actual Event Rentals category page. Built as a smooth sliding carousel,
   3 tiles visible at a time, each carrying its own accent colour while the
   frame/type/buttons stay on the shared fmke theme tokens. */
.fmke-rentals-wrap{width:90vw;max-width:1800px;margin-left:calc(50% - 45vw);margin-right:calc(50% - 45vw);
 padding:0;box-sizing:border-box}

.fmke-rentals{--r-int:4200ms;--gap:20px;position:relative;margin:32px 0;padding:28px 26px 30px;
 border-radius:20px;isolation:isolate;background:linear-gradient(180deg,var(--fmke-primary-light,#FFF1E0) 0%,#fff 100%);
 box-shadow:0 10px 28px rgba(31,61,44,.14);overflow:hidden}
.fmke-rentals *{box-sizing:border-box}

/* faint drifting colour wash behind the section — slow, ambient, never distracting */
.fmke-rentals::before{content:"";position:absolute;inset:-20% -10%;z-index:0;pointer-events:none;
 background:conic-gradient(from 0deg,#FF6A0022,#0EA5A422,#8B5CF622,#E0507A22,#E4A11B22,#2F9BE022,#FF6A0022);
 filter:blur(60px);opacity:.45;animation:fmkeRentalsDrift 22s linear infinite}
@keyframes fmkeRentalsDrift{to{transform:rotate(360deg)}}

.fmke-rentals__head{position:relative;z-index:1;display:flex;align-items:flex-end;justify-content:space-between;
 gap:16px;padding:0 0 22px;flex-wrap:wrap}
.fmke-rentals__eyebrow{display:inline-flex;align-items:center;gap:6px;padding:5px 14px;border-radius:999px;
 background:var(--fmke-dark,#1F3D2C);color:#fff;font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase}
.fmke-rentals__heading{margin:10px 0 0!important;font-size:clamp(20px,2.4vw,28px)!important;font-weight:800!important;
 line-height:1.2!important;color:var(--fmke-dark,#1F3D2C)!important}
.fmke-rentals__headcol{display:flex;flex-direction:column}
.fmke-rentals__navgroup{position:relative;z-index:1;display:flex;gap:8px}

/* standard carousel mechanics: fixed-height viewport, flex track that
   translates by whole tiles — same pattern shoppers already recognise */
.fmke-rentals__stage{position:relative;z-index:1}
.fmke-rentals__viewport{overflow:hidden;width:100%}
.fmke-rentals__track{display:flex;gap:var(--gap);transition:transform .55s cubic-bezier(.22,.85,.2,1);will-change:transform}

/* the category tile itself */
.fmke-rentals__card{position:relative;flex:0 0 auto;width:360px;height:270px;border-radius:18px;overflow:hidden;
 text-decoration:none!important;color:#fff;display:block;box-shadow:0 10px 24px rgba(31,61,44,.22);
 transform:translateY(0) scale(1);transition:transform .35s ease,box-shadow .35s ease}
.fmke-rentals__card:hover,.fmke-rentals__card:focus-visible{transform:translateY(-6px);
 box-shadow:0 22px 40px -10px rgba(31,61,44,.4);
 box-shadow:0 22px 40px -10px color-mix(in srgb,var(--accent) 45%,rgba(31,61,44,.4))}

.fmke-rentals__bg{position:absolute;inset:0;z-index:0}
.fmke-rentals__bg img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
 transform:scale(1.03);transition:transform .6s ease;filter:saturate(1.05)}
.fmke-rentals__card:hover .fmke-rentals__bg img{transform:scale(1.12)}
/* colour-tinted scrim so the accent reads through the photo without
   fighting the white text — this is the section's main "different colour"
   signal, applied consistently rather than as decoration on top */
.fmke-rentals__bg::after{content:"";position:absolute;inset:0;
 background:linear-gradient(195deg,rgba(0,0,0,.05) 0%,rgba(0,0,0,.25) 45%,var(--accent) 165%);
 opacity:.86;mix-blend-mode:multiply}
.fmke-rentals__bg::before{content:"";position:absolute;inset:0;z-index:1;
 background:linear-gradient(180deg,rgba(0,0,0,0) 40%,rgba(0,0,0,.65) 100%)}

.fmke-rentals__badge{position:absolute;top:16px;left:16px;z-index:2;width:38px;height:38px;border-radius:50%;
 display:flex;align-items:center;justify-content:center;color:#fff;background:var(--accent);
 box-shadow:0 6px 14px rgba(0,0,0,.25),0 0 0 3px rgba(255,255,255,.35)}

.fmke-rentals__content{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:16px 18px 18px;
 display:flex;flex-direction:column;gap:5px}
.fmke-rentals__eyebrow-tag{align-self:flex-start;font-size:10.5px;font-weight:700;letter-spacing:.08em;
 text-transform:uppercase;color:#fff;opacity:.85}
.fmke-rentals__title{font-size:18px;font-weight:800;line-height:1.24;color:#fff;
 display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.fmke-rentals__sub{font-size:12.5px;line-height:1.4;color:#fff;opacity:.82;
 display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}

/* the one clear call-to-action, styled as an actual button (not a text
   link), so it reads as "go to this category" rather than "read more" */
.fmke-rentals__button{align-self:flex-start;margin-top:8px;display:inline-flex;align-items:center;gap:6px;
 padding:8px 16px;border-radius:999px;background:#fff;color:color-mix(in srgb,var(--accent) 75%,#1F3D2C);
 color:var(--fmke-dark,#1F3D2C);font-size:12.5px;font-weight:800;transition:transform .25s ease,background .25s ease}
.fmke-rentals__button-arrow{transition:transform .25s ease}
.fmke-rentals__card:hover .fmke-rentals__button{background:var(--accent);color:#fff}
.fmke-rentals__card:hover .fmke-rentals__button-arrow{transform:translateX(4px)}

/* arrows sit beside the heading, like a normal category-row carousel */
.fmke-rentals__arrow{position:relative;z-index:2;flex:0 0 auto;width:36px;height:36px;border-radius:50%;
 border:1px solid var(--fmke-border,#F0E4D8);background:#fff;color:var(--fmke-dark,#1F3D2C);font-size:13px;
 display:flex;align-items:center;justify-content:center;cursor:pointer;
 box-shadow:0 4px 12px rgba(31,61,44,.1);transition:background .2s,color .2s,border-color .2s}
.fmke-rentals__arrow:hover{background:var(--fmke-primary,#FF6A00);border-color:var(--fmke-primary,#FF6A00);color:#fff}
.fmke-rentals__arrow:disabled{opacity:.35;cursor:default;background:#fff;color:var(--fmke-dark,#1F3D2C);
 border-color:var(--fmke-border,#F0E4D8)}

/* dots, tinted per-tile */
.fmke-rentals__dots{position:relative;z-index:1;display:flex;justify-content:center;gap:9px;margin-top:20px}
.fmke-rentals__dot{width:8px;height:8px;padding:0;border:0;border-radius:50%;cursor:pointer;
 background:rgba(31,61,44,.2);transition:transform .3s ease,background .3s ease}
.fmke-rentals__dot.is-active{background:var(--accent);transform:scale(1.35);
 box-shadow:0 0 0 4px rgba(31,61,44,.12);
 box-shadow:0 0 0 4px color-mix(in srgb,var(--accent) 22%,transparent)}

@media(max-width:1100px){
 .fmke-rentals__card{width:300px;height:240px}
}
@media(max-width:900px){
 .fmke-rentals{padding:22px 16px 26px}
 .fmke-rentals__card{width:260px;height:220px}
 .fmke-rentals__title{font-size:16px}
}
@media(max-width:640px){
 .fmke-rentals__navgroup{display:none}
 .fmke-rentals__card{width:82vw;max-width:320px;height:210px}
}
@media(prefers-reduced-motion:reduce){
 .fmke-rentals *{animation:none!important}
 .fmke-rentals__track{transition-duration:.01s}
 .fmke-rentals::before{opacity:.2;animation:none}
}