/*
Theme Name: SheShe Skin Custom
Template: storefront
Version: 1.5.0
Description: Custom SheShe Skin storefront child theme.
Author: SurgeXI
*/

:root {
  --ssk-lavender: #D097E8;
  --ssk-sage: #ACC983;
  --ssk-turmeric: #FFAE00;
  --ssk-pomegranate: #FC83BC;
  --ssk-cream: #FFF7D1;
  --ssk-ink: #3F3446;
  --ssk-deep: #5C4B66;
  --ssk-soft: #6E6176;
  --ssk-white: #ffffff;
  --ssk-shadow: 0 18px 40px rgba(63, 52, 70, 0.10);
  --ssk-shadow-lg: 0 28px 60px rgba(63, 52, 70, 0.16);
  --ssk-radius: 24px;
}

body {
  background:
    radial-gradient(circle at 0% 0%, rgba(208,151,232,.16), transparent 32%),
    radial-gradient(circle at 100% 0%, rgba(252,131,188,.12), transparent 28%),
    linear-gradient(180deg, #fffdf9 0%, #fff7f4 100%);
  color: var(--ssk-ink);
  font-family: "Avenir Next", "Avenir", "Helvetica Neue", sans-serif;
}

.site-header,
.site-footer,
.site-info {
  background: rgba(255,255,255,0.96);
}

.col-full,
.site-content .col-full,
.storefront-full-width-content .content-area {
  max-width: 1440px !important;
  width: min(1440px, calc(100% - 48px)) !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

.home .entry-title,
.home .page-title,
.home .woocommerce-products-header,
.home .widget-area,
.home aside.widget-area,
.home .content-area .page-header,
.home .content-area .entry-header,
.home .content-area .entry-meta,
.home .content-area .post-edit-link,
.home .content-area .comments-area,
.home .storefront-breadcrumb,
.home .site-main > .type-page > .entry-header,
.page .widget-area,
.page aside.widget-area,
.page .storefront-breadcrumb {
  display: none !important;
}

.home .content-area,
.page .content-area,
.home .site-main,
.page .site-main,
.home .site-content,
.page .site-content {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 auto !important;
}

.site-branding {
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 126px;
  text-align: center;
}

.site-branding::before {
  content: "";
  width: 400px;
  height: 150px;
  display: block;
  background: url("https://shesheskin.com/wp-content/uploads/shesheskin-seed/shesheskin-logo.png") center center/contain no-repeat;
}

.site-title,
.site-description {
  display: none !important;
}

.site-search,
.site-header-cart,
.menu-item-cart,
.menu-item-my-account,
.storefront-primary-navigation .site-header-cart {
  display: none !important;
}

.main-navigation {
  text-align: center !important;
}

.main-navigation ul.menu,
.main-navigation ul.nav-menu {
  display: flex !important;
  justify-content: center !important;
  flex-wrap: wrap;
  gap: .15rem .35rem;
}

.main-navigation ul.menu > li > a,
.main-navigation ul.nav-menu > li > a {
  padding: .6rem .65rem !important;
  font-size: .93rem;
  color: var(--ssk-deep);
  font-weight: 700;
}

.storefront-primary-navigation {
  border-top: 1px solid rgba(92,75,102,.06);
}

.site-footer,
.site-info,
.site-footer .col-full {
  text-align: center !important;
}

button,
input[type="button"],
input[type="reset"],
input[type="submit"],
.button,
.added_to_cart,
.wc-forward {
  background: linear-gradient(135deg, var(--ssk-pomegranate), var(--ssk-lavender));
  border: none;
  color: #fff;
  border-radius: 999px;
  box-shadow: var(--ssk-shadow);
  font-weight: 700;
}

.button.alt {
  background: #fff;
  color: var(--ssk-deep);
  border: 1px solid rgba(92,75,102,.1);
}

.ssk-home,
.ssk-page-shell {
  overflow-x: hidden;
}

.ssk-hero {
  padding: 5.4rem 0 4rem;
}

.ssk-hero--editorial {
  background:
    linear-gradient(135deg, rgba(255,249,247,.92) 0%, rgba(255,247,209,.85) 48%, rgba(249,242,255,.90) 100%),
    url("https://shesheskin.com/wp-content/uploads/shesheskin-seed/homepage_2.jpg") center center / cover no-repeat;
}

.ssk-hero__inner,
.ssk-section,
.ssk-page-wrap {
  max-width: 1360px;
  margin: 0 auto;
  padding-left: 1.5rem;
  padding-right: 1.5rem;
}

.ssk-hero__inner {
  display: grid;
  grid-template-columns: 1.1fr .9fr;
  gap: 2rem;
  align-items: center;
}

.ssk-kicker {
  display: inline-block;
  padding: .5rem .9rem;
  border-radius: 999px;
  background: rgba(255,255,255,.72);
  border: 1px solid rgba(92,75,102,.12);
  color: var(--ssk-deep);
  font-size: .85rem;
  letter-spacing: .03em;
  margin-bottom: 1rem;
}

.ssk-hero h1 {
  font-size: clamp(3rem, 6vw, 5.1rem);
  line-height: 1.02;
  margin: 0 0 1rem;
  color: var(--ssk-deep);
  max-width: 12ch;
}

.ssk-hero p {
  max-width: 58ch;
  font-size: 1.08rem;
  line-height: 1.72;
  color: var(--ssk-soft);
}

.ssk-actions {
  display: flex;
  gap: .9rem;
  flex-wrap: wrap;
  margin-top: 1.3rem;
}

.ssk-hero-card,
.ssk-card,
.ssk-price,
.ssk-scent,
.ssk-trust {
  background: rgba(255,255,255,.92);
  border-radius: var(--ssk-radius);
  box-shadow: var(--ssk-shadow);
  border: 1px solid rgba(92,75,102,.06);
}

.ssk-hero-card,
.ssk-card__body,
.ssk-price,
.ssk-scent,
.ssk-trust {
  padding: 1.25rem 1.3rem 1.4rem;
}

.ssk-hero-price {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .8rem;
  margin-top: 1rem;
}

.ssk-mini-price {
  background: #fff;
  border-radius: 16px;
  padding: .9rem;
  text-align: center;
  border: 1px solid rgba(92,75,102,.08);
}

.ssk-mini-price strong {
  display: block;
  color: var(--ssk-deep);
  font-size: 1.1rem;
}

.ssk-section,
.ssk-page-wrap {
  padding-top: 4.8rem;
  padding-bottom: 4.8rem;
}

.ssk-page-entry img {
  display: block;
  width: min(100%, 760px);
  height: auto;
  max-height: 520px;
  object-fit: cover;
  border-radius: var(--ssk-radius);
  box-shadow: var(--ssk-shadow);
  margin-left: auto;
  margin-right: auto;
}

.ssk-page-wrap {
  text-align: left;
}

.ssk-section--soft {
  background: linear-gradient(180deg, rgba(255,255,255,.35), rgba(255,247,209,.25));
  border-radius: 36px;
}

.ssk-section h2,
.ssk-page-wrap h1,
.ssk-page-wrap h2 {
  color: var(--ssk-deep);
  margin-bottom: .8rem;
}

.ssk-lead {
  max-width: 68ch;
  color: var(--ssk-soft);
  line-height: 1.75;
}

.ssk-collections,
.ssk-price-row,
.ssk-scent-grid {
  display: grid;
  gap: 1.2rem;
  margin-top: 2rem;
}

.ssk-collections {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.ssk-price-row {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.ssk-scent-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.ssk-card__media {
  height: 280px;
  border-radius: var(--ssk-radius) var(--ssk-radius) 0 0;
}

.ssk-placeholder {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  background:
    linear-gradient(135deg, rgba(208,151,232,.22), rgba(255,247,209,.65));
  color: var(--ssk-deep);
  text-align: center;
}

.ssk-placeholder span {
  font-size: 1.3rem;
  font-weight: 700;
}

.ssk-placeholder small {
  margin-top: .35rem;
  color: var(--ssk-soft);
}

.ssk-cta-band {
  display: grid;
  grid-template-columns: 1.2fr .8fr;
  gap: 1.5rem;
  align-items: center;
  background: linear-gradient(135deg, var(--ssk-deep), var(--ssk-lavender));
  color: #fff;
  border-radius: 30px;
  padding: 2rem;
  box-shadow: var(--ssk-shadow-lg);
}

.ssk-cta-band h2,
.ssk-cta-band p {
  color: #fff;
}

@media (max-width: 980px) {
  .site-branding::before {
    width: 220px;
    height: 82px;
  }

  .ssk-hero__inner,
  .ssk-collections,
  .ssk-price-row,
  .ssk-scent-grid,
  .ssk-cta-band,
  .ssk-hero-price {
    grid-template-columns: 1fr;
  }

  .col-full,
  .site-content .col-full,
  .storefront-full-width-content .content-area {
    width: calc(100% - 20px) !important;
  }

  .ssk-page-entry img {
    width: 100%;
    max-height: 360px;
  }
}

/* ============================================================
   BUTTER PAGE — Product Block Layout
   ============================================================ */

.ssk-butter-page {
  overflow-x: hidden;
}

.ssk-butter-header {
  text-align: center;
  padding: 3.5rem 1.5rem 1rem;
  max-width: 720px;
  margin: 0 auto;
}

.ssk-butter-header h1 {
  font-size: clamp(2.2rem, 5vw, 3.4rem);
  color: var(--ssk-deep);
  margin-bottom: .7rem;
}

.ssk-butter-block {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0;
  max-width: 1360px;
  margin: 0 auto 1px;
  background: #fff;
  border-radius: 32px;
  overflow: hidden;
  box-shadow: var(--ssk-shadow);
  margin-bottom: 3rem;
}

.ssk-butter-block--alt {
  direction: rtl;
}

.ssk-butter-block--alt > * {
  direction: ltr;
}

.ssk-butter-block__media {
  position: relative;
  min-height: 520px;
  overflow: hidden;
}

.ssk-butter-block__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform .5s ease;
}

.ssk-butter-block:hover .ssk-butter-block__media img {
  transform: scale(1.03);
}

.ssk-butter-block__content {
  padding: 3rem 3.2rem 3rem 3rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 1.4rem;
}

/* Scent accent tags */
.ssk-scent-tag {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  padding: .38rem .85rem;
  border-radius: 999px;
  font-size: .78rem;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  width: fit-content;
}

.ssk-scent-tag--bare {
  background: rgba(63,52,70,.07);
  color: var(--ssk-deep);
  border: 1px solid rgba(63,52,70,.12);
}

.ssk-scent-tag--calm {
  background: rgba(208,151,232,.15);
  color: #7b3fa0;
  border: 1px solid rgba(208,151,232,.3);
}

.ssk-scent-tag--glow {
  background: rgba(255,174,0,.12);
  color: #9a6800;
  border: 1px solid rgba(255,174,0,.28);
}

.ssk-scent-tag--fresh {
  background: rgba(172,201,131,.18);
  color: #3d6120;
  border: 1px solid rgba(172,201,131,.35);
}

.ssk-butter-block__title {
  font-size: clamp(1.6rem, 2.8vw, 2.2rem);
  color: var(--ssk-deep);
  line-height: 1.2;
  margin: 0;
}

.ssk-butter-block__tagline {
  font-size: 1.02rem;
  color: var(--ssk-soft);
  line-height: 1.7;
  margin: 0;
  max-width: 54ch;
}

/* Why You'll Love It */
.ssk-loves {
  background: linear-gradient(135deg, rgba(255,247,209,.6), rgba(249,242,255,.5));
  border-radius: 16px;
  padding: 1.2rem 1.4rem;
  border: 1px solid rgba(92,75,102,.07);
}

.ssk-loves__title {
  font-size: .78rem;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--ssk-deep);
  margin-bottom: .7rem;
}

.ssk-loves ul {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: .42rem;
}

.ssk-loves ul li {
  font-size: .92rem;
  color: var(--ssk-soft);
  padding-left: 1.4rem;
  position: relative;
  line-height: 1.5;
}

.ssk-loves ul li::before {
  content: "✓";
  position: absolute;
  left: 0;
  color: var(--ssk-pomegranate);
  font-weight: 700;
}

/* Price + CTA */
.ssk-butter-cta {
  display: flex;
  align-items: center;
  gap: 1rem;
  flex-wrap: wrap;
}

.ssk-butter-price {
  font-size: 2rem;
  font-weight: 800;
  color: var(--ssk-deep);
  line-height: 1;
}

.ssk-butter-price small {
  display: block;
  font-size: .72rem;
  font-weight: 600;
  color: var(--ssk-soft);
  letter-spacing: .04em;
  text-transform: uppercase;
  margin-top: .2rem;
}

/* Full detail accordion-style sections below the split */
.ssk-butter-details {
  max-width: 1360px;
  margin: -1.5rem auto 0;
  padding: 0 1.5rem 3rem;
  display: grid;
  grid-template-columns: 1.4fr 1fr 1fr;
  gap: 1.5rem;
  align-items: start;
}

.ssk-butter-detail-block {
  background: rgba(255,255,255,.92);
  border-radius: 20px;
  padding: 1.5rem 1.6rem;
  box-shadow: 0 6px 24px rgba(63,52,70,.06);
  border: 1px solid rgba(92,75,102,.07);
}

.ssk-butter-detail-block h4 {
  font-size: .75rem;
  font-weight: 800;
  letter-spacing: .09em;
  text-transform: uppercase;
  color: var(--ssk-pomegranate);
  margin: 0 0 .75rem;
}

.ssk-butter-detail-block p {
  font-size: .93rem;
  color: var(--ssk-soft);
  line-height: 1.72;
  margin: 0;
}

.ssk-butter-detail-block ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.ssk-butter-detail-block ul li {
  font-size: .93rem;
  color: var(--ssk-soft);
  padding: .3rem 0;
  border-bottom: 1px solid rgba(92,75,102,.06);
  display: flex;
  align-items: center;
  gap: .5rem;
}

.ssk-butter-detail-block ul li:last-child {
  border-bottom: none;
}

.ssk-butter-detail-block ul li::before {
  content: "•";
  color: var(--ssk-lavender);
  font-size: 1.1rem;
  flex-shrink: 0;
}

.ssk-butter-divider {
  max-width: 1360px;
  margin: 0 auto 3rem;
  padding: 0 1.5rem;
  border: none;
  border-top: 1px solid rgba(92,75,102,.07);
}

/* Responsive */
@media (max-width: 900px) {
  .ssk-butter-block {
    grid-template-columns: 1fr;
    direction: ltr;
  }

  .ssk-butter-block__media {
    min-height: 320px;
  }

  .ssk-butter-block__content {
    padding: 2rem 1.5rem;
  }

  .ssk-butter-details {
    grid-template-columns: 1fr;
    padding: 1rem 1rem 2rem;
  }

  .ssk-butter-block--alt > * {
    direction: ltr;
  }
}

/* ============================================================
   CONTACT PAGE
   ============================================================ */

.ssk-contact-wrap {
  max-width: 1200px;
  margin: 0 auto;
  padding: 3.5rem 1.5rem 5rem;
}

.ssk-contact-header {
  text-align: center;
  max-width: 640px;
  margin: 0 auto 3rem;
}

.ssk-contact-header h1 {
  font-size: clamp(2rem, 4vw, 3rem);
  color: var(--ssk-deep);
  margin-bottom: .6rem;
}

.ssk-contact-grid {
  display: grid;
  grid-template-columns: 1.4fr 1fr;
  gap: 2.5rem;
  align-items: start;
}

/* Form */
.ssk-contact-form-col {
  background: #fff;
  border-radius: 24px;
  padding: 2.4rem 2.6rem;
  box-shadow: var(--ssk-shadow);
  border: 1px solid rgba(92,75,102,.06);
}

.ssk-field {
  margin-bottom: 1.3rem;
}

.ssk-field label {
  display: block;
  font-size: .85rem;
  font-weight: 700;
  color: var(--ssk-deep);
  margin-bottom: .4rem;
  letter-spacing: .01em;
}

.ssk-field label span {
  color: var(--ssk-pomegranate);
}

.ssk-optional {
  color: var(--ssk-soft) !important;
  font-weight: 400 !important;
}

.ssk-field input,
.ssk-field select,
.ssk-field textarea {
  width: 100%;
  padding: .75rem 1rem;
  border: 1.5px solid rgba(92,75,102,.14);
  border-radius: 12px;
  font-size: .95rem;
  color: var(--ssk-ink);
  background: #fafafa;
  transition: border-color .2s, box-shadow .2s;
  font-family: inherit;
  box-sizing: border-box;
}

.ssk-field input:focus,
.ssk-field select:focus,
.ssk-field textarea:focus {
  outline: none;
  border-color: var(--ssk-lavender);
  box-shadow: 0 0 0 3px rgba(208,151,232,.18);
  background: #fff;
}

.ssk-field textarea {
  resize: vertical;
  min-height: 150px;
}

.ssk-submit-btn {
  width: 100%;
  padding: .9rem 1.5rem;
  font-size: 1rem;
  margin-top: .5rem;
}

.ssk-form-success {
  background: linear-gradient(135deg, rgba(172,201,131,.15), rgba(208,151,232,.1));
  border-radius: 16px;
  padding: 2rem;
  text-align: center;
  border: 1px solid rgba(172,201,131,.3);
}

.ssk-form-success h3 {
  color: var(--ssk-deep);
  margin-bottom: .5rem;
}

.ssk-form-errors {
  background: rgba(252,131,188,.1);
  border: 1px solid rgba(252,131,188,.3);
  border-radius: 12px;
  padding: 1rem 1.2rem;
  margin-bottom: 1.2rem;
}

.ssk-form-errors p {
  color: #9c1a4a;
  font-size: .9rem;
  margin: .25rem 0;
}

/* Info column */
.ssk-contact-info-col {
  display: flex;
  flex-direction: column;
  gap: 1.2rem;
}

.ssk-contact-info-card {
  background: #fff;
  border-radius: 20px;
  padding: 1.5rem 1.6rem;
  box-shadow: var(--ssk-shadow);
  border: 1px solid rgba(92,75,102,.06);
}

.ssk-contact-info-card--soft {
  background: linear-gradient(135deg, rgba(255,247,209,.5), rgba(249,242,255,.4));
}

.ssk-contact-info-card h3,
.ssk-contact-info-card h4 {
  color: var(--ssk-deep);
  margin-bottom: .8rem;
  font-size: 1rem;
}

.ssk-contact-info-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.ssk-contact-info-list li {
  display: flex;
  flex-direction: column;
  gap: .2rem;
  padding: .65rem 0;
  border-bottom: 1px solid rgba(92,75,102,.06);
  font-size: .93rem;
  color: var(--ssk-soft);
}

.ssk-contact-info-list li:last-child {
  border-bottom: none;
}

.ssk-contact-label {
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .07em;
  text-transform: uppercase;
  color: var(--ssk-pomegranate);
}

.ssk-contact-info-card a {
  color: var(--ssk-deep);
  text-decoration: underline;
  text-underline-offset: 2px;
}

/* Ingredients band on homepage */
.ssk-ingredients-band {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 3rem;
  align-items: center;
}

.ssk-ingredients-img img {
  width: 100%;
  height: 420px;
  object-fit: cover;
  border-radius: var(--ssk-radius);
  box-shadow: var(--ssk-shadow-lg);
}

.ssk-ingredients-copy h2 {
  color: var(--ssk-deep);
  margin: .6rem 0 1rem;
}

.ssk-ingredients-copy p {
  color: var(--ssk-soft);
  line-height: 1.75;
  margin-bottom: 1rem;
}

/* Soap size options */
.ssk-soap-cta {
  flex-direction: column;
  gap: .9rem;
}

.ssk-soap-option {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: .8rem 1rem;
  background: rgba(255,255,255,.85);
  border: 1px solid rgba(92,75,102,.08);
  border-radius: 14px;
}

.ssk-soap-option .ssk-butter-price {
  font-size: 1.4rem;
  min-width: 80px;
}

.ssk-soap-option .button {
  flex: 1;
  text-align: center;
}

@media (max-width: 900px) {
  .ssk-contact-grid,
  .ssk-ingredients-band {
    grid-template-columns: 1fr;
  }

  .ssk-ingredients-img img {
    height: 280px;
  }

  .ssk-contact-form-col {
    padding: 1.5rem 1.2rem;
  }
}

/* ============================================================
   NAVIGATION — HEADER LAYOUT
   ============================================================ */

/* Stack logo above nav, both centered */
.site-header .col-full {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.site-branding {
  width: 100%;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  padding: 1.4rem 0 .5rem;
  min-height: unset !important;
}

.storefront-primary-navigation {
  width: 100%;
  border-top: 1px solid rgba(92,75,102,.08) !important;
  padding: .3rem 0;
}

.storefront-primary-navigation .col-full {
  display: flex;
  justify-content: center;
}

.main-navigation {
  text-align: center !important;
  width: 100%;
}

.main-navigation ul.menu,
.main-navigation ul.nav-menu {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  flex-wrap: wrap;
  gap: 0 .1rem;
  list-style: none;
  margin: 0;
  padding: 0;
}

.main-navigation ul.menu > li > a,
.main-navigation ul.nav-menu > li > a {
  display: inline-flex;
  align-items: center;
  padding: .55rem .75rem !important;
  font-size: .88rem;
  font-weight: 700;
  color: var(--ssk-deep) !important;
  text-decoration: none;
  border-radius: 8px;
  transition: background .18s, color .18s;
  white-space: nowrap;
}

.main-navigation ul.menu > li > a:hover,
.main-navigation ul.nav-menu > li > a:hover {
  background: rgba(208,151,232,.12);
  color: var(--ssk-deep) !important;
}

/* ============================================================
   DROPDOWN — FAQ submenu
   ============================================================ */

.main-navigation li.menu-item-has-children {
  position: relative;
}

/* Arrow indicator */
.main-navigation li.menu-item-has-children > a::after {
  content: " ▾";
  font-size: .7rem;
  opacity: .6;
  margin-left: .2rem;
}

.main-navigation ul.sub-menu {
  position: absolute;
  top: calc(100% + 4px);
  left: 50%;
  transform: translateX(-50%);
  min-width: 160px;
  background: #fff;
  border-radius: 14px;
  box-shadow: 0 12px 36px rgba(63,52,70,.14);
  border: 1px solid rgba(92,75,102,.08);
  padding: .45rem 0;
  list-style: none;
  margin: 0;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity .18s, transform .18s;
  transform: translateX(-50%) translateY(-4px);
  z-index: 9999;
}

.main-navigation li.menu-item-has-children:hover > ul.sub-menu,
.main-navigation li.menu-item-has-children:focus-within > ul.sub-menu {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateX(-50%) translateY(0);
}

.main-navigation ul.sub-menu li a {
  display: block;
  padding: .55rem 1.1rem !important;
  font-size: .87rem;
  font-weight: 600;
  color: var(--ssk-deep) !important;
  text-decoration: none;
  white-space: nowrap;
  transition: background .15s;
}

.main-navigation ul.sub-menu li a:hover {
  background: rgba(208,151,232,.1);
}

/* ============================================================
   CART BUTTON IN NAV
   ============================================================ */

.main-navigation .nav-cart-btn > a {
  background: linear-gradient(135deg, var(--ssk-pomegranate), var(--ssk-lavender)) !important;
  color: #fff !important;
  border-radius: 999px !important;
  padding: .45rem 1rem !important;
  font-weight: 700;
  box-shadow: 0 4px 14px rgba(208,151,232,.28);
  transition: opacity .18s, box-shadow .18s !important;
  margin-left: .35rem;
}

.main-navigation .nav-cart-btn > a:hover {
  opacity: .9;
  background: linear-gradient(135deg, var(--ssk-pomegranate), var(--ssk-lavender)) !important;
  box-shadow: 0 6px 20px rgba(208,151,232,.38);
}

/* ============================================================
   FACEBOOK ICON IN NAV
   ============================================================ */

.main-navigation .nav-facebook > a {
  width: 32px;
  height: 32px;
  padding: 0 !important;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background-color: #1877F2;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='white' d='M24 12.073c0-6.627-5.373-12-12-12s-12 5.373-12 12c0 5.99 4.388 10.954 10.125 11.854v-8.385H7.078v-3.47h3.047V9.43c0-3.007 1.792-4.669 4.533-4.669 1.312 0 2.686.235 2.686.235v2.953H15.83c-1.491 0-1.956.925-1.956 1.874v2.25h3.328l-.532 3.47h-2.796v8.385C19.612 23.027 24 18.062 24 12.073z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 18px;
  color: transparent !important;
  font-size: 0 !important;
  text-decoration: none;
  margin-left: .3rem;
  transition: opacity .18s, transform .18s;
  overflow: hidden;
}

.main-navigation .nav-facebook > a::before {
  display: none !important;
}

.main-navigation .nav-facebook > a:hover {
  opacity: .85;
  transform: scale(1.08);
  background: #1877F2 !important;
}



/* ============================================================
   FOOTER — centered copyright
   ============================================================ */

.site-footer,
.site-info,
.site-footer .col-full,
.site-footer .site-info {
  text-align: center !important;
  justify-content: center;
}

.site-footer .col-full {
  display: flex !important;
  flex-direction: column;
  align-items: center !important;
}

.site-info {
  width: 100%;
  padding: .8rem 1rem;
  font-size: .82rem;
  color: var(--ssk-soft);
}

.site-info a {
  color: var(--ssk-deep);
}

/* ============================================================
   MOBILE NAV
   ============================================================ */

@media (max-width: 767px) {
  .main-navigation .primary-navigation,
  .main-navigation .handheld-navigation,
  .main-navigation div.menu {
    display: none !important;
  }

  #site-navigation.toggled .handheld-navigation,
  #site-navigation.toggled div.menu {
    display: block !important;
  }

  #site-navigation.toggled .handheld-navigation ul.menu,
  #site-navigation.toggled .handheld-navigation ul.nav-menu,
  #site-navigation.toggled div.menu > ul {
    display: flex !important;
    flex-direction: column;
    align-items: center;
    gap: .15rem 0;
    margin: 0;
    padding: .5rem 0 0;
  }

  .main-navigation ul.sub-menu {
    position: static;
    transform: none;
    box-shadow: none;
    border: none;
    background: rgba(208,151,232,.06);
    border-radius: 10px;
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    padding: .3rem 0;
    margin: .2rem 0 .4rem;
  }

  .main-navigation li.menu-item-has-children > a::after {
    display: none;
  }
}

@media (min-width: 768px) {
  .main-navigation div.menu { display: none !important; }
}

/* ── Hero photo (replaces price card) ── */
.ssk-hero-photo {
  flex: 0 0 420px;
  max-width: 420px;
  border-radius: 1.2rem;
  overflow: hidden;
  box-shadow: 0 12px 40px rgba(92,75,102,.18);
}
.ssk-hero-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
@media (max-width: 768px) {
  .ssk-hero-photo { flex: none; max-width: 100%; max-height: 260px; }
}

/* ============================================================
   FAQ PAGE
   ============================================================ */
.ssk-faq-page { max-width: 860px; margin: 0 auto; padding: 0 1.5rem 4rem; }

.ssk-faq-hero {
  text-align: center;
  padding: 4rem 1rem 2.5rem;
}
.ssk-faq-hero h1 { font-size: 2.4rem; margin: .5rem 0 1rem; }
.ssk-faq-hero .ssk-lead { text-align: center; max-width: 640px; margin: 0 auto; }

.ssk-faq-body { padding-top: 1rem; }

.ssk-faq-category { margin-bottom: 3rem; }

.ssk-faq-cat-title {
  font-size: 1.1rem;
  text-transform: uppercase;
  letter-spacing: .1em;
  color: var(--ssk-lavender, #9b6dba);
  border-bottom: 2px solid rgba(155,109,186,.18);
  padding-bottom: .5rem;
  margin-bottom: 1.2rem;
}

.ssk-faq-item {
  border-bottom: 1px solid rgba(92,75,102,.1);
}

.ssk-faq-q {
  width: 100%;
  background: none;
  border: none;
  text-align: left;
  padding: 1.1rem 2.5rem 1.1rem 0;
  font-size: 1.05rem;
  font-weight: 600;
  color: #3a2d45;
  cursor: pointer;
  position: relative;
  line-height: 1.4;
  font-family: inherit;
  transition: color .18s;
}
.ssk-faq-q:hover { color: var(--ssk-lavender, #9b6dba); }

.ssk-faq-arrow {
  position: absolute;
  right: .5rem;
  top: 50%;
  transform: translateY(-50%);
  font-size: 1.2rem;
  transition: transform .25s;
  color: var(--ssk-lavender, #9b6dba);
}
.ssk-faq-q[aria-expanded="true"] .ssk-faq-arrow {
  transform: translateY(-50%) rotate(-180deg);
}

.ssk-faq-a {
  max-height: 0;
  overflow: hidden;
  transition: max-height .35s ease;
}
.ssk-faq-a p, .ssk-faq-a ul {
  margin: 0 0 1rem;
  line-height: 1.75;
  color: #4a3f55;
  font-size: .98rem;
}
.ssk-faq-a ul { padding-left: 1.4rem; }
.ssk-faq-a li { margin-bottom: .4rem; }
.ssk-faq-a p:last-child, .ssk-faq-a ul:last-child { margin-bottom: 1.4rem; }

.ssk-faq-cta {
  text-align: center;
  padding: 3rem 1rem;
  background: linear-gradient(135deg, #fff7f5 0%, #f6f0ff 100%);
  border-radius: 1.2rem;
  margin-top: 2rem;
}
.ssk-faq-cta p { font-size: 1.1rem; margin-bottom: 1.2rem; color: #4a3f55; }
.ssk-faq-cta .button { margin: .3rem .4rem; }

/* ============================================================
   ABOUT US PAGE
   ============================================================ */
.ssk-about-page { max-width: 1100px; margin: 0 auto; padding: 0 1.5rem 4rem; }

.ssk-about-hero {
  text-align: center;
  padding: 4rem 1rem 2.5rem;
}
.ssk-about-hero h1 { font-size: 2.4rem; margin: .5rem 0 1rem; }
.ssk-about-hero .ssk-lead { max-width: 560px; margin: 0 auto; }

/* Story grid */
.ssk-about-story__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 3.5rem;
  align-items: center;
}
.ssk-about-story__img {
  border-radius: 1.2rem;
  overflow: hidden;
  box-shadow: 0 12px 40px rgba(92,75,102,.14);
}
.ssk-about-story__img img {
  width: 100%; height: 100%; object-fit: cover; display: block;
}
.ssk-about-story__copy h2 { margin-top: .6rem; }
.ssk-about-story__copy p {
  line-height: 1.8;
  color: #4a3f55;
  margin-bottom: 1rem;
}
.ssk-about-story__copy em { color: var(--ssk-lavender, #9b6dba); font-style: italic; }

/* Quote band */
.ssk-about-quote {
  background: linear-gradient(135deg, var(--ssk-lavender,#9b6dba), var(--ssk-pomegranate,#c0436a));
  padding: 3rem 2rem;
  text-align: center;
  margin: 0 -1.5rem;
}
.ssk-about-quote blockquote {
  max-width: 740px;
  margin: 0 auto;
  font-size: 1.25rem;
  line-height: 1.7;
  color: #fff;
  font-style: italic;
  border: none;
  padding: 0;
}

/* Values grid */
.ssk-about-values { text-align: center; }
.ssk-about-values .ssk-lead { max-width: 600px; margin: 0 auto; text-align: center; }
.ssk-about-values h2 { margin-bottom: .5rem; }
.ssk-values-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.6rem;
  margin-top: 2rem;
  text-align: left;
}
.ssk-value-card {
  background: #fff;
  border-radius: 1rem;
  padding: 1.6rem;
  box-shadow: 0 4px 18px rgba(92,75,102,.08);
  transition: transform .2s, box-shadow .2s;
}
.ssk-value-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 8px 28px rgba(92,75,102,.14);
}
.ssk-value-icon { font-size: 1.8rem; margin-bottom: .7rem; }
.ssk-value-card h3 { font-size: 1rem; margin: 0 0 .5rem; color: #3a2d45; }
.ssk-value-card p { font-size: .92rem; line-height: 1.7; color: #5a4f65; margin: 0; }

/* Closing grid */
.ssk-about-close__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 3.5rem;
  align-items: center;
}
.ssk-about-close__copy p { line-height: 1.8; color: #4a3f55; margin-bottom: 1rem; }
.ssk-about-close__img {
  border-radius: 1.2rem;
  overflow: hidden;
  box-shadow: 0 12px 40px rgba(92,75,102,.14);
}
.ssk-about-close__img img { width: 100%; display: block; object-fit: cover; }

/* Responsive */
@media (max-width: 768px) {
  .ssk-about-story__grid,
  .ssk-about-close__grid { grid-template-columns: 1fr; }
  .ssk-values-grid { grid-template-columns: 1fr 1fr; }
  .ssk-about-story__img { order: -1; max-height: 280px; }
}
@media (max-width: 480px) {
  .ssk-values-grid { grid-template-columns: 1fr; }
}

/* ============================================================
   CART PAGE
   ============================================================ */
.ssk-cart-page { padding-bottom: 4rem; }

.ssk-cart-wrap {
  max-width: 860px;
  margin: 0 auto;
  padding: 2.5rem 1.5rem 2rem;
}
.ssk-cart-title {
  font-size: 2rem;
  margin-bottom: 1.5rem;
}

/* Keep Shopping section */
.ssk-shop-section { max-width: 1100px; margin: 0 auto; padding: 0 1.5rem; }
.ssk-shop-header { text-align: center; margin-bottom: 2.5rem; }
.ssk-shop-header h2 { margin-bottom: .4rem; }

/* Category labels */
.ssk-shop-category { margin-bottom: 3rem; }
.ssk-shop-cat-label {
  display: flex;
  align-items: baseline;
  gap: .8rem;
  font-size: 1.05rem;
  font-weight: 700;
  color: #3a2d45;
  border-bottom: 2px solid rgba(155,109,186,.2);
  padding-bottom: .5rem;
  margin-bottom: 1.2rem;
}
.ssk-shop-cat-label em {
  font-size: .88rem;
  font-weight: 400;
  font-style: normal;
  color: var(--ssk-lavender, #9b6dba);
}

/* Product row */
.ssk-product-row {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1.2rem;
}

/* Product card */
.ssk-prod-card {
  background: #fff;
  border-radius: 1rem;
  overflow: hidden;
  box-shadow: 0 3px 14px rgba(92,75,102,.09);
  display: flex;
  flex-direction: column;
  transition: transform .2s, box-shadow .2s;
}
.ssk-prod-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 8px 24px rgba(92,75,102,.15);
}
.ssk-prod-img {
  width: 100%;
  aspect-ratio: 1 / 1;
  overflow: hidden;
  background: #f8f5ff;
}
.ssk-prod-img img {
  width: 100%; height: 100%;
  object-fit: cover; display: block;
  transition: transform .3s;
}
.ssk-prod-card:hover .ssk-prod-img img { transform: scale(1.04); }

.ssk-prod-body {
  padding: 1rem;
  display: flex;
  flex-direction: column;
  flex: 1;
}
.ssk-prod-body h4 {
  font-size: .95rem;
  margin: 0 0 .35rem;
  color: #3a2d45;
}
.ssk-prod-desc {
  font-size: .82rem;
  line-height: 1.55;
  color: #6a5f75;
  flex: 1;
  margin: 0 0 .8rem;
}
.ssk-prod-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .5rem;
  flex-wrap: wrap;
}
.ssk-prod-price {
  font-weight: 700;
  font-size: 1rem;
  color: var(--ssk-pomegranate, #c0436a);
}
.ssk-atc {
  font-size: .78rem !important;
  padding: .38rem .75rem !important;
  border-radius: 999px !important;
  white-space: nowrap;
}
.ssk-atc--alt {
  background: var(--ssk-lavender, #9b6dba) !important;
  border-color: var(--ssk-lavender, #9b6dba) !important;
}

/* Bundle two-price footer */
.ssk-prod-footer--two {
  flex-direction: column;
  gap: .4rem;
}
.ssk-prod-footer--two > div {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .5rem;
  width: 100%;
}

/* Responsive */
@media (max-width: 900px) {
  .ssk-product-row { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 480px) {
  .ssk-product-row { grid-template-columns: 1fr; }
}

/* ============================================================
   LEGAL PAGES (Privacy Policy & Terms of Service)
   ============================================================ */
.ssk-legal-page {
  max-width: 780px;
  margin: 3rem auto 5rem;
  padding: 0 1.5rem;
  font-size: .97rem;
  line-height: 1.85;
  color: #4a3f55;
}
.ssk-legal-effective {
  display: inline-block;
  background: rgba(155,109,186,.10);
  border-radius: 999px;
  padding: .3rem 1rem;
  font-size: .82rem;
  color: #7a5c8a;
  margin-bottom: 2rem;
  font-family: sans-serif;
  letter-spacing: .04em;
}
.ssk-legal-page h2 {
  font-size: 1.1rem;
  margin: 2rem 0 .6rem;
  color: #3a2d45;
  border-bottom: 1px solid rgba(155,109,186,.18);
  padding-bottom: .4rem;
}
.ssk-legal-page ul {
  padding-left: 1.4rem;
  margin: .5rem 0 1rem;
}
.ssk-legal-page li { margin-bottom: .35rem; }
.ssk-legal-page a { color: var(--ssk-lavender,#9b6dba); }

/* Footer legal links */
.ssk-footer-legal {
  margin-bottom: .4rem;
}
.ssk-footer-legal a {
  color: inherit;
  text-decoration: none;
  font-size: .85rem;
  opacity: .85;
  transition: opacity .18s;
}
.ssk-footer-legal a:hover { opacity: 1; text-decoration: underline; }
.ssk-footer-sep { margin: 0 .5rem; opacity: .5; }
.ssk-footer-copy { font-size: .82rem; opacity: .75; }
.ssk-footer-copy a { color: inherit; text-decoration: underline; font-weight: 600; }

/* ── Footer visibility fix ── */
.site-info {
  color: #3a2d45 !important;
  padding: 1.2rem 1rem !important;
}
.ssk-footer-legal a {
  color: #3a2d45 !important;
  font-size: .85rem !important;
  text-decoration: none !important;
  opacity: 1 !important;
}
.ssk-footer-legal a:hover {
  color: var(--ssk-lavender, #9b6dba) !important;
  text-decoration: underline !important;
}
.ssk-footer-sep {
  color: #9b6dba !important;
  margin: 0 .5rem !important;
}
.ssk-footer-copy {
  color: #5a4f65 !important;
  font-size: .82rem !important;
  margin-top: .3rem !important;
}
.ssk-footer-copy a {
  color: #9b6dba !important;
  font-weight: 600 !important;
  text-decoration: underline !important;
}