/**
 * @package global.css
 * @author Simply Wired Inc. <info@simplywired.ca>
 * @copyright (c) 2026, Simply Wired Inc.
 * @version 0.0.1
 */

:root {
  --focus-color: #ffffff;
  --header-height: 0px;
  --link-color: #ffffff;
  --product-color-border:rgb(209, 213, 219);
  --product-color-card:rgb(255, 255, 255);
  --product-color-focus:rgb(245, 158, 11);
  --product-color-muted:rgb(107, 114, 128);
  --product-color-primary:rgb(45, 70, 73);
  --product-color-primary-dark:rgb(31, 52, 55);
  --product-color-text:rgb(31, 41, 55);
  --product-radius:0.75rem;
  --shopping-cart-color-border:rgb(216, 222, 232);
  --shopping-cart-color-muted:rgb(93, 104, 123);
  --shopping-cart-color-primary-dark:rgb(27, 46, 48);
  --shopping-cart-color-primary:rgb(45, 70, 73);
  --shopping-cart-color-surface:rgb(255, 255, 255);
  --shopping-cart-color-text:rgb(23, 32, 51);
  --shopping-cart-radius:.75rem;
  --shopping-shadow:0 .5rem 1.5rem rgba(23, 32, 51, 0.08);
}
* {
  box-sizing:border-box;
}
.association-logos {
  display: grid;
  gap:1rem;
  grid-template-columns:repeat(4, minmax(0, 1fr));
  width:min(100%, 1200px);
}
.association-logos img {
  aspect-ratio:1 / 1;
  border-radius:.5rem;
  display:block;
  object-fit:cover;
  width:100%;
}
@media(max-width:700px) {
  .association-logos {
    grid-template-columns:1fr;
  }
}
body {
  color:rgb(134, 147, 158);
  font-family:"Roboto", Arial, Helvetica, sans-serif;
  font-size:1rem;
  font-weight:400;
  line-height:1.875rem;
  margin:0;
  padding-top:var(--header-height);
}
body > header {
  background-color:rgb(67, 81, 94);
  box-shadow:0 0.125rem 0.5rem rgba(0, 0, 0, 0.18);
  left:0;
  position:fixed;
  right:0;
  top:0;
  width:100%;
  z-index:1000;
}
body > header > .container {
  align-items:center;
  display:flex;
  gap:2rem;
  justify-content:space-between;
  min-height:10.5rem;
  padding:0 2rem;
  transition:min-height 250ms ease;
}
@media(max-width:56.25rem) {
  body > header > .container {
    flex-direction:column;
    gap:1rem;
    justify-content:center;
    min-height:auto;
    padding:1rem;
  }
}
.book-layout {
  align-items:start;
  display:grid;
  gap:2rem;
  grid-template-columns:30rem 1fr;
}
.book-layout img {
  display:block;
  height:auto;
  width:100%;
}
@media (max-width: 40rem) {
  .book-layout {
    grid-template-columns:1fr;
  }
}
.book-purchase {
  align-items:center;
  display:flex;
  flex-direction:row !important;
  gap:1.25rem;
  justify-content:center;
  margin-top:1rem;
}
.book-purchase > input {
  flex:1 1 auto;
}
.book-purchase > .price {
  color:rgb(34, 34, 34);
  font-family:"Roboto", Arial, Helvetica, sans-serif;
  font-size:1.375rem;
}
.book-reviews {
  color:rgb(30, 41, 59);
  margin:2rem auto 0 auto;
  padding:0;
}
.book-reviews > div {
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:1rem;
  margin-top:2rem;
}
@media(max-width:40rem) {
  .book-reviews > div {
    grid-template-columns:1fr;
  }
}
.book-reviews > div > figure {
  background:rgb(248, 250, 252);
  border:1px solid rgb(219, 227, 236);
  border-radius:1rem;
  display:flex;
  flex-direction:column;
  margin:0;
  min-height:100%;
  padding:clamp(1.25rem, 3vw, 2rem);
}
.book-reviews > div > figure blockquote {
  font-size:clamp(1.05rem, 2vw, 1.25rem);
  line-height:1.6;
  margin:0 0 1.5rem;
}
.book-reviews > div > figure blockquote p {
  margin:0;
}
.book-reviews > div > figure figcaption {
  color:rgb(100, 116, 139);
  display:flex;
  flex-direction:column;
  font-size:.9rem;
  gap:0.35rem 0.75rem;
  margin-top:auto;
}
.book-reviews > div > figure figcaption > .reviewer-name {
  color:rgb(30, 41, 59);
  font-weight:700;
}
.cards {
  align-items:stretch;
  display: grid;
  gap:1.5rem;
  grid-template-columns:repeat(auto-fit, minmax(15rem, 1fr));
  margin:2.5rem auto;
  width:min(68.75rem, 92%);
}
.card {
  background:rgb(255, 255, 255);
  border-radius:.75rem;
  box-shadow:0 .25rem 0.875rem rgb(0 0 0 / 12%);
  color:inherit;
  display:flex;
  flex-direction:column;
  overflow:hidden;
  text-decoration:none;
  transition:transform 0.2s ease, box-shadow 0.2s ease;
}
.card:hover {
  transform: translateY(-5px);
  box-shadow: 0 8px 22px rgb(0 0 0 / 18%);
}
.card-content {
  display:flex;
  flex:1;
  flex-direction:column;
  padding:1.125rem;
}
.card-content h2 {
  min-height: 3.2rem;
  margin: 0 0 0.5rem;
}
.card-content p {
  color:rgb(102, 102, 102);
  line-height:1.5;
  margin:0;
}
.card-image-wrapper {
  object-fit:contain;
}
.card-image-wrapper img {
  display:block;
  height:100%;
  object-fit:cover;
  width:100%;
}
.cart-indicator > a {
  align-items:center;
  display:inline-flex;
  font-size:1.75rem !important;
  gap:0.4rem;
}
.cart-indicator > a > span {
  align-items:center;
  background:rgb(79, 195, 163);
  border-radius:999px;
  color:rgb(255, 255, 255);
  display:inline-flex;
  font-size:0.75rem;
  font-weight:700;
  height:1.35rem;
  justify-content:center;
  line-height:1;
  min-width:1.35rem;
  padding:0 0.3rem;
}
.clear {
  clear:both;
}
.container {
  margin-left:auto;
  margin-right:auto;
  padding-left:.75rem;
  padding-right:.75rem;
  width:100%;
}
@media(min-width:576px) {
  .container {
    max-width:540px;
  }
}
@media(min-width:768px) {
  .container {
    max-width:720px;
  }
}
@media(min-width:992px) {
  .container {
    max-width:960px;
  }
}
@media(min-width:1200px) {
  .container {
    max-width:1140px;
  }
}
@media(min-width:1400px) {
  .container {
    max-width:1320px;
  }
}
.container > .form-wrapper {
  display:flex;
  width:100%;
}
.container > .form-wrapper > form {
  margin:0 auto;
  max-width:48rem;
  width:100%;
}
.divider {
  background:linear-gradient( to right, rgb(255, 255, 255) 0, rgb(255, 255, 255) calc(50% - 3.125rem), rgb(100, 135, 194) calc(50% - 3.125rem), rgb(100, 135, 194) calc(50% + 3.125rem), rgb(255, 255, 255) calc(50% + 3.125rem), rgb(255, 255, 255) 100%);
  border:0;
  height:.125rem;
  margin:2rem 0 3rem 0;
  width:100%;
}
.empty-cart {
  color:var(--shopping-cart-color-muted);
  padding:2rem 1rem;
  text-align:center;
}
footer {
  border-top:1px solid rgb(235, 235, 235);
  margin-bottom:2rem;
  margin-top:4rem;
  padding-top:2rem;
  width:100%;
}
footer a, footer a:visited, main a, main a:visited {
  color:rgb(100, 135, 194);
  text-decoration:none;
}
footer a:active, footer a:hover, main a:active, main a:hover {
  color:rgb(79, 195, 163);
}
footer > .container {
  font-size:.865rem;
  text-align:center;
  width:100%;
}
.form {
  display:flex;
  flex-direction:column;
  gap:.75rem;
}
.form button, input[type=submit] {
  background-color:rgb(45, 70, 73);
  border:0;
  color:rgb(255, 255, 255);
  cursor:pointer;
  display:inline-block;
  font-family:"Roboto", Arial, Helvetica, sans-serif;
  font-size:14px;
  font-weight:700;
  line-height:22px;
  margin:0;
  min-width:135px;
  outline:rgb(255, 255, 255) none 0;
  overflow:hidden;
  padding:12.5px 15px;
  position:relative;
  text-align:center;
  text-transform:uppercase;
  touch-action:manipulation;
  user-select:none;
  vertical-align:middle;
}
.form div:has(input):has(label) > input:not([type=submit]) ~ label {
  color:rgb(170, 170, 170);
  display:block;
  font-family:"Roboto", Arial, Helvetica, sans-serif;
  font-size:.825rem;
  font-weight:400;
  line-height:1.375rem;
  margin:1px 0 0 1px;
  max-width:100%;
  padding:0;
  -webkit-tap-highlight-color:rgba(0, 0, 0, 0);
}
.form div:has(input):has(label) > input:not([type=submit]) {
  width:100%;
}
.form input:not([type=submit]) {
  background-color:rgba(0, 0, 0, 0);
  border:.125rem solid rgb(225, 226, 228);
  color:rgb(85, 85, 85);
  cursor:text;
  display:block;
  font-family:"Roboto", Arial, Helvetica, sans-serif;
  font-size:1rem;
  font-weight:400;
  height:2.8125rem;
  line-height:1.45rem;
  margin:0;
  padding:5px .5rem;
  -webkit-tap-highlight-color:rgba(0, 0, 0, 0);
  -webkit-border-image:none;
}
.form fieldset legend, .form label {
  color:rgb(17, 35, 55);
  font-family:"Roboto", Arial, Helvetica, sans-serif;
  font-size:.875rem;
  font-weight:500;
  line-height:1.25rem;
  -webkit-tap-highlight-color:rgba(0, 0, 0, 0);
}
.form fieldset label {
  color:rgb(88, 94, 106);
  font-weight:400;
}
.form label > span:empty::before, .form legend > span:empty::before {
  color:rgb(121, 0, 0);
  content:"*";
  font-family:"Roboto", Arial, Helvetica, sans-serif;
  font-size:1rem;
  font-weight:700;
  margin-inline-start:.25rem;
}
.form fieldset {
  border:0;
  margin:0;
  padding:0;
}
.form textarea {
  background-color:rgba(0, 0, 0, 0);
  border:2px solid rgb(225, 226, 228);
  color:rgb(85, 85, 85);
  column-count:auto;
  cursor:text;
  display:block;
  font-family:"Roboto", Arial, Helvetica, sans-serif;
  font-size:1rem;
  font-weight:400;
  height:10rem;
  line-height:1.5rem;
  margin:0;
  max-width:100%;
  min-height:8.125rem;
  overflow-wrap:break-word;
  padding:.375rem .5rem;
  resize:none;
  width:100%;
  -webkit-tap-highlight-color:rgba(0, 0, 0, 0);
}
.grid-2 {
  display:grid;
  gap:1rem;
  grid-template-columns:repeat(2, minmax(0, 1fr));
}
@media(max-width:40rem) {
  .grid-2 {
    grid-template-columns:1fr;
  }
}
.grid-2 > figure {
  padding-bottom:1.25rem;
  padding-top:1.25rem;
}
.grid-2 > figure > img {
  border-radius:.25rem;
}
h1 {
  color:rgb(67, 81, 94);
  display:block;
  font-family:"Roboto", Arial, Helvetica, sans-serif;
  font-size:2.5rem;
  font-weight:300;
  line-height:2.875rem;
  margin-bottom:1.875rem;
  margin-top:1.875rem;
  padding:0;
}
h2 {
  color:rgb(67, 81, 94);
  display:block;
  font-family:"Roboto", Arial, Helvetica, sans-serif;
  font-size:2.25rem;
  font-weight:300;
  line-height:2.625rem;
  margin-bottom:0;
  margin-top:0;
}
h3 {
  color:rgb(67, 81, 94);
  display:block;
  font-family:"Roboto", Arial, Helvetica, sans-serif;
  font-size:2rem;
  font-weight:300;
  line-height:2.425rem;
  margin-bottom:0;
  margin-top:0;
}
header.is-scrolled > .container {
  min-height:4rem;
}
@media(max-width:56.25rem) {
  header.is-scrolled .container {
    min-height:auto;
  }
}
.heading-centered {
  font-family:"Roboto", Arial, Helvetica, sans-serif;
  font-size:2.5rem;
  font-weight:300;
  margin:0 auto 3rem auto;
  padding-bottom:2rem;
  position:relative;
  text-align:center;
  width:fit-content;
}
.heading-centered::after {
  background-color:rgb(94, 182, 220);
  bottom:0;
  content:"";
  height:2px;
  left:50%;
  position:absolute;
  transform:translateX(-50%);
  width:100px;
}
.heading-left {
  font-family:"Roboto", Arial, Helvetica, sans-serif;
  font-size:2.5rem;
  font-weight:300;
  margin:0 0 3rem 0;
  padding-bottom:2rem;
  position:relative;
  width:fit-content;
}
.heading-left::after {
  background-color:rgb(94, 182, 220);
  bottom:0;
  content:"";
  height:2px;
  left:0;
  position:absolute;
  width:100px;
}
.hide {
  display:none;
}
.homepage-articles {
  display:flex;
  flex-wrap:wrap;
  gap:1rem;
}
.homepage-associations {
  align-items:center;
  display:grid;
  gap:1rem;
  grid-template-columns:repeat(4, minmax(0, 1fr));
  justify-content:center;
  margin-top:3rem;
}
.homepage-associations img {
  height:auto;
  width:100%;
}
.homepage-before-and-after {
  clear:both;
}
.homepage-before-and-after .homepage-before-after-grid {
  display:flex;
  flex-direction:column;
  width:100%;
}
.homepage-before-and-after .homepage-before-after-grid > .homepage-before-after-grid-divider {
  background-color:rgb(94, 182, 220);
  height:.125rem;
  margin:3.25rem auto;
  width:27.5rem;
}
@media(max-width:37.5rem) {
  .homepage-before-and-after .homepage-before-after-grid > .homepage-before-after-grid-divider {
    margin:.875rem 0;
  }
}
.homepage-before-and-after .homepage-before-after-grid > .homepage-before-after-row {
  display:grid;
  gap:1rem;
  grid-template-columns:repeat(2, minmax(0, 1fr));
}
@media(max-width:37.5rem) {
  .homepage-before-and-after .homepage-before-after-grid > .homepage-before-after-row {
    gap:.5rem;
  }
}
.homepage-before-and-after .homepage-before-after-grid > .homepage-before-after-row img {
  aspect-ratio:auto 600 / 400;
  border-radius:.325rem;
  height:auto;
  max-width:100%;
  width: 600px;
}
.homepage-grey {
  background-color:rgb(247, 247, 247);
  clear:both;
  padding-bottom:3.75rem;
  padding-top:5.625rem;
}
.homepage-mailing-list {
  background-color:rgb(100, 135, 194);
}
.homepage-mailing-list > .container {
  align-items:center;
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding-bottom:3rem;
  padding-top:3rem;
}
.homepage-mailing-list > .container > a {
  align-items:center;
  background-color:rgb(79, 195, 163);
  color:rgb(255, 255, 255);
  cursor:pointer;
  display:inline-flex;
  font-family:"Roboto", Arial, Helvetica, sans-serif;
  font-size:0.875rem;
  font-weight:500;
  justify-content:center;
  line-height:1.125rem;
  margin:0;
  outline:rgb(255, 255, 255) none 0;
  padding:.8125rem 1.8125rem;
  position:relative;
  text-align:center;
  text-decoration-line:none;
  text-transform:uppercase;
}
.homepage-mailing-list > .container > a > i {
  margin-right:.75rem;
}
.homepage-mailing-list > .container > h3 {
  color:rgb(255, 255, 255);
  font-family:"Roboto", Arial, Helvetica, sans-serif;
  font-size:2.8125rem;
  font-weight:300;
  margin-bottom:3rem;
}
.homepage-white {
  background-color:rgb(255, 255, 255);
  clear:both;
  padding-bottom:3.75rem;
  padding-top:5.625rem;
}
.hp-field {
  height:1px;
  left:-10000px;
  overflow:hidden;
  position:absolute;
  width:1px;
}
html {
  scroll-behavior:smooth;
}
@media(prefers-reduced-motion:reduce) {
  html {
    scroll-behavior:auto;
  }
}
.image-left {
  float:left;
  margin:1rem 1.5rem 0 0;
}
.image-right {
  float:right;
  margin:0 0 1rem 1.5rem;
}
.list-blue {
  list-style:none;
  padding-left:0;
}
.list-blue li {
  padding-left:1.5rem;
  position:relative;
}
.list-blue li::before {
  color:rgb(94, 182, 220);
  content:"\f192";
  font-family:"Font Awesome 7 Free", serif;
  font-weight:900;
  line-height:1;
  position:absolute;
  left:0;
  margin-top:.325rem;
}
.mailer-container {
  align-items:center;
  display:flex;
  flex-direction:column;
  justify-content:center;
}
main {
  padding-top:3rem;
}
.main-navigation a {
  color:rgb(255, 255, 255);
  font-family:"Roboto", Arial, Helvetica, sans-serif;
  font-size:1rem;
  font-weight:400;
  line-height:1.4;
  text-decoration:none;
  transition:color 180ms ease;
  white-space:nowrap;
}
.main-navigation a[aria-current="page"], .main-navigation a.active, .main-navigation a:focus-visible, .main-navigation a:hover {
  color:rgb(79, 195, 163);
}
.main-navigation ul {
  align-items:center;
  display:flex;
  gap:clamp(1rem, 2.5vw, 2.5rem);
  justify-content:flex-end;
  list-style:none;
  margin:0;
  padding:0;
}
@media(max-width:56.25rem) {
  .main-navigation ul {
    flex-wrap:wrap;
    gap:0.75rem 1.25rem;
    justify-content:center;
  }
}
.mt-2 {
  margin-top:2rem;
}
.mt-3 {
  margin-top:3rem;
}
.mt-4 {
  margin-top:4rem;
}
.product-section {
  margin:0 auto;
  width:min(100%, 1200px);
}
.product-section > .product-grid {
  display:grid;
  gap:1.5rem;
  grid-template-columns:repeat(auto-fit, minmax(240px, 1fr));
  list-style:none;
  margin:0;
  padding:0;
}
.product-section > .product-grid > li > .product-card {
  background:var(--product-color-card);
  border-radius:var(--product-radius);
  border:1px solid var(--product-color-border);
  box-shadow:0 0.25rem 1rem rgb(0 0 0 / 8%);
  display:flex;
  flex-direction:column;
  min-height:100%;
  overflow:hidden;
  position:relative;
  transition:box-shadow 160ms ease, transform 160ms ease;
}
@media (prefers-reduced-motion:reduce) {
  .product-section > .product-grid > li > .product-card {
    transition:none;
  }
}
.product-section > .product-grid > li > .product-card:hover {
  box-shadow:0 0.75rem 1.5rem rgb(0 0 0 / 12%);
  transform:translateY(-0.2rem);
}
@media (prefers-reduced-motion:reduce) {
  .product-section > .product-grid > li > .product-card:hover {
    transform:none;
  }
}
.product-section > .product-grid > li > .product-card > .product-card-actions {
  display:flex;
  padding:0 1rem 1rem;
  position:relative;
  z-index:2;
}
.product-section > .product-grid > li > .product-card > .product-card-actions > .product-card-button {
  background:var(--product-color-primary);
  border-radius:0.45rem;
  border:0;
  color:rgb(255, 255, 255);
  cursor:pointer;
  font:inherit;
  font-weight:700;
  min-height:2.75rem;
  padding:0.65rem 1rem;
  width:100%;
}
.product-section > .product-grid > li > .product-card > .product-card-actions > .product-card-button:hover {
  background:var(--product-color-primary-dark);
}
.product-section > .product-grid > li > .product-card > .product-card-actions > .product-card-button:focus-visible {
  outline:0.2rem solid var(--product-color-focus);
  outline-offset:0.2rem;
}
.product-section > .product-grid > li > .product-card > .product-card-link {
  color:inherit;
  display:flex;
  flex-direction:column;
  flex:1;
  position:relative;
  text-decoration:none;
}
.product-section > .product-grid > li > .product-card > .product-card-link::after {
  content:"";
  inset:0;
  position:absolute;
  z-index:1;
}
.product-section > .product-grid > li > .product-card > .product-card-link:focus-visible {
  outline:0.2rem solid var(--product-color-focus);
  outline-offset:-0.2rem;
}
.product-section > .product-grid > li > .product-card > .product-card-link > .product-card-body {
  display:flex;
  flex:1;
  flex-direction:column;
  gap:0.5rem;
  padding:1rem;
}
.product-section > .product-grid > li > .product-card > .product-card-link > .product-card-body > .product-card-description {
  color:var(--product-color-muted);
  font-size:0.95rem;
  margin:0;

  line-clamp: 5;
  -webkit-line-clamp: 5;
  -webkit-box-orient: vertical;
  display: -webkit-box;
  overflow: hidden;
  line-height: 1.5;
  max-height: calc(1.5em * 5);
}
.product-section > .product-grid > li > .product-card > .product-card-link > .product-card-body > .product-card-price {
  font-size:1.2rem;
  font-weight:700;
  margin-top:auto;
  padding-top:0.75rem;
}
.product-section > .product-grid > li > .product-card > .product-card-link > .product-card-body > .product-card-title {
  font-size:1.15rem;
  line-height:1.25;
  margin:0;
}
.product-section > .product-grid > li > .product-card > .product-card-link > .product-card-image {
  aspect-ratio:7 / 10;
  background:rgb(255, 255, 255);
  border-bottom:1px solid #e5e7eb;
  display:block;
  object-fit:contain;
  object-position:top;
  width:100%;
}
.product-section > .product-section-title {
  font-size:clamp(1.5rem, 3vw, 2rem);
  margin:0 0 1.5rem;
}
.shopping-cart {
  align-items:start;
  display:grid;
  gap:2rem;
  grid-template-columns:minmax(0, 1.6fr) minmax(300px, 0.9fr);
}
@media(max-width:47.5rem) {
  .shopping-cart {
    gap:1rem;
    grid-template-columns:1fr;
  }
}
.shopping-cart > aside {
  padding:1.5rem;
  position:sticky;
  top:1.25rem;
}
@media (max-width:47.5rem) {
  .shopping-cart > aside {
    position:static;
  }
}
.shopping-cart > aside, .shopping-cart > section {
  background:var(--shopping-cart-color-surface);
  border:1px solid var(--shopping-cart-color-border);
  border-radius:var(--shopping-cart-radius);
  box-shadow:var(--shopping-shadow);
}
.shopping-cart > aside > button {
  background:var(--shopping-cart-color-primary);
  border:0;
  border-radius:8px;
  color:rgb(255, 255, 255);
  font-weight:800;
  margin-top:1.25rem;
  padding:0.95rem 1rem;
  width:100%;
}
.shopping-cart > aside > button:hover {
  background:var(--shopping-cart-color-primary-dark);
}
.shopping-cart > aside > div {
  border-top:1px solid var(--shopping-cart-color-border);
  display:flex;
  font-size:1.2rem;
  font-weight:800;
  gap:1rem;
  justify-content:space-between;
  margin-top:1.25rem;
  padding-top:1.25rem;
}
.shopping-cart > aside > dl {
  display:grid;
  gap:0.8rem;
  margin:0;
}
.shopping-cart > aside > dl > div {
  color:var(--shopping-cart-color-muted);
  display:flex;
  gap:1rem;
  justify-content:space-between;
}
.shopping-cart > aside > dl > div > dd, .shopping-cart > aside > dl > div > dt {
  margin:0;
}
.shopping-cart > aside > h2 {
  font-size:1.25rem;
  margin:0 0 1.25rem;
}
.shopping-cart > aside > p {
  color:var(--shopping-cart-color-muted);
  font-size:0.8rem;
  margin:1rem 0 0;
  text-align:center;
}
.shopping-cart button {
  cursor:pointer;
}
.shopping-cart button, .shopping-cart input {
  font:inherit;
}
.shopping-cart > section {
  padding:clamp(1rem, 3vw, 1.5rem);
}
.shopping-cart > section > a {
  display:inline-block;
  font-size:0.95rem;
  font-weight:650;
  margin-top:1.25rem;
  text-decoration:none;
}
.shopping-cart > section > header {
  align-items:center;
  display:flex;
  gap:1rem;
  justify-content:space-between;
  margin-bottom:1.25rem;
}
.shopping-cart > section > header > h2 {
  font-size:1.25rem;
  margin:0;
}
.shopping-cart > section > header > span {
  color:var(--shopping-cart-color-muted);
  font-size:0.9rem;
}
.shopping-cart > section > .items > article {
  align-items:center;
  border-top:1px solid var(--shopping-cart-color-border);
  display:grid;
  gap:1rem;
  grid-template-columns:6rem minmax(0, 1fr) auto;
  padding-block:1.25rem;
}
@media(max-width:47.5rem) {
  .shopping-cart > section > .items > article {
    gap:0.8rem;
    grid-template-columns:72px minmax(0, 1fr);
  }
}
.shopping-cart > section > .items > article > img {
  aspect-ratio:1;
  background:rgb(231, 237, 246);
  border-radius:10px;
  object-fit:cover;
  width:6rem;
}
@media (max-width:47.5rem) {
  .shopping-cart > section > .items > article > img {
    width:4.5rem;
  }
}
.shopping-cart > section > .items > article > .item-actions {
  align-items:center;
  display:flex;
  gap:1rem;
}
@media (max-width:47.5rem) {
  .shopping-cart > section > .items > article > .item-actions {
    grid-column:1 / -1;
    justify-content:space-between;
    padding-top:0.25rem;
  }
}
.shopping-cart > section > .items > article > .item-actions > .quantity-control {
  align-items:center;
  display:inline-flex;
  border:1px solid var(--shopping-cart-color-border);
  border-radius:8px;
  overflow:hidden;
}
.shopping-cart > section > .items > article > .item-actions > .quantity-control > button {
  background:rgb(248, 250, 252);
  border:0;
  color:var(--shopping-cart-color-text);
  font-size:1.2rem;
  height:2.25rem;
  width:2.25rem;
}
.shopping-cart > section > .items > article > .item-actions > .quantity-control > button:hover {
  background:rgb(237, 242, 248);
}
.shopping-cart > section > .items > article > .item-actions > .quantity-control > span {
  font-size:0.95rem;
  font-weight:700;
  min-width:2.25rem;
  text-align:center;
}
.shopping-cart > section > .items > article > .item-actions > strong {
  font-weight:700;
  min-width:5.125rem;
  text-align:right;
}
@media (max-width:47.5rem) {
  .shopping-cart > section > .items > article > .item-actions > strong {
    min-width:auto;
  }
}
.shopping-cart > section > .items > article > .item-information > button {
  background:transparent;
  border:0;
  color:rgb(88, 88, 88);
  display:block;
  font-size:1.15rem;
  margin-top:0.5rem;
  padding:0;
  text-decoration:underline;
}
.shopping-cart > section > .items > article > .item-information > button:hover {
  color:rgb(79, 195, 163);
}
.shopping-cart > section > .items > article > .item-information > h3 {
  font-size:1rem;
  margin:0 0 0.3rem;
}
.shopping-cart > section > .items > article > .item-information > span {
  font-size:0.9rem;
  color:var(--shopping-cart-color-muted);
}
.show {
  display:block;
}
.related-products {
  display: flex;
  flex-wrap: wrap;
  gap: 1.5rem;
  margin-top:3rem;
}
.related-products > a {
  background:rgb(255, 255, 255);
  border:1px solid rgb(229, 229, 229);
  border-radius:0.75rem;
  color:inherit;
  display:block;
  overflow:hidden;
  text-decoration:none;
  transition:transform 0.2s ease, box-shadow 0.2s ease;
  width:15rem;
}
.related-products > a:focus-visible, .related-products > a:hover {
  box-shadow:0 0.5rem 1.25rem rgb(0 0 0 / 12%);
  transform:translateY(-.25rem);
}
.related-products > a img {
  aspect-ratio:1 / 1;
  display:block;
  height:auto;
  object-fit:cover;
  width:100%;
}
.related-products > a h3 {
  font-size:1rem;
  line-height:1.3;
  margin:0;
  padding:1rem;
}
.share-bar {
  border-bottom:1px solid rgb(239, 243, 249);
  border-top:1px solid rgb(239, 243, 249);
  display:grid;
  grid-template-columns:repeat(4, 1fr);
  gap:1.5rem;
  max-width:75rem;
  margin:2rem auto;
  padding:1.5rem;
}
@media(max-width:48rem) {
  .share-bar {
    grid-template-columns:1fr;
  }
}
.share-bar > a {
  align-items:center;
  display:flex;
  gap:.75rem;
  min-width:0;
  color:rgb(67, 81, 94);
  text-decoration:none;
  white-space:nowrap;
}
.share-bar > a:hover {
  color:rgb(79, 195, 163);
}
.share-bar > a > span:has(i) {
  align-items:center;
  background:rgb(67, 81, 94);
  border-radius:50%;
  color:rgb(255, 255, 255);
  display:flex;
  flex:0 0 2rem;
  height:2rem;
  justify-content:center;
  overflow:hidden;
  width:2rem;
}
.table {
  margin:2rem 0 1rem 0;
  width:100%;
}
.table, .table td, .table th {
  border:1px solid rgb(239, 243, 249);
  border-collapse:collapse;
}
.table > tbody > tr:nth-child(even) {
  background-color:rgb(246, 246, 246);
}
.table > tbody > tr > td {
  padding:.525rem 1.25rem;
}
.table > thead {
  background-color:rgb(246, 246, 246);
}
.table > thead > tr > th {
  border-bottom:.125rem solid rgb(229, 228, 227);
  border-top:.125rem solid rgb(229, 228, 227);
  padding:1.25rem;
  text-align:left;
}
.text-center {
  text-align:center;
}
.text-error {
  color:rgb(255, 0, 0);
}
.visually-hidden {
  border:0;
  clip:rect(0, 0, 0, 0);
  height:1px;
  margin:-1px;
  overflow:hidden;
  padding:0;
  position:absolute;
  white-space:nowrap;
  width:1px;
}

/** --- */



/*
  Initial logo spacing:
  25px top
  20px bottom
*/
.site-logo {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  padding: 25px 0 20px;
}

.site-logo img {
  display: block;
  width: auto;
  height: 120px;
  transition: height 250ms ease;
}

/*
  Navigation
*/

/*
  Visible keyboard focus indicator
*/
.site-logo:focus-visible,
.main-navigation a:focus-visible {
  outline: 3px solid var(--focus-color);
  outline-offset: 5px;
  border-radius: 2px;
}

header.is-scrolled .site-logo {
  padding:.3125rem 0;
}
header.is-scrolled .site-logo img {
  height:3.4375rem;
}

/*
  Responsive layout
*/

/*
  Respect users who prefer reduced motion
*/
@media(prefers-reduced-motion:reduce) {
  body > header > .container,
  .site-logo img,
  .main-navigation a {
    transition:none;
  }
}