/* ============================================================
   STORE — WooCommerce
   Loaded only on shop, product, cart, checkout and account pages.
   Written against WooCommerce's own markup: no page builder in the
   way, so these are plain selectors with almost no !important.
   The tokens come from site.css.
   ============================================================ */

/* --- Header cart ------------------------------------------------ */
.hdr-cart{
  position:relative; flex:none; display:inline-flex; align-items:center; justify-content:center;
  width:44px; height:44px; border-radius:10px; color:#fff;
  background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.14);
  text-decoration:none;
  transition:background .18s var(--ease), border-color .18s var(--ease);
}
.hdr-cart:hover{background:rgba(255,255,255,.14); border-color:rgba(141,232,242,.5)}
.hdr-cart[aria-current="page"]{border-color:rgba(141,232,242,.6)}
/* Cyan is the world's accent, not an action colour, which is what a count is. */
.hdr-cart-count{
  position:absolute; top:-7px; right:-7px; min-width:20px; height:20px; padding:0 5px;
  border-radius:99px; background:var(--cyan); color:var(--ink);
  font:800 .6875rem/20px var(--font-display); text-align:center;
  box-shadow:0 0 0 2px var(--navy);
}
/* Five nav links, the number, the bag and the quote button do not fit
   between 900 and 1180px. The number steps out first; it is still in the
   footer, the hero and the contact band. */
@media (max-width:1180px) and (min-width:901px){ .hdr-tel{display:none} }

/* The page frame itself (paper ground, shell, page title) is in entry.css,
   which loads on every page except the home page, store pages included. */
.woocommerce-breadcrumb{
  margin:0 0 clamp(1.25rem,2.5vw,1.75rem); padding:0;
  font-size:.875rem; color:var(--body-soft);
}
.woocommerce-breadcrumb a{color:var(--blue-ink); text-decoration:none}
.woocommerce-breadcrumb a:hover{text-decoration:underline}

/* --- Shop page: the navy banner ---------------------------------
   The same plate as the home page's hero, without the video: circuit
   tile, blue and cyan glow, the brand's full stop in cyan. */
.nav a[aria-current="page"]{color:#fff; background:rgba(255,255,255,.08)}

.page-hero{
  position:relative; overflow:hidden; isolation:isolate;
  background:var(--navy); color:var(--on-navy);
  padding:clamp(3.5rem,7vw,5.5rem) 0 clamp(3rem,6vw,4.5rem);
}
.page-hero::before{
  content:""; position:absolute; inset:0; z-index:-2;
  background:var(--circuit) center / 240px 240px; opacity:.55;
}
.page-hero::after{
  content:""; position:absolute; inset:-20%; z-index:-1;
  background:
    radial-gradient(40% 60% at 18% 30%, rgba(59,108,224,.55), transparent 70%),
    radial-gradient(34% 50% at 82% 20%, rgba(55,213,230,.28), transparent 72%);
  filter:blur(12px);
}
.page-hero h1{color:#fff; font-size:clamp(2.75rem,6vw,4.5rem); font-weight:800; letter-spacing:-.035em}
.page-hero h1 .dot{color:var(--cyan)}
.page-hero-sub{margin-top:1rem; max-width:min(40rem,100%); font-size:clamp(1.0625rem,1.6vw,1.1875rem); color:var(--on-navy-2); line-height:1.6}

/* --- Shop page: banner promises --------------------------------- */
.shop-promises{
  list-style:none; margin:1.75rem 0 0; padding:0;
  display:flex; flex-wrap:wrap; gap:.75rem 1.75rem;
}
.shop-promises li{
  display:inline-flex; align-items:center; gap:.55rem;
  font-size:.9375rem; font-weight:700; color:var(--on-navy-2);
}
.shop-promises .ico{width:1.2rem; height:1.2rem; color:var(--cyan)}
.shop-promises a{color:#fff; text-decoration-color:rgba(141,232,242,.6)}
.shop-promises a:hover{text-decoration-color:#fff}
.page-hero :focus-visible{outline-color:var(--cyan)}

/* --- Shop page: the products band -------------------------------- */
.shop{background:var(--paper)}
.shop .shop-title{
  margin:0 0 clamp(1.75rem,3.5vw,2.5rem);
  font-size:clamp(2rem,4vw,3rem); font-weight:800; letter-spacing:-.032em; line-height:1.08;
}
.shop .shop-title::before{
  content:""; display:block; width:64px; height:4px; border-radius:99px; margin-bottom:1.5rem;
  background:linear-gradient(90deg,var(--blue),var(--cyan));
}
.shop .shop-group + .shop-group{margin-top:clamp(3.5rem,7vw,5.5rem)}
.shop-note{
  margin-top:clamp(2.5rem,5vw,3.5rem); padding-top:1.5rem; border-top:1px solid var(--line);
  font-size:.875rem; color:var(--body-soft);
}

/* --- Product grid -------------------------------------------------
   Every product list: the shop page, a category page and related
   products. WooCommerce lays these out with floats and percentage
   widths; a grid replaces all of it. */
.woocommerce ul.products{
  --cols:3;
  display:grid; grid-template-columns:repeat(var(--cols),minmax(0,1fr));
  gap:clamp(1.25rem,2.4vw,1.75rem); margin:0; padding:0; list-style:none;
}
.woocommerce ul.products::before,.woocommerce ul.products::after{content:none; display:none}
.woocommerce ul.products.columns-1{--cols:1}
.woocommerce ul.products.columns-2{--cols:2}
.woocommerce ul.products.columns-4,.woocommerce ul.products.columns-5,.woocommerce ul.products.columns-6{--cols:4}

/* WooCommerce ships float widths for these (30.75%, 48%, ...). Inside a grid
   a percentage resolves against the track, so the card would shrink to a
   third of its own cell. These selectors match WooCommerce's own weight and
   come later, so auto wins. */
.woocommerce ul.products li.product,
.woocommerce ul.products[class*="columns-"] li.product,
.woocommerce-page ul.products[class*="columns-"] li.product{
  position:relative; display:flex; flex-direction:column;
  width:auto; float:none; clear:none; margin:0; padding:0;
  background:var(--white); border:1px solid var(--line); border-radius:var(--r-lg);
  overflow:hidden; box-shadow:var(--shadow-sm); text-align:left; list-style:none;
  transition:transform .28s var(--ease), box-shadow .28s var(--ease), border-color .28s var(--ease);
}
.woocommerce ul.products li.product:hover{transform:translateY(-4px); box-shadow:var(--shadow-md); border-color:#C9D6EE}
.woocommerce ul.products li.product:focus-within{box-shadow:var(--shadow-md); border-color:var(--blue)}
/* The whole card is one link: one tab stop per product. */
.woocommerce ul.products li.product a.woocommerce-LoopProduct-link{
  display:flex; flex-direction:column; flex:1 1 auto; color:inherit; text-decoration:none;
}
.woocommerce ul.products li.product a.woocommerce-LoopProduct-link:focus-visible{outline-offset:-4px; border-radius:var(--r-lg)}

/* A white 4:3 plate with the photo contained, never cropped. */
.woocommerce ul.products li.product .shot{
  position:relative; display:block; aspect-ratio:4/3; margin:0;
  background:var(--white); border-bottom:1px solid var(--line); overflow:hidden;
}
.woocommerce ul.products li.product .shot img{
  position:absolute; inset:0; width:100%; height:100%; max-width:none;
  box-sizing:border-box; padding:clamp(1rem,4%,1.75rem); margin:0;
  object-fit:contain; border-radius:0;
  transition:transform .5s var(--ease);
}
.woocommerce ul.products li.product:hover .shot img{transform:scale(1.035)}

.woocommerce ul.products li.product .woocommerce-loop-product__title{
  margin:0; padding:clamp(1.25rem,2.4vw,1.6rem) clamp(1.25rem,2.4vw,1.6rem) 0;
  font-family:var(--font-display); font-weight:700; font-size:clamp(1.125rem,1.6vw,1.3125rem);
  line-height:1.25; letter-spacing:-.02em; color:var(--heading);
}

/* Condition badge, from the product's tag. One condition tag per product:
   Refurbished, New, New in box or Factory sealed. */
.woocommerce ul.products li.product[class*="product_tag-"] .woocommerce-loop-product__title::before,
.single-product div.product[class*="product_tag-"] .product_title::before{
  display:table; margin-bottom:.85rem;
  font:700 .6875rem/1 var(--font-display); letter-spacing:.09em; text-transform:uppercase;
  padding:.42rem .62rem; border-radius:99px; background:var(--card); color:var(--blue-ink);
}
.woocommerce ul.products li.product.product_tag-new .woocommerce-loop-product__title::before,
.single-product div.product.product_tag-new .product_title::before{content:"New"}
.woocommerce ul.products li.product.product_tag-new-in-box .woocommerce-loop-product__title::before,
.single-product div.product.product_tag-new-in-box .product_title::before{content:"New in box"}
.woocommerce ul.products li.product.product_tag-factory-sealed .woocommerce-loop-product__title::before,
.single-product div.product.product_tag-factory-sealed .product_title::before{content:"New \00B7  factory sealed"}
.woocommerce ul.products li.product.product_tag-refurbished .woocommerce-loop-product__title::before,
.single-product div.product.product_tag-refurbished .product_title::before{
  content:"Refurbished"; background:transparent; color:var(--heading); box-shadow:inset 0 0 0 1px var(--line);
}

/* Price and the "View details" cue sit on the card floor, so they line up
   across a row whatever the title length above them. */
.woocommerce ul.products li.product .price{
  display:flex; align-items:center; flex-wrap:wrap; gap:.6rem .75rem;
  margin:auto 0 0; padding:1.35rem clamp(1.25rem,2.4vw,1.6rem) clamp(1.25rem,2.4vw,1.6rem);
  font-family:var(--font-display); font-weight:800; font-size:clamp(1.5rem,2.4vw,1.75rem);
  letter-spacing:-.03em; line-height:1; color:var(--heading);
}
.woocommerce ul.products li.product .price del{font-size:.6em; font-weight:600; color:var(--body-soft); opacity:1}
.woocommerce ul.products li.product .price ins{text-decoration:none; background:none}
.woocommerce ul.products li.product .price::after{
  content:"View details"; margin-left:auto; display:inline-flex; align-items:center;
  padding:.8rem 2.65rem .8rem 1.2rem; border-radius:10px; color:#fff;
  background:var(--blue) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") no-repeat right 1rem center / 1.05rem;
  font:700 .9375rem/1.2 var(--font-display); letter-spacing:.01em;
  box-shadow:0 1px 2px rgba(42,82,184,.30), 0 10px 26px rgba(59,108,224,.36);
  transition:background-color .18s var(--ease), box-shadow .22s var(--ease);
}
.woocommerce ul.products li.product:hover .price::after{background-color:var(--blue-lift); box-shadow:0 2px 4px rgba(42,82,184,.30), 0 16px 36px rgba(59,108,224,.46)}
.woocommerce ul.products li.product.outofstock .price::after{
  content:"Sold out"; background:transparent; color:var(--body-soft); box-shadow:inset 0 0 0 1px var(--line); padding-right:1.2rem;
}
.woocommerce ul.products li.product.outofstock .shot img{opacity:.55}

.woocommerce span.onsale{
  position:absolute; top:1rem; left:1rem; right:auto; z-index:3;
  margin:0; min-width:0; min-height:0; padding:.42rem .65rem; line-height:1;
  border-radius:99px; background:var(--navy); color:#fff;
  font:700 .6875rem/1 var(--font-display); letter-spacing:.09em; text-transform:uppercase;
}

/* --- Product page -------------------------------------------------- */
.single-product div.product{position:relative; margin:0}
.single-product div.product > .product-top{
  position:relative; display:grid; grid-template-columns:minmax(0,1.08fr) minmax(0,1fr);
  gap:clamp(2rem,5vw,4.5rem); align-items:start;
}
.single-product div.product div.images,
.single-product div.product div.summary{float:none; width:auto; margin:0; padding:0}

.single-product .woocommerce-product-gallery{
  position:relative; margin:0; background:var(--white);
  border:1px solid var(--line); border-radius:var(--r-lg); overflow:hidden; box-shadow:var(--shadow-sm);
}
.single-product .woocommerce-product-gallery__image > a{display:block; position:relative; aspect-ratio:4/3}
.single-product .woocommerce-product-gallery__image > a > img{
  position:absolute; inset:0; width:100%; height:100%; max-width:none;
  box-sizing:border-box; padding:clamp(1.25rem,5%,2.75rem); margin:0; object-fit:contain;
}
.single-product .woocommerce-product-gallery__trigger{
  top:1rem; right:1rem; width:2.5rem; height:2.5rem; display:grid; place-items:center;
  background:var(--white); border:1px solid var(--line); border-radius:10px;
  box-shadow:var(--shadow-sm); z-index:5; font-size:0; color:var(--heading);
}
.single-product .flex-control-thumbs{
  display:flex; flex-wrap:wrap; gap:.6rem; margin:0; padding:1rem;
  border-top:1px solid var(--line); list-style:none;
}
.single-product .flex-control-thumbs li{width:4.5rem; float:none; margin:0; padding:0}
.single-product .flex-control-thumbs img{
  aspect-ratio:1; object-fit:contain; background:var(--white); padding:4px;
  border:1px solid var(--line); border-radius:8px; opacity:.6; cursor:pointer;
}
.single-product .flex-control-thumbs img.flex-active,.single-product .flex-control-thumbs img:hover{opacity:1; border-color:var(--blue)}

.single-product div.product .product_title{
  margin:0; padding:0;
  font-size:clamp(2rem,3.4vw,2.75rem); font-weight:800; letter-spacing:-.032em; line-height:1.1;
  color:var(--heading);
}
.single-product div.product .summary .price{
  margin:1rem 0 0; padding:0;
  font-family:var(--font-display); font-weight:800; font-size:clamp(1.75rem,3vw,2.25rem);
  letter-spacing:-.03em; line-height:1; color:var(--heading);
}
.single-product div.product .summary .price del{font-size:.55em; font-weight:600; color:var(--body-soft); opacity:1}
.single-product div.product .summary .price ins{text-decoration:none; background:none}

.woocommerce-product-details__short-description{margin-top:1.25rem}
.woocommerce-product-details__short-description p{
  margin:0; padding:0; font-size:1.0625rem; line-height:1.6; color:var(--body-soft);
}
/* The short description's bullet list becomes the spec chips. */
.woocommerce-product-details__short-description ul{
  list-style:none; margin:1.1rem 0 0; padding:0;
  display:flex; flex-wrap:wrap; gap:.4rem; line-height:1.3;
}
.woocommerce-product-details__short-description li{
  margin:0; font-size:.8125rem; color:var(--body);
  background:var(--white); border:1px solid var(--line); border-radius:8px; padding:.35rem .6rem;
}

.single-product div.product .summary .stock{
  display:inline-flex; align-items:center; gap:.5rem; margin:1.35rem 0 0;
  font:700 .875rem/1.2 var(--font-display); color:var(--blue-ink);
}
.single-product div.product .summary .stock.in-stock::before{
  content:""; width:.5rem; height:.5rem; border-radius:50%; background:currentColor;
}
.single-product div.product .summary .stock.out-of-stock{color:var(--body-soft)}

.single-product div.product form.cart{
  display:flex; flex-wrap:wrap; align-items:stretch; gap:.75rem; margin:1.35rem 0 0; padding:0;
}
.single-product div.product form.cart::before,
.single-product div.product form.cart::after{content:none; display:none}
.single-product div.product form.cart .quantity{float:none; margin:0; width:auto; display:flex}
/* Stock of one: WooCommerce hides the quantity box but keeps its wrapper. */
.single-product div.product form.cart .quantity:has(> input[type="hidden"]){display:none}
.woocommerce .quantity input.qty{
  width:5.25rem; min-height:3.4rem; padding:0 .5rem;
  border:1px solid #C3CEE3; border-radius:10px; background:var(--white);
  font:700 1.0625rem var(--font-display); color:var(--heading); text-align:center;
}
.woocommerce .quantity input.qty:focus{border-color:var(--blue); outline:0; box-shadow:0 0 0 3px rgba(59,108,224,.2)}

/* --- WooCommerce's own buttons ----------------------------------- */
.woocommerce a.button,.woocommerce button.button,.woocommerce input.button,.woocommerce #respond input#submit,
.woocommerce-page a.button,.woocommerce-page button.button,.woocommerce-page input.button{
  display:inline-flex; align-items:center; justify-content:center; gap:.55rem;
  background:var(--blue); color:#fff; border:1px solid transparent; border-radius:10px;
  font-family:var(--font-display); font-weight:700; font-size:.9375rem; line-height:1.2;
  letter-spacing:.01em; text-transform:none; text-decoration:none;
  padding:.85rem 1.5rem;
  box-shadow:0 1px 2px rgba(42,82,184,.30), 0 10px 26px rgba(59,108,224,.36);
  transition:background .18s var(--ease), box-shadow .22s var(--ease), transform .18s var(--ease);
}
.woocommerce a.button:hover,.woocommerce button.button:hover,.woocommerce input.button:hover,
.woocommerce-page a.button:hover,.woocommerce-page button.button:hover{
  background:var(--blue-lift); box-shadow:0 2px 4px rgba(42,82,184,.30), 0 16px 36px rgba(59,108,224,.46);
}
.woocommerce a.button:active,.woocommerce button.button:active{transform:translateY(1px)}
.woocommerce button.button:disabled,.woocommerce button.button.disabled{opacity:.55; cursor:not-allowed}
/* WooCommerce paints its "alt" buttons — add to cart, place order — purple,
   with one more class than the rule above, so they need matching weight. */
.woocommerce a.button.alt,.woocommerce button.button.alt,.woocommerce input.button.alt,
.woocommerce #respond input#submit.alt,
.woocommerce-page a.button.alt,.woocommerce-page button.button.alt,.woocommerce-page input.button.alt{
  background:var(--blue); color:#fff;
}
.woocommerce a.button.alt:hover,.woocommerce button.button.alt:hover,.woocommerce input.button.alt:hover,
.woocommerce-page a.button.alt:hover,.woocommerce-page button.button.alt:hover{background:var(--blue-lift); color:#fff}
.woocommerce button.button.alt:disabled,.woocommerce button.button.alt.disabled{background:var(--blue)}
.single-product div.product form.cart .single_add_to_cart_button{
  flex:1 1 14rem; float:none; font-size:1.0625rem; padding:1.05rem 1.9rem;
}

/* --- Ask on WhatsApp + buying notes ------------------------------ */
.buy-extra{margin-top:1rem; display:grid; gap:1.35rem}
.buy-ask{
  display:flex; align-items:center; justify-content:center; gap:.6rem; width:100%;
  padding:.95rem 1.5rem; border-radius:10px; background:var(--white); border:1px solid var(--line);
  color:var(--heading); font:700 .9375rem/1.2 var(--font-display); letter-spacing:.01em;
  text-decoration:none; transition:border-color .18s var(--ease), box-shadow .22s var(--ease);
}
.buy-ask:hover{border-color:var(--wa); box-shadow:var(--shadow-sm)}
.buy-ask .ico{width:1.3rem; height:1.3rem; color:var(--wa)}
.buy-notes{
  list-style:none; margin:0; padding:1.25rem 0 0;
  border-top:1px solid var(--line); display:grid; gap:.8rem;
}
.buy-notes li{
  display:flex; gap:.7rem; align-items:flex-start; margin:0; padding:0;
  font-size:.9375rem; line-height:1.5; color:var(--body);
}
.buy-notes .ico{width:1.25rem; height:1.25rem; margin-top:.12rem; color:var(--blue); flex:none}

.single-product div.product .product_meta{
  margin-top:1.35rem; padding-top:1.1rem; border-top:1px solid var(--line);
  display:flex; flex-wrap:wrap; gap:.35rem 1.25rem; font-size:.8125rem; color:var(--body-soft);
}
.single-product div.product .product_meta .tagged_as{display:none}
.single-product div.product .product_meta a{color:var(--blue-ink)}

/* --- Product tabs -------------------------------------------------- */
.woocommerce div.product .woocommerce-tabs{margin:clamp(3rem,6vw,5rem) 0 0; padding:0; border:0}
.woocommerce div.product .woocommerce-tabs ul.tabs{
  display:flex; flex-wrap:wrap; gap:.25rem; margin:0; padding:0;
  background:none; border:0; border-bottom:1px solid var(--line);
  border-radius:0; list-style:none;
}
.woocommerce div.product .woocommerce-tabs ul.tabs::before,
.woocommerce div.product .woocommerce-tabs ul.tabs::after{content:none; display:none; border:0}
.woocommerce div.product .woocommerce-tabs ul.tabs li{
  background:none; border:0; border-radius:0; margin:0; padding:0; box-shadow:none;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li::before,
.woocommerce div.product .woocommerce-tabs ul.tabs li::after{content:none; display:none}
.woocommerce div.product .woocommerce-tabs ul.tabs li a{
  display:block; padding:.9rem 1.1rem; margin-bottom:-1px;
  font:700 .9375rem/1.2 var(--font-display); color:var(--body-soft);
  border-bottom:3px solid transparent; text-decoration:none;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li a:hover{color:var(--heading)}
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a{color:var(--heading); border-bottom-color:var(--blue)}
.woocommerce div.product .woocommerce-tabs .panel{
  margin:0; padding:clamp(1.5rem,3vw,2.25rem) 0 0;
  background:none; border:0; box-shadow:none; max-width:72ch;
}
/* The tab already names the panel; WooCommerce repeats it as a heading. */
.woocommerce div.product .woocommerce-tabs .panel > h2:first-child{display:none}
.woocommerce div.product .woocommerce-tabs .panel h3{font-size:1.125rem; font-weight:700; margin:1.9rem 0 .6rem; padding:0}
.woocommerce div.product .woocommerce-tabs .panel > h3:first-child{margin-top:0}
.woocommerce div.product .woocommerce-tabs .panel p{margin:0 0 1rem; padding:0}
.woocommerce div.product .woocommerce-tabs .panel ul{margin:0 0 1rem; padding:0 0 0 1.2rem; list-style:disc; line-height:1.6}
.woocommerce div.product .woocommerce-tabs .panel li{margin:.25rem 0; padding:0}

.woocommerce table.woocommerce-product-attributes{
  width:100%; max-width:44rem; margin:0; border:0; border-collapse:separate; border-spacing:0;
  background:var(--white); border-radius:var(--r); overflow:hidden; box-shadow:0 0 0 1px var(--line);
}
.woocommerce table.woocommerce-product-attributes th,
.woocommerce table.woocommerce-product-attributes td{
  padding:.8rem 1.1rem; border:0; border-bottom:1px solid var(--line);
  background:none; text-align:left; vertical-align:top; font-style:normal;
}
.woocommerce table.woocommerce-product-attributes tr:last-child th,
.woocommerce table.woocommerce-product-attributes tr:last-child td{border-bottom:0}
.woocommerce table.woocommerce-product-attributes th{width:36%; font:700 .875rem/1.5 var(--font-display); color:var(--heading)}
.woocommerce table.woocommerce-product-attributes td{font-size:.9375rem; color:var(--body)}
.woocommerce table.woocommerce-product-attributes td p{margin:0; padding:0}

/* --- Related products -------------------------------------------- */
.single-product section.related.products,
.single-product section.up-sells{
  margin-top:clamp(3.5rem,7vw,5.5rem); padding-top:clamp(3rem,6vw,4.5rem); border-top:1px solid var(--line);
}
.single-product section.related.products > h2,
.single-product section.up-sells > h2{
  font-size:clamp(1.75rem,3vw,2.25rem); font-weight:800; letter-spacing:-.032em;
  margin:0 0 clamp(1.5rem,3vw,2rem); padding:0;
}

/* --- Notices ------------------------------------------------------ */
.woocommerce-message,.woocommerce-info,.woocommerce-error{
  display:flex; flex-wrap:wrap; align-items:center; gap:.75rem 1.25rem;
  margin:0 0 1.75rem; padding:1rem 1.25rem; list-style:none;
  background:var(--card); color:var(--heading);
  border:1px solid #C9D6EE; border-radius:12px; font-size:.9375rem;
}
.woocommerce-error{background:#FDEEEC; border-color:#F1BDB6; color:#7A1D14}
.woocommerce-message::before,.woocommerce-info::before,.woocommerce-error::before{content:none; display:none}
.woocommerce-message .button,.woocommerce-info .button{order:2; margin-left:auto}
.woocommerce-message a:not(.button),.woocommerce-info a:not(.button){color:var(--blue-ink)}

/* --- Cart and Checkout (WooCommerce blocks) ----------------------- */
.wp-block-woocommerce-cart,.wp-block-woocommerce-checkout{font-family:var(--font-body); color:var(--body)}
.wc-block-cart .wc-block-components-sidebar{
  background:var(--white); border:1px solid var(--line); border-radius:var(--r-lg);
  box-shadow:var(--shadow-sm); padding:clamp(1.25rem,2.5vw,1.75rem);
}
.wp-block-woocommerce-checkout-order-summary-block:not(.checkout-order-summary-block-fill-wrapper),
.wp-block-woocommerce-checkout-order-summary-block .checkout-order-summary-block-fill{
  background:var(--white); border:1px solid var(--line); border-radius:var(--r-lg);
  box-shadow:var(--shadow-sm); overflow:hidden;
}
/* On phones the summary is a collapsible bar above the form, and a second
   copy sits above Place Order. Inside the card, its own rules would double
   the border and its title would touch the edge. */
.wp-block-woocommerce-checkout-order-summary-block .wc-block-components-checkout-order-summary__title{
  border-top:0; border-bottom:0; padding-right:16px;
}
.wp-block-woocommerce-checkout-order-summary-block .wc-block-components-checkout-order-summary__title-text{margin-left:16px}
.wp-block-woocommerce-checkout-order-summary-block .wc-block-components-checkout-order-summary__content.is-open{
  border-bottom:0; border-top:1px solid var(--line);
}
.wc-block-components-sidebar-layout.is-mobile .wp-block-woocommerce-checkout-order-summary-block:not(.checkout-order-summary-block-fill-wrapper) .wc-block-components-checkout-order-summary__content,
.wc-block-components-sidebar-layout.is-small .wp-block-woocommerce-checkout-order-summary-block:not(.checkout-order-summary-block-fill-wrapper) .wc-block-components-checkout-order-summary__content{
  padding:0 16px;
}
.wp-block-woocommerce-checkout-order-summary-block.checkout-order-summary-block-fill-wrapper{
  background:none; border:0; box-shadow:none; overflow:visible;
}
.wc-block-cart__totals-title,.wc-block-components-title,.wc-block-components-checkout-step__title,
.wc-block-components-checkout-order-summary__title-text{font-family:var(--font-display); color:var(--heading)}
.wc-block-components-checkout-step__title{font-weight:700; font-size:1.25rem; letter-spacing:-.01em}
.wc-block-cart__totals-title{font-weight:700; letter-spacing:.1em}
.wc-block-cart-items__header th{font-family:var(--font-display); font-weight:700; letter-spacing:.1em; color:var(--body-soft)}
.wc-block-cart-items,.wc-block-cart-items td,.wc-block-cart-items th,
.wc-block-components-totals-wrapper,.wc-block-components-panel{border-color:var(--line)}
.wc-block-components-product-name{
  font-family:var(--font-display); font-weight:700; font-size:1rem;
  color:var(--heading); text-decoration:none;
}
a.wc-block-components-product-name:hover{color:var(--blue-ink)}
.wc-block-cart-item__image img,.wc-block-components-order-summary-item__image img{
  aspect-ratio:1; object-fit:contain; background:var(--white);
  border:1px solid var(--line); border-radius:10px; padding:4px;
}
.wc-block-cart-item__total .wc-block-components-product-price,
.wc-block-components-totals-footer-item .wc-block-components-totals-item__value,
.wc-block-components-totals-footer-item .wc-block-components-totals-item__label{
  font-family:var(--font-display); font-weight:800; color:var(--heading);
}
.wc-block-cart-item__remove-link{color:var(--body-soft)}
.wc-block-components-button:not(.is-link){
  background:var(--blue); color:#fff; border:0; border-radius:10px;
  font-family:var(--font-display); font-weight:700; font-size:1.0625rem;
  letter-spacing:.01em; text-transform:none; text-decoration:none; min-height:3.4rem;
  box-shadow:0 1px 2px rgba(42,82,184,.30), 0 10px 26px rgba(59,108,224,.36);
  transition:background .18s var(--ease), box-shadow .22s var(--ease);
}
.wc-block-components-button:not(.is-link):hover{background:var(--blue-lift)}
.wc-block-components-button:not(.is-link):focus-visible{outline:3px solid var(--blue); outline-offset:3px}
.wc-block-components-button.is-link,.wc-block-components-panel__button,
.wc-block-components-totals-coupon-link,.wc-block-checkout__terms a{color:var(--blue-ink)}
.wc-block-components-text-input input[type],.wc-block-components-text-input textarea,
.wc-block-components-textarea,.wc-blocks-components-select .wc-blocks-components-select__select,
.wc-block-components-combobox .wc-block-components-combobox-control input{
  border:1px solid #C3CEE3; border-radius:10px;
  background-color:var(--white); color:var(--heading);
}
.wc-blocks-components-select .wc-blocks-components-select__container{border-radius:10px; background:var(--white)}
.wc-block-components-text-input input[type]:focus,.wc-block-components-textarea:focus,
.wc-blocks-components-select .wc-blocks-components-select__select:focus{
  border-color:var(--blue); box-shadow:0 0 0 3px rgba(59,108,224,.2); outline:0;
}
.wc-block-components-text-input.has-error input[type]{border-color:#C8322A}
.wc-block-components-radio-control__input{border-color:#8E9CB8}
.wc-block-components-radio-control__input:checked{border-color:var(--blue)}
.wc-block-components-radio-control__input:checked::before{background:var(--blue)}
.wc-block-components-radio-control--highlight-checked .wc-block-components-radio-control__option--checked-option-highlighted,
.wc-block-components-radio-control--highlight-checked .wc-block-components-radio-control-accordion-option--checked-option-highlighted{
  box-shadow:inset 0 0 0 2px var(--blue); border-radius:12px;
}
.wc-block-components-radio-control__label{font-family:var(--font-display); font-weight:700; color:var(--heading)}
.wc-block-components-checkbox .wc-block-components-checkbox__input[type=checkbox]{border-color:#8E9CB8; border-radius:5px}
.wc-block-components-checkbox .wc-block-components-checkbox__input[type=checkbox]:checked{background:var(--blue); border-color:var(--blue)}
.wc-block-components-checkbox .wc-block-components-checkbox__mark{fill:#fff}
.wc-block-checkout .wc-block-checkout__shipping-method-option{
  border:1px solid var(--line); border-radius:12px;
  background:var(--white); color:var(--heading); box-shadow:none;
}
.wc-block-checkout .wc-block-checkout__shipping-method-option--selected{border-color:var(--blue); box-shadow:inset 0 0 0 1px var(--blue)}
.wc-block-checkout .wc-block-checkout__shipping-method-option-title{font-family:var(--font-display); font-weight:700}
.wc-block-components-notice-banner{border-radius:12px}

/* --- My account --------------------------------------------------- */
.woocommerce-account .woocommerce-MyAccount-navigation ul{list-style:none; margin:0; padding:0; display:grid; gap:.25rem}
.woocommerce-account .woocommerce-MyAccount-navigation li{margin:0; padding:0}
.woocommerce-account .woocommerce-MyAccount-navigation a{
  display:block; padding:.7rem 1rem; border-radius:10px; text-decoration:none;
  font:700 .9375rem/1.2 var(--font-display); color:var(--body);
}
.woocommerce-account .woocommerce-MyAccount-navigation .is-active a,
.woocommerce-account .woocommerce-MyAccount-navigation a:hover{background:var(--white); color:var(--heading); box-shadow:inset 0 0 0 1px var(--line)}
.woocommerce form.login,.woocommerce form.register,.woocommerce form.lost_reset_password{
  background:var(--white); border:1px solid var(--line); border-radius:var(--r-lg);
  padding:clamp(1.25rem,3vw,2rem); margin:0 0 2rem;
}
.woocommerce form .form-row input.input-text,.woocommerce form .form-row textarea,.woocommerce form .form-row select{
  border:1px solid #C3CEE3; border-radius:10px; background:var(--white);
  padding:.8rem 1rem; font-size:1rem; color:var(--heading); box-shadow:none;
}
.woocommerce form .form-row input.input-text:focus,.woocommerce form .form-row textarea:focus{
  border-color:var(--blue); outline:0; box-shadow:0 0 0 3px rgba(59,108,224,.2);
}
.woocommerce form .form-row label{font-weight:700; color:var(--heading)}

/* --- Order received ----------------------------------------------- */
.woocommerce-order .woocommerce-thankyou-order-received{
  font:800 clamp(1.5rem,3vw,2rem)/1.2 var(--font-display); color:var(--heading);
  letter-spacing:-.02em; margin-bottom:1.5rem;
}
.woocommerce ul.order_details{
  list-style:none; display:flex; flex-wrap:wrap; gap:1rem 2rem; margin:0 0 2rem;
  padding:1.25rem 1.5rem; background:var(--white); border:1px solid var(--line); border-radius:var(--r-lg);
}
.woocommerce ul.order_details li{
  margin:0; padding:0; border:0; float:none;
  font-size:.75rem; letter-spacing:.08em; text-transform:uppercase; color:var(--body-soft);
}
.woocommerce ul.order_details li strong{
  display:block; margin-top:.3rem; font:700 1rem/1.3 var(--font-display);
  letter-spacing:0; text-transform:none; color:var(--heading);
}
.woocommerce table.shop_table{
  border:1px solid var(--line); border-radius:var(--r); background:var(--white); border-collapse:separate;
}
.woocommerce table.shop_table th,.woocommerce table.shop_table td{border-color:var(--line)}

/* --- Responsive ---------------------------------------------------- */
@media (max-width:1040px){
  .woocommerce ul.products.columns-4,.woocommerce ul.products.columns-5,.woocommerce ul.products.columns-6{--cols:3}
}
@media (max-width:900px){
  .woocommerce ul.products.columns-3,.woocommerce ul.products.columns-4,
  .woocommerce ul.products.columns-5,.woocommerce ul.products.columns-6{--cols:2}
  .single-product div.product > .product-top{grid-template-columns:1fr}
}
@media (max-width:760px){
  .woocommerce ul.products{--cols:1 !important}
}
@media (max-width:620px){
  /* Keeps "Description" and "Additional information" on one line on a phone. */
  .woocommerce div.product .woocommerce-tabs ul.tabs{flex-wrap:nowrap; gap:0}
  .woocommerce div.product .woocommerce-tabs ul.tabs li a{padding:.85rem .7rem; font-size:.875rem; white-space:nowrap}
}