/* Beds Furniture Modern - POLISH LAYER (loaded last, on every page)

   One shared design language so every page and card matches:
   - one corner-radius scale (cards 18px, controls 8-12px, buttons pill)
   - one shadow scale (resting / hover) and one lift-on-hover motion
   - one accent treatment for section titles and page headers
   - restrained motion: scroll reveal + stagger, hero copy cascade,
     category / product card hover, back-to-top, progress bar, sticky
     add-to-cart bar. Everything is switched off under
     prefers-reduced-motion.
   Nothing in here changes markup contracts or class names that
   theme.js / the plugin rely on - it only layers on top. */

/* =========================================================
   1. TOKENS
========================================================= */
:root{
    --r-sm:8px;
    --r-md:12px;
    --r-lg:18px;
    --card-r:18px;
    --ease-out:cubic-bezier(.2,.7,.3,1);
    --shadow-card:0 1px 2px rgba(var(--ink-rgb),.04),0 10px 26px -14px rgba(var(--ink-rgb),.16);
    --shadow-hover:0 2px 4px rgba(var(--ink-rgb),.05),0 26px 46px -16px rgba(var(--ink-rgb),.28);
    --card-line:rgba(var(--ink-rgb),.08);
}

/* =========================================================
   2. BUTTONS - one pill language everywhere
========================================================= */
.btn,
.button,
.single_add_to_cart_button,
.checkout-button,
#place_order,
.bf-shop-filter-toggle{border-radius:999px;}

.btn{
    position:relative;overflow:hidden;
    transition:background .2s ease,color .2s ease,transform .25s var(--ease-out),box-shadow .25s var(--ease-out);
}
.btn::before{
    content:"";position:absolute;inset:0;pointer-events:none;
    background:linear-gradient(110deg,transparent 32%,rgba(255,255,255,.3) 50%,transparent 68%);
    transform:translateX(-130%);transition:transform .7s var(--ease-out);
}
.btn:hover{transform:translateY(-2px);box-shadow:0 12px 24px -10px rgba(var(--ink-rgb),.5);}
.btn:hover::before{transform:translateX(130%);}
.btn:active{transform:translateY(0);box-shadow:none;}
.btn-outline:hover{box-shadow:0 12px 24px -12px rgba(var(--ink-rgb),.45);}

/* =========================================================
   3. SECTION TITLES + PAGE HEADERS
========================================================= */
.section-head h2{position:relative;padding-bottom:16px;margin-bottom:10px;}
.section-head h2::after{
    content:"";position:absolute;left:50%;bottom:0;width:52px;height:3px;border-radius:3px;
    background:linear-gradient(90deg,var(--rust),var(--on-dark-tint));
    transform:translateX(-50%) scaleX(1);transform-origin:center;
    transition:transform .8s var(--ease-out) .25s;
}
.js-reveal:not(.is-visible) .section-head h2::after{transform:translateX(-50%) scaleX(0);}

/* Every inner-page hero (about / FAQs / contact / legal / blog / shop
   banner) gets the same soft backdrop instead of flat white. */
.bf-about-hero,
.bf-faq-hero,
.bf-contact-hero,
.bf-legal-header,
.page-header{
    position:relative;overflow:hidden;
    background:
        radial-gradient(520px 220px at 12% 0%,rgba(var(--rust-rgb),.10),transparent 70%),
        radial-gradient(460px 200px at 92% 100%,rgba(var(--ink-rgb),.07),transparent 70%),
        linear-gradient(180deg,#fff 0%,var(--cream) 100%);
}
.bf-about-hero h1,
.bf-faq-hero h1,
.bf-contact-hero h1,
.bf-legal-header h1{position:relative;display:block;width:fit-content;max-width:100%;margin-left:auto;margin-right:auto;padding-bottom:14px;}
.bf-about-hero h1::after,
.bf-faq-hero h1::after,
.bf-contact-hero h1::after,
.bf-legal-header h1::after{
    content:"";position:absolute;left:50%;bottom:0;width:52px;height:3px;border-radius:3px;transform:translateX(-50%);
    background:linear-gradient(90deg,var(--rust),var(--on-dark-tint));
}
@keyframes bf-rise{from{opacity:0;transform:translateY(16px);}to{opacity:1;transform:none;}}
.bf-about-hero .container > *,
.bf-faq-hero .container > *,
.bf-contact-hero .container > *,
.bf-legal-header .container > *,
.bf-shop-banner .container > *{animation:bf-rise .7s var(--ease-out) both;}
.bf-about-hero .container > *:nth-child(2),
.bf-faq-hero .container > *:nth-child(2),
.bf-contact-hero .container > *:nth-child(2),
.bf-shop-banner .container > *:nth-child(2){animation-delay:.12s;}
.bf-about-hero .container > *:nth-child(3),
.bf-faq-hero .container > *:nth-child(3),
.bf-contact-hero .container > *:nth-child(3){animation-delay:.24s;}

.bf-shop-banner{background:linear-gradient(120deg,var(--ink) 0%,var(--ink-soft) 60%,rgba(var(--rust-rgb),.55) 140%);}
.bf-shop-banner img{opacity:.22;transform:scale(1.04);transition:transform 6s ease;}
.bf-shop-banner:hover img{transform:scale(1.1);}

/* =========================================================
   4. CATEGORY CARDS (homepage mosaic + shop showcase)
   Name + product count bottom-left, a round arrow button bottom-right
   that is ALWAYS visible (works on touch too) and straightens on hover,
   a slow image zoom and a light sweep across the photo.
========================================================= */
.bf-cat-card{
    border-radius:var(--card-r);box-shadow:var(--shadow-card);
    transition:box-shadow .4s var(--ease-out),transform .4s var(--ease-out);
}
.bf-cat-card:hover,
.bf-cat-card:focus-visible{transform:translateY(-6px);box-shadow:var(--shadow-hover);}
.bf-cat-card img{opacity:1;transition:transform .9s var(--ease-out);}
.bf-cat-card:hover img,
.bf-cat-card:focus-visible img{transform:scale(1.1);}
.bf-cat-card::after{
    background:linear-gradient(0deg,rgba(var(--ink-rgb),.88) 0%,rgba(var(--ink-rgb),.34) 44%,rgba(var(--ink-rgb),0) 74%);
}
.bf-cat-card::before{
    content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
    background:linear-gradient(115deg,transparent 36%,rgba(255,255,255,.2) 50%,transparent 64%);
    transform:translateX(-115%);transition:transform 1s var(--ease-out);
}
.bf-cat-card:hover::before,
.bf-cat-card:focus-visible::before{transform:translateX(115%);}

.bf-cat-card__label,
.bf-cat-card:hover .bf-cat-card__label,
.bf-cat-card:focus-visible .bf-cat-card__label{
    margin:auto 0 0;padding:18px 18px 16px;background:none;border:0;border-radius:0;
    backdrop-filter:none;-webkit-backdrop-filter:none;
    display:flex;align-items:flex-end;justify-content:space-between;gap:12px;
}
.bf-cat-card__meta{display:flex;flex-direction:column;gap:3px;min-width:0;flex:1 1 auto;}
.bf-cat-card__label-text{
    font-size:clamp(15px,2.6vw,18px);font-weight:600;letter-spacing:-.005em;
    text-shadow:0 1px 10px rgba(0,0,0,.4);
}
.bf-cat-card__label .bf-cat-card__count{
    font-style:normal;font-weight:500;font-size:12px;letter-spacing:.02em;color:rgba(255,255,255,.8);
    text-shadow:0 1px 8px rgba(0,0,0,.4);
}
.bf-cat-card__label::after{
    opacity:1;width:34px;height:34px;font-size:13px;background:#fff;color:var(--ink);
    box-shadow:0 6px 16px rgba(0,0,0,.28);transform:rotate(-45deg);
    transition:transform .4s var(--ease-out),background .25s ease,color .25s ease;
}
.bf-cat-card:hover .bf-cat-card__label::after,
.bf-cat-card:focus-visible .bf-cat-card__label::after{opacity:1;transform:rotate(0);background:var(--rust);color:#fff;}
/* the big featured tile on the homepage gets a bigger title */
.bf-cat-grid > a:first-child .bf-cat-card__label-text{font-size:clamp(20px,2.7vw,30px);}
.bf-cat-grid > a:first-child .bf-cat-card__label{padding:26px 26px 22px;}
.bf-cat-grid > a:first-child .bf-cat-card__label::after{width:44px;height:44px;font-size:15px;}
@media(max-width:480px){
    .bf-cat-card__label,
    .bf-cat-card:hover .bf-cat-card__label{padding:14px 14px 13px;}
    .bf-cat-card__label::after{display:flex;width:30px;height:30px;font-size:11px;}
    .bf-cat-grid > a:first-child .bf-cat-card__label{padding:18px;}
}

/* =========================================================
   5. PRODUCT CARDS
========================================================= */
.bf-product-card{
    border-radius:var(--card-r);border-color:var(--card-line);box-shadow:var(--shadow-card);
    transition:box-shadow .4s var(--ease-out),transform .4s var(--ease-out),border-color .3s ease;
}
.bf-product-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-hover);border-color:rgba(var(--rust-rgb),.25);}
.bf-product-card__media-link img{transition:transform .8s var(--ease-out);}
.bf-product-card:hover .bf-product-card__media-link img{transform:scale(1.07);}
.bf-product-card__media::after{
    content:"";position:absolute;inset:0;pointer-events:none;z-index:1;
    background:linear-gradient(0deg,rgba(var(--ink-rgb),.22),transparent 40%);opacity:0;transition:opacity .4s ease;
}
.bf-product-card:hover .bf-product-card__media::after{opacity:1;}
.bf-product-card__badge{z-index:2;}
.bf-product-card__cta .button{gap:9px;}
.bf-product-card__cta .button::after{
    content:"\f061";font-family:"Font Awesome 6 Free";font-weight:900;font-size:10px;
    transition:transform .3s var(--ease-out);
}
.bf-product-card__cta .button:hover::after{transform:translateX(4px);}
@media(hover:hover){
    .bf-product-card:hover .bf-product-card__cta .button{background:var(--ink);border-color:var(--ink);color:#fff;}
}

/* =========================================================
   6. CONTENT CARDS - testimonial / value / contact / blog / FAQ
========================================================= */
.bf-testimonial,
.bf-value-card,
.bf-contact-card,
.blog-card,
.bf-post-card,
.bf-post-featured{
    border-radius:var(--card-r);border-color:var(--card-line);box-shadow:var(--shadow-card);
    transition:box-shadow .4s var(--ease-out),transform .4s var(--ease-out),border-color .3s ease;
}
.bf-testimonial:hover,
.bf-value-card:hover,
.blog-card:hover,
.bf-post-card:hover,
.bf-post-featured:hover{transform:translateY(-5px);box-shadow:var(--shadow-hover);border-color:rgba(var(--rust-rgb),.22);}

/* accent stripe drawn inside the rounded shape instead of a sharp border */
.bf-testimonial{
    position:relative;overflow:hidden;border-top-width:1px;border-top-color:var(--card-line);padding:28px 26px 26px;
    box-shadow:var(--shadow-card),inset 0 3px 0 var(--rust);
}
.bf-testimonial:hover{box-shadow:var(--shadow-hover),inset 0 3px 0 var(--rust);}
.bf-testimonial::before{
    content:"\201C";position:absolute;right:18px;top:2px;font:700 84px/1 Georgia,serif;color:rgba(var(--rust-rgb),.12);pointer-events:none;
}
.bf-value-card{
    border-top-width:1px;border-top-color:var(--card-line);padding:30px 24px;
    box-shadow:var(--shadow-card),inset 0 3px 0 var(--rust);
}
.bf-value-card:hover{box-shadow:var(--shadow-hover),inset 0 3px 0 var(--rust);}
.bf-contact-card{border-left-width:1px;border-left-color:var(--card-line);box-shadow:var(--shadow-card),inset 4px 0 0 var(--rust);}

.bf-value-card .ico,
.bf-contact-row .ico{
    display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;border-radius:50%;
    background:rgba(var(--rust-rgb),.1);color:var(--rust);
    transition:background .3s ease,color .3s ease,transform .4s var(--ease-out);
}
.bf-value-card .ico{width:60px;height:60px;font-size:24px;margin-bottom:10px;}
.bf-contact-row .ico{width:42px;height:42px;font-size:17px;}
.bf-value-card:hover .ico,
.bf-contact-row:hover .ico{background:var(--rust);color:#fff;transform:scale(1.08) rotate(-6deg);}

.blog-card-thumb img,
.bf-post-card__media img{transition:transform .8s var(--ease-out);}
.blog-card:hover .blog-card-thumb img{transform:scale(1.06);}

.faq-item{border-radius:var(--r-md);margin-top:10px;border-color:var(--card-line);box-shadow:var(--shadow-card);transition:box-shadow .3s ease,border-color .3s ease;}
.faq-item:hover{border-color:rgba(var(--rust-rgb),.3);}
.faq-item.is-open{border-color:rgba(var(--rust-rgb),.4);box-shadow:var(--shadow-hover);}
.faq-question::after{
    width:28px;height:28px;border-radius:50%;background:rgba(var(--rust-rgb),.1);display:flex;align-items:center;justify-content:center;
    font-size:18px;line-height:1;transition:transform .3s var(--ease-out),background .3s ease,color .3s ease;
}
.faq-item.is-open .faq-question::after{background:var(--rust);color:#fff;}
.faq-answer{transition:max-height .35s var(--ease-out);}

/* promo banners + newsletter + trust band */
.bf-promo{border-radius:var(--card-r);border-left-width:0;box-shadow:var(--shadow-card);}
.bf-promo img{transition:transform 1.2s var(--ease-out);}
.bf-promo:hover img{transform:scale(1.05);}
.bf-trust-band{position:relative;overflow:hidden;background:linear-gradient(135deg,var(--ink) 0%,var(--ink-soft) 100%);}
.bf-trust-band::before,
.bf-trust-band::after{
    content:"";position:absolute;border-radius:50%;pointer-events:none;
    background:radial-gradient(circle,rgba(var(--rust-rgb),.35),transparent 70%);
}
.bf-trust-band::before{width:360px;height:360px;left:-120px;top:-160px;}
.bf-trust-band::after{width:300px;height:300px;right:-90px;bottom:-150px;}
.bf-trust-band > *{position:relative;z-index:1;}

.bf-newsletter-band{background:linear-gradient(180deg,#fff,var(--cream));}
.newsletter-form{
    border:1.5px solid var(--card-line);border-radius:999px;padding:5px 5px 5px 20px;background:#fff;box-shadow:var(--shadow-card);
    transition:border-color .25s ease,box-shadow .25s ease;
}
.newsletter-form:focus-within{border-color:var(--rust);box-shadow:0 0 0 4px rgba(var(--rust-rgb),.14);}
.newsletter-form input{padding:11px 2px;}
.newsletter-form button{
    background:var(--ink);color:#fff;border-radius:999px;padding:0 22px;transition:background .2s ease;
}
.newsletter-form button:hover{background:var(--rust);color:#fff;}

.bf-finance-strip__logos span{transition:transform .3s var(--ease-out),color .3s ease;display:inline-block;}
.bf-finance-strip__logos span:hover{transform:translateY(-3px);}

/* =========================================================
   7. FORMS, NOTICES, MISC
========================================================= */
input[type="text"],input[type="email"],input[type="tel"],input[type="url"],input[type="password"],input[type="number"],input[type="search"],
select,textarea{
    transition:border-color .2s ease,box-shadow .2s ease;
}
input[type="text"]:focus,input[type="email"]:focus,input[type="tel"]:focus,input[type="url"]:focus,input[type="password"]:focus,
input[type="number"]:focus,input[type="search"]:focus,select:focus,textarea:focus{
    border-color:var(--rust);box-shadow:0 0 0 4px rgba(var(--rust-rgb),.12);outline:none;
}
.woocommerce-message,.woocommerce-info,.woocommerce-error,.woocommerce-noreviews{border-radius:var(--r-md);box-shadow:var(--shadow-card);}
.bf-sale-banner{background:linear-gradient(110deg,var(--ink),var(--ink-soft) 50%,var(--ink));}
.bf-footer{margin-top:72px;}
.bf-footer a{transition:color .2s ease,transform .2s ease;}

/* WhatsApp button: a calm pulse ring so it is noticed, stops on hover */
.bf-whatsapp-float{transition:transform .3s var(--ease-out),bottom .3s ease;}
.bf-whatsapp-float::before{
    content:"";position:absolute;inset:0;border-radius:50%;background:#25d366;opacity:.5;z-index:-1;
    animation:bf-pulse 2.6s ease-out infinite;
}
@keyframes bf-pulse{0%{transform:scale(1);opacity:.45;}80%,100%{transform:scale(1.7);opacity:0;}}
.bf-whatsapp-float:hover::before{animation:none;opacity:0;}

/* =========================================================
   8. MOTION - hero copy cascade + scroll reveal for grid items
========================================================= */
/* animate the pieces of the hero copy one after another instead of
   the whole block at once */
.hero-slide.is-active .hero-slide__copy{animation:none;}
.hero-slide.is-active .hero-slide__copy > *{animation:bf-rise .75s var(--ease-out) both;}
.hero-slide.is-active .hero-slide__copy > *:nth-child(1){animation-delay:.05s;}
.hero-slide.is-active .hero-slide__copy > *:nth-child(2){animation-delay:.15s;}
.hero-slide.is-active .hero-slide__copy > *:nth-child(3){animation-delay:.27s;}
.hero-slide.is-active .hero-slide__copy > *:nth-child(4){animation-delay:.4s;}
.hero-slide.is-active .hero-slide__copy > *:nth-child(5){animation-delay:.5s;}

/* items inside grids fade/rise one after another; the class is only
   added by theme.js to items that are BELOW the fold at load, so nothing
   visible ever flashes. */
.bf-rv{opacity:0;transform:translateY(22px) scale(.985);transition:opacity .7s var(--ease-out),transform .7s var(--ease-out);transition-delay:var(--rv-delay,0ms);}
.bf-rv.is-in{opacity:1;transform:none;}

/* =========================================================
   9. FEATURES - progress bar, back-to-top, sticky add-to-cart, header
========================================================= */
.bf-header{transition:box-shadow .3s ease,background .3s ease;}
.bf-header.is-scrolled{box-shadow:0 8px 24px -14px rgba(var(--ink-rgb),.35);}

.bf-progress{position:fixed;left:0;top:0;height:3px;width:100%;z-index:1000;pointer-events:none;background:transparent;}
.bf-progress__bar{height:100%;width:100%;transform-origin:0 50%;transform:scaleX(0);background:linear-gradient(90deg,var(--rust),var(--on-dark-tint));}

.bf-totop{
    position:fixed;right:20px;bottom:88px;z-index:190;width:46px;height:46px;border-radius:50%;
    background:#fff;color:var(--ink);border:1px solid var(--card-line);box-shadow:var(--shadow-hover);
    display:flex;align-items:center;justify-content:center;font-size:15px;cursor:pointer;
    opacity:0;visibility:hidden;transform:translateY(14px);
    transition:opacity .3s ease,transform .35s var(--ease-out),visibility 0s linear .3s,background .2s ease,color .2s ease,bottom .3s ease;
}
.bf-totop.is-visible{opacity:1;visibility:visible;transform:none;transition:opacity .3s ease,transform .35s var(--ease-out),background .2s ease,color .2s ease,bottom .3s ease;}
.bf-totop:hover{background:var(--ink);color:#fff;}
.bf-totop i{transition:transform .3s var(--ease-out);}
.bf-totop:hover i{transform:translateY(-3px);}
@media(max-width:640px){.bf-totop{right:14px;bottom:78px;width:42px;height:42px;}}

/* sticky add-to-cart bar on product pages - appears once the real
   Add to Cart button has scrolled out of view */
.bf-stickybuy{
    position:fixed;left:0;right:0;bottom:0;z-index:150;background:rgba(255,255,255,.96);
    backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
    border-top:1px solid var(--card-line);box-shadow:0 -14px 34px -18px rgba(var(--ink-rgb),.35);
    transform:translateY(110%);visibility:hidden;transition:transform .45s var(--ease-out),visibility 0s linear .45s;padding:10px 0;
}
.bf-stickybuy.is-visible{transform:translateY(0);visibility:visible;transition:transform .45s var(--ease-out);}
.bf-stickybuy__inner{max-width:var(--wrap);margin:0 auto;padding:0 20px;display:flex;align-items:center;gap:16px;}
.bf-stickybuy__thumb{width:46px;height:46px;border-radius:10px;object-fit:cover;flex-shrink:0;background:var(--cream);}
.bf-stickybuy__info{min-width:0;flex:1 1 auto;display:flex;flex-direction:column;gap:2px;}
.bf-stickybuy__title{font-family:var(--f-head);font-weight:600;font-size:14.5px;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.bf-stickybuy__price{font-size:13px;color:var(--muted);font-weight:600;}
.bf-stickybuy__price ins{text-decoration:none;color:var(--ink);}
.bf-stickybuy__price del{font-weight:400;margin-right:4px;}
.bf-stickybuy__btn{flex-shrink:0;padding:12px 26px;font-size:14px;white-space:nowrap;}
body.bf-has-stickybuy .bf-whatsapp-float{bottom:84px;}
body.bf-has-stickybuy .bf-totop{bottom:148px;}
@media(max-width:640px){
    .bf-stickybuy__inner{padding:0 14px;gap:10px;}
    .bf-stickybuy__thumb{display:none;}
    .bf-stickybuy__btn{padding:12px 18px;font-size:13.5px;}
    body.bf-has-stickybuy .bf-whatsapp-float{bottom:80px;}
    body.bf-has-stickybuy .bf-totop{bottom:138px;}
}

/* options plugin total: hidden while it would read "£0.00" */
.bco-total-price-box.bf-total-empty{display:none;}

/* =========================================================
   10. REDUCED MOTION - everything above is switched off
========================================================= */
@media(prefers-reduced-motion:reduce){
    .btn,.btn::before,.bf-cat-card,.bf-cat-card img,.bf-cat-card::before,.bf-cat-card__label::after,
    .bf-product-card,.bf-product-card__media-link img,.bf-testimonial,.bf-value-card,.blog-card,.bf-post-card,
    .bf-promo img,.bf-shop-banner img,.bf-totop,.bf-stickybuy,.bf-header,.faq-answer{transition:none;}
    .bf-whatsapp-float::before,
    .bf-about-hero .container > *,.bf-faq-hero .container > *,.bf-contact-hero .container > *,
    .bf-legal-header .container > *,.bf-shop-banner .container > *,
    .hero-slide.is-active .hero-slide__copy > *{animation:none;}
    .bf-rv{opacity:1;transform:none;transition:none;}
    .section-head h2::after{transition:none;}
    .btn:hover,.bf-cat-card:hover,.bf-product-card:hover,.bf-testimonial:hover,.bf-value-card:hover,.blog-card:hover,.bf-post-card:hover{transform:none;}
}