/*
============================================================
Stitch Witch – Base Design Layer
Zusätzliche Grunddesign-CSS für das Kadence Child Theme.
Diese Datei legt das visuelle Grundgefühl global über die
Website und den WooCommerce-Shop.
============================================================
*/

:root{
  --sw-site-max: 1320px;
  --sw-content-max: 760px;
  --sw-radius-xl: 36px;
  --sw-radius-lg: 28px;
  --sw-radius-md: 20px;
  --sw-radius-sm: 14px;
  --sw-space-section: clamp(4rem, 7vw, 7rem);
  --sw-space-section-sm: clamp(2rem, 5vw, 4rem);
  --sw-blur: 16px;
  --sw-line-soft: 1px solid rgba(26,26,26,.08);
  --sw-line-strong: 1px solid rgba(26,26,26,.14);
  --sw-glow-violet: 0 0 0 1px rgba(196,167,231,.16), 0 18px 55px rgba(196,167,231,.18);
  --sw-glow-pink: 0 0 0 1px rgba(247,198,206,.18), 0 18px 55px rgba(247,198,206,.18);
  --sw-grid-gap: clamp(1rem, 2vw, 1.8rem);
}

html{
  background: var(--sw-offwhite);
}

body{
  position: relative;
  min-height: 100vh;
  background:
    radial-gradient(circle at 8% 14%, rgba(247,198,206,.22) 0%, rgba(247,198,206,0) 22%),
    radial-gradient(circle at 88% 18%, rgba(252,217,139,.18) 0%, rgba(252,217,139,0) 18%),
    radial-gradient(circle at 82% 72%, rgba(196,167,231,.18) 0%, rgba(196,167,231,0) 20%),
    linear-gradient(180deg, #fbf8fa 0%, #f0f0f0 100%);
}

body::before{
  content:"";
  position: fixed;
  inset: 0;
  pointer-events: none;
  background-image:
    linear-gradient(rgba(255,255,255,.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.04) 1px, transparent 1px);
  background-size: 32px 32px;
  mix-blend-mode: soft-light;
  opacity: .25;
  z-index: 0;
}

#page,
.site,
.site-content,
.content-area,
.site-main,
.entry-content{
  position: relative;
  z-index: 1;
}

/* ------------------------------------------------------------
   LAYOUT / CONTAINERS
------------------------------------------------------------ */
.site-container,
.site-main-header-inner-wrap,
.site-footer-row-container-inner,
.content-container,
.alignwide,
.kt-row-layout-inner,
.wp-site-blocks > .alignwide,
.wp-site-blocks > .wp-block-group.alignwide{
  max-width: var(--sw-site-max);
}

.entry-content > .alignwide,
.entry-content > .wp-block-group.alignwide,
.entry-content > .kt-row-layout-wrap.alignwide{
  margin-top: 0;
  margin-bottom: 0;
}

.entry-content > .wp-block-group,
.entry-content > .wp-block-cover,
.entry-content > .kt-row-layout-wrap,
.entry-content > .kt-row-column-wrap{
  position: relative;
}

.sw-site-section,
.entry-content > .wp-block-group,
.entry-content > .kt-row-layout-wrap{
  padding-block: var(--sw-space-section-sm);
}

.sw-container-narrow{
  max-width: var(--sw-content-max);
  margin-inline: auto;
}

.sw-grid-2,
.sw-grid-3,
.sw-grid-4{
  display: grid;
  gap: var(--sw-grid-gap);
}

.sw-grid-2{
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

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

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

/* ------------------------------------------------------------
   TYPO / LINKS
------------------------------------------------------------ */
h1{
  font-size: clamp(2.7rem, 5.4vw, 5.5rem);
  line-height: .94;
}

h2{
  font-size: clamp(2rem, 4vw, 3.6rem);
  line-height: .98;
}

h3{
  font-size: clamp(1.4rem, 2.4vw, 2rem);
  line-height: 1.05;
}

p.lead,
.sw-lead,
.is-style-lead{
  font-size: clamp(1.1rem, 1.9vw, 1.34rem);
  line-height: 1.65;
  max-width: 48rem;
}

strong{
  font-weight: 700;
}

a{
  text-underline-offset: .14em;
}

.entry-content a:not(.wp-block-button__link):not(.button):not(.added_to_cart){
  text-decoration: underline;
  text-decoration-color: rgba(74,78,105,.25);
}

.entry-content a:not(.wp-block-button__link):not(.button):not(.added_to_cart):hover{
  text-decoration-color: rgba(74,78,105,.7);
}

/* ------------------------------------------------------------
   HEADER / NAV
------------------------------------------------------------ */
#main-header,
.site-main-header-wrap,
.site-top-header-wrap,
.site-bottom-header-wrap{
  background: rgba(240,240,240,.68);
}

.site-main-header-wrap{
  border-bottom: 1px solid rgba(26,26,26,.06);
  box-shadow: 0 8px 30px rgba(26,26,26,.04);
}

.site-header-row-container-inner{
  min-height: 86px;
}

.site-branding{
  gap: .7rem;
}

.site-title,
.site-branding .site-title a{
  font-weight: 800;
  letter-spacing: -.03em;
}

.header-navigation .header-menu-container > ul > li > a{
  position: relative;
  font-size: .98rem;
  font-weight: 700;
  padding-block: .9rem;
}

.header-navigation .header-menu-container > ul > li > a::after{
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: .55rem;
  height: 2px;
  border-radius: 999px;
  transform: scaleX(0);
  transform-origin: center;
  transition: transform .22s ease;
  background: var(--sw-gradient-brand);
}

.header-navigation .header-menu-container > ul > li:hover > a::after,
.header-navigation .header-menu-container > ul > li.current-menu-item > a::after,
.header-navigation .header-menu-container > ul > li.current_page_item > a::after{
  transform: scaleX(1);
}

.header-navigation .sub-menu{
  border: var(--sw-line-soft);
  border-radius: 18px;
  overflow: hidden;
  box-shadow: 0 25px 60px rgba(26,26,26,.12);
  background: rgba(255,255,255,.94);
}

/* ------------------------------------------------------------
   SECTION SURFACES
------------------------------------------------------------ */
.sw-section-light{
  background: transparent;
}

.sw-section-white{
  background: rgba(255,255,255,.72);
  backdrop-filter: blur(var(--sw-blur));
  -webkit-backdrop-filter: blur(var(--sw-blur));
  border: var(--sw-line-soft);
  border-radius: var(--sw-radius-xl);
  box-shadow: var(--sw-shadow-soft);
}

.sw-section-dark{
  position: relative;
  overflow: hidden;
  background: var(--sw-gradient-night);
  color: var(--sw-offwhite);
  border-radius: var(--sw-radius-xl);
  box-shadow: 0 30px 70px rgba(26,26,26,.24);
}

.sw-section-dark::before{
  content: "";
  position: absolute;
  inset: -10% auto auto -10%;
  width: 260px;
  height: 260px;
  background: radial-gradient(circle, rgba(247,198,206,.18) 0%, rgba(247,198,206,0) 70%);
  pointer-events: none;
}

.sw-section-dark::after{
  content: "";
  position: absolute;
  inset: auto -8% -12% auto;
  width: 320px;
  height: 320px;
  background: radial-gradient(circle, rgba(196,167,231,.24) 0%, rgba(196,167,231,0) 70%);
  pointer-events: none;
}

.sw-section-dark :where(h1,h2,h3,h4,h5,h6,p,li,strong,a,span){
  color: var(--sw-offwhite);
}

.sw-section-brand{
  position: relative;
  overflow: hidden;
  background: var(--sw-gradient-mist);
  border-radius: var(--sw-radius-xl);
  border: 1px solid rgba(255,255,255,.45);
  box-shadow: var(--sw-shadow-soft);
}

/* ------------------------------------------------------------
   CARDS / BLOCKS
------------------------------------------------------------ */
.sw-card,
.sw-tile,
.sw-panel,
.sw-product-teaser{
  position: relative;
  overflow: hidden;
}

.sw-card::before,
.sw-tile::before,
.sw-panel::before{
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(255,255,255,.26), rgba(255,255,255,0));
  pointer-events: none;
}

.sw-card-alt{
  background: linear-gradient(180deg, rgba(255,255,255,.82), rgba(255,255,255,.66));
  border: var(--sw-line-soft);
  border-radius: var(--sw-radius-lg);
  box-shadow: var(--sw-glow-violet);
  padding: clamp(1.25rem, 2vw, 1.75rem);
}

.sw-card-outline{
  background: transparent;
  border: var(--sw-line-strong);
  border-radius: var(--sw-radius-lg);
  padding: clamp(1.25rem, 2vw, 1.75rem);
}

.sw-list-clean,
.sw-list-check,
.sw-list-dash{
  margin: 0;
  padding: 0;
  list-style: none;
}

.sw-list-clean > li,
.sw-list-check > li,
.sw-list-dash > li{
  position: relative;
  padding-left: 1.4rem;
  margin-bottom: .55rem;
}

.sw-list-check > li::before{
  content: "✦";
  position: absolute;
  left: 0;
  top: .02rem;
  color: var(--sw-midnight);
  font-weight: 700;
}

.sw-list-dash > li::before{
  content: "–";
  position: absolute;
  left: 0;
  top: 0;
  color: var(--sw-midnight);
  font-weight: 700;
}

/* ------------------------------------------------------------
   BUTTONS / CTA
------------------------------------------------------------ */
.wp-block-button__link,
.button,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.added_to_cart{
  position: relative;
  overflow: hidden;
}

.wp-block-button__link::before,
.button::before,
.woocommerce a.button::before,
.woocommerce button.button::before,
.woocommerce input.button::before{
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(255,255,255,.24), rgba(255,255,255,0));
  opacity: .8;
  pointer-events: none;
}

.sw-btn-primary,
.is-style-stitchwitch-primary .wp-block-button__link{
  box-shadow: 0 16px 40px rgba(26,26,26,.12);
}

.sw-btn-dark,
.is-style-stitchwitch-dark .wp-block-button__link{
  box-shadow: 0 16px 38px rgba(26,26,26,.18);
}

.sw-btn-ghost .wp-block-button__link,
.sw-btn-ghost{
  background: rgba(255,255,255,.42);
  color: var(--sw-charcoal);
  border: 1px solid rgba(26,26,26,.12);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

.sw-btn-ghost:hover .wp-block-button__link,
.sw-btn-ghost:hover{
  background: rgba(255,255,255,.7);
}

/* ------------------------------------------------------------
   FORMS / INPUTS
------------------------------------------------------------ */
input[type="text"],
input[type="email"],
input[type="tel"],
input[type="url"],
input[type="password"],
input[type="search"],
input[type="number"],
textarea,
select,
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce .select2-container .select2-selection--single{
  min-height: 52px;
}

textarea,
.woocommerce form .form-row textarea{
  min-height: 160px;
}

::placeholder{
  color: rgba(26,26,26,.52);
}

fieldset{
  border: var(--sw-line-soft);
  border-radius: var(--sw-radius-lg);
  padding: 1.2rem;
}

/* ------------------------------------------------------------
   SHOP / WOO
------------------------------------------------------------ */
.woocommerce-breadcrumb,
.woocommerce-result-count,
.woocommerce-ordering,
.woocommerce-products-header{
  margin-bottom: 1rem;
}

.woocommerce ul.products li.product .button,
.woocommerce ul.products li.product .added_to_cart{
  width: 100%;
  justify-content: center;
  text-align: center;
}

.woocommerce ul.products li.product .star-rating{
  color: var(--sw-midnight);
}

.woocommerce ul.products li.product .price del{
  opacity: .55;
}

.woocommerce div.product form.cart{
  display: flex;
  flex-wrap: wrap;
  gap: .8rem;
  align-items: center;
}

.woocommerce div.product form.cart .single_add_to_cart_button{
  flex: 1 1 auto;
}

.woocommerce .related.products,
.woocommerce .up-sells,
.woocommerce .cross-sells,
.woocommerce .cart_totals{
  margin-top: 2rem;
}

.woocommerce #reviews #comments ol.commentlist li .comment-text,
.woocommerce div.product .woocommerce-tabs .panel,
.woocommerce .shop_table_responsive tr,
.woocommerce .cart_totals{
  background: rgba(255,255,255,.72);
  border: var(--sw-line-soft);
  border-radius: var(--sw-radius-lg);
  box-shadow: var(--sw-shadow-card);
}

.woocommerce .blockUI.blockOverlay,
.woocommerce .loader{
  border-radius: var(--sw-radius-lg);
}

.woocommerce-account .woocommerce-MyAccount-navigation ul{
  margin: 0;
  padding: 0;
  list-style: none;
}

.woocommerce-account .woocommerce-MyAccount-navigation ul li a{
  display: block;
  padding: .8rem 1rem;
  margin-bottom: .5rem;
  border-radius: 16px;
  background: rgba(255,255,255,.72);
  border: var(--sw-line-soft);
}

.woocommerce-account .woocommerce-MyAccount-navigation ul li.is-active a,
.woocommerce-account .woocommerce-MyAccount-navigation ul li a:hover{
  background: linear-gradient(135deg, rgba(196,167,231,.25), rgba(247,198,206,.25));
}

/* ------------------------------------------------------------
   BLOG / CONTENT
------------------------------------------------------------ */
article.post,
article.page .entry,
.single .content-area article,
.archive .content-area article.loop-entry{
  border-radius: var(--sw-radius-xl);
}

.entry-hero,
.entry-header,
.hero-section{
  position: relative;
}

blockquote{
  margin: 1.5rem 0;
  padding: 1.25rem 1.4rem;
  border-left: 4px solid var(--sw-violet);
  border-radius: 0 var(--sw-radius-md) var(--sw-radius-md) 0;
  background: rgba(255,255,255,.72);
  box-shadow: var(--sw-shadow-card);
}

table:not(.shop_table):not(.variations){
  width: 100%;
  border-collapse: collapse;
  overflow: hidden;
  border-radius: var(--sw-radius-lg);
  background: rgba(255,255,255,.72);
  box-shadow: var(--sw-shadow-card);
}

table:not(.shop_table):not(.variations) th,
table:not(.shop_table):not(.variations) td{
  padding: .95rem 1rem;
  border-bottom: 1px solid rgba(26,26,26,.08);
}

table:not(.shop_table):not(.variations) th{
  background: rgba(196,167,231,.18);
  text-align: left;
}

/* ------------------------------------------------------------
   FOOTER
------------------------------------------------------------ */
.site-footer-wrap{
  position: relative;
  overflow: hidden;
}

.site-footer-wrap::before{
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 15% 25%, rgba(247,198,206,.12), transparent 24%),
    radial-gradient(circle at 80% 72%, rgba(196,167,231,.16), transparent 25%);
  pointer-events: none;
}

.site-footer-row-container-inner{
  position: relative;
  z-index: 1;
}

.site-footer-wrap .footer-widget-area,
.site-footer-wrap .widget{
  position: relative;
}

.site-footer-wrap .widget-title,
.site-footer-wrap h2,
.site-footer-wrap h3{
  margin-bottom: .9rem;
}

/* ------------------------------------------------------------
   UTILITIES
------------------------------------------------------------ */
.sw-hide-desktop{
  display: none !important;
}

.sw-text-center{
  text-align: center;
}

.sw-text-light,
.sw-text-light :where(h1,h2,h3,h4,h5,h6,p,span,strong,li,a){
  color: var(--sw-offwhite);
}

.sw-no-margin,
.sw-no-margin > *:last-child{
  margin-bottom: 0 !important;
}

.sw-stack > * + *{
  margin-top: .9rem;
}

/* ------------------------------------------------------------
   RESPONSIVE
------------------------------------------------------------ */
@media (max-width: 1200px){
  .sw-grid-4{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 1024px){
  .site-header-row-container-inner{
    min-height: 76px;
  }

  .sw-grid-3,
  .sw-grid-4{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 767px){
  body::before{
    background-size: 24px 24px;
  }

  .sw-grid-2,
  .sw-grid-3,
  .sw-grid-4{
    grid-template-columns: 1fr;
  }

  .sw-section-white,
  .sw-section-brand,
  .sw-section-dark,
  .sw-hero,
  .sw-card,
  .sw-card-alt,
  .sw-card-outline,
  .woocommerce ul.products li.product,
  .woocommerce-page ul.products li.product{
    border-radius: 22px;
  }

  .sw-hide-desktop{
    display: block !important;
  }

  .sw-hide-mobile{
    display: none !important;
  }

  .site-header-row-container-inner{
    min-height: 70px;
  }
}