/* Bosstad Tweewielers – ronde 11 (2026-09-15): premium kleurlaag.
   Eén signatuur-oppervlak ('aurora': donker met turquoise gloed, zoals de winactie-pop-up en de reels)
   op vaste plekken, plus een zachte mint-tint en turquoise accentlijnen. Alleen CSS; tokens uit --bs-*. */

:root{
	--bs-aurora-glow:radial-gradient(120% 90% at 18% 0%,rgba(51,199,183,.34) 0%,rgba(51,199,183,0) 60%);
	--bs-aurora-glow-soft:radial-gradient(90% 70% at 85% 100%,rgba(51,199,183,.16) 0%,rgba(51,199,183,0) 60%);
	--bs-aurora-base:linear-gradient(180deg,#1C2022 0%,#0E1214 100%);
	--bs-mint:#EAF5F2;
	--bs-mint-2:#E1F2EE;
	--bs-accent-line:linear-gradient(90deg,var(--bs-teal,#0F8A7C) 0%,var(--bs-turquoise,#33C7B7) 45%,var(--bs-turquoise-light,#4FD8C8) 100%);
}

/* ================================================================ 1. Signatuur-oppervlak (aurora) */
.bs-aurora,
.bs-prs--dark,
.bs-aurora-card,
.e-con[data-id^="cat-"][data-id$="-hero"]{
	background-image:var(--bs-aurora-glow),var(--bs-aurora-base)!important;
	background-repeat:no-repeat;
	background-size:cover;
}
#site-footer{
	background-image:var(--bs-aurora-glow-soft),linear-gradient(180deg,#0E1214 0%,#0B0E10 100%);
	background-repeat:no-repeat;
	background-size:cover;
}
/* Reels: dezelfde gloed als de rest van de site, iets levendiger bij hover */
.bs-reel__poster{background:var(--bs-aurora-glow),var(--bs-aurora-base);transition:filter .3s var(--bs-ease,ease)}
.bs-reel:hover .bs-reel__poster,.bs-reel:focus-within .bs-reel__poster{filter:brightness(1.12)}

/* Strook boven de footer: donker en dus visueel één geheel met de footer (turquoise lijn ertussen blijft) */
.bs-prs--dark{border-top:0}

/* ================================================================ 2. Header: dunne merklijn bovenaan */
header.header,.elementor-element-hdr-outer{position:relative}
header.header::before,.elementor-element-hdr-outer::before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:var(--bs-accent-line);z-index:20;pointer-events:none}

/* ================================================================ 3. Homepage */
/* Assortiment-kaart als aurora-kaart */
.bs-aurora-card{border-color:rgba(255,255,255,.08)!important;box-shadow:0 24px 60px -30px rgba(14,18,20,.6)}
.bs-aurora-card .bs-ass-chips a{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.18);color:#fff}
.bs-aurora-card .bs-ass-chips a:hover,.bs-aurora-card .bs-ass-chips a:focus-visible{background:rgba(51,199,183,.14);border-color:var(--bs-turquoise,#33C7B7);color:var(--bs-turquoise-light,#4FD8C8)}

/* USP-strip en Diensten: iconen in een mint tegel */
.elementor-element-usp-strip .elementor-icon-box-icon .elementor-icon,
.elementor-element-diensten .elementor-icon-box-icon .elementor-icon{
	display:inline-flex;align-items:center;justify-content:center;
	width:52px;height:52px;border-radius:12px;
	background:var(--bs-mint-2);
	color:var(--bs-teal,#0F8A7C);
	transition:background-color .2s var(--bs-ease,ease),color .2s var(--bs-ease,ease)
}
.elementor-element-usp-strip .elementor-icon-box-icon .elementor-icon{width:46px;height:46px;border-radius:10px}
.elementor-element-usp-strip .elementor-icon-box-icon .elementor-icon svg,
.elementor-element-diensten .elementor-icon-box-icon .elementor-icon svg{width:22px;height:22px}
.elementor-element-diensten .elementor-widget-icon-box{transition:border-color .2s var(--bs-ease,ease),box-shadow .2s var(--bs-ease,ease),transform .2s var(--bs-ease,ease)}
.elementor-element-diensten .elementor-widget-icon-box:hover{border-color:var(--bs-turquoise,#33C7B7)!important;box-shadow:var(--bs-shadow-soft);transform:translateY(-2px)}
.elementor-element-diensten .elementor-widget-icon-box:hover .elementor-icon{background:var(--bs-turquoise,#33C7B7);color:#000}

/* Reviews: kaart met turquoise accentlijn bovenaan */
.elementor-element-reviews .bs-card{position:relative;overflow:hidden}
.elementor-element-reviews .bs-card::before{content:"";position:absolute;left:0;top:0;right:0;height:3px;background:var(--bs-accent-line);opacity:.9}

/* Merken-chips: turquoise rand bij hover */
.elementor-element-mrk-chips .elementor-widget-heading{transition:border-color .2s var(--bs-ease,ease),color .2s var(--bs-ease,ease)}
.elementor-element-mrk-chips .elementor-widget-heading:hover{border-color:var(--bs-turquoise,#33C7B7)!important}

/* ================================================================ 4. Productpagina */
body.single-bt_bicycle main.bt-single{background:linear-gradient(180deg,var(--bs-mint) 0,rgba(234,245,242,0) 760px)}
.bt-single .bt-gallery__main{background:#fff;box-shadow:var(--bs-shadow-soft)}
.bt-single .bt-gallery__thumbs button[aria-current="true"],.bt-single .bt-gallery__thumbs .is-active{border-color:var(--bs-turquoise,#33C7B7)}
.bt-single .bt-summary__price{color:var(--bs-ink,#1C2022)}
.bt-single .bt-battery{background:var(--bs-mint-2);border-color:var(--bs-mint-2);border-left-color:var(--bs-turquoise,#33C7B7)}
.bt-single .bt-panel{box-shadow:var(--bs-shadow-soft)}
.bt-single .bt-panel__title::before{content:"";display:block;width:32px;height:3px;margin:0 0 12px;border-radius:2px;background:var(--bs-accent-line)}
.bt-single .bs-specs__row{transition:background-color .15s var(--bs-ease,ease)}
.bt-single .bs-specs__row:hover{background:var(--bs-mint)}
.bt-single .bs-usp-mini{background:#fff;border:1px solid var(--bs-border,#E3E4E2);border-radius:4px;padding:14px 16px}

/* Fietskaarten (catalogus, home, gerelateerd): turquoise rand bij hover */
.bt-card:hover,.bt-card:focus-within{border-color:var(--bs-turquoise,#33C7B7)}

/* ================================================================ 5. Winactie: gloed op tokens */
.bs-win__band{background-image:var(--bs-aurora-glow),var(--bs-aurora-base)}

/* Vergelijkbare fietsen: full-bleed mint-band, kaarten wit erop */
body.single-bt_bicycle main.bt-single{padding-bottom:0}
.bt-single .bt-related{position:relative;margin-top:clamp(32px,4vw,56px);padding-top:clamp(40px,5vw,64px);padding-bottom:clamp(48px,6vw,80px)}
.bt-single .bt-related::before{content:"";position:absolute;top:0;bottom:0;left:50%;width:100vw;transform:translateX(-50%);background:linear-gradient(180deg,var(--bs-mint) 0%,var(--bs-mint-2) 100%);z-index:-1}
.bt-single .bt-related .bt-card{background:#fff}
.bt-single .bt-related .bt-panel__title,.bt-single .bt-related h2{margin-bottom:22px}

/* Productpagina: CTA-blok als aurora-paneel (zoals de assortimentkaart op de homepage) */
.bt-single .bt-cta{position:relative;margin-top:24px;padding:22px 22px 20px;border-radius:6px;background-image:var(--bs-aurora-glow),var(--bs-aurora-base);background-repeat:no-repeat;background-size:cover;box-shadow:0 24px 50px -28px rgba(14,18,20,.55)}
.bt-single .bt-cta::before{content:"Kom proefrijden";display:block;flex-basis:100%;margin:0 0 2px;font-size:11.5px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:var(--bs-turquoise,#33C7B7)}
.bt-single .bt-cta .bt-btn--ghost{background:rgba(255,255,255,.06);color:#fff;border-color:rgba(255,255,255,.28)}
.bt-single .bt-cta .bt-btn--ghost:hover,.bt-single .bt-cta .bt-btn--ghost:focus-visible{background:rgba(51,199,183,.14);border-color:var(--bs-turquoise,#33C7B7);color:var(--bs-turquoise-light,#4FD8C8)}
.bt-single .bt-cta__note{color:var(--bs-on-dark-muted,#C3CBCD)}
@media (max-width:640px){.bt-single .bt-cta{padding:18px 16px}.bt-single .bt-cta .bt-btn{flex:1 1 100%;justify-content:center}}