/* Seelenbalsam Angebote — catalog + detail + forms */

/* theme's default page-title banner duplicates our styled heading — hide it on angebote pages */
.page-header { display:none !important; }
.sba-catalog,.sba-form-page { width:100%; padding:clamp(156px,12vw,190px) var(--mx-gutter,24px) clamp(56px,6vw,100px);
    background-color:#ffe9ea;
    background-image:
        radial-gradient(ellipse 48% 58% at 0% 0%, rgba(255,255,255,0.60) 0%, rgba(255,255,255,0) 60%),
        radial-gradient(ellipse 60% 80% at 90% 6%, rgba(243,114,179,0.10) 0%, transparent 55%),
        radial-gradient(ellipse 55% 70% at 6% 96%, rgba(207,101,154,0.07) 0%, transparent 55%),
        linear-gradient(180deg, #ffe9ea 0%, #fff2f1 46%, #FFFCF5 100%);
}
.sba-catalog__inner,.sba-form-page__inner { max-width:1500px; margin:0 auto; padding-inline:clamp(22px,4.6vw,64px); box-sizing:border-box; }
.sba-catalog__head { margin-bottom:clamp(28px,3vw,44px); }
.sba-catalog__title { margin:0 0 12px; font-family:'Gelica','Tiempos Headline','Suisse Intl',"Aileron",Georgia,serif; font-size:clamp(36px,3.6vw,58px); font-weight:400; line-height:1.1; letter-spacing:0; color:var(--mx-color-ink); }
.sba-catalog__intro { margin:0; max-width:760px; font-family:var(--mx-font-body); font-size:19px; line-height:1.6; color:var(--mx-color-text); }
.sba-filter-bar { display:flex; align-items:center; justify-content:space-between; gap:16px; border-top:1px solid #e0dce5; border-bottom:1px solid #e0dce5; padding:14px 0; margin:clamp(20px,2.5vw,32px) 0 clamp(28px,3vw,44px); }
/* Category filter: pills on desktop/tablet, native dropdown on mobile.
   The <select> is wired to the same filter logic as the pills in angebote.js. */
.sba-filter-select {
    display: none; /* hidden on desktop/tablet — pills are shown there */
    -webkit-appearance: none; appearance: none;
    font-family: var(--mx-font-body); font-size: 16px; color: var(--mx-color-ink);
    background-color: #fff;
    border: 1px solid var(--mx-color-accent-peach); border-radius: 999px;
    padding: 12px 44px 12px 20px; cursor: pointer; line-height: 1.2;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23EFA1A2' stroke-width='2.5' stroke-linecap='round'><path d='M6 9l6 6 6-6'/></svg>");
    background-repeat: no-repeat; background-position: right 18px center;
}
.sba-tabs { display:flex; flex-wrap:wrap; gap:10px; margin:0; }
/* Mobile: swap pills for the dropdown */
@media (max-width: 680px) {
    .sba-tabs { display: none !important; }
    .sba-filter-select { display: block !important; width: 100% !important; }
}
.sba-search-wrap { position:relative !important; flex-shrink:0 !important; }
.sba-search { -webkit-appearance:none !important; appearance:none !important; border:none !important; border-bottom:1px solid #e0dce5 !important; border-radius:0 !important; background:transparent !important; padding:6px 8px 6px 36px !important; font-family:var(--mx-font-body) !important; font-size:15px !important; color:#b0a8b8 !important; width:220px !important; box-shadow:none !important; outline:none !important; transition:border-color .2s !important; }
.sba-search::placeholder { color:#b0a8b8 !important; opacity:1 !important; }
.sba-search:focus { border-bottom-color:var(--mx-color-brand) !important; color:var(--mx-color-ink) !important; box-shadow:none !important; outline:none !important; }
.sba-search::-webkit-search-decoration,.sba-search::-webkit-search-cancel-button { -webkit-appearance:none; display:none; }
.sba-search__icon { position:absolute !important; left:14px !important; top:50% !important; transform:translateY(-50%) !important; color:#b0a8b8 !important; pointer-events:none !important; width:18px !important; height:18px !important; }
@media (max-width:680px){ .sba-filter-bar{ flex-wrap:wrap !important;} .sba-search{ width:100% !important;} }
@media (max-width:1024px){ .sba-search{ border-bottom:none !important;} }

.sba-tab { appearance:none; cursor:pointer; display:inline-flex; align-items:center; justify-content:center; line-height:1; padding:10px 24px; border-radius:999px; background:transparent; border:1px solid var(--mx-color-accent-peach); color:var(--mx-color-accent-peach); font-family:var(--mx-font-body); font-size:15px; font-weight:600; box-shadow:none; transition:background .2s,color .2s,border-color .2s; }
.sba-tab:hover { background:rgba(239,161,162,.1); color:var(--mx-color-accent-peach) !important; }
.sba-tab.is-active { background:linear-gradient(267deg, var(--mx-color-brand) .6%, var(--mx-color-brand-soft) 99.4%); color:#fff; border-color:transparent; }
.sba-tab.is-active:hover, .sba-tab.is-active:focus { background:linear-gradient(267deg, #F92D93 .6%, #FF60AF 99.4%); color:#fff !important; border-color:transparent; }

.sba-group { margin-bottom:clamp(40px,5vw,72px); }
.sba-no-results { font-family:var(--mx-font-body); font-size:17px; color:var(--mx-color-text); padding:clamp(32px,4vw,56px) 0; text-align:center; }
.sba-group__title { margin:0 0 24px; font-family:'Gelica','Tiempos Headline','Suisse Intl',"Aileron",Georgia,serif; font-size:clamp(26px,2.4vw,38px); font-weight:400; color:var(--mx-color-ink); }
.sba-group[hidden] { display:none; }

.sba-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:clamp(16px,1.6vw,24px); }
@media (max-width:1024px){ .sba-grid{ grid-template-columns:repeat(2,1fr);} }
@media (max-width:680px){ .sba-grid{ grid-template-columns:1fr;} }

.sba-card { position:relative; display:flex; flex-direction:column; background:#fff; border-radius:var(--mx-radius-md); overflow:hidden; box-shadow:var(--mx-shadow-md); transition:transform .35s,box-shadow .35s; }
/* whole card clickable: CTA link stretched over the entire card */
.sba-card__cta::after { content:""; position:absolute; inset:0; z-index:1; }
.sba-card__media, .sba-card__cta { position:relative; z-index:2; }
.sba-card[hidden]{ display:none; }
.sba-card:hover { transform:translateY(-4px); box-shadow:var(--mx-shadow-lg); }
.sba-card__media { position:relative; display:block; margin:18px 18px 0; border-radius:12px; overflow:hidden; aspect-ratio:16/11; background:#e4dee7; }
.sba-card__media img { width:100%; height:100%; object-fit:cover; display:block; transition:transform .6s; }
.sba-card--whatsapp .sba-card__media img { object-position:right center; transform-origin:right center; }
.sba-card:hover .sba-card__media img { transform:scale(1.04); }
.sba-card__badge { position:absolute; top:12px; left:12px; padding:6px 14px; border-radius:999px; background:rgba(255,255,255,.92); color:var(--mx-color-brand-rose); font-family:var(--mx-font-body); font-size:12px; font-weight:700; letter-spacing:.03em; }
.sba-card__body { display:flex; flex-direction:column; flex:1; padding:clamp(20px,2vw,28px); }
.sba-card__title { margin:0 0 10px; font-family:'Gelica','Tiempos Headline','Suisse Intl',"Aileron",Georgia,serif; font-size:clamp(20px,1.6vw,25px); font-weight:400; line-height:1.15; color:var(--mx-color-ink); transition:color .25s; overflow-wrap:break-word; word-break:break-word; hyphens:auto; }
.sba-card:hover .sba-card__title { color:var(--mx-color-brand); }
.sba-card__desc { margin:0 0 14px; font-family:var(--mx-font-body); font-size:15px; line-height:1.6; color:#8a7d92; flex:1; }
.sba-card__meta { margin:0 0 18px; display:flex; align-items:baseline; gap:10px; flex-wrap:wrap; }
.sba-card__price { font-family:var(--mx-font-body); font-size:18px; font-weight:800; color:var(--mx-color-ink); }
.sba-card__dur { font-family:var(--mx-font-body); font-size:14px; font-weight:400; color:#9e95a8; }
.sba-card__price + .sba-card__dur::before { content:"·"; margin-right:10px; color:#cfc6d4; }
.sba-card__shipping { margin:-12px 0 16px; font-family:var(--mx-font-body); font-size:13px; color:#9a8f93; letter-spacing:.01em; }
.sba-card__cta { display:inline-flex; align-items:center; gap:8px; margin-top:auto; font-family:var(--mx-font-body); font-size:15px; font-weight:800; text-decoration:none; color:var(--mx-color-brand); transition:gap .25s,color .25s; }
.sba-card__cta:hover { gap:14px; color:var(--mx-color-brand-deep); }

/* Breadcrumb */
.sba-breadcrumb { width:100%; background:transparent; border:none; padding:0; margin:0; }
.sba-breadcrumb__inner { max-width:1500px; margin:0 auto; padding:clamp(120px,9vw,138px) clamp(22px,4.6vw,64px) 0; display:flex; flex-direction:column; gap:0; }
.sba-breadcrumb__row { display:flex; align-items:center; gap:8px; border-top:1px solid #e0dce5; padding:14px 0; border-bottom:1px solid #e0dce5; }
.sba-breadcrumb__link { font-family:var(--mx-font-body); font-size:14px; color:#b0a8b8; text-decoration:none; transition:color .2s; }
.sba-breadcrumb__link:hover { color:var(--mx-color-brand); }
.sba-breadcrumb__sep { font-size:14px; color:#b0a8b8; }
.sba-breadcrumb__current { font-family:var(--mx-font-body); font-size:14px; color:var(--mx-color-ink); }

/* Detail */
.sba-detail { width:100%; padding:0 0 clamp(60px,7vw,110px); background:#FFFCF5; box-sizing:border-box; }
.sba-detail__wrap { max-width:1500px; margin:clamp(20px,2.5vw,32px) auto 0; padding:0 clamp(22px,4.6vw,64px); box-sizing:border-box; }
.sba-detail__inner { display:grid; grid-template-columns:minmax(0,1.35fr) minmax(0,.85fr); gap:clamp(12px,1.2vw,20px); align-items:stretch; }
.sba-detail__media { position:sticky; top:120px; }
.sba-detail__main-img { margin:0; border-radius:10px; overflow:hidden; box-shadow:var(--mx-shadow-lg); aspect-ratio:4/3; height:100%; }
.sba-detail__main-img img { width:100%; height:100%; object-fit:cover; display:block; }
.sba-detail__thumbs { display:flex; gap:12px; margin:14px 0 0; flex-wrap:wrap; }
.sba-detail__thumbs img { width:84px; height:84px; object-fit:cover; border-radius:10px; box-shadow:var(--mx-shadow-sm); }
.sba-detail__info { display:flex; flex-direction:column; justify-content:center; align-items:flex-start; padding:clamp(22px,2.8vw,36px); background:transparent; border:1.5px solid rgba(245,184,212,.5); border-radius:10px; box-shadow:none; box-sizing:border-box; min-width:0; }
.sba-detail__badge { display:block; background:none; padding:0; border-radius:0; color:var(--mx-color-brand); font-family:var(--mx-font-body); font-size:13px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; margin-bottom:14px; }
.sba-detail__title { margin:0 0 20px; font-family:'Gelica','Tiempos Headline','Suisse Intl',"Aileron",Georgia,serif; font-size:clamp(20px,1.9vw,29px); font-weight:400; line-height:1.15; color:var(--mx-color-ink); position:relative; overflow-wrap:break-word; word-break:break-word; }
.sba-detail__title::after { content:""; display:block; width:90px; height:2px; background:var(--mx-color-accent-peach); margin-top:18px; }
.sba-detail__price { margin:0 0 14px; font-size:28px; font-weight:800; color:var(--mx-color-ink); font-family:var(--mx-font-body); }
.sba-detail__dur { display:block !important; margin:0 0 20px !important; font-family:var(--mx-font-body) !important; font-size:15px !important; color:#9e95a8 !important; letter-spacing:.03em !important; }
.sba-detail__dur strong { color:#9e95a8 !important; font-weight:400 !important; }
.sba-detail__short { margin:0 0 28px; font-family:var(--mx-font-body); font-size:18px; line-height:1.75; color:var(--mx-color-text); }
.sba-detail__cta { display:inline-flex; align-items:center; justify-content:center; height:64px; padding:0 44px; border-radius:var(--mx-radius-pill); background:linear-gradient(267deg, var(--mx-color-brand) .6%, var(--mx-color-brand-soft) 99.4%); color:#fff; font-family:var(--mx-font-body); font-size:16px; font-weight:600; text-decoration:none; transition:var(--mx-dur-base) var(--mx-ease-out); }
.sba-detail__cta:hover { background:linear-gradient(267deg, var(--mx-color-brand-deep) .6%, var(--mx-color-brand) 99.4%); transform:translateY(-2px); color:#fff; box-shadow:0 8px 20px rgba(243,114,179,.25); }
.sba-detail__rule { display:none; }

.sba-detail__body { max-width:calc(1500px - 2*clamp(22px,4.6vw,64px)) !important; margin:clamp(20px,2.5vw,32px) auto 0 !important; display:grid !important; grid-template-columns:repeat(3,minmax(0,1fr)) !important; gap:0 !important; border:1px solid rgba(245,184,212,.5) !important; border-radius:20px !important; overflow:hidden !important; background:transparent; box-shadow:none; }
.sba-detail__block { padding:clamp(32px,4vw,56px) clamp(20px,2.5vw,40px) !important; border-right:1px solid rgba(245,184,212,.5) !important; transition:background .3s; }
.sba-detail__block:last-child { border-right:none !important; }
.sba-detail__block:hover { background:rgba(245,184,212,.03); }
.sba-detail__block h2 { margin:0 0 18px !important; font-family:'Gelica','Tiempos Headline','Suisse Intl',"Aileron",Georgia,serif !important; font-size:clamp(16px,1.3vw,20px) !important; font-weight:400 !important; color:var(--mx-color-ink) !important; line-height:1.2 !important; }
.sba-detail__rich, .sba-detail__block p { font-family:var(--mx-font-body); font-size:17px; line-height:1.75; color:var(--mx-color-text); }
.sba-detail__list { margin:0; padding:0; list-style:none; }
.sba-detail__list li { position:relative; padding:8px 0 8px 28px; font-family:var(--mx-font-body); font-size:16px; line-height:1.6; color:var(--mx-color-text); border-bottom:1px solid rgba(239,161,162,.15); }
.sba-detail__list li:last-child { border-bottom:0; }
.sba-detail__list li::before { content:""; position:absolute; left:2px; top:14px; width:8px; height:8px; background:var(--mx-color-accent-peach); border-radius:50%; }

@media (max-width:960px){ 
    .sba-detail__inner{ grid-template-columns:1fr;} 
    .sba-detail__media{ position:static;} 
}
@media (max-width:768px){ 
    .sba-detail__body{ grid-template-columns:1fr !important;} 
    .sba-detail__block{ border-right:none !important; border-bottom:1px solid rgba(245,184,212,.5) !important;} 
    .sba-detail__block:last-child{ border-bottom:none !important;} 
}

.sba-related { max-width:calc(1500px - 2*clamp(22px,4.6vw,64px)); margin:clamp(56px,7vw,100px) auto 0; }
.sba-related__title { margin:0 0 32px; text-align:center; font-family:'Gelica','Tiempos Headline','Suisse Intl',"Aileron",Georgia,serif; font-size:clamp(28px,2.6vw,40px); font-weight:400; color:var(--mx-color-ink); }

/* Enquiry form */
/* Products slider */
.sba-slider { margin-bottom:clamp(36px,4vw,56px); }
.sba-slider__head { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:18px; }
.sba-slider__label { font-family:var(--mx-font-body); font-size:15px; font-weight:700; color:var(--mx-color-ink); }
.sba-slider__nav { display:flex; gap:10px; }
.sba-slider__footer { display:flex; align-items:center; gap:24px; margin-top:24px; }
.sba-slider__progress { flex:1; height:1px; border-radius:1px; background:#ece6ef; overflow:hidden; }
.sba-slider__fill { display:block; height:100%; width:0; border-radius:3px; background:linear-gradient(90deg, var(--mx-color-brand), var(--mx-color-brand-soft)); transition:width .3s ease; }
.sba-slider__nav { display:flex; gap:14px; flex:0 0 auto; }
.sba-slider__btn { appearance:none !important; cursor:pointer; width:46px !important; height:46px !important; border-radius:50% !important; display:inline-flex !important; align-items:center; justify-content:center; border:1.5px solid var(--mx-color-brand) !important; background:transparent !important; color:var(--mx-color-brand) !important; box-shadow:none !important; padding:0 !important; transition:background .2s,color .2s,opacity .2s; }
.sba-slider__btn:hover { background:var(--mx-color-brand) !important; color:#fff !important; }
.sba-slider__btn--next { background:var(--mx-color-brand) !important; color:#fff !important; }
.sba-slider__btn--next:hover { background:var(--mx-color-brand-deep) !important; }
.sba-slider__btn:disabled { opacity:.35; cursor:default; background:transparent !important; color:var(--mx-color-brand) !important; }
.sba-picks { --sba-gap:clamp(14px,1.4vw,20px); --sba-per:4; display:flex; gap:var(--sba-gap); overflow-x:auto; scroll-snap-type:x mandatory; scroll-behavior:smooth; padding:10px 6px 34px; -ms-overflow-style:none; scrollbar-width:none; }
.sba-picks::-webkit-scrollbar { display:none; }
.sba-picks > .sba-pick, .sba-picks > .sba-pcard { flex:0 0 calc((100% - (var(--sba-per) - 1) * var(--sba-gap)) / var(--sba-per)); scroll-snap-align:start; }
@media (max-width:1024px){ .sba-picks{ --sba-per:3;} }
@media (max-width:768px){ .sba-picks{ --sba-per:2;} }
@media (max-width:560px){ .sba-picks{ --sba-per:1.15;} }

/* ===== 3-step product checkout ===== */
/* progress indicator */
.sba-steps { display:flex; align-items:center; gap:8px; list-style:none; margin:clamp(18px,2.4vw,32px) 0 clamp(32px,3.6vw,48px); padding:0; }
.sba-steps__item { display:flex; align-items:center; gap:10px; flex:0 0 auto; color:#b0a8b8; font-family:var(--mx-font-body); }
.sba-steps__item:not(:last-child) { flex:1; }
.sba-steps__item:not(:last-child)::after { content:""; flex:1; height:1px; background:#ece6ef; transition:background .25s; }
.sba-steps__item.is-done:not(:last-child)::after { background:var(--mx-color-brand); }
/* once products are in the cart, advance the active step's connector partway */
.sba-steps.has-items .sba-steps__item.is-active:not(:last-child)::after { background:linear-gradient(to right, var(--mx-color-brand) 45%, #ece6ef 45%); }
.sba-steps__num { width:34px; height:34px; flex:0 0 34px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; font-weight:800; font-size:15px; background:#f2ecf4; color:#b0a8b8; transition:background .25s,color .25s; }
.sba-steps__txt { font-size:15px; font-weight:600; white-space:nowrap; }
.sba-steps__item.is-active .sba-steps__num, .sba-steps__item.is-done .sba-steps__num { background:linear-gradient(267deg, var(--mx-color-brand), var(--mx-color-brand-soft)); color:#fff; }
.sba-steps__item.is-active, .sba-steps__item.is-done { color:var(--mx-color-ink); }
.sba-steps__item.is-done .sba-steps__num { font-size:0; }
.sba-steps__item.is-done .sba-steps__num::after { content:"✓"; font-size:16px; }
@media (max-width:560px){ .sba-steps__txt{ display:none;} .sba-steps__item{ flex:0 0 auto;} .sba-steps__item:not(:last-child){ flex:1;} }

.sba-block-title { margin:clamp(20px,2.4vw,30px) 0 16px; font-family:'Gelica','Tiempos Headline','Suisse Intl',"Aileron",Georgia,serif; font-size:clamp(18px,1.5vw,22px); font-weight:400; color:var(--mx-color-ink); }
.sba-step__actions { display:flex; justify-content:flex-end; gap:14px; margin-top:clamp(24px,3vw,36px); }
.sba-step__actions--start { justify-content:flex-start; }
.sba-step__actions--split { justify-content:space-between; }
.sba-btn-ghost { appearance:none !important; cursor:pointer; height:60px; padding:0 40px; border-radius:999px !important; background:transparent !important; border:1.5px solid #e0dce5 !important; color:var(--mx-color-ink) !important; font-family:var(--mx-font-body) !important; font-size:16px; font-weight:800 !important; box-shadow:none !important; transition:border-color .2s,background .2s; }
.sba-btn-ghost:hover { border-color:var(--mx-color-brand); background:rgba(243,114,179,.05); }
.sba-submit--lg { height:66px; padding:0 56px; font-size:17px; }
.sba-submit--full { width:100% !important; }

/* ===== Success state ===== */
.sba-success { max-width:640px; margin:0 auto; min-height:58vh; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; padding:clamp(40px,6vw,80px) 0; }
.sba-success__icon { width:104px; height:104px; border-radius:50%; display:flex; align-items:center; justify-content:center; background:linear-gradient(135deg, var(--mx-color-brand) 0%, var(--mx-color-brand-soft) 100%); color:#fff; box-shadow:0 18px 44px rgba(243,114,179,.32); margin-bottom:clamp(28px,3.5vw,40px); position:relative; }
.sba-success__icon::after { content:""; position:absolute; inset:-10px; border-radius:50%; border:1.5px solid rgba(243,114,179,.28); }
.sba-success__icon svg { width:52px; height:52px; }
.sba-success__title { margin:0 0 18px; font-family:'Gelica','Tiempos Headline','Suisse Intl',"Aileron",Georgia,serif; font-size:clamp(30px,3.4vw,46px); font-weight:400; line-height:1.12; color:var(--mx-color-ink); }
.sba-success__lead { margin:0 0 22px; font-family:var(--mx-font-body); font-size:clamp(18px,1.7vw,21px); line-height:1.5; color:var(--mx-color-ink); }
.sba-success__text { margin:0 0 16px; max-width:560px; font-family:var(--mx-font-body); font-size:17px; line-height:1.75; color:var(--mx-color-text); }
.sba-success__note { margin:0 0 clamp(32px,4vw,44px); font-family:var(--mx-font-body); font-size:15px; line-height:1.6; color:#9e95a8; }
.sba-success__actions { display:flex; flex-direction:column; align-items:center; gap:20px; }
.sba-success__cta { display:inline-flex; align-items:center; justify-content:center; text-decoration:none !important; padding:0 48px; }
.sba-success__link { font-family:var(--mx-font-body); font-size:15px; font-weight:800; color:var(--mx-color-brand); text-decoration:none !important; transition:color .2s; }
.sba-success__link:hover { color:var(--mx-color-brand-deep); text-decoration:none !important; }

/* product card (checkout) */
.sba-pcard { display:flex; flex-direction:column; background:#fff; border-radius:15px; overflow:hidden; box-shadow:0 2px 12px rgba(37,28,47,.06); transition:box-shadow .25s,transform .25s; }
.sba-pcard.is-added { box-shadow:inset 0 0 0 2px var(--mx-color-brand); }
.sba-pcard__media { margin:14px 14px 0; border-radius:12px; overflow:hidden; aspect-ratio:16/11; background:#e4dee7; }
.sba-pcard__media img { width:100%; height:100%; object-fit:cover; display:block; }
.sba-pcard__body { padding:14px 16px 18px; display:flex; flex-direction:column; gap:6px; flex:1; }
/* Equal-height cards so the Wählen/Hinzufügen buttons line up across the whole row.
   The track stretches its items; ONLY the button takes margin-top:auto so it pins
   to the very bottom of every card (a single auto-margin, never split). */
.sba-picks { align-items:stretch !important; }
.sba-picks > .sba-pcard, .sba-picks > .sba-pick { align-self:stretch !important; height:auto !important; }
.sba-bcard__meta { margin-top:0; }
.sba-bcard__select, .sba-pcard__foot { margin-top:auto !important; }
.sba-pcard__title { margin:0; font-family:'Gelica','Tiempos Headline','Suisse Intl',"Aileron",Georgia,serif; font-size:18px; line-height:1.2; color:var(--mx-color-ink); }
.sba-pcard__desc { display:none; }
.sba-pcard__price { margin:4px 0 0; font-family:var(--mx-font-body); font-size:17px; font-weight:800; color:var(--mx-color-ink); }
.sba-pcard__foot { margin-top:auto; padding-top:14px; display:flex; align-items:center; gap:10px; }

/* quantity stepper */
.sba-qty { display:inline-flex !important; align-items:center !important; border:1.5px solid #e0dce5 !important; border-radius:10px !important; overflow:hidden !important; background:#fff !important; height:42px !important; box-shadow:none !important; }
.sba-qty__btn { appearance:none !important; cursor:pointer !important; width:36px !important; height:100% !important; border:0 !important; background:transparent !important; color:var(--mx-color-ink) !important; font-size:18px !important; line-height:1 !important; display:inline-flex !important; align-items:center !important; justify-content:center !important; box-shadow:none !important; border-radius:0 !important; transition:background .15s !important; }
.sba-qty__btn:hover { background:rgba(243,114,179,.08) !important; color:var(--mx-color-brand) !important; }
.sba-qty__input { width:30px !important; height:100% !important; text-align:center !important; border:0 !important; background:transparent !important; font-family:var(--mx-font-body) !important; font-size:15px !important; font-weight:700 !important; color:var(--mx-color-ink) !important; box-shadow:none !important; -moz-appearance:textfield; padding:0 !important; }
.sba-qty--sm { height:36px !important; }
.sba-qty--sm .sba-qty__btn { width:32px !important; font-size:16px !important; }
.sba-qty--sm .sba-qty__input { width:26px !important; font-size:14px !important; }
.sba-pcard__add { flex:1 !important; appearance:none !important; cursor:pointer !important; height:42px !important; border:0 !important; border-radius:10px !important; background:linear-gradient(267deg, var(--mx-color-brand) .6%, var(--mx-color-brand-soft) 99.4%) !important; color:#fff !important; font-family:var(--mx-font-body) !important; font-size:14px !important; font-weight:800 !important; box-shadow:none !important; transition:background .2s,transform .2s !important; }
.sba-pcard__add:hover { background:linear-gradient(267deg, var(--mx-color-brand-deep) .6%, var(--mx-color-brand) 99.4%) !important; transform:translateY(-1px) !important; }

/* step 1 shop layout: products + sticky cart */
.sba-shop { display:grid; grid-template-columns:minmax(0,1.55fr) minmax(0,1fr); gap:clamp(12px,1.5vw,20px); align-items:start; }
.sba-shop__main { min-width:0; }
.sba-shop__main .sba-picks { --sba-per:3; }
@media (max-width:1100px){ .sba-shop__main .sba-picks{ --sba-per:2;} }
@media (max-width:900px){ .sba-shop{ grid-template-columns:1fr;} .sba-shop__main .sba-picks{ --sba-per:3;} }
@media (max-width:760px){ .sba-shop__main .sba-picks{ --sba-per:2.2;} }
@media (max-width:560px){ .sba-shop__main .sba-picks{ --sba-per:1.15;} }
.sba-shop__aside { position:sticky; top:110px; align-self:start; }
@media (max-width:900px){ .sba-shop__aside{ position:static; top:auto;} }
.sba-shop__aside .sba-order { margin-top:0; }
.sba-shop__aside .sba-order__list { max-height:256px; overflow-y:auto; padding-right:12px; scrollbar-width:thin; scrollbar-color:#e0dce5 transparent; }
.sba-shop__aside .sba-order__list::-webkit-scrollbar { width:6px; }
.sba-shop__aside .sba-order__list::-webkit-scrollbar-thumb { background:#e0dce5; border-radius:3px; }
.sba-shop__aside .sba-order__list::-webkit-scrollbar-track { background:transparent; }
.sba-order__next { width:100% !important; margin-top:18px !important; height:58px !important; border-radius:var(--mx-radius-pill) !important; background:linear-gradient(267deg, var(--mx-color-brand) .6%, var(--mx-color-brand-soft) 99.4%) !important; color:#fff !important; border:0 !important; font-weight:800 !important; box-shadow:none !important; }
.sba-order__next:disabled { opacity:.5 !important; cursor:default !important; }
@media (max-width:900px){ .sba-order__next{ display:none !important;} }
/* step 2 full-width CTA inside the summary (visible on all breakpoints) */
.sba-order__cta { width:100% !important; margin-top:18px !important; height:58px !important; }
/* completed steps are clickable to jump back */
.sba-steps__item.is-done { cursor:pointer; }
.sba-steps__item.is-done .sba-steps__num, .sba-steps__item.is-done .sba-steps__txt { transition:opacity .15s; }
.sba-steps__item.is-done:hover .sba-steps__txt { color:var(--mx-color-brand); }

/* mobile sticky cart bar */
.sba-cartbar { display:none; position:fixed; left:0; right:0; bottom:0; z-index:40; align-items:center; justify-content:space-between; gap:14px; padding:12px clamp(16px,4vw,24px); background:#fff; border-top:1px solid #ece6ef; box-shadow:0 -8px 24px rgba(69,55,92,.10); }
.sba-cartbar__info { display:flex; flex-direction:column; gap:2px; font-family:var(--mx-font-body); }
.sba-cartbar__count { font-size:13px; color:#9e95a8; }
.sba-cartbar__sum { font-size:18px; font-weight:800; color:var(--mx-color-ink); }
.sba-cartbar .sba-submit { height:52px; padding:0 32px; }
@media (max-width:900px){ .sba-cartbar.is-visible{ display:flex;} }

/* ===== Service booking cards (single-select) ===== */
.sba-bcard .sba-pcard__media { position:relative; }
.sba-bcard__check { position:absolute; top:10px; right:10px; width:26px; height:26px; border-radius:50%; background:rgba(255,255,255,.92); border:2px solid var(--mx-color-accent-peach); display:none; align-items:center; justify-content:center; }
.sba-bcard.is-selected { box-shadow:inset 0 0 0 2px var(--mx-color-brand); }
.sba-bcard.is-selected .sba-bcard__check { display:flex; background:linear-gradient(267deg, var(--mx-color-brand), var(--mx-color-brand-soft)); border-color:var(--mx-color-brand); }
.sba-bcard.is-selected .sba-bcard__check::after { content:""; width:7px; height:12px; border:solid #fff; border-width:0 2px 2px 0; transform:rotate(45deg) translate(0,-1px); }
.sba-bcard__desc { display:block; margin:0; font-family:var(--mx-font-body); font-size:13px; line-height:1.5; color:#8a7d92; }
.sba-bcard__meta { display:flex; align-items:baseline; gap:10px; flex-wrap:wrap; margin:6px 0 0; font-family:var(--mx-font-body); }
.sba-bcard__dur { font-size:13px; color:#9e95a8; }
.sba-bcard__dur::before { content:"·"; margin-right:10px; color:#cfc6d4; }
.sba-bcard__select { margin-top:auto; appearance:none !important; cursor:pointer; width:100%; height:42px; border:1.5px solid var(--mx-color-brand) !important; border-radius:10px !important; background:transparent !important; color:var(--mx-color-brand) !important; font-family:var(--mx-font-body) !important; font-weight:800 !important; font-size:14px; box-shadow:none !important; transition:background .2s,color .2s; }
.sba-bcard__select:hover { background:rgba(243,114,179,.06) !important; }
.sba-bcard.is-selected .sba-bcard__select { background:linear-gradient(267deg, var(--mx-color-brand) .6%, var(--mx-color-brand-soft) 99.4%) !important; color:#fff !important; border-color:transparent !important; }
.sba-bcard__select + .sba-bcard__select { margin-top:0; }

/* order summary (step 1) */
.sba-order { margin-top:clamp(28px,3vw,40px); padding:clamp(20px,2.2vw,28px); border:1px solid #ece6ef; border-radius:16px; background:#fff; }
.sba-order__title { margin:0 0 14px; font-family:'Gelica','Tiempos Headline','Suisse Intl',"Aileron",Georgia,serif; font-size:20px; font-weight:400; color:var(--mx-color-ink); }
.sba-order__empty { margin:0; font-family:var(--mx-font-body); font-size:15px; color:#9e95a8; }
.sba-order__list { display:flex; flex-direction:column; }
.sba-orow { display:grid; grid-template-columns:54px minmax(0,1fr) auto auto; column-gap:12px; align-items:center; padding:16px 0; border-bottom:1px solid #f0ebf2; }
.sba-orow:first-child { padding-top:0; }
.sba-orow:last-child { border-bottom:0; }
.sba-orow__img { width:54px; height:54px; object-fit:cover; border-radius:10px; }
.sba-orow__main { min-width:0; display:flex; flex-direction:column; justify-content:center; gap:3px; }
.sba-orow__name { font-family:var(--mx-font-body); font-size:15px; font-weight:600; line-height:1.3; color:var(--mx-color-ink); }
.sba-orow__meta { display:flex; align-items:baseline; gap:8px; flex-wrap:wrap; font-family:var(--mx-font-body); }
.sba-orow__unit { font-size:13px; color:#9e95a8; white-space:nowrap; }
.sba-orow__total { font-size:13px; font-weight:800; color:var(--mx-color-ink); white-space:nowrap; }
/* fully naked stepper — no boxes */
.sba-orow .sba-qty { border:0 !important; background:transparent !important; height:auto !important; gap:8px; }
.sba-orow .sba-qty__btn { width:18px !important; height:18px !important; border:0 !important; border-radius:0 !important; background:transparent !important; font-size:16px !important; color:#9e95a8 !important; padding:0 !important; }
.sba-orow .sba-qty__btn:hover { background:transparent !important; color:var(--mx-color-brand) !important; }
.sba-orow .sba-qty__input { width:14px !important; height:auto !important; }
.sba-orow__rm { appearance:none !important; cursor:pointer; width:24px; height:24px; border:0 !important; border-radius:50% !important; background:transparent !important; color:#c0b6c8 !important; font-size:19px; line-height:1; padding:0 !important; transition:color .15s,background .15s; }
.sba-orow__rm:hover { background:transparent !important; color:#b06 !important; }
.sba-order__sum { display:flex; justify-content:space-between; align-items:center; margin-top:16px; padding-top:16px; border-top:1px solid #f0ebf2; font-family:var(--mx-font-body); font-size:17px; font-weight:800; color:var(--mx-color-ink); }
/* read-only recap rows (step 2) */
.sba-orow--recap { grid-template-columns:48px minmax(0,1fr) auto; column-gap:14px; padding:14px 0; }
.sba-orow--recap .sba-orow__img { width:48px; height:48px; }
.sba-orow--recap .sba-orow__main { gap:3px; }

/* payment options (step 2) */
.sba-pay { display:flex; gap:12px; flex-wrap:wrap; margin-bottom:43px; }
.sba-pay__opt { position:relative; cursor:pointer; }
.sba-pay__opt input { position:absolute; opacity:0; pointer-events:none; }
.sba-pay__opt span { display:inline-flex; align-items:center; justify-content:center; min-width:160px; height:56px; padding:0 24px; border:1.5px solid #e0dce5; border-radius:14px; font-family:var(--mx-font-body); font-size:16px; font-weight:600; color:var(--mx-color-ink); transition:border-color .2s,background .2s,box-shadow .2s; }
.sba-pay__opt input:checked + span { border-color:var(--mx-color-brand); background:rgba(243,114,179,.06); box-shadow:0 0 0 1px var(--mx-color-brand) inset; }
@media (max-width:560px){ .sba-pay__opt{ flex:1;} .sba-pay__opt span{ min-width:0; width:100%;} }

/* review (step 3) */
.sba-review { display:flex; flex-direction:column; gap:16px; }
.sba-rsec { padding:clamp(18px,2vw,24px); border:1px solid #ece6ef; border-radius:16px; background:#fff; }
.sba-rsec__head { display:flex; align-items:center; justify-content:space-between; margin-bottom:12px; }
.sba-rsec__head h4 { margin:0; font-family:'Gelica','Tiempos Headline','Suisse Intl',"Aileron",Georgia,serif; font-size:18px; font-weight:400; color:var(--mx-color-ink); }
.sba-rsec p { margin:0; font-family:var(--mx-font-body); font-size:15px; line-height:1.6; color:var(--mx-color-text); }
.sba-edit { appearance:none !important; cursor:pointer; border:0 !important; background:transparent !important; color:#9e95a8 !important; font-family:var(--mx-font-body) !important; font-size:14px !important; font-weight:600 !important; padding:4px 4px !important; border-radius:0 !important; box-shadow:none !important; text-decoration:none !important; transition:color .15s; }
.sba-edit:hover { color:var(--mx-color-brand) !important; background:transparent !important; }
.sba-edit:hover { background:rgba(243,114,179,.08); }
.sba-rlist { display:flex; flex-direction:column; }
.sba-ritem { display:grid; grid-template-columns:48px 1fr auto; align-items:center; gap:12px; padding:10px 0; border-bottom:1px solid #f0ebf2; }
.sba-ritem img { width:48px; height:48px; object-fit:cover; border-radius:9px; }
.sba-ritem__info { display:flex; flex-direction:column; gap:2px; }
.sba-ritem__name { font-family:var(--mx-font-body); font-size:15px; font-weight:600; color:var(--mx-color-ink); }
.sba-ritem__qty { font-family:var(--mx-font-body); font-size:13px; color:#9e95a8; }
.sba-ritem__line { font-family:var(--mx-font-body); font-size:15px; font-weight:800; color:var(--mx-color-ink); }
.sba-rtot { display:flex; justify-content:space-between; padding:8px 0; font-family:var(--mx-font-body); font-size:15px; color:var(--mx-color-text); }
.sba-rtot--grand { margin-top:6px; padding-top:14px; border-top:1px solid #f0ebf2; font-size:19px; font-weight:800; color:var(--mx-color-ink); }
.sba-pick { position:relative; display:flex; flex-direction:column; background:#fff; border-radius:15px; overflow:hidden; box-shadow:var(--mx-shadow-md); cursor:pointer; border:2px solid transparent; transition:border-color .25s,box-shadow .25s,transform .25s; }
.sba-pick:hover { transform:translateY(-3px); box-shadow:var(--mx-shadow-lg); }
.sba-pick input { position:absolute; opacity:0; pointer-events:none; }
.sba-pick.is-selected { border-color:var(--mx-color-brand); box-shadow:0 22px 50px rgba(243,114,179,.22); }
.sba-pick__media { position:relative; margin:14px 14px 0; border-radius:12px; overflow:hidden; aspect-ratio:16/11; background:#e4dee7; }
.sba-pick__media img { width:100%; height:100%; object-fit:cover; display:block; }
.sba-pick__check { position:absolute; top:10px; right:10px; width:26px; height:26px; border-radius:50%; background:rgba(255,255,255,.9); border:2px solid var(--mx-color-accent-peach); display:flex; align-items:center; justify-content:center; }
.sba-pick.is-selected .sba-pick__check { background:linear-gradient(267deg, var(--mx-color-brand), var(--mx-color-brand-soft)); border-color:var(--mx-color-brand); }
.sba-pick.is-selected .sba-pick__check::after { content:""; width:7px; height:12px; border:solid #fff; border-width:0 3px 3px 0; transform:rotate(45deg) translate(-1px,-1px); }
.sba-pick__body { padding:16px 18px 20px; display:flex; flex-direction:column; gap:6px; }
.sba-pick__title { font-family:'Gelica','Tiempos Headline','Suisse Intl',"Aileron",Georgia,serif; font-size:19px; color:var(--mx-color-ink); }
.sba-pick__desc { font-family:var(--mx-font-body); font-size:14px; line-height:1.5; color:#8a7d92; }
.sba-pick__meta { display:flex; gap:14px; margin-top:4px; font-family:var(--mx-font-body); font-size:14px; }
.sba-pick__price { font-weight:800; color:var(--mx-color-ink); }
.sba-pick__dur { color:var(--mx-color-text); }

.sba-fields { max-width:820px; }
.sba-field-row { display:grid; grid-template-columns:1fr 1fr; gap:20px; margin-bottom:20px; }
@media (max-width:680px){ .sba-field-row{ grid-template-columns:1fr;} }
.sba-field { display:flex; flex-direction:column; margin-bottom:20px; }
.sba-field--full { grid-column:1/-1; }
.sba-field label { font-family:var(--mx-font-body); font-size:15px; font-weight:600; color:var(--mx-color-ink); margin-bottom:8px; }
.sba-field input,.sba-field textarea { font-family:var(--mx-font-body); font-size:16px; color:var(--mx-color-ink); padding:12px 16px; border:1px solid #ece7f0 !important; border-radius:12px; background:#fff; width:100%; box-sizing:border-box; }
.sba-field input:focus,.sba-field textarea:focus,.sba-field .sba-select:focus { outline:none; border-color:var(--mx-color-brand) !important; box-shadow:0 0 0 3px rgba(243,114,179,.15); }
/* brand-styled dropdown (Zeitfenster) */
.sba-field .sba-select { -webkit-appearance:none !important; appearance:none !important; font-family:var(--mx-font-body); font-size:16px; color:var(--mx-color-ink); padding:12px 42px 12px 16px; border:1px solid #ece7f0 !important; border-radius:12px; background-color:#fff; width:100%; box-sizing:border-box; cursor:pointer; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23f372b3' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 14px center; }
.sba-field input[type=date]::-webkit-calendar-picker-indicator { opacity:.55; cursor:pointer; }
.sba-field input[type=date]:hover::-webkit-calendar-picker-indicator { opacity:.85; }

/* selected services list (multi-select booking) */
.sba-bitem { display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:12px; padding:13px 0; border-bottom:1px solid #f0ebf2; }
.sba-bitem:last-child { border-bottom:0; }
.sba-bitem:first-child { padding-top:0; }
.sba-bitem__check { width:22px; height:22px; border-radius:50%; background:linear-gradient(267deg, var(--mx-color-brand), var(--mx-color-brand-soft)); display:inline-flex; align-items:center; justify-content:center; flex:0 0 22px; }
.sba-bitem__check::after { content:""; width:6px; height:11px; border:solid #fff; border-width:0 2px 2px 0; transform:rotate(45deg) translateY(-1px); }
.sba-bitem__main { min-width:0; display:flex; flex-direction:column; gap:2px; }
.sba-bitem__name { font-family:var(--mx-font-body); font-size:15px; font-weight:600; line-height:1.3; color:var(--mx-color-ink); }
.sba-bitem__meta { font-family:var(--mx-font-body); font-size:13px; color:#9e95a8; }
.sba-radio-row { display:flex; flex-wrap:wrap; gap:12px 22px; }
.sba-radio { display:inline-flex; align-items:center; gap:8px; font-family:var(--mx-font-body); font-size:15px; color:var(--mx-color-text); cursor:pointer; }
.sba-hp { position:absolute !important; left:-10000px !important; width:1px; height:1px; overflow:hidden; }
.sba-actions { margin-top:8px; }
.sba-submit { appearance:none !important; border:0 !important; cursor:pointer; height:60px; padding:0 48px !important; border-radius:68px !important; background:linear-gradient(267deg, var(--mx-color-brand) .6%, var(--mx-color-brand-soft) 99.4%) !important; color:#fff !important; font-family:var(--mx-font-body) !important; font-size:16px; font-weight:800 !important; white-space:nowrap; box-shadow:none !important; transition:var(--mx-dur-base) var(--mx-ease-out); }
.sba-submit:disabled { opacity:.5; cursor:default; }
.sba-submit:hover { background:linear-gradient(267deg, var(--mx-color-brand-deep) .6%, var(--mx-color-brand) 99.4%); transform:translateY(-2px); box-shadow:0 8px 20px rgba(243,114,179,.25); }
.sba-form-status { margin-top:16px; font-family:var(--mx-font-body); font-size:16px; }
.sba-form-status.is-ok { color:#1f6b3a; }
.sba-form-status.is-err { color:#c93761; }


/* ── Responsive side padding: tablet 40px / mobile 10px ── */
@media (max-width: 1024px) {
    .sba-catalog, .sba-form-page, .sba-detail, .sba-breadcrumb { padding-left: 40px !important; padding-right: 40px !important; }
    .sba-catalog__inner, .sba-form-page__inner, .sba-breadcrumb__inner,
    .sba-detail__wrap, .sba-detail__body, .sba-related { padding-inline: 0 !important; }
    /* physical override — the base `padding:` shorthand's padding-left beats the
       logical padding-inline above, so zero it explicitly so the breadcrumb row
       aligns with the detail content (both inset only by the section's 40px). */
    .sba-breadcrumb__inner { padding-left: 0 !important; padding-right: 0 !important; }
    .sba-detail__body { max-width: 100% !important; }
    .sba-related { max-width: 100% !important; }
}
@media (max-width: 768px) {
    .sba-catalog, .sba-form-page, .sba-detail, .sba-breadcrumb { padding-left: 10px !important; padding-right: 10px !important; }
    .sba-catalog__inner, .sba-form-page__inner, .sba-breadcrumb__inner,
    .sba-detail__wrap, .sba-detail__body, .sba-related { padding-inline: 0 !important; }
    .sba-breadcrumb__inner { padding-left: 0 !important; padding-right: 0 !important; }
}


/* ════════ TABLET AUDIT FIXES (769-1024) — auto-generated 2026-06-05 ════════ */
/* ── angebote-LIST: floor at 768 so iPad-portrait gets the fix too ──── */
@media (min-width: 768px) and (max-width: 1024px) {
  /* kill the redundant injected select, give pills the full row */
  .sba-filter-select { display: none !important; }
  .sba-filter-bar { flex-wrap: wrap; row-gap: 14px; }
  .sba-tabs { flex: 1 1 100%; }
  .sba-search-wrap { flex: 0 0 auto; }

  /* stretch the trailing orphan card to full width (both grids odd-counted) */
  .sba-grid > .sba-card:not([hidden]):last-child:nth-child(odd) { grid-column: 1 / -1; }

  /* lift pill tap target to >=44px */
  .sba-tab { padding: 14px 24px; min-height: 44px; box-sizing: border-box; }
}

/* ── angebot-DETAIL 2+1: kept at 769 floor so 768 still gets the clean
   1-up stack from the max-width:768 rule above (avoids a 768 collision) ── */
@media (min-width: 768px) and (max-width: 1024px) {
  /* 3 info boxes -> 2-up with the third spanning full width (2+1) */
  .sba-detail__body { grid-template-columns: repeat(2, minmax(0,1fr)) !important; }
  .sba-detail__block {
    border-right: 1px solid rgba(245,184,212,.5) !important;
    border-bottom: 1px solid rgba(245,184,212,.5) !important;
  }
  .sba-detail__block:nth-child(2n) { border-right: none !important; }
  .sba-detail__block:last-child {
    grid-column: 1 / -1 !important;
    border-right: none !important;
    border-bottom: none !important;
  }
}

/* Tablet/mobile: trim oversized top padding (fixed header is ~100px tall) */
@media (max-width: 1024px) {
  .sba-catalog, .sba-form-page { padding-top: 116px !important; }
}

/* Tablet/mobile: trim oversized breadcrumb top gap (fixed header ~100px) */
@media (max-width: 1024px) {
  .sba-breadcrumb__inner { padding-top: 116px !important; }
}

/* Tablet: tighter top gap only. The horizontal gutter is handled by the
   section's 40px padding (so the breadcrumb lines up with the detail content);
   do NOT add inner left/right padding here or it double-indents. */
@media (min-width: 768px) and (max-width: 1024px) {
  .sba-breadcrumb__inner {
    padding-top: 96px !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
}

/* ============ Farben block (full-width, before detail body) ============ */
.sba-detail__shipping { margin:-10px 0 0 !important; font-family:var(--mx-font-body); font-size:13px; color:#9a8f93; letter-spacing:.01em; }
.sba-detail__colors {
    max-width:calc(1500px - 2*clamp(22px,4.6vw,64px)); margin:clamp(20px,2.5vw,32px) auto 0;
    padding:clamp(28px,3vw,48px) clamp(20px,2.5vw,40px);
    border:1px solid rgba(245,184,212,.5); border-radius:20px; background:transparent;
}
.sba-detail__colors-title {
    margin:0 0 10px; font-family:'Gelica','Tiempos Headline','Suisse Intl',"Aileron",Georgia,serif;
    font-weight:400; font-size:clamp(22px,2vw,30px); line-height:1.15; color:var(--mx-color-ink);
}
.sba-detail__colors-intro {
    margin:0 0 24px; font-family:var(--mx-font-body); font-size:16px; line-height:1.7;
    color:var(--mx-color-text); max-width:72ch;
}
.sba-color-tags { display:flex; flex-wrap:wrap; gap:10px; margin:0 0 30px; padding:0; list-style:none; }
.sba-color-tag {
    display:inline-flex; align-items:center; gap:9px; padding:9px 18px 9px 13px;
    border:1px solid rgba(245,184,212,.7); border-radius:68px; background:#fff;
    font-family:var(--mx-font-body); font-size:15px; line-height:1; color:var(--mx-color-ink);
}
.sba-color-tag__dot { width:15px; height:15px; border-radius:50%; flex:none; box-shadow:0 0 0 1px rgba(0,0,0,.08) inset; }
.sba-color-eff-title {
    margin:0 0 14px; font-family:'Gelica','Tiempos Headline',Georgia,serif; font-weight:400;
    font-size:clamp(15px,1.2vw,19px); color:var(--mx-color-ink);
}
.sba-color-effs { list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px 32px; }
.sba-color-eff { display:flex; align-items:flex-start; gap:11px; font-family:var(--mx-font-body); font-size:15px; line-height:1.55; color:var(--mx-color-text); }
.sba-color-eff__dot { width:13px; height:13px; border-radius:50%; margin-top:5px; flex:none; box-shadow:0 0 0 1px rgba(0,0,0,.08) inset; }
.sba-color-eff strong { font-weight:600; color:var(--mx-color-ink); }
@media (max-width:680px){ .sba-color-effs { grid-template-columns:1fr; } }
