:root{
  --bg:#fbfaf7;
  --surface:#ffffff;
  --text:#1f2328;
  --muted:#5a646f;
  --border:rgba(31,35,40,.12);
  --accent:#1f4f3a;
  --accent-2:#2e6b52;
  --radius:18px;
  --shadow:0 10px 30px rgba(0,0,0,.08);
  /* Layout widths
     - --container: overall page width (full-width site)
     - --content: readable inner width for long text / hero inner content
  */
  --container:100%;
  /* Readable content width for long text / inner containers.
     min(90vw, 1400px) gives ~5% gutters on large screens.
  */
  --content:min(1400px, 90vw);
}

/* =========================
   SWT Measure – layout/grid fixes + lighter sizing (v1.4.86)
   Ensures the card aligns flush with summary text and reduces visual weight.
   ========================= */

body.single-product .woocommerce div.product form.cart .swt-measure{
  width: 100% !important;
  max-width: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  align-self: stretch;
}

body.single-product .woocommerce div.product form.cart .swt-measure__title{
  font-size: 14px;
}

body.single-product .woocommerce div.product form.cart .swt-measure__hint{
  font-size: 12px;
}

body.single-product .woocommerce div.product form.cart :where(.swt-block--measure, [data-swt-block="measure"], .swt-measure) .swt-measure__chip{
  padding: 6px 10px;
  font-size: 12.5px;
  font-weight: 800;
}

body.single-product .woocommerce div.product form.cart .swt-measure__label{
  font-size: 13px;
}

body.single-product .woocommerce div.product form.cart .swt-measure__control{
  border-radius: 16px;
  min-height: 52px !important;
  padding: 9px 11px !important;
}

body.single-product .woocommerce div.product form.cart .swt-measure__input{
  font-size: 16px;
  line-height: 1.1;
}

body.single-product .woocommerce div.product form.cart .swt-measure__stepper-btn{
  height: 30px !important;
  min-width: 30px !important;
  border-radius: 11px !important;
}

body.single-product .woocommerce div.product form.cart .swt-measure__suffix{
  font-size: 13px;
}

/* Result row: keep compact and prevent unwanted line breaks */
body.single-product .woocommerce div.product form.cart .swt-measure__result{
  padding: 12px 0 0 0;
}
body.single-product .woocommerce div.product form.cart .swt-measure__result-item{
  font-size: 13px;
}
body.single-product .woocommerce div.product form.cart .swt-measure__result-item strong{
  font-size: 16px;
  font-weight: 900;
  white-space: nowrap;
}

/* Addons details: match the card styling for selects as well */
body.single-product .woocommerce div.product form.cart .swt-measure__addons-row--details{
  margin-top: 10px;
  padding: 12px 12px;
  border-radius: 16px;
  border: 1px solid rgba(0,0,0,.10);
  background: rgba(255,255,255,.8);
}
body.single-product .woocommerce div.product form.cart .swt-measure__addons-row--details select{
  width: 100%;
  height: 48px;
  border-radius: 14px;
  border: 1px solid rgba(0,0,0,.16);
  background: #fff;
  font-weight: 700;
}
body.single-product .woocommerce div.product form.cart .swt-measure__addons-row--details select:focus{
  outline: none;
  border-color: rgba(31,79,58,1);
  box-shadow: 0 0 0 4px rgba(31,79,58,.12);
}

body.single-product .woocommerce div.product form.cart .swt-measure__suffix{
  font-size: 13px;
}

body.single-product .woocommerce div.product form.cart .swt-measure__stepper-btn{
  width: 30px;
  height: 30px;
  border-radius: 11px;
}

body.single-product .woocommerce div.product form.cart .swt-measure__result-item strong{
  font-size: 16px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  color:var(--text);
  background:var(--bg);
  line-height:1.5;

  overflow-x:hidden;}

/* Typography consistency: ensure controls + Woo UI inherit theme fonts */
button,
input,
select,
textarea,
.woocommerce button,
.woocommerce input,
.woocommerce select,
.woocommerce textarea,
.woocommerce .button,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.wp-block-button__link{
  font-family: inherit;
}
img{max-width:100%;height:auto}
a{color:inherit}

/* --------------------------------------------------------------------------
   Layout utilities (v1.4.70)
   Purpose: predictable, fast responsive development.

   - .s-container: standard site gutters (desktop + tablet)
   - .s-container--content: readable content width
   - .s-container--narrow: long-form text width
   - .s-container--full: true viewport bleed (100vw)

   Backwards compatibility: legacy .container / .container--content are aliases.
--------------------------------------------------------------------------- */
.s-container,
.container{max-width:var(--container);margin:0 auto;padding:0 clamp(16px,5vw,64px)}

.s-container--content,
.container--content{max-width:var(--content);}

.s-container--narrow{max-width:78ch;}

.s-container--full{
  width:100vw;
  max-width:100vw;
  margin-left:calc(50% - 50vw);
  margin-right:calc(50% - 50vw);
  padding-left:0;
  padding-right:0;
}
.site-content{min-height:60vh}

.skip-link{
  position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden;
}
.skip-link:focus{left:16px;top:16px;width:auto;height:auto;background:var(--surface);padding:10px 12px;border-radius:10px;box-shadow:var(--shadow);z-index:99999}

.h1{font-size:clamp(28px,3vw,44px);line-height:1.15;margin:0 0 10px}
.h2{font-size:clamp(20px,2.1vw,30px);line-height:1.2;margin:0}
.h3{font-size:18px;margin:0 0 6px}
.lead{font-size:18px;color:rgba(255,255,255,.92);margin:0 0 18px;max-width:52ch}
.muted{color:var(--muted)}
.prose{max-width:78ch}
.prose p{margin:0 0 14px}

/* ------------------------------------------------------------
   Gutenberg-driven front page (v1.2+)
   Keep it clean, airy and sales-focused.
------------------------------------------------------------- */
.site-main--front{padding:0 0 56px}

/* Front page: widen normal blocks while keeping alignfull bleeding */
.site-main--front > *{
  max-width:var(--content);
  margin-left:auto;
  margin-right:auto;
  padding-left:clamp(16px,5vw,64px);
  padding-right:clamp(16px,5vw,64px);
}
.site-main--front > .alignfull,
.site-main--front > .alignwide{
  max-width:none;
  padding-left:0;
  padding-right:0;
}

/* Front page wide/full blocks
   We intentionally avoid the classic `100vw` + negative margin full-bleed trick,
   because it often introduces a 1–20px horizontal overflow on systems where the
   scrollbar takes layout space.

   Instead, we keep full-width sections inside the viewport and rely on inner
   containers for “edge-to-edge background + inset content” patterns.
*/
.site-main--front .alignfull{margin-left:auto;margin-right:auto}
.site-main--front .alignwide{max-width:var(--content);margin-left:auto;margin-right:auto;padding-left:clamp(16px,5vw,64px);padding-right:clamp(16px,5vw,64px)}

/* Hero (Cover block)
   Desired behaviour for Säkkinen:
   - Hero looks “premium” and not glued to the browser edges
   - Even if Gutenberg block is set to “full width”, we keep small gutters
     (Netrauta-style: full-width header background, but page content breathes)
*/
.site-main--front .wp-block-cover,
.site-main--front .wp-block-cover.alignfull{
  width:100%;
  max-width:100%;
  margin-left:0;
  margin-right:0;
  margin-top:0;
  margin-bottom:40px;
  /* Hero is requested to be fully edge-to-edge */
  border-radius:0;
  overflow:hidden;
}
.site-main--front .wp-block-cover__inner-container{
  max-width:var(--content);
  margin:0 auto;
  padding:34px clamp(16px,5vw,64px);
}
.site-main--front .wp-block-cover__inner-container > .wp-block-group{
  /* Translucent "glass" card: lighter + smaller */
  /* Slight translucency (subtle, readable) */
  background:rgba(255,255,255,.86);
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  border:1px solid var(--border);
  border-radius:18px;
  box-shadow:var(--shadow);
  padding:16px 16px;
  max-width:520px;
  /* Lower the card a bit inside the hero */
  margin-top:68px;
}
.site-main--front .wp-block-cover__inner-container h1{margin:0 0 10px;line-height:1.12;font-size:clamp(26px,2.6vw,38px);letter-spacing:-0.02em}
.site-main--front .wp-block-cover__inner-container p{margin:0 0 12px;color:rgba(31,35,40,.84);font-size:clamp(15px,1.2vw,18px);line-height:1.4}
.site-main--front .wp-block-buttons{gap:10px;margin-top:8px}
.site-main--front .wp-block-button__link{
  padding:9px 14px;
  font-size:14px;
  border-radius:999px;
}

/* Section rhythm */
.site-main--front .wp-block-group{margin-top:0}
.site-main--front .wp-block-heading{margin:0 0 12px}
.site-main--front .wp-block-group > .wp-block-heading + p{margin-top:0}

/* Shortcode sections should align with Gutenberg content */
.site-main--front .section{padding:0}
.site-main--front .section .container{padding-left:16px;padding-right:16px}

/* Mobile full-width: use the entire viewport width (no unnecessary side gutters)
   - Hero image edge-to-edge
   - Content sections can still keep readable inset where needed via inner blocks
*/
@media (max-width: 700px){
  /* Prevent the classic full-bleed (100vw) technique from creating horizontal scroll */
  html, body{overflow-x:hidden;}

  .container{padding-left:0 !important; padding-right:0 !important;}
  .site-header .container{padding-left:0 !important; padding-right:0 !important;}

  .site-main--front .alignwide{
    max-width:100% !important;
    padding-left:0 !important;
    padding-right:0 !important;
  }

  .site-main--front .wp-block-cover__inner-container{
    max-width:100% !important;
    padding-left:0 !important;
    padding-right:0 !important;
    padding-top:22px;
    padding-bottom:22px;
  }

  /* True edge-to-edge sections on mobile (hero + any alignfull blocks)
     Use viewport width and center via negative margins.
     This overrides the earlier “premium gutters” philosophy for mobile.
  */
  .site-main--front .alignfull,
  .site-main--front .wp-block-cover,
  .site-main--front .wp-block-cover.alignfull{
    width:100vw !important;
    max-width:100vw !important;
    margin-left:calc(50% - 50vw) !important;
    margin-right:calc(50% - 50vw) !important;
  }

  /* Keep the hero text card readable with small insets, while background stays full width */
  .site-main--front .wp-block-cover__inner-container > .wp-block-group{
    margin-left:16px;
    margin-right:16px;
  }

  .site-main--front .section .container{padding-left:0 !important; padding-right:0 !important;}
}


.btn{
  display:inline-flex;align-items:center;justify-content:center;
  gap:8px;
  border:1px solid transparent;
  padding:12px 14px;
  border-radius:14px;
  text-decoration:none;
  cursor:pointer;
  font-weight:650;
}
.btn-lg{padding:14px 18px;border-radius:16px}
.btn-primary{background:var(--accent);color:white}
.btn-primary:hover{background:var(--accent-2)}
.btn-secondary{background:var(--surface);border-color:var(--border);color:var(--text)}
.btn-secondary:hover{border-color:rgba(31,35,40,.24)}
.btn-ghost{background:transparent;border-color:var(--border)}
.btn-ghost:hover{background:rgba(255,255,255,.5)}

.icon-btn{
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:14px;
  width:44px;height:44px;
  display:inline-flex;align-items:center;justify-content:center;
  cursor:pointer;
}
.icon-btn:hover{border-color:rgba(31,35,40,.24)}
.icon{font-size:18px;line-height:1}

/* Mobile bottom cart bar exists in markup for all viewports, but must only be
   visible on mobile. Without this, it can appear in the desktop header flow
   and its badge may position relative to the viewport. */
.mobile-cart-fab{display:none;}

/* Ensure burger SVG uses the same visual style as other icons */
.burger-icon rect{fill:currentColor}

/* ------------------------------
   Mobile header + bottom cart
--------------------------------*/
@media (max-width: 1100px) {
  /* Mobile header must stay one-row and have room for search */
  .site-header .container.container--content{padding-left:12px;padding-right:12px;}

  /* Remove header tools (account/cart) from the top row */
  .header-tool--account,
  .header-tool--cart{display:none !important;}

  /* Mobile cart: icon-only floating button (opens cart drawer, no page reload) */
  .mobile-cart-fab{
    position:fixed;
    right:12px;
    bottom:12px;
    z-index:9999;
    width:56px;
    height:56px;
    border-radius:999px;
    background:var(--surface);
    border:1px solid var(--border);
    box-shadow:0 12px 30px rgba(0,0,0,.18);
    display:flex;
    align-items:center;
    justify-content:center;
    padding:0;
    -webkit-tap-highlight-color: transparent;
  }
  .mobile-cart-fab .icon{font-size:22px;line-height:1;}
  .mobile-cart-fab .cart-badge{
    position:absolute;
    top:-6px;
    right:-6px;
    background:var(--accent);
    color:#fff;
    min-width:22px;
    height:22px;
    padding:0 6px;
    border-radius:999px;
    font-size:12px;
    display:flex;
    align-items:center;
    justify-content:center;
    font-weight:800;
    box-shadow:0 6px 14px rgba(0,0,0,.18);
  }

  /* Keep content above the floating cart button (light padding only) */
  body{padding-bottom:18px;}

  /* Drawer menu should slide from left and not fill the screen */
  .drawer[data-drawer="menu"] .drawer__panel{
    width:min(86vw,360px);
    left:0;
    right:auto;
    border-radius:0 18px 18px 0;
  }
}

/* Extra-tight mobile header (phones)
   - smaller icon buttons
   - tighter vertical rhythm
   - preserves 16px search font-size for iOS (no zoom)
*/
@media (max-width: 700px){
  .site-header .container.container--content{padding-left:10px;padding-right:10px;}
  .site-header .header-layout{gap:8px;padding:8px 0 10px;}
  .site-header .header-row--top{gap:8px;}
  .site-header .site-logo img{max-height:34px;}

  .icon-btn{width:40px;height:40px;border-radius:12px;}
  .header-burger{width:40px;}
  .icon{font-size:17px;}

  .site-header .header-searchbar .searchform__input{padding:10px 12px;}
  .site-header .header-searchbar .searchform__btn{padding:10px 12px;}
}

/* Drawer slide animations */
.drawer__panel{
  transform:translateX(100%);
  transition:transform .25s ease;
}
.drawer.is-open .drawer__panel{transform:translateX(0)}
.drawer[data-drawer="menu"] .drawer__panel{transform:translateX(-110%)}
.drawer[data-drawer="menu"].is-open .drawer__panel{transform:translateX(0)}

/* ------------------------------------------------------------------
   Global CTA color: force all buttons/CTAs to the green theme accent
   (WooCommerce sometimes injects block/button colors per-template).
------------------------------------------------------------------- */
.button,
.wp-block-button__link,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt,
.woocommerce div.product form.cart .single_add_to_cart_button,
.woocommerce ul.products li.product .button,
.woocommerce ul.products li.product .add_to_cart_button{
  background: var(--accent) !important;
  border-color: var(--accent) !important;
  color: #fff !important;
}

.button:hover,
.wp-block-button__link:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce #respond input#submit:hover,
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
.woocommerce input.button.alt:hover,
.woocommerce div.product form.cart .single_add_to_cart_button:hover,
.woocommerce ul.products li.product .button:hover,
.woocommerce ul.products li.product .add_to_cart_button:hover{
  background: var(--accent-2) !important;
  border-color: var(--accent-2) !important;
  color: #fff !important;
}

.button:focus,
.wp-block-button__link:focus,
.woocommerce a.button:focus,
.woocommerce button.button:focus,
.woocommerce input.button:focus,
.woocommerce #respond input#submit:focus,
.woocommerce a.button.alt:focus,
.woocommerce button.button.alt:focus,
.woocommerce input.button.alt:focus,
.woocommerce div.product form.cart .single_add_to_cart_button:focus,
.woocommerce ul.products li.product .button:focus,
.woocommerce ul.products li.product .add_to_cart_button:focus{
  outline: none;
  box-shadow: 0 0 0 4px rgba(31,79,58,.18) !important;
}

.site-header{
  position:sticky;
  top:0;
  z-index:10000;
  background:#fff;
  border-bottom:1px solid var(--border);
}

/* --------------------------------------------------------------------------
   Puuilo-tyylinen header-asettelu (v2)
   --------------------------------------------------------------------------
   Tämä osio ohittaa vanhemman .header-inner -asettelun silloin, kun käytössä on
   uudempi .header-layout + .header-row -rakenne.
   - Desktop: Logo vasen, nav keskellä, ikonit oikea; alla Tuotteet + keskitetty haku
   - Mobile: Yksi rivi (burger + haku), ei kori/tili-ikoneita yläpalkissa
*/

.site-header .header-layout{
  display:flex;
  flex-direction:column;
  gap:10px;
  padding:10px 0 14px;
}

.site-header .header-row{width:100%;}

/* Row 1 (top): burger (optional) + brand + nav + tools */
.site-header .header-row--top{
  display:flex;
  align-items:center;
  gap:12px;
}

.site-header .header-brand{flex:0 0 auto; min-width:0;}

/* Ensure logo never stretches: keep natural aspect ratio in all layouts */
.site-header .site-logo,
.site-header .site-logo .custom-logo-link{display:flex;align-items:center;}
.site-header .site-logo img,
.site-header img.custom-logo{
  width:auto !important;
  height:auto !important;
  max-width:100%;
  object-fit:contain;
}
.site-header .header-nav{flex:1 1 auto; min-width:0;}
.site-header .header-search-inline{flex:0 0 auto;}
.site-header .header-tools{flex:0 0 auto;}

.site-header .header-nav{min-width:0;}
.site-header .header-nav .menu{overflow:auto; scrollbar-width:none;}
.site-header .header-nav .menu::-webkit-scrollbar{display:none;}

.site-header .header-tools{display:flex; align-items:center; gap:10px;}

/* Row 2 (search): Tuotteet vasen + haku keskelle */
.site-header .header-row--search{
  /*
    Huom: Grid "auto 1fr" siirtää hakukentän keskitystä oikealle,
    koska keskitys tapahtuu vain 1fr-solussa. Puuilo-tyylissä
    hakukentän tulee olla aidosti koko headerin keskellä.
  */
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  column-gap:16px;
}

.site-header .header-row--search .header-searchbar{
  width:100%;
  max-width:680px;
}

/* Desktop: top-row burger pois, käytetään Tuotteet-nappia search-rivillä */
@media (min-width: 980px){
  /* Desktop: burger is only needed on mobile */
  .site-header .header-burger--inline{display:none !important;}

  .site-header .header-burger--top{display:none;}
  .site-header .header-burger--products{display:flex; align-items:center; gap:10px; padding:10px 12px; border-radius:14px; border:1px solid var(--border); background:#fff;}
  .site-header .header-burger--products .burger{margin-right:2px;}
  .site-header .header-burger--products .header-burger__label{font-weight:800;}

  /*
    Keskitetty haku ei saa "valuA" oikealle Tuotteet-napin takia.
    Nostetaan Tuotteet-nappi vasempaan reunaan absolute-positionilla.
  */
  .site-header .header-row--search{justify-content:center;}
  .site-header .header-row--search .header-burger--products{position:absolute; left:0;}
}

/* Mobile: yksi rivi (logo + burger + haku). Piilotetaan nav ja työkalut. */
@media (max-width: 1100px){
  .site-header .header-nav{display:none !important;}
  .site-header .header-tools{display:none !important;}

  .site-header .header-search-inline{flex:1 1 auto; min-width:0;}
  /* Mobile: icon-first. Search input is shown only when search is opened. */
  .site-header .header-searchbar--inline{display:none; width:100%;}

  /* Logo tiukasti vasempaan laitaan ja hieman pienemmäksi */
  .site-header .site-logo img{max-height:40px;}
}

/* When mobile search is opened: hide all header icons and show only the search field */
@media (max-width: 1100px){
  .site-header.is-search-open .header-brand{display:none !important;}
  .site-header.is-search-open .header-burger--inline{display:none !important;}
  .site-header.is-search-open .header-search-toggle{display:none !important;}
  .site-header.is-search-open .mobile-cart-fab{display:none !important;}
  .site-header.is-search-open .header-search-inline{flex:1 1 auto;}
  .site-header.is-search-open .header-searchbar--inline{display:block; width:100%;}
  .site-header.is-search-open .header-row--top{gap:0;}

  /* Fallback: if class is applied on body only, still force the same behavior */
  body.sakkinen-search-open .site-header .header-brand{display:none !important;}
  body.sakkinen-search-open .site-header .header-burger--inline{display:none !important;}
  body.sakkinen-search-open .site-header .header-search-toggle{display:none !important;}
  body.sakkinen-search-open .site-header .mobile-cart-fab{display:none !important;}
  body.sakkinen-search-open .site-header .header-searchbar--inline{display:block !important; width:100% !important;}
  body.sakkinen-search-open .site-header .header-search-inline{flex:1 1 auto; width:100%;}
}

/* Netrauta-henkinen header: ohut info-topbar + pääheader + nav-rivi */
.header-topbar{
  background:#f3f4f6;
  border-bottom:1px solid var(--border);
  font-size:13px;
  line-height:1.2;
}
.header-topbar__inner{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 0}
.header-topbar__left{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.header-topbar__right{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.header-topbar__link,.header-topbar__phone{color:var(--text);text-decoration:none;font-weight:650}
.header-topbar__link:hover,.header-topbar__phone:hover{text-decoration:underline}
.header-topbar__hours{color:var(--muted);font-weight:600}

.header-main{background:#fff}
.header-nav{display:block;min-width:0}
.header-nav .menu{list-style:none;margin:0;padding:0;display:flex;align-items:center;gap:22px;overflow:auto;scrollbar-width:none}
.header-nav .menu::-webkit-scrollbar{display:none}
.header-nav .menu > li{margin:0;white-space:nowrap}
.header-nav .menu > li > a{display:block;text-decoration:none;font-weight:750;padding:12px 4px;color:var(--text);letter-spacing:.1px}
.header-nav .menu > li > a:hover{color:var(--accent)}
.header-nav .menu > li.current-menu-item > a,.header-nav .menu > li.current-menu-ancestor > a{color:var(--accent)}

/* Campaign / promo bar below navigation (Netrauta-esque)
   - Can be controlled via Customizer or Header Promo widget area.
*/
.header-promo{background:#f7f8fa;border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
.header-promo__inner{display:flex;align-items:center;justify-content:space-between;gap:14px;min-height:54px;padding:10px 0;flex-wrap:wrap}
.header-promo__message{display:flex;align-items:center;gap:10px;font-weight:800;letter-spacing:.2px}
.header-promo__text{color:var(--text)}
.header-promo__link{text-decoration:none;color:var(--text)}
.header-promo__link:hover{text-decoration:underline}
.header-promo__title{font-weight:900;margin-bottom:6px}

.countdown{display:flex;align-items:center;gap:8px}
.countdown__box{background:#111827;color:#fff;border-radius:10px;padding:8px 10px;min-width:52px;text-align:center}
.countdown__num{font-weight:900;font-size:16px;line-height:1}
.countdown__lbl{font-size:11px;opacity:.85;margin-top:2px}.cart-btn{position:relative}
.cart-badge{
  position:absolute;right:-6px;top:-6px;
  background:var(--accent);color:#fff;
  border-radius:999px;
  font-size:12px;
  padding:3px 7px;
  min-width:18px;
  text-align:center;
}
.header-burger{width:44px}
.burger{display:block;width:18px;height:2px;background:var(--text);position:relative}
.burger:before,.burger:after{content:"";position:absolute;left:0;width:18px;height:2px;background:var(--text)}
.burger:before{top:-6px}.burger:after{top:6px}

@media (min-width: 980px){
  .header-nav{display:block}
  .header-burger{display:none}
  .header-navwrap{display:block}
}

/* Megamenu scaling for smaller desktop widths */
@media (min-width: 980px) and (max-width: 1140px){
  .sakkinen-megamenu__panel{
    width: min(1040px, 94vw);
    padding: 18px;
    max-height: calc(70vh);
  }
}

@media (min-width: 980px) and (max-width: 1020px){
  .sakkinen-megamenu__panel{
    width: min(920px, 94vw);
    padding: 16px;
    max-height: calc(66vh);
  }
}

@media (max-width: 979px){

  /* Mobile header like Netrauta: first row (burger + logo + icons), second row (search). */
  .header-topbar{display:none}
.site-logo img{max-height:36px}
.header-nav{display:none}
  .header-searchbar{display:block;max-width:none;min-width:0}
  .header-searchbar .search-form{gap:8px}
  .header-searchbar input[type="search"],
  .header-searchbar input.search-field{padding:12px 14px}
  .header-searchbar button,
  .header-searchbar input[type="submit"]{padding:12px 14px}
}

@media (max-width: 979px){
  /* Promo bar: keep visible and scale countdown to fit mobile. */
  .header-promo__inner{justify-content:center;flex-direction:column;gap:8px;padding:10px 0}
  .header-promo__countdown{display:block}
  .countdown{flex-wrap:wrap;justify-content:center}
  .countdown__box{min-width:46px;padding:6px 8px;border-radius:8px}
  .countdown__num{font-size:15px}
  .countdown__lbl{font-size:10px}
}

/* Drawer */
.drawer{position:fixed;inset:0;z-index:11000;display:none}
.drawer.is-open{display:block}
.drawer__backdrop{position:absolute;inset:0;background:rgba(0,0,0,.35)}
.drawer__panel{
  position:absolute;right:0;top:0;height:100%;width:min(420px,92vw);
  background:var(--surface);box-shadow:var(--shadow);
  display:flex;flex-direction:column;
}
.drawer__head{display:flex;align-items:center;justify-content:space-between;padding:14px 14px;border-bottom:1px solid var(--border)}
.drawer__title{font-weight:800}
.drawer__body{padding:14px;overflow:auto}
.drawer-menu{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.drawer-menu a{text-decoration:none;padding:10px 10px;border-radius:12px;border:1px solid var(--border);display:block}
.drawer-menu a:hover{border-color:rgba(31,35,40,.24)}

/* Search */
.searchform{display:flex;gap:10px;flex-wrap:wrap}
.searchform__input{
  flex:1;min-width:200px;
  border:1px solid var(--border);
  background:var(--bg);
  border-radius:14px;
  padding:12px 12px;
  font-size:16px;
}
.searchform__btn{height:46px}

/* ==========================================================
   Header search (theme-styled) – tuned for Säkkinen Woo Tools
   Goals:
   - Mobile: compact, calm, single-line
   - Desktop: spacious, premium (megamenu-like)
   - Compatible with search_suggest panel (.swt-search-suggest-*)
   ========================================================== */

/* Base: make header search look like a single control */
.site-header .header-searchbar .searchform{
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:16px;
  padding:4px;
  /* Puuilo-tyylissä kenttä on selkeä mutta ei "pullistele". */
  box-shadow:0 6px 16px rgba(0,0,0,.05);
}
.site-header .header-searchbar .searchform:focus-within{
  border-color:rgba(31,79,58,.55);
  box-shadow:0 0 0 3px rgba(31,79,58,.10), 0 10px 22px rgba(0,0,0,.08);
}
.site-header .header-searchbar .searchform__input{
  border:0;
  background:transparent;
  border-radius:14px;
  padding:10px 12px;
  font-size:16px;
  line-height:1.2;
}
.site-header .header-searchbar input[type="search"],
.site-header .header-searchbar input.search-field{
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  outline:none;
}
.site-header .header-searchbar input[type="search"]:focus,
.site-header .header-searchbar input.search-field:focus{outline:none;}
.site-header .header-searchbar .searchform__input::placeholder{color:rgba(31,35,40,.55)}
.site-header .header-searchbar .searchform__btn{
  height:auto;
  border-radius:14px;
  padding:10px 12px;
  font-weight:800;
}

/* Mobile: slightly tighter (but still usable) */
@media (max-width: 900px){
  .site-header .header-searchbar .searchform{
    border-radius:16px;
    padding:4px;
    box-shadow:0 6px 16px rgba(0,0,0,.05);
  }
  .site-header .header-searchbar .searchform__input{padding:11px 12px; font-size:16px;}
  .site-header .header-searchbar .searchform__btn{padding:11px 12px;}
}

/* Desktop: more generous width + slightly larger input (premium feel) */
@media (min-width: 1200px){
  /* Ei kasvateta hakua liikaa desktopissä – pidetään Puuilo-tyylisenä napakkana. */
  .site-header .header-searchbar .searchform{padding:4px; border-radius:16px;}
  .site-header .header-searchbar .searchform__input{padding:10px 12px; font-size:16px;}
  .site-header .header-searchbar .searchform__btn{padding:10px 12px;}
}

/* ==========================================================
   Search suggestions (Säkkinen Woo Tools: new swt-ss__* markup)
   Goal: smaller product thumbnails and a single-column list.
   ========================================================== */

.swt-ss__panel .swt-ss__products,
.swt-ss__panel .swt-ss__results,
.swt-ss__panel .swt-ss__items,
.swt-ss__panel .swt-ss__grid{
  display:grid !important;
  grid-template-columns: 1fr !important;
  gap: 12px !important;
}

.swt-ss__panel .swt-ss__products a,
.swt-ss__panel .swt-ss__results a,
.swt-ss__panel .swt-ss__items a,
.swt-ss__panel .swt-ss__grid a{
  display:flex !important;
  align-items:center;
  gap:12px;
  padding:12px 14px;
  border:1px solid rgba(31,35,40,.10);
  border-radius:18px;
  background:rgba(255,255,255,.66);
  text-decoration:none;
  color:inherit;
}

.swt-ss__panel .swt-ss__products img,
.swt-ss__panel .swt-ss__results img,
.swt-ss__panel .swt-ss__items img,
.swt-ss__panel .swt-ss__grid img{
  width:64px !important;
  height:64px !important;
  flex:0 0 64px;
  border-radius:16px;
  object-fit:cover;
  background:rgba(31,35,40,.06);
}

.swt-ss__panel .woocommerce-Price-amount,
.swt-ss__panel .price{
  font-weight:800;
}

@media (max-width: 991.98px){
  .swt-ss__panel .swt-ss__products img,
  .swt-ss__panel .swt-ss__results img,
  .swt-ss__panel .swt-ss__items img,
  .swt-ss__panel .swt-ss__grid img{
    width:56px !important;
    height:56px !important;
    flex:0 0 56px;
    border-radius:14px;
  }
}


/* Hero */
.hero{position:relative;min-height:520px;display:flex;align-items:stretch}
.hero__bg{
  position:absolute;inset:0;
  background-size:cover;background-position:center;
  background-image:linear-gradient(120deg, rgba(31,79,58,.45), rgba(0,0,0,.15));
}
.hero__overlay{position:absolute;inset:0;background:linear-gradient(90deg, rgba(0,0,0,.35), rgba(0,0,0,0))}
.hero__content{position:relative;display:flex;align-items:center;min-height:520px;padding:46px 16px}
.hero__box{
  background:rgba(255,255,255,.88);
  border:1px solid rgba(31,35,40,.14);
  border-radius:22px;
  padding:18px 18px;
  max-width:640px;
  box-shadow:0 10px 30px rgba(0,0,0,.14);
}
.hero .h1{color:var(--text)}
.hero .lead{color:var(--muted)}
@media (max-width:600px){
  .hero{min-height:440px}
  .hero__content{min-height:440px}
}

/* Sections */
.section{padding:42px 0}

/* Woo pages: reduce vertical whitespace a bit (product pages looked overly airy). */
body.woocommerce .section{padding:34px 0}
.section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:18px}
.section-head__actions{display:flex;gap:10px;align-items:center}
.carousel-btn{
  border:1px solid var(--border);
  background:var(--surface);
  width:42px;height:42px;border-radius:14px;
  cursor:pointer;font-size:22px;line-height:1;
}
.carousel-btn:hover{border-color:rgba(31,35,40,.24)}

/* Categories */
.cat-grid{
  display:grid;gap:14px;
  grid-template-columns:repeat(2, minmax(0,1fr));
}
@media(min-width:720px){.cat-grid{grid-template-columns:repeat(4, minmax(0,1fr));}}
.cat-card{
  text-decoration:none;
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:18px;
  overflow:hidden;
  box-shadow:0 0 0 rgba(0,0,0,0);
  transition:transform .12s ease, box-shadow .12s ease, border-color .12s ease;
}
.cat-card:hover{transform:translateY(-2px);box-shadow:var(--shadow);border-color:rgba(31,35,40,.22)}
.cat-card__img{aspect-ratio: 4/3; background:rgba(31,35,40,.05); display:flex; align-items:center; justify-content:center}
.cat-card__ph{width:100%;height:100%;background:linear-gradient(135deg, rgba(31,79,58,.12), rgba(0,0,0,.02))}
.cat-card__name{padding:12px 12px 0;font-weight:800}
.cat-card__cta{padding:6px 12px 14px;color:var(--muted);font-weight:650}

/* Carousel */
.carousel{position:relative}
.carousel__track{
  display:flex;gap:14px;
  overflow:auto;
  scroll-snap-type:x mandatory;
  padding-bottom:10px;
  -webkit-overflow-scrolling:touch;
}

/*
  Show only full cards (no half-cards) by sizing slides to an integer number
  of columns per viewport width. This keeps the last visible card fully inside
  the container in all breakpoints.
*/
.carousel__track{--carousel-cols:1}
@media (min-width:560px){.carousel__track{--carousel-cols:2}}
@media (min-width:900px){.carousel__track{--carousel-cols:3}}
@media (min-width:1200px){.carousel__track{--carousel-cols:4}}

.carousel__slide{
  scroll-snap-align:start;
  flex:0 0 calc((100% - (14px * (var(--carousel-cols) - 1))) / var(--carousel-cols));
  min-width:0;
}
.carousel__track::-webkit-scrollbar{height:10px}
.carousel__track::-webkit-scrollbar-thumb{background:rgba(31,35,40,.15);border-radius:999px}
.carousel__track::-webkit-scrollbar-track{background:transparent}

/* Product card */
.product-card{
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:18px;
  overflow:hidden;
  height:100%;
  display:flex;flex-direction:column;
  transition:transform .12s ease, box-shadow .12s ease, border-color .12s ease;
}
.product-card:hover{transform:translateY(-2px);box-shadow:var(--shadow);border-color:rgba(31,35,40,.22)}
.product-card__image{display:block;aspect-ratio:1/1;background:rgba(31,35,40,.04)}
.product-card__image img{width:100%;height:100%;object-fit:cover}
.product-card__body{padding:12px;display:flex;flex-direction:column;gap:10px;flex:1}
.product-card__title{text-decoration:none;font-weight:800}
.product-card__price{color:var(--muted);font-weight:750}
.product-card__cta{margin-top:auto}
.product-card .btn{width:100%}

/* Trust */
.trust-grid{display:grid;gap:14px;grid-template-columns:1fr}
@media(min-width:900px){.trust-grid{grid-template-columns:repeat(4, minmax(0,1fr));}}
.trust-card{
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:18px;
  padding:16px;
}
.trust-ico{font-size:22px;margin-bottom:10px}
.trust-card--cta{display:flex;flex-direction:column;gap:10px}
.trust-card--cta .btn{margin-top:auto}

/* Footer */
.site-footer{padding:42px 0 18px;border-top:1px solid var(--border);background:rgba(255,255,255,.55)}
.footer-grid{display:grid;gap:20px;grid-template-columns:1fr}
@media(min-width:900px){.footer-grid{grid-template-columns:1.2fr 1fr 1fr 1fr}}
.footer-title{margin:0 0 10px;font-size:16px}
.footer-menu{list-style:none;margin:0;padding:0;display:flex;gap:12px;flex-wrap:wrap}
.footer-menu--col{display:grid;gap:10px;}
.footer-menu--col a{color: rgba(0,0,0,.78); font-weight: 600; text-decoration:none;}
.footer-menu--col a:hover{text-decoration:underline;}
.footer-menu a{text-decoration:none;color:var(--muted);font-weight:650}
.footer-bottom{display:flex;gap:12px;justify-content:space-between;align-items:center;margin-top:18px;padding-top:14px;border-top:1px solid var(--border);flex-wrap:wrap}

/* Sticky add-to-cart */
.sticky-atc{
  position:fixed;left:0;right:0;bottom:0;
  padding:10px 12px;
  background:rgba(251,250,247,.9);
  border-top:1px solid var(--border);
  backdrop-filter:saturate(140%) blur(8px);
  transform:translateY(120%);
  transition:transform .18s ease;
  z-index:1100;
}
.sticky-atc.is-visible{transform:translateY(0)}
.sticky-atc__inner{max-width:var(--container);margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:12px}
.sticky-atc__meta{min-width:0}
.sticky-atc__name{font-weight:850;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:52vw}
.sticky-atc__price{color:var(--muted);font-weight:750}
.sticky-atc__btn{white-space:nowrap}

/* WooCommerce niceties */
.woocommerce .products{display:grid;gap:14px;width:100%;justify-content:start;grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
@media(min-width:900px){.woocommerce .products{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}}
.woocommerce ul.products li.product{margin:0!important;width:auto!important}
.woocommerce ul.products li.product a img{border-radius:18px}
.woocommerce a.button, .woocommerce button.button, .woocommerce input.button{border-radius:14px}
.woocommerce div.product .woocommerce-tabs ul.tabs li{border-radius:12px}


/* =========================
   v1.0.2 fixes
   ========================= */

/* Carousel: estä venyminen (1 tuote ei saa muuttua jättikortiksi) */
.carousel__slide{
  flex: 0 0 260px;
  min-width: 260px;
}
@media (min-width: 720px){
  .carousel__slide{
    flex-basis: 300px;
    min-width: 300px;
  }
}

/* Kun karuselli ei tarvitse scrollia (vähän tuotteita), keskitetään */
.carousel__track.is-center{
  justify-content: center;
}

/* Desktop header menu styling is defined earlier (Netrauta-henkinen). */

/* Header inline search (slides open to the left) */
/* Mobiilissa käytetään drawer-hakua */
@media (max-width: 979px){
}


/* =========================
   v1.0.3 header + mobile menu fixes
   ========================= */

/* Drawer layering: panel must be clickable above backdrop */
.drawer__panel{z-index:2}
.drawer__backdrop{z-index:1}

/* Menu drawer should slide from LEFT (others stay right) */
.drawer[data-drawer="menu"] .drawer__panel{left:0; right:auto}

/* Burger button is mobile-only (desktop has the full menu visible) */
@media (min-width: 980px){
.header-nav{display:flex !important;}
}

/* Safety: if any other burger variant is present, keep it mobile-only */
@media (min-width: 980px){
  .site-header .header-burger{display:none !important;}
}

/* Desktop mega menu (NovaFloor-like direction): full-width dropdown for first-level items with children */
@media (min-width: 980px){
.site-header .header-nav{position:relative; flex: 1 1 auto; justify-content:center;}

  /* Base menu */
  .site-header .header-nav .menu,
  .site-header .header-nav .menu > ul{display:flex; align-items:center; gap:18px; margin:0; padding:0; list-style:none;}
  .site-header .header-nav .menu > li{position:relative;}

  /* Dropdown panel */
  .site-header .header-nav .menu > li > .sub-menu{
    position:absolute;
    top: calc(100% + 14px);
    left: 50%;
    transform: translateX(-50%);
    width: min(1100px, 94vw);
    background: #fff;
    border: 1px solid rgba(0,0,0,.08);
    border-radius: 18px;
    box-shadow: 0 18px 50px rgba(0,0,0,.10);
    padding: 18px;
    display: none;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px 18px;
    z-index: 50;
  }

  /* Show dropdown on hover/focus */
  .site-header .header-nav .menu > li:hover > .sub-menu,
  .site-header .header-nav .menu > li:focus-within > .sub-menu,
  .site-header .header-nav .menu > li.is-open > .sub-menu{display:grid;}

  /* Second-level items */
  .site-header .header-nav .menu > li > .sub-menu > li{margin:0;}
  .site-header .header-nav .menu > li > .sub-menu > li > a{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding: 10px 12px;
    border-radius: 12px;
    text-decoration:none;
    color: inherit;
    font-weight: 650;
  }
  .site-header .header-nav .menu > li > .sub-menu > li > a:hover{background: rgba(0,0,0,.04);}

  /* Hide deeper levels inside the mega dropdown for now (keeps layout clean) */
  .site-header .header-nav .menu > li > .sub-menu .sub-menu{display:none;}

  /* Gutenberg-driven megamenu panel (admin-managed content)
     - Positioned exactly under the sticky header (JS sets --sakkinen-mm-top)
     - Visually integrated with the header bar (flat top edge)
  */
  .sakkinen-megamenu{position:fixed;left:0;right:0;top:var(--sakkinen-mm-top, 140px);z-index:10900;display:none;}
  .sakkinen-megamenu.is-open{display:block;}
  .sakkinen-megamenu__backdrop{position:fixed;left:0;right:0;top:var(--sakkinen-mm-top, 140px);bottom:0;background:rgba(0,0,0,.12);}
  .sakkinen-megamenu__panel{
    position:relative;
    /* Responsive width: grows on large screens, stays comfortable on smaller desktops */
    width:min(1320px, 96vw);
    margin:0 auto;
    background:#fff;
    border:1px solid rgba(0,0,0,.08);
    border-top:0;
    border-radius:0 0 18px 18px;
    box-shadow:0 18px 50px rgba(0,0,0,.10);
    padding:24px;
    max-height:calc(78vh);
    overflow:auto;
  }
  .sakkinen-megamenu__close{position:absolute;top:10px;right:10px;width:38px;height:38px;}
  .sakkinen-megamenu__content :is(h1,h2,h3){margin-top:0;}
  .sakkinen-megamenu__content .wp-block-columns{gap:18px;}
  .sakkinen-megamenu__content a{text-decoration:none;}
  .sakkinen-megamenu__content a:hover{text-decoration:underline;}
}

/* Megamenu: tighten on smaller desktop widths (when nav still shows but space is limited) */
@media (min-width: 980px) and (max-width: 1200px){
  .sakkinen-megamenu__panel{
    width:min(1100px, 94vw);
    padding:18px;
    max-height:calc(72vh);
  }
}

@media (min-width: 980px) and (max-width: 1040px){
  .sakkinen-megamenu__panel{
    width: min(980px, 92vw);
    padding:16px;
  }
  .sakkinen-megamenu__content .wp-block-columns{gap:14px;}
}

/* ==========================================================
   Header layout v2 (grid-based) – prevents overlaps reliably
   Requirements:
   - Desktop: nav before search, single row
   - Narrow desktop: no overlap (nav scrolls, search shrinks)
   - Mobile: top row burger+logo+icons, second row search
   - Sticky mobile: sticks to top without any gap (admin bar + safe area)
   ========================================================== */

/* Ensure the search form never stacks input/button */
.site-header .header-searchbar .searchform,
.site-header .header-searchbar .search-form{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:nowrap;
}
.site-header .header-searchbar .searchform__input{
  min-width:0;
  width:100%;
}
.site-header .header-searchbar .searchform__btn{
  white-space:nowrap;
}

/* Sticky behavior – lock the stickywrap to viewport top */
.header-stickywrap{position:relative; z-index:100;}
body.sakkinen-sticky-on .header-stickywrap{
  position:fixed;
  left:0;
  right:0;
  top:0 !important;
  background:#fff;
  box-shadow: 0 10px 30px rgba(0,0,0,.06);
}
/* NOTE: We intentionally keep sticky header flush to the very top.
   When logged in, WP admin bar may overlap the header – this is acceptable for shop UI testing.
   If needed later, we can add a toggle to offset only for admins. */

/* iOS safe-area: fill the very top so there's no white gap */
body.sakkinen-sticky-on .header-stickywrap::before{
  content:"";
  position:absolute;
  left:0; right:0;
  top: calc(-1 * env(safe-area-inset-top));
  height: env(safe-area-inset-top);
  background:#fff;
}

/* Sticky mobile: show only burger + search (hide branding + right icons) */
@media (max-width: 900px){
body.sakkinen-sticky-on .site-header .site-branding{display:none;}
}

/* Fix: keep the logo visible on mobile even when sticky is active.
   We still keep the header compact by slightly reducing the logo height. */
@media (max-width: 900px){
  body.sakkinen-sticky-on .site-header .site-branding{display:flex;}
  body.sakkinen-sticky-on .site-header .site-logo img{max-height:32px;}
}


/* =========================
   v1.0.4 mobile menu polish
   ========================= */

/* Mobile menu trigger: keep burger available on mobile. Desktop hiding is handled by the base media query. */
/* Hide the “Oma tili” menu item from the desktop header menu (it is rendered as an icon on the right). */
@media (min-width: 980px){
  .site-header .header-nav .sakkinen-menu-item-account{display:none !important;}
}

/* Menu drawer: slide-in panel from the LEFT (mobile + tablet) */
.drawer[data-drawer="menu"] .drawer__panel{
  left:0;
  right:auto;
  top:0;
  height:100%;
  max-height:none;
  width:min(86vw, 360px);
  border-radius:0 18px 18px 0;
  overflow:auto;
}
.drawer[data-drawer="menu"] .drawer__head{padding:14px 16px;}
.drawer[data-drawer="menu"] .drawer__body{padding:16px;}
.drawer__backdrop{
  background: rgba(0,0,0,.22);
}
.drawer-menu a{
  background: rgba(255,255,255,.72);
}
.drawer-menu a:hover{
  background: rgba(255,255,255,.95);
}
/* No top offset: the drawer must anchor to the viewport, not to header spacing. */


/* =========================
   v1.0.5 shop archive (myyvä & helppo ostaa)
   ========================= */

/* Layout: sidebar + products
   NOTE: `.container` already provides horizontal gutters.
   We only add vertical breathing room here to avoid removing left/right padding
   (which would make product pages stick to the viewport edges).
*/
.woocommerce .site-main.container{
  padding-top: 24px;
  padding-bottom: 32px;
}

/* Mobile shop archive spacing
   Goal: use full width (no unnecessary outer gutters), but keep small insets
   so headings and product cards do not stick to the edge.
*/
@media (max-width: 700px){
  /* Remove container gutters on Woo archive pages */
  .woocommerce .site-main.container{
    padding-left: 0 !important;
    padding-right: 0 !important;
    padding-top: 18px;
    padding-bottom: 24px;
  }

  /* Keep toolbar and titles readable with light inset */
  .woocommerce .woocommerce-products-header,
  .woocommerce .woocommerce-before-loop,
  .woocommerce .shop-toolbar{
    padding-left: 12px;
    padding-right: 12px;
  }

  /* Product grid: slightly tighter than desktop */
  .woocommerce ul.products{
    padding-left: 12px;
    padding-right: 12px;
    gap: 14px;
  }
}
.woocommerce .woocommerce-result-count{margin:0; opacity:.8;}
.woocommerce .woocommerce-ordering{margin:0;}
.woocommerce .woocommerce-ordering select{
  border:1px solid rgba(0,0,0,.12);
  border-radius:12px;
  padding:10px 12px;
  background:rgba(255,255,255,.7);
}

.woocommerce .woocommerce-products-header{
  margin: 18px 0 8px;
  text-align:left;
}
.woocommerce .woocommerce-products-header__title{
  font-size: clamp(28px, 3vw, 40px);
  margin: 0 0 6px;
  letter-spacing: -0.02em;
}
.woocommerce .term-description{max-width: 68ch; opacity:.9;}

.woocommerce .shop-toolbar{
  display:flex;
  align-items:center;
  justify-content: space-between;
  gap:12px;
  margin: 10px 0 16px;
}
.woocommerce .shop-filter-btn{
  border-radius: 999px;
  padding: 10px 14px;
  font-weight: 700;
}

/* Desktop: sidebar left */
@media (min-width: 980px){
  .woocommerce .woocommerce-before-loop{
    display:flex;
    align-items:center;
    justify-content: space-between;
    gap:16px;
    margin: 6px 0 18px;
  }
  .woocommerce .shop-layout{
    display:flex;
    gap: 24px;
    align-items:flex-start;
  }
  .woocommerce .shop-sidebar{
    width: 280px;
    flex: 0 0 280px;
    position: sticky;
    top: 92px;
  }
  .woocommerce .shop-sidebar__inner{
    background: rgba(255,255,255,.65);
    border: 1px solid rgba(0,0,0,.08);
    border-radius: 22px;
    padding: 16px;
    box-shadow: 0 10px 26px rgba(0,0,0,.06);
    backdrop-filter: blur(8px);
  }
  .woocommerce .shop-sidebar__heading{
    margin: 0 0 12px;
    font-size: 16px;
    opacity: .85;
  }
  .woocommerce .shop-main{
    flex: 1 1 auto;
    min-width: 0;
  }
  .woocommerce .shop-toolbar{display:none;} /* filter button only mobile */
}

/* Sidebar widgets */
.shop-widget{margin:0 0 14px;}
.shop-widget__title{
  margin: 0 0 8px;
  font-size: 14px;
  text-transform: uppercase;
  letter-spacing: .06em;
  opacity: .75;
}
.shop-widget ul{list-style:none; margin:0; padding:0;}
.shop-widget li{margin:0 0 6px;}
.shop-widget a{text-decoration:none;}
.shop-widget input[type="text"], .shop-widget input[type="search"], .shop-widget select{
  width:100%;
  padding:10px 12px;
  border-radius:12px;
  border:1px solid rgba(0,0,0,.12);
  background: rgba(255,255,255,.8);
}

/* Woo sidebar widgets (real-world widgets use .widget / .wc-block-* classes)
   - unify visual language (card-ish sections, clean list items)
   - keep Woo markup intact (CSS-only)
*/
.woocommerce .shop-sidebar .widget,
.woocommerce .shop-sidebar .wc-blocks-filter-wrapper,
.woocommerce .shop-sidebar .wp-block-woocommerce-filter-wrapper{
  margin: 0 0 14px;
  padding: 14px 14px;
  border: 1px solid rgba(0,0,0,.10);
  border-radius: 16px;
  background: rgba(255,255,255,.85);
}

.woocommerce .shop-sidebar .widget:last-child,
.woocommerce .shop-sidebar .wc-blocks-filter-wrapper:last-child,
.woocommerce .shop-sidebar .wp-block-woocommerce-filter-wrapper:last-child{
  margin-bottom: 0;
}

.woocommerce .shop-sidebar .widget-title,
.woocommerce .shop-sidebar .wc-blocks-filter-wrapper h3,
.woocommerce .shop-sidebar .wp-block-woocommerce-filter-wrapper h3,
.woocommerce .shop-sidebar .widget h2,
.woocommerce .shop-sidebar .widget h3{
  margin: 0 0 10px;
  font-size: 13px;
  text-transform: uppercase;
  letter-spacing: .06em;
  opacity: .78;
  font-weight: 850;
}

.woocommerce .shop-sidebar .widget ul,
.woocommerce .shop-sidebar .widget ol{
  list-style: none;
  margin: 0;
  padding: 0;
}

.woocommerce .shop-sidebar .widget li{margin: 0 0 8px;}
.woocommerce .shop-sidebar .widget li:last-child{margin-bottom:0;}

.woocommerce .shop-sidebar .widget a{
  text-decoration: none;
  font-weight: 700;
}

.woocommerce .shop-sidebar .widget a:hover{
  text-decoration: underline;
}

.woocommerce .shop-sidebar .widget input[type="search"],
.woocommerce .shop-sidebar .widget input[type="text"],
.woocommerce .shop-sidebar .widget select,
.woocommerce .shop-sidebar .widget .select2-container .select2-selection{
  width: 100%;
  border-radius: 14px;
  border: 1px solid rgba(0,0,0,.12);
  background: #fff;
  padding: 10px 12px;
}

/* WooCommerce "classic" filter widgets (Appearance > Widgets)
   - layered nav (attribute/brand), price filter, rating filter
   - make rows easier to scan + tap
*/
.woocommerce .shop-sidebar .widget.woocommerce-widget-layered-nav,
.woocommerce .shop-sidebar .widget.widget_layered_nav,
.woocommerce .shop-sidebar .widget.woocommerce-widget-rating-filter,
.woocommerce .shop-sidebar .widget.widget_rating_filter,
.woocommerce .shop-sidebar .widget.woocommerce.widget_price_filter,
.woocommerce .shop-sidebar .widget.widget_price_filter{
  --sakkinen-filter-row-pad: 10px;
}

.woocommerce .shop-sidebar .widget.woocommerce-widget-layered-nav ul,
.woocommerce .shop-sidebar .widget.widget_layered_nav ul,
.woocommerce .shop-sidebar .widget.woocommerce-widget-rating-filter ul,
.woocommerce .shop-sidebar .widget.widget_rating_filter ul{
  margin: 0;
  padding: 0;
}

/* Layered nav list items */
.woocommerce .shop-sidebar .woocommerce-widget-layered-nav-list__item,
.woocommerce .shop-sidebar .wc-layered-nav-term,
.woocommerce .shop-sidebar .widget_rating_filter li{
  margin: 0;
  padding: 0;
}

.woocommerce .shop-sidebar .woocommerce-widget-layered-nav-list__item a,
.woocommerce .shop-sidebar .wc-layered-nav-term a,
.woocommerce .shop-sidebar .widget_rating_filter a{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: var(--sakkinen-filter-row-pad);
  border-radius: 12px;
  border: 1px solid rgba(0,0,0,.08);
  background: rgba(255,255,255,.9);
  text-decoration: none;
}

.woocommerce .shop-sidebar .woocommerce-widget-layered-nav-list__item a:hover,
.woocommerce .shop-sidebar .wc-layered-nav-term a:hover,
.woocommerce .shop-sidebar .widget_rating_filter a:hover{
  border-color: rgba(0,0,0,.16);
  text-decoration: none;
}

/* Count badge */
.woocommerce .shop-sidebar .woocommerce-widget-layered-nav-list__item .count,
.woocommerce .shop-sidebar .wc-layered-nav-term .count,
.woocommerce .shop-sidebar .widget_rating_filter .count{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 28px;
  height: 22px;
  padding: 0 8px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 800;
  opacity: .75;
  border: 1px solid rgba(0,0,0,.10);
  background: rgba(0,0,0,.03);
}

/* Active filter state (chosen) */
.woocommerce .shop-sidebar .woocommerce-widget-layered-nav-list__item.chosen a,
.woocommerce .shop-sidebar .wc-layered-nav-term.chosen a,
.woocommerce .shop-sidebar .widget_rating_filter li.chosen a{
  border-color: rgba(0,0,0,.28);
  box-shadow: 0 6px 18px rgba(0,0,0,.06);
}

.woocommerce .shop-sidebar .woocommerce-widget-layered-nav-list__item.chosen a::before,
.woocommerce .shop-sidebar .wc-layered-nav-term.chosen a::before,
.woocommerce .shop-sidebar .widget_rating_filter li.chosen a::before{
  content: "✓";
  font-weight: 900;
  opacity: .9;
  margin-right: 4px;
}

/* Keep Woo's default bullet suppression consistent */
.woocommerce .shop-sidebar .woocommerce-widget-layered-nav-list__item,
.woocommerce .shop-sidebar .wc-layered-nav-term,
.woocommerce .shop-sidebar .widget_rating_filter li{
  list-style: none;
}

/* Price filter widget */
.woocommerce .shop-sidebar .widget_price_filter .price_slider_wrapper{
  margin-top: 8px;
}

.woocommerce .shop-sidebar .widget_price_filter .ui-slider{
  height: 6px;
  border-radius: 999px;
  background: rgba(0,0,0,.08);
  border: 0;
}

.woocommerce .shop-sidebar .widget_price_filter .ui-slider .ui-slider-range{
  background: rgba(0,0,0,.22);
}

.woocommerce .shop-sidebar .widget_price_filter .ui-slider .ui-slider-handle{
  width: 16px;
  height: 16px;
  top: -5px;
  border-radius: 999px;
  border: 1px solid rgba(0,0,0,.20);
  background: #fff;
}

.woocommerce .shop-sidebar .widget_price_filter .price_slider_amount{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-top: 12px;
}

.woocommerce .shop-sidebar .widget_price_filter .price_slider_amount .button{
  width: 100%;
  border-radius: 12px;
  font-weight: 850;
  padding: 10px 12px;
}

.woocommerce .shop-sidebar .widget_price_filter .price_label{
  font-size: 13px;
  font-weight: 800;
  opacity: .85;
}

/* Products grid */
.woocommerce ul.products{
  display:grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 18px;
  margin: 0;
}
@media (min-width: 720px){
  .woocommerce ul.products{grid-template-columns: repeat(3, minmax(0,1fr));}
}
@media (min-width: 1200px){
  .woocommerce ul.products{grid-template-columns: repeat(4, minmax(0,1fr));}
}
.woocommerce ul.products li.product{
  width: auto !important;
  margin: 0 !important;
}

/* Product cards: make buying obvious */
.woocommerce ul.products li.product .woocommerce-loop-product__title{
  font-size: 14px;
  line-height: 1.25;
  margin: 10px 0 6px;
  font-weight: 800;
}
.woocommerce ul.products li.product .price{
  font-weight: 800;
  margin: 0 0 10px;
}
.woocommerce ul.products li.product .button{
  width: 100%;
  text-align:center;
  border-radius: 12px;
  font-weight: 800;
  padding: 12px 14px;
}

/* Drawer: filters */
@media (max-width: 979px){
  .woocommerce .shop-sidebar{display:block !important; position:absolute !important; left:-9999px !important; top:auto !important; width:1px !important; height:1px !important; overflow:hidden !important; }
  .drawer[data-drawer="filters"] .drawer__panel{
    right:0;
    left:auto;
    width: min(520px, calc(100vw - 24px));
  }
}


/* =========================
   v1.0.6 shop grid hardening
   ========================= */
.woocommerce ul.products{padding:0;margin:0}
.woocommerce ul.products::before,
.woocommerce ul.products::after{content:none !important}
.woocommerce ul.products li.product{float:none !important;clear:none !important}
.woocommerce ul.products li.product{display:flex;flex-direction:column}

/* =========================
   v1.0.8 equal height product cards
   ========================= */

/* Force equal-height cards in product grids */
.woocommerce ul.products{
  align-items: stretch;
}
.woocommerce ul.products li.product{
  display:flex !important;
  flex-direction:column;
  height:100%;
  align-items:stretch;
}
.woocommerce ul.products li.product > *{
  width:100%;
}

/* Make the main product link stretch */
.woocommerce ul.products li.product .woocommerce-LoopProduct-link{
  display:flex;
  flex-direction:column;
  flex: 1 1 auto;
}

/* Push Add-to-cart button to bottom so CTAs align */
.woocommerce ul.products li.product .button,
.woocommerce ul.products li.product .add_to_cart_button{
  margin-top:auto;
}

/* Avoid unit-price block pushing CTA inconsistently */


/* =========================
   v1.0.9 loop price block (single price + optional €/m²)
   ========================= */
.woocommerce ul.products li.product .price{display:none !important;} /* safety: remove duplicates */

.sakkinen-priceblock{margin-top:8px;margin-bottom:10px;display:flex;flex-direction:column;gap:6px}
.sakkinen-priceblock__primary{font-weight:850;font-size:18px;letter-spacing:-0.2px}
.sakkinen-priceblock__secondary{font-weight:700;font-size:14px;opacity:.92;display:flex;gap:8px;align-items:baseline;flex-wrap:wrap}
.sakkinen-priceblock__unit{font-weight:750;opacity:.85;font-size:.9em}
.sakkinen-priceblock__hint{opacity:.75;font-weight:650;font-size:13px}

/* =========================
   v1.0.10 unit-aware pricing (plugin/meta driven)
   ========================= */
.woocommerce ul.products li.product .price{display:none !important;} /* safety: remove duplicates */
.sakkinen-priceblock{margin-top:8px;margin-bottom:10px;display:flex;flex-direction:column;gap:6px}
.sakkinen-priceblock__primary{font-weight:850;font-size:18px;letter-spacing:-0.2px}
.sakkinen-priceblock__secondary{font-weight:700;font-size:14px;opacity:.92;display:flex;gap:8px;align-items:baseline;flex-wrap:wrap}
.sakkinen-priceblock__secondary--hint{opacity:.85}
.sakkinen-priceblock__unit{font-weight:750;opacity:.85;font-size:.9em}
.sakkinen-priceblock__hint{opacity:.75;font-weight:650;font-size:13px}

/* =========================
   v1.0.11 clean unit price (no pack price)
   ========================= */
.sakkinen-priceblock{margin-top:10px;margin-bottom:12px}
.sakkinen-priceblock__primary{
  display:flex;
  align-items:baseline;
  gap:0;
  font-weight:900;
  font-size:22px;
  letter-spacing:-0.3px;
}
.sakkinen-priceblock__primary .woocommerce-Price-amount{font-weight:900}
.sakkinen-priceblock__unit{
  margin-left:4px;
  font-weight:850;
  font-size:.95em;
  opacity:.9;
}

/* safety: hide any legacy secondary rows if present */
.sakkinen-priceblock__secondary,.sakkinen-priceblock__hint{display:none !important;}


/* =========================
   v1.0.13 product card fine-tuning (clean, premium, conversion-focused)
   ========================= */

/*
  SWT Carousels (plugin): make carousel product cards match the normal Woo grid cards.
  The carousel can be placed outside the .woocommerce wrapper, so theme selectors that
  start with ".woocommerce" would not apply. We mirror the key card rules under
  ".swt-carousel" to keep typography + CTA consistent.
*/

/* Remove underlines inside carousel cards (theme-wide link styles may underline). */
.swt-carousel ul.products li.product a,
.swt-carousel ul.products li.product a:hover,
.swt-carousel ul.products li.product a:focus{
  text-decoration: none;
  color: inherit;
}

/* Card surface */
.woocommerce ul.products li.product{
  background:#fff;
  border:1px solid rgba(20,20,20,.06);
  border-radius:24px;
  padding:18px;
  box-shadow: 0 10px 24px rgba(15, 20, 18, .06);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.woocommerce ul.products li.product:hover{
  transform: translateY(-2px);
  box-shadow: 0 16px 36px rgba(15, 20, 18, .10);
  border-color: rgba(20,20,20,.10);
}

/* Image */
.woocommerce ul.products li.product a img{
  border-radius:20px;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  background: #f5f5f5;
}

/* Title */
.woocommerce ul.products li.product .woocommerce-loop-product__title{
  margin:14px 0 0;
  font-size:18px;
  font-weight:850;
  line-height:1.22;
  letter-spacing:-0.2px;
  color:#111;
  display:-webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow:hidden;
  min-height: calc(1.22em * 2);
}

/* Price */
.sakkinen-priceblock{margin-top:12px;margin-bottom:14px}
.sakkinen-priceblock__primary{
  font-size: clamp(22px, 2.0vw, 28px);
  line-height:1.1;
}
.sakkinen-priceblock__unit{opacity:.85}

/* CTA button */
.woocommerce ul.products li.product .button,
.woocommerce ul.products li.product .add_to_cart_button{
  width:100%;
  min-height:56px;
  border-radius:999px;
  font-weight:850;
  font-size:16px;
  letter-spacing:-0.1px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  border:2px solid rgba(17,17,17,.12);
  margin-top:auto;
}

/* Subtle focus states */
.woocommerce ul.products li.product .button:focus,
.woocommerce ul.products li.product .add_to_cart_button:focus{
  outline: none;
  box-shadow: 0 0 0 4px rgba(20, 120, 90, .18);
}

/* Mobile breathing room */
@media (max-width: 680px){
  .woocommerce ul.products li.product{padding:16px;border-radius:22px}
  .woocommerce ul.products li.product a img{border-radius:18px}
  .woocommerce ul.products li.product .woocommerce-loop-product__title{font-size:17px}
  .woocommerce ul.products li.product .button,
  .woocommerce ul.products li.product .add_to_cart_button{min-height:54px}
}


/* =========================
   v1.0.14 card typography + archive spacing
   ========================= */

/* Product title: smaller, more balanced */
.woocommerce ul.products li.product .woocommerce-loop-product__title{
  font-size:16px;
  font-weight:800;
  letter-spacing:-0.15px;
}

/* Image rounding: slightly tighter than card */
.woocommerce ul.products li.product a img{
  border-radius:16px;
}

/* Sorting dropdown: give breathing room above products grid */
.woocommerce .woocommerce-ordering{
  margin: 0 0 22px 0;
}
.woocommerce .woocommerce-result-count{
  margin: 0 0 10px 0;
}

/* Category description ("Kaikenlaisia lattioita") – hide by default for clean PLP */
.tax-product_cat .term-description,
.archive .term-description,
.woocommerce-products-header__description{
  display:none !important;
}


/* =========================
   v1.0.15 card rhythm + CTA chevron
   ========================= */

/* Make product card internals align consistently */
.woocommerce ul.products li.product{
  display:flex;
  flex-direction:column;
  gap:12px;
}
.woocommerce ul.products li.product > a.woocommerce-LoopProduct-link{
  display:block;
}
.woocommerce ul.products li.product .woocommerce-loop-product__title{
  margin-top: 6px;
}
.sakkinen-priceblock{
  margin-top: 2px;
  margin-bottom: 6px;
}
/* Ensure button always sits at bottom with consistent spacing */
.woocommerce ul.products li.product .button,
.woocommerce ul.products li.product .add_to_cart_button{
  margin-top:auto;
}

/* CTA: clean outline pill + chevron like the reference */
.woocommerce ul.products li.product .button,
.woocommerce ul.products li.product .add_to_cart_button{
  position:relative;
  justify-content:space-between;
  padding: 0 18px;
  border:2px solid rgba(17,17,17,.14);
  background: rgba(17,17,17,.03);
  color:#111;
  transition: background .18s ease, border-color .18s ease, transform .18s ease;
}
.woocommerce ul.products li.product .button:hover,
.woocommerce ul.products li.product .add_to_cart_button:hover{
  background: rgba(17,17,17,.06);
  border-color: rgba(17,17,17,.22);
  transform: translateY(-1px);
}
/* Chevron icon */
.woocommerce ul.products li.product .button:after,
.woocommerce ul.products li.product .add_to_cart_button:after{
  content: "›";
  font-size: 22px;
  line-height: 1;
  opacity: .75;
  margin-left: 10px;
}
/* Keep text centered-ish even with chevron by reserving space left */
.woocommerce ul.products li.product .button:before,
.woocommerce ul.products li.product .add_to_cart_button:before{
  content:"";
  width: 22px; /* balance chevron width */
}

/* Mobile tweaks: slightly tighter but still premium */
@media (max-width: 680px){
  .woocommerce ul.products li.product{gap:10px}
  .woocommerce ul.products li.product .button,
  .woocommerce ul.products li.product .add_to_cart_button{padding:0 16px}
}


/* =========================
   v1.0.16 sharper corners + tighter image padding
   ========================= */

/* Sharper overall geometry */
.woocommerce ul.products li.product{
  border-radius:16px;
  padding:14px; /* tighter */
}
.woocommerce ul.products li.product a img{
  border-radius:12px;
}

/* Button less round */
.woocommerce ul.products li.product .button,
.woocommerce ul.products li.product .add_to_cart_button{
  border-radius:16px;
  min-height:52px;
}

/* If any wrappers use huge rounding, tame them */
.woocommerce ul.products li.product a.woocommerce-LoopProduct-link{
  border-radius:12px;
}

/* Slightly tighter internal rhythm after padding change */
.woocommerce ul.products li.product{gap:10px}


/* =========================
   Product gallery (WooCommerce default): consistent height + cleaner thumbnails
   - Keep the visible (PDP) image area the same size regardless of source aspect ratio
   - Crop only in the PDP viewport (lightbox still opens the original image)
   ========================= */

/* Tune these two values to your liking */
:root{
  --sakkinen-pdp-image-ratio: 1 / 1;   /* e.g. 4/3 or 16/9 */
  --sakkinen-thumb-size: 76px;
}

/* Remove odd spacing and make gallery predictable */
body.single-product .woocommerce-product-gallery{
  margin: 0;
}

body.single-product .woocommerce-product-gallery__wrapper{
  margin: 0;
}

body.single-product .woocommerce-product-gallery__image{
  margin: 0;
}

/* Lock EVERY slide (not only first-child) into the same viewport */
body.single-product .woocommerce-product-gallery__wrapper .woocommerce-product-gallery__image > a{
  display: block;
  width: 100%;
  aspect-ratio: var(--sakkinen-pdp-image-ratio);
  overflow: hidden;
  border-radius: 12px;
  background: rgba(0,0,0,0.03);
  position: relative;
}

/* WooCommerce zoom can inject wrappers/images that otherwise ignore the rounding.
   Force clipping on the common wrapper elements so corners stay rounded on hover. */
body.single-product .woocommerce-product-gallery__wrapper .woocommerce-product-gallery__image{
  border-radius: 12px;
  overflow: hidden;
}

body.single-product .woocommerce-product-gallery__wrapper .woocommerce-product-gallery__image .zoom,
body.single-product .woocommerce-product-gallery__wrapper .woocommerce-product-gallery__image a{
  border-radius: 12px;
  overflow: hidden;
}

body.single-product .woocommerce-product-gallery__wrapper .woocommerce-product-gallery__image img{
  position: absolute;
  inset: 0;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover;
  display: block;
}

/* Make it obvious that the main image is clickable (opens full size/lightbox) */
body.single-product .woocommerce-product-gallery__wrapper .woocommerce-product-gallery__image a{
  position: relative;
  cursor: zoom-in;
}

body.single-product .woocommerce-product-gallery__wrapper .woocommerce-product-gallery__image a::before{
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,0.12);
  opacity: 0;
  transition: opacity .18s ease-in-out;
  pointer-events: none;
}

body.single-product .woocommerce-product-gallery__wrapper .woocommerce-product-gallery__image a::after{
  content: "Klikkaa nähdäksesi kuvan täysikokoisena";
  position: absolute;
  left: 12px;
  right: 12px;
  bottom: 12px;
  padding: 10px 12px;
  border-radius: 10px;
  background: rgba(0,0,0,0.55);
  color: #fff;
  font-weight: 600;
  font-size: 14px;
  line-height: 1.2;
  opacity: 0;
  transform: translateY(6px);
  transition: opacity .18s ease-in-out, transform .18s ease-in-out;
  pointer-events: none;
}

body.single-product .woocommerce-product-gallery__wrapper .woocommerce-product-gallery__image a:hover::before,
body.single-product .woocommerce-product-gallery__wrapper .woocommerce-product-gallery__image a:focus-visible::before{
  opacity: 1;
}

body.single-product .woocommerce-product-gallery__wrapper .woocommerce-product-gallery__image a:hover::after,
body.single-product .woocommerce-product-gallery__wrapper .woocommerce-product-gallery__image a:focus-visible::after{
  opacity: 1;
  transform: translateY(0);
}

@media (max-width: 480px){
  body.single-product .woocommerce-product-gallery__wrapper .woocommerce-product-gallery__image a::after{
    font-size: 12px;
    padding: 9px 10px;
    left: 10px;
    right: 10px;
    bottom: 10px;
  }
}

/* Thumbnails: align nicely, prevent “random” heights */
body.single-product .woocommerce-product-gallery .flex-control-thumbs{
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  /* Space between the main image and thumbnails */
  margin: 28px 0 0;
  padding: 0;
}

body.single-product .woocommerce-product-gallery .flex-control-thumbs li{
  width: var(--sakkinen-thumb-size);
  margin: 0;
  list-style: none;
}

body.single-product .woocommerce-product-gallery .flex-control-thumbs img{
  width: var(--sakkinen-thumb-size);
  height: var(--sakkinen-thumb-size);
  object-fit: cover;
  border-radius: 10px;
  opacity: .75;
  transition: opacity .15s ease, transform .15s ease;
}

body.single-product .woocommerce-product-gallery .flex-control-thumbs img:hover{
  opacity: .95;
}

body.single-product .woocommerce-product-gallery .flex-control-thumbs img.flex-active{
  opacity: 1;
  transform: scale(1.02);
}

/* Main gallery arrows (FlexSlider direction navigation). */
body.single-product .woocommerce-product-gallery .flex-direction-nav{
  list-style: none;
  margin: 0;
  padding: 0;
  position: absolute;
  inset: 0;
  pointer-events: none;
}

body.single-product .woocommerce-product-gallery .flex-direction-nav a{
  pointer-events: auto;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 44px;
  height: 44px;
  border-radius: 999px;
  background: rgba(255,255,255,0.92);
  box-shadow: 0 6px 18px rgba(0,0,0,0.12);
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  color: #111;
  font-size: 28px;
  line-height: 1;
  opacity: 0;
  transition: opacity 0.15s ease, transform 0.15s ease;
}

body.single-product .woocommerce-product-gallery:hover .flex-direction-nav a{
  opacity: 1;
}

body.single-product .woocommerce-product-gallery .flex-direction-nav a.flex-prev{
  left: 12px;
}

body.single-product .woocommerce-product-gallery .flex-direction-nav a.flex-next{
  right: 12px;
}

body.single-product .woocommerce-product-gallery .flex-direction-nav a:hover{
  transform: translateY(-50%) scale(1.03);
}

/* Prevent huge hero height on large screens (still keeps ratio) */
@media (min-width: 992px){
  body.single-product .woocommerce-product-gallery__wrapper .woocommerce-product-gallery__image > a{
    max-height: 680px;
  }
}

/* ==============================
   SWT / WooCommerce: Product gallery refinements
   ============================== */

/* Ensure stable spacing between main image and thumbnails */
body.single-product .woocommerce-product-gallery{
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 22px;
}
body.single-product .woocommerce-product-gallery .flex-control-thumbs{
  margin: 0 !important;
  padding: 0;
}

/* Main gallery arrows (FlexSlider direction navigation). */
body.single-product .woocommerce-product-gallery .flex-direction-nav{
  list-style: none;
  margin: 0;
  padding: 0;
  position: absolute;
  inset: 0;
  pointer-events: none;
}

body.single-product .woocommerce-product-gallery .flex-direction-nav a{
  pointer-events: auto;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 44px;
  height: 44px;
  border-radius: 999px;
  background: rgba(255,255,255,0.92);
  box-shadow: 0 8px 22px rgba(0,0,0,0.14);
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  color: #111;
  font-size: 30px;
  line-height: 1;
  opacity: 0;
  transition: opacity .15s ease, transform .15s ease;
}

body.single-product .woocommerce-product-gallery:hover .flex-direction-nav a,
body.single-product .woocommerce-product-gallery:focus-within .flex-direction-nav a{
  opacity: 1;
}

body.single-product .woocommerce-product-gallery .flex-direction-nav a.flex-prev,
body.single-product .woocommerce-product-gallery .flex-direction-nav a.prev{
  left: 12px;
}
body.single-product .woocommerce-product-gallery .flex-direction-nav a.flex-next,
body.single-product .woocommerce-product-gallery .flex-direction-nav a.next{
  right: 12px;
}

body.single-product .woocommerce-product-gallery .flex-direction-nav a:hover{
  transform: translateY(-50%) scale(1.04);
}

/* ==============================
   WooCommerce: Product gallery refinements
   ============================== */

/* Stable spacing between main image and thumbnails */
body.single-product .woocommerce-product-gallery{
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 22px;
}
body.single-product .woocommerce-product-gallery .flex-control-thumbs{
  margin: 0 !important;
}

/* Main gallery arrows (FlexSlider direction navigation) */
body.single-product .woocommerce-product-gallery .flex-direction-nav{
  list-style: none;
  margin: 0;
  padding: 0;
  position: absolute;
  inset: 0;
  pointer-events: none;
}
body.single-product .woocommerce-product-gallery .flex-direction-nav a{
  pointer-events: auto;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 44px;
  height: 44px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.92);
  box-shadow: 0 6px 18px rgba(0,0,0,0.12);
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  color: #111;
  font-size: 28px;
  line-height: 1;
  opacity: 0;
  transition: opacity .15s ease, transform .15s ease;
}
body.single-product .woocommerce-product-gallery:hover .flex-direction-nav a{
  opacity: 1;
}
body.single-product .woocommerce-product-gallery .flex-direction-nav a.flex-prev,
body.single-product .woocommerce-product-gallery .flex-direction-nav a.prev{
  left: 12px;
}
body.single-product .woocommerce-product-gallery .flex-direction-nav a.flex-next,
body.single-product .woocommerce-product-gallery .flex-direction-nav a.next{
  right: 12px;
}
body.single-product .woocommerce-product-gallery .flex-direction-nav a:hover{
  transform: translateY(-50%) scale(1.04);
}

/* ==============================
   WooCommerce: Product gallery refinements
   ============================== */

/* Stable spacing between main image and thumbnails */
body.single-product .woocommerce-product-gallery{
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 22px;
}
body.single-product .woocommerce-product-gallery .flex-control-thumbs{
  margin: 0 !important;
}

/* Main gallery arrows (FlexSlider direction navigation). */
body.single-product .woocommerce-product-gallery .flex-direction-nav{
  list-style: none;
  margin: 0;
  padding: 0;
  position: absolute;
  inset: 0;
  pointer-events: none;
}

body.single-product .woocommerce-product-gallery .flex-direction-nav a{
  pointer-events: auto;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 44px;
  height: 44px;
  border-radius: 999px;
  background: rgba(255,255,255,0.92);
  box-shadow: 0 6px 18px rgba(0,0,0,0.14);
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  color: #111;
  font-size: 28px;
  line-height: 1;
  opacity: 0;
  transition: opacity 150ms ease, transform 150ms ease;
}

body.single-product .woocommerce-product-gallery:hover .flex-direction-nav a,
body.single-product .woocommerce-product-gallery:focus-within .flex-direction-nav a{
  opacity: 1;
}

body.single-product .woocommerce-product-gallery .flex-direction-nav a.flex-prev,
body.single-product .woocommerce-product-gallery .flex-direction-nav li:first-child a{
  left: 12px;
}
body.single-product .woocommerce-product-gallery .flex-direction-nav a.flex-next,
body.single-product .woocommerce-product-gallery .flex-direction-nav li:last-child a{
  right: 12px;
}

body.single-product .woocommerce-product-gallery .flex-direction-nav a:hover{
  transform: translateY(-50%) translateY(-1px);
}


/* === Shop single product gallery: arrow icons + spacing overrides (Säkkinen) === */
body.single-product .woocommerce-product-gallery{
  display:flex;
  flex-direction:column;
  gap:18px; /* space between main image and thumbnails */
}

body.single-product .woocommerce-product-gallery .flex-control-thumbs{
  margin-top:14px !important; /* fallback if gap is overridden */
}

/* Flexslider navigation arrows: ensure actual arrow glyphs (not blank circles) */
body.single-product .woocommerce-product-gallery .flex-direction-nav a{
  font-size:0;             /* hide any inherited text/icon fonts */
  line-height:0;
  text-indent:-9999px;
}

body.single-product .woocommerce-product-gallery .flex-direction-nav a::before{
  content:'\2039';         /* ‹ */
  text-indent:0;
  font-size:28px;
  line-height:1;
  display:block;
}

body.single-product .woocommerce-product-gallery .flex-direction-nav a.flex-next::before{
  content:'\203A';         /* › */
}


/* ============================================================
   SWT: Asennusvara-laskuri (teeman viimeistely)
   ============================================================ */

.swt-install-allowance{
  margin-top: 18px;
  padding: 16px;
  border: 1px solid rgba(0,0,0,.10);
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 10px 28px rgba(0,0,0,.06);
}

.swt-install-allowance__head{
  display: grid;
  gap: 6px;
  margin-bottom: 14px;
}

.swt-install-allowance__title{
  font-size: 16px;
  font-weight: 800;
}

.swt-install-allowance__hint{
  font-size: 13px;
  color: rgba(0,0,0,.65);
}

.swt-install-allowance__grid{
  display: grid;
  gap: 14px;
}

@media (min-width: 640px){
  .swt-install-allowance__grid{
    grid-template-columns: 1fr 1fr;
    align-items: end;
  }
}

.swt-install-allowance__label{
  display: inline-block;
  margin-bottom: 8px;
  font-size: 13px;
  font-weight: 700;
  color: rgba(0,0,0,.80);
}

.swt-install-allowance__control{
  position: relative;
}

.swt-install-allowance__input,
.swt-install-allowance__select{
  width: 100%;
  min-height: 48px;
  padding: 10px 14px;
  border: 1px solid rgba(0,0,0,.14);
  border-radius: 14px;
  background: #fff;
  font-size: 16px;
  outline: none;
}

.swt-install-allowance__input{
  padding-right: 46px;
}

.swt-install-allowance__suffix{
  position: absolute;
  right: 14px;
  top: 50%;
  transform: translateY(-50%);
  font-weight: 800;
  color: rgba(0,0,0,.55);
  pointer-events: none;
}

.swt-install-allowance__input:focus,
.swt-install-allowance__select:focus{
  border-color: rgba(0,0,0,.28);
  box-shadow: 0 0 0 4px rgba(0,0,0,.06);
}

/* Chips vs select: show chips on desktop, fallback to select on small screens */
.swt-install-allowance__select{ display:none; }


/* ============================================================
   SWT: Mittalaskuri (Leveys / Pituus) – inputtien viimeistely
   - Tavoite: sama “teeman input” -look kuin muissa kentissä
   - Korjaa erityisesti number-inputtien oletus-UI (spinnerit, padding)
   ============================================================ */

/* Yleinen karttuva sääntö: mittalaskurin kentät ovat tuotesivun form.cart:ssa.
   Rajataan muutokset single-product -näkymään, ettei vaikuta esim. kassaan. */
.single-product .woocommerce div.product form.cart input[type="number"],
.single-product .woocommerce div.product form.cart input[type="text"],
.single-product .woocommerce div.product form.cart select{
  width: 100%;
  min-height: 48px;
  padding: 10px 14px;
  border: 1px solid rgba(0,0,0,.14);
  border-radius: 14px;
  background: #fff;
  font-size: 16px;
  line-height: 1.2;
  outline: none;
  box-sizing: border-box;
}

.single-product .woocommerce div.product form.cart input[type="number"]:focus,
.single-product .woocommerce div.product form.cart input[type="text"]:focus,
.single-product .woocommerce div.product form.cart select:focus{
  border-color: rgba(0,0,0,.28);
  box-shadow: 0 0 0 4px rgba(0,0,0,.06);
}

/* Poista number-kenttien selaimen oletusspinnerit (jättää silti mahdollisuuden
   syöttää arvo nuolinäppäimillä). */
.single-product .woocommerce div.product form.cart input[type="number"]{
  -moz-appearance: textfield;
}
.single-product .woocommerce div.product form.cart input[type="number"]::-webkit-outer-spin-button,
.single-product .woocommerce div.product form.cart input[type="number"]::-webkit-inner-spin-button{
  -webkit-appearance: none;
  margin: 0;
}

/* Kun kentän perässä on yksikkö (esim. “cm”), varmistetaan ettei teksti
   mene kentän päälle. Tämä toimii, jos yksikkö on toteutettu absolutella
   elementillä (yleinen malli SWT-laskureissa). */
.single-product .woocommerce div.product form.cart .swt-measure__suffix,
.single-product .woocommerce div.product form.cart .swt-dim__suffix,
.single-product .woocommerce div.product form.cart .swt-measure__unit{
  font-weight: 800;
  color: rgba(0,0,0,.55);
}

/* Jos SWT käyttää input-wrapperia, annetaan tilaa oikeaan reunaan. */
.single-product .woocommerce div.product form.cart .swt-measure__control input[type="number"],
.single-product .woocommerce div.product form.cart .swt-dim__control input[type="number"],
.single-product .woocommerce div.product form.cart .swt-measure__control input[type="text"],
.single-product .woocommerce div.product form.cart .swt-dim__control input[type="text"]{
  padding-right: 46px;
}

/* SWT Measure: tee Leveys/Pituus -kentistä teeman hakukentän / määräkentän näköiset.
   Kohdistus rajataan tuotesivulle ja SWT-measure-komponenttiin. */
.single-product .woocommerce div.product form.cart .swt-measure .swt-measure__control{
  position: relative;
  display: flex;
  align-items: center;
}

.single-product .woocommerce div.product form.cart .swt-measure input.swt-measure__input{
  width: 100%;
  height: 48px;
  padding: 10px 56px 10px 14px; /* tilaa "cm" badge:lle */
  border: 1px solid rgba(0,0,0,.14);
  border-radius: 14px;
  background: #fff;
  color: inherit;
  font-size: 16px;
  line-height: 1.2;
  box-shadow: 0 1px 0 rgba(0,0,0,.02);
  transition: border-color .15s ease, box-shadow .15s ease, background-color .15s ease;
  appearance: textfield;
  outline: none;
  box-sizing: border-box;
}

.single-product .woocommerce div.product form.cart .swt-measure input.swt-measure__input:hover{
  border-color: rgba(0,0,0,.22);
}

.single-product .woocommerce div.product form.cart .swt-measure input.swt-measure__input:focus{
  border-color: rgba(20,90,60,.55);
  box-shadow: 0 0 0 4px rgba(20,90,60,.14);
}

.single-product .woocommerce div.product form.cart .swt-measure .swt-measure__suffix{
  position: absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-50%);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 30px;
  min-width: 34px;
  padding: 0 10px;
  border-radius: 10px;
  background: rgba(0,0,0,.06);
  color: rgba(0,0,0,.65);
  font-size: 14px;
  pointer-events: none;
  font-weight: 800;
}

/* Poista number-spinnit SWT-mittakentistä (Chrome/Safari/Edge) */
.single-product .woocommerce div.product form.cart .swt-measure input.swt-measure__input::-webkit-outer-spin-button,
.single-product .woocommerce div.product form.cart .swt-measure input.swt-measure__input::-webkit-inner-spin-button{
  -webkit-appearance: none;
  margin: 0;
}

/* Firefox */
.single-product .woocommerce div.product form.cart .swt-measure input.swt-measure__input[type="number"]{
  -moz-appearance: textfield;
}

@media (max-width: 600px){
  .single-product .woocommerce div.product form.cart .swt-measure input.swt-measure__input{ height: 46px; }
}

/* =========================
   SWT Carousels – make product cards identical outside .woocommerce context
   ========================= */

/*
  NOTE: The carousel can render outside the .woocommerce wrapper, and some pages apply
  global link underlines. Ensure carousel cards match the normal listing cards.
*/

/* Remove underlines inside carousel cards (title/price/button text). */
.swt-carousel ul.products li.product a,
.swt-carousel ul.products li.product a:hover,
.swt-carousel ul.products li.product a:focus,
.swt-carousel ul.products li.product .woocommerce-loop-product__title,
.swt-carousel ul.products li.product .sakkinen-priceblock,
.swt-carousel ul.products li.product .sakkinen-priceblock *{
  text-decoration: none !important;
}

/* Make sure links don't override the card typography color. */
.swt-carousel ul.products li.product a{ color: inherit; }

/* In some contexts the product link wraps more elements (or global link styles underline).
   Force carousel cards to look like our normal listing cards (no underlines, balanced type). */
.swt-carousel ul.products li.product a,
.swt-carousel ul.products li.product a *{
  text-decoration: none !important;
}

/* Card surface */
.swt-carousel ul.products li.product{
  /* Match page background so rounded corners don't show a different "tile" color. */
  background: var(--bg);
  border:1px solid rgba(20,20,20,.06);
  border-radius:24px;
  --swt-card-pad:18px;
  /*
   * Keep padding off the card wrapper so the thumbnail can truly fill
   * edge-to-edge. We'll apply padding to the content elements instead.
   */
  padding:0;
  /* No permanent shadow – add depth only on hover (desktop). */
  box-shadow: none;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
  display:flex;
  flex-direction:column;
  position:relative;
  overflow:hidden;
}

/* Hover depth only on desktop-like pointers */
@media (hover:hover) and (pointer:fine){
  .swt-carousel ul.products li.product:hover{
    transform: translateY(-3px);
    box-shadow: 0 16px 44px rgba(15, 20, 18, .14);
    border-color: rgba(20,20,20,.10);
  }
}

/* Image */
.swt-carousel ul.products li.product > a.woocommerce-LoopProduct-link{
  display:block;
  width:100%;
  margin:0;
  padding:0;
}
.swt-carousel ul.products li.product > a.woocommerce-LoopProduct-link img{
  display:block;
  width: 100%;
  margin: 0 0 12px 0;
  border-radius:24px 24px 0 0;
  /* Keep thumbnails from becoming too tall; allow per-carousel override via CSS var. */
  height: var(--swt-card-max-h, 300px);
  object-fit: cover;
  background: #f5f5f5;
}

/*
 * WC often wraps title + price inside the same product link. Add consistent
 * horizontal padding to text elements even when they're inside the <a>.
 */
.swt-carousel ul.products li.product a.woocommerce-LoopProduct-link .woocommerce-loop-product__title,
.swt-carousel ul.products li.product a.woocommerce-LoopProduct-link .price,
.swt-carousel ul.products li.product a.woocommerce-LoopProduct-link .sakkinen-priceblock{
  padding-left: var(--swt-card-pad);
  padding-right: var(--swt-card-pad);
}

.swt-carousel ul.products li.product a.woocommerce-LoopProduct-link .price,
.swt-carousel ul.products li.product a.woocommerce-LoopProduct-link .sakkinen-priceblock{
  display:block;
}

/* Apply internal padding to content (everything except the thumbnail link) */
.swt-carousel ul.products li.product > :not(a.woocommerce-LoopProduct-link):not(.button):not(.add_to_cart_button){
  padding-left: var(--swt-card-pad);
  padding-right: var(--swt-card-pad);
}

/* Woo sale badge – place on top of the image */
.swt-carousel ul.products li.product span.onsale{
  position:absolute;
  top:12px;
  left:12px;
  z-index:3;
  padding:8px 10px;
  border-radius:12px;
  background: rgba(20,90,58,.95);
  color:#fff;
  font-weight:900;
  font-size:13px;
  line-height:1;
  letter-spacing:-0.1px;
}

/* Title */
.swt-carousel ul.products li.product .woocommerce-loop-product__title{
  margin:10px 0 0;
  font-size:16px;
  font-weight:800;
  line-height:1.22;
  letter-spacing:-0.2px;
  color:#111;
  display:-webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow:hidden;
  min-height: calc(1.22em * 2);
}

/* Price (Units module uses .sakkinen-priceblock) – keep it readable, not oversized. */
.swt-carousel .sakkinen-priceblock{margin-top:8px;margin-bottom:12px}
.swt-carousel .sakkinen-priceblock__primary{
  font-size:20px;
  line-height:1.15;
  font-weight:900;
  letter-spacing:-0.2px;
}

/* Sale price formatting (del/ins) for both Woo and Units price blocks */
.swt-carousel ul.products li.product .price del,
.swt-carousel .sakkinen-priceblock__primary del{
  opacity:.55;
  font-weight:800;
  text-decoration: line-through;
  margin-right:6px;
}
.swt-carousel ul.products li.product .price ins,
.swt-carousel .sakkinen-priceblock__primary ins{
  text-decoration:none;
  font-weight:950;
}
.swt-carousel .sakkinen-priceblock__unit{
  margin-left:4px;
  font-weight:850;
  font-size:.95em;
  opacity:.9;
}

/* CTA button */
.swt-carousel ul.products li.product .button,
.swt-carousel ul.products li.product .add_to_cart_button{
  width:auto;
  align-self:stretch;
  max-width:100%;
  min-height:54px;
  border-radius:18px;
  font-weight:850;
  font-size:16px;
  letter-spacing:-0.1px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  border:2px solid rgba(17,17,17,.12);
  margin: auto var(--swt-card-pad) var(--swt-card-pad);
  box-sizing:border-box;
}

.swt-carousel ul.products li.product .button:focus,
.swt-carousel ul.products li.product .add_to_cart_button:focus{
  outline: none;
  box-shadow: 0 0 0 4px rgba(20, 120, 90, .18);
}

@media (max-width: 680px){
  .swt-carousel ul.products li.product{--swt-card-pad:16px;padding:0;border-radius:22px}
  .swt-carousel ul.products li.product a img{border-radius:22px 22px 0 0;height: var(--swt-card-max-h, 260px);}
  .swt-carousel ul.products li.product .woocommerce-loop-product__title{font-size:17px}
  .swt-carousel ul.products li.product .button,
  .swt-carousel ul.products li.product .add_to_cart_button{min-height:54px}
}

.swt-install-allowance__chips{
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 10px;
}

.swt-install-allowance__chip{
  appearance: none;
  border: 1px solid rgba(0,0,0,.14);
  background: #fff;
  border-radius: 999px;
  padding: 9px 12px;
  font-weight: 800;
  font-size: 14px;
  line-height: 1;
  cursor: pointer;
  transition: transform .08s ease, box-shadow .12s ease, border-color .12s ease, background .12s ease;
}

.swt-install-allowance__chip:hover{
  border-color: rgba(0,0,0,.24);
  box-shadow: 0 8px 18px rgba(0,0,0,.08);
  transform: translateY(-1px);
}

.swt-install-allowance__chip.is-active{
  border-color: rgba(20,90,58,.65);
  background: rgba(20,90,58,.10);
}

.swt-install-allowance__chip:focus-visible{
  outline: none;
  box-shadow: 0 0 0 4px rgba(0,0,0,.08);
}

@media (max-width: 520px){
  .swt-install-allowance__select{ display:block; }
  .swt-install-allowance__chips{ display:none; }
}

.swt-install-allowance__result{
  margin-top: 14px;
  padding: 12px 14px;
  border-radius: 14px;
  border: 1px solid rgba(0,0,0,.10);
  background: rgba(0,0,0,.03);
}

.swt-install-allowance__result-line{
  display: flex;
  align-items: baseline;
  gap: 8px;
}

.swt-install-allowance__packs{
  font-size: 22px;
  font-weight: 900;
}

/* -------------------------------------------------------------
   WooCommerce — Single product layout (tighter + containerized)
-------------------------------------------------------------- */

body.single-product.woocommerce .woocommerce-notices-wrapper,
body.single-product.woocommerce div.product{
  max-width: var(--content);
  margin-left: auto;
  margin-right: auto;
  padding-left: 16px;
  padding-right: 16px;
}

body.single-product.woocommerce div.product{ margin-top: 18px; margin-bottom: 34px; }

.swt-install-allowance__result-text,
.swt-install-allowance__result-sub{
  color: rgba(0,0,0,.70);
}

.swt-install-allowance__result-sub{
  margin-top: 4px;
  font-size: 13px;
}

/* SWT + Woo single product: quantity + add-to-cart polish */
/*
   Single product (above-the-fold) – visual hierarchy
   - Make the purchase area feel like a deliberate “buy card”
   - Keep WooCommerce markup intact (CSS-only)
*/
body.single-product .woocommerce div.product .summary{
  background: transparent;
  border: 0;
  border-radius: 0;
  padding: 0;
  box-shadow: none;
  backdrop-filter: none;
}

body.single-product .woocommerce div.product .summary .price{
  font-weight: 900;
  letter-spacing: -0.01em;
  font-size: clamp(26px, 2.2vw, 34px);
  color: var(--text);
}

/* Make sure amounts inside price also carry strong weight */
body.single-product .woocommerce div.product .summary .price .woocommerce-Price-amount{
  font-weight: 900;
}

/* Improve sale price readability (keep hierarchy clear) */
body.single-product .woocommerce div.product .summary .price del{
  opacity: .55;
  font-weight: 750;
}
body.single-product .woocommerce div.product .summary .price ins{
  text-decoration: none;
}

body.single-product .woocommerce div.product .product_meta{
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px solid rgba(0,0,0,.08);
  color: rgba(0,0,0,.68);
  font-size: 14px;
}

body.single-product .woocommerce div.product .woocommerce-product-details__short-description{
  color: rgba(0,0,0,.78);
}

/* =========================
   Single product summary cards (price + excerpt)
   ========================= */
body.single-product .summary.entry-summary .sakkinen-price-card,
body.single-product .summary.entry-summary .sakkinen-excerpt-card{
  background: #fff;
  border: 1px solid rgba(16, 24, 40, .12);
  border-radius: 22px;
  padding: 16px 18px;
  box-shadow: 0 12px 30px rgba(16, 24, 40, .06);
}

body.single-product .summary.entry-summary .sakkinen-price-card{
  display: flex;
  flex-direction: column;
  gap: 6px;
}

body.single-product .summary.entry-summary .sakkinen-excerpt-card{
  margin-top: 16px;
}

@media (max-width: 640px){
  body.single-product .summary.entry-summary .sakkinen-price-card,
  body.single-product .summary.entry-summary .sakkinen-excerpt-card{
    padding: 14px 16px;
    border-radius: 18px;
  }
}

body.single-product .summary.entry-summary .sakkinen-price-card .price{
  margin: 0;
  display: flex;
  align-items: baseline;
  gap: 8px;
}

body.single-product .summary.entry-summary .sakkinen-excerpt-card .woocommerce-product-details__short-description{
  margin: 0;
}

body.single-product .summary.entry-summary .sakkinen-price-card .price .woocommerce-Price-amount{
  font-size: clamp(32px, 4vw, 52px);
  font-weight: 800;
  line-height: 1.05;
}

body.single-product .summary.entry-summary .sakkinen-price-card .price :is(.price-unit, .unit, .woocommerce-price-suffix){
  font-size: 14px;
  font-weight: 600;
  color: rgba(0,0,0,.6);
}

body.single-product .summary.entry-summary .sakkinen-price-card .sakkinen-packinfo,
body.single-product .summary.entry-summary .sakkinen-price-card [data-pack-summary]{
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 12px;
  margin-top: 6px;
  padding-top: 10px;
  border-top: 1px solid rgba(16, 24, 40, .1);
  font-size: 15px;
  font-weight: 700;
  color: rgba(0,0,0,.65);
}

body.single-product .summary.entry-summary .sakkinen-price-card :is(.sakkinen-packinfo, [data-pack-summary]):empty{
  display: none;
}

/* Prevent nested “card fragments” inside price/excerpt cards */
body.single-product .summary.entry-summary :is(.sakkinen-price-card, .sakkinen-excerpt-card) :is([class*="card"], [class*="box"], [class*="panel"]){
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
}

body.single-product .woocommerce div.product form.cart{
  /* Keep qty + button on the same row; SWT blocks span full width. */
  display:grid;
  grid-template-columns: minmax(96px, 120px) 1fr;
  gap: 14px;
  align-items: end;
  width:100%;
  max-width:none;
  padding-left:0;
  padding-right:0;
}

body.single-product .woocommerce div.product form.cart :where(.swt-block, [data-swt-block], .swt-measure){
  grid-column: 1 / -1;
}

body.single-product .woocommerce div.product form.cart .quantity{
  grid-column: 1;
  margin: 0;
}

body.single-product .woocommerce div.product form.cart .single_add_to_cart_button{
  grid-column: 2;
  margin: 0;
}

body.single-product .woocommerce div.product .summary.entry-summary .sakkinen-purchase-card form.cart{
  display: grid !important;
  grid-template-columns: minmax(96px, 120px) 1fr !important;
  grid-template-areas:
    "blocks blocks"
    "qty    button";
  gap: 14px !important;
  align-items: end !important;
}

body.single-product .woocommerce div.product .summary.entry-summary .sakkinen-purchase-card form.cart > .swt-block,
body.single-product .woocommerce div.product .summary.entry-summary .sakkinen-purchase-card form.cart > .sakkinen-swt-wrap,
body.single-product .woocommerce div.product .summary.entry-summary .sakkinen-purchase-card form.cart > .woocommerce-variation-add-to-cart{
  grid-area: blocks !important;
  width: 100%;
}

body.single-product .woocommerce div.product .summary.entry-summary .sakkinen-purchase-card form.cart > .woocommerce-variation-add-to-cart{
  display: contents;
}

body.single-product .woocommerce div.product .summary.entry-summary .sakkinen-purchase-card form.cart .quantity{
  grid-area: qty !important;
}

body.single-product .woocommerce div.product .summary.entry-summary .sakkinen-purchase-card form.cart .single_add_to_cart_button{
  grid-area: button !important;
}

body.single-product .woocommerce div.product .summary.entry-summary .sakkinen-purchase-card form.cart::before{
  content: none !important;
  display: none !important;
}

/* Ensure summary column does not right-align embedded purchase UI blocks on wide screens */
@media (min-width: 992px){
  body.single-product .woocommerce div.product div.summary{
    display:flex;
    flex-direction:column;
    align-items:stretch;
  }
}

/* SWT blocks shifted when wrappers differed; .swt-block is the stable contract selector. */
@media (min-width: 992px){
  .single-product .summary.entry-summary .swt-block,
  .single-product .summary.entry-summary .sakkinen-swt-wrap--units,
  .single-product .summary.entry-summary .sakkinen-swt-wrap--measure,
  .single-product .summary.entry-summary .sakkinen-swt-wrap--install-allowance{
    width:100%;
    max-width:100%;
    box-sizing:border-box;
    align-self:stretch;
    margin-left:0;
    margin-right:0;
  }
}

.woocommerce div.product form.cart .swt-install-allowance{
  margin: 0 0 18px 0;
}

.woocommerce div.product form.cart .quantity{
  display:inline-block;
  vertical-align:middle;
  margin: 0 14px 0 0;
}

.woocommerce div.product form.cart .single_add_to_cart_button{
  display:inline-block;
  vertical-align:middle;
}
body.single-product .woocommerce div.product form.cart > .swt-install-allowance{
  /* Full-width card aligned with other summary content */
  width:100%;
  box-sizing:border-box;
  flex:1 0 100%;
  margin-left:0 !important;
  margin-right:0 !important;
  margin-bottom:12px;
}

body.single-product .woocommerce div.product form.cart .quantity{
  flex:0 0 96px;
  margin:0;
  display:flex;
}
body.single-product .woocommerce div.product form.cart .quantity .qty{
  width:100%;
  min-height:64px;
  padding:14px 16px;
  border:1px solid rgba(0,0,0,.12);
  border-radius:18px;
  background:#fff;
  font-size:18px;
  font-weight:800;
  text-align:center;
  line-height:1;
  -webkit-appearance:none;
  appearance:none;
}

/* WooCommerce antaa määräkentälle usein .input-text -tyylit -> varmistetaan viimeistely */
body.single-product .woocommerce div.product form.cart .quantity input.input-text.qty.text{
  min-height:64px !important;
  padding:14px 16px !important;
  border-radius:18px !important;
}
body.single-product .woocommerce div.product form.cart .quantity .qty:focus{
  outline:none;
  border-color:rgba(0,0,0,.28);
  box-shadow:0 0 0 4px rgba(0,0,0,.06);
}

body.single-product .woocommerce div.product form.cart .single_add_to_cart_button{
  flex:1 1 260px;
  min-height:56px;
  border-radius:16px;
  padding:0 22px;
  font-size:18px;
  font-weight:800;
}

@media (max-width: 520px){
  body.single-product .woocommerce div.product form.cart{gap:12px;}
  body.single-product .woocommerce div.product form.cart .quantity{flex:1 1 120px;}
  body.single-product .woocommerce div.product form.cart .single_add_to_cart_button{flex:1 0 100%; width:100%;}
}

/* --- WooCommerce: quantity input (pack count) – hard override for theme consistency --- */
.woocommerce div.product form.cart .quantity .qty,
.woocommerce div.product form.cart .quantity input.qty,
.woocommerce .quantity .qty{
  /* Match SWT input visual language (48px, 14px radius, 10/14 padding) */
  min-height:48px !important;
  height:48px !important;
  padding:10px 14px !important;
  border:1px solid rgba(0,0,0,.12) !important;
  border-radius:14px !important;
  background:#fff !important;
  font-size:16px !important;
  font-weight:700 !important;
  line-height:1.2 !important;
  text-align:center !important;
  width:120px !important;
  max-width:100% !important;
  box-shadow:none !important;
}

.woocommerce div.product form.cart .quantity .qty:focus,
.woocommerce div.product form.cart .quantity input.qty:focus,
.woocommerce .quantity .qty:focus{
  border-color: rgba(0,0,0,.28) !important;
  box-shadow: 0 0 0 4px rgba(0,0,0,.06) !important;
  outline: none !important;
}

/* Quantity: keep native number spinners (users often adjust packs via arrows) */
.woocommerce div.product form.cart .quantity .qty{
  -webkit-appearance: auto;
  appearance: auto;
  -moz-appearance: number-input;
}
.woocommerce div.product form.cart .quantity .qty::-webkit-outer-spin-button,
.woocommerce div.product form.cart .quantity .qty::-webkit-inner-spin-button{
  -webkit-appearance: inner-spin-button;
  opacity: 1;
}

.woocommerce div.product form.cart .quantity .qty:focus,
.woocommerce div.product form.cart .quantity input.qty:focus{
  outline:none !important;
  border-color:rgba(0,0,0,.28) !important;
  box-shadow:0 0 0 4px rgba(0,0,0,.06) !important;
}

/* Single product add-to-cart layout (quantity + button aligned; SWT card full width) */
.woocommerce div.product form.cart{
  display:grid;
  /* Keep quantity (m²) + add-to-cart on the same row on all breakpoints.
     First column stays compact; button fills the remaining space. */
  grid-template-columns: minmax(96px, 120px) 1fr;
  gap: 14px;
  align-items: end;
}

/*
 * IMPORTANT:
 * SWT Units/Measure UI is injected inside the add-to-cart form.
 * When the form uses a 2-column grid, injected blocks must span full width,
 * otherwise they land in the first column and appear "indented".
 */
.woocommerce div.product form.cart :where(.swt-block, [data-swt-block]){
  grid-column: 1 / -1;
  justify-self: stretch;
  margin: 0;
}

/* Quantity + button align on the same row */
.woocommerce div.product form.cart .quantity{
  grid-column: 1;
  margin: 0;
}

.woocommerce div.product form.cart .single_add_to_cart_button{
  grid-column: 2;
  width: 100%;
}

/* No stacking breakpoint: user requirement is to keep m² + button always on the same row. */

.woocommerce div.product form.cart .single_add_to_cart_button{
  min-height:56px;
  border-radius:16px;
  padding:0 22px;
}

/* ------------------------------------------------------------
   Single product tabs (Kuvaus / Lisätiedot / Dokumentit)
   - Improve hierarchy and scanability
   - Keep WooCommerce markup intact (CSS-only)
------------------------------------------------------------ */

.woocommerce div.product .woocommerce-tabs{
  margin-top: 28px;
}

/* Tabs bar */
.woocommerce div.product .woocommerce-tabs ul.tabs{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  border-bottom:1px solid rgba(0,0,0,.12);
  padding:0 0 12px 0;
  margin:0 0 18px 0;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li{
  background: rgba(0,0,0,.04);
  border: 1px solid rgba(0,0,0,.10);
  border-bottom: none;
  border-radius: 14px 14px 0 0;
  padding: 0;
  margin: 0;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li a{
  display:inline-block;
  padding: 12px 18px;
  font-weight: 700;
  color: #2b2b2b;
  text-decoration:none;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li.active{
  background: #fff;
  border-color: rgba(0,0,0,.14);
}

.woocommerce div.product .woocommerce-tabs ul.tabs li.active a{
  color:#121212;
}

/* Panels container */
.woocommerce div.product .woocommerce-tabs .woocommerce-Tabs-panel{
  background:#fff;
  border:1px solid rgba(0,0,0,.10);
  border-radius: 18px;
  padding: 26px 26px;
  box-shadow: 0 10px 26px rgba(0,0,0,.06);
}

/* Typography */
.woocommerce div.product .woocommerce-tabs .woocommerce-Tabs-panel{
  line-height: 1.7;
  font-size: 17px;
}

.woocommerce div.product .woocommerce-tabs .woocommerce-Tabs-panel h2,
.woocommerce div.product .woocommerce-tabs .woocommerce-Tabs-panel h3{
  margin-top: 0;
  margin-bottom: 14px;
  font-size: 28px;
  letter-spacing: -0.01em;
}

.woocommerce div.product .woocommerce-tabs .woocommerce-Tabs-panel p{
  margin: 0 0 14px 0;
}

/* Additional information table */
.woocommerce table.shop_attributes{
  border: 1px solid rgba(0,0,0,.10);
  border-radius: 14px;
  overflow:hidden;
}

.woocommerce table.shop_attributes th,
.woocommerce table.shop_attributes td{
  padding: 12px 14px;
  border-bottom: 1px solid rgba(0,0,0,.08);
}

.woocommerce table.shop_attributes tr:last-child th,
.woocommerce table.shop_attributes tr:last-child td{
  border-bottom:none;
}

.woocommerce table.shop_attributes th{
  background: rgba(0,0,0,.03);
  font-weight: 700;
  width: 36%;
}

/* Documents tab (Säkkinen Tuotedokumentit) */
.woocommerce .sakkinen-docs{margin-top:6px;}

/* Frontend tab output (Säkkinen Woo Tools) */
.woocommerce .sakkinen-docs-frontend h3{
  margin: 18px 0 12px;
  font-size: 18px;
  font-weight: 900;
  letter-spacing: -0.01em;
}

.woocommerce .sakkinen-docs-frontend h3:first-child{margin-top:0;}

.woocommerce .sakkinen-docs-frontend .sakkinen-docs-ul{
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 10px;
}

.woocommerce .sakkinen-docs-frontend .sakkinen-docs-ul li{margin:0;}

.woocommerce .sakkinen-docs-frontend .sakkinen-docs-ul a{
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 14px;
  border-radius: 14px;
  border: 1px solid rgba(0,0,0,.10);
  background: rgba(0,0,0,.02);
  text-decoration: none;
  font-weight: 800;
}

.woocommerce .sakkinen-docs-frontend .sakkinen-docs-ul a:hover{
  background: rgba(0,0,0,.04);
  border-color: rgba(0,0,0,.18);
  box-shadow: 0 10px 22px rgba(0,0,0,.06);
  transform: translateY(-1px);
}

.woocommerce .sakkinen-docs-frontend .sakkinen-docs-ul a::before{
  content: "PDF";
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 44px;
  height: 28px;
  border-radius: 999px;
  background: rgba(0,0,0,.06);
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .06em;
}

/* Make the whole tabs area feel more "designed" and easier to scan */
.woocommerce div.product .woocommerce-tabs{
  margin-top: 34px;
  margin-bottom: 34px;
}

/* ---------------------------------------------------------
   Single product: text area clarity (clean, readable, myyvä)
   - Keep layout stable, but make the content easier to scan.
---------------------------------------------------------- */

/* Ensure typography is consistent also inside Woo tables */
.woocommerce table,
.woocommerce table th,
.woocommerce table td{
  font-family: inherit;
}

/* Turn each panel into a calm, readable section (not a "floating card") */
.woocommerce div.product .woocommerce-tabs .woocommerce-Tabs-panel{
  background: rgba(255,255,255,.70);
  border: 1px solid rgba(31,35,40,.10);
  border-radius: 22px;
  padding: 28px 30px;
  box-shadow: 0 12px 26px rgba(0,0,0,.04);
}

/* Add breathing room between panels when tabs are stacked */
.woocommerce div.product .woocommerce-tabs .woocommerce-Tabs-panel + .woocommerce-Tabs-panel{
  margin-top: 18px;
}

/* Headings: consistent rhythm + stronger hierarchy */
.woocommerce div.product .woocommerce-tabs .woocommerce-Tabs-panel h2{
  font-size: 26px;
  line-height: 1.25;
  margin: 0 0 14px 0;
}
.woocommerce div.product .woocommerce-tabs .woocommerce-Tabs-panel h3{
  font-size: 20px;
  line-height: 1.25;
  margin: 22px 0 10px 0;
}

/* Lists: cleaner bullets + spacing */
.woocommerce div.product .woocommerce-tabs .woocommerce-Tabs-panel ul,
.woocommerce div.product .woocommerce-tabs .woocommerce-Tabs-panel ol{
  margin: 0 0 18px 0;
  padding-left: 18px;
}
.woocommerce div.product .woocommerce-tabs .woocommerce-Tabs-panel li{
  margin: 0 0 8px 0;
}

/* Attributes table: less "Woo default", more premium */
.woocommerce table.shop_attributes{
  border-collapse: separate;
  border-spacing: 0;
  width: 100%;
  overflow: hidden;
  border-radius: 16px;
  border: 1px solid rgba(31,35,40,.10);
  background: rgba(255,255,255,.55);
}
.woocommerce table.shop_attributes th,
.woocommerce table.shop_attributes td{
  padding: 12px 14px;
  border-top: 1px solid rgba(31,35,40,.08);
  vertical-align: top;
}
.woocommerce table.shop_attributes tr:first-child th,
.woocommerce table.shop_attributes tr:first-child td{
  border-top: none;
}
.woocommerce table.shop_attributes th{
  width: 34%;
  color: var(--muted);
  font-weight: 800;
}
.woocommerce table.shop_attributes td{
  font-weight: 650;
}

/* Reading width for long product descriptions */
.woocommerce div.product .woocommerce-tabs .woocommerce-Tabs-panel > *{
  max-width: 86ch;
}

.woocommerce div.product .woocommerce-tabs .woocommerce-Tabs-panel > *{
  margin-left: 0;
  margin-right: auto;
}

.woocommerce div.product .woocommerce-tabs .woocommerce-Tabs-panel{
  font-size: 17px;
  line-height: 1.75;
}

.woocommerce div.product .woocommerce-tabs .woocommerce-Tabs-panel h2{
  letter-spacing: -0.015em;
}

/* Slightly more structured paragraph rhythm */
.woocommerce div.product .woocommerce-tabs .woocommerce-Tabs-panel p{
  margin: 0 0 16px 0;
}

.woocommerce div.product .woocommerce-tabs .woocommerce-Tabs-panel p:last-child{
  margin-bottom: 0;
}

/* Better separation from footer (prevents the section from feeling "lost") */
.woocommerce div.product .woocommerce-tabs + .related,
.woocommerce div.product .woocommerce-tabs + .up-sells{
  margin-top: 26px;
}

/* Mobile tuning */
@media (max-width: 640px){
  .woocommerce div.product .woocommerce-tabs .woocommerce-Tabs-panel{
    padding: 18px 16px;
    border-radius: 16px;
    font-size: 16px;
  }
  .woocommerce div.product .woocommerce-tabs .woocommerce-Tabs-panel h2,
  .woocommerce div.product .woocommerce-tabs .woocommerce-Tabs-panel h3{
    font-size: 24px;
  }
  .woocommerce div.product .woocommerce-tabs ul.tabs li a{
    padding: 10px 14px;
  }
}

/* =========================================================
   Footer – myyvä ja selkeä (fallback sisällöt, jos widgetit puuttuvat)
   ========================================================= */

.site-footer{
  margin-top: 56px;
  border-top: 1px solid rgba(0,0,0,.08);
  background: #fff;
}

.site-footer .footer-top{
  padding: 54px 0 34px;
}

.site-footer .footer-grid{
  display: grid;
  grid-template-columns: 1.2fr 1fr 1fr 1fr;
  gap: 34px;
  align-items: start;
}

.site-footer .footer-brand strong,
.site-footer .footer-brand a{
  font-size: 20px;
  font-weight: 800;
  letter-spacing: -0.02em;
  color: #1f2328;
  text-decoration: none;
}

.site-footer .footer-tagline{
  margin: 12px 0 16px;
  color: rgba(0,0,0,.72);
  line-height: 1.55;
  max-width: 42ch;
}

.site-footer .footer-badges{
  display: grid;
  gap: 10px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.site-footer .footer-badge{
  display: flex;
  gap: 10px;
  align-items: flex-start;
  padding: 10px 12px;
  border: 1px solid rgba(0,0,0,.10);
  border-radius: 14px;
  background: #fff;
}

.site-footer .footer-badge__icon{
  width: 18px;
  height: 18px;
  flex: 0 0 auto;
  margin-top: 2px;
  color: rgba(0,0,0,.70);
}

.site-footer .footer-badge__title{
  font-weight: 750;
  color: #1f2328;
  margin: 0;
}

.site-footer .footer-badge__text{
  margin: 2px 0 0;
  color: rgba(0,0,0,.68);
  font-size: 15px;
  line-height: 1.45;
}

.site-footer .footer-title{
  font-size: 16px;
  font-weight: 800;
  color: #1f2328;
  margin: 0 0 12px;
}

.site-footer .footer-links,
.site-footer .footer-contact{
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 10px;
}

.site-footer .footer-links a{
  color: rgba(0,0,0,.78);
  text-decoration: none;
  font-weight: 600;
}

.site-footer .footer-links a:hover{
  text-decoration: underline;
}

.site-footer .footer-contact li{
  color: rgba(0,0,0,.72);
  line-height: 1.45;
  display: flex;
  gap: 10px;
  align-items: flex-start;
}

.site-footer .footer-contact__icon{
  width: 18px;
  height: 18px;
  flex: 0 0 auto;
  margin-top: 2px;
  color: rgba(0,0,0,.68);
}

.site-footer .footer-contact a{
  color: rgba(0,0,0,.78);
  text-decoration: none;
  font-weight: 650;
}

.site-footer .footer-contact a:hover{ text-decoration: underline; }

.site-footer .footer-help{
  margin-top: 14px;
  padding: 14px 14px;
  border: 1px solid rgba(0,0,0,.10);
  border-radius: 16px;
  background: rgba(0,0,0,.02);
}

.site-footer .footer-help__title{
  margin: 0 0 6px;
  font-weight: 800;
}

.site-footer .footer-help__text{
  margin: 0;
  color: rgba(0,0,0,.70);
  font-size: 15px;
}

.site-footer .footer-bottom{
  padding: 18px 0;
  border-top: 1px solid rgba(0,0,0,.08);
}

.site-footer .footer-bottom__inner{
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
}

.site-footer .footer-bottom__copyright,
.site-footer .footer-bottom__small{
  color: rgba(0,0,0,.58);
  font-size: 14px;
}

.site-footer .footer-bottom__small{
  display: flex;
  gap: 12px;
  align-items: center;
}

.site-footer .footer-bottom__small a{
  color: rgba(0,0,0,.65);
  text-decoration: none;
  font-weight: 650;
}

.site-footer .footer-bottom__small a:hover{
  text-decoration: underline;
}

@media (max-width: 980px){
  .site-footer .footer-grid{
    grid-template-columns: 1fr 1fr;
    gap: 26px;
  }
}

@media (max-width: 640px){
  .site-footer .footer-top{ padding: 40px 0 26px; }
  .site-footer .footer-grid{ grid-template-columns: 1fr; }
  .site-footer .footer-tagline{ max-width: none; }
}

/* ------------------------------------------------------------
   Product bottom content (editable snippet: slug "product-footer")
------------------------------------------------------------- */
.sakkinen-product-bottom,
.sakkinen-page-footer-snippet{
  margin-top: 44px;
  padding: 28px;
  border-radius: 22px;
  background: rgba(255,255,255,.65);
  border: 1px solid rgba(0,0,0,.08);
  box-shadow: 0 14px 42px rgba(0,0,0,.06);
}

.sakkinen-product-bottom > *:first-child,
.sakkinen-page-footer-snippet > *:first-child{ margin-top: 0; }
.sakkinen-product-bottom > *:last-child,
.sakkinen-page-footer-snippet > *:last-child{ margin-bottom: 0; }

.sakkinen-product-bottom h2,
.sakkinen-product-bottom h3,
.sakkinen-page-footer-snippet h2,
.sakkinen-page-footer-snippet h3{
  margin: 0 0 14px;
  letter-spacing: -0.02em;
}

.sakkinen-product-bottom p,
.sakkinen-page-footer-snippet p{
  line-height: 1.75;
  color: rgba(0,0,0,.78);
}

.sakkinen-product-bottom a{
  font-weight: 650;
  text-decoration: none;
}

.sakkinen-product-bottom a:hover{
  text-decoration: underline;
}

.sakkinen-product-bottom ul,
.sakkinen-page-footer-snippet ul{
  margin: 10px 0 0;
  padding-left: 18px;
}

.sakkinen-product-bottom li,
.sakkinen-page-footer-snippet li{
  margin: 8px 0;
}

@media (max-width: 780px){
  .sakkinen-product-bottom,
  .sakkinen-page-footer-snippet{
    padding: 20px;
    border-radius: 18px;
    margin-top: 34px;
  }
}

/* =========================
   v1.0.63 price readability fixes
   - Related/upsell product card prices must not overlap titles
   - Single product main price must be prominent and dark
   ========================= */

/* Product grid cards (incl. "Tutustu myös" / related products) */
.woocommerce ul.products li.product .sakkinen-priceblock{
  margin-top: 10px;
  margin-bottom: 14px;
}

.woocommerce ul.products li.product .sakkinen-priceblock__primary{
  font-size: 22px !important; /* avoid responsive oversizing */
  line-height: 1.15;
  color: #121417;
  font-weight: 900;
}

.woocommerce ul.products li.product .sakkinen-priceblock__unit{
  font-size: 14px !important;
  color: rgba(18,20,23,.82);
  font-weight: 850;
}

/* Ensure title and price stack cleanly */
.woocommerce ul.products li.product .woocommerce-loop-product__title{
  position: relative;
  z-index: 1;
  margin-bottom: 6px;
}

/* Single product: make the main unit price (/ m² etc.) unmistakably visible */
body.single-product .woocommerce div.product .summary .price,
body.single-product .woocommerce div.product .summary p.price,
body.single-product .woocommerce div.product .summary span.price{
  /* Single product price: prominent but not oversized */
  font-size: clamp(30px, 3.2vw, 42px) !important;
  font-weight: 900 !important;
  color: var(--sakkinen-accent) !important;
  line-height: 1.05 !important;
  letter-spacing: -0.02em;
  margin: 0 0 6px 0;
}

/* Harden Woo price inner spans (some Woo styles set smaller font-size on .amount). */
body.single-product .woocommerce div.product .summary p.price .woocommerce-Price-amount,
body.single-product .woocommerce div.product .summary p.price .amount,
body.single-product .woocommerce div.product .summary p.price bdi{
  font-size: inherit !important;
  font-weight: inherit !important;
  line-height: inherit !important;
}

/* Unit suffix after the price */
body.single-product .woocommerce div.product .summary p.price .sakkinen-unit-suffix{
  font-size: .56em;
  font-weight: 800;
  color: rgba(18,20,23,.72) !important;
  margin-left: 10px;
  letter-spacing: 0;
}

body.single-product .woocommerce div.product .summary .price .sakkinen-priceblock__unit,
body.single-product .woocommerce div.product .summary .price .woocommerce-Price-currencySymbol{
  color: rgba(18,20,23,.86) !important;
}


/* =========================
   v1.0.64 single product unit price – stronger hierarchy
   Some setups (plugins/filters) output the unit price outside Woo's default .price element.
   We harden the selectors to ensure the €/m² line is always prominent.
   ========================= */
body.single-product .woocommerce div.product .summary .price,
body.single-product .woocommerce div.product .summary p.price,
body.single-product .woocommerce div.product .summary span.price,
body.single-product .woocommerce div.product .summary .sakkinen-priceblock__primary,
body.single-product .woocommerce div.product .summary .swt-unit-price,
body.single-product .woocommerce div.product .summary .sakkinen-unit-price,
body.single-product .woocommerce div.product .summary .product-price,
body.single-product .woocommerce div.product .summary .product-price__unit{
  /* Same as above, but broadened for plugin outputs */
  font-size: clamp(30px, 3.2vw, 42px) !important;
  font-weight: 900 !important;
  color: var(--sakkinen-accent) !important;
  line-height: 1.05 !important;
  letter-spacing: -0.02em;
}

body.single-product .woocommerce div.product .summary .product-price__unit{
  font-size: .56em !important;
  font-weight: 800 !important;
  color: rgba(18,20,23,.72) !important;
}

/* Theme output uses .sakkinen-unit-suffix on the single product price */
body.single-product .woocommerce div.product .summary p.price .sakkinen-unit-suffix{
  font-size: .56em !important;
  font-weight: 800 !important;
  color: rgba(18,20,23,.72) !important;
  margin-left: .35em;
  white-space: nowrap;
}

body.single-product .woocommerce div.product .summary .price .woocommerce-Price-amount,
body.single-product .woocommerce div.product .summary .sakkinen-priceblock__primary .woocommerce-Price-amount{
  font-weight: 950 !important;
}

body.single-product .woocommerce div.product .summary .price .woocommerce-Price-currencySymbol,
body.single-product .woocommerce div.product .summary .price .sakkinen-priceblock__unit,
body.single-product .woocommerce div.product .summary .sakkinen-priceblock__unit,
body.single-product .woocommerce div.product .summary .product-price__unit{
  color: rgba(18,20,23,.92) !important;
}

/* ---------------------------------------------------------------------
   Single product layout: reduce unnecessary whitespace
   --------------------------------------------------------------------- */
body.single-product .site-main{
  padding-top: 18px;
  padding-bottom: 28px;
}

body.single-product .woocommerce div.product{
  margin: 18px 0 34px;
  max-width: var(--container);
  margin-left: auto;
  margin-right: auto;
  padding-left: 16px;
  padding-right: 16px;
}

body.single-product .woocommerce div.product .product__grid,
body.single-product .woocommerce div.product .sakkinen-product{
  gap: 24px;
}

/* (Container is applied for all sizes; keep breakpoint reserved for future tweaks.) */

/* ---------------------------------------------------------------------
   Related products block (Woo blocks): make it a clean grid, not a
   narrow right-aligned carousel.
   --------------------------------------------------------------------- */
.wp-block-woocommerce-related-products{
  max-width: var(--container);
  margin: 0 auto;
  padding: 8px 16px 56px;
}

.wp-block-woocommerce-related-products .wc-block-grid__products,
.wp-block-woocommerce-related-products .wc-block-product-template{
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)) !important;
  gap: 18px !important;
  justify-content: start !important;
  align-items: stretch !important;
}

.wp-block-woocommerce-related-products .wc-block-components-product-list__container{
  width: 100% !important;
}

/* Hide slider controls when we force grid */
.wp-block-woocommerce-related-products .wc-block-components-pagination,
.wp-block-woocommerce-related-products .wc-block-components-slider__controls,
.wp-block-woocommerce-related-products .wc-block-components-slider__button{
  display: none !important;
}

.wp-block-woocommerce-related-products .wc-block-grid__product,
.wp-block-woocommerce-related-products .wc-block-components-product-list__item{
  width: auto !important;
}

.wp-block-woocommerce-related-products .wc-block-grid__product-title,
.wp-block-woocommerce-related-products .wc-block-components-product-name{
  font-size: 16px;
  line-height: 1.25;
  font-weight: 800;
}

.wp-block-woocommerce-related-products .wc-block-grid__product-price,
.wp-block-woocommerce-related-products .wc-block-components-product-price{
  font-size: 22px;
  line-height: 1.1;
  font-weight: 900;
}

.wp-block-woocommerce-related-products .wc-block-components-product-price__value,
.wp-block-woocommerce-related-products .wc-block-grid__product-price .woocommerce-Price-amount{
  font-weight: inherit;
}

/* ---------------------------------------------------------------------
   Related products (classic templates) – keep it consistent
   --------------------------------------------------------------------- */
body.single-product.woocommerce .related.products{
  max-width: var(--container);
  margin: 0 auto;
  padding: 8px 16px 56px;
  display: block; /* ensure heading sits above grid */
}

body.single-product.woocommerce .related.products > h2,
body.single-product.woocommerce .related.products > h3{
  width: 100%;
  display: block;
}

body.single-product.woocommerce .related.products > h2,
body.single-product.woocommerce .related.products > h3{
  font-size: 28px;
  line-height: 1.15;
  margin: 0 0 18px;
}

body.single-product.woocommerce .related.products ul.products{
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 18px;
  width: 100%;
  justify-content: start;
  margin: 0;
  padding: 0;
}

body.single-product.woocommerce .related.products ul.products li.product{
  width: auto;
  margin: 0;
}


/* === Megamenu: hide on mobile (megamenu is desktop-only) === */
@media (max-width: 1024px), (pointer: coarse) {
  .sakkinen-megamenu__panel {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    height: 0 !important;
    overflow: hidden !important;
    pointer-events: none !important;
  }

  button.sakkinen-megamenu__close {
    display: none !important;
  }
}

/* Also hide close button whenever panel is not in modal state */
.sakkinen-megamenu__panel[aria-hidden="true"] button.sakkinen-megamenu__close {
  display: none !important;
}


/* ==============================
   WooCommerce Blocks: Product Filters
   - Desktop: inline in sidebar (no overlay button)
   - Mobile: floating button opens overlay (bottom sheet)
   ============================== */

/* Tight cards */
.shop-sidebar__inner .wp-block-woocommerce-product-filter-taxonomy,
.shop-sidebar__inner .wp-block-woocommerce-product-filter-price,
.shop-sidebar__inner .wp-block-woocommerce-product-filter-attribute,
.shop-sidebar__inner .wp-block-woocommerce-product-filter-status,
.shop-sidebar__inner .wp-block-woocommerce-product-filter-active{
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 12px;
  background: #fff;
  padding: 10px;
  margin: 0 0 10px;
  box-shadow: 0 4px 14px rgba(0,0,0,.04);
}

.shop-sidebar__inner .wp-block-woocommerce-product-filters h3.wp-block-heading{
  margin: 0 0 8px !important;
  font-size: 14px;
  font-weight: 800;
  line-height: 1.2;
}

.shop-sidebar__inner .wc-block-product-filter-checkbox-list__items{
  display: grid;
  gap: 8px;
}

.shop-sidebar__inner .wc-block-product-filter-checkbox-list__label{
  border: 1px solid rgba(0,0,0,.10);
  border-radius: 10px;
  padding: 8px 10px;
  display: flex;
  align-items: center;
  gap: 10px;
  background: #fff;
}

.shop-sidebar__inner .wc-block-product-filter-checkbox-list__count{
  margin-left: auto;
  font-weight: 800;
}

/* Desktop */
@media (min-width: 992px){
  /* Hide Woo overlay button */
  .shop-sidebar__inner .wc-block-product-filters__open-overlay{ display:none !important; }

  /* Show overlay content inline */
  .shop-sidebar__inner .wc-block-product-filters__overlay{
    position: static !important;
    inset: auto !important;
    transform: none !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    display: block !important;
    background: transparent !important;
  }
  .shop-sidebar__inner .wc-block-product-filters__overlay-wrapper,
  .shop-sidebar__inner .wc-block-product-filters__overlay-dialog{
    position: static !important;
    inset: auto !important;
    transform: none !important;
    width: 100% !important;
    max-width: none !important;
    height: auto !important;
    max-height: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
  }
  .shop-sidebar__inner .wc-block-product-filters__overlay-header,
  .shop-sidebar__inner .wc-block-product-filters__overlay-footer{
    display: none !important;
  }
  .shop-sidebar__inner .wc-block-product-filters__overlay-content{
    padding: 0 !important;
  }

  /* Avoid duplicate headings */
  .shop-sidebar__inner .wp-block-woocommerce-product-filters > .wp-block-heading{ display:none !important; }
}

/* Mobile: floating trigger + bottom sheet */
.sakkinen-filters-fab{ display:none; }

@media (max-width: 991px){
  /* Hide theme sidebar title to avoid duplicates (overlay has its own) */
  .shop-sidebar__inner .shop-sidebar__heading{ display:none; }

  /* Floating button (paired with cart button) */
  .sakkinen-filters-fab{
    position: fixed;
    /* Place next to the mobile cart button */
    right: 80px; /* 12px (gutter) + 56px (cart) + 12px (gap) */
    bottom: 12px;
    z-index: 9999;
    width: 56px;
    height: 56px;
    border-radius: 999px;
    background: var(--surface);
    border: 1px solid var(--border);
    box-shadow: 0 12px 30px rgba(0,0,0,.18);
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    padding: 0;
  }
  .sakkinen-filters-fab svg{ width:22px; height:22px; display:block; }

  /* Keep Woo's own trigger hidden; we handle open/close */
  .shop-sidebar__inner .wc-block-product-filters__open-overlay{ display:none !important; }

  /* Default hidden overlay */
  .wc-block-product-filters__overlay{
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
  }

  /* Theme-controlled open state */
  body.sakkinen-filters-open{
    overflow: hidden !important;
  }
  body.sakkinen-filters-open .wc-block-product-filters__overlay{
    position: fixed !important;
    inset: 0 !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    display: block !important;
    background: rgba(0,0,0,.40) !important;
    z-index: 10000 !important;
  }
  body.sakkinen-filters-open .wc-block-product-filters__overlay-wrapper{
    position: fixed !important;
    inset: 0 !important;
    display: flex !important;
    align-items: stretch !important;
    justify-content: center !important;
    padding: 12px !important;
  }
  body.sakkinen-filters-open .wc-block-product-filters__overlay-dialog{
    width: 100% !important;
    max-width: 520px !important;
    max-height: 85vh !important;
    overflow: auto !important;
    border-radius: 16px !important;
    background: #fff !important;
    box-shadow: 0 16px 40px rgba(0,0,0,.22) !important;
  
    transform: none !important;
    height: auto !important;
    min-height: 60vh !important;
    display: block !important;
  }
  body.sakkinen-filters-open .wc-block-product-filters__overlay-header,
  body.sakkinen-filters-open .wc-block-product-filters__overlay-footer{
    display: flex !important;
  }
}


/* Global mobile horizontal overflow guard (prevents sideways scroll) */
@media (max-width: 991px){
  html, body{
    width: 100%;
    max-width: 100%;
    overflow-x: hidden !important;
  }
  body *{
    max-width: 100%;
  }
  .site, .site-content, .content-area, .woocommerce, .wp-site-blocks{
    max-width: 100%;
    overflow-x: hidden;
  }
  /* Admin bar can contribute to overflow on some setups */
  #wpadminbar{
    left: 0;
    right: 0;
    width: 100%;
  }
}


/* Filters overlay: make closing easier on mobile */
@media (max-width: 991px){
  body.sakkinen-filters-open .wc-block-product-filters__overlay-dialog{
    position: relative;
    padding-bottom: 76px; /* space for bottom close bar */
  }

  body.sakkinen-filters-open .wc-block-product-filters__overlay-header{
    position: sticky;
    top: 0;
    z-index: 2;
    background: #fff;
    padding: 10px 12px;
    border-bottom: 1px solid rgba(0,0,0,.08);
    justify-content: flex-end;
  }

  body.sakkinen-filters-open .wc-block-product-filters__close-overlay{
    border-radius: 10px;
    padding: 10px 12px;
    font-weight: 800;
  }

  body.sakkinen-filters-open .sakkinen-filters-closebar{
    position: sticky;
    bottom: 0;
    z-index: 2;
    padding: 8px 12px 10px;
    background: rgba(255,255,255,.92);
    backdrop-filter: blur(6px);
    border-top: 1px solid rgba(0,0,0,.08);
  }

  body.sakkinen-filters-open .sakkinen-filters-closebar button{
    width: 100%;
    border-radius: 999px;
    padding: 10px 12px;
    font-weight: 700;
    border: 1px solid rgba(0,0,0,.14);
    background: #fff;
    box-shadow: none;
  }
}




/* =========================
   v1.1.0 – PDP gallery size refinement
   =========================
   Slightly reduce the dominance of the main product image on desktop,
   while keeping mobile layout unchanged.
*/
@media (min-width: 992px){
  .woocommerce div.product div.images,
  .woocommerce div.product .woocommerce-product-gallery{
    width: 44% !important;      /* default is ~48% */
    max-width: 660px;           /* prevents overly large galleries on wide screens */
  }
  .woocommerce div.product div.summary{
    width: 52% !important;
  }
}

/* =========================
   v1.1.2 – PDP tabs -> continuous sections
   ========================= */

/* Keep the wrapper for layout clearing, but hide tab navigation */
.woocommerce div.product .woocommerce-tabs {
  clear: both;
  margin-top: 24px;
}

.woocommerce div.product .woocommerce-tabs ul.tabs,
.woocommerce div.product .woocommerce-tabs .wc-tabs {
  display: none !important;
}

/* Force all panels visible (overrides Woo inline display:none) */
.woocommerce div.product .woocommerce-tabs .woocommerce-Tabs-panel {
  display: block !important;
}

/* Add gentle separation between stacked sections */
.woocommerce div.product .woocommerce-tabs .woocommerce-Tabs-panel + .woocommerce-Tabs-panel {
  margin-top: 18px;
}

/* ============================================================
   WooCommerce - Single product container width fix
   - Estaa valtavan tyhjan tilan syntymisen isolla naytolla.
   - Kasvaa jatkossa reunoille (gutters) sen sijaan, etta sarakkeiden valinen tyhja kasvaa.
   ============================================================ */

@media (min-width: 1024px){
  body.single-product.woocommerce .woocommerce-notices-wrapper,
  body.single-product.woocommerce div.product{
    max-width: var(--content);
    padding-left: clamp(16px, 3vw, 64px);
    padding-right: clamp(16px, 3vw, 64px);
  }
}


/* ============================================================
   SWT: Tilaustapa-kortti (swt-measure) - teeman mukainen ulkoasu
   ============================================================ */

body.single-product .woocommerce div.product form.cart .swt-measure{
  margin: 14px 0 16px 0;
  padding: 16px 16px;
  border-radius: 18px;
  border: 1px solid rgba(0,0,0,.10);
  background: rgba(255,255,255,.92);
  box-shadow: 0 10px 26px rgba(0,0,0,.07);
  backdrop-filter: blur(6px);
}

body.single-product .woocommerce div.product form.cart .swt-measure__head{
  margin-bottom: 12px;
}

body.single-product .woocommerce div.product form.cart .swt-measure__title{
  display: block;
  font-weight: 900;
  font-size: 16px;
  letter-spacing: -0.01em;
}

body.single-product .woocommerce div.product form.cart .swt-measure__hint{
  margin-top: 2px;
  color: rgba(0,0,0,.62);
  font-size: 13px;
}

body.single-product .woocommerce div.product form.cart .swt-measure__chips{
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 10px 0 14px 0;
}

body.single-product .woocommerce div.product form.cart :where(.swt-block--measure, [data-swt-block="measure"], .swt-measure) .swt-measure__chip{
  appearance: none;
  border: 1px solid rgba(0,0,0,.14);
  background: #fff;
  border-radius: 999px;
  padding: 9px 12px;
  font-weight: 900;
  font-size: 14px;
  line-height: 1;
  cursor: pointer;
  transition: transform .08s ease, box-shadow .12s ease, border-color .12s ease, background .12s ease, color .12s ease;
}

body.single-product .woocommerce div.product form.cart .swt-measure__chip:hover{
  border-color: rgba(0,0,0,.24);
  box-shadow: 0 8px 18px rgba(0,0,0,.08);
  transform: translateY(-1px);
}

body.single-product .woocommerce div.product form.cart :where(.swt-block--measure, [data-swt-block="measure"], .swt-measure) .swt-measure__chip.is-active{
  border-color: rgba(31,79,58,.70);
  background: rgba(31,79,58,.10);
  color: rgba(31,79,58,1);
}

body.single-product .woocommerce div.product form.cart .swt-measure__grid{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
}

@media (max-width: 720px){
  body.single-product .woocommerce div.product form.cart .swt-measure__grid{
    grid-template-columns: 1fr;
  }
}

body.single-product .woocommerce div.product form.cart .swt-measure__label{
  display: inline-block;
  margin-bottom: 6px;
  font-weight: 900;
  color: rgba(0,0,0,.78);
}

body.single-product .woocommerce div.product form.cart .swt-measure__control{
  position: relative;
}

/* Stepper buttons under the inputs (match theme look) */
body.single-product .woocommerce div.product form.cart .swt-measure__stepper{
  display: inline-flex;
  gap: 6px;
  margin-top: 8px;
}

body.single-product .woocommerce div.product form.cart .swt-measure__stepper-btn{
  appearance: none;
  border: 1px solid rgba(0,0,0,.14);
  background: #fff;
  border-radius: 10px;
  height: 32px;
  min-width: 34px;
  font-weight: 900;
  cursor: pointer;
  line-height: 1;
  transition: transform .08s ease, box-shadow .12s ease, border-color .12s ease;
}

body.single-product .woocommerce div.product form.cart .swt-measure__stepper-btn:hover{
  border-color: rgba(0,0,0,.24);
  box-shadow: 0 8px 18px rgba(0,0,0,.08);
  transform: translateY(-1px);
}

body.single-product .woocommerce div.product form.cart .swt-measure__result{
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px dashed rgba(0,0,0,.16);
}

body.single-product .woocommerce div.product form.cart .swt-measure__result-line{
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 14px;
  flex-wrap: wrap;
}

body.single-product .woocommerce div.product form.cart .swt-measure__result-item{
  color: rgba(0,0,0,.72);
}

body.single-product .woocommerce div.product form.cart .swt-measure__result-item strong{
  font-weight: 900;
}


/* ============================================================
   v1.4.79 – SWT: Tilaustapa-kortin UI-parannukset (override)
   Huom: main.css:ssa on aiempia "swt-measure"-blokkeja; taman osion on oltava lopussa.
   ============================================================ */

/* Chip-napit erottuvammiksi */
body.single-product .woocommerce div.product form.cart .swt-measure__chips .swt-measure__chip{
  background: rgba(0,0,0,.04) !important;
  border-color: rgba(0,0,0,.16) !important;
  box-shadow: 0 1px 0 rgba(0,0,0,.02) !important;
}
body.single-product .woocommerce div.product form.cart .swt-measure__chips .swt-measure__chip.is-active{
  background: rgba(31,79,58,1) !important;
  border-color: rgba(31,79,58,1) !important;
  color: #fff !important;
  box-shadow: 0 10px 22px rgba(31,79,58,.22) !important;
}

/* Leveys/Pituus inputit samaan tyyliin kuin m2/maara-kentta */
body.single-product .woocommerce div.product form.cart .swt-measure input.swt-measure__input{
  min-height: 64px !important;
  height: 64px !important;
  border-radius: 18px !important;
  font-size: 18px !important;
  font-weight: 800 !important;
  padding: 14px 138px 14px 16px !important; /* tilaa stepperille + cm-badgelle */
}

/* Stepperi (+/-) inputin sisaan oikeaan laitaan */
body.single-product .woocommerce div.product form.cart .swt-measure .swt-measure__control{
  position: relative !important;
}
body.single-product .woocommerce div.product form.cart .swt-measure__stepper{
  position: absolute !important;
  right: 62px !important; /* jattaa tilan cm-badgelle */
  top: 50% !important;
  transform: translateY(-50%) !important;
  margin: 0 !important;
  gap: 6px !important;
}
body.single-product .woocommerce div.product form.cart .swt-measure__stepper-btn{
  height: 34px !important;
  min-width: 34px !important;
  border-radius: 12px !important;
  border-color: rgba(0,0,0,.16) !important;
  background: #fff !important;
  box-shadow: 0 1px 0 rgba(0,0,0,.02) !important;
}

/* "cm"-badge */
body.single-product .woocommerce div.product form.cart .swt-measure .swt-measure__suffix{
  position: absolute !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  height: 34px !important;
  border-radius: 12px !important;
  background: rgba(0,0,0,.08) !important;
  right: 12px !important;
}

/* Lisapalvelut + checkbox */
body.single-product .woocommerce div.product form.cart .swt-measure input[type="checkbox"]{
  width: 18px !important;
  height: 18px !important;
  accent-color: rgba(31,79,58,1) !important;
}
body.single-product .woocommerce div.product form.cart .swt-measure label{
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;
  font-weight: 800 !important;
  color: rgba(0,0,0,.78) !important;
}

@media (max-width: 600px){
  body.single-product .woocommerce div.product form.cart .swt-measure input.swt-measure__input{
    min-height: 60px !important;
    height: 60px !important;
  }
  body.single-product .woocommerce div.product form.cart .swt-measure__stepper-btn{
    height: 32px !important;
    min-width: 32px !important;
  }
  body.single-product .woocommerce div.product form.cart .swt-measure .swt-measure__suffix{
    height: 32px !important;
  }
}

/* ============================================================
   v1.4.80 – SWT: Tilaustapa-kortti - asennusvara-tyylin yhtenäistys
   ============================================================ */

body.single-product .woocommerce div.product form.cart .swt-measure{
  margin: 18px 0 !important;
  padding: 18px !important;
  border: 1px solid var(--border, rgba(31,35,40,.12)) !important;
  border-radius: var(--radius, 18px) !important;
  background: var(--surface, #fff) !important;
  box-shadow: var(--shadow, 0 10px 30px rgba(0,0,0,.08)) !important;
  backdrop-filter: none !important;
  color: var(--text, #1f2328) !important;
}

body.single-product .woocommerce div.product form.cart .swt-measure > *:first-child{
  margin-top: 0 !important;
}

body.single-product .woocommerce div.product form.cart .swt-measure > *:last-child{
  margin-bottom: 0 !important;
}

body.single-product .woocommerce div.product form.cart .swt-measure__head{
  display: grid !important;
  gap: 6px !important;
  margin-bottom: 14px !important;
}

body.single-product .woocommerce div.product form.cart .swt-measure__title{
  font-size: 16px !important;
  font-weight: 800 !important;
  letter-spacing: 0 !important;
  color: var(--text, #1f2328) !important;
}

body.single-product .woocommerce div.product form.cart .swt-measure__hint{
  font-size: 13px !important;
  color: var(--muted, #5a646f) !important;
}

body.single-product .woocommerce div.product form.cart .swt-measure__chips{
  gap: 12px !important;
  margin: 12px 0 16px 0 !important;
}

body.single-product .woocommerce div.product form.cart .swt-measure__chips .swt-measure__chip{
  border-radius: 999px !important;
  padding: 10px 14px !important;
  font-weight: 800 !important;
  font-size: 14px !important;
  border-color: var(--border, rgba(31,35,40,.12)) !important;
  background: color-mix(in srgb, var(--surface, #fff) 92%, var(--text, #1f2328) 8%) !important;
}

body.single-product .woocommerce div.product form.cart .swt-measure__label{
  margin-bottom: 8px !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  color: var(--text, #1f2328) !important;
}

body.single-product .woocommerce div.product form.cart .swt-measure__result{
  margin-top: 16px !important;
  padding-top: 14px !important;
  border-top: 1px dashed var(--border, rgba(31,35,40,.12)) !important;
}

body.single-product .woocommerce div.product form.cart .swt-measure__result-item{
  font-size: 14px !important;
  color: var(--muted, #5a646f) !important;
}

body.single-product .woocommerce div.product form.cart .swt-measure__result-item strong{
  font-weight: 900 !important;
}

body.single-product .woocommerce div.product form.cart .swt-measure__addons{
  margin-top: 12px !important;
  padding: 12px 12px 10px !important;
  border-radius: 14px !important;
  background: color-mix(in srgb, var(--surface, #fff) 94%, var(--text, #1f2328) 6%) !important;
}

body.single-product .woocommerce div.product form.cart .swt-measure__addons-head strong{
  display: inline-block !important;
  margin-bottom: 6px !important;
  font-weight: 800 !important;
}

body.single-product .woocommerce div.product form.cart .swt-measure__footer{
  margin-top: 14px !important;
  padding: 12px 14px !important;
  border-radius: 14px !important;
  background: color-mix(in srgb, var(--surface, #fff) 92%, var(--text, #1f2328) 8%) !important;
  border: 1px solid var(--border, rgba(31,35,40,.12)) !important;
}

body.single-product .woocommerce div.product form.cart .swt-measure__footer-label{
  color: var(--muted, #5a646f) !important;
  font-weight: 700 !important;
}

/* SWT Carousels (sakkinen-woo-tools)
   Theme polish for plugin hooks (.swt-carousel*). */
.swt-carousel{position:relative}
.swt-carousel__head{display:flex !important;align-items:center;justify-content:space-between;gap:12px;flex-wrap:nowrap !important;margin:0 0 14px 0}
/* Header bar layout (title + arrows outside the <section>) */
.swt-carousel__bar{margin:0 0 14px 0}
.swt-carousel__bar-inner{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:nowrap}
/* Force title + arrows onto the same row (avoid unexpected global flex-wrap overrides) */
.swt-carousel .swt-carousel__head{flex-wrap:nowrap}
.swt-carousel .swt-carousel__title{min-width:0;flex:1 1 auto}
.swt-carousel .swt-carousel__nav{flex:0 0 auto}
.swt-carousel__title{margin:0}
.swt-carousel__nav{display:none;gap:8px}
.swt-carousel.swt-carousel--arrows .swt-carousel__nav{display:flex}
@media (max-width: 680px){
  /* Nuolinavigointi ei mobiiliin */
  .swt-carousel.swt-carousel--arrows .swt-carousel__nav{display:none}
}
.swt-carousel__btn{
  display:inline-flex;align-items:center;justify-content:center;
  width:40px;height:40px;border-radius:12px;
  border:1px solid rgba(31,35,40,.18);
  background:#fff;
  cursor:pointer;
  line-height:1;
  font-size:22px;
}
.swt-carousel__btn:hover{border-color:rgba(31,35,40,.28)}
.swt-carousel__viewport{overflow:hidden}
.swt-carousel__track{
  overflow-x:auto;
  scroll-snap-type:x mandatory;
  -webkit-overflow-scrolling:touch;
}
.swt-carousel__slide{scroll-snap-align:start}




/* ============================================================
   SWT: Tilaustapa-kortti (swt-measure) - teeman mukainen ulkoasu
   ============================================================ */

body.single-product .woocommerce div.product form.cart .swt-measure{
  margin: 14px 0 16px 0;
  padding: 16px;
  border-radius: 18px;
  border: 1px solid rgba(0,0,0,.10);
  background: #fff;
  box-shadow: 0 12px 28px rgba(0,0,0,.06);
}

body.single-product .woocommerce div.product form.cart .swt-measure__head{
  margin-bottom: 12px;
}

body.single-product .woocommerce div.product form.cart .swt-measure__title{
  display: block;
  font-weight: 900;
  font-size: 16px;
}

body.single-product .woocommerce div.product form.cart .swt-measure__hint{
  margin-top: 4px;
  font-size: 13px;
  color: rgba(0,0,0,.62);
}

body.single-product .woocommerce div.product form.cart .swt-measure__chips{
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 12px 0 12px 0;
}

body.single-product .woocommerce div.product form.cart :where(.swt-block--measure, [data-swt-block="measure"], .swt-measure) .swt-measure__chip{
  appearance: none;
  border: 1px solid rgba(0,0,0,.14);
  background: #fff;
  border-radius: 999px;
  padding: 9px 12px;
  font-weight: 800;
  font-size: 14px;
  line-height: 1;
  cursor: pointer;
  transition: transform .08s ease, box-shadow .12s ease, border-color .12s ease, background .12s ease;
}

body.single-product .woocommerce div.product form.cart .swt-measure__chip:hover{
  border-color: rgba(0,0,0,.24);
  box-shadow: 0 8px 18px rgba(0,0,0,.08);
  transform: translateY(-1px);
}

body.single-product .woocommerce div.product form.cart :where(.swt-block--measure, [data-swt-block="measure"], .swt-measure) .swt-measure__chip.is-active{
  border-color: rgba(31,79,58,.70);
  background: rgba(31,79,58,.10);
}

body.single-product .woocommerce div.product form.cart .swt-measure__grid{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
  align-items: end;
}

@media (max-width: 720px){
  body.single-product .woocommerce div.product form.cart .swt-measure__grid{
    grid-template-columns: 1fr;
  }
}

body.single-product .woocommerce div.product form.cart .swt-measure__label{
  display: block;
  font-weight: 800;
  font-size: 14px;
  margin-bottom: 6px;
}

body.single-product .woocommerce div.product form.cart .swt-measure__control{
  position: relative;
}

body.single-product .woocommerce div.product form.cart .swt-measure__stepper{
  display: flex;
  gap: 6px;
  margin-top: 8px;
}

body.single-product .woocommerce div.product form.cart .swt-measure__stepper-btn{
  width: 32px;
  height: 32px;
  border-radius: 10px;
  border: 1px solid rgba(0,0,0,.14);
  background: #fff;
  font-weight: 900;
  cursor: pointer;
  line-height: 1;
}

body.single-product .woocommerce div.product form.cart .swt-measure__stepper-btn:hover{
  border-color: rgba(0,0,0,.24);
  box-shadow: 0 6px 14px rgba(0,0,0,.08);
  transform: translateY(-1px);
}

body.single-product .woocommerce div.product form.cart .swt-measure__result{
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px dashed rgba(0,0,0,.14);
}

body.single-product .woocommerce div.product form.cart .swt-measure__result-line{
  display: flex;
  gap: 12px;
  justify-content: space-between;
  flex-wrap: wrap;
}

body.single-product .woocommerce div.product form.cart .swt-measure__result-item{
  color: rgba(0,0,0,.74);
  font-size: 14px;
}

body.single-product .woocommerce div.product form.cart .swt-measure__result-item strong{
  font-weight: 900;
}

/* ============================================================
   SWT: Tilaustapa-kortti (swt-measure) - teeman mukainen ulkoasu
   ============================================================ */

body.single-product .woocommerce div.product form.cart .swt-measure{
  margin: 14px 0 16px 0;
  padding: 16px;
  border-radius: 18px;
  border: 1px solid rgba(0,0,0,.10);
  background: #fff;
  box-shadow: 0 10px 24px rgba(0,0,0,.06);
}

body.single-product .woocommerce div.product form.cart .swt-measure__head{
  margin-bottom: 12px;
}

body.single-product .woocommerce div.product form.cart .swt-measure__title{
  display: block;
  font-size: 16px;
  font-weight: 900;
  letter-spacing: -0.01em;
}

body.single-product .woocommerce div.product form.cart .swt-measure__hint{
  margin-top: 2px;
  font-size: 13px;
  color: rgba(0,0,0,.64);
}

body.single-product .woocommerce div.product form.cart .swt-measure__chips{
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 10px 0 14px 0;
}

body.single-product .woocommerce div.product form.cart .swt-measure__chip{
  appearance: none;
  border: 1px solid rgba(0,0,0,.14);
  background: #fff;
  border-radius: 999px;
  padding: 9px 12px;
  font-weight: 800;
  font-size: 14px;
  line-height: 1;
  cursor: pointer;
  transition: transform .08s ease, box-shadow .12s ease, border-color .12s ease, background .12s ease;
}

body.single-product .woocommerce div.product form.cart .swt-measure__chip:hover{
  border-color: rgba(0,0,0,.24);
  box-shadow: 0 8px 18px rgba(0,0,0,.08);
  transform: translateY(-1px);
}

body.single-product .woocommerce div.product form.cart :where(.swt-block--measure, [data-swt-block="measure"], .swt-measure) .swt-measure__chip.is-active{
  border-color: rgba(20,90,58,.65);
  background: rgba(20,90,58,.10);
}

body.single-product .woocommerce div.product form.cart .swt-measure__chip:focus-visible{
  outline: none;
  box-shadow: 0 0 0 4px rgba(0,0,0,.08);
}

body.single-product .woocommerce div.product form.cart .swt-measure__grid{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
}

@media (max-width: 700px){
  body.single-product .woocommerce div.product form.cart .swt-measure__grid{
    grid-template-columns: 1fr;
  }
}

body.single-product .woocommerce div.product form.cart .swt-measure__label{
  display: block;
  margin-bottom: 6px;
  font-size: 14px;
  font-weight: 800;
  color: rgba(0,0,0,.80);
}

body.single-product .woocommerce div.product form.cart .swt-measure__control{
  position: relative;
}

/* Stepper: + / - napeille siisti ulkoasu ja yhtenainen korkeus */
body.single-product .woocommerce div.product form.cart .swt-measure__stepper{
  display: flex;
  gap: 6px;
  margin-top: 6px;
}

body.single-product .woocommerce div.product form.cart .swt-measure__stepper-btn{
  appearance: none;
  border: 1px solid rgba(0,0,0,.14);
  background: rgba(0,0,0,.03);
  border-radius: 10px;
  min-width: 44px;
  height: 34px;
  font-size: 18px;
  font-weight: 900;
  line-height: 1;
  cursor: pointer;
  transition: transform .08s ease, box-shadow .12s ease, border-color .12s ease, background .12s ease;
}

body.single-product .woocommerce div.product form.cart .swt-measure__stepper-btn:hover{
  border-color: rgba(0,0,0,.24);
  box-shadow: 0 8px 18px rgba(0,0,0,.08);
  transform: translateY(-1px);
}

body.single-product .woocommerce div.product form.cart .swt-measure__stepper-btn:active{
  transform: translateY(0);
}

body.single-product .woocommerce div.product form.cart .swt-measure__result{
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px dashed rgba(0,0,0,.14);
}

body.single-product .woocommerce div.product form.cart .swt-measure__result-line{
  display: flex;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}

body.single-product .woocommerce div.product form.cart .swt-measure__result-item{
  color: rgba(0,0,0,.74);
}

body.single-product .woocommerce div.product form.cart .swt-measure__result-item strong{
  font-weight: 900;
}

/* ============================================================
   SWT: Tilaustapa-kortti (swt-measure) - teeman mukainen ulkoasu
   ============================================================ */

body.single-product .woocommerce div.product form.cart .swt-measure{
  margin: 14px 0 16px 0;
  padding: 16px;
  border-radius: 18px;
  border: 1px solid rgba(0,0,0,.10);
  background: #fff;
  box-shadow: 0 10px 24px rgba(0,0,0,.06);
}

body.single-product .woocommerce div.product form.cart .swt-measure__head{
  margin-bottom: 12px;
}

body.single-product .woocommerce div.product form.cart .swt-measure__title{
  display: block;
  font-size: 16px;
  font-weight: 900;
  letter-spacing: -0.01em;
}

body.single-product .woocommerce div.product form.cart .swt-measure__hint{
  margin-top: 3px;
  font-size: 13px;
  color: rgba(0,0,0,.68);
}

body.single-product .woocommerce div.product form.cart .swt-measure__chips{
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 12px 0 14px 0;
}

body.single-product .woocommerce div.product form.cart .swt-measure__chip{
  appearance: none;
  border: 1px solid rgba(0,0,0,.14);
  background: #fff;
  border-radius: 999px;
  padding: 9px 12px;
  font-weight: 900;
  font-size: 14px;
  line-height: 1;
  cursor: pointer;
  transition: transform .08s ease, box-shadow .12s ease, border-color .12s ease, background .12s ease;
}

body.single-product .woocommerce div.product form.cart .swt-measure__chip:hover{
  border-color: rgba(0,0,0,.24);
  box-shadow: 0 8px 18px rgba(0,0,0,.08);
  transform: translateY(-1px);
}

body.single-product .woocommerce div.product form.cart .swt-measure__chip.is-active{
  border-color: rgba(31,79,58,.75);
  background: rgba(31,79,58,.10);
}

body.single-product .woocommerce div.product form.cart .swt-measure__chip:focus-visible{
  outline: none;
  box-shadow: 0 0 0 4px rgba(0,0,0,.08);
}

body.single-product .woocommerce div.product form.cart .swt-measure__grid{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
}

@media (max-width: 740px){
  body.single-product .woocommerce div.product form.cart .swt-measure__grid{
    grid-template-columns: 1fr;
  }
}

body.single-product .woocommerce div.product form.cart .swt-measure__label{
  display: block;
  margin: 0 0 6px 0;
  font-weight: 900;
}

body.single-product .woocommerce div.product form.cart .swt-measure__stepper{
  display: inline-flex;
  gap: 6px;
  margin-top: 8px;
}

body.single-product .woocommerce div.product form.cart .swt-measure__stepper-btn{
  width: 30px;
  height: 30px;
  border-radius: 10px;
  border: 1px solid rgba(0,0,0,.14);
  background: rgba(0,0,0,.03);
  font-weight: 900;
  line-height: 1;
  cursor: pointer;
}

body.single-product .woocommerce div.product form.cart .swt-measure__stepper-btn:hover{
  border-color: rgba(0,0,0,.24);
  background: rgba(0,0,0,.06);
}

body.single-product .woocommerce div.product form.cart .swt-measure__result{
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px dashed rgba(0,0,0,.14);
}

body.single-product .woocommerce div.product form.cart .swt-measure__result-line{
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}

body.single-product .woocommerce div.product form.cart .swt-measure__result-item{
  color: rgba(0,0,0,.72);
}

body.single-product .woocommerce div.product form.cart .swt-measure__result-item strong{
  font-weight: 900;
}

/* ============================================================
   SWT: Tilaustapa-kortti (swt-measure) - teeman mukainen ulkoasu
   ============================================================ */

body.single-product .woocommerce div.product form.cart .swt-measure{
  margin: 14px 0 16px 0;
  padding: 16px;
  border-radius: 18px;
  border: 1px solid rgba(0,0,0,.10);
  background: #fff;
  box-shadow: 0 10px 24px rgba(0,0,0,.06);
}

body.single-product .woocommerce div.product form.cart .swt-measure__head{
  margin-bottom: 12px;
}

body.single-product .woocommerce div.product form.cart .swt-measure__title{
  display: block;
  font-weight: 900;
  font-size: 16px;
  letter-spacing: -0.01em;
}

body.single-product .woocommerce div.product form.cart .swt-measure__hint{
  margin-top: 4px;
  color: rgba(0,0,0,.65);
  font-size: 13px;
}

body.single-product .woocommerce div.product form.cart .swt-measure__chips{
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 12px 0 14px 0;
}

body.single-product .woocommerce div.product form.cart .swt-measure__chip{
  appearance: none;
  border: 1px solid rgba(0,0,0,.14);
  background: #fff;
  border-radius: 999px;
  padding: 9px 12px;
  font-weight: 900;
  font-size: 14px;
  line-height: 1;
  cursor: pointer;
  transition: transform .08s ease, box-shadow .12s ease, border-color .12s ease, background .12s ease;
}

body.single-product .woocommerce div.product form.cart .swt-measure__chip:hover{
  border-color: rgba(0,0,0,.24);
  box-shadow: 0 8px 18px rgba(0,0,0,.08);
  transform: translateY(-1px);
}

body.single-product .woocommerce div.product form.cart .swt-measure__chip.is-active{
  border-color: rgba(31,79,58,.70);
  background: rgba(31,79,58,.10);
}

body.single-product .woocommerce div.product form.cart .swt-measure__grid{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
}

@media (max-width: 720px){
  body.single-product .woocommerce div.product form.cart .swt-measure__grid{
    grid-template-columns: 1fr;
  }
}

body.single-product .woocommerce div.product form.cart .swt-measure__label{
  display: block;
  margin: 0 0 6px 0;
  font-weight: 800;
  color: rgba(0,0,0,.78);
}

body.single-product .woocommerce div.product form.cart .swt-measure__control{
  position: relative;
}

body.single-product .woocommerce div.product form.cart .swt-measure__stepper{
  position: absolute;
  left: 10px;
  bottom: -34px;
  display: inline-flex;
  gap: 6px;
}

body.single-product .woocommerce div.product form.cart .swt-measure__stepper-btn{
  width: 28px;
  height: 28px;
  border-radius: 8px;
  border: 1px solid rgba(0,0,0,.14);
  background: #fff;
  font-weight: 900;
  line-height: 1;
  cursor: pointer;
}

body.single-product .woocommerce div.product form.cart .swt-measure__result{
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px dashed rgba(0,0,0,.14);
}

body.single-product .woocommerce div.product form.cart .swt-measure__result-line{
  display: flex;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}

body.single-product .woocommerce div.product form.cart .swt-measure__result-item{
  color: rgba(0,0,0,.74);
}

body.single-product .woocommerce div.product form.cart .swt-measure__result-item strong{
  font-weight: 900;
}

/* ============================================================
   v1.4.79 – SWT: Tilaustapa-kortin UI-parannukset (FINAL)
   ============================================================ */

/* Chip-napit erottuvammiksi */
body.single-product .woocommerce div.product form.cart :where(.swt-block--measure, [data-swt-block="measure"], .swt-measure) .swt-measure__chip{
  background: rgba(0,0,0,.04) !important;
  border-color: rgba(0,0,0,.16) !important;
  box-shadow: 0 1px 0 rgba(0,0,0,.02) !important;
}
body.single-product .woocommerce div.product form.cart :where(.swt-block--measure, [data-swt-block="measure"], .swt-measure) .swt-measure__chip.is-active{
  background: rgba(31,79,58,1) !important;
  border-color: rgba(31,79,58,1) !important;
  color: #fff !important;
  box-shadow: 0 10px 22px rgba(31,79,58,.22) !important;
}
body.single-product .woocommerce div.product form.cart :where(.swt-block--measure, [data-swt-block="measure"], .swt-measure) .swt-measure__chip.is-active:hover{
  transform: translateY(-1px);
  box-shadow: 0 12px 26px rgba(31,79,58,.26) !important;
}

/* Leveys/Pituus inputit pillityyliin */
body.single-product .woocommerce div.product form.cart :where(.swt-block--measure, [data-swt-block="measure"], .swt-measure) input.swt-measure__input{
  min-height: 64px !important;
  height: 64px !important;
  border-radius: 18px !important;
  font-size: 18px !important;
  font-weight: 800 !important;
  padding: 14px 138px 14px 16px !important; /* tilaa stepperille + cm-badgelle */
}

/* "cm"-badge */
body.single-product .woocommerce div.product form.cart :where(.swt-block--measure, [data-swt-block="measure"], .swt-measure) .swt-measure__suffix{
  height: 34px !important;
  border-radius: 12px !important;
  background: rgba(0,0,0,.08) !important;
  right: 12px !important;
}

/* Stepperi inputin sisaan */
body.single-product .woocommerce div.product form.cart :where(.swt-block--measure, [data-swt-block="measure"], .swt-measure) .swt-measure__control{
  position: relative;
}
body.single-product .woocommerce div.product form.cart :where(.swt-block--measure, [data-swt-block="measure"], .swt-measure) .swt-measure__stepper{
  position: absolute !important;
  right: 62px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  margin: 0 !important;
  gap: 6px !important;
}
body.single-product .woocommerce div.product form.cart :where(.swt-block--measure, [data-swt-block="measure"], .swt-measure) .swt-measure__stepper-btn{
  height: 34px !important;
  min-width: 34px !important;
  border-radius: 12px !important;
  border-color: rgba(0,0,0,.16) !important;
  background: #fff !important;
  box-shadow: 0 1px 0 rgba(0,0,0,.02) !important;
}

/* Lisapalvelut: typografia + checkbox */
body.single-product .woocommerce div.product form.cart :where(.swt-block--measure, [data-swt-block="measure"], .swt-measure) [class*="addon"],
body.single-product .woocommerce div.product form.cart :where(.swt-block--measure, [data-swt-block="measure"], .swt-measure) [class*="extra"],
body.single-product .woocommerce div.product form.cart :where(.swt-block--measure, [data-swt-block="measure"], .swt-measure) [class*="service"]{
  font-weight: 900 !important;
}
body.single-product .woocommerce div.product form.cart :where(.swt-block--measure, [data-swt-block="measure"], .swt-measure) input[type="checkbox"]{
  width: 18px;
  height: 18px;
  accent-color: rgba(31,79,58,1);
}
body.single-product .woocommerce div.product form.cart :where(.swt-block--measure, [data-swt-block="measure"], .swt-measure) label{
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-weight: 800;
  color: rgba(0,0,0,.78);
}

@media (max-width: 600px){
  body.single-product .woocommerce div.product form.cart :where(.swt-block--measure, [data-swt-block="measure"], .swt-measure) input.swt-measure__input{
    min-height: 60px !important;
    height: 60px !important;
  }
  body.single-product .woocommerce div.product form.cart :where(.swt-block--measure, [data-swt-block="measure"], .swt-measure) .swt-measure__stepper-btn{
    height: 32px !important;
    min-width: 32px !important;
  }
  body.single-product .woocommerce div.product form.cart :where(.swt-block--measure, [data-swt-block="measure"], .swt-measure) .swt-measure__suffix{
    height: 32px !important;
  }
}

/* SWT Carousel: place arrows on the same row with a preceding Gutenberg Heading (H2) */
h2.wp-block-heading + section:where(.swt-block--carousel, [data-swt-block="carousel"], .swt-carousel).swt-carousel--arrows{
  /* Pull carousel up so header sits in the same row as the heading */
  margin-top: -52px;
  padding-top: 52px;
}

h2.wp-block-heading + section:where(.swt-block--carousel, [data-swt-block="carousel"], .swt-carousel).swt-carousel--arrows{ position: relative; }

h2.wp-block-heading + section:where(.swt-block--carousel, [data-swt-block="carousel"], .swt-carousel).swt-carousel--arrows .swt-carousel__head{
  margin: 0 !important;
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  height: 0;
  pointer-events: none;
}

h2.wp-block-heading + section:where(.swt-block--carousel, [data-swt-block="carousel"], .swt-carousel).swt-carousel--arrows .swt-carousel__nav{
  position: absolute;
  top: 0;
  right: 0;
  pointer-events: auto;
}

h2.wp-block-heading{
  /* Reserve room for the arrow buttons so they do not overlap the title */
  padding-right: 140px;
}

@media (max-width: 781px){
  h2.wp-block-heading{ padding-right: 0; }
  h2.wp-block-heading + section:where(.swt-block--carousel, [data-swt-block="carousel"], .swt-carousel).swt-carousel--arrows{ margin-top: 0; padding-top: 0; }
  h2.wp-block-heading + section:where(.swt-block--carousel, [data-swt-block="carousel"], .swt-carousel).swt-carousel--arrows .swt-carousel__head{ position: static; height: auto; pointer-events: auto; }
  h2.wp-block-heading + section:where(.swt-block--carousel, [data-swt-block="carousel"], .swt-carousel).swt-carousel--arrows .swt-carousel__nav{ position: static; }
}

/* ============================================================
   Single product summary cards: unify inner SWT blocks
   ============================================================ */
body.single-product .summary.entry-summary :is(.sakkinen-price-card, .sakkinen-excerpt-card) :where(.swt-block, [data-swt-block], .swt-measure, .swt-install-allowance){
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0;
}

/* ---------------------------------------------------------------------
   Single product layout refresh (match reference image)
   --------------------------------------------------------------------- */
body.single-product .woocommerce div.product{
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr);
  gap: clamp(24px, 4vw, 56px);
  align-items: start;
}

@media (max-width: 960px){
  body.single-product .woocommerce div.product{
    grid-template-columns: 1fr;
  }
}

body.single-product .woocommerce div.product .woocommerce-product-gallery{
  width: 100%;
}

body.single-product .woocommerce div.product .summary{
  background: transparent;
  border: 0;
  box-shadow: none;
  padding: 0;
  backdrop-filter: none;
}

body.single-product .woocommerce div.product .summary .product_title{
  font-size: clamp(28px, 2.6vw, 36px);
  font-weight: 800;
  margin-bottom: 12px;
  letter-spacing: -0.01em;
}

body.single-product .woocommerce div.product .summary .price{
  color: #8c7b10;
}

body.single-product .woocommerce div.product .summary .woocommerce-product-details__short-description{
  margin-top: 12px;
  max-width: 56ch;
}

body.single-product .woocommerce div.product .summary .product_meta{
  margin-top: 18px;
}

body.single-product .woocommerce div.product form.cart{
  display: grid;
  grid-template-columns: minmax(96px, 120px) 1fr;
  gap: 14px;
  align-items: end;
}

body.single-product .woocommerce div.product form.cart .quantity{
  width: 100%;
  max-width: 140px;
}

body.single-product .woocommerce div.product form.cart .single_add_to_cart_button{
  width: 100%;
  min-height: 58px;
  border-radius: 18px;
}

body.single-product .woocommerce div.product form.cart :where(.swt-block--measure, [data-swt-block="measure"], .swt-measure){
  background: #fff;
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 18px;
  padding: 18px;
  box-shadow: 0 12px 28px rgba(0,0,0,.08);
}

body.single-product .woocommerce div.product form.cart :where(.swt-block--measure, [data-swt-block="measure"], .swt-measure) .swt-measure__result{
  border-top: 1px solid rgba(0,0,0,.08);
  margin-top: 16px;
  padding-top: 12px;
}

body.single-product .woocommerce div.product form.cart :where(.swt-block--measure, [data-swt-block="measure"], .swt-measure) .swt-measure__result-line{
  display: flex;
  justify-content: space-between;
  gap: 12px;
}

body.single-product .woocommerce-product-gallery__wrapper .woocommerce-product-gallery__image > a{
  border-radius: 20px;
}

body.single-product .woocommerce-product-gallery__wrapper .woocommerce-product-gallery__image,
body.single-product .woocommerce-product-gallery__wrapper .woocommerce-product-gallery__image .zoom,
body.single-product .woocommerce-product-gallery__wrapper .woocommerce-product-gallery__image a{
  border-radius: 20px;
}

body.single-product .woocommerce-product-gallery__wrapper .woocommerce-product-gallery__image a::before,
body.single-product .woocommerce-product-gallery__wrapper .woocommerce-product-gallery__image a::after{
  content: none;
}

body.single-product .woocommerce-product-gallery__trigger{
  position: absolute;
  top: 16px;
  right: 16px;
  width: 40px;
  height: 40px;
  border-radius: 999px;
  border: 0;
  background: #fff;
  box-shadow: 0 10px 24px rgba(0,0,0,.14);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 2;
}

body.single-product .woocommerce-product-gallery .flex-control-thumbs{
  gap: 12px;
  margin-top: 18px;
}

body.single-product .woocommerce-product-gallery .flex-control-thumbs img{
  border-radius: 12px;
}

/* ============================================================
   v1.5.0 – SWT: Tilaustapa-kortti kompaktiksi + tyylikkääksi
   ============================================================ */

body.single-product .woocommerce div.product form.cart .swt-measure{
  position: relative !important;
  padding: 16px 18px !important;
  border-radius: 20px !important;
  border: 1px solid rgba(31,35,40,.12) !important;
  background: linear-gradient(135deg, #ffffff 0%, #f7f8f6 100%) !important;
  box-shadow: 0 16px 32px rgba(20,24,30,.08) !important;
  overflow: hidden !important;
}

body.single-product .woocommerce div.product form.cart .swt-measure::before{
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  background: radial-gradient(circle at 20% 0%, rgba(31,79,58,.08), transparent 55%) !important;
  pointer-events: none !important;
}

body.single-product .woocommerce div.product form.cart .swt-measure__head,
body.single-product .woocommerce div.product form.cart .swt-measure__chips,
body.single-product .woocommerce div.product form.cart .swt-measure__grid,
body.single-product .woocommerce div.product form.cart .swt-measure__result,
body.single-product .woocommerce div.product form.cart .swt-measure__addons,
body.single-product .woocommerce div.product form.cart .swt-measure__footer{
  position: relative !important;
  z-index: 1 !important;
}

body.single-product .woocommerce div.product form.cart .swt-measure__head{
  gap: 4px !important;
  margin-bottom: 10px !important;
}

body.single-product .woocommerce div.product form.cart .swt-measure__title{
  font-size: 16px !important;
  font-weight: 900 !important;
  letter-spacing: -0.01em !important;
}

body.single-product .woocommerce div.product form.cart .swt-measure__chips{
  gap: 8px !important;
  margin: 10px 0 14px 0 !important;
}

body.single-product .woocommerce div.product form.cart .swt-measure__chip{
  padding: 8px 12px !important;
  font-weight: 800 !important;
  border-radius: 999px !important;
}

body.single-product .woocommerce div.product form.cart .swt-measure__grid{
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 12px !important;
  align-items: end !important;
}

body.single-product .woocommerce div.product form.cart .swt-measure input.swt-measure__input{
  min-height: 58px !important;
  height: 58px !important;
  border-radius: 16px !important;
  font-size: 17px !important;
  padding: 12px 130px 12px 14px !important;
}

body.single-product .woocommerce div.product form.cart .swt-measure__stepper{
  right: 56px !important;
}

body.single-product .woocommerce div.product form.cart .swt-measure .swt-measure__suffix{
  right: 10px !important;
  height: 32px !important;
  border-radius: 10px !important;
}

body.single-product .woocommerce div.product form.cart .swt-measure__result{
  margin-top: 14px !important;
  padding: 12px 12px !important;
  border-radius: 14px !important;
  border: 1px solid rgba(31,35,40,.10) !important;
  background: #fff !important;
}

body.single-product .woocommerce div.product form.cart .swt-measure__result-line{
  display: grid !important;
  grid-template-columns: 1fr auto !important;
  align-items: center !important;
  gap: 10px !important;
}

body.single-product .woocommerce div.product form.cart .swt-measure__result-item{
  font-size: 14px !important;
  color: rgba(31,35,40,.68) !important;
}

body.single-product .woocommerce div.product form.cart .swt-measure__result-item strong{
  color: rgba(31,35,40,.92) !important;
}

body.single-product .woocommerce div.product form.cart .swt-measure__addons{
  margin-top: 10px !important;
  padding: 10px 12px !important;
  border-radius: 12px !important;
  background: rgba(255,255,255,.9) !important;
  border: 1px solid rgba(31,35,40,.08) !important;
}

body.single-product .woocommerce div.product form.cart .swt-measure__footer{
  margin-top: 12px !important;
  padding: 10px 12px !important;
  border-radius: 12px !important;
}

body.single-product .woocommerce div.product form.cart .single_add_to_cart_button{
  width: 100% !important;
  display: block !important;
  border-radius: 16px !important;
  padding: 16px 18px !important;
  font-weight: 900 !important;
  font-size: 16px !important;
}

/* ============================================================
   v1.5.1 – Sakkinen price card polish
   ============================================================ */

body.single-product .summary.entry-summary .sakkinen-price-card{
  position: relative;
  background: linear-gradient(160deg, #ffffff 0%, #f6f7f4 100%);
  border-color: rgba(31,35,40,.12);
  box-shadow: 0 18px 36px rgba(20,24,30,.08);
  overflow: hidden;
}

body.single-product .summary.entry-summary .sakkinen-price-card::after{
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at 10% 0%, rgba(31,79,58,.08), transparent 55%);
  pointer-events: none;
}

body.single-product .summary.entry-summary .sakkinen-price-card > *{
  position: relative;
  z-index: 1;
}

body.single-product .summary.entry-summary .sakkinen-price-card p:empty{
  display: none;
}

body.single-product .summary.entry-summary .sakkinen-price-card .price{
  align-items: center;
  gap: 12px;
}

body.single-product .summary.entry-summary .sakkinen-price-card .price .woocommerce-Price-amount{
  font-weight: 900;
  letter-spacing: -0.02em;
}

body.single-product .summary.entry-summary .sakkinen-swt-wrap--units{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  color: rgba(31,35,40,.68);
}

body.single-product .summary.entry-summary .swt-units__suffix{
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 10px;
  border-radius: 999px;
  border: 1px solid rgba(31,35,40,.12);
  background: rgba(255,255,255,.8);
  font-weight: 700;
}

body.single-product .summary.entry-summary .sakkinen-price-card .swt-units__pack{
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 10px;
  align-items: center;
  margin-top: 8px;
  padding: 10px 12px;
  border-radius: 14px;
  border: 1px solid rgba(31,35,40,.10);
  background: #fff;
}

body.single-product .summary.entry-summary .sakkinen-price-card .sakkinen-pack-badges{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 4px 10px;
  border-radius: 999px;
  background: rgba(31,79,58,.10);
  color: rgba(31,79,58,1);
  font-weight: 800;
  font-size: 12px;
}

body.single-product .summary.entry-summary .sakkinen-price-card .sakkinen-pack-price{
  font-weight: 800;
  color: rgba(31,35,40,.78);
  font-size: 14px;
  white-space: nowrap;
}

@media (max-width: 640px){
  body.single-product .summary.entry-summary .sakkinen-price-card .swt-units__pack{
    grid-template-columns: 1fr;
    align-items: start;
  }
}