/* =============================================================
   CASUAL THEME — Widget CSS  (cs-* prefix)
   ============================================================= */

/* ── Shared helpers ── */
.cs-section-head { display:flex; align-items:center; justify-content:space-between; margin-bottom:36px; flex-wrap:wrap; gap:12px; }
.cs-section-title { font-family:'Rubik',sans-serif; font-size:22px; font-weight:700; color:var(--heading-color, #1a1a1a); letter-spacing:.04em; text-transform:uppercase; margin:0; }
.cs-section-view-all { font-size:13px; font-weight:600; color:var(--main-color-one, #F83A26); text-decoration:none; display:inline-flex; align-items:center; gap:4px; transition:gap .2s; }
.cs-section-view-all:hover { gap:8px; }
.cs-no-data { color:var(--extra-light-color, #aaa); font-size:14px; text-align:center; padding:40px 0; }

/* ── Hero Section ── */
/* ── Hero Section ── */
.cs-hero { background:var(--section-bg-2, #fdf6f0); overflow:hidden; }
.cs-hero-inner { display:flex; min-height:600px; align-items:center; }
/* Left panel */
.cs-hero-left { flex:0 0 48%; display:flex; flex-direction:column; justify-content:center; padding:60px 48px 60px 0; gap:24px; position:relative; }
.cs-hero-eyebrow { font-size:14px; font-weight:500; color:var(--light-color, #555); letter-spacing:.01em; }
.cs-hero-title { font-size:clamp(44px,5.8vw,80px); font-weight:800; color:var(--heading-color, #1a1a1a); line-height:1.03; margin:0; }
/* Circle CTA */
.cs-hero-cta { display:inline-flex; align-items:center; gap:14px; text-decoration:none; align-self:flex-start; }
.cs-hero-cta-circle { width:52px; height:52px; border-radius:50%; background:var(--main-color-one, #F83A26); display:flex; align-items:center; justify-content:center; color:#fff; font-size:20px; flex-shrink:0; transition:background .2s,transform .2s; }
.cs-hero-cta:hover .cs-hero-cta-circle { background:color-mix(in srgb, var(--main-color-one, #F83A26) 80%, black); transform:scale(1.08); }
.cs-hero-cta-text { font-size:15px; font-weight:700; color:var(--heading-color, #1a1a1a); }
/* Mini product cards */
.cs-hero-mini-products { display:flex; gap:16px; }
.cs-hero-mini-card { background:#fff; border-radius:14px; overflow:hidden; box-shadow:0 2px 16px rgba(0,0,0,.07); width:160px; flex-shrink:0; display:flex; flex-direction:column; }
.cs-hero-mini-img-wrap { display:block; aspect-ratio:4/3; overflow:hidden; }
.cs-hero-mini-img { width:100%; height:100%; object-fit:cover; transition:transform .3s; }
.cs-hero-mini-card:hover .cs-hero-mini-img { transform:scale(1.05); }
.cs-hero-mini-ph { width:100%; height:100%; background:var(--section-bg-5, #f0ebe5); display:flex; align-items:center; justify-content:center; color:var(--extra-light-color, #ccc); font-size:28px; }
.cs-hero-mini-info { padding:10px 10px 12px 12px; display:flex; align-items:center; justify-content:space-between; gap:8px; }
.cs-hero-mini-text { display:flex; flex-direction:column; gap:3px; min-width:0; }
.cs-hero-mini-name { font-size:12px; font-weight:600; color:var(--heading-color, #1a1a1a); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.cs-hero-mini-price { font-size:13px; color:var(--main-color-one, #F83A26); font-weight:700; }
.cs-hero-mini-eye { flex-shrink:0; width:32px; height:32px; border-radius:8px; background:var(--main-color-one, #F83A26); color:#fff; display:flex; align-items:center; justify-content:center; font-size:15px; text-decoration:none; transition:background .2s; }
.cs-hero-mini-eye:hover { background:color-mix(in srgb, var(--main-color-one, #F83A26) 80%, black); }
/* Decorative shapes — all relative to <section> */
.cs-hero-deco { position:absolute; pointer-events:none; z-index:0; }
.cs-hero-deco-square { width:16px; height:16px; border:2.5px solid var(--main-color-one, #F83A26); top:6%; left:50%; transform:rotate(12deg); }
.cs-hero-deco-triangle { width:0; height:0; border-left:11px solid transparent; border-right:11px solid transparent; border-bottom:20px solid var(--main-color-one, #F83A26); top:10%; right:18%; }
.cs-hero-deco-dot { width:24px; height:24px; border-radius:50%; background:var(--main-color-one, #F83A26); top:62%; left:58%; }
/* Right panel */
.cs-hero-right { flex:1; position:relative; overflow:visible; min-height:600px; }
/* Filled peach circle + inner ring */
.cs-hero-bg-circle {
    position:absolute;
    right:-100px;
    top:50%;
    transform:translateY(-50%);
    width:580px;
    height:580px;
    border-radius:50%;
    background:rgba(220,148,96,.16);
    pointer-events:none;
    z-index:0;
}
.cs-hero-bg-circle::after {
    content:'';
    position:absolute;
    inset:50px;
    border-radius:50%;
    border:2px solid rgba(200,130,80,.20);
    background:transparent;
}
.cs-hero-model-img { position:absolute; bottom:0; left:50%; transform:translateX(-50%); height:100%; width:auto; max-width:none; object-fit:contain; object-position:bottom center; display:block; z-index:1; }
.cs-hero-model-placeholder { width:100%; height:100%; display:flex; align-items:center; justify-content:center; color:var(--extra-light-color, #ccc); font-size:80px; }
/* Vertical social links — far right edge */
.cs-hero-social { position:absolute; right:-32px; top:50%; transform:translateY(-50%) rotate(90deg); display:flex; gap:24px; z-index:2; transform-origin:center; }
.cs-hero-social-link { font-size:11px; font-weight:500; color:var(--extra-light-color, #aaa); letter-spacing:.14em; text-transform:uppercase; text-decoration:none; white-space:nowrap; transition:color .2s; }
.cs-hero-social-link:hover { color:var(--main-color-one, #F83A26); }

/* ── Category Grid ── */
.cs-catgrid-section { background:#fff; }
.cs-catgrid-row { display:grid; grid-template-columns:repeat(auto-fill,minmax(160px,1fr)); gap:16px; }
.cs-catgrid-card { display:flex; flex-direction:column; align-items:center; background:#fff; border:1px solid color-mix(in srgb, var(--extra-light-color, #999999) 25%, white); border-radius:16px; text-decoration:none; transition:box-shadow .2s,transform .2s; padding:24px 16px 20px; text-align:center; }
.cs-catgrid-card:hover { box-shadow:0 6px 24px rgba(0,0,0,.08); transform:translateY(-3px); border-color:color-mix(in srgb, var(--extra-light-color, #999999) 25%, white); }
.cs-catgrid-img-wrap { width:100px; height:100px; border-radius:50%; overflow:hidden; margin-bottom:14px; flex-shrink:0; background:#f5f5f5; display:flex; align-items:center; justify-content:center; }
.cs-catgrid-img { width:100%; height:100%; object-fit:cover; transition:transform .3s; }
.cs-catgrid-card:hover .cs-catgrid-img { transform:scale(1.06); }
.cs-catgrid-img-placeholder { width:100%; height:100%; display:flex; align-items:center; justify-content:center; color:var(--extra-light-color, #ccc); font-size:32px; }
.cs-catgrid-info { display:flex; flex-direction:column; align-items:center; gap:6px; }
.cs-catgrid-name { font-size:14px; font-weight:700; color:var(--heading-color, #1a1a1a); line-height:1.3; }
.cs-catgrid-count { font-size:12px; color:var(--extra-light-color, #888); font-weight:400; }

/* ── Popular Collection ── */
.cs-popular-section { background:#fff; }
.cs-popular-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:24px; }
.cs-popular-card { background:#fff; border-radius:16px; overflow:hidden; display:flex; flex-direction:column; box-shadow:0 2px 12px rgba(0,0,0,.06); transition:box-shadow .2s,transform .2s; }
.cs-popular-card:hover { box-shadow:0 8px 32px rgba(0,0,0,.12); transform:translateY(-4px); }
.cs-popular-img-wrap { display:block; position:relative; background:var(--section-bg-5, #f8f4f0); aspect-ratio:3/4; overflow:hidden; }
.cs-popular-img { width:100%; height:100%; object-fit:cover; transition:transform .4s; }
.cs-popular-card:hover .cs-popular-img { transform:scale(1.05); }
.cs-popular-img-placeholder { width:100%; height:100%; display:flex; align-items:center; justify-content:center; color:var(--extra-light-color, #ccc); font-size:40px; }
.cs-popular-badge { position:absolute; top:12px; left:12px; background:var(--main-color-one, #F83A26); color:#fff; font-size:11px; font-weight:700; border-radius:20px; padding:3px 10px; }
/* hover overlay for actions */
.cs-popular-img-wrap::after { content:''; position:absolute; inset:0; background:color-mix(in srgb, var(--main-color-one, #F83A26) 8%, transparent); opacity:0; transition:opacity .2s; }
.cs-popular-card:hover .cs-popular-img-wrap::after { opacity:1; }
.cs-popular-actions { position:absolute; bottom:12px; left:50%; transform:translateX(-50%) translateY(10px); opacity:0; transition:opacity .2s,transform .2s; display:flex; gap:8px; white-space:nowrap; z-index:1; }
.cs-popular-card:hover .cs-popular-actions { opacity:1; transform:translateX(-50%) translateY(0); }
.cs-popular-cart-btn { display:inline-flex; align-items:center; gap:6px; background:var(--main-color-one, #F83A26); color:#fff; font-size:11px; font-weight:700; padding:8px 14px; border-radius:20px; text-decoration:none; }
.cs-popular-cart-btn:hover { background:color-mix(in srgb, var(--main-color-one, #F83A26) 80%, black); color:#fff; }
.cs-popular-body { padding:14px 16px 16px; display:flex; flex-direction:column; gap:6px; }
.cs-popular-name { font-size:14px; font-weight:600; color:var(--heading-color, #1a1a1a); text-decoration:none; transition:color .2s; display:block; }
.cs-popular-name:hover { color:var(--main-color-one, #F83A26); }
.cs-popular-price-row { display:flex; align-items:center; gap:8px; }
.cs-popular-price { font-size:16px; font-weight:800; color:var(--main-color-one, #F83A26); }
.cs-popular-old-price { font-size:13px; color:var(--extra-light-color, #bbb); text-decoration:line-through; }

/* ── Our Store ── */
.cs-store-section { background:#fff; }
.cs-store-layout { display:flex; gap:28px; align-items:flex-start; }
.cs-store-sidebar { width:190px; flex-shrink:0; }
.cs-store-catlist { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:2px; }
.cs-store-catlist li { margin:0; }
.cs-store-cat-btn { width:100%; text-align:left; background:none; border:none; padding:10px 16px; font-size:13px; font-weight:500; color:var(--light-color, #666666); cursor:pointer; border-radius:8px; transition:background .15s,color .15s; border-left:3px solid transparent; }
.cs-store-cat-btn:hover,.cs-store-cat-btn.active { background:color-mix(in srgb, var(--main-color-one, #F83A26) 8%, white); color:var(--main-color-one, #F83A26); font-weight:700; border-left-color:var(--main-color-one, #F83A26); }
.cs-store-grid { flex:1; display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.cs-store-item { background:#fff; border-radius:14px; overflow:hidden; display:flex; flex-direction:column; box-shadow:0 1px 8px rgba(0,0,0,.06); transition:box-shadow .2s,transform .2s; }
.cs-store-item:hover { box-shadow:0 6px 24px rgba(0,0,0,.10); transform:translateY(-3px); }
.cs-store-img-wrap { display:block; position:relative; background:var(--section-bg-5, #f8f4f0); aspect-ratio:4/5; overflow:hidden; }
.cs-store-img { width:100%; height:100%; object-fit:cover; transition:transform .35s; }
.cs-store-item:hover .cs-store-img { transform:scale(1.05); }
.cs-store-img-ph { width:100%; height:100%; display:flex; align-items:center; justify-content:center; color:var(--extra-light-color, #ccc); font-size:36px; }
.cs-store-badge { position:absolute; top:10px; left:10px; background:var(--main-color-one, #F83A26); color:#fff; font-size:10px; font-weight:700; border-radius:20px; padding:3px 9px; }
/* add-to-cart slide-up on hover */
.cs-store-hover-bar { position:absolute; bottom:0; left:0; right:0; background:var(--main-color-one, #F83A26); display:flex; align-items:center; justify-content:center; padding:9px; opacity:0; transform:translateY(100%); transition:opacity .2s,transform .2s; }
.cs-store-item:hover .cs-store-hover-bar { opacity:1; transform:translateY(0); }
.cs-store-add-btn { color:#fff; font-size:12px; font-weight:700; text-decoration:none; display:flex; align-items:center; gap:6px; }
.cs-store-info { padding:12px 14px 14px; display:flex; flex-direction:column; gap:5px; }
.cs-store-name { font-size:13px; font-weight:600; color:var(--heading-color, #1a1a1a); text-decoration:none; display:block; line-height:1.4; }
.cs-store-name:hover { color:var(--main-color-one, #F83A26); }
.cs-store-price-row { display:flex; align-items:center; gap:6px; }
.cs-store-price { font-size:15px; font-weight:800; color:var(--main-color-one, #F83A26); }
.cs-store-old-price { font-size:12px; color:var(--extra-light-color, #bbb); text-decoration:line-through; }

/* ── Flash Sale Banner ── */
/* ── Flash Sale Banner ── */
.cs-flash-banner-section { background:#fff; }
.cs-flash-banner-card {
    background: color-mix(in srgb, var(--main-color-one, #F83A26) 7%, white);
    border-radius: 20px;
    overflow: hidden;
    display: flex;
    align-items: center;
    min-height: 286px;
    position: relative;
}
/* Wave blob decorations */
.cs-flash-wave {
    position: absolute;
    border-radius: 50% 60% 40% 70% / 60% 40% 70% 50%;
    background: rgba(0,0,0,0.04);
    pointer-events: none;
    z-index: 0;
}
.cs-flash-wave-1 { width: 480px; height: 320px; bottom: -120px; left: 180px; transform: rotate(-15deg); }
.cs-flash-wave-2 { width: 360px; height: 240px; top: -90px; left: 360px; transform: rotate(20deg); border-radius: 60% 40% 70% 30% / 40% 60% 30% 70%; }
/* Left column */
.cs-flash-banner-left {
    flex: 0 0 36%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 12px;
    padding: 40px 40px 40px 48px;
    position: relative;
    z-index: 1;
}
.cs-flash-banner-title { font-size: clamp(32px,4vw,56px); font-weight: 800; color: var(--heading-color, #1a1a1a); margin: 0; line-height: 1.05; }
.cs-flash-banner-sub { font-size: 14px; color: var(--extra-light-color, #888); margin: 0; }
/* Circle-arrow store link */
.cs-flash-store-link { display: inline-flex; align-items: center; gap: 12px; text-decoration: none; width: fit-content; }
.cs-flash-store-icon { width: 40px; height: 40px; background: var(--heading-color, #1a1a1a); border-radius: 50%; display: flex; align-items: center; justify-content: center; color: #fff; font-size: 18px; flex-shrink: 0; transition: background .2s; }
.cs-flash-store-link:hover .cs-flash-store-icon { background: var(--main-color-one, #F83A26); }
.cs-flash-store-text { color: var(--main-color-one, #F83A26); font-size: 14px; font-weight: 700; }
/* Countdown */
.cs-flash-countdown { display: flex; align-items: center; gap: 6px; }
.cs-flash-count-item { display: flex; flex-direction: column; align-items: center; }
.cs-count-num { font-size: 22px; font-weight: 800; color: var(--heading-color, #1a1a1a); line-height: 1; }
.cs-count-label { font-size: 10px; color: var(--extra-light-color, #aaa); text-transform: uppercase; letter-spacing: .5px; margin-top: 2px; }
.cs-count-sep { font-size: 20px; font-weight: 700; color: var(--heading-color, #1a1a1a); line-height: 1; padding-bottom: 10px; }
.cs-flash-finished-msg { font-size: 14px; color: var(--extra-light-color, #888); margin: 0; }
/* Center: image */
.cs-flash-banner-center {
    flex: 1;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    align-self: stretch;
    position: relative;
    z-index: 1;
}
.cs-flash-banner-img { max-height: 260px; width: auto; object-fit: contain; display: block; }
.cs-flash-banner-img-ph { display: flex; align-items: center; justify-content: center; color: var(--extra-light-color, #ccc); font-size: 64px; width: 100%; height: 100%; }
/* Right: discount badge */
.cs-flash-banner-right {
    flex: 0 0 160px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding-right: 32px;
    position: relative;
    z-index: 1;
}
.cs-flash-discount-badge {
    width: 110px;
    height: 110px;
    background: var(--main-color-one, #F83A26);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 6px 20px rgba(240,54,38,.4);
}
.cs-flash-discount-badge span { font-size: 18px; font-weight: 800; color: #fff; text-align: center; line-height: 1.2; }

/* ── Flash Store ── */
.cs-flash-store-section { background:var(--section-bg-2, #fdf6f0); }
.cs-flash-store-head { display:flex; align-items:center; justify-content:space-between; margin-bottom:28px; }
.cs-flash-store-arrows { display:flex; gap:8px; }
.cs-flash-arr { width:38px; height:38px; border-radius:50%; border:2px solid color-mix(in srgb, var(--extra-light-color, #999999) 25%, white); background:#fff; display:flex; align-items:center; justify-content:center; cursor:pointer; color:var(--heading-color, #333); font-size:16px; transition:background .2s,border-color .2s,color .2s; }
.cs-flash-arr:hover { background:var(--main-color-one, #F83A26); border-color:var(--main-color-one, #F83A26); color:#fff; }
.cs-flash-slider-wrap { display:flex; gap:20px; overflow-x:auto; scroll-snap-type:x mandatory; -ms-overflow-style:none; scrollbar-width:none; padding-bottom:4px; }
.cs-flash-slider-wrap::-webkit-scrollbar { display:none; }
.cs-flash-item { min-width:210px; max-width:210px; scroll-snap-align:start; background:#fff; border-radius:14px; overflow:hidden; display:flex; flex-direction:column; transition:box-shadow .2s; flex-shrink:0; }
.cs-flash-item:hover { box-shadow:0 4px 20px rgba(0,0,0,.09); }
.cs-flash-img-wrap { display:block; position:relative; aspect-ratio:4/5; overflow:hidden; }
.cs-flash-img { width:100%; height:100%; object-fit:cover; transition:transform .3s; }
.cs-flash-item:hover .cs-flash-img { transform:scale(1.04); }
.cs-flash-img-ph { width:100%; height:100%; background:var(--section-bg-5, #f0ebe5); display:flex; align-items:center; justify-content:center; color:var(--extra-light-color, #ccc); font-size:36px; }
.cs-flash-sale-tag { position:absolute; top:10px; left:10px; background:var(--main-color-one, #F83A26); color:#fff; font-size:10px; font-weight:700; border-radius:4px; padding:3px 8px; }
.cs-flash-info { padding:14px; display:flex; flex-direction:column; gap:6px; flex:1; }
.cs-flash-name { font-size:13px; font-weight:600; color:var(--heading-color, #1a1a1a); text-decoration:none; display:block; }
.cs-flash-name:hover { color:var(--main-color-one, #F83A26); }
.cs-flash-price-row { display:flex; align-items:center; gap:6px; }
.cs-flash-price { font-size:14px; font-weight:700; color:var(--main-color-one, #F83A26); }
.cs-flash-old-price { font-size:12px; color:var(--extra-light-color, #aaa); text-decoration:line-through; }
.cs-flash-cart-btn { display:inline-flex; align-items:center; gap:6px; background:var(--heading-color, #1a1a1a); color:#fff; font-size:12px; font-weight:600; padding:8px 14px; border-radius:6px; text-decoration:none; transition:background .2s; margin-top:auto; justify-content:center; }
.cs-flash-cart-btn:hover { background:var(--main-color-one, #F83A26); color:#fff; }

/* ── Blog Updates ── */
.cs-blog-section { background:#fff; }
.cs-blog-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.cs-blog-card { background:var(--section-bg-2, #fdf6f0); border-radius:14px; overflow:hidden; display:flex; flex-direction:column; transition:box-shadow .2s; }
.cs-blog-card:hover { box-shadow:0 4px 20px rgba(0,0,0,.08); }
.cs-blog-img-wrap { display:block; position:relative; aspect-ratio:16/10; overflow:hidden; }
.cs-blog-img { width:100%; height:100%; object-fit:cover; transition:transform .3s; }
.cs-blog-card:hover .cs-blog-img { transform:scale(1.04); }
.cs-blog-img-ph { width:100%; height:100%; background:var(--section-bg-5, #f0ebe5); display:flex; align-items:center; justify-content:center; color:var(--extra-light-color, #ccc); font-size:40px; }
.cs-blog-cat-tag { position:absolute; top:12px; left:12px; background:var(--main-color-one, #F83A26); color:#fff; font-size:11px; font-weight:700; border-radius:4px; padding:3px 10px; }
.cs-blog-body { padding:18px; display:flex; flex-direction:column; gap:8px; flex:1; }
.cs-blog-date { font-size:12px; color:var(--extra-light-color, #999999); display:inline-flex; align-items:center; gap:4px; }
.cs-blog-title { font-size:15px; font-weight:700; color:var(--heading-color, #1a1a1a); text-decoration:none; display:block; line-height:1.4; }
.cs-blog-title:hover { color:var(--main-color-one, #F83A26); }
.cs-blog-excerpt { font-size:13px; color:var(--extra-light-color, #777); line-height:1.6; margin:0; }
.cs-blog-read-more { display:inline-flex; align-items:center; gap:4px; color:var(--main-color-one, #F83A26); font-size:13px; font-weight:600; text-decoration:none; margin-top:auto; transition:gap .2s; }
.cs-blog-read-more:hover { gap:8px; }

/* ── Brand Logos ── */
.cs-brands-section { background:#fff; }
.cs-brands-carousel { position:relative; overflow:hidden; }
.cs-brands-slides-wrap { position:relative; min-height:100px; }
.cs-brands-slide { display:none; }
.cs-brands-slide.active { display:block; }
.cs-brands-row { display:flex; align-items:center; justify-content:center; gap:32px; flex-wrap:wrap; padding:16px 0 48px; }
.cs-brand-logo-item { display:flex; align-items:center; justify-content:center; padding:16px 24px; background:#fff; border-radius:10px; transition:box-shadow .2s; text-decoration:none; }
.cs-brand-logo-item:hover { box-shadow:0 4px 16px rgba(0,0,0,.08); }
.cs-brand-logo-img { max-height:48px; max-width:120px; width:auto; object-fit:contain; filter:grayscale(1); opacity:.6; transition:filter .2s,opacity .2s; }
.cs-brand-logo-item:hover .cs-brand-logo-img { filter:grayscale(0); opacity:1; }
.cs-brand-logo-text { font-size:13px; font-weight:600; color:var(--extra-light-color, #888); }
.cs-brands-arr { position:absolute; top:50%; transform:translateY(-50%); width:36px; height:36px; border-radius:50%; border:2px solid color-mix(in srgb, var(--extra-light-color, #999999) 25%, white); background:#fff; display:flex; align-items:center; justify-content:center; cursor:pointer; color:var(--heading-color, #333); font-size:14px; z-index:2; transition:background .2s,border-color .2s,color .2s; }
.cs-brands-arr:hover { background:var(--main-color-one, #F83A26); border-color:var(--main-color-one, #F83A26); color:#fff; }
.cs-brands-prev { left:0; }
.cs-brands-next { right:0; }
.cs-brands-dots { display:flex; align-items:center; justify-content:center; gap:8px; padding-bottom:8px; }
.cs-brands-dot { width:8px; height:8px; border-radius:50%; border:none; background:var(--extra-light-color, #d0c8c0); cursor:pointer; padding:0; transition:background .2s,width .2s; }
.cs-brands-dot.active { background:var(--main-color-one, #F83A26); width:22px; border-radius:4px; }

/* ── Footer ── */
.cs-footer { background:var(--section-bg-2, #fdf6f0); border-top:1px solid color-mix(in srgb, var(--extra-light-color, #999999) 25%, white); padding-top:60px; }
.cs-footer-main { display:grid; grid-template-columns:1.6fr 1fr 1fr 1.4fr; gap:40px; padding-bottom:50px; border-bottom:1px solid color-mix(in srgb, var(--extra-light-color, #999999) 25%, white); }
.cs-footer-logo { max-height:48px; width:auto; display:block; margin-bottom:16px; }
.cs-footer-logo-text { font-family:'Rubik',sans-serif; font-size:24px; font-weight:800; color:var(--heading-color, #1a1a1a); display:block; margin-bottom:16px; }
.cs-footer-logo-link { text-decoration:none; }
.cs-footer-about { font-size:13px; color:var(--extra-light-color, #777); line-height:1.7; margin:0 0 20px; }
.cs-footer-social { display:flex; gap:10px; flex-wrap:wrap; }
.cs-footer-social-icon { width:36px; height:36px; border-radius:50%; background:#fff; color:var(--heading-color, #333); display:flex; align-items:center; justify-content:center; font-size:15px; text-decoration:none; border:1px solid color-mix(in srgb, var(--extra-light-color, #999999) 25%, white); transition:background .2s,color .2s,border-color .2s; }
.cs-footer-social-icon:hover { background:var(--main-color-one, #F83A26); color:#fff; border-color:var(--main-color-one, #F83A26); }
.cs-footer-col-title { font-family:'Rubik',sans-serif; font-size:14px; font-weight:700; color:var(--heading-color, #1a1a1a); text-transform:uppercase; letter-spacing:.08em; margin:0 0 20px; }
.cs-footer-links { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:10px; }
.cs-footer-links li { margin:0; }
.cs-footer-links a { font-size:13px; color:var(--extra-light-color, #777); text-decoration:none; transition:color .2s; display:inline-flex; align-items:center; gap:6px; }
.cs-footer-links a:hover { color:var(--main-color-one, #F83A26); }
.cs-footer-newsletter-text { font-size:13px; color:var(--extra-light-color, #777); line-height:1.6; margin:0 0 16px; }
.cs-footer-newsletter-form { display:flex; flex-direction:column; gap:10px; }
.cs-footer-email-input { width:100%; padding:11px 14px; border:1px solid color-mix(in srgb, var(--extra-light-color, #999999) 25%, white); border-radius:8px; font-size:13px; color:var(--heading-color, #333); background:#fff; outline:none; transition:border-color .2s; }
.cs-footer-email-input:focus { border-color:var(--main-color-one, #F83A26); }
.cs-footer-subscribe-btn { background:var(--main-color-one, #F83A26); color:#fff; border:none; padding:12px 20px; border-radius:8px; font-size:13px; font-weight:700; cursor:pointer; transition:background .2s; }
.cs-footer-subscribe-btn:hover { background:color-mix(in srgb, var(--main-color-one, #F83A26) 80%, black); }
.cs-footer-bottom { display:flex; align-items:center; justify-content:center; padding:20px 0; }
.cs-footer-copyright { font-size:13px; color:var(--extra-light-color, #aaa); text-align:center; }
.cs-footer-copyright a { color:var(--main-color-one, #F83A26); text-decoration:none; }

/* ── Responsive ── */
@media (max-width:1024px) {
    .cs-footer-main { grid-template-columns:1fr 1fr; }
    .cs-store-grid { grid-template-columns:repeat(2,1fr); }
    .cs-blog-grid { grid-template-columns:repeat(2,1fr); }
}
@media (max-width:768px) {
    .cs-hero-inner { flex-direction:column; }
    .cs-hero-left { padding:40px 24px; }
    .cs-hero-right { min-height:280px; }
    .cs-hero-mini-products { flex-wrap:wrap; }
    .cs-footer-main { grid-template-columns:1fr; }
    .cs-store-layout { flex-direction:column; }
    .cs-store-sidebar { width:100%; }
    .cs-store-catlist { flex-direction:row; flex-wrap:wrap; }
    .cs-store-grid { grid-template-columns:repeat(2,1fr); }
    .cs-blog-grid { grid-template-columns:1fr; }
    .cs-catgrid-row { grid-template-columns:repeat(2,1fr); }
    .cs-popular-grid { grid-template-columns:repeat(2,1fr); }
    .cs-flash-banner-card { flex-direction:column; min-height:auto; }
    .cs-flash-banner-left { flex:none; width:100%; padding:32px 24px 16px; text-align:center; align-items:center; }
    .cs-flash-banner-center { min-height:200px; width:100%; }
    .cs-flash-banner-right { flex:none; width:100%; padding:0 0 24px; }
    .cs-flash-discount-badge { width:88px; height:88px; }
    .cs-flash-discount-badge span { font-size:15px; }
}

/* Casual New Product Card Design */
.casual-new-product-card {
    border: 1px solid color-mix(in srgb, var(--extra-light-color, #999999) 25%, white);
    border-radius: 12px;
    background-color: #fff;
    overflow: hidden;
    transition: box-shadow 0.25s ease, transform 0.25s ease;
    display: flex;
    flex-direction: column;
    height: 100%;
}
.casual-new-product-card:hover {
    box-shadow: 0 10px 25px rgba(0,0,0,0.1);
    transform: translateY(-3px);
}
.casual-new-product-card-thumb {
    position: relative;
    overflow: hidden;
    width: 100%;
    height: 200px;
    background: #f5f5f5;
    display: flex;
    align-items: center;
    justify-content: center;
}
.casual-new-product-card-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.4s ease;
}
.casual-new-product-card:hover .casual-new-product-card-thumb img {
    transform: scale(1.06);
}
.casual-new-badge {
    position: absolute;
    top: 12px;
    left: 12px;
    background: var(--main-color-one, #F83A26);
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    padding: 3px 10px;
    border-radius: 20px;
    letter-spacing: 0.3px;
    text-transform: uppercase;
    z-index: 2;
}
.casual-new-wishlist {
    position: absolute;
    top: 12px;
    right: 12px;
    width: 34px;
    height: 34px;
    background: #fff;
    border: 1px solid color-mix(in srgb, var(--extra-light-color, #999999) 25%, white);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.2s;
    z-index: 2;
    color: var(--extra-light-color, #888);
    font-size: 16px;
}
.casual-new-wishlist:hover {
    background: var(--main-color-one, #F83A26);
    border-color: var(--main-color-one, #F83A26);
    color: #fff;
}
.casual-new-product-card-contents {
    padding: 16px;
    display: flex;
    flex-direction: column;
    flex: 1;
}
.casual-new-product-category {
    color: var(--main-color-one, #F83A26);
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.8px;
    margin-bottom: 6px;
    text-transform: uppercase;
}
.casual-new-product-title {
    font-size: 14px;
    font-weight: 600;
    color: var(--heading-color, #222);
    margin-bottom: 6px;
    line-height: 1.4;
    flex: 1;
}
.casual-new-product-title a {
    color: inherit;
    text-decoration: none;
}
.casual-new-product-title a:hover {
    color: var(--main-color-one, #F83A26);
}
.casual-new-stars {
    margin-bottom: 10px;
    font-size: 12px;
    color: var(--review-color, #f59e0b);
}
.casual-new-product-price {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 12px;
    flex-wrap: wrap;
}
.casual-new-price-sale {
    color: var(--main-color-one, #F83A26);
    font-size: 16px;
    font-weight: 700;
}
.casual-new-price-regular {
    color: var(--extra-light-color, #888);
    font-size: 13px;
    text-decoration: line-through;
}
.casual-new-add-to-cart {
    background-color: var(--main-color-one, #F83A26) !important;
    color: #fff !important;
    border-radius: 8px !important;
    padding: 9px 16px !important;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    font-weight: 600 !important;
    font-size: 13px !important;
    border: none !important;
    text-decoration: none;
    cursor: pointer;
    transition: background-color 0.2s, transform 0.2s;
}
.casual-new-add-to-cart:hover {
    background-color: color-mix(in srgb, var(--main-color-one, #F83A26) 80%, black) !important;
    color: #fff !important;
    transform: translateY(-1px);
}


/* Aromatic boutique: plum, ivory and copper. */
:root{--main-color-one:#4b2438;--main-color-two:#b77852;--heading-color:#35212d;--body-color:#66545c;}
body{background:#fffaf3;}
.ar-hero-title{display:block!important;-webkit-line-clamp:unset!important;line-clamp:unset!important;overflow:visible!important;text-overflow:clip!important;white-space:normal!important;font-size:clamp(34px,4.2vw,60px)!important;line-height:1.13!important;letter-spacing:-.025em;}
.ar-hero-sub{max-width:540px;line-height:1.8!important;color:#66545c!important;}
.ar-hero-inner{min-height:620px;gap:48px!important;}.ar-hero-widget{background:#f1e5dc!important;}.ar-section-tag{color:#70412c!important;background:#ead9c9!important;border-color:#d7b69f!important;letter-spacing:.07em;}
.ar-btn{border-radius:7px!important;font-weight:600!important;letter-spacing:.04em;}.ar-btn-red{background:#4b2438!important;color:#fff!important;border-color:#4b2438!important;}.ar-btn-outline{border-color:#4b2438!important;color:#4b2438!important;}
.ar-section-title{color:#35212d!important;letter-spacing:-.015em;}.ar-section-line{background:#b77852!important;}.ar-card{border-radius:14px!important;overflow:hidden;border:1px solid #eadfd5!important;background:#fffdf9!important;box-shadow:none!important;}.ar-card-img{background:#f4eae0!important;}.ar-card-img img{object-fit:cover!important;transition:transform .3s ease;}.ar-card:hover .ar-card-img img{transform:scale(1.025);}.ar-card-name{min-height:48px;line-height:1.5!important;}.ar-card-cat{color:#8d596a!important;letter-spacing:.06em;}.ar-card-atc{background:#4b2438!important;color:#fff!important;border-color:#4b2438!important;border-radius:7px!important;}.ar-price-sale{color:#4b2438!important;}.ar-ptl-tab.active{background:#4b2438!important;color:#fff!important;border-color:#4b2438!important;}.ar-ptl-tabs{flex-wrap:wrap;gap:10px!important;}.ar-prod-grid{row-gap:32px!important;}
.ar-promo-widget{background:#ead9c9!important;}.ar-promo-widget h2{display:block!important;overflow:visible!important;-webkit-line-clamp:unset!important;line-height:1.15!important;}.xgpb-services-strip{background:#f4eae0!important;}.xgpb-service-item{border-color:#dbc8ba!important;}.xgpb-newsletter{background:#4b2438!important;color:#fffaf3!important;}.xgpb-newsletter h2,.xgpb-newsletter p{color:#fffaf3!important;}.xgpb-newsletter input{min-width:0;}.xgpb-newsletter button{background:#fffaf3!important;color:#4b2438!important;}
.ar-footer{background:#321d2b!important;color:#ead9c9!important;}.ar-footer a,.ar-footer-heading{color:#fffaf3!important;}.ar-footer-logo-text{font-size:28px!important;letter-spacing:.12em;text-transform:uppercase;font-family:Georgia,serif!important;}.ar-footer-bottom{border-top:1px solid #654653!important;}.ar-footer-socials a[href='#'],.ar-footer-bottom-right .payment-list,.ar-footer-link[href='#']{display:none!important;}
@media(max-width:767px){.ar-hero-inner{min-height:0;gap:24px!important;}.ar-hero-title{font-size:34px!important;}.ar-hero-actions{flex-wrap:wrap;gap:12px!important;}.ar-hero-content{padding:24px 0 40px!important;}.ar-prod-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:12px!important;}.ar-card-body{padding:14px!important;}.ar-card-name{font-size:14px!important;}.ar-card-atc{font-size:12px!important;}.ar-ptl-tabs{justify-content:center!important;}.xgpb-newsletter form{flex-wrap:wrap!important;}.ar-footer-grid{gap:32px!important;}}
@media(prefers-reduced-motion:reduce){.ar-card-img img{transition:none;}}