/* =================================================================
   Serenza Theme — sections.css
   Tema editor section type'lari icin stiller (Glamora-standart, sz- prefix).
   - dynamic-section wrapper
   - 19 section type stili
   - product-card stilleri (Serenza boutique)
   ================================================================= */

/* ---------- 0) Dynamic section base ---------- */
.myt-dynamic-section{
    --sz-sec-color: var(--sz-text);
    --sz-sec-fw: 500;
    color: var(--sz-sec-color);
    font-weight: var(--sz-sec-fw);
}
.myt-dynamic-section h1, .myt-dynamic-section h2, .myt-dynamic-section h3, .myt-dynamic-section h4 {
    color: inherit;
}

/* ---------- 1) Marquee ---------- */
.sz-mq{
    overflow: hidden;
    background: var(--sz-bg-cream);
    color: var(--sz-text);
    padding: .85rem 0;
    border-block: 1px solid var(--sz-border);
}
.sz-mq-track{
    display:flex; align-items:center; gap: 3rem;
    white-space: nowrap;
    animation: sz-mq-scroll 24s linear infinite;
    font-size: .85rem; letter-spacing: .15em; text-transform: uppercase;
}
.sz-mq-item{ display:inline-flex; align-items:center; gap:.5rem; }
.sz-mq-sep{ opacity:.4; }
@keyframes sz-mq-scroll {
    from { transform: translateX(0); }
    to   { transform: translateX(-50%); }
}
@media (prefers-reduced-motion: reduce){
    .sz-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. */
.sz-fc .swiper:not(.swiper-initialized) > .swiper-wrapper{
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    transform: none !important;
    width: 100%;
}
.sz-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){
    .sz-fc .swiper:not(.swiper-initialized) > .swiper-wrapper > .swiper-slide{
        flex: 0 0 calc(50% - 8px); max-width: calc(50% - 8px);
    }
}
@media (min-width: 768px){
    .sz-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){
    .sz-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 */
.sz-slideshow .swiper:not(.swiper-initialized) > .swiper-wrapper,
.sz-ib .swiper:not(.swiper-initialized) > .swiper-wrapper{
    display: block;
    transform: none !important;
}
.sz-slideshow .swiper:not(.swiper-initialized) > .swiper-wrapper > .swiper-slide:not(:first-child),
.sz-ib .swiper:not(.swiper-initialized) > .swiper-wrapper > .swiper-slide:not(:first-child){
    display: none;
}
.sz-slideshow .swiper:not(.swiper-initialized) > .swiper-wrapper > .swiper-slide,
.sz-ib .swiper:not(.swiper-initialized) > .swiper-wrapper > .swiper-slide{
    width: 100% !important;
    transform: none !important;
}

/* ---------- 2) Slideshow (Hero) - duygukaya tarzi ---------- */
.sz-slideshow{ position: relative; overflow: hidden; }
.sz-slideshow .swiper{ width: 100%; }
.sz-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;
}
.sz-slide--align-left{ justify-content: flex-start; }
.sz-slide--align-center{ justify-content: center; }
.sz-slide--align-right{ justify-content: flex-end; }
@media (max-width: 767.98px){
    .sz-slide--align-left,
    .sz-slide--align-right{ justify-content: center; }
}
.sz-slide-overlay{
    position: absolute; inset: 0;
    background: rgba(0,0,0,.18);
    pointer-events: none;
}
.sz-slide-overlay--left{
    background: linear-gradient(90deg, rgba(0,0,0,.28) 0%, rgba(0,0,0,0) 55%);
}
.sz-slide-overlay--right{
    background: linear-gradient(270deg, rgba(0,0,0,.28) 0%, rgba(0,0,0,0) 55%);
}
.sz-slide-content{
    position: relative; z-index: 2;
    color: #fff;
    padding: 2rem var(--sz-container-pad);
    width: 100%;
    max-width: 540px;
    text-align: center;
}
.sz-slide--align-left .sz-slide-content{
    text-align: left;
    margin-right: auto;
    margin-left: 0;
}
.sz-slide--align-center .sz-slide-content{
    max-width: 760px;
    margin-inline: auto;
    text-align: center;
}
.sz-slide--align-right .sz-slide-content{
    text-align: right;
    margin-left: auto;
    margin-right: 0;
}
@media (max-width: 767.98px){
    .sz-slide-content{ max-width: 100%; text-align: center; margin-inline: auto; padding: 1.5rem var(--sz-container-pad); }
}
.sz-slide-eyebrow{
    display: inline-block;
    font-size: .72rem; letter-spacing: .3em; text-transform: uppercase;
    margin-bottom: 1rem; opacity: .9;
    font-weight: 500;
}
.sz-slide-title{
    font-family: var(--sz-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;
}
.sz-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;
}
.sz-slide--align-center .sz-slide-text{ margin-inline: auto; }
@media (max-width: 767.98px){
    .sz-slide-text{ margin: 0 auto 1.6rem; }
}
.sz-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(--sz-radius);
    border: 1px solid #fff;
    transition: background var(--sz-tr-fast), color var(--sz-tr-fast), border-color var(--sz-tr-fast);
}
.sz-slide-cta--solid{
    background: #fff;
    color: var(--sz-text-strong);
    border-color: #fff;
}
.sz-slide-cta--solid:hover{
    background: transparent;
    color: #fff;
    border-color: #fff;
}
.sz-slide-cta--ghost{
    background: transparent;
    color: inherit;
    border-color: currentColor;
}
.sz-slide-cta--ghost:hover{
    background: #fff;
    color: var(--sz-text-strong);
    border-color: #fff;
}
.sz-slide-overlay-link{
    position: absolute; inset: 0; z-index: 1;
}

/* swiper navigation override (scope-li) */
.sz-slideshow .swiper-button-next,
.sz-slideshow .swiper-button-prev{
    color: #fff;
    width: 44px; height: 44px;
    background: rgba(0,0,0,.35);
    border-radius: 50%;
    transition: background var(--sz-tr-fast);
}
.sz-slideshow .swiper-button-next:hover,
.sz-slideshow .swiper-button-prev:hover{ background: var(--sz-primary); }
.sz-slideshow .swiper-button-next:after,
.sz-slideshow .swiper-button-prev:after{ font-size: 1rem; font-weight: 700; }
.sz-slideshow .swiper-pagination-bullet{
    background: #fff; opacity: .5;
    width: 8px; height: 8px;
    transition: width var(--sz-tr-fast), opacity var(--sz-tr-fast);
}
.sz-slideshow .swiper-pagination-bullet-active{
    opacity: 1; width: 24px; border-radius: 4px;
}
@media (prefers-reduced-motion: reduce){
    .sz-slideshow .swiper-wrapper { animation: none !important; transition: none !important; }
}

/* ---------- 3) Featured collection ---------- */
.sz-fc{ padding-block: clamp(2.5rem, 5vw, 4.5rem); }
.sz-fc-head{
    display:flex; align-items:center; justify-content:center; gap: 1rem;
    margin-bottom: 2.5rem;
    flex-wrap: wrap;
}
.sz-fc-title-wrap{ flex: 1; min-width: 0; text-align: center; }

/* Duygukaya tarzi tek satir baslik: "MARKA - BOLUM" - uppercase, regular weight */
.sz-fc-title,
.sz-section-title,
.sz-cl .sz-fc-title{
    font-family: var(--sz-font-body);
    font-size: clamp(20px, 2vw, 26px);
    font-weight: 400;
    text-transform: uppercase;
    letter-spacing: .04em;
    text-align: center;
    color: var(--sz-text-strong);
    margin: 0 0 2.5rem;
    line-height: 1.3;
}

/* Eski eyebrow/divider artik kullanilmiyor - gizle */
.sz-fc-eyebrow,
.sz-fc-divider,
.sz-section-divider{ display: none !important; }

.sz-fc-desc { color: var(--sz-muted); font-size: .9rem; max-width: 600px; margin: -1.5rem auto 2rem; text-align: center; }

.sz-fc-view-all{
    display:inline-flex; align-items:center; gap:.4rem;
    color: var(--sz-text-strong); font-size: .78rem; letter-spacing: .14em; text-transform: uppercase; font-weight: 500;
    border-bottom: 1px solid var(--sz-text-strong); padding-bottom: 2px;
    transition: color var(--sz-tr-fast), border-color var(--sz-tr-fast);
}
.sz-fc-view-all:hover { color: var(--sz-primary); border-bottom-color: var(--sz-primary); }

/* ---------- 4) Featured product ---------- */
.sz-fp{ padding-block: clamp(2.5rem, 5vw, 4.5rem); }
.sz-fp-grid{
    display:grid;
    grid-template-columns: 1fr 1fr;
    gap: clamp(1.5rem, 4vw, 4rem);
    align-items: center;
}
@media (max-width: 767.98px){ .sz-fp-grid{ grid-template-columns: 1fr; } }
.sz-fp-img{
    width: 100%; aspect-ratio: 4/5; object-fit: cover;
    border-radius: var(--sz-radius-card);
}
.sz-fp-eyebrow{ font-size:.7rem; letter-spacing:.3em; text-transform:uppercase; color: var(--sz-primary); }
.sz-fp-title{ font-family: var(--sz-font-display); font-size: clamp(28px, 3vw, 42px); margin: .5rem 0 .75rem; }
.sz-fp-desc { color: var(--sz-text-soft); margin-bottom: 1rem; }
.sz-fp-price{ font-size: 1.1rem; margin-bottom: 1.25rem; }
.sz-fp-price .old{ text-decoration: line-through; color: var(--sz-muted); margin-right: .5rem; }
.sz-fp-price .new{ color: var(--sz-discount); font-weight: 600; }

/* ---------- 5) Collection list ---------- */
.sz-cl{ padding-block: clamp(2rem, 4vw, 3.5rem); }
.sz-cl-item{
    position: relative;
    aspect-ratio: 4/5;
    overflow: hidden;
    border-radius: var(--sz-radius-card);
    background: var(--sz-bg-cream);
}
.sz-cl-item img{
    width:100%; height:100%; object-fit:cover;
    transition: transform .6s ease;
}
.sz-cl-item:hover img { transform: scale(1.05); }
.sz-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(--sz-font-display); font-size: 1.4rem; font-weight: 500;
    text-align: center;
    letter-spacing: .02em;
}

/* ---------- 6) Rich text ---------- */
.sz-rt{ padding-block: clamp(2.5rem, 5vw, 4.5rem); }
.sz-rt-inner{ max-width: 760px; margin: 0 auto; text-align: center; }
.sz-rt-title{
    font-family: var(--sz-font-display);
    font-size: clamp(24px, 2.6vw, 36px); font-weight: 500;
    margin-bottom: 1rem;
}
.sz-rt-body{ color: var(--sz-text-soft); line-height: 1.8; }
.sz-rt-body p { margin-bottom: 1rem; }
.sz-rt-cta{ margin-top: 1.5rem; }

/* ---------- 7) Image with text ---------- */
.sz-iwt{ padding-block: clamp(2.5rem, 5vw, 4.5rem); }
.sz-iwt-grid{
    display:grid; grid-template-columns: 1fr 1fr;
    gap: clamp(1.5rem, 4vw, 4rem);
    align-items: center;
}
.sz-iwt--image-right .sz-iwt-grid { direction: rtl; }
.sz-iwt--image-right .sz-iwt-text { direction: ltr; }
.sz-iwt--image-right .sz-iwt-img-wrap { direction: ltr; }
@media (max-width: 767.98px){ .sz-iwt-grid{ grid-template-columns: 1fr; direction: ltr; } }

.sz-iwt-img-wrap{ overflow: hidden; border-radius: var(--sz-radius-card); }
.sz-iwt-img{ width: 100%; aspect-ratio: 1/1; object-fit: cover; transition: transform .6s ease; }
.sz-iwt-img-wrap:hover .sz-iwt-img { transform: scale(1.04); }
.sz-iwt-eyebrow{ font-size:.7rem; letter-spacing:.3em; text-transform:uppercase; color: var(--sz-primary); }
.sz-iwt-title{ font-family: var(--sz-font-display); font-size: clamp(24px, 2.6vw, 36px); margin: .5rem 0 .75rem; }
.sz-iwt-body{ color: var(--sz-text-soft); }

/* ---------- 8) Image banner ---------- */
.sz-ib{ padding-block: 0; }
.sz-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){ .sz-ib-slide{ aspect-ratio: 4/5; } }
.sz-ib-overlay{ position: absolute; inset: 0; pointer-events: none; }
.sz-ib-content{
    position: relative; z-index: 2;
    text-align: center;
    width: 100%;
    padding: 1rem var(--sz-container-pad);
}
.sz-ib-title{ font-family: var(--sz-font-display); font-size: clamp(28px, 4vw, 56px); margin-bottom: .5rem; color: inherit; }
.sz-ib-subtitle{ font-size: clamp(.9rem, 1.4vw, 1.1rem); margin-bottom: 1.4rem; opacity: .95; }
.sz-ib-btn{
    display:inline-flex; align-items:center; gap:.5rem;
    padding: .85rem 1.6rem;
    background: #fff; color: var(--sz-text);
    text-transform: uppercase; letter-spacing: .14em; font-size: .8rem; font-weight: 600;
    border-radius: var(--sz-radius);
    transition: background var(--sz-tr-fast);
}
.sz-ib-btn:hover{ background: var(--sz-primary); color: #fff; }

/* ---------- 9) Collage ---------- */
.sz-collage{ padding-block: clamp(2.5rem, 5vw, 4.5rem); }
.sz-collage-grid{ display:grid; gap: 1rem; }
.sz-collage-item{
    position: relative; overflow: hidden;
    aspect-ratio: 1/1; border-radius: var(--sz-radius-card);
    background: var(--sz-bg-cream);
}
.sz-collage-item img{ width:100%; height:100%; object-fit:cover; transition: transform .6s ease; }
.sz-collage-item:hover img{ transform: scale(1.06); }
.sz-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(--sz-font-display); font-size: 1.2rem;
}

/* ---------- 10) Multicolumn ---------- */
.sz-mc{ padding-block: clamp(2.5rem, 5vw, 4.5rem); }
.sz-mc-title{ text-align: center; font-family: var(--sz-font-display); font-size: clamp(24px, 2.6vw, 36px); margin-bottom: 2rem; }
.sz-mc-col{ text-align: center; padding: 1rem; }
.sz-mc-icon{
    display:inline-flex; align-items:center; justify-content:center;
    width: 64px; height: 64px;
    border: 1px solid var(--sz-border);
    border-radius: 50%;
    color: var(--sz-primary); font-size: 1.6rem;
    margin-bottom: 1rem;
}
.sz-mc-col-img{ width: 80px; height: 80px; object-fit: cover; border-radius: 50%; margin: 0 auto 1rem; }
.sz-mc-col-title{ font-family: var(--sz-font-display); font-size: 1.2rem; margin-bottom: .5rem; }
.sz-mc-col-text{ color: var(--sz-text-soft); font-size: .9rem; }

/* ---------- 11) Collapsible content (FAQ) ---------- */
.sz-cc{ padding-block: clamp(2.5rem, 5vw, 4.5rem); }
.sz-cc-inner{ max-width: 780px; margin: 0 auto; }
.sz-cc-title{ text-align: center; font-family: var(--sz-font-display); font-size: clamp(24px, 2.6vw, 36px); margin-bottom: 1.75rem; }
.sz-cc .accordion-button{
    background: var(--sz-bg-soft);
    color: var(--sz-text);
    font-weight: 500;
    border-radius: var(--sz-radius);
    padding: 1rem 1.25rem;
}
.sz-cc .accordion-button:not(.collapsed){
    background: var(--sz-bg-cream);
    color: var(--sz-text);
    box-shadow: none;
}
.sz-cc .accordion-button:focus { box-shadow: none; border-color: var(--sz-primary); }
.sz-cc .accordion-item{
    border: 1px solid var(--sz-border);
    margin-bottom: .5rem;
    border-radius: var(--sz-radius);
    overflow: hidden;
}
.sz-cc .accordion-body{ background: var(--sz-bg); color: var(--sz-text-soft); }

/* ---------- 12) Email signup ---------- */
.sz-es{
    padding-block: clamp(2.5rem, 5vw, 4.5rem);
    background: var(--sz-bg-soft);
    text-align: center;
}
.sz-es-inner{ max-width: 640px; margin: 0 auto; }
.sz-es-title{ font-family: var(--sz-font-display); font-size: clamp(24px, 2.6vw, 36px); margin-bottom: .5rem; }
.sz-es-text{ color: var(--sz-muted); margin-bottom: 1.5rem; font-size: .9rem; }
.sz-es-form{
    display:flex; align-items:center;
    background: var(--sz-bg);
    border: 1px solid var(--sz-border);
    border-radius: var(--sz-radius-pill);
    padding: 4px 4px 4px 18px;
    max-width: 480px; margin: 0 auto;
}
.sz-es-input{ flex:1; background:transparent; border:0; outline:0; height:44px; font-size:.9rem; }
.sz-es-btn{
    height: 40px; padding: 0 1.5rem;
    background: var(--sz-text); color: var(--sz-bg);
    border: 0; border-radius: var(--sz-radius-pill);
    font-size: .8rem; letter-spacing: .12em; text-transform: uppercase; font-weight: 600;
    transition: background var(--sz-tr-fast);
}
.sz-es-btn:hover{ background: var(--sz-primary-dark); }
.sz-es-msg{ font-size: .85rem; margin-top: .75rem; min-height: 1.2em; }
.sz-es-gdpr{ font-size: .75rem; color: var(--sz-muted); margin-top: 1rem; }

/* ---------- 13) Video ---------- */
.sz-vid{ padding-block: clamp(2rem, 4vw, 3.5rem); }
.sz-vid-title{ text-align:center; font-family: var(--sz-font-display); font-size: clamp(24px, 2.6vw, 36px); margin-bottom: 1.25rem; }
.sz-vid-frame{
    position: relative;
    aspect-ratio: 16/9;
    overflow: hidden; border-radius: var(--sz-radius-card);
    background: #000;
}
.sz-vid-frame iframe,
.sz-vid-frame video{
    position:absolute; inset:0; width:100%; height:100%; border:0;
}

/* ---------- 14) Blog posts ---------- */
.sz-bp{ padding-block: clamp(2.5rem, 5vw, 4.5rem); }
.sz-bp-title{ text-align:center; font-family: var(--sz-font-display); font-size: clamp(24px, 2.6vw, 36px); margin-bottom: 2rem; }
.sz-bp-card{
    background: var(--sz-bg);
    border: 1px solid var(--sz-border);
    border-radius: var(--sz-radius-card);
    overflow: hidden;
    transition: box-shadow var(--sz-tr), transform var(--sz-tr-fast);
}
.sz-bp-card:hover{ box-shadow: var(--sz-shadow-hover); transform: translateY(-2px); }
.sz-bp-img{ width: 100%; aspect-ratio: 16/9; object-fit: cover; }
.sz-bp-body{ padding: 1.25rem; }
.sz-bp-meta{ font-size: .75rem; color: var(--sz-muted); letter-spacing: .1em; text-transform: uppercase; margin-bottom: .5rem; }
.sz-bp-h{ font-family: var(--sz-font-display); font-size: 1.25rem; margin: 0 0 .5rem; }
.sz-bp-excerpt{ font-size: .85rem; color: var(--sz-text-soft); }

/* ---------- 15) Custom HTML ---------- */
.sz-html{ padding-block: 1rem; }

/* ---------- 16) Page content (CMS) ---------- */
.sz-pc{ padding-block: clamp(2rem, 4vw, 3.5rem); }
.sz-pc-title{ font-family: var(--sz-font-display); font-size: clamp(28px, 3vw, 42px); margin-bottom: 1.25rem; }
.sz-pc-body{ color: var(--sz-text-soft); line-height: 1.8; }
.sz-pc-body img{ border-radius: var(--sz-radius-card); }

/* ---------- 17) Contact form ---------- */
.sz-cf{ padding-block: clamp(2.5rem, 5vw, 4.5rem); }
.sz-cf-inner{ max-width: 720px; margin: 0 auto; }
.sz-cf-title{ font-family: var(--sz-font-display); font-size: clamp(24px, 2.6vw, 36px); margin-bottom: .5rem; text-align: center; }
.sz-cf-desc{ color: var(--sz-muted); margin-bottom: 2rem; text-align: center; font-size: .9rem; }
.sz-cf-form .form-control,
.sz-cf-form .form-select{
    border: 1px solid var(--sz-border);
    background: var(--sz-bg-soft);
    border-radius: var(--sz-radius);
    padding: .85rem 1rem;
    font-size: .9rem;
    color: var(--sz-text);
}
.sz-cf-form .form-control:focus{
    border-color: var(--sz-primary);
    background: var(--sz-bg);
    box-shadow: none;
}

/* ---------- 18) Campaign cart bundle (PDP scope) ---------- */
.sz-cb{
    padding-block: 1.75rem;
    background: var(--sz-bg-soft);
    border-radius: var(--sz-radius-card);
}
.sz-cb-heading{
    font-family: var(--sz-font-display);
    font-weight: 500;
    font-size: clamp(20px, 2.2vw, 30px);
    color: var(--sz-text);
    margin: 0 0 .35rem;
    text-align: left;
}
.sz-cb-meta{
    font-size: .8rem; color: var(--sz-muted);
    margin: 0 0 1.5rem;
    letter-spacing: .04em;
}
.sz-cb-meta strong { color: var(--sz-text); font-weight: 600; }

.sz-cb-grid{
    display: flex; flex-direction: column;
    gap: .75rem;
}

.sz-cb-card{
    display: flex;
    align-items: stretch;
    gap: 1rem;
    padding: 1rem;
    background: var(--sz-bg);
    border: 1px solid var(--sz-border);
    border-radius: var(--sz-radius-card);
    transition: border-color var(--sz-tr-fast), box-shadow var(--sz-tr-fast);
}
.sz-cb-card:hover{
    border-color: var(--sz-border-strong);
    box-shadow: var(--sz-shadow-card);
}
.sz-cb-x-card{
    border-color: var(--sz-primary);
    background: var(--sz-bg);
}
.sz-cb-y-row--disabled{
    opacity: .7;
    background: var(--sz-bg-soft);
}

.sz-cb-card-img{
    flex-shrink: 0;
    width: 88px; height: 88px;
    border-radius: var(--sz-radius);
    overflow: hidden;
    background: var(--sz-bg-cream);
}
.sz-cb-card-img img{
    width: 100%; height: 100%;
    object-fit: cover;
    display: block;
}
.sz-cb-card-img-ph{
    width: 100%; height: 100%;
    display: flex; align-items: center; justify-content: center;
    color: var(--sz-muted);
    font-size: 1.5rem;
}

.sz-cb-card-body{
    flex: 1; min-width: 0;
    display: flex; flex-direction: column;
    gap: .35rem;
}

.sz-cb-card-head{
    display: flex; align-items: flex-start; justify-content: space-between;
    gap: .5rem;
}
.sz-cb-card-title{
    font-size: .9rem; font-weight: 500;
    color: var(--sz-text);
    line-height: 1.35;
    display: -webkit-box;
    -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical;
    overflow: hidden;
}

.sz-cb-included-badge{
    flex-shrink: 0;
    display: inline-flex; align-items: center; justify-content: center;
    width: 22px; height: 22px;
    background: var(--sz-primary);
    color: #fff;
    font-size: .7rem; font-weight: 700;
    border-radius: 50%;
    line-height: 1;
}

.sz-cb-switch .form-check-input{
    width: 2.4em; height: 1.3em;
    margin-top: .15em;
    border-color: var(--sz-border);
    background-color: var(--sz-bg-cream);
}
.sz-cb-switch .form-check-input:checked{
    background-color: var(--sz-primary);
    border-color: var(--sz-primary);
}
.sz-cb-switch .form-check-input:focus{ box-shadow: 0 0 0 .15rem rgba(184,132,104,.25); }

.sz-cb-card-prices{
    display: flex; flex-wrap: wrap; align-items: center;
    gap: .35rem .5rem;
}
.sz-cb-badge-pct{
    display: inline-block;
    padding: 2px 8px;
    background: var(--sz-discount); color: #fff;
    font-size: .65rem; font-weight: 700;
    border-radius: var(--sz-radius);
    letter-spacing: .04em;
    line-height: 1.4;
}
.sz-cb-price-old{
    font-size: .8rem;
    color: var(--sz-muted);
    text-decoration: line-through;
}
.sz-cb-price-new{
    font-size: .95rem; font-weight: 600;
    color: var(--sz-text);
}
.sz-cb-x-card .sz-cb-price-new{ color: var(--sz-primary-dark); }
.sz-cb-price-note{
    font-size: .7rem;
    color: var(--sz-muted);
    margin-left: .25rem;
}
.sz-cb-card-note{
    font-size: .7rem; color: var(--sz-muted);
    letter-spacing: .04em;
}
.sz-cb-opt-link{
    display: inline-block;
    margin-top: .25rem;
    font-size: .8rem;
    color: var(--sz-primary);
    text-decoration: none;
    border-bottom: 1px solid currentColor;
    padding-bottom: 1px;
}
.sz-cb-opt-link:hover{ color: var(--sz-primary-dark); }

/* aside */
.sz-cb-aside{
    background: var(--sz-bg);
    border: 1px solid var(--sz-border);
    border-radius: var(--sz-radius-card);
    padding: 1.25rem;
    height: 100%;
    position: sticky; top: 100px;
}
@media (max-width: 991.98px){
    .sz-cb-aside{ position: static; }
}
.sz-cb-aside-info{
    display: flex; gap: .5rem;
    font-size: .8rem; color: var(--sz-muted);
    margin-bottom: 1.25rem;
    line-height: 1.45;
}
.sz-cb-aside-info i{ flex-shrink: 0; margin-top: 2px; color: var(--sz-primary); }

.sz-cb-aside-totals{ margin-bottom: 1.25rem; }

.sz-cb-sum-line{
    margin-bottom: .85rem;
    padding-bottom: .85rem;
    border-bottom: 1px solid var(--sz-border);
}
.sz-cb-sum-row{
    display: flex; justify-content: space-between; align-items: baseline;
    gap: .5rem;
    font-size: .85rem;
    color: var(--sz-text-soft);
}
.sz-cb-sum-row span:last-child{
    font-weight: 500; color: var(--sz-text);
}
.sz-cb-sum-hint{
    margin: .25rem 0 0;
    font-size: .7rem; color: var(--sz-muted);
    line-height: 1.4;
}
.sz-cb-kazanc{ color: #128653; font-weight: 600 !important; }

.sz-cb-sum-total{
    border-bottom: 0;
    margin-bottom: 0;
    padding-bottom: 0;
    padding-top: .5rem;
}
.sz-cb-sum-total-label{
    font-size: .75rem; color: var(--sz-muted);
    text-transform: uppercase; letter-spacing: .14em;
    margin-bottom: .25rem;
}
.sz-cb-total{
    font-family: var(--sz-font-display);
    font-size: clamp(22px, 2.4vw, 28px);
    font-weight: 600;
    color: var(--sz-text);
}

.sz-cb-submit{
    margin-top: .5rem;
    width: 100%;
}
.sz-cb-submit:disabled{ opacity: .5; cursor: not-allowed; }

/* =================================================================
   Product card — duygukaya.com tarzi minimalist butik kart
   ================================================================= */
.sz-pc{
    position: relative;
    background: var(--sz-bg);
}

.sz-pc-img-link{
    display: block;
    text-decoration: none;
}

.sz-pc-img-wrap{
    position: relative;
    overflow: hidden;
    /* Liste / grid: 2:3 — önceki 3:4'e göre biraz daha yüksek vitrin alanı */
    aspect-ratio: 2 / 3;
    background: transparent;
}
.sz-pc-img{
    width: 100%; height: 100%; object-fit: cover;
    transition: transform .6s ease, opacity .25s ease;
    display: block;
}
.sz-pc:hover .sz-pc-img{ transform: scale(1.03); }
.sz-pc-img-ph{
    width: 100%; height: 100%;
    display: flex; align-items: center; justify-content: center;
    color: var(--sz-muted); font-size: 2rem;
}

.sz-pc-badges{
    position: absolute; top: 12px; left: 12px;
    display: flex; flex-direction: column; gap: 6px;
    z-index: 2;
    align-items: flex-start;
}
.sz-pc-badge{
    display: inline-block;
    padding: 4px 11px;
    background: #ffffff;
    color: var(--sz-text-strong);
    border-radius: var(--sz-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;
}
.sz-pc-badge--new{ background: #ffffff; color: var(--sz-text-strong); }
.sz-pc-badge--discount{
    background: var(--sz-primary-bg);
    color: var(--sz-discount);
}
.sz-pc-badge--out{ background: var(--sz-bg-cream); color: var(--sz-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) */
.sz-pc-actions{
    position: absolute; top: 12px; right: 12px;
    display: flex; flex-direction: column; gap: 8px;
    z-index: 3;
}
.sz-pc-act{
    width: 36px; height: 36px;
    background: #ffffff;
    border: 0;
    color: var(--sz-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(--sz-tr-fast),
        box-shadow var(--sz-tr-fast),
        color var(--sz-tr-fast);
}
.sz-pc-act > i{ line-height: 1; }
.sz-pc-act:focus-visible{
    outline: 2px solid var(--sz-primary);
    outline-offset: 2px;
}

/* Default: sadece favori gozuksun, view ve share gizli ve yukaridan kayar */
.sz-pc-act--view,
.sz-pc-act--share{
    opacity: 0;
    transform: translateY(-8px) scale(.85);
    pointer-events: none;
}

/* Hover: view ve share da gorunur olsun, asagi dogru kayar (stagger) */
.sz-pc:hover .sz-pc-act--view,
.sz-pc:focus-within .sz-pc-act--view,
.sz-pc:hover .sz-pc-act--share,
.sz-pc:focus-within .sz-pc-act--share{
    opacity: 1;
    transform: translateY(0) scale(1);
    pointer-events: auto;
}
.sz-pc:hover .sz-pc-act--view,
.sz-pc:focus-within .sz-pc-act--view{ transition-delay: .04s; }
.sz-pc:hover .sz-pc-act--share,
.sz-pc:focus-within .sz-pc-act--share{ transition-delay: .09s; }

/* Hover ikonun uzerine gelince: pembe renk + hafif buyume */
.sz-pc-act:hover{
    color: var(--sz-primary);
    transform: scale(1.1);
    box-shadow: 0 4px 12px rgba(43,38,34,.16);
}
.sz-pc-act.is-active{ color: var(--sz-primary); }
.sz-pc-act.is-active i{ color: var(--sz-primary); }
.sz-pc-act--fav.is-active i::before{ content: "\f415"; }
.sz-pc-act.is-copied{ color: var(--sz-primary); }

/* Touch cihazlar (hover yok): 3 ikon hep gozuksun */
@media (hover: none){
    .sz-pc-act--view,
    .sz-pc-act--share{
        opacity: 1;
        transform: none;
        pointer-events: auto;
    }
}

.sz-pc-body{
    padding: .85rem .25rem 1.5rem;
    text-align: center;
}

.sz-pc-title{
    font-family: var(--sz-font-body);
    font-size: .9rem;
    font-weight: bold;
    color: var(--sz-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;
}
.sz-pc-title a { color: inherit; }
.sz-pc-title a:hover { color: var(--sz-text-strong); text-decoration: none; }

.sz-pc-price{
    font-size: .85rem;
    color: var(--sz-text);
    display: inline-flex; align-items: baseline; gap: .55rem;
    flex-wrap: wrap;
    justify-content: center;
}
.sz-pc-price .sz-pc-old{
    text-decoration: line-through;
    color: var(--sz-muted);
    font-weight: 400;
}
.sz-pc-price .sz-pc-new{
    color: var(--sz-discount);
    font-weight: 500;
}

/* .sz-pc-hover artik kullanilmiyor (template'lerden kaldirildi).
   Hover-only davranis sz-pc-actions ile saglaniyor. */

/* ============================================================
   Home: 2-kolon image banner (kategori gorselleri ile)
   Edge-to-edge, padding container token ile sekmeyi onler.
   ============================================================ */
.sz-home-banners{
    margin: clamp(28px, 4vw, 56px) 0;
}
.sz-home-banners-grid{
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 4px;
    padding: 0 var(--sz-container-pad, 16px);
}
.sz-home-banner{
    position: relative;
    display: block;
    aspect-ratio: 4 / 5;
    overflow: hidden;
    color: #fff;
    background: var(--sz-bg-soft);
    text-decoration: none;
}
.sz-home-banner-img{
    position: absolute; inset: 0;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    transition: transform .8s ease;
}
.sz-home-banner:hover .sz-home-banner-img{ transform: scale(1.04); }
.sz-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;
}
.sz-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;
}
.sz-home-banner-eyebrow{
    font-size: .68rem;
    letter-spacing: .22em;
    text-transform: uppercase;
    opacity: .9;
}
.sz-home-banner-title{
    font-family: var(--sz-font-display);
    font-size: clamp(20px, 2.4vw, 32px);
    font-weight: 400;
    line-height: 1.2;
    letter-spacing: .01em;
}
.sz-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;
}
.sz-home-banner:hover .sz-home-banner-cta{
    border-bottom-color: #fff;
    transform: translateX(4px);
}
@media (max-width: 767.98px){
    .sz-home-banners-grid{ grid-template-columns: 1fr; gap: 4px; }
    .sz-home-banner{ aspect-ratio: 16 / 11; }
    .sz-home-banner-content{ bottom: 18px; padding: 0 18px; }
}

/* ============================================================
   Home: Newsletter teaser (krem zemin, ortalı, sıcak)
   ============================================================ */
.sz-home-nl-teaser{
    background: var(--sz-bg-soft);
    padding: clamp(40px, 5vw, 72px) 0;
    margin-top: clamp(28px, 4vw, 56px);
}
.sz-home-nl-inner{
    max-width: 560px;
    margin: 0 auto;
    text-align: center;
}
.sz-home-nl-eyebrow{
    display: inline-block;
    font-size: .7rem;
    letter-spacing: .22em;
    text-transform: uppercase;
    color: var(--sz-primary);
    margin-bottom: .65rem;
}
.sz-home-nl-title{
    font-family: var(--sz-font-display);
    font-size: clamp(22px, 2.4vw, 30px);
    font-weight: 400;
    line-height: 1.3;
    color: var(--sz-text-strong);
    margin: 0 0 .65rem;
    letter-spacing: .005em;
}
.sz-home-nl-text{
    color: var(--sz-text-soft);
    font-size: .9rem;
    line-height: 1.6;
    margin: 0 0 1.4rem;
}
.sz-home-nl-form{
    display: flex;
    align-items: center;
    background: #fff;
    border: 1px solid var(--sz-border);
    border-radius: var(--sz-radius-pill);
    padding: 5px 5px 5px 18px;
    overflow: hidden;
    gap: 6px;
}
.sz-home-nl-input{
    flex: 1; min-width: 0;
    background: transparent; border: 0; outline: 0;
    height: 40px;
    font-family: inherit; font-size: .88rem;
    color: var(--sz-text-strong);
}
.sz-home-nl-input::placeholder{ color: var(--sz-muted); }
.sz-home-nl-btn{
    display: inline-flex; align-items: center; justify-content: center;
    height: 38px; padding: 0 1.25rem;
    background: var(--sz-cta); color: #fff;
    border: 0;
    border-radius: var(--sz-radius-pill);
    font-size: .76rem; font-weight: 500; letter-spacing: .14em; text-transform: uppercase;
    white-space: nowrap;
    transition: background var(--sz-tr-fast);
}
.sz-home-nl-btn:hover{ background: var(--sz-cta-hover); }
.sz-home-nl-btn i{ font-size: .9rem; }

/* Ürün kartı = article.sz-pc; CMS blok da .sz-pc kullanıyor — kartlara CMS sayfa padding'i binmesin */
article.sz-pc[data-product-id]{
    padding-block: 0;
}

/* ============================================================
   Listing grid: XXL+ ekranlarda 5 col; tam genişlik + sıkı dikey aralık
   ============================================================ */
.sz-listing-page-wrap.container-fluid{
    max-width: 100%;
}
#myt-category-product-grid,
#myt-search-results-grid{
    --bs-gutter-y: .75rem;
}
@media (min-width: 768px){
    #myt-category-product-grid,
    #myt-search-results-grid{
        --bs-gutter-y: 1rem;
    }
}
@media (min-width: 1400px){
    #myt-category-product-grid,
    #myt-search-results-grid{
        --bs-gutter-x: 1.25rem;
        --bs-gutter-y: 1.1rem;
    }
    #myt-category-product-grid:not(.row-cols-lg-2):not(.row-cols-lg-3),
    #myt-search-results-grid:not(.row-cols-lg-2):not(.row-cols-lg-3){
        row-gap: 0;
    }
    #myt-category-product-grid.row-cols-lg-4,
    #myt-search-results-grid.row-cols-lg-4{
        --bs-gutter-x: 1.35rem;
    }
}
@media (min-width: 1600px){
    #myt-category-product-grid:not(.row-cols-lg-2):not(.row-cols-lg-3),
    #myt-search-results-grid:not(.row-cols-lg-2):not(.row-cols-lg-3){
        --bs-cols: 5;
    }
    #myt-category-product-grid:not(.row-cols-lg-2):not(.row-cols-lg-3) > .col,
    #myt-search-results-grid:not(.row-cols-lg-2):not(.row-cols-lg-3) > .col{
        flex: 0 0 auto;
        width: 20%;
    }
}
