.sht-stabs { --gap:16px; }
.sht-stabs__strip {
    display:grid;
    grid-template-columns: repeat(4,1fr);
    gap: var(--gap);
    margin-bottom: 18px;
}
.sht-stabs__tab {
    position:relative;
    border:0; padding:0; cursor:pointer; overflow:hidden;
    border-radius:14px;
    box-shadow: 0 6px 18px rgba(0,0,0,.08);
    isolation:isolate;
    width:100%;
}
.sht-stabs__tab .sht-stabs__bg {
    position:absolute; inset:0; background-size:contain; background-position:center;
    transform: scale(1); transition: transform .35s ease;background-repeat: no-repeat;
}
.sht-stabs__tab .sht-stabs__badge {
    position:absolute; left:12px; bottom:12px; display:inline-flex; align-items:center; gap:8px;
    background: var(--badge-bg, #111827); color: var(--badge-color, #fff);
    padding:8px 12px; border-radius:12px; font-weight:600;
}
.sht-stabs__tab.is-active .sht-stabs__bg,
.sht-stabs__tab:hover .sht-stabs__bg { transform: scale(1.05); }
.sht-stabs__tab.is-active { outline:2px solid rgba(0,0,0,.06); }

.sht-stabs__panels { display:block; }
.sht-stabs__panel { display:none; background:#fff; border-radius:16px; box-shadow:0 10px 28px rgba(0,0,0,.06); }
.sht-stabs__panel.is-active { display:block; }

/* Hero */
.sht-hero { display:grid; grid-template-columns: 1fr 520px; align-items:center; gap:24px; }
.sht-hero__left { padding:24px; }
.sht-hero__icon i, .sht-hero__icon svg { font-size:36px; width:36px; height:36px; }
.sht-hero__title { margin:12px 0 4px; font-size:24px; }
.sht-hero__subtitle { color:#6b7280; }

.sht-hero__right { padding:24px; }
.sht-hero__video, .sht-hero__right iframe { width:100%; aspect-ratio: 16/9; border:0; border-radius:12px; overflow:hidden; }

/* Features */
.sht-stabs__features { display:grid; grid-template-columns: repeat(1,1fr); gap:16px; padding:12px 24px 24px; }
.sht-feature { border: 1px solid #eef1f4;
    border-radius: 14px;
    padding: 14px;
    background: #fafbfc;
    display: flex;
    flex-direction: row;
    align-content: center;
    align-items: center;
    gap: 8px;
}
.sht-feature__icon i, .sht-feature__icon svg { width:18px; height:18px; }
.sht-feature__title { font-weight:700; margin:6px 0; }
.sht-feature__desc { color:#6b7280; font-size:13px; }

/* Dual grids */
.sht-grid-one {display:grid; grid-template-columns: 3fr}
.sht-grid-pairs { display:grid; grid-template-columns: 2fr 1fr; gap:24px; padding:0 24px 24px; }
.sht-grid-block { background:#fff; border:1px solid #eef1f4; border-radius:14px; padding:14px; }
.sht-block__title { margin:0 0 10px; font-size:16px; }
.sht-tiles1 { display:grid; grid-template-columns: repeat(5, 1fr); gap:12px; }
.sht-tiles { display:grid; grid-template-columns: repeat(2, 1fr); gap:12px; }
.sht-tile { border-radius:12px; overflow:hidden; background:#f5f6f8; display:flex; flex-direction:column; min-height:110px; }
.sht-tile__img { flex:1; background-size:cover; background-position:center; }
.sht-tile__label { padding:8px 10px; display:flex; flex-direction:column; gap:2px; }
.sht-tiles.scents .sht-tile { min-height:120px; }
.sht-tiles.scents .sht-tile__img { aspect-ratio: 1 / 1; }

@media (max-width: 1024px) {
  .sht-hero { grid-template-columns: 1fr; }
  .sht-stabs__features { grid-template-columns: 1fr; }
  .sht-grid-pairs { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .sht-stabs__strip { grid-template-columns: 1fr 1fr; }
  .sht-stabs__features { grid-template-columns: 1fr; }
  .sht-tiles { grid-template-columns: 1fr 1fr; }
}