/* HStore-inspired premium marketplace UI */
:root {
    --sf-brand: #F97316;
    --sf-brand-dark: #EA580C;
    --sf-brand-soft: #FFF7ED;
    --sf-ink: #111827;
    --sf-muted: #6B7280;
    --sf-border: #E5E7EB;
    --sf-bg: #F3F4F6;
    --sf-card: #FFFFFF;
    --sf-footer: #1F2937;
}

/* Buttons */
.sf-btn-primary {
    display: inline-flex; align-items: center; justify-content: center; gap: .375rem;
    padding: .625rem 1.25rem; border-radius: .625rem; background: var(--sf-brand);
    color: #fff; font-size: .875rem; font-weight: 600; border: none; cursor: pointer;
    text-decoration: none; transition: background .2s, transform .15s;
    box-shadow: 0 1px 2px rgba(0,0,0,.06);
}
.sf-btn-primary:hover { background: var(--sf-brand-dark); color: #fff; }
.sf-btn-white {
    display: inline-flex; align-items: center; justify-content: center;
    padding: .75rem 1.5rem; border-radius: .625rem; background: #fff;
    color: var(--sf-ink); font-size: .9375rem; font-weight: 600;
    text-decoration: none; transition: all .2s; border: none;
}
.sf-btn-white:hover { background: #F9FAFB; }
.sf-btn-outline-white {
    display: inline-flex; align-items: center; justify-content: center;
    padding: .75rem 1.5rem; border-radius: .625rem; background: transparent;
    color: #fff; font-size: .9375rem; font-weight: 600; text-decoration: none;
    border: 2px solid rgba(255,255,255,.85); transition: all .2s;
}
.sf-btn-outline-white:hover { background: rgba(255,255,255,.12); color: #fff; }
.sf-btn-ghost {
    display: inline-flex; align-items: center; justify-content: center;
    padding: .5rem 1rem; border-radius: .5rem; font-size: .875rem; font-weight: 500;
    color: var(--sf-muted); background: transparent; border: none; cursor: pointer; text-decoration: none;
}
.sf-btn-ghost:hover { color: var(--sf-ink); background: #F3F4F6; }
.sf-btn-outline {
    display: inline-flex; align-items: center; justify-content: center;
    padding: .625rem 1.25rem; border-radius: .625rem; border: 1px solid var(--sf-border);
    background: #fff; font-size: .875rem; font-weight: 600; color: var(--sf-ink);
    text-decoration: none; transition: all .2s;
}
.sf-btn-outline:hover { border-color: var(--sf-brand); color: var(--sf-brand); }
.sf-btn-login {
    display: inline-flex; align-items: center; padding: .5rem 1rem;
    border-radius: .5rem; font-size: .8125rem; font-weight: 600; color: var(--sf-ink);
    border: 1px solid var(--sf-border); background: #fff; text-decoration: none;
}
.sf-btn-signup {
    display: inline-flex; align-items: center; padding: .5rem 1rem;
    border-radius: .5rem; font-size: .8125rem; font-weight: 600; color: #fff;
    background: #059669; text-decoration: none; transition: background .2s;
}
.sf-btn-signup:hover { background: #047857; color: #fff; }
.sf-link-viewall {
    display: inline-flex; align-items: center; gap: .25rem;
    font-size: .8125rem; font-weight: 600; color: var(--sf-brand); text-decoration: none;
}
.sf-link-viewall:hover { text-decoration: underline; }

/* Header */
.sf-header { background: #fff; border-bottom: 1px solid var(--sf-border); position: sticky; top: 0; z-index: 50; }
.sf-header-inner { max-width: 1280px; margin: 0 auto; padding: .875rem 1.25rem; display: flex; align-items: center; gap: 1rem; }
.sf-logo-wrap { display: flex; align-items: center; gap: .625rem; text-decoration: none; flex-shrink: 0; }
.sf-logo-wrap img { height: 2.25rem; width: auto; object-fit: contain; }
.sf-logo-wrap--footer { display: inline-flex; margin-bottom: 1rem; }
.sf-logo-wrap--footer img { height: 2rem; max-width: 220px; filter: none; }
.sf-logo-text { font-family: Manrope, Inter, sans-serif; font-weight: 800; font-size: 1.25rem; color: var(--sf-ink); }
.sf-search-wrap { flex: 1; max-width: 520px; margin: 0 auto; position: relative; }
.sf-search-wrap input {
    width: 100%; padding: .625rem 1rem .625rem 2.75rem; border-radius: .625rem;
    border: 1px solid var(--sf-border); background: #F9FAFB; font-size: .875rem;
    transition: border-color .2s, box-shadow .2s;
}
.sf-search-wrap input:focus { outline: none; border-color: var(--sf-brand); box-shadow: 0 0 0 3px rgba(249,115,22,.12); }
.sf-search-icon { position: absolute; left: .875rem; top: 50%; transform: translateY(-50%); color: var(--sf-muted); font-size: 1.125rem; }
.sf-header-actions { display: flex; align-items: center; gap: .5rem; flex-shrink: 0; margin-left: auto; }
.sf-header-menu-btn { margin-left: .25rem; }
.sf-header-icon {
    width: 2.25rem; height: 2.25rem; display: flex; align-items: center; justify-content: center;
    border-radius: .5rem; color: var(--sf-muted); text-decoration: none; transition: all .2s; position: relative;
}
.sf-header-icon:hover { background: #F3F4F6; color: var(--sf-ink); }
.sf-mobile-menu { border-top: 1px solid var(--sf-border); background: #fff; padding: 1rem 1.25rem; }
.sf-mobile-link { display: block; padding: .625rem 0; font-weight: 500; color: var(--sf-ink); text-decoration: none; }

/* Hero HStore */
.sf-hero-hstore { max-width: 1280px; margin: 0 auto; padding: 1.25rem 1.25rem 0; }
.sf-hero-banner {
    position: relative; overflow: hidden; border-radius: 1.25rem;
    background: linear-gradient(135deg, var(--sf-brand) 0%, var(--sf-brand-dark) 100%);
    min-height: 280px; display: flex; align-items: center;
}
.sf-hero-banner__content { position: relative; z-index: 2; padding: 2.5rem 2rem; max-width: 560px; }
@media (min-width: 1024px) { .sf-hero-banner__content { padding: 3rem 3.5rem; } }
.sf-hero-banner__title {
    font-family: Manrope, Inter, sans-serif; font-weight: 800; font-size: clamp(1.75rem, 4vw, 2.75rem);
    line-height: 1.12; color: #fff; letter-spacing: -.02em;
}
.sf-hero-banner__sub { margin-top: 1rem; font-size: 1rem; line-height: 1.6; color: rgba(255,255,255,.92); max-width: 480px; }
.sf-hero-banner__actions { margin-top: 1.75rem; display: flex; flex-wrap: wrap; gap: .75rem; }
.sf-hero-visual {
    position: absolute; right: 0; top: 50%; transform: translateY(-50%);
    width: 45%; max-width: 420px; height: 100%; pointer-events: none;
}
.sf-hero-social-orbit { position: relative; width: 100%; height: 260px; }
.sf-hero-social-icon {
    position: absolute; width: 3rem; height: 3rem; border-radius: 9999px;
    background: #fff; display: flex; align-items: center; justify-content: center;
    font-size: 1.25rem; box-shadow: 0 8px 24px rgba(0,0,0,.12);
    animation: sf-orbit-float 5s ease-in-out infinite;
}
.sf-hero-social-icon--center {
    width: 4.5rem; height: 4.5rem; left: 50%; top: 50%; transform: translate(-50%,-50%);
    background: #EF4444; color: #fff; font-size: 1.75rem; animation: none;
}
.sf-hero-social-icon:nth-child(2) { top: 8%; left: 20%; animation-delay: 0s; }
.sf-hero-social-icon:nth-child(3) { top: 15%; right: 15%; animation-delay: .5s; }
.sf-hero-social-icon:nth-child(4) { bottom: 20%; left: 8%; animation-delay: 1s; }
.sf-hero-social-icon:nth-child(5) { bottom: 12%; right: 25%; animation-delay: 1.5s; }
.sf-hero-social-icon:nth-child(6) { top: 45%; right: 5%; animation-delay: 2s; }
@keyframes sf-orbit-float { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-10px)} }

/* Category strip */
.sf-section { max-width: 1280px; margin: 0 auto; padding: 2rem 1.25rem; }
.sf-section-head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 1.25rem; }
.sf-section-title { font-family: Manrope, Inter, sans-serif; font-weight: 700; font-size: 1.125rem; color: var(--sf-ink); }
.sf-cat-strip { display: flex; gap: 1.25rem; overflow-x: auto; padding-bottom: .5rem; scrollbar-width: thin; }
.sf-cat-strip::-webkit-scrollbar { height: 4px; }
.sf-cat-circle {
    flex-shrink: 0; display: flex; flex-direction: column; align-items: center; gap: .5rem;
    width: 5.5rem; text-decoration: none; transition: transform .2s;
}
.sf-cat-circle:hover { transform: translateY(-3px); }
.sf-cat-circle__icon {
    width: 3.75rem; height: 3.75rem; border-radius: 9999px; background: #fff;
    border: 1px solid var(--sf-border); display: flex; align-items: center; justify-content: center;
    overflow: hidden; box-shadow: 0 2px 8px rgba(0,0,0,.04); font-size: 1.375rem; color: var(--sf-brand);
}
.sf-cat-circle__icon img { width: 100%; height: 100%; object-fit: cover; }
.sf-cat-circle__label {
    font-size: .6875rem; font-weight: 500; color: var(--sf-muted); text-align: center;
    line-height: 1.3; max-width: 100%; overflow: hidden; text-overflow: ellipsis;
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
}

/* Product card HStore */
.sf-product-hstore {
    background: #fff; border: 1px solid var(--sf-border); border-radius: .875rem;
    overflow: hidden; transition: box-shadow .25s, transform .25s; height: 100%;
}
.sf-product-hstore__link {
    display: flex; flex-direction: column; height: 100%; text-decoration: none; color: inherit;
}
.sf-product-hstore:hover { box-shadow: 0 12px 32px rgba(0,0,0,.08); transform: translateY(-2px); }
.sf-product-hstore__top {
    display: flex; align-items: flex-start; justify-content: space-between;
    padding: .875rem .875rem 0; position: relative;
}
.sf-product-hstore__cat-icon {
    width: 2rem; height: 2rem; border-radius: .375rem; overflow: hidden;
    display: flex; align-items: center; justify-content: center; background: var(--sf-brand-soft);
    font-size: 1rem; color: var(--sf-brand);
}
.sf-product-hstore__cat-icon img { width: 100%; height: 100%; object-fit: cover; }
.sf-product-hstore__fav {
    width: 1.75rem; height: 1.75rem; border-radius: .375rem; border: none; background: transparent;
    color: #D1D5DB; cursor: pointer; display: flex; align-items: center; justify-content: center;
}
.sf-product-hstore__visual {
    height: 7rem; display: flex; align-items: center; justify-content: center; padding: .5rem 1rem;
}
.sf-product-hstore__visual img { max-height: 100%; max-width: 100%; object-fit: contain; }
.sf-product-hstore__body { padding: 0 .875rem .875rem; flex: 1; display: flex; flex-direction: column; }
.sf-product-hstore__title {
    font-size: .8125rem; font-weight: 600; color: var(--sf-ink); line-height: 1.4;
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.sf-product-hstore__rating { display: flex; align-items: center; gap: .35rem; margin-top: .25rem; }
.sf-product-hstore__rating-num { font-size: .6875rem; font-weight: 700; color: var(--sf-ink); }
.sf-stars { display: inline-flex; align-items: center; gap: .1rem; line-height: 1; }
.sf-review-item { transition: box-shadow .15s; }
.sf-review-item:hover { box-shadow: 0 4px 20px rgba(17,24,39,.06); }
.sf-product-hstore__meta { font-size: .6875rem; color: var(--sf-muted); margin-top: .375rem; }
.sf-product-hstore__footer {
    margin-top: auto; padding-top: .75rem; display: flex; align-items: center;
    justify-content: space-between; gap: .5rem;
}
.sf-product-hstore__price { font-family: Manrope, Inter, sans-serif; font-weight: 800; font-size: 1rem; color: var(--sf-brand); }
.sf-product-hstore__btn {
    padding: .375rem .75rem; border-radius: .5rem; background: var(--sf-brand); color: #fff;
    font-size: .6875rem; font-weight: 700; white-space: nowrap; transition: background .2s;
}
.sf-product-hstore:hover .sf-product-hstore__btn { background: var(--sf-brand-dark); }
.sf-badge-hot {
    position: absolute; top: .5rem; left: .5rem; padding: .125rem .375rem; border-radius: .25rem;
    background: #FEF3C7; color: #92400E; font-size: .625rem; font-weight: 700; text-transform: uppercase;
}

/* Trust cards */
.sf-trust-grid { display: grid; grid-template-columns: 1fr; gap: 1rem; }
@media (min-width: 768px) { .sf-trust-grid { grid-template-columns: repeat(3, 1fr); } }
.sf-trust-card {
    border-radius: 1rem; padding: 1.5rem 1.25rem; display: flex; gap: 1rem; align-items: flex-start;
}
.sf-trust-card--orange { background: #FFF7ED; border: 1px solid #FFEDD5; }
.sf-trust-card--green { background: #ECFDF5; border: 1px solid #D1FAE5; }
.sf-trust-card--yellow { background: #FFFBEB; border: 1px solid #FEF3C7; }
.sf-trust-card__icon {
    width: 2.75rem; height: 2.75rem; border-radius: .75rem; display: flex; align-items: center;
    justify-content: center; font-size: 1.375rem; flex-shrink: 0;
}
.sf-trust-card--orange .sf-trust-card__icon { background: var(--sf-brand); color: #fff; }
.sf-trust-card--green .sf-trust-card__icon { background: #10B981; color: #fff; }
.sf-trust-card--yellow .sf-trust-card__icon { background: #F59E0B; color: #fff; }
.sf-trust-card__title { font-weight: 700; font-size: .9375rem; color: var(--sf-ink); }
.sf-trust-card__text { font-size: .8125rem; color: var(--sf-muted); margin-top: .25rem; line-height: 1.5; }

/* SEO block */
.sf-seo-block {
    background: #fff; border: 1px solid var(--sf-border); border-radius: 1rem;
    padding: 2rem; margin: 0 1.25rem 2rem; max-width: 1280px; margin-left: auto; margin-right: auto;
}
.sf-seo-block h2 { font-family: Manrope, Inter, sans-serif; font-weight: 700; font-size: 1.25rem; margin-bottom: 1rem; }
.sf-seo-block p { font-size: .875rem; color: var(--sf-muted); line-height: 1.7; margin-bottom: .75rem; }
.sf-seo-tags { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: 1.25rem; }
.sf-seo-tag {
    padding: .375rem .875rem; border-radius: 9999px; background: #F3F4F6;
    font-size: .75rem; font-weight: 600; color: var(--sf-ink); text-decoration: none;
}
.sf-seo-tag:hover { background: var(--sf-brand-soft); color: var(--sf-brand); }

/* Footer dark */
.sf-footer { background: var(--sf-footer); color: #9CA3AF; margin-top: 2rem; }
.sf-footer-inner { max-width: 1280px; margin: 0 auto; padding: 3rem 1.25rem 1.5rem; }
.sf-footer-grid { display: grid; grid-template-columns: 1fr; gap: 2rem; }
@media (min-width: 768px) { .sf-footer-grid { grid-template-columns: 1.5fr repeat(3, 1fr); } }
@media (min-width: 1024px) { .sf-footer-grid { grid-template-columns: 1.5fr repeat(4, 1fr); } }
.sf-footer h4 { color: #fff; font-weight: 600; font-size: .875rem; margin-bottom: 1rem; }
.sf-footer ul { list-style: none; padding: 0; margin: 0; }
.sf-footer li { margin-bottom: .5rem; }
.sf-footer a { color: #9CA3AF; font-size: .8125rem; text-decoration: none; transition: color .2s; }
.sf-footer a:hover { color: #fff; }
.sf-footer-bottom {
    border-top: 1px solid #374151; margin-top: 2rem; padding-top: 1.25rem;
    display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1rem;
    font-size: .75rem;
}
.sf-livechat {
    position: fixed; bottom: 1.5rem; right: 1.5rem; z-index: 40;
    display: inline-flex; align-items: center; gap: .5rem; padding: .75rem 1.25rem;
    border-radius: 9999px; background: var(--sf-brand); color: #fff; font-weight: 600;
    font-size: .875rem; text-decoration: none; box-shadow: 0 8px 24px rgba(249,115,22,.35);
    transition: transform .2s, background .2s;
}
.sf-livechat:hover { background: var(--sf-brand-dark); color: #fff; transform: scale(1.03); }

.sf-product-desc { color: var(--sf-muted); line-height: 1.75; font-size: .9375rem; }
.sf-product-desc p { margin-bottom: .75rem; }
.sf-product-desc ul, .sf-product-desc ol { margin: .75rem 0 1rem 1.25rem; padding-left: .5rem; }
.sf-product-desc li { margin-bottom: .5rem; list-style: disc; }
.sf-product-desc ol li { list-style: decimal; }
.sf-product-desc h2, .sf-product-desc h3, .sf-product-desc h4 { color: var(--sf-ink); font-weight: 700; margin: 1.25rem 0 .5rem; }
.sf-product-desc img { max-width: 100%; height: auto; border-radius: .5rem; margin: .75rem 0; }
.sf-product-desc table { width: 100%; border-collapse: collapse; margin: 1rem 0; font-size: .875rem; }
.sf-product-desc th, .sf-product-desc td { border: 1px solid var(--sf-border); padding: .5rem .65rem; text-align: left; }
.sf-product-desc th { background: #f9fafb; font-weight: 600; }
.sf-product-desc code { background: #f3f4f6; padding: .1rem .35rem; border-radius: .25rem; font-size: .875em; }
.sf-product-desc pre { background: #1f2937; color: #f9fafb; padding: 1rem; border-radius: .5rem; overflow-x: auto; margin: 1rem 0; }

.sf-recent-orders { background: #fff; border-bottom: 1px solid var(--sf-border); overflow: hidden; }
.sf-recent-orders__track { display: flex; gap: 2.5rem; padding: .625rem 1.25rem; animation: sf-scroll-orders 40s linear infinite; white-space: nowrap; width: max-content; }
.sf-recent-orders__item { display: inline-flex; align-items: center; gap: .375rem; font-size: .8125rem; color: var(--sf-muted); }
.sf-recent-orders__item i { color: var(--sf-brand); }
@keyframes sf-scroll-orders { from { transform: translateX(0); } to { transform: translateX(-50%); } }

.sf-wa-float {
  position: fixed; bottom: 1.25rem; z-index: 45; display: inline-flex; align-items: center; gap: .625rem;
  padding: .625rem .875rem .625rem .625rem; border-radius: 9999px; background: linear-gradient(135deg, #25D366 0%, #128C7E 100%);
  color: #fff; font-weight: 700; font-size: .875rem; text-decoration: none;
  box-shadow: 0 10px 28px rgba(18,140,126,.35), 0 2px 8px rgba(0,0,0,.08);
  transition: transform .2s, box-shadow .2s;
}
.sf-wa-float:hover { color: #fff; transform: translateY(-2px) scale(1.02); box-shadow: 0 14px 32px rgba(18,140,126,.42); }
.sf-wa-float--right { right: 1.25rem; }
.sf-wa-float--left { left: 1.25rem; }
.sf-wa-float--center { left: 50%; transform: translateX(-50%); }
.sf-wa-float--center:hover { transform: translateX(-50%) translateY(-2px) scale(1.02); }
.sf-wa-float__icon {
  width: 2.5rem; height: 2.5rem; border-radius: 9999px; background: rgba(255,255,255,.18);
  display: flex; align-items: center; justify-content: center; font-size: 1.35rem;
}
.sf-wa-float__pulse {
  position: absolute; inset: 0; border-radius: 9999px; background: #25D366; opacity: .35;
  animation: sf-wa-pulse 2s ease-out infinite; pointer-events: none;
}
.sf-wa-float__label { padding-right: .25rem; white-space: nowrap; }
@media (max-width: 639px) {
  .sf-wa-float__label { display: none; }
  .sf-wa-float { padding: .5rem; border-radius: 9999px; }
}
@keyframes sf-wa-pulse { 0% { transform: scale(1); opacity: .35; } 70% { transform: scale(1.15); opacity: 0; } 100% { transform: scale(1.15); opacity: 0; } }

/* Category grid (6 columns) */
.sf-cat-grid { display: grid; gap: 1rem 1.25rem; }
.sf-cat-grid--6 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (min-width: 640px) { .sf-cat-grid--6 { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 768px) { .sf-cat-grid--6 { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .sf-cat-grid--6 { grid-template-columns: repeat(6, minmax(0, 1fr)); } }
.sf-cat-grid--5 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (min-width: 768px) { .sf-cat-grid--5 { grid-template-columns: repeat(5, minmax(0, 1fr)); } }
.sf-cat-grid--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (min-width: 768px) { .sf-cat-grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.sf-cat-grid__item {
  display: flex; flex-direction: column; align-items: center; text-align: center; text-decoration: none;
  padding: .75rem .5rem; border-radius: 1rem; transition: transform .2s, background .2s;
}
.sf-cat-grid__item:hover { transform: translateY(-3px); background: #FFF7ED; }
.sf-cat-grid__icon {
  width: 4.5rem; height: 4.5rem; border-radius: 9999px; background: #fff; border: 1px solid var(--sf-border);
  display: flex; align-items: center; justify-content: center; font-size: 1.75rem; color: var(--sf-brand);
  box-shadow: 0 4px 16px rgba(17,24,39,.06); overflow: hidden; margin-bottom: .625rem;
}
.sf-cat-grid__icon img { width: 100%; height: 100%; object-fit: cover; }
.sf-cat-grid__label { font-size: .8125rem; font-weight: 600; color: var(--sf-ink); line-height: 1.3; max-width: 100%; }
.sf-cat-grid__count { font-size: .6875rem; color: var(--sf-muted); margin-top: .125rem; }

.sf-products-panel { background: #fff; border-radius: 1rem; border: 1px solid var(--sf-border); padding: 1.5rem 1.25rem; max-width: 1280px; margin: 0 auto 2rem; width: calc(100% - 2.5rem); }
.sf-products-grid { display: grid; grid-template-columns: 1fr; gap: 1rem; }
@media (min-width: 640px) { .sf-products-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .sf-products-grid { grid-template-columns: repeat(4, 1fr); gap: 1.25rem; } }

.sf-product-detail-visual { box-shadow: 0 4px 24px rgba(0,0,0,.04); }

/* Homepage blog */
.sf-blog-home { padding: 0 1.25rem 2.5rem; }
.sf-blog-home__inner { max-width: 1280px; margin: 0 auto; }
.sf-blog-home__grid {
  display: grid; gap: 1.25rem;
  grid-template-columns: 1fr;
}
@media (min-width: 768px) {
  .sf-blog-home__grid {
    grid-template-columns: 1.15fr 1fr;
    grid-template-rows: repeat(2, minmax(200px, auto));
  }
  .sf-blog-home__card--featured { grid-row: span 2; }
}
.sf-blog-home__card {
  background: #fff; border: 1px solid var(--sf-border); border-radius: 1.25rem;
  overflow: hidden; display: flex; flex-direction: column;
  transition: transform .25s, box-shadow .25s;
}
.sf-blog-home__card:hover { transform: translateY(-4px); box-shadow: 0 12px 40px rgba(17,24,39,.08); }
.sf-blog-home__card--featured .sf-blog-home__visual { aspect-ratio: 16/10; }
.sf-blog-home__visual {
  position: relative; display: block; aspect-ratio: 16/9; overflow: hidden; background: #f3f4f6;
}
.sf-blog-home__card:not(.sf-blog-home__card--featured) .sf-blog-home__visual { aspect-ratio: 16/9; }
@media (min-width: 768px) {
  .sf-blog-home__card--featured .sf-blog-home__visual { aspect-ratio: auto; height: 100%; min-height: 320px; }
  .sf-blog-home__card:not(.sf-blog-home__card--featured) { flex-direction: row; }
  .sf-blog-home__card:not(.sf-blog-home__card--featured) .sf-blog-home__visual { width: 42%; flex-shrink: 0; aspect-ratio: auto; min-height: 160px; }
  .sf-blog-home__card:not(.sf-blog-home__card--featured) .sf-blog-home__body { flex: 1; }
}
.sf-blog-home__visual img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s; }
.sf-blog-home__card:hover .sf-blog-home__visual img { transform: scale(1.05); }
.sf-blog-home__placeholder {
  width: 100%; height: 100%; display: flex; align-items: center; justify-content: center;
  background: linear-gradient(135deg, var(--sf-brand) 0%, var(--sf-brand-dark) 100%);
  color: #fff; font-size: 3rem; opacity: .9;
}
.sf-blog-home__overlay {
  position: absolute; inset: 0;
  background: linear-gradient(to top, rgba(17,24,39,.55) 0%, transparent 50%);
  pointer-events: none;
}
.sf-blog-home__cat {
  position: absolute; top: .875rem; left: .875rem; z-index: 2;
  padding: .35rem .75rem; border-radius: 9999px; background: rgba(255,255,255,.95);
  font-size: .6875rem; font-weight: 700; color: var(--sf-brand); text-transform: uppercase; letter-spacing: .04em;
}
.sf-blog-home__body { padding: 1.25rem 1.35rem 1.35rem; display: flex; flex-direction: column; flex: 1; }
.sf-blog-home__card--featured .sf-blog-home__body { padding: 1.5rem 1.5rem 1.65rem; }
.sf-blog-home__date {
  display: inline-flex; align-items: center; gap: .35rem;
  font-size: .75rem; color: var(--sf-muted); font-weight: 500;
}
.sf-blog-home__date i { font-size: .875rem; }
.sf-blog-home__title {
  margin-top: .625rem; font-family: Manrope, Inter, sans-serif; font-weight: 800;
  font-size: 1.0625rem; line-height: 1.35; color: var(--sf-ink);
}
.sf-blog-home__card--featured .sf-blog-home__title { font-size: 1.375rem; }
.sf-blog-home__title a { color: inherit; text-decoration: none; transition: color .2s; }
.sf-blog-home__title a:hover { color: var(--sf-brand); }
.sf-blog-home__excerpt {
  margin-top: .5rem; font-size: .875rem; line-height: 1.6; color: var(--sf-muted);
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; flex: 1;
}
.sf-blog-home__card--featured .sf-blog-home__excerpt { -webkit-line-clamp: 3; }
.sf-blog-home__link {
  margin-top: .875rem; display: inline-flex; align-items: center; gap: .35rem;
  font-size: .8125rem; font-weight: 700; color: var(--sf-brand); text-decoration: none;
}
.sf-blog-home__link:hover { gap: .5rem; }

/* Blog post detail */
.sf-blog-progress {
  position: fixed; top: 0; left: 0; height: 3px; width: 0; z-index: 60;
  background: linear-gradient(90deg, var(--sf-brand), #fb923c);
  transition: width .1s linear;
}
.sf-blog-post { max-width: 1280px; margin: 0 auto; padding: 0 1.25rem 3rem; }
.sf-blog-post__hero {
  position: relative; border-radius: 1.25rem; overflow: hidden; margin: 1rem 0 2rem;
  min-height: 280px; display: flex; align-items: flex-end;
  box-shadow: 0 20px 50px rgba(17,24,39,.12);
}
.sf-blog-post__hero-media { position: absolute; inset: 0; }
.sf-blog-post__hero-media img { width: 100%; height: 100%; object-fit: cover; }
.sf-blog-post__hero-media--placeholder {
  background: linear-gradient(135deg, var(--sf-brand) 0%, #ea580c 50%, #c2410c 100%);
}
.sf-blog-post__hero-icon { position: absolute; right: 2rem; top: 50%; transform: translateY(-50%); font-size: 6rem; color: rgba(255,255,255,.15); }
.sf-blog-post__hero-overlay {
  position: absolute; inset: 0;
  background: linear-gradient(to top, rgba(17,24,39,.92) 0%, rgba(17,24,39,.55) 45%, rgba(17,24,39,.25) 100%);
}
.sf-blog-post__hero-inner {
  position: relative; z-index: 1; padding: 2rem 1.75rem 2.25rem; width: 100%; color: #fff;
}
.sf-blog-post__breadcrumb { display: flex; flex-wrap: wrap; gap: .35rem .5rem; font-size: .8125rem; margin-bottom: 1rem; opacity: .85; }
.sf-blog-post__breadcrumb a { color: #fff; text-decoration: none; }
.sf-blog-post__breadcrumb a:hover { text-decoration: underline; }
.sf-blog-post__cat {
  display: inline-block; padding: .35rem .85rem; border-radius: 9999px;
  background: rgba(255,255,255,.18); backdrop-filter: blur(6px);
  font-size: .75rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em;
  color: #fff; text-decoration: none; margin-bottom: .85rem;
}
.sf-blog-post__cat:hover { background: rgba(255,255,255,.28); color: #fff; }
.sf-blog-post__title {
  font-family: var(--sf-font-display, inherit); font-weight: 800; font-size: clamp(1.5rem, 4vw, 2.35rem);
  line-height: 1.2; margin: 0 0 .75rem; max-width: 900px;
}
.sf-blog-post__lead { font-size: 1.0625rem; line-height: 1.65; opacity: .9; max-width: 720px; margin: 0 0 1.25rem; }
.sf-blog-post__meta {
  display: flex; flex-wrap: wrap; gap: .75rem 1.25rem; font-size: .875rem; opacity: .88;
}
.sf-blog-post__meta i { margin-right: .25rem; vertical-align: -.1em; }
.sf-blog-post__keyword { background: rgba(255,255,255,.12); padding: .2rem .65rem; border-radius: 9999px; }

.sf-blog-post__layout {
  display: grid; grid-template-columns: 1fr; gap: 2rem; align-items: start;
}
@media (min-width: 1024px) {
  .sf-blog-post__layout { grid-template-columns: minmax(0, 1fr) 280px; gap: 2.5rem; }
}
.sf-blog-post__article {
  background: #fff; border: 1px solid var(--sf-border); border-radius: 1.25rem;
  padding: 1.75rem 1.5rem; box-shadow: 0 4px 24px rgba(17,24,39,.04);
}
@media (min-width: 640px) {
  .sf-blog-post__article { padding: 2.25rem 2.5rem; }
}

.sf-blog-post__toc-mobile {
  display: block; margin-bottom: 1.5rem; padding: 1rem 1.15rem;
  background: #FFF7ED; border: 1px solid #fed7aa; border-radius: .875rem;
}
@media (min-width: 1024px) { .sf-blog-post__toc-mobile { display: none; } }
.sf-blog-post__toc-mobile summary { cursor: pointer; font-weight: 700; color: var(--sf-ink); list-style: none; }
.sf-blog-post__toc-mobile summary::-webkit-details-marker { display: none; }
.sf-blog-post__toc-mobile ol { margin: .75rem 0 0; padding-left: 1.25rem; font-size: .875rem; }
.sf-blog-post__toc-mobile a { color: var(--sf-brand); text-decoration: none; }
.sf-blog-post__toc-mobile a:hover { text-decoration: underline; }

.sf-blog-article { color: var(--sf-muted); line-height: 1.85; font-size: 1.03125rem; }
.sf-blog-article > *:first-child { margin-top: 0; }
.sf-blog-article p { margin-bottom: 1.15rem; }
.sf-blog-article h2 {
  color: var(--sf-ink); font-weight: 800; font-size: 1.5rem; margin: 2.25rem 0 1rem;
  padding-bottom: .5rem; border-bottom: 2px solid #FFF7ED; scroll-margin-top: 5rem;
}
.sf-blog-article h3 {
  color: var(--sf-ink); font-weight: 700; font-size: 1.2rem; margin: 1.75rem 0 .75rem; scroll-margin-top: 5rem;
}
.sf-blog-article ul, .sf-blog-article ol { margin: 1rem 0 1.25rem; padding-left: 1.5rem; }
.sf-blog-article li { margin-bottom: .55rem; }
.sf-blog-article ul li { list-style: disc; }
.sf-blog-article ol li { list-style: decimal; }
.sf-blog-article strong { color: var(--sf-ink); font-weight: 700; }
.sf-blog-article blockquote {
  margin: 1.5rem 0; padding: 1rem 1.25rem; border-left: 4px solid var(--sf-brand);
  background: #FFF7ED; border-radius: 0 .75rem .75rem 0; color: var(--sf-ink); font-style: italic;
}
.sf-blog-article a { color: var(--sf-brand); text-decoration: underline; text-underline-offset: 2px; }
.sf-blog-article a:hover { color: var(--sf-brand-dark); }

.sf-blog-post__footer { margin-top: 2.5rem; padding-top: 1.75rem; border-top: 1px solid var(--sf-border); }
.sf-blog-post__share { display: flex; align-items: center; gap: .65rem; margin-bottom: 1.5rem; flex-wrap: wrap; }
.sf-blog-post__share span { font-weight: 600; color: var(--sf-ink); font-size: .875rem; }
.sf-blog-post__share a, .sf-blog-post__copy {
  width: 2.25rem; height: 2.25rem; border-radius: 9999px; border: 1px solid var(--sf-border);
  display: inline-flex; align-items: center; justify-content: center; background: #fff;
  color: var(--sf-muted); text-decoration: none; cursor: pointer; transition: all .2s;
}
.sf-blog-post__share a:hover, .sf-blog-post__copy:hover { border-color: var(--sf-brand); color: var(--sf-brand); background: #FFF7ED; }
.sf-blog-post__cta {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1rem;
  padding: 1.25rem 1.5rem; border-radius: 1rem;
  background: linear-gradient(135deg, #FFF7ED 0%, #fff 100%); border: 1px solid #fed7aa;
}
.sf-blog-post__cta p { margin: .25rem 0 0; font-size: .875rem; color: var(--sf-muted); }
.sf-blog-post__cta-btn {
  display: inline-flex; align-items: center; gap: .35rem; padding: .65rem 1.15rem;
  border-radius: .65rem; background: var(--sf-brand); color: #fff; font-weight: 700;
  font-size: .875rem; text-decoration: none; white-space: nowrap; transition: background .2s;
}
.sf-blog-post__cta-btn:hover { background: var(--sf-brand-dark); color: #fff; }

.sf-blog-post__sidebar { display: flex; flex-direction: column; gap: 1.25rem; }
.sf-blog-post__widget {
  background: #fff; border: 1px solid var(--sf-border); border-radius: 1rem; padding: 1.25rem;
  box-shadow: 0 2px 12px rgba(17,24,39,.04);
}
.sf-blog-post__widget--sticky { position: sticky; top: 5.5rem; }
.sf-blog-post__widget h3 {
  font-size: .9375rem; font-weight: 800; color: var(--sf-ink); margin: 0 0 .85rem;
  display: flex; align-items: center; gap: .4rem;
}
.sf-blog-post__widget h3 i { color: var(--sf-brand); }
.sf-blog-post__toc ol { margin: 0; padding-left: 1.1rem; font-size: .8125rem; line-height: 1.5; }
.sf-blog-post__toc a { color: var(--sf-muted); text-decoration: none; display: block; padding: .25rem 0; }
.sf-blog-post__toc a:hover { color: var(--sf-brand); }
.sf-blog-post__toc-lvl-3 { margin-left: .75rem; list-style: circle; }
.sf-blog-post__cats { list-style: none; margin: 0; padding: 0; }
.sf-blog-post__cats a {
  display: block; padding: .45rem .65rem; border-radius: .5rem; font-size: .875rem;
  color: var(--sf-muted); text-decoration: none; transition: background .2s, color .2s;
}
.sf-blog-post__cats a:hover, .sf-blog-post__cats a.is-active { background: #FFF7ED; color: var(--sf-brand); font-weight: 600; }
.sf-blog-post__widget--accent { background: linear-gradient(160deg, #FFF7ED, #fff); border-color: #fed7aa; }
.sf-blog-post__widget--accent p { font-size: .8125rem; color: var(--sf-muted); margin: 0 0 .85rem; line-height: 1.55; }
.sf-blog-post__sidebar-btn {
  display: block; text-align: center; padding: .55rem; border-radius: .5rem;
  background: var(--sf-brand); color: #fff; font-weight: 700; font-size: .8125rem; text-decoration: none;
}
.sf-blog-post__sidebar-btn:hover { background: var(--sf-brand-dark); color: #fff; }

.sf-blog-post__related { margin-top: 3rem; padding-top: 2rem; border-top: 1px solid var(--sf-border); }
.sf-blog-post__related-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 1.25rem; gap: 1rem; }
.sf-blog-post__related-head h2 { font-size: 1.375rem; font-weight: 800; color: var(--sf-ink); margin: 0; }
.sf-blog-post__related-more { font-size: .875rem; font-weight: 600; color: var(--sf-brand); text-decoration: none; display: inline-flex; align-items: center; gap: .25rem; }
.sf-blog-post__related-more:hover { text-decoration: underline; }

/* Catalog advanced filters */
.sf-catalog__layout { display: grid; grid-template-columns: 1fr; gap: 2rem; align-items: start; }
@media (min-width: 1024px) { .sf-catalog__layout { grid-template-columns: 280px minmax(0, 1fr); gap: 2.5rem; } }
.sf-catalog__sidebar { display: flex; flex-direction: column; gap: 1.25rem; }
@media (min-width: 1024px) {
  .sf-catalog__sidebar {
    position: sticky;
    top: 5.5rem;
    align-self: start;
    max-height: calc(100vh - 6rem);
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-width: thin;
    padding-bottom: .5rem;
  }
}
.sf-catalog__panel {
  background: #fff; border: 1px solid var(--sf-border); border-radius: 1.25rem;
  padding: 1.25rem; box-shadow: 0 4px 20px rgba(17,24,39,.04);
  flex-shrink: 0;
}
.sf-catalog__panel--cats { z-index: 2; }
.sf-catalog__panel--filters { z-index: 1; }
.sf-catalog__panel-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 1rem; }
.sf-catalog__panel-head h2 { font-size: 1rem; font-weight: 800; color: var(--sf-ink); margin: 0; display: flex; align-items: center; gap: .4rem; }
.sf-catalog__panel-head h2 i { color: var(--sf-brand); }
.sf-catalog__clear { font-size: .75rem; font-weight: 700; color: var(--sf-brand); text-decoration: none; }
.sf-catalog__clear:hover { text-decoration: underline; }
.sf-catalog__filter-block { margin-bottom: 1rem; }
.sf-catalog__label { display: block; font-size: .75rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--sf-muted); margin-bottom: .5rem; }
.sf-catalog__input, .sf-catalog__select {
  width: 100%; border: 1px solid var(--sf-border); border-radius: .65rem; padding: .55rem .75rem;
  font-size: .875rem; background: #fff; color: var(--sf-ink);
}
.sf-catalog__input:focus, .sf-catalog__select:focus { outline: none; border-color: var(--sf-brand); box-shadow: 0 0 0 3px rgba(249,115,22,.15); }
.sf-catalog__check { display: flex; align-items: center; gap: .5rem; font-size: .875rem; color: var(--sf-ink); margin-bottom: .35rem; cursor: pointer; }
.sf-catalog__check input { accent-color: var(--sf-brand); width: 1rem; height: 1rem; }
.sf-catalog__price-row { display: grid; grid-template-columns: 1fr auto 1fr; gap: .35rem; align-items: center; }
.sf-catalog__price-row span { color: var(--sf-muted); font-size: .75rem; }
.sf-catalog__hint { display: block; margin-top: .35rem; font-size: .6875rem; color: var(--sf-muted); }
.sf-catalog__apply {
  width: 100%; margin-top: .5rem; padding: .65rem; border: none; border-radius: .65rem;
  background: var(--sf-brand); color: #fff; font-weight: 700; font-size: .875rem; cursor: pointer;
  display: flex; align-items: center; justify-content: center; gap: .35rem; transition: background .2s;
}
.sf-catalog__apply:hover { background: var(--sf-brand-dark); }
.sf-catalog__cats-title { font-size: .9375rem; font-weight: 800; margin: 0 0 .85rem; display: flex; align-items: center; gap: .4rem; color: var(--sf-ink); }
.sf-catalog__cats-title i { color: var(--sf-brand); }
.sf-catalog__cats { list-style: none; margin: 0; padding: 0; }
.sf-catalog__cats a {
  display: flex; align-items: center; justify-content: space-between; padding: .45rem .65rem;
  border-radius: .5rem; font-size: .875rem; color: var(--sf-muted); text-decoration: none; transition: all .2s;
}
.sf-catalog__cats a:hover, .sf-catalog__cats a.is-active { background: #FFF7ED; color: var(--sf-brand); font-weight: 600; }
.sf-catalog__sub { padding-left: 1.25rem !important; font-size: .8125rem !important; }
.sf-catalog__count { font-size: .6875rem; opacity: .7; background: rgba(0,0,0,.05); padding: .1rem .4rem; border-radius: 9999px; }
.sf-catalog__header { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 1rem; margin-bottom: 1.5rem; }
.sf-catalog__title { font-family: var(--sf-font-display, inherit); font-weight: 800; font-size: clamp(1.5rem, 3vw, 2rem); color: var(--sf-ink); margin: 0; }
.sf-catalog__desc { color: var(--sf-muted); margin: .5rem 0 0; max-width: 640px; line-height: 1.6; font-size: .9375rem; }
.sf-catalog__stats { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem; font-size: .875rem; color: var(--sf-muted); }
.sf-catalog__stats strong { color: var(--sf-ink); }
.sf-catalog__badge { background: #FFF7ED; color: var(--sf-brand); font-size: .75rem; font-weight: 700; padding: .25rem .65rem; border-radius: 9999px; }
.sf-catalog__chips { display: flex; flex-wrap: wrap; gap: .5rem; margin-bottom: 1.25rem; }
.sf-catalog__chip { font-size: .75rem; font-weight: 600; padding: .3rem .65rem; border-radius: 9999px; background: #f3f4f6; color: var(--sf-ink); }
.sf-catalog__empty { text-align: center; padding: 4rem 1.5rem; background: #fff; border: 1px solid var(--sf-border); border-radius: 1.25rem; }
.sf-catalog__empty i { font-size: 3rem; color: #e5e7eb; }
.sf-catalog__empty p { color: var(--sf-muted); margin-top: 1rem; }
.sf-catalog__pagination { display: flex; justify-content: center; flex-wrap: wrap; gap: .5rem; margin-top: 2.5rem; }
.sf-catalog__page {
  min-width: 2.5rem; height: 2.5rem; display: inline-flex; align-items: center; justify-content: center;
  border-radius: .65rem; font-size: .875rem; font-weight: 600; border: 1px solid var(--sf-border);
  color: var(--sf-muted); text-decoration: none; background: #fff; transition: all .2s;
}
.sf-catalog__page:hover { border-color: var(--sf-brand); color: var(--sf-brand); }
.sf-catalog__page.is-active { background: var(--sf-brand); border-color: var(--sf-brand); color: #fff; }
.sf-catalog__page-dots { align-self: center; color: var(--sf-muted); padding: 0 .25rem; }

/* FAQ / SSS */
.sf-section-head--stack { flex-direction: column; align-items: flex-start; }
.sf-faq-subtitle { margin: .35rem 0 0; font-size: .9375rem; color: var(--sf-muted); line-height: 1.5; max-width: 640px; }
.sf-faq-list { display: flex; flex-direction: column; gap: .75rem; max-width: 900px; margin: 0 auto; }
.sf-faq-item {
  background: #fff; border: 1px solid var(--sf-border); border-radius: 1rem;
  overflow: hidden; box-shadow: 0 2px 12px rgba(17,24,39,.04);
  transition: border-color .2s, box-shadow .2s;
}
.sf-faq-item[open] { border-color: rgba(249,115,22,.35); box-shadow: 0 4px 20px rgba(249,115,22,.08); }
.sf-faq-item[open] .sf-faq-chevron { transform: rotate(180deg); color: var(--sf-brand); }
.sf-faq-question {
  list-style: none; display: flex; align-items: flex-start; gap: .75rem;
  padding: 1rem 1.15rem; cursor: pointer; font-weight: 600; font-size: .9375rem;
  color: var(--sf-ink); line-height: 1.45; user-select: none;
}
.sf-faq-question::-webkit-details-marker { display: none; }
.sf-faq-qmark {
  flex-shrink: 0; width: 2rem; height: 2rem; border-radius: .65rem;
  background: var(--sf-brand-soft); color: var(--sf-brand);
  display: flex; align-items: center; justify-content: center; font-size: 1rem;
}
.sf-faq-question-text { flex: 1; padding-top: .2rem; }
.sf-faq-chevron { flex-shrink: 0; font-size: 1.25rem; color: var(--sf-muted); transition: transform .2s, color .2s; margin-top: .15rem; }
.sf-faq-answer {
  padding: 0 1.15rem 1.15rem 3.9rem; color: var(--sf-muted); font-size: .875rem; line-height: 1.65;
  border-top: 1px solid var(--sf-border); margin-top: -.25rem; padding-top: .85rem;
}
.sf-faq-answer p { margin: 0 0 .65rem; }
.sf-faq-answer p:last-child { margin-bottom: 0; }

/* Balance deposit / checkout */
.sf-balance-hero {
    background: linear-gradient(135deg, var(--sf-brand) 0%, var(--sf-brand-dark) 55%, #C2410C 100%);
    color: #fff;
    padding: 1.5rem 0 2rem;
    position: relative;
    overflow: hidden;
}
.sf-balance-hero::before {
    content: ''; position: absolute; inset: 0;
    background: radial-gradient(circle at 85% 20%, rgba(255,255,255,.14) 0%, transparent 45%),
                radial-gradient(circle at 10% 90%, rgba(0,0,0,.12) 0%, transparent 40%);
    pointer-events: none;
}
.sf-balance-hero__inner { position: relative; z-index: 1; padding-top: 1.25rem; padding-bottom: 0; }
.sf-balance-crumb {
    display: flex; flex-wrap: wrap; align-items: center; gap: .25rem;
    font-size: .8125rem; color: rgba(255,255,255,.82); margin-bottom: 1.25rem;
}
.sf-balance-crumb a { color: rgba(255,255,255,.92); text-decoration: none; transition: color .2s; }
.sf-balance-crumb a:hover { color: #fff; }
.sf-balance-crumb i { font-size: 1rem; opacity: .7; }
.sf-balance-crumb span { color: #fff; font-weight: 600; }
.sf-balance-hero__grid {
    display: grid; gap: 1.25rem; align-items: stretch;
}
@media (min-width: 768px) {
    .sf-balance-hero__grid { grid-template-columns: 1fr auto; align-items: center; }
}
.sf-balance-hero__badge {
    display: inline-flex; align-items: center; gap: .375rem;
    padding: .35rem .75rem; border-radius: 9999px;
    background: rgba(255,255,255,.16); font-size: .75rem; font-weight: 600;
    backdrop-filter: blur(6px);
}
.sf-balance-hero__title {
    font-family: Manrope, Inter, sans-serif; font-weight: 800;
    font-size: clamp(1.5rem, 4vw, 2rem); margin: .75rem 0 0; line-height: 1.2;
}
.sf-balance-hero__sub { margin: .5rem 0 0; font-size: .9375rem; color: rgba(255,255,255,.88); max-width: 520px; line-height: 1.55; }
.sf-balance-wallet {
    background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.22);
    border-radius: 1.15rem; padding: 1.15rem 1.35rem; min-width: 220px;
    backdrop-filter: blur(10px);
}
.sf-balance-wallet__label { display: block; font-size: .75rem; font-weight: 600; text-transform: uppercase; letter-spacing: .04em; opacity: .85; }
.sf-balance-wallet__amount {
    display: block; font-family: Manrope, Inter, sans-serif; font-size: 1.75rem; font-weight: 800;
    margin-top: .25rem; line-height: 1.15;
}
.sf-balance-wallet__amount small { font-size: 1rem; font-weight: 700; opacity: .9; }
.sf-balance-wallet__link {
    display: inline-flex; align-items: center; gap: .25rem; margin-top: .65rem;
    font-size: .8125rem; font-weight: 600; color: #fff; text-decoration: none; opacity: .92;
}
.sf-balance-wallet__link:hover { opacity: 1; text-decoration: underline; }
.sf-balance-steps {
    list-style: none; padding: 0; margin: 1.75rem 0 0;
    display: flex; align-items: center; flex-wrap: wrap; gap: .5rem;
}
.sf-balance-step {
    display: flex; align-items: center; gap: .5rem;
    padding: .5rem .85rem; border-radius: 9999px;
    background: rgba(255,255,255,.12); border: 1px solid rgba(255,255,255,.18);
    font-size: .8125rem; font-weight: 600; color: rgba(255,255,255,.75);
}
.sf-balance-step.is-active {
    background: #fff; color: var(--sf-brand); border-color: #fff;
    box-shadow: 0 8px 24px rgba(0,0,0,.12);
}
.sf-balance-step.is-done { background: rgba(255,255,255,.2); color: #fff; }
.sf-balance-step__num {
    width: 1.5rem; height: 1.5rem; border-radius: 9999px;
    display: inline-flex; align-items: center; justify-content: center;
    background: rgba(0,0,0,.12); font-size: .75rem; font-weight: 700;
}
.sf-balance-step.is-active .sf-balance-step__num { background: var(--sf-brand-soft); color: var(--sf-brand); }
.sf-balance-step.is-done .sf-balance-step__num { background: rgba(255,255,255,.25); }
.sf-balance-step__line {
    flex: 1; min-width: 1.5rem; max-width: 3rem; height: 2px;
    background: rgba(255,255,255,.25); border-radius: 9999px; list-style: none;
}
@media (max-width: 639px) { .sf-balance-step__line { display: none; } }

.sf-balance-layout {
    display: grid; gap: 1.5rem; align-items: start;
    margin-top: -1rem; position: relative; z-index: 2;
}
@media (min-width: 1024px) {
    .sf-balance-layout { grid-template-columns: 1fr 340px; gap: 1.75rem; }
}
.sf-balance-main {
    background: var(--sf-card); border: 1px solid var(--sf-border);
    border-radius: 1.25rem; padding: 1.5rem;
    box-shadow: 0 4px 24px rgba(17,24,39,.06);
}
@media (min-width: 640px) { .sf-balance-main { padding: 2rem; } }
.sf-balance-block + .sf-balance-block { margin-top: 2rem; padding-top: 2rem; border-top: 1px solid var(--sf-border); }
.sf-balance-block__head {
    display: flex; align-items: center; gap: .65rem; margin-bottom: 1.15rem;
}
.sf-balance-block__num {
    width: 1.75rem; height: 1.75rem; border-radius: .55rem;
    background: var(--sf-brand-soft); color: var(--sf-brand);
    display: inline-flex; align-items: center; justify-content: center;
    font-size: .8125rem; font-weight: 800;
}
.sf-balance-block__title { font-family: Manrope, Inter, sans-serif; font-weight: 700; font-size: 1.0625rem; color: var(--sf-ink); margin: 0; }
.sf-balance-block__hint { font-size: .8125rem; color: var(--sf-muted); margin: -.5rem 0 1rem 2.4rem; }

.sf-balance-presets { display: flex; flex-wrap: wrap; gap: .5rem; margin-bottom: .85rem; }
.sf-balance-preset {
    padding: .55rem 1rem; border-radius: .75rem; border: 1px solid var(--sf-border);
    background: #fff; font-size: .8125rem; font-weight: 600; color: var(--sf-ink);
    cursor: pointer; transition: all .2s;
}
.sf-balance-preset:hover, .sf-balance-preset.is-active {
    border-color: var(--sf-brand); background: var(--sf-brand-soft); color: var(--sf-brand);
}
.sf-balance-amount-wrap { position: relative; }
.sf-balance-amount-wrap .sf-balance-currency {
    position: absolute; left: 1rem; top: 50%; transform: translateY(-50%);
    font-weight: 700; color: var(--sf-muted); font-size: 1.125rem;
}
.sf-balance-amount-input {
    width: 100%; padding: .95rem 1rem .95rem 2.75rem;
    border: 2px solid var(--sf-border); border-radius: .85rem;
    font-size: 1.375rem; font-weight: 700; font-family: Manrope, Inter, sans-serif;
    color: var(--sf-ink); background: #FAFAFA; transition: border-color .2s, box-shadow .2s;
}
.sf-balance-amount-input:focus {
    outline: none; border-color: var(--sf-brand); background: #fff;
    box-shadow: 0 0 0 4px rgba(249,115,22,.12);
}
.sf-balance-limits { font-size: .75rem; color: var(--sf-muted); margin-top: .45rem; }

.sf-balance-pay-grid {
    display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem;
}
@media (min-width: 640px) { .sf-balance-pay-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.sf-balance-pay-card {
    position: relative; display: flex; flex-direction: column; align-items: center; text-align: center;
    padding: 1rem .65rem; border-radius: 1rem; border: 2px solid var(--sf-border);
    background: #fff; cursor: pointer; transition: all .2s; min-height: 108px;
}
.sf-balance-pay-card:hover { border-color: rgba(249,115,22,.45); transform: translateY(-2px); box-shadow: 0 8px 20px rgba(17,24,39,.06); }
.sf-balance-pay-card.is-selected {
    border-color: var(--sf-brand); background: var(--sf-brand-soft);
    box-shadow: 0 8px 24px rgba(249,115,22,.15);
}
.sf-balance-pay-card input { position: absolute; opacity: 0; pointer-events: none; }
.sf-balance-pay-card__icon {
    width: 2.75rem; height: 2.75rem; border-radius: .85rem;
    background: var(--sf-brand-soft); color: var(--sf-brand);
    display: flex; align-items: center; justify-content: center; font-size: 1.35rem;
}
.sf-balance-pay-card.is-selected .sf-balance-pay-card__icon { background: var(--sf-brand); color: #fff; }
.sf-balance-pay-card__name { margin-top: .55rem; font-size: .75rem; font-weight: 700; color: var(--sf-ink); line-height: 1.3; }
.sf-balance-pay-card__fee {
    margin-top: .25rem; font-size: .625rem; font-weight: 700; color: #D97706;
    background: #FFFBEB; padding: .1rem .4rem; border-radius: 9999px;
}
.sf-balance-pay-card__check {
    position: absolute; top: .45rem; right: .45rem; width: 1.25rem; height: 1.25rem;
    border-radius: 9999px; border: 2px solid var(--sf-border); background: #fff;
    display: flex; align-items: center; justify-content: center; font-size: .75rem; color: transparent;
}
.sf-balance-pay-card.is-selected .sf-balance-pay-card__check {
    border-color: var(--sf-brand); background: var(--sf-brand); color: #fff;
}

.sf-balance-coupon {
    display: flex; gap: .5rem; flex-wrap: wrap;
}
.sf-balance-coupon input {
    flex: 1; min-width: 140px; padding: .65rem .85rem; border-radius: .75rem;
    border: 1px solid var(--sf-border); font-size: .875rem; text-transform: uppercase; letter-spacing: .04em;
}
.sf-balance-coupon input:focus { outline: none; border-color: var(--sf-brand); }
.sf-balance-coupon-msg { font-size: .75rem; margin-top: .4rem; }
.sf-balance-coupon-msg.is-success { color: #059669; }
.sf-balance-coupon-msg.is-hidden { display: none; }

.sf-balance-alert {
    padding: .85rem 1rem; border-radius: .85rem; font-size: .8125rem; line-height: 1.5;
    margin-bottom: 1.25rem;
}
.sf-balance-alert--error { background: #FEF2F2; border: 1px solid #FECACA; color: #B91C1C; }
.sf-balance-alert--warn { background: #FFFBEB; border: 1px solid #FDE68A; color: #92400E; }
.sf-balance-alert.is-hidden { display: none; }

.sf-balance-submit {
    width: 100%; padding: 1rem 1.25rem; font-size: 1rem; border-radius: .85rem;
    margin-top: .5rem;
}
.sf-balance-submit:disabled { opacity: .55; cursor: not-allowed; }

.sf-balance-aside { position: sticky; top: 5.5rem; }
.sf-balance-summary {
    background: var(--sf-card); border: 1px solid var(--sf-border);
    border-radius: 1.25rem; overflow: hidden;
    box-shadow: 0 4px 24px rgba(17,24,39,.06);
}
.sf-balance-summary__head {
    display: flex; align-items: center; gap: .5rem; padding: 1rem 1.15rem;
    background: linear-gradient(180deg, #FAFAFA 0%, #fff 100%);
    border-bottom: 1px solid var(--sf-border);
    font-family: Manrope, Inter, sans-serif; font-weight: 700; font-size: .9375rem;
}
.sf-balance-summary__head i { color: var(--sf-brand); font-size: 1.15rem; }
.sf-balance-summary__head h2 { margin: 0; font-size: inherit; }
.sf-balance-summary__rows { padding: .85rem 1.15rem 0; margin: 0; }
.sf-balance-summary__row {
    display: flex; justify-content: space-between; align-items: baseline; gap: .75rem;
    padding: .55rem 0; border-bottom: 1px dashed var(--sf-border); font-size: .8125rem;
}
.sf-balance-summary__row dt { color: var(--sf-muted); margin: 0; }
.sf-balance-summary__row dd { margin: 0; font-weight: 700; color: var(--sf-ink); text-align: right; }
.sf-balance-summary__row--discount dd { color: #059669; }
.sf-balance-summary__row--bonus dd { color: #059669; font-weight: 800; }
.sf-balance-summary__row--total-credit dd { color: var(--sf-brand); font-weight: 800; }
.sf-balance-summary__row--fee dd { color: #D97706; }
.sf-balance-summary__row.is-hidden { display: none; }
.sf-balance-summary__total {
    display: flex; justify-content: space-between; align-items: center;
    padding: 1rem 1.15rem; background: var(--sf-brand-soft);
    border-top: 1px solid rgba(249,115,22,.15);
    font-size: .875rem; font-weight: 600;
}
.sf-balance-summary__total strong {
    font-family: Manrope, Inter, sans-serif; font-size: 1.25rem; color: var(--sf-brand);
}
.sf-balance-summary__after {
    display: flex; justify-content: space-between; align-items: center;
    padding: .85rem 1.15rem 1rem; font-size: .8125rem; color: var(--sf-muted);
}
.sf-balance-summary__after strong { color: var(--sf-ink); font-size: .9375rem; }

.sf-balance-trust-mini {
    list-style: none; padding: 0; margin: 1rem 0 0;
    display: flex; flex-direction: column; gap: .55rem;
}
.sf-balance-trust-mini li {
    display: flex; align-items: center; gap: .5rem; font-size: .75rem; font-weight: 600;
    color: var(--sf-muted); padding: .55rem .75rem; border-radius: .65rem;
    background: #fff; border: 1px solid var(--sf-border);
}
.sf-balance-trust-mini i { color: var(--sf-brand); font-size: 1rem; }

.sf-balance-pay-panel {
    background: var(--sf-card); border: 1px solid var(--sf-border);
    border-radius: 1.25rem; overflow: hidden;
    box-shadow: 0 4px 24px rgba(17,24,39,.06);
}
.sf-balance-pay-panel__head {
    padding: 1.25rem 1.5rem; border-bottom: 1px solid var(--sf-border);
    display: flex; align-items: center; gap: .85rem;
}
.sf-balance-pay-panel__icon {
    width: 3rem; height: 3rem; border-radius: 1rem;
    background: var(--sf-brand-soft); color: var(--sf-brand);
    display: flex; align-items: center; justify-content: center; font-size: 1.5rem;
}
.sf-balance-pay-panel__title { font-family: Manrope, Inter, sans-serif; font-weight: 700; font-size: 1.125rem; margin: 0; }
.sf-balance-pay-panel__sub { font-size: .8125rem; color: var(--sf-muted); margin: .15rem 0 0; }
.sf-balance-pay-panel__body { padding: 1.5rem; }
.sf-balance-pay-panel__body--center { text-align: center; }
.sf-balance-back {
    display: inline-flex; align-items: center; gap: .35rem; margin-top: 1.25rem;
    font-size: .8125rem; font-weight: 600; color: var(--sf-muted); text-decoration: none;
}
.sf-balance-back:hover { color: var(--sf-brand); }
.sf-balance-empty {
    text-align: center; padding: 3rem 1.5rem; background: #fff;
    border: 1px solid var(--sf-border); border-radius: 1.25rem;
}
.sf-balance-empty i { font-size: 3rem; color: #E5E7EB; }
.sf-balance-empty p { color: var(--sf-muted); margin-top: 1rem; }

.sf-balance-havale {
    background: #FFFBEB; border: 1px solid #FDE68A; border-radius: .85rem;
    padding: .85rem 1rem; font-size: .8125rem; color: #92400E; margin-bottom: 1rem;
}
.sf-balance-havale-dl { display: grid; gap: .65rem; font-size: .875rem; }
.sf-balance-havale-dl > div {
    display: flex; justify-content: space-between; gap: 1rem; padding-bottom: .65rem;
    border-bottom: 1px solid var(--sf-border);
}
.sf-balance-havale-dl dt { color: var(--sf-muted); }
.sf-balance-havale-dl dd { margin: 0; font-weight: 600; text-align: right; }
.sf-balance-havale-dl code { color: var(--sf-brand); font-weight: 700; }

.sf-balance-packages-wrap { margin-bottom: 1.15rem; }
.sf-balance-packages-head {
    display: flex; align-items: center; justify-content: space-between; gap: .75rem;
    margin-bottom: .75rem; font-size: .875rem; font-weight: 700; color: var(--sf-ink);
}
.sf-balance-packages-head i { color: var(--sf-brand); }
.sf-balance-packages-custom {
    border: none; background: transparent; color: var(--sf-brand); font-size: .8125rem;
    font-weight: 600; cursor: pointer; text-decoration: underline; padding: 0;
}
.sf-balance-packages {
    display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem;
}
@media (min-width: 640px) { .sf-balance-packages { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.sf-balance-package {
    position: relative; display: flex; flex-direction: column; align-items: center; text-align: center;
    padding: 1rem .65rem; border-radius: 1rem; border: 2px solid var(--sf-border);
    background: linear-gradient(180deg, #fff 0%, #FFFBEB 100%);
    cursor: pointer; transition: all .2s; min-height: 120px;
}
.sf-balance-package:hover { border-color: rgba(249,115,22,.45); transform: translateY(-2px); box-shadow: 0 8px 20px rgba(17,24,39,.06); }
.sf-balance-package.is-selected {
    border-color: var(--sf-brand); background: linear-gradient(180deg, #FFF7ED 0%, #FFEDD5 100%);
    box-shadow: 0 8px 24px rgba(249,115,22,.18);
}
.sf-balance-package__badge {
    position: absolute; top: .45rem; right: .45rem; font-size: .625rem; font-weight: 800;
    background: var(--sf-brand); color: #fff; padding: .15rem .45rem; border-radius: 9999px;
}
.sf-balance-package__deposit {
    font-family: Manrope, Inter, sans-serif; font-size: 1.25rem; font-weight: 800; color: var(--sf-ink);
}
.sf-balance-package__plus { color: var(--sf-muted); font-size: .875rem; margin: .15rem 0; }
.sf-balance-package__bonus {
    font-size: .8125rem; font-weight: 700; color: #059669;
    background: #ECFDF5; padding: .2rem .55rem; border-radius: 9999px;
}
.sf-balance-package__title {
    margin-top: .4rem; font-size: .6875rem; color: var(--sf-muted); font-weight: 600;
}
.sf-balance-packages-empty {
    grid-column: 1 / -1; font-size: .8125rem; color: var(--sf-muted);
    padding: .85rem 1rem; background: #F9FAFB; border-radius: .75rem; border: 1px dashed var(--sf-border);
    margin: 0;
}
#customAmountSection.is-hidden { display: none; }

/* Cookie consent (KVKK) */
.sf-cookie-banner {
    position: fixed; bottom: 0; left: 0; right: 0; z-index: 9999;
    background: rgba(17,24,39,.96); color: #f9fafb; padding: 1rem;
    box-shadow: 0 -8px 32px rgba(0,0,0,.2);
}
.sf-cookie-banner__inner {
    max-width: 72rem; margin: 0 auto; display: flex; flex-wrap: wrap;
    align-items: center; justify-content: space-between; gap: 1rem;
}
.sf-cookie-banner__text { display: flex; align-items: flex-start; gap: .75rem; flex: 1; min-width: 240px; }
.sf-cookie-banner__text i { font-size: 1.35rem; color: var(--sf-brand,#f97316); flex-shrink: 0; margin-top: .1rem; }
.sf-cookie-banner__text p { margin: 0; font-size: .8125rem; line-height: 1.5; color: #e5e7eb; }
.sf-cookie-banner__link { color: var(--sf-brand,#f97316); text-decoration: underline; }
.sf-cookie-banner__actions { display: flex; gap: .5rem; flex-shrink: 0; }
.sf-cookie-banner__btn {
    border: none; border-radius: .65rem; padding: .55rem 1.1rem; font-size: .8125rem;
    font-weight: 700; cursor: pointer; transition: opacity .15s;
}
.sf-cookie-banner__btn--ghost { background: transparent; color: #d1d5db; border: 1px solid #4b5563; }
.sf-cookie-banner__btn--primary { background: var(--sf-brand,#f97316); color: #fff; }
.sf-cookie-banner__btn:hover { opacity: .9; }

/* Trust band (footer üstü) */
.sf-trust-band {
    background: linear-gradient(180deg, #fff 0%, #f9fafb 100%);
    border-top: 1px solid var(--sf-border,#e5e7eb);
    border-bottom: 1px solid var(--sf-border,#e5e7eb);
    padding: 1.25rem 1rem;
}
.sf-trust-band__inner {
    max-width: 72rem; margin: 0 auto; display: flex; flex-wrap: wrap;
    align-items: center; justify-content: space-between; gap: 1.25rem;
}
.sf-trust-band__stats { display: flex; flex-wrap: wrap; gap: 1.5rem 2rem; }
.sf-trust-band__stat { display: flex; flex-direction: column; gap: .15rem; }
.sf-trust-band__stat strong { font-family: Manrope, Inter, sans-serif; font-size: 1.125rem; color: var(--sf-ink,#111827); }
.sf-trust-band__stat span { font-size: .75rem; color: var(--sf-muted,#6b7280); }
.sf-trust-band__payments { display: flex; align-items: center; gap: .75rem; flex-wrap: wrap; }
.sf-trust-band__pay-label { font-size: .6875rem; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--sf-muted); }
.sf-trust-band__pay-icons { display: flex; gap: .5rem; }
.sf-trust-band__pay {
    width: 2.25rem; height: 2.25rem; display: flex; align-items: center; justify-content: center;
    background: #fff; border: 1px solid var(--sf-border); border-radius: .5rem; color: var(--sf-brand);
    font-size: 1.1rem;
}

/* Kategori SEO intro */
.sf-catalog__seo-intro { line-height: 1.75; }

/* Blog iç linkleme */
.sf-inline-commerce-link { color: var(--sf-brand,#f97316); font-weight: 600; text-decoration: underline; text-underline-offset: 2px; }
.sf-blog-commerce-links {
    margin-top: 2rem; padding: 1.25rem 1.5rem; background: #fffbeb;
    border: 1px solid #fde68a; border-radius: 1rem;
}
.sf-blog-commerce-links h3 { font-size: .9375rem; font-weight: 700; margin: 0 0 .65rem; display: flex; align-items: center; gap: .35rem; }
.sf-blog-commerce-links h3 + ul { margin-bottom: 1rem; }
.sf-blog-commerce-links ul { list-style: none; padding: 0; margin: 0 0 1rem; display: flex; flex-wrap: wrap; gap: .5rem; }
.sf-blog-commerce-links li a {
    display: inline-block; font-size: .8125rem; font-weight: 600; padding: .35rem .75rem;
    background: #fff; border: 1px solid #fcd34d; border-radius: 9999px; color: var(--sf-ink); text-decoration: none;
}
.sf-blog-commerce-links li a:hover { border-color: var(--sf-brand); color: var(--sf-brand); }

/* Legacy compat */
.sf-glass { background: rgba(255,255,255,.95); }
.sf-nav-link, .sf-mega-item, .sf-category-card, .sf-cat-pill, .sf-mobile-link { /* kept for inner pages */ }
.line-clamp-2 { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
