/* =================================================================
   Herbelya Theme — sections.css
   Tema editor section type'lari icin stiller (Glamora-standart, hb- prefix).
   - dynamic-section wrapper
   - 19 section type stili
   - product-card stilleri (Herbelya boutique)
   ================================================================= */

/* ---------- 0) Dynamic section base ---------- */
.myt-dynamic-section{
    --hb-sec-color: var(--hb-text);
    --hb-sec-fw: 500;
    color: var(--hb-sec-color);
    font-weight: var(--hb-sec-fw);
}
.myt-dynamic-section h1, .myt-dynamic-section h2, .myt-dynamic-section h3, .myt-dynamic-section h4 {
    color: inherit;
}

/* ---------- 1) Marquee ---------- */
.hb-mq{
    overflow: hidden;
    background: var(--hb-bg-cream);
    color: var(--hb-text);
    padding: .85rem 0;
    border-block: 1px solid var(--hb-border);
}
.hb-mq-track{
    display:flex; align-items:center; gap: 3rem;
    white-space: nowrap;
    animation: hb-mq-scroll 24s linear infinite;
    font-size: .85rem; letter-spacing: .15em; text-transform: uppercase;
}
.hb-mq-item{ display:inline-flex; align-items:center; gap:.5rem; }
.hb-mq-sep{ opacity:.4; }
@keyframes hb-mq-scroll {
    from { transform: translateX(0); }
    to   { transform: translateX(-50%); }
}
@media (prefers-reduced-motion: reduce){
    .hb-mq-track { animation: none; }
}

/* ---------- 2a) Swiper FAILSAFE fallback ----------
   Swiper kutuphanesi bazen body sonunda yuklenir; section icindeki inline
   `new Swiper(...)` cagrisi parse aninda calistigi icin Swiper henuz tanimsiz
   olabiliyor. Init basarisiz olursa swiper-wrapper duz blok olur ve her
   swiper-slide tum genisligi kaplar (tek sutun bug). Asagidaki kurallar
   `swiper-initialized` class'i eklenene kadar yatay flex layout'u garantiler. */
.hb-fc .swiper:not(.swiper-initialized) > .swiper-wrapper{
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    transform: none !important;
    width: 100%;
}
.hb-fc .swiper:not(.swiper-initialized) > .swiper-wrapper > .swiper-slide{
    flex: 0 0 calc(50% - 8px);
    max-width: calc(50% - 8px);
    width: auto !important;
    margin: 0 !important;
}
@media (min-width: 576px){
    .hb-fc .swiper:not(.swiper-initialized) > .swiper-wrapper > .swiper-slide{
        flex: 0 0 calc(50% - 8px); max-width: calc(50% - 8px);
    }
}
@media (min-width: 768px){
    .hb-fc .swiper:not(.swiper-initialized) > .swiper-wrapper > .swiper-slide{
        flex: 0 0 calc(33.333% - 11px); max-width: calc(33.333% - 11px);
    }
}
@media (min-width: 992px){
    .hb-fc .swiper:not(.swiper-initialized) > .swiper-wrapper > .swiper-slide{
        flex: 0 0 calc(25% - 12px); max-width: calc(25% - 12px);
    }
}

/* Slideshow / Image banner fallback: tek slide goster */
.hb-slideshow .swiper:not(.swiper-initialized) > .swiper-wrapper,
.hb-ib .swiper:not(.swiper-initialized) > .swiper-wrapper{
    display: block;
    transform: none !important;
}
.hb-slideshow .swiper:not(.swiper-initialized) > .swiper-wrapper > .swiper-slide:not(:first-child),
.hb-ib .swiper:not(.swiper-initialized) > .swiper-wrapper > .swiper-slide:not(:first-child){
    display: none;
}
.hb-slideshow .swiper:not(.swiper-initialized) > .swiper-wrapper > .swiper-slide,
.hb-ib .swiper:not(.swiper-initialized) > .swiper-wrapper > .swiper-slide{
    width: 100% !important;
    transform: none !important;
}

/* ---------- 2) Slideshow (illustrated hero) ---------- */
.hb-slideshow{ position: relative; overflow: hidden; }
.hb-slideshow .swiper{ width: 100%; }
.hb-slide{
    position: relative;
    background-size: cover; background-position: center; background-repeat: no-repeat;
    display: flex; align-items: center;
    justify-content: center;
    box-sizing: border-box;
}
.hb-slide--align-left{ justify-content: flex-start; }
.hb-slide--align-center{ justify-content: center; }
.hb-slide--align-right{ justify-content: flex-end; }
@media (max-width: 767.98px){
    .hb-slide--align-left,
    .hb-slide--align-right{ justify-content: center; }
}
.hb-slide-overlay{
    position: absolute; inset: 0;
    background: rgba(0,0,0,.18);
    pointer-events: none;
}
.hb-slide-overlay--left{
    background: linear-gradient(90deg, rgba(0,0,0,.28) 0%, rgba(0,0,0,0) 55%);
}
.hb-slide-overlay--right{
    background: linear-gradient(270deg, rgba(0,0,0,.28) 0%, rgba(0,0,0,0) 55%);
}
.hb-slide-content{
    position: relative; z-index: 2;
    color: #fff;
    padding: 2rem var(--hb-container-pad);
    width: 100%;
    max-width: 540px;
    text-align: center;
}
.hb-slide--align-left .hb-slide-content{
    text-align: left;
    margin-right: auto;
    margin-left: 0;
}
.hb-slide--align-center .hb-slide-content{
    max-width: 760px;
    margin-inline: auto;
    text-align: center;
}
.hb-slide--align-right .hb-slide-content{
    text-align: right;
    margin-left: auto;
    margin-right: 0;
}
@media (max-width: 767.98px){
    .hb-slide-content{ max-width: 100%; text-align: center; margin-inline: auto; padding: 1.5rem var(--hb-container-pad); }
}
.hb-slide-eyebrow{
    display: inline-block;
    font-size: .72rem; letter-spacing: .3em; text-transform: uppercase;
    margin-bottom: 1rem; opacity: .9;
    font-weight: 500;
}
.hb-slide-title{
    font-family: var(--hb-font-display);
    font-weight: 300;
    font-size: clamp(36px, 5.5vw, 78px);
    line-height: 1.05;
    margin: 0 0 1rem;
    color: inherit;
    text-shadow: 0 2px 24px rgba(0,0,0,.35);
    letter-spacing: .01em;
    text-transform: uppercase;
}
.hb-slide-text{
    font-size: clamp(.78rem, 1.05vw, .92rem);
    max-width: 460px;
    margin: 0 0 1.6rem auto;
    color: inherit;
    opacity: .92;
    text-transform: uppercase;
    letter-spacing: .08em;
    line-height: 1.5;
    text-shadow: 0 2px 12px rgba(0,0,0,.35);
    font-weight: 400;
}
.hb-slide--align-center .hb-slide-text{ margin-inline: auto; }
@media (max-width: 767.98px){
    .hb-slide-text{ margin: 0 auto 1.6rem; }
}
.hb-slide-cta{
    display: inline-flex; align-items: center; gap: .5rem;
    padding: .8rem 1.8rem;
    text-transform: uppercase; letter-spacing: .14em; font-size: .72rem; font-weight: 500;
    border-radius: var(--hb-radius);
    border: 1px solid #fff;
    transition: background var(--hb-tr-fast), color var(--hb-tr-fast), border-color var(--hb-tr-fast);
}
.hb-slide-cta--solid{
    background: #fff;
    color: var(--hb-text-strong);
    border-color: #fff;
}
.hb-slide-cta--solid:hover{
    background: transparent;
    color: #fff;
    border-color: #fff;
}
.hb-slide-cta--ghost{
    background: transparent;
    color: inherit;
    border-color: currentColor;
}
.hb-slide-cta--ghost:hover{
    background: #fff;
    color: var(--hb-text-strong);
    border-color: #fff;
}
.hb-slide-overlay-link{
    position: absolute; inset: 0; z-index: 1;
}

/* swiper navigation override (scope-li) */
.hb-slideshow .swiper-button-next,
.hb-slideshow .swiper-button-prev{
    color: #fff;
    width: 44px; height: 44px;
    background: rgba(0,0,0,.35);
    border-radius: 50%;
    transition: background var(--hb-tr-fast);
}
.hb-slideshow .swiper-button-next:hover,
.hb-slideshow .swiper-button-prev:hover{ background: var(--hb-primary); }
.hb-slideshow .swiper-button-next:after,
.hb-slideshow .swiper-button-prev:after{ font-size: 1rem; font-weight: 700; }
.hb-slideshow .swiper-pagination-bullet{
    background: #fff; opacity: .5;
    width: 8px; height: 8px;
    transition: width var(--hb-tr-fast), opacity var(--hb-tr-fast);
}
.hb-slideshow .swiper-pagination-bullet-active{
    opacity: 1; width: 24px; border-radius: 4px;
}
@media (prefers-reduced-motion: reduce){
    .hb-slideshow .swiper-wrapper { animation: none !important; transition: none !important; }
}

/* ---------- 3) Featured collection ---------- */
.hb-fc{ padding-block: clamp(2.5rem, 5vw, 4.5rem); }
.hb-fc-head{
    display:flex; align-items:center; justify-content:center; gap: 1rem;
    margin-bottom: 2.5rem;
    flex-wrap: wrap;
}
.hb-fc-title-wrap{ flex: 1; min-width: 0; text-align: center; }

/* Duygukaya tarzi tek satir baslik: "MARKA - BOLUM" - uppercase, regular weight */
.hb-fc-title,
.hb-section-title,
.hb-cl .hb-fc-title{
    font-family: var(--hb-font-body);
    font-size: clamp(20px, 2vw, 26px);
    font-weight: 400;
    text-transform: uppercase;
    letter-spacing: .04em;
    text-align: center;
    color: var(--hb-text-strong);
    margin: 0 0 2.5rem;
    line-height: 1.3;
}

/* Eski eyebrow/divider artik kullanilmiyor - gizle */
.hb-fc-eyebrow,
.hb-fc-divider,
.hb-section-divider{ display: none !important; }

.hb-fc-desc { color: var(--hb-muted); font-size: .9rem; max-width: 600px; margin: -1.5rem auto 2rem; text-align: center; }

.hb-fc-view-all{
    display:inline-flex; align-items:center; gap:.4rem;
    color: var(--hb-text-strong); font-size: .78rem; letter-spacing: .14em; text-transform: uppercase; font-weight: 500;
    border-bottom: 1px solid var(--hb-text-strong); padding-bottom: 2px;
    transition: color var(--hb-tr-fast), border-color var(--hb-tr-fast);
}
.hb-fc-view-all:hover { color: var(--hb-primary); border-bottom-color: var(--hb-primary); }

/* ---------- 4) Featured product ---------- */
.hb-fp{ padding-block: clamp(2.5rem, 5vw, 4.5rem); }
.hb-fp-grid{
    display:grid;
    grid-template-columns: 1fr 1fr;
    gap: clamp(1.5rem, 4vw, 4rem);
    align-items: center;
}
@media (max-width: 767.98px){ .hb-fp-grid{ grid-template-columns: 1fr; } }
.hb-fp-img{
    width: 100%; aspect-ratio: 4/5; object-fit: cover;
    border-radius: var(--hb-radius-card);
}
.hb-fp-eyebrow{ font-size:.7rem; letter-spacing:.3em; text-transform:uppercase; color: var(--hb-primary); }
.hb-fp-title{ font-family: var(--hb-font-display); font-size: clamp(28px, 3vw, 42px); margin: .5rem 0 .75rem; }
.hb-fp-desc { color: var(--hb-text-soft); margin-bottom: 1rem; }
.hb-fp-price{ font-size: 1.1rem; margin-bottom: 1.25rem; }
.hb-fp-price .old{ text-decoration: line-through; color: var(--hb-muted); margin-right: .5rem; }
.hb-fp-price .new{ color: var(--hb-discount); font-weight: 600; }

/* ---------- 5) Collection list ---------- */
.hb-cl{ padding-block: clamp(2rem, 4vw, 3.5rem); }
.hb-cl-item{
    position: relative;
    aspect-ratio: 4/5;
    overflow: hidden;
    border-radius: var(--hb-radius-card);
    background: var(--hb-bg-cream);
}
.hb-cl-item img{
    width:100%; height:100%; object-fit:cover;
    transition: transform .6s ease;
}
.hb-cl-item:hover img { transform: scale(1.05); }
.hb-cl-label{
    position: absolute; left: 0; right: 0; bottom: 0;
    padding: 1rem;
    background: linear-gradient(to top, rgba(0,0,0,.55), transparent);
    color: #fff;
    font-family: var(--hb-font-display); font-size: 1.4rem; font-weight: 500;
    text-align: center;
    letter-spacing: .02em;
}

/* ---------- 6) Rich text ---------- */
.hb-rt{ padding-block: clamp(2.5rem, 5vw, 4.5rem); }
.hb-rt-inner{ max-width: 760px; margin: 0 auto; text-align: center; }
.hb-rt-title{
    font-family: var(--hb-font-display);
    font-size: clamp(24px, 2.6vw, 36px); font-weight: 500;
    margin-bottom: 1rem;
}
.hb-rt-body{ color: var(--hb-text-soft); line-height: 1.8; }
.hb-rt-body p { margin-bottom: 1rem; }
.hb-rt-cta{ margin-top: 1.5rem; }

/* ---------- 7) Image with text ---------- */
.hb-iwt{ padding-block: clamp(2.5rem, 5vw, 4.5rem); }
.hb-iwt-grid{
    display:grid; grid-template-columns: 1fr 1fr;
    gap: clamp(1.5rem, 4vw, 4rem);
    align-items: center;
}
.hb-iwt--image-right .hb-iwt-grid { direction: rtl; }
.hb-iwt--image-right .hb-iwt-text { direction: ltr; }
.hb-iwt--image-right .hb-iwt-img-wrap { direction: ltr; }
@media (max-width: 767.98px){ .hb-iwt-grid{ grid-template-columns: 1fr; direction: ltr; } }

.hb-iwt-img-wrap{ overflow: hidden; border-radius: var(--hb-radius-card); }
.hb-iwt-img{ width: 100%; aspect-ratio: 1/1; object-fit: cover; transition: transform .6s ease; }
.hb-iwt-img-wrap:hover .hb-iwt-img { transform: scale(1.04); }
.hb-iwt-eyebrow{ font-size:.7rem; letter-spacing:.3em; text-transform:uppercase; color: var(--hb-primary); }
.hb-iwt-title{ font-family: var(--hb-font-display); font-size: clamp(24px, 2.6vw, 36px); margin: .5rem 0 .75rem; }
.hb-iwt-body{ color: var(--hb-text-soft); }

/* ---------- 8) Image banner ---------- */
.hb-ib{ padding-block: 0; }
.hb-ib-slide{
    position: relative;
    aspect-ratio: 21/9;
    background-size: cover; background-position: center;
    display:flex; align-items: center;
    color: #fff;
}
@media (max-width: 767.98px){ .hb-ib-slide{ aspect-ratio: 4/5; } }
.hb-ib-overlay{ position: absolute; inset: 0; pointer-events: none; }
.hb-ib-content{
    position: relative; z-index: 2;
    text-align: center;
    width: 100%;
    padding: 1rem var(--hb-container-pad);
}
.hb-ib-title{ font-family: var(--hb-font-display); font-size: clamp(28px, 4vw, 56px); margin-bottom: .5rem; color: inherit; }
.hb-ib-subtitle{ font-size: clamp(.9rem, 1.4vw, 1.1rem); margin-bottom: 1.4rem; opacity: .95; }
.hb-ib-btn{
    display:inline-flex; align-items:center; gap:.5rem;
    padding: .85rem 1.6rem;
    background: #fff; color: var(--hb-text);
    text-transform: uppercase; letter-spacing: .14em; font-size: .8rem; font-weight: 600;
    border-radius: var(--hb-radius);
    transition: background var(--hb-tr-fast);
}
.hb-ib-btn:hover{ background: var(--hb-primary); color: #fff; }

/* ---------- 9) Collage ---------- */
.hb-collage{ padding-block: clamp(2.5rem, 5vw, 4.5rem); }
.hb-collage-grid{ display:grid; gap: 1rem; }
.hb-collage-item{
    position: relative; overflow: hidden;
    aspect-ratio: 1/1; border-radius: var(--hb-radius-card);
    background: var(--hb-bg-cream);
}
.hb-collage-item img{ width:100%; height:100%; object-fit:cover; transition: transform .6s ease; }
.hb-collage-item:hover img{ transform: scale(1.06); }
.hb-collage-label{
    position: absolute; left:0; right:0; bottom:0; padding: 1rem;
    background: linear-gradient(to top, rgba(0,0,0,.55), transparent);
    color: #fff; font-family: var(--hb-font-display); font-size: 1.2rem;
}

/* ---------- 10) Multicolumn ---------- */
.hb-mc{ padding-block: clamp(2.5rem, 5vw, 4.5rem); }
.hb-mc-title{ text-align: center; font-family: var(--hb-font-display); font-size: clamp(24px, 2.6vw, 36px); margin-bottom: 2rem; }
.hb-mc-col{ text-align: center; padding: 1rem; }
.hb-mc-icon{
    display:inline-flex; align-items:center; justify-content:center;
    width: 88px; height: 88px;
    border: 0;
    border-radius: 50%;
    background: var(--hb-primary-bg);
    color: var(--hb-cta-hover); font-size: 1.85rem;
    margin-bottom: 1rem;
    box-shadow: var(--hb-shadow-card);
}
.hb-mc-col:nth-child(4n+2) .hb-mc-icon{ background: var(--hb-bg-mint); color: #3a9e8c; }
.hb-mc-col:nth-child(4n+3) .hb-mc-icon{ background: var(--hb-bg-cream); color: #c49a3c; }
.hb-mc-col:nth-child(4n+4) .hb-mc-icon{ background: var(--hb-bg-sky); color: #4a9eab; }
.hb-mc-col-img{ width: 96px; height: 96px; object-fit: cover; border-radius: 50%; margin: 0 auto 1rem; box-shadow: var(--hb-shadow-card); }
.hb-mc-col-title{ font-family: var(--hb-font-display); font-size: 1.2rem; margin-bottom: .5rem; color: var(--hb-text-strong); }
.hb-mc-col-text{ color: var(--hb-text-soft); font-size: .9rem; }

/* ---------- 11) Collapsible content (FAQ) ---------- */
.hb-cc{ padding-block: clamp(2.5rem, 5vw, 4.5rem); }
.hb-cc-inner{ max-width: 780px; margin: 0 auto; }
.hb-cc-title{ text-align: center; font-family: var(--hb-font-display); font-size: clamp(24px, 2.6vw, 36px); margin-bottom: 1.75rem; }
.hb-cc .accordion-button{
    background: var(--hb-bg-soft);
    color: var(--hb-text);
    font-weight: 500;
    border-radius: var(--hb-radius);
    padding: 1rem 1.25rem;
}
.hb-cc .accordion-button:not(.collapsed){
    background: var(--hb-bg-cream);
    color: var(--hb-text);
    box-shadow: none;
}
.hb-cc .accordion-button:focus { box-shadow: none; border-color: var(--hb-primary); }
.hb-cc .accordion-item{
    border: 1px solid var(--hb-border);
    margin-bottom: .5rem;
    border-radius: var(--hb-radius);
    overflow: hidden;
}
.hb-cc .accordion-body{ background: var(--hb-bg); color: var(--hb-text-soft); }

/* ---------- 12) Email signup ---------- */
.hb-es{
    padding-block: clamp(2.5rem, 5vw, 4.5rem);
    background: var(--hb-bg-soft);
    text-align: center;
}
.hb-es-inner{ max-width: 640px; margin: 0 auto; }
.hb-es-title{ font-family: var(--hb-font-display); font-size: clamp(24px, 2.6vw, 36px); margin-bottom: .5rem; }
.hb-es-text{ color: var(--hb-muted); margin-bottom: 1.5rem; font-size: .9rem; }
.hb-es-form{
    display:flex; align-items:center;
    background: var(--hb-bg);
    border: 1px solid var(--hb-border);
    border-radius: var(--hb-radius-pill);
    padding: 4px 4px 4px 18px;
    max-width: 480px; margin: 0 auto;
}
.hb-es-input{ flex:1; background:transparent; border:0; outline:0; height:44px; font-size:.9rem; }
.hb-es-btn{
    height: 40px; padding: 0 1.5rem;
    background: var(--hb-text); color: var(--hb-bg);
    border: 0; border-radius: var(--hb-radius-pill);
    font-size: .8rem; letter-spacing: .12em; text-transform: uppercase; font-weight: 600;
    transition: background var(--hb-tr-fast);
}
.hb-es-btn:hover{ background: var(--hb-primary-dark); }
.hb-es-msg{ font-size: .85rem; margin-top: .75rem; min-height: 1.2em; }
.hb-es-gdpr{ font-size: .75rem; color: var(--hb-muted); margin-top: 1rem; }

/* ---------- 13) Video ---------- */
.hb-vid{ padding-block: clamp(2rem, 4vw, 3.5rem); }
.hb-vid-title{ text-align:center; font-family: var(--hb-font-display); font-size: clamp(24px, 2.6vw, 36px); margin-bottom: 1.25rem; }
.hb-vid-frame{
    position: relative;
    aspect-ratio: 16/9;
    overflow: hidden; border-radius: var(--hb-radius-card);
    background: #000;
}
.hb-vid-frame iframe,
.hb-vid-frame video{
    position:absolute; inset:0; width:100%; height:100%; border:0;
}

/* ---------- 14) Blog posts ---------- */
.hb-bp{ padding-block: clamp(2.5rem, 5vw, 4.5rem); }
.hb-bp-title{ text-align:center; font-family: var(--hb-font-display); font-size: clamp(24px, 2.6vw, 36px); margin-bottom: 2rem; }
.hb-bp-card{
    background: var(--hb-bg);
    border: 1px solid var(--hb-border);
    border-radius: var(--hb-radius-card);
    overflow: hidden;
    transition: box-shadow var(--hb-tr), transform var(--hb-tr-fast);
}
.hb-bp-card:hover{ box-shadow: var(--hb-shadow-hover); transform: translateY(-2px); }
.hb-bp-img{ width: 100%; aspect-ratio: 16/9; object-fit: cover; }
.hb-bp-body{ padding: 1.25rem; }
.hb-bp-meta{ font-size: .75rem; color: var(--hb-muted); letter-spacing: .1em; text-transform: uppercase; margin-bottom: .5rem; }
.hb-bp-h{ font-family: var(--hb-font-display); font-size: 1.25rem; margin: 0 0 .5rem; }
.hb-bp-excerpt{ font-size: .85rem; color: var(--hb-text-soft); }

/* ---------- 15) Custom HTML ---------- */
.hb-html{ padding-block: 1rem; }

/* ---------- 16) Page content (CMS) ---------- */
.hb-pc{ padding-block: clamp(2rem, 4vw, 3.5rem); }
.hb-pc-title{ font-family: var(--hb-font-display); font-size: clamp(28px, 3vw, 42px); margin-bottom: 1.25rem; }
.hb-pc-body{ color: var(--hb-text-soft); line-height: 1.8; }
.hb-pc-body img{ border-radius: var(--hb-radius-card); }

/* ---------- 17) Contact form ---------- */
.hb-cf{ padding-block: clamp(2.5rem, 5vw, 4.5rem); }
.hb-cf-inner{ max-width: 720px; margin: 0 auto; }
.hb-cf-title{ font-family: var(--hb-font-display); font-size: clamp(24px, 2.6vw, 36px); margin-bottom: .5rem; text-align: center; }
.hb-cf-desc{ color: var(--hb-muted); margin-bottom: 2rem; text-align: center; font-size: .9rem; }
.hb-cf-form .form-control,
.hb-cf-form .form-select{
    border: 1px solid var(--hb-border);
    background: var(--hb-bg-soft);
    border-radius: var(--hb-radius);
    padding: .85rem 1rem;
    font-size: .9rem;
    color: var(--hb-text);
}
.hb-cf-form .form-control:focus{
    border-color: var(--hb-primary);
    background: var(--hb-bg);
    box-shadow: none;
}

/* ---------- 18) Campaign cart bundle (PDP scope) ---------- */
.hb-cb{
    padding-block: 1.75rem;
    background: var(--hb-bg-soft);
    border-radius: var(--hb-radius-card);
}
.hb-cb-heading{
    font-family: var(--hb-font-display);
    font-weight: 500;
    font-size: clamp(20px, 2.2vw, 30px);
    color: var(--hb-text);
    margin: 0 0 .35rem;
    text-align: left;
}
.hb-cb-meta{
    font-size: .8rem; color: var(--hb-muted);
    margin: 0 0 1.5rem;
    letter-spacing: .04em;
}
.hb-cb-meta strong { color: var(--hb-text); font-weight: 600; }

.hb-cb-grid{
    display: flex; flex-direction: column;
    gap: .75rem;
}

.hb-cb-card{
    display: flex;
    align-items: stretch;
    gap: 1rem;
    padding: 1rem;
    background: var(--hb-bg);
    border: 1px solid var(--hb-border);
    border-radius: var(--hb-radius-card);
    transition: border-color var(--hb-tr-fast), box-shadow var(--hb-tr-fast);
}
.hb-cb-card:hover{
    border-color: var(--hb-border-strong);
    box-shadow: var(--hb-shadow-card);
}
.hb-cb-x-card{
    border-color: var(--hb-primary);
    background: var(--hb-bg);
}
.hb-cb-y-row--disabled{
    opacity: .7;
    background: var(--hb-bg-soft);
}

.hb-cb-card-img{
    flex-shrink: 0;
    width: 88px; height: 88px;
    border-radius: var(--hb-radius);
    overflow: hidden;
    background: var(--hb-bg-cream);
}
.hb-cb-card-img img{
    width: 100%; height: 100%;
    object-fit: cover;
    display: block;
}
.hb-cb-card-img-ph{
    width: 100%; height: 100%;
    display: flex; align-items: center; justify-content: center;
    color: var(--hb-muted);
    font-size: 1.5rem;
}

.hb-cb-card-body{
    flex: 1; min-width: 0;
    display: flex; flex-direction: column;
    gap: .35rem;
}

.hb-cb-card-head{
    display: flex; align-items: flex-start; justify-content: space-between;
    gap: .5rem;
}
.hb-cb-card-title{
    font-size: .9rem; font-weight: 500;
    color: var(--hb-text);
    line-height: 1.35;
    display: -webkit-box;
    -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical;
    overflow: hidden;
}

.hb-cb-included-badge{
    flex-shrink: 0;
    display: inline-flex; align-items: center; justify-content: center;
    width: 22px; height: 22px;
    background: var(--hb-primary);
    color: #fff;
    font-size: .7rem; font-weight: 700;
    border-radius: 50%;
    line-height: 1;
}

.hb-cb-switch .form-check-input{
    width: 2.4em; height: 1.3em;
    margin-top: .15em;
    border-color: var(--hb-border);
    background-color: var(--hb-bg-cream);
}
.hb-cb-switch .form-check-input:checked{
    background-color: var(--hb-primary);
    border-color: var(--hb-primary);
}
.hb-cb-switch .form-check-input:focus{ box-shadow: 0 0 0 .15rem rgba(184,132,104,.25); }

.hb-cb-card-prices{
    display: flex; flex-wrap: wrap; align-items: center;
    gap: .35rem .5rem;
}
.hb-cb-badge-pct{
    display: inline-block;
    padding: 2px 8px;
    background: var(--hb-discount); color: #fff;
    font-size: .65rem; font-weight: 700;
    border-radius: var(--hb-radius);
    letter-spacing: .04em;
    line-height: 1.4;
}
.hb-cb-price-old{
    font-size: .8rem;
    color: var(--hb-muted);
    text-decoration: line-through;
}
.hb-cb-price-new{
    font-size: .95rem; font-weight: 600;
    color: var(--hb-text);
}
.hb-cb-x-card .hb-cb-price-new{ color: var(--hb-primary-dark); }
.hb-cb-price-note{
    font-size: .7rem;
    color: var(--hb-muted);
    margin-left: .25rem;
}
.hb-cb-card-note{
    font-size: .7rem; color: var(--hb-muted);
    letter-spacing: .04em;
}
.hb-cb-opt-link{
    display: inline-block;
    margin-top: .25rem;
    font-size: .8rem;
    color: var(--hb-primary);
    text-decoration: none;
    border-bottom: 1px solid currentColor;
    padding-bottom: 1px;
}
.hb-cb-opt-link:hover{ color: var(--hb-primary-dark); }

/* aside */
.hb-cb-aside{
    background: var(--hb-bg);
    border: 1px solid var(--hb-border);
    border-radius: var(--hb-radius-card);
    padding: 1.25rem;
    height: 100%;
    position: sticky; top: 100px;
}
@media (max-width: 991.98px){
    .hb-cb-aside{ position: static; }
}
.hb-cb-aside-info{
    display: flex; gap: .5rem;
    font-size: .8rem; color: var(--hb-muted);
    margin-bottom: 1.25rem;
    line-height: 1.45;
}
.hb-cb-aside-info i{ flex-shrink: 0; margin-top: 2px; color: var(--hb-primary); }

.hb-cb-aside-totals{ margin-bottom: 1.25rem; }

.hb-cb-sum-line{
    margin-bottom: .85rem;
    padding-bottom: .85rem;
    border-bottom: 1px solid var(--hb-border);
}
.hb-cb-sum-row{
    display: flex; justify-content: space-between; align-items: baseline;
    gap: .5rem;
    font-size: .85rem;
    color: var(--hb-text-soft);
}
.hb-cb-sum-row span:last-child{
    font-weight: 500; color: var(--hb-text);
}
.hb-cb-sum-hint{
    margin: .25rem 0 0;
    font-size: .7rem; color: var(--hb-muted);
    line-height: 1.4;
}
.hb-cb-kazanc{ color: #128653; font-weight: 600 !important; }

.hb-cb-sum-total{
    border-bottom: 0;
    margin-bottom: 0;
    padding-bottom: 0;
    padding-top: .5rem;
}
.hb-cb-sum-total-label{
    font-size: .75rem; color: var(--hb-muted);
    text-transform: uppercase; letter-spacing: .14em;
    margin-bottom: .25rem;
}
.hb-cb-total{
    font-family: var(--hb-font-display);
    font-size: clamp(22px, 2.4vw, 28px);
    font-weight: 600;
    color: var(--hb-text);
}

.hb-cb-submit{
    margin-top: .5rem;
    width: 100%;
}
.hb-cb-submit:disabled{ opacity: .5; cursor: not-allowed; }

/* =================================================================
   Product card — compact square storefront card
   ================================================================= */
.hb-pc{
    position: relative;
    background: var(--hb-bg);
}

.hb-pc-img-wrap{
    position: relative;
    overflow: hidden;
    aspect-ratio: 1 / 1;
    background: #fff;
}
.hb-pc-img-link{
    display: block;
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    text-decoration: none;
}
.hb-pc-img{
    width: 100%; height: 100%; object-fit: cover;
    transition: none;
    display: block;
}
.hb-pc:hover .hb-pc-img{ transform: none; }
.hb-pc-img-ph{
    width: 100%; height: 100%;
    display: flex; align-items: center; justify-content: center;
    color: var(--hb-muted); font-size: 2rem;
}

.hb-pc-badges{
    position: absolute; top: 12px; left: 12px;
    display: flex; flex-direction: column; gap: 6px;
    z-index: 2;
    align-items: flex-start;
}
.hb-pc-badge{
    display: inline-block;
    padding: 4px 11px;
    background: #ffffff;
    color: var(--hb-text-strong);
    border-radius: var(--hb-radius-pill);
    font-size: .7rem;
    font-weight: 500;
    letter-spacing: .02em;
    line-height: 1.25;
    box-shadow: 0 1px 3px rgba(43,38,34,.06);
    white-space: nowrap;
}
.hb-pc-badge--new{ background: #ffffff; color: var(--hb-text-strong); }
.hb-pc-badge--discount{
    background: var(--hb-primary-bg);
    color: var(--hb-discount);
}
.hb-pc-badge--out{ background: var(--hb-bg-cream); color: var(--hb-text-strong); }

/* ---------- Product card action stack (favori / hizli goruntule / paylas) ----------
   Default state: sadece kalp ikonu, beyaz daire + soft shadow (image 2 gibi)
   Hover state: 3 ikon birden gozukur, hepsi beyaz daire (image 1 gibi) */
.hb-pc-actions{
    position: absolute; top: 12px; right: 12px;
    display: flex; flex-direction: column; gap: 8px;
    z-index: 3;
}
.hb-pc-act{
    width: 36px; height: 36px;
    background: #ffffff;
    border: 0;
    color: var(--hb-text-strong);
    font-size: .95rem;
    display: inline-flex; align-items: center; justify-content: center;
    border-radius: 50%;
    cursor: pointer;
    text-decoration: none;
    box-shadow: 0 2px 8px rgba(43,38,34,.10);
    transition:
        opacity .25s ease,
        transform .25s ease,
        background var(--hb-tr-fast),
        box-shadow var(--hb-tr-fast),
        color var(--hb-tr-fast);
}
.hb-pc-act > i{ line-height: 1; }
.hb-pc-act:focus-visible{
    outline: 2px solid var(--hb-primary);
    outline-offset: 2px;
}

/* Default: sadece favori gozuksun, view ve share gizli ve yukaridan kayar */
.hb-pc-act--view,
.hb-pc-act--share{
    opacity: 0;
    transform: translateY(-8px) scale(.85);
    pointer-events: none;
}

/* Hover: view ve share da gorunur olsun, asagi dogru kayar (stagger) */
.hb-pc:hover .hb-pc-act--view,
.hb-pc:focus-within .hb-pc-act--view,
.hb-pc:hover .hb-pc-act--share,
.hb-pc:focus-within .hb-pc-act--share{
    opacity: 1;
    transform: translateY(0) scale(1);
    pointer-events: auto;
}
.hb-pc:hover .hb-pc-act--view,
.hb-pc:focus-within .hb-pc-act--view{ transition-delay: .04s; }
.hb-pc:hover .hb-pc-act--share,
.hb-pc:focus-within .hb-pc-act--share{ transition-delay: .09s; }

/* Hover ikonun uzerine gelince: pembe renk + hafif buyume */
.hb-pc-act:hover{
    color: var(--hb-primary);
    transform: scale(1.1);
    box-shadow: 0 4px 12px rgba(43,38,34,.16);
}
.hb-pc-act.is-active{ color: var(--hb-primary); }
.hb-pc-act.is-active i{ color: var(--hb-primary); }
.hb-pc-act--fav.is-active i::before{ content: "\f415"; }
.hb-pc-act.is-copied{ color: var(--hb-primary); }

/* Touch cihazlar (hover yok): 3 ikon hep gozuksun */
@media (hover: none){
    .hb-pc-act--view,
    .hb-pc-act--share{
        opacity: 1;
        transform: none;
        pointer-events: auto;
    }
}

.hb-pc-body{
    padding: .85rem .25rem 1.5rem;
    text-align: center;
}

.hb-pc-title{
    font-family: var(--hb-font-body);
    font-size: .9rem;
    font-weight: bold;
    color: var(--hb-text-strong);
    margin: 0 0 .5rem;
    line-height: 1.4;
    display: -webkit-box;
    -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical;
    overflow: hidden;
    min-height: 2.4em;
}
.hb-pc-title a { color: inherit; }
.hb-pc-title a:hover { color: var(--hb-text-strong); text-decoration: none; }

.hb-pc-price{
    font-size: .85rem;
    color: var(--hb-text);
    display: inline-flex; align-items: baseline; gap: .55rem;
    flex-wrap: wrap;
    justify-content: center;
}
.hb-pc-price .hb-pc-old{
    text-decoration: line-through;
    color: var(--hb-muted);
    font-weight: 400;
}
.hb-pc-price .hb-pc-new{
    color: var(--hb-discount);
    font-weight: 500;
}

/* .hb-pc-hover artik kullanilmiyor (template'lerden kaldirildi).
   Hover-only davranis hb-pc-actions ile saglaniyor. */

/* ============================================================
   Home: 2-kolon image banner (kategori gorselleri ile)
   Edge-to-edge, padding container token ile sekmeyi onler.
   ============================================================ */
.hb-home-banners{
    margin: clamp(28px, 4vw, 56px) 0;
}
.hb-home-banners-grid{
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 4px;
    padding: 0 var(--hb-container-pad, 16px);
}
.hb-home-banner{
    position: relative;
    display: block;
    aspect-ratio: 4 / 5;
    overflow: hidden;
    color: #fff;
    background: var(--hb-bg-soft);
    text-decoration: none;
}
.hb-home-banner-img{
    position: absolute; inset: 0;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    transition: transform .8s ease;
}
.hb-home-banner:hover .hb-home-banner-img{ transform: scale(1.04); }
.hb-home-banner-overlay{
    position: absolute; inset: 0;
    background: linear-gradient(180deg, rgba(0,0,0,0) 35%, rgba(0,0,0,.42) 100%);
    pointer-events: none;
}
.hb-home-banner-content{
    position: absolute;
    left: 0; right: 0; bottom: clamp(20px, 3vw, 40px);
    padding: 0 clamp(18px, 3vw, 36px);
    display: flex; flex-direction: column; align-items: flex-start; gap: .35rem;
    color: #fff;
}
.hb-home-banner-eyebrow{
    font-size: .68rem;
    letter-spacing: .22em;
    text-transform: uppercase;
    opacity: .9;
}
.hb-home-banner-title{
    font-family: var(--hb-font-display);
    font-size: clamp(20px, 2.4vw, 32px);
    font-weight: 400;
    line-height: 1.2;
    letter-spacing: .01em;
}
.hb-home-banner-cta{
    display: inline-block;
    margin-top: .35rem;
    padding-bottom: 2px;
    font-size: .76rem;
    letter-spacing: .14em;
    text-transform: uppercase;
    border-bottom: 1px solid rgba(255,255,255,.7);
    transition: border-color .25s ease, transform .25s ease;
}
.hb-home-banner:hover .hb-home-banner-cta{
    border-bottom-color: #fff;
    transform: translateX(4px);
}
@media (max-width: 767.98px){
    .hb-home-banners-grid{ grid-template-columns: 1fr; gap: 4px; }
    .hb-home-banner{ aspect-ratio: 16 / 11; }
    .hb-home-banner-content{ bottom: 18px; padding: 0 18px; }
}

/* ============================================================
   Home: Newsletter teaser (krem zemin, ortalı, sıcak)
   ============================================================ */
.hb-home-nl-teaser{
    background: var(--hb-bg-soft);
    padding: clamp(40px, 5vw, 72px) 0;
    margin-top: clamp(28px, 4vw, 56px);
}
.hb-home-nl-inner{
    max-width: 560px;
    margin: 0 auto;
    text-align: center;
}
.hb-home-nl-eyebrow{
    display: inline-block;
    font-size: .7rem;
    letter-spacing: .22em;
    text-transform: uppercase;
    color: var(--hb-primary);
    margin-bottom: .65rem;
}
.hb-home-nl-title{
    font-family: var(--hb-font-display);
    font-size: clamp(22px, 2.4vw, 30px);
    font-weight: 700;
    line-height: 1.3;
    color: var(--hb-text-strong);
    margin: 0 0 .65rem;
    letter-spacing: .005em;
}
.hb-home-nl-text{
    color: var(--hb-text-soft);
    font-size: .9rem;
    line-height: 1.6;
    margin: 0 0 1.4rem;
}
.hb-home-nl-form{
    display: flex;
    align-items: center;
    background: #fff;
    border: 1px solid var(--hb-border);
    border-radius: var(--hb-radius-pill);
    padding: 5px 5px 5px 18px;
    overflow: hidden;
    gap: 6px;
}
.hb-home-nl-input{
    flex: 1; min-width: 0;
    background: transparent; border: 0; outline: 0;
    height: 40px;
    font-family: inherit; font-size: .88rem;
    color: var(--hb-text-strong);
}
.hb-home-nl-input::placeholder{ color: var(--hb-muted); }
.hb-home-nl-btn{
    display: inline-flex; align-items: center; justify-content: center;
    height: 38px; padding: 0 1.25rem;
    background: var(--hb-cta); color: #fff;
    border: 0;
    border-radius: var(--hb-radius-pill);
    font-size: .76rem; font-weight: 500; letter-spacing: .14em; text-transform: uppercase;
    white-space: nowrap;
    transition: background var(--hb-tr-fast);
}
.hb-home-nl-btn:hover{ background: var(--hb-cta-hover); }
.hb-home-nl-btn i{ font-size: .9rem; }

/* Ürün kartı = article.hb-pc; CMS blok da .hb-pc kullanıyor — kartlara CMS sayfa padding'i binmesin */
article.hb-pc[data-product-id]{
    padding-block: 0;
}

/* ============================================================
   Listing grid: 4 kolon sabit (referans), gutter reference-layout’ta
   ============================================================ */
.hb-listing-page-wrap.container-fluid{
    max-width: 100%;
}
#myt-category-product-grid,
#myt-search-results-grid{
    --bs-gutter-y: 2rem;
}

/* =================================================================
   Reference-aligned homepage composition
   ================================================================= */
.hb-slideshow .hb-slide-content{
    max-width:430px;
    margin-left:clamp(28px,14vw,220px);
    margin-right:auto;
    text-align:center;
}
.hb-slide-title{
    font-size:clamp(42px,5vw,72px);
    font-weight:800;
    line-height:.96;
    text-transform:none;
    text-shadow:none;
}
.hb-slide-text{
    font-family:var(--hb-font-display);
    font-size:1rem;
    font-weight:700;
    letter-spacing:0;
    text-transform:none;
    text-shadow:none;
}
.hb-slide-cta{
    min-width:210px;
    justify-content:center;
    padding:13px 30px;
    border-radius:var(--hb-radius);
    font-family:var(--hb-font-display);
    font-size:.85rem;
    font-weight:800;
}

.hb-mc{ padding-block:50px; overflow:hidden; }
.hb-mc .row{
    --bs-gutter-x:clamp(16px,2.4vw,32px);
    --bs-gutter-y:32px;
    justify-content:center;
}
.hb-mc-col{
    display:flex;
    flex-direction:column;
    align-items:center;
    height:100%;
    padding:0 8px;
}
.hb-mc-icon{
    width:clamp(84px,8vw,112px);
    height:clamp(84px,8vw,112px);
    flex:0 0 auto;
    margin:0 0 16px;
    border:2px solid rgba(255,255,255,.9);
    box-shadow:0 0 0 1px var(--hb-primary),0 8px 24px rgba(74,33,26,.08);
    font-size:2rem;
}
.hb-mc-col-title{
    margin:0 0 6px;
    position:relative;
    z-index:1;
    color:var(--hb-text-strong);
    font-size:1rem;
    line-height:1.3;
}
.hb-mc-col-text{
    position:relative;
    z-index:1;
    max-width:240px;
    color:var(--hb-text-soft);
    font-size:.82rem;
    line-height:1.45;
}
.hb-mc-col-text p{ margin:0; }

.hb-collage{ padding-block:0; }
.hb-collage .container,.hb-collage .container-fluid{ padding-inline:0; }
.hb-collage-grid{
    grid-template-columns:repeat(3,1fr) !important;
    grid-auto-rows:min(25vw,322px);
    gap:0;
}
.hb-collage-item{
    height:100%;
    min-height:0;
    aspect-ratio:auto !important;
    border-radius:0;
    border:5px solid #fff;
}
.hb-collage-item:nth-child(1){ grid-row:span 2; }
.hb-collage-item:nth-child(2),
.hb-collage-item:nth-child(5){ grid-column:span 2; }
.hb-collage-label{
    padding:18px;
    font-size:clamp(1rem,2vw,1.75rem);
    font-weight:800;
    text-align:center;
}

.hb-iwt{
    background:var(--hb-bg-cream);
    min-height:483px;
    display:flex;
    align-items:center;
}
.hb-iwt .container{ padding-inline:0; }
.hb-iwt-grid{
    grid-template-columns:1fr 2fr;
    gap:0;
    min-height:483px;
}
.hb-iwt--image-right .hb-iwt-grid{ direction:ltr; }
.hb-iwt--image-right .hb-iwt-img-wrap{ grid-column:2; grid-row:1; }
.hb-iwt--image-right .hb-iwt-text{ grid-column:1; grid-row:1; }
.hb-iwt-img-wrap{
    border-radius:0;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:50px clamp(30px,12vw,200px);
}
.hb-iwt-img{
    width:100%;
    max-height:403px;
    aspect-ratio:1.11/1 !important;
    object-fit:cover;
}
.hb-iwt-text{
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    text-align:center !important;
    padding:50px 34px;
}
.hb-iwt-title{
    color:var(--hb-primary);
    font-size:clamp(42px,6vw,80px);
    font-weight:800;
    line-height:.9;
}
.hb-iwt-body{
    color:var(--hb-muted);
    font-family:var(--hb-font-display);
    font-size:1.1rem;
    font-weight:700;
    line-height:1.45;
}
.hb-iwt .hb-btn{
    min-width:230px;
    justify-content:center;
    background:var(--hb-primary);
    border-color:var(--hb-primary);
    color:var(--hb-on-primary);
    font-family:var(--hb-font-display);
    font-weight:800;
}

.hb-fc{ padding-block:50px 0; }
.hb-fc-layout--promo{
    display:grid;
    grid-template-columns:1fr 2fr;
    gap:0;
    align-items:stretch;
}
.hb-fc-promo{ display:block; min-height:100%; overflow:hidden; }
.hb-fc-promo img{ width:100%; height:100%; object-fit:cover; display:block; }
.hb-fc-products{ min-width:0; }
.hb-fc-layout--promo .hb-fc-products > .row{
    --bs-gutter-x:0;
    --bs-gutter-y:0;
    margin:0;
}
.hb-fc-layout--promo .hb-pc{ padding:5px; }

/* Kart tipografisi / CTA — yalnızca ürün kartı; CMS .hb-pc ile çakışmasın */
article.hb-pc[data-product-id] .hb-pc-img-wrap{
    aspect-ratio:1/1;
    background:#fff;
}
article.hb-pc[data-product-id] .hb-pc-body{
    padding:12px 0 20px;
    text-align:left;
}
article.hb-pc[data-product-id] .hb-pc-title{
    min-height:0;
    margin:0 0 6px;
    font-family:var(--hb-font-body);
    font-size:18px;
    font-weight:500;
    line-height:1.3;
    -webkit-line-clamp:2;
    line-clamp:2;
}
article.hb-pc[data-product-id] .hb-pc-price{
    justify-content:flex-start;
    font-family:var(--hb-font-body);
    font-size:18px;
    font-weight:700;
}
article.hb-pc[data-product-id] .hb-pc-price .hb-pc-new{ color:#212121; font-weight:700; }
article.hb-pc[data-product-id] .hb-pc-price .hb-pc-old{ color:#ed2727; font-weight:600; text-decoration:line-through; }
article.hb-pc[data-product-id] .hb-pc-badges{ top:10px; left:10px; }
article.hb-pc[data-product-id] .hb-pc-badge{
    padding:5px 8px;
    border-radius:4px;
    background:#fff;
    color:#212121;
    box-shadow:none;
    font-family:var(--hb-font-body);
    font-size:12px;
    font-weight:500;
    letter-spacing:0;
    text-transform:none;
}
article.hb-pc[data-product-id] .hb-pc-badge--new{ background:#fff; color:#212121; }
article.hb-pc[data-product-id] .hb-pc-badge--discount{ background:#ed2727; color:#fff; }
article.hb-pc[data-product-id] .hb-pc-actions{ top:10px; right:10px; }
article.hb-pc[data-product-id] .hb-pc-act{ width:34px; height:34px; }
article.hb-pc[data-product-id] .hb-pc-buy{ padding:12px 0 0; }
article.hb-pc[data-product-id] .hb-pc-cart-btn{
    display:flex;
    width:100%;
    height:36px;
    min-height:36px;
    padding:0 14px;
    align-items:center;
    justify-content:center;
    gap:6px;
    border:0;
    border-radius:4px;
    background:#4a211a;
    color:#fff;
    font-family:var(--hb-font-body);
    font-size:14px;
    font-weight:500;
    text-transform:none;
    letter-spacing:0;
}
article.hb-pc[data-product-id] .hb-pc-cart-btn:hover{ background:#5d3028; color:#fff; }

.hb-rt{ background:#f7f7f7; padding-block:90px; }
.hb-rt-title{
    color:var(--hb-text-soft);
    font-size:clamp(38px,5vw,60px);
    font-weight:800;
}
.hb-rt-body{
    font-family:var(--hb-font-display);
    font-size:1.1rem;
    font-weight:700;
}

@media (max-width:767.98px){
    .hb-slideshow .hb-slide-content{
        max-width:48%;
        margin-left:5%;
        padding:10px 0;
    }
    .hb-slide-title{ font-size:clamp(24px,8vw,34px); }
    .hb-slide-text{ font-size:.58rem; line-height:1.25; margin-bottom:8px; }
    .hb-slide-cta{ min-width:0; padding:7px 15px; font-size:.56rem; }
    .hb-slideshow .swiper-button-next,.hb-slideshow .swiper-button-prev{ display:none; }

    .hb-mc{ padding-block:24px; }
    .hb-mc-title{ display:none; }
    .hb-mc .row{
        --bs-gutter-x:16px;
        --bs-gutter-y:24px;
        flex-wrap:wrap;
    }
    .hb-mc-icon{
        width:72px;
        height:72px;
        margin-bottom:10px;
        font-size:1.35rem;
        border-width:2px;
        box-shadow:0 0 0 1px var(--hb-primary);
    }
    .hb-mc-col-title{ margin:0 0 4px; font-size:.78rem; line-height:1.25; }
    .hb-mc-col-text{ display:block; font-size:.68rem; line-height:1.35; }

    .hb-collage-grid{ grid-auto-rows:145px; }
    .hb-collage-item{ border-width:3px; }
    .hb-collage-label{ padding:8px; font-size:.7rem; }

    .hb-iwt{ min-height:0; padding-block:50px !important; }
    .hb-iwt-grid,.hb-iwt--image-right .hb-iwt-grid{
        grid-template-columns:1fr;
        min-height:0;
    }
    .hb-iwt--image-right .hb-iwt-img-wrap,
    .hb-iwt--image-right .hb-iwt-text{ grid-column:1; }
    .hb-iwt--image-right .hb-iwt-text{ grid-row:1; }
    .hb-iwt--image-right .hb-iwt-img-wrap{ grid-row:2; }
    .hb-iwt-text{ padding:0 25px 30px; }
    .hb-iwt-title{ font-size:46px; }
    .hb-iwt-body{ font-size:.9rem; }
    .hb-iwt-img-wrap{ padding:0 50px; }
    .hb-iwt-img{ max-height:300px; }

    .hb-fc{ padding-block:10px 0; }
    .hb-fc-layout--promo{ grid-template-columns:1fr; }
    .hb-fc-promo{ aspect-ratio:1/1; }
    .hb-fc-layout--promo .hb-fc-products > .row > .col{ width:50%; }
    article.hb-pc[data-product-id]{ padding:0; }
    article.hb-pc[data-product-id] .hb-pc-title{ font-size:14px; font-weight:500; }
    article.hb-pc[data-product-id] .hb-pc-price{ font-size:14px; font-weight:700; }
    article.hb-pc[data-product-id] .hb-pc-actions .hb-pc-act--view,
    article.hb-pc[data-product-id] .hb-pc-actions .hb-pc-act--share{ display:none; }
    article.hb-pc[data-product-id] .hb-pc-cart-btn{ height:34px; min-height:34px; padding:0 6px; font-size:12px; font-weight:500; }

    .hb-rt{ padding-block:70px; }
    .hb-rt-title{ font-size:38px; }
    .hb-rt-body{ font-size:.9rem; }
}