/* Core Hummingbird ships this font (and the .material-icons class relies on
   it everywhere - cart, account, product cards...) via its own theme.css, but
   that file only exists for the "hummingbird" theme folder, never for this
   child theme, so PrestaShop never loads it and every material-icons glyph
   sitewide renders blank. Load just the font here instead of pulling in
   hummingbird's entire (never-tested-in-production) base theme.css. */
@font-face {
  font-display: swap;
  font-family: "Material Icons";
  font-style: normal;
  font-weight: 400;
  src: url("../fonts/MaterialIcons-Regular-2d8017489da689caedc1.woff2") format("woff2"),
       url("../fonts/MaterialIcons-Regular-08cefa1bc6566a650da7.woff") format("woff");
}

:root {
  --cc-primary: #0f5cff;
  --cc-primary-dark: #0732a8;
  --cc-primary-soft: #eaf2ff;
  --cc-cyan: #19c9f5;
  --cc-navy: #061b4f;
  --cc-text: #0a1e52;
  --cc-muted: #637198;
  --cc-border: rgba(15, 92, 255, .13);
  --cc-card: rgba(255, 255, 255, .88);
  --cc-bg: #f4f8ff;
  --cc-bg-blue: #edf5ff;
  --cc-shadow: 0 24px 70px rgba(12, 48, 120, .12);
  --cc-ink: #04153f;
}

html {
  scroll-behavior: smooth;
}

body {
  background:
    radial-gradient(circle at 85% 6%, rgba(25, 201, 245, .22), transparent 28rem),
    radial-gradient(circle at 10% 30%, rgba(15, 92, 255, .15), transparent 22rem),
    var(--cc-bg);
  color: var(--cc-text);
  display: flex;
  flex-direction: column;
  font-family: Inter, "Segoe UI", system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
  min-height: 100vh;
}

/* Anchor the footer to the bottom of the viewport on short pages instead of
   letting it float wherever the (sparse) content happens to end. */
body > main.wrapper {
  flex: 1 0 auto;
}

body > footer.footer {
  flex-shrink: 0;
}

a {
  color: var(--cc-primary);
}

a:hover {
  color: var(--cc-primary-dark);
}

:focus-visible {
  outline: 3px solid var(--cc-cyan) !important;
  outline-offset: 3px;
}

#header {
  position: sticky;
  top: 0;
  z-index: 20;
}

#header.header {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, .96), rgba(255, 255, 255, .88));
  backdrop-filter: blur(18px);
  border-bottom: 1px solid var(--cc-border);
  box-shadow: 0 14px 34px rgba(12, 48, 120, .06);
}

.cc-site-header__inner {
  align-items: center;
  display: grid;
  gap: .9rem;
  grid-template-columns: auto auto minmax(220px, 1fr) auto;
  min-height: 78px;
  padding-bottom: .7rem;
  padding-top: .7rem;
}

.cc-site-header__brand,
.cc-site-footer__logo {
  align-items: center;
  color: var(--cc-ink);
  display: inline-flex;
  font-weight: 900;
  gap: .65rem;
  text-decoration: none;
  white-space: nowrap;
}

.cc-site-header__brand:hover,
.cc-site-footer__logo:hover {
  color: var(--cc-primary);
  text-decoration: none;
}

.cc-site-header__brand img,
.cc-site-footer__logo img {
  display: block;
  height: 34px;
  object-fit: contain;
  width: 42px;
}

.cc-site-header__brand strong,
.cc-site-footer__logo strong {
  color: var(--cc-primary);
}

.cc-site-header__nav,
.cc-site-header__actions {
  align-items: center;
  display: flex;
  gap: .35rem;
}

.cc-site-header__icon-link,
.cc-site-header__cart {
  border-radius: 999px;
  color: var(--cc-muted);
  font-size: .9rem;
  font-weight: 800;
  padding: .68rem .78rem;
  text-decoration: none;
}

.cc-site-header__icon-link:hover,
.cc-site-header__cart:hover {
  background: var(--cc-primary-soft);
  color: var(--cc-primary-dark);
  text-decoration: none;
}

.cc-site-header__nav {
  min-width: 0;
}

.cc-site-header__menu-toggle {
  align-items: center;
  background: #fff;
  border: 1px solid var(--cc-border);
  border-radius: 8px;
  cursor: pointer;
  display: none;
  flex-direction: column;
  gap: 4px;
  height: 44px;
  justify-content: center;
  padding: 0;
  width: 44px;
}

.cc-site-header__menu-toggle span {
  background: var(--cc-ink);
  border-radius: 2px;
  display: block;
  height: 2px;
  transition: transform .18s ease, opacity .18s ease;
  width: 19px;
}

.cc-site-header__inner.is-menu-open .cc-site-header__menu-toggle span:nth-child(1) {
  transform: translateY(6px) rotate(45deg);
}

.cc-site-header__inner.is-menu-open .cc-site-header__menu-toggle span:nth-child(2) {
  opacity: 0;
}

.cc-site-header__inner.is-menu-open .cc-site-header__menu-toggle span:nth-child(3) {
  transform: translateY(-6px) rotate(-45deg);
}

.cc-main-menu {
  width: 100%;
}

.cc-main-menu__list {
  display: flex;
  gap: .3rem;
  list-style: none;
  margin: 0;
  padding: 0;
}

.cc-main-menu__list[data-depth="0"] {
  align-items: center;
}

.cc-main-menu__list[data-depth]:not([data-depth="0"]) {
  align-items: stretch;
  flex-direction: column;
  gap: .1rem;
}

.cc-main-menu__item {
  margin: 0;
  min-width: 0;
  position: relative;
}

.cc-main-menu__link {
  align-items: center;
  border-radius: 999px;
  color: var(--cc-muted);
  display: inline-flex;
  font-size: .9rem;
  font-weight: 800;
  gap: .42rem;
  line-height: 1.1;
  padding: .68rem .78rem;
  text-decoration: none;
  white-space: nowrap;
}

.cc-main-menu__link:hover,
.cc-main-menu__item.is-current > .cc-main-menu__link {
  background: var(--cc-primary-soft);
  color: var(--cc-primary-dark);
  text-decoration: none;
}

.cc-main-menu__chevron {
  border-bottom: 2px solid currentColor;
  border-right: 2px solid currentColor;
  height: .42rem;
  margin-top: -.18rem;
  transform: rotate(45deg);
  width: .42rem;
}

.cc-main-menu__submenu-toggle {
  display: none;
}

.cc-main-menu__submenu {
  background: #fff;
  border: 1px solid var(--cc-border);
  border-radius: 8px;
  box-shadow: var(--cc-shadow);
  left: 0;
  min-width: 220px;
  opacity: 0;
  padding: .45rem;
  pointer-events: none;
  position: absolute;
  top: calc(100% - 1px);
  transform: translateY(8px);
  transition: opacity .16s ease, transform .16s ease;
  z-index: 30;
}

.cc-main-menu__item:hover > .cc-main-menu__submenu,
.cc-main-menu__item:focus-within > .cc-main-menu__submenu {
  opacity: 1;
  pointer-events: auto;
  transform: translateY(0);
}

.cc-main-menu__submenu .cc-main-menu__link {
  border-radius: 8px;
  justify-content: space-between;
  padding: .72rem .8rem;
  width: 100%;
}

.cc-main-menu__submenu .cc-main-menu__submenu {
  left: calc(100% - 1px);
  top: -.45rem;
}

.cc-main-menu__image {
  border-radius: 6px;
  height: 24px;
  object-fit: cover;
  width: 24px;
}

.cc-site-header__search {
  justify-self: stretch;
}

.cc-site-header__search input {
  background: #fff;
  border: 1px solid var(--cc-border);
  border-radius: 8px;
  box-shadow: 0 8px 20px rgba(12, 48, 120, .05);
  color: var(--cc-text);
  min-height: 44px;
  padding: 0 1rem;
  width: 100%;
}

.cc-site-header__search input::placeholder {
  color: #7a86a6;
}

.cc-site-header__actions {
  justify-content: flex-end;
}

.cc-site-header__cart {
  align-items: center;
  display: inline-flex;
  gap: .45rem;
}

.cc-site-header__cart strong {
  background: var(--cc-ink);
  border-radius: 999px;
  color: #fff;
  display: inline-grid;
  font-size: .76rem;
  height: 22px;
  min-width: 22px;
  place-items: center;
  padding: 0 .35rem;
}

#wrapper {
  background: transparent;
  padding-top: 0;
}

#main {
  padding-bottom: clamp(2.5rem, 5vw, 4rem);
}

.page-product #main {
  padding-bottom: 0;
}

.breadcrumb,
#wrapper .breadcrumb,
.breadcrumb__wrapper {
  background: rgba(255, 255, 255, .66);
  border-bottom: 1px solid var(--cc-border);
  margin-bottom: 0;
}

.breadcrumb .container,
.breadcrumb ol {
  margin-bottom: 0;
}

#content.page-content--home {
  padding: 0;
}

.container:not([class*="container--limited"]),
.cc-home__inner {
  max-width: 1180px;
}

.btn-primary,
.btn-primary:not(:disabled):not(.disabled),
.cc-btn {
  align-items: center;
  border: 0;
  border-radius: 999px;
  display: inline-flex;
  font-weight: 800;
  justify-content: center;
  line-height: 1;
  min-height: 46px;
  padding: 0 1.25rem;
  text-decoration: none;
}

.btn-primary,
.btn-primary:not(:disabled):not(.disabled),
.cc-btn--primary {
  background: linear-gradient(135deg, var(--cc-primary), var(--cc-cyan));
  box-shadow: 0 14px 30px rgba(15, 92, 255, .24);
  color: #fff;
}

.btn-primary:hover,
.cc-btn--primary:hover {
  background: linear-gradient(135deg, var(--cc-primary-dark), var(--cc-primary));
  color: #fff;
  transform: translateY(-1px);
}

.cc-btn--ghost {
  background: #fff;
  border: 1px solid var(--cc-border);
  color: var(--cc-navy);
}

.cc-cookie-banner {
  background: #fff;
  border-top: 1px solid var(--cc-border);
  bottom: 0;
  box-shadow: 0 -18px 48px rgba(12, 48, 120, .12);
  left: 0;
  position: fixed;
  right: 0;
  z-index: 1000;
}

.cc-cookie-banner[hidden] {
  display: none;
}

.cc-cookie-banner__inner {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  justify-content: space-between;
  margin: 0 auto;
  max-width: 1200px;
  padding: 1rem 1.25rem;
}

.cc-cookie-banner__text {
  color: var(--cc-text);
  flex: 1 1 320px;
  font-size: .9rem;
  margin: 0;
}

.cc-cookie-banner__text a {
  color: var(--cc-primary-dark);
  font-weight: 700;
}

.cc-cookie-banner__actions {
  display: flex;
  flex-shrink: 0;
  gap: .6rem;
}

.cc-cookie-banner__actions .cc-btn {
  min-height: 40px;
  padding: 0 1rem;
}

.cc-home {
  color: var(--cc-text);
  overflow: hidden;
}

.cc-home__inner {
  margin: 0 auto;
  padding-left: 1.25rem;
  padding-right: 1.25rem;
}

.cc-hero {
  min-height: clamp(540px, 52vw, 660px);
  padding: clamp(1.5rem, 3vw, 2.4rem) 0 clamp(2.75rem, 5vw, 4.5rem);
  position: relative;
}

.cc-hero:before {
  background:
    linear-gradient(90deg, rgba(15, 92, 255, .08) 1px, transparent 1px),
    linear-gradient(0deg, rgba(15, 92, 255, .08) 1px, transparent 1px);
  background-size: 44px 44px;
  content: "";
  inset: 0;
  mask-image: linear-gradient(to bottom, rgba(0, 0, 0, .75), transparent 76%);
  pointer-events: none;
  position: absolute;
}

.cc-hero__layout {
  align-items: center;
  display: grid;
  gap: clamp(2rem, 5vw, 4rem);
  grid-template-columns: minmax(0, 1.02fr) minmax(320px, .98fr);
  padding-top: clamp(2.4rem, 5vw, 4.8rem);
  position: relative;
  z-index: 1;
}

.cc-hero-nav {
  align-items: center;
  background: rgba(255, 255, 255, .78);
  border: 1px solid var(--cc-border);
  border-radius: 8px;
  box-shadow: 0 18px 44px rgba(12, 48, 120, .08);
  display: flex;
  gap: 1rem;
  justify-content: space-between;
  padding: .7rem .75rem .7rem .9rem;
  position: relative;
  z-index: 2;
}

.cc-hero-nav__brand {
  align-items: center;
  color: var(--cc-ink);
  display: inline-flex;
  font-weight: 900;
  gap: .65rem;
  text-decoration: none;
  white-space: nowrap;
}

.cc-hero-nav__brand:hover {
  color: var(--cc-primary);
  text-decoration: none;
}

.cc-hero-nav__brand strong {
  color: var(--cc-primary);
  font-weight: 900;
}

.cc-hero-nav__mark {
  background: linear-gradient(135deg, var(--cc-primary), var(--cc-cyan));
  border-radius: 8px;
  display: inline-grid;
  height: 34px;
  place-items: center;
  width: 34px;
}

.cc-hero-nav__mark:before {
  background: #fff;
  clip-path: polygon(50% 0, 94% 25%, 94% 75%, 50% 100%, 6% 75%, 6% 25%);
  content: "";
  height: 18px;
  width: 18px;
}

.cc-hero-nav__links {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  justify-content: flex-end;
}

.cc-hero-nav__links > a {
  border-radius: 999px;
  color: var(--cc-muted);
  font-size: .92rem;
  font-weight: 800;
  padding: .7rem .85rem;
  text-decoration: none;
}

.cc-hero-nav__links > a:hover {
  background: var(--cc-primary-soft);
  color: var(--cc-primary-dark);
}

.cc-language-switch,
.cc-currency-switch {
  align-items: center;
  background: var(--cc-primary-soft);
  border: 1px solid rgba(15, 92, 255, .16);
  border-radius: 999px;
  display: inline-flex;
  gap: .18rem;
  padding: .22rem;
}

.cc-language-switch__item,
.cc-currency-switch__item {
  border-radius: 999px;
  color: var(--cc-primary-dark);
  font-size: .78rem;
  font-weight: 900;
  line-height: 1;
  min-width: 38px;
  padding: .58rem .65rem;
  text-align: center;
  text-decoration: none;
}

.cc-language-switch__item:hover,
.cc-currency-switch__item:hover {
  color: var(--cc-primary);
  text-decoration: none;
}

.cc-language-switch__item.is-active,
.cc-currency-switch__item.is-active {
  background: #fff;
  box-shadow: 0 8px 18px rgba(15, 92, 255, .13);
  color: var(--cc-ink);
}

.cc-kicker {
  align-items: center;
  color: var(--cc-primary-dark);
  display: inline-flex;
  font-size: .78rem;
  font-weight: 900;
  letter-spacing: .08em;
  margin-bottom: 1rem;
  text-transform: uppercase;
}

.cc-kicker:before {
  background: var(--cc-cyan);
  border-radius: 999px;
  content: "";
  height: .58rem;
  margin-right: .6rem;
  width: .58rem;
}

.cc-hero h1 {
  color: var(--cc-ink);
  font-size: clamp(2.7rem, 6vw, 5.6rem);
  font-weight: 900;
  line-height: .98;
  margin: 0;
}

.cc-hero h1 span {
  color: var(--cc-primary);
  display: block;
}

.cc-hero__lead {
  color: var(--cc-muted);
  font-size: clamp(1.05rem, 2vw, 1.28rem);
  line-height: 1.7;
  margin: 1.4rem 0 0;
  max-width: 680px;
}

.cc-hero__actions {
  display: flex;
  flex-wrap: wrap;
  gap: .85rem;
  margin-top: 2rem;
}

.cc-hero__metrics {
  display: grid;
  gap: .85rem;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-top: 2.25rem;
  max-width: 660px;
}

.cc-metric {
  background: rgba(255, 255, 255, .78);
  border: 1px solid var(--cc-border);
  border-radius: 8px;
  padding: .9rem;
}

.cc-metric strong {
  color: var(--cc-navy);
  display: block;
  font-size: 1.25rem;
}

.cc-metric span {
  color: var(--cc-muted);
  display: block;
  font-size: .82rem;
  margin-top: .25rem;
}

.cc-preview {
  background: linear-gradient(180deg, rgba(255, 255, 255, .94), rgba(255, 255, 255, .76));
  border: 1px solid var(--cc-border);
  border-radius: 8px;
  box-shadow: var(--cc-shadow);
  overflow: hidden;
  transform: translateY(6px);
}

.cc-preview__bar {
  align-items: center;
  background: #fff;
  border-bottom: 1px solid var(--cc-border);
  display: flex;
  gap: .42rem;
  height: 42px;
  padding: 0 1rem;
}

.cc-preview__dot {
  background: #d6def0;
  border-radius: 999px;
  height: 10px;
  width: 10px;
}

.cc-preview__dot:nth-child(1) {
  background: #ff6b6b;
}

.cc-preview__dot:nth-child(2) {
  background: #ffd166;
}

.cc-preview__dot:nth-child(3) {
  background: #19c37d;
}

.cc-preview__screen {
  background:
    linear-gradient(135deg, rgba(6, 27, 79, .95), rgba(15, 92, 255, .82)),
    linear-gradient(90deg, rgba(255, 255, 255, .07) 1px, transparent 1px);
  background-size: auto, 28px 28px;
  color: #fff;
  min-height: 420px;
  padding: clamp(1.4rem, 4vw, 2rem);
  position: relative;
}

.cc-preview__screen:after {
  background: rgba(25, 201, 245, .2);
  border: 1px solid rgba(255, 255, 255, .24);
  border-radius: 999px;
  content: "";
  height: 220px;
  position: absolute;
  right: -70px;
  top: -60px;
  width: 220px;
}

.cc-preview__nav {
  align-items: center;
  display: flex;
  justify-content: space-between;
  position: relative;
  z-index: 1;
}

.cc-preview__brand {
  align-items: center;
  display: inline-flex;
  font-weight: 900;
  gap: .55rem;
}

.cc-preview__mark {
  background: #fff;
  border-radius: 8px;
  box-shadow: 0 8px 20px rgba(0, 0, 0, .18);
  display: inline-grid;
  height: 32px;
  place-items: center;
  width: 32px;
}

.cc-preview__mark:before {
  background: linear-gradient(135deg, var(--cc-primary), var(--cc-cyan));
  clip-path: polygon(50% 0, 94% 25%, 94% 75%, 50% 100%, 6% 75%, 6% 25%);
  content: "";
  height: 18px;
  width: 18px;
}

.cc-preview__pill {
  background: rgba(255, 255, 255, .16);
  border: 1px solid rgba(255, 255, 255, .2);
  border-radius: 999px;
  font-size: .78rem;
  font-weight: 800;
  padding: .45rem .7rem;
}

.cc-preview__title {
  font-size: clamp(2.2rem, 5vw, 4.1rem);
  font-weight: 900;
  line-height: 1;
  margin-top: clamp(3rem, 7vw, 5rem);
  max-width: 480px;
  position: relative;
  z-index: 1;
}

.cc-preview__cards {
  display: grid;
  gap: .75rem;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-top: 2rem;
  position: relative;
  z-index: 1;
}

.cc-preview__card {
  background: rgba(255, 255, 255, .12);
  border: 1px solid rgba(255, 255, 255, .18);
  border-radius: 8px;
  min-height: 118px;
  padding: 1rem;
}

.cc-preview__card strong {
  display: block;
  font-size: 1.05rem;
  margin-bottom: .35rem;
}

.cc-preview__card span {
  color: rgba(255, 255, 255, .78);
  font-size: .9rem;
  line-height: 1.5;
}

.cc-band {
  background: #fff;
  border-bottom: 1px solid var(--cc-border);
  border-top: 1px solid var(--cc-border);
  padding: clamp(2.6rem, 5vw, 4rem) 0;
}

.cc-section {
  padding: clamp(2.75rem, 5vw, 4rem) 0;
}

.cc-section__head {
  margin-bottom: 2rem;
  max-width: 740px;
}

.cc-section__head h2 {
  color: var(--cc-ink);
  font-size: clamp(2rem, 4vw, 3.1rem);
  font-weight: 900;
  line-height: 1.05;
  margin: 0;
}

.cc-section__head p {
  color: var(--cc-muted);
  font-size: 1.05rem;
  line-height: 1.7;
  margin: .9rem 0 0;
}

.cc-grid {
  display: grid;
  gap: 1rem;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.cc-card {
  background: var(--cc-card);
  border: 1px solid var(--cc-border);
  border-radius: 8px;
  box-shadow: 0 16px 38px rgba(12, 48, 120, .08);
  padding: 1.2rem;
}

.cc-card__icon {
  align-items: center;
  background: var(--cc-primary-soft);
  border: 1px solid var(--cc-border);
  border-radius: 8px;
  color: var(--cc-primary);
  display: inline-flex;
  font-size: 1.35rem;
  font-weight: 900;
  height: 42px;
  justify-content: center;
  margin-bottom: 1.25rem;
  width: 42px;
}

.cc-card h3 {
  color: var(--cc-navy);
  font-size: 1.15rem;
  font-weight: 900;
  margin: 0 0 .6rem;
}

.cc-card p {
  color: var(--cc-muted);
  line-height: 1.62;
  margin: 0;
}

.cc-strip {
  align-items: center;
  display: grid;
  gap: 1.5rem;
  grid-template-columns: 1fr auto;
}

.cc-strip h2 {
  color: var(--cc-ink);
  font-size: clamp(1.7rem, 3vw, 2.4rem);
  font-weight: 900;
  margin: 0;
}

.cc-strip p {
  color: var(--cc-muted);
  line-height: 1.65;
  margin: .55rem 0 0;
}

.product-miniature,
.card,
.product-information,
#left-column .block-categories,
#left-column .facet,
#left-column .card,
#left-column .left-block {
  background: var(--cc-card);
  border: 1px solid var(--cc-border);
  border-radius: 8px;
  box-shadow: var(--cc-shadow);
}

/* Space below the breadcrumb belongs on the row both columns share, not on
   #left-column alone - that pushed the sidebar lower than #center-column
   (which gets its own spacing from its card's internal padding, not a
   column-level offset) and threw the two out of alignment. Putting it on the
   shared container keeps the gap under the breadcrumb while both columns
   still start at the same height. */
.columns-container {
  padding-top: clamp(2rem, 4vw, 3rem);
}

/* The column itself stretches to match the taller product grid next to it
   (a flex row), but it has no background of its own - only the nav card
   inside should be boxed, sized to its own content, sitting at the top
   instead of an invisible column dragging a wall of blank space down the
   page. */
#left-column {
  align-self: flex-start;
}

#left-column .block-categories,
#left-column .facet,
#left-column .card,
#left-column .left-block {
  margin-bottom: 1rem;
  padding: 1rem;
}

#left-column .left-block__title {
  font-weight: 800;
  margin-bottom: .5rem;
}

#left-column a {
  color: var(--cc-text);
  text-decoration: none;
}

#left-column a:hover,
#left-column .current_cate > a,
#left-column .current > a {
  color: var(--cc-primary);
}

#content-wrapper,
#right-column {
  padding-top: clamp(2rem, 4vw, 3rem);
}

.page-category #content-wrapper {
  min-width: 0;
}

#js-product-list-header,
.block-category {
  background: rgba(255, 255, 255, .78);
  border: 1px solid var(--cc-border);
  border-radius: 8px;
  box-shadow: 0 16px 38px rgba(12, 48, 120, .08);
  margin-bottom: 1rem;
  padding: clamp(1.2rem, 3vw, 1.8rem);
}

#js-product-list-header h1,
.block-category h1 {
  color: var(--cc-ink);
  font-weight: 900;
}

.subcategory__list {
  display: grid;
  gap: .7rem;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  margin-top: 1.15rem;
}

.subcategory__link {
  align-items: center;
  background: rgba(245, 249, 255, .84);
  border: 1px solid var(--cc-border);
  border-radius: 999px;
  color: var(--cc-primary);
  display: flex;
  font-weight: 750;
  justify-content: center;
  min-height: 44px;
  padding: .55rem .9rem;
  text-align: center;
  text-decoration: none;
}

.subcategory__link:hover {
  background: var(--cc-primary-soft);
  color: var(--cc-primary-dark);
  text-decoration: none;
}

#js-product-list .alert,
#products .alert {
  background: rgba(255, 255, 255, .86);
  border: 1px solid var(--cc-border);
  border-radius: 8px;
  box-shadow: 0 16px 38px rgba(12, 48, 120, .08);
  color: var(--cc-text);
  padding: 1.2rem;
}

#products {
  min-width: 0;
}

/* The default PrestaShop sort dropdown is not useful for the current
   small digital catalogue and is hidden until a dedicated sort UI is added. */
.products__sort {
  display: none !important;
}

#js-product-list .products,
#products .products {
  display: grid;
  gap: 1.1rem;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

#js-product-list .product-miniature,
#products .product-miniature {
  margin: 0;
  min-width: 0;
  width: 100%;
}

.product-miniature__inner {
  display: flex;
  flex-direction: column;
  height: 100%;
  overflow: hidden;
}

.product-miniature__top {
  background:
    linear-gradient(135deg, rgba(15, 92, 255, .08), rgba(25, 201, 245, .14));
  border-bottom: 1px solid var(--cc-border);
}

.product-miniature__image-container,
.thumbnail-container {
  aspect-ratio: 16 / 10;
  display: block;
  margin: 0;
  overflow: hidden;
}

.product-miniature__image-link {
  display: block;
  height: 100%;
}

.product-miniature__image {
  display: block;
  height: 100%;
  object-fit: cover;
  width: 100%;
}

.product-miniature__bottom {
  display: flex;
  flex: 1;
  flex-direction: column;
  gap: 1rem;
  padding: 1rem;
}

.product-miniature__infos {
  flex: 1;
}

.product-miniature__title {
  color: var(--cc-ink);
  display: inline-block;
  font-size: 1.05rem;
  font-weight: 900;
  line-height: 1.3;
  text-decoration: none;
}

.product-miniature__price {
  color: var(--cc-primary-dark);
  font-size: 1.05rem;
  font-weight: 900;
}

.product-miniature__actions {
  align-items: center;
  display: flex;
  gap: .65rem;
  justify-content: space-between;
}

.product-miniature__form {
  margin: 0;
}

.product-miniature__quantity {
  display: none;
}

.page-product #wrapper {
  background:
    linear-gradient(120deg, rgba(234, 242, 255, .95), rgba(244, 248, 255, .72) 45%, rgba(229, 248, 255, .72));
}

.product {
  padding-top: clamp(2rem, 4vw, 3rem);
}

.product__top {
  align-items: start;
  display: grid;
  gap: clamp(1.5rem, 4vw, 2.2rem);
  grid-template-columns: minmax(0, 1.08fr) minmax(320px, .92fr);
}

.product__images,
.page-product .product__right,
.product__infos,
.product__bottom-left > *,
.product__bottom-right > * {
  background: rgba(255, 255, 255, .82);
  border: 1px solid var(--cc-border);
  border-radius: 8px;
  box-shadow: 0 18px 48px rgba(12, 48, 120, .09);
}

.product__comments {
  padding: clamp(1.4rem, 3vw, 2rem);
}

/* Description and Product Details are Bootstrap accordion items - the actual
   content sits in .accordion-body, not in a .product__details class (that class
   doesn't exist in the DOM). Pad the body itself so every accordion item is
   covered consistently, current and future, wherever it sits on the page. */
.page-product .accordion-body {
  padding: clamp(1.4rem, 3vw, 2rem);
}

.product__images {
  display: flex;
  flex-direction: column;
  flex: 1;
  overflow: hidden;
  padding: .75rem;
}

/* Hummingbird uses product__container / product__left / product__right.
   Keep the entire product detail in the same visual grid as the gallery.
   The right column pins itself to its natural height (see below), so
   stretching the row lets the gallery grow to fill the same height instead
   of leaving empty space under a shorter image card. */
.page-product .product__container {
  align-items: stretch;
  display: grid;
  gap: clamp(1.5rem, 4vw, 2.2rem);
  grid-template-columns: minmax(0, 1.08fr) minmax(320px, .92fr);
}

.page-product .product__left,
.page-product .product__right,
.page-product .product__bottom-left,
.page-product .product__bottom-right {
  min-width: 0;
}

.page-product .product__left {
  display: flex;
  flex-direction: column;
}

.page-product .product__right {
  align-self: start;
  height: auto !important;
  padding: clamp(1.4rem, 3vw, 2rem);
  position: sticky;
  top: 96px;
}

.product__carousel {
  border-radius: 8px;
  flex: 1;
  min-height: 320px;
  overflow: hidden;
}

.product__carousel,
.product__carousel .carousel-inner,
.product__carousel .carousel-item {
  height: 100%;
}

.product__carousel .carousel-item img {
  display: block;
  height: 100%;
  object-fit: cover;
  width: 100%;
}

.product__thumbnails {
  margin-top: 1rem;
}

.product__thumbnails-list {
  display: grid;
  gap: .7rem;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  list-style: none;
  margin: 0;
  padding: 0;
}

.product__thumbnail {
  border: 2px solid transparent;
  border-radius: 8px;
  cursor: pointer;
  overflow: hidden;
}

.product__thumbnail.active,
.product__thumbnail:focus-within,
.product__thumbnail:hover {
  border-color: var(--cc-primary);
}

.product__thumbnail-image {
  aspect-ratio: 16 / 10;
  display: block;
  height: 100%;
  object-fit: cover;
  width: 100%;
}

.product__infos {
  padding: clamp(1.4rem, 3vw, 2rem);
  position: sticky;
  top: 96px;
}

.product__infos h1,
.product h1 {
  color: var(--cc-ink);
  font-weight: 900;
}

.product__price,
.current-price {
  color: var(--cc-primary-dark);
  font-weight: 900;
}

.product-actions,
.product-add-to-cart {
  margin-top: 1.4rem;
}

.product__bottom {
  align-items: start;
  display: grid;
  gap: clamp(1.5rem, 4vw, 2rem);
  grid-template-columns: minmax(0, 1.05fr) minmax(320px, .95fr);
  margin-top: clamp(1.5rem, 4vw, 2.6rem);
}

.product__bottom-left,
.product__bottom-right {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.page-product .product__bottom-left > .product__accordion,
.page-product .product__bottom-right > * {
  width: 100%;
}

/* Do not render an empty product-details card. Once details are filled in
   the administration, it automatically returns to the two-column layout. */
.page-product .product__bottom-left:has(#product_details .details__list:empty) {
  display: none;
}

.page-product .product__bottom:has(.product__bottom-left #product_details .details__list:empty) {
  grid-template-columns: minmax(0, 1fr);
}

.page-product .blockreassurance--product {
  display: grid;
  gap: .8rem;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.page-product .blockreassurance--product .reassurance {
  align-items: flex-start;
  align-items: center;
  background: transparent;
  border: 0;
  display: flex;
  gap: .65rem;
  min-height: 0;
  padding: .4rem;
}

.page-product .blockreassurance--product .reassurance__image {
  align-items: center;
  background: var(--cc-primary-soft);
  border-radius: 8px;
  display: inline-flex;
  flex: 0 0 38px;
  height: 38px;
  justify-content: center;
  overflow: hidden;
  width: 38px;
}

.page-product .blockreassurance--product .reassurance__image img {
  display: none;
}

/* blockreassurance's own JS replaces each <img> with an inline <svg>. Icons 1-2
   are drawn with fill (JS already recolors that to blue), but icon 3 (Return
   policy / Technical support) is drawn with a stroke. That same JS still sets
   an inline fill:rgb(...) style on the path (inherited fill="none" on the
   <svg> no longer applies once that inline style is there), which solid-fills
   the bubble shape behind the stroke. Force it back to an unfilled outline and
   recolor the stroke to match the other two icons. The inline style can only
   be beaten with !important. Not scoped to one page/class - this block shows
   up on the product page and cart with the same markup and needs the same fix
   wherever it appears (checkout uses its own separate icon set already). */
.blockreassurance .reassurance__image svg path[stroke] {
  fill: none !important;
  stroke: var(--cc-primary);
}

.page-product .blockreassurance--product .reassurance__title {
  color: var(--cc-navy);
  font-weight: 800;
}

.page-product .blockreassurance--product .reassurance__desc {
  display: none;
}

.cc-product-license {
  align-items: flex-start;
  background: var(--cc-primary-soft);
  border: 1px solid var(--cc-border);
  border-radius: 8px;
  display: flex;
  gap: .75rem;
  margin-top: 1rem;
  padding: .9rem;
}

.cc-product-license__icon {
  align-items: center;
  background: var(--cc-primary);
  border-radius: 50%;
  color: #fff;
  display: inline-flex;
  flex: 0 0 24px;
  font-weight: 900;
  height: 24px;
  justify-content: center;
  width: 24px;
}

.cc-product-license strong {
  color: var(--cc-navy);
}

.cc-product-license p {
  color: var(--cc-muted);
  font-size: .9rem;
  line-height: 1.5;
  margin: .25rem 0 0;
}

.cc-customer-license-link {
  color: var(--cc-primary);
  display: block;
  font-weight: 750;
  margin-top: .55rem;
  text-decoration: none;
}

.cc-licenses-page {
  margin: 2rem auto;
  max-width: 880px;
}

.cc-licenses-page h1 {
  color: var(--cc-ink);
  font-weight: 900;
}

.cc-licenses-page__list {
  display: grid;
  gap: 1rem;
}

.cc-licenses-page__item {
  background: rgba(255, 255, 255, .9);
  border: 1px solid var(--cc-border);
  border-radius: 8px;
  box-shadow: 0 14px 34px rgba(12, 48, 120, .07);
  padding: 1.25rem;
}

.cc-licenses-page__item h2 {
  font-size: 1.1rem;
  margin: 0 0 1rem;
}

.cc-licenses-page__item dl {
  display: grid;
  gap: .7rem;
  margin: 0;
}

.cc-licenses-page__item dl > div {
  align-items: center;
  display: flex;
  gap: 1rem;
  justify-content: space-between;
}

.cc-licenses-page__item dt {
  color: var(--cc-muted);
  font-weight: 700;
}

.cc-licenses-page__item dd {
  color: var(--cc-ink);
  margin: 0;
}

.cc-licenses-page__item code {
  background: var(--cc-primary-soft);
  border-radius: 6px;
  color: var(--cc-primary-dark);
  font-weight: 800;
  padding: .3rem .45rem;
}

.cc-license-status {
  border-radius: 999px;
  font-size: .82rem;
  font-weight: 700;
  padding: .15rem .6rem;
}

.cc-license-status--active {
  background: var(--cc-primary-soft);
  color: var(--cc-primary-dark);
}

.cc-license-status--expired {
  background: rgba(120, 120, 120, .15);
  color: var(--cc-muted);
}

.cc-license-status--blocked {
  background: rgba(200, 40, 40, .12);
  color: #c22;
}

.cc-licenses-page__activations {
  border-top: 1px solid var(--cc-border);
  list-style: none;
  margin: 1rem 0 0;
  padding: .9rem 0 0;
}

.cc-licenses-page__activations li {
  align-items: center;
  display: flex;
  font-size: .9rem;
  justify-content: space-between;
  padding: .3rem 0;
}

.cc-licenses-page__release {
  background: none;
  border: 1px solid var(--cc-border);
  border-radius: 6px;
  color: var(--cc-muted);
  cursor: pointer;
  font-size: .8rem;
  padding: .2rem .55rem;
}

.cc-licenses-page__renew {
  margin-top: 1rem;
}

.cc-licenses-page__renew button {
  background: var(--cc-primary);
  border: 0;
  border-radius: 6px;
  color: #fff;
  cursor: pointer;
  font-weight: 700;
  padding: .5rem 1rem;
}

.cc-product-license__meta {
  color: var(--cc-muted);
  display: flex;
  font-size: .85rem;
  gap: 1rem;
  list-style: none;
  margin: .55rem 0 0;
  padding: 0;
}

.cc-license-policy {
  margin: clamp(2rem, 6vw, 5rem) auto;
  max-width: 980px;
}

.cc-license-policy__eyebrow {
  color: var(--cc-primary);
  font-size: .82rem;
  font-weight: 900;
  letter-spacing: .08em;
  margin: 0 0 .7rem;
  text-transform: uppercase;
}

.cc-license-policy h1 {
  color: var(--cc-ink);
  font-size: clamp(2.2rem, 5vw, 4rem);
  font-weight: 900;
  margin: 0;
}

.cc-license-policy__lead {
  color: var(--cc-muted);
  font-size: 1.2rem;
  line-height: 1.65;
  margin: 1rem 0 2rem;
  max-width: 650px;
}

.cc-license-policy__grid {
  display: grid;
  gap: 1rem;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.cc-license-policy__grid article {
  background: rgba(255, 255, 255, .88);
  border: 1px solid var(--cc-border);
  border-radius: 8px;
  box-shadow: 0 14px 34px rgba(12, 48, 120, .07);
  padding: 1.35rem;
}

.cc-license-policy__grid h2 {
  color: var(--cc-navy);
  font-size: 1.05rem;
  margin: 0 0 .55rem;
}

.cc-license-policy__grid p,
.cc-license-policy__note {
  color: var(--cc-muted);
  line-height: 1.6;
  margin: 0;
}

.cc-license-policy__note {
  margin-top: 1.35rem;
}

.cc-contact-page {
  align-items: start;
  display: grid;
  gap: clamp(2rem, 6vw, 5rem);
  grid-template-columns: minmax(260px, .72fr) minmax(0, 1.28fr);
  margin: clamp(2rem, 6vw, 5rem) auto;
  max-width: 1080px;
}

.cc-contact-page__intro {
  padding-top: .75rem;
}

.cc-contact-page__eyebrow {
  color: var(--cc-primary);
  font-size: .82rem;
  font-weight: 900;
  letter-spacing: .08em;
  margin: 0 0 .7rem;
  text-transform: uppercase;
}

.cc-contact-page__intro h1 {
  color: var(--cc-ink);
  font-size: clamp(2.1rem, 4vw, 3.5rem);
  font-weight: 900;
  line-height: 1.08;
  margin: 0;
}

.cc-contact-page__intro > p:not(.cc-contact-page__eyebrow) {
  color: var(--cc-muted);
  line-height: 1.7;
  margin: 1rem 0 1.4rem;
}

.cc-contact-page__email,
.cc-contact-page .cc-store-email {
  align-items: center;
  background: var(--cc-primary-soft);
  border: 1px solid var(--cc-border);
  border-radius: 8px;
  color: var(--cc-primary-dark);
  display: inline-flex;
  font-weight: 800;
  padding: .75rem .9rem;
  text-decoration: none;
}

.cc-contact-page__email:hover,
.cc-contact-page .cc-store-email:hover {
  background: #dce9ff;
  color: var(--cc-primary-dark);
  text-decoration: none;
}

.cc-contact-page .cc-store-contact {
  display: flex;
  flex-direction: column;
  gap: .75rem;
}

.cc-contact-page .cc-store-contact__address,
.cc-contact-page .cc-store-contact__details {
  color: var(--cc-muted);
  font-size: .95rem;
  font-style: normal;
  line-height: 1.6;
  margin: 0;
}

.cc-contact-page .cc-store-contact__details strong {
  color: var(--cc-navy);
}

.cc-site-footer .cc-store-email {
  color: var(--cc-primary);
  display: block;
  line-height: 1.45;
  margin: 0 0 .58rem;
  text-decoration: none;
  width: fit-content;
}

.cc-site-footer .cc-store-email:hover {
  color: var(--cc-primary-dark);
  text-decoration: none;
  transform: scale(1.045);
}

.cc-site-footer .cc-store-contact__address,
.cc-site-footer .cc-store-contact__details {
  display: none;
}

.cc-contact-page__note {
  font-size: .9rem;
}

.cc-contact-page__form {
  background: rgba(255, 255, 255, .88);
  border: 1px solid var(--cc-border);
  border-radius: 12px;
  box-shadow: 0 18px 48px rgba(12, 48, 120, .09);
  padding: clamp(1.25rem, 4vw, 2.2rem);
}

.cc-contact-page__form .page-title-section {
  color: var(--cc-ink);
  font-size: 1.55rem;
  font-weight: 900;
  margin-bottom: 1.5rem;
}

.cc-contact-page__form .form-label {
  color: var(--cc-navy);
  font-weight: 800;
}

.cc-contact-page__form .form-control,
.cc-contact-page__form .form-select {
  border-color: var(--cc-border);
  border-radius: 8px;
  min-height: 48px;
}

.cc-contact-page__form textarea.form-control {
  min-height: 148px;
}

.cc-contact-page__form .buttons-wrapper {
  margin-top: 1.5rem;
}

.cc-contact-page__form .btn-primary {
  background: linear-gradient(135deg, var(--cc-primary), var(--cc-cyan));
  border: 0;
  border-radius: 999px;
  box-shadow: 0 12px 26px rgba(15, 92, 255, .22);
  font-weight: 800;
  padding: .82rem 1.25rem;
}

.login,
.register-form {
  background: rgba(255, 255, 255, .88);
  border: 1px solid var(--cc-border);
  border-radius: 12px;
  box-shadow: 0 18px 48px rgba(12, 48, 120, .09);
  margin: clamp(1.5rem, 4vw, 2.5rem) auto;
  padding: clamp(1.25rem, 4vw, 2.2rem);
}

.login hr,
.register-form hr {
  border-top: 1px solid var(--cc-border);
  margin: 1.75rem 0;
  opacity: 1;
}

.login .form-label,
.register-form .form-label {
  color: var(--cc-navy);
  font-weight: 800;
}

.login .form-control,
.login .form-select,
.register-form .form-control,
.register-form .form-select {
  border-color: var(--cc-border);
  border-radius: 8px;
  min-height: 48px;
}

.login .buttons-wrapper,
.register-form .buttons-wrapper {
  align-items: center;
  margin-top: 1.5rem;
}

.login .btn-primary,
.register-form .btn-primary {
  background: linear-gradient(135deg, var(--cc-primary), var(--cc-cyan));
  border: 0;
  border-radius: 999px;
  box-shadow: 0 12px 26px rgba(15, 92, 255, .22);
  font-weight: 800;
  padding: .82rem 1.5rem;
  white-space: nowrap;
}

.login .btn-basic {
  color: var(--cc-primary);
  font-weight: 700;
  padding-left: 0;
  padding-right: 0;
  text-decoration: underline;
}

.login__register-prompt {
  margin-top: 1.75rem;
}

.login__register-prompt h2 {
  color: var(--cc-navy);
  font-size: 1.15rem;
  font-weight: 800;
}

.login__register-prompt .btn-outline-primary {
  border-radius: 999px;
  border-width: 2px;
  font-weight: 800;
  min-height: 46px;
  padding: .7rem 1.25rem;
}

.register-form__login-prompt {
  margin-top: 1.75rem;
}

.register-form__login-prompt a {
  font-weight: 700;
}

.page-product .product-comments-wrapper {
  background: rgba(255, 255, 255, .82);
  border: 1px solid var(--cc-border);
  border-radius: 8px;
  box-shadow: 0 18px 48px rgba(12, 48, 120, .09);
  margin-top: clamp(1.5rem, 4vw, 2.6rem);
  padding: clamp(1.25rem, 3vw, 2rem);
}

.product__bottom-left > *,
.product__bottom-right > * {
  padding: 1.2rem;
}

.product .blockreassurance_product,
.product .product-features,
.product .tabs,
.product .product-information {
  background: transparent;
  border: 0;
  box-shadow: none;
}

.product-title,
h1,
h2,
h3 {
  color: var(--cc-navy);
}

.cc-live-preview {
  margin-top: .75rem;
}

.cc-live-preview .btn {
  border-color: var(--cc-primary);
  color: var(--cc-primary);
  font-weight: 800;
}

.cc-live-preview .btn:hover {
  background: var(--cc-primary-soft);
}

#footer.footer {
  background:
    linear-gradient(135deg, #eaf2ff 0%, #dff6ff 48%, #edf5ff 100%);
  border-top: 1px solid var(--cc-border);
  color: var(--cc-text);
  padding: clamp(2.6rem, 5vw, 4rem) 0 1.25rem;
  position: relative;
}

#footer.footer:before {
  background:
    linear-gradient(90deg, rgba(15, 92, 255, .08) 1px, transparent 1px),
    linear-gradient(0deg, rgba(15, 92, 255, .07) 1px, transparent 1px);
  background-size: 42px 42px;
  content: "";
  inset: 0;
  mask-image: linear-gradient(to bottom, rgba(0, 0, 0, .6), transparent 90%);
  pointer-events: none;
  position: absolute;
}

.cc-site-footer__inner {
  max-width: 1180px;
  position: relative;
  z-index: 1;
}

.cc-site-footer__grid {
  display: grid;
  gap: clamp(1.4rem, 3vw, 2.4rem);
  grid-template-columns: 1.25fr repeat(3, 1fr);
  text-align: left;
}

.cc-site-footer section {
  align-items: flex-start;
  display: flex;
  flex-direction: column;
  gap: .72rem;
  min-width: 0;
}

.cc-site-footer h2 {
  color: var(--cc-ink);
  font-size: .95rem;
  font-weight: 900;
  margin: 0 0 .4rem;
}

.cc-site-footer section > a:not(.cc-site-footer__logo) {
  color: var(--cc-primary);
  display: block !important;
  line-height: 1.45;
  margin: 0 0 .58rem;
  text-decoration: none;
  transform-origin: left center;
  transition: color .18s ease, transform .18s ease, text-decoration-color .18s ease;
  width: fit-content;
}

.cc-site-footer__logo {
  display: inline-flex;
}

.cc-site-footer section > a:not(.cc-site-footer__logo):hover {
  color: var(--cc-primary-dark);
  text-decoration: none;
  transform: scale(1.045);
}

.cc-site-footer .cc-footer-link-block ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.cc-site-footer .cc-footer-link-block li + li {
  margin-top: .72rem;
}

.cc-site-footer .cc-footer-link-block a {
  display: inline-block;
  color: var(--cc-blue, #3d63ff);
  font-size: .94rem;
  text-decoration: none;
  transition: transform .18s ease, color .18s ease;
}

.cc-site-footer .cc-footer-link-block a:hover {
  color: var(--cc-navy, #0c2357);
  transform: translateX(.2rem);
}

.product-images-modal .modal-content {
  background: #071a48;
  border: 1px solid rgba(117, 176, 255, .34);
  border-radius: 14px;
  box-shadow: 0 28px 90px rgba(3, 18, 61, .55);
}

.product-images-modal .modal-header {
  border: 0;
  padding: .7rem;
}

.product-images-modal .btn-close {
  background-color: #fff;
  border-radius: 50%;
  opacity: 1;
}

.product-images-modal__body {
  padding: 0 1rem 1rem;
}

.product-images-modal__carousel {
  align-items: center;
  display: flex;
  min-height: min(76vh, 820px);
}

.product-images-modal__carousel .carousel-inner {
  width: 100%;
}

.product-images-modal__carousel .carousel-item img {
  display: block;
  margin: 0 auto;
  max-height: min(70vh, 760px);
  object-fit: contain;
  width: auto;
}

.product__zoom {
  transition: box-shadow .18s ease, transform .18s ease;
}

.product__zoom:hover {
  box-shadow: 0 10px 24px rgba(15, 92, 255, .24);
  transform: scale(1.06);
}

/* The shop is configured without VAT; show one final product price only. */
.product__tax-infos {
  display: none;
}

/* Checkout */
#checkout #wrapper {
  background: linear-gradient(135deg, #f4f8ff 0%, #edf6ff 55%, #f8fbff 100%);
}

#checkout .checkout-steps {
  background: rgba(255, 255, 255, .9);
  border-bottom: 1px solid var(--cc-border);
  box-shadow: 0 8px 26px rgba(18, 52, 115, .05);
  padding: 1.25rem 1rem;
}

#checkout .checkout-steps__list {
  margin: 0 auto;
  max-width: 760px;
}

#checkout .columns-container {
  padding-bottom: clamp(3rem, 7vw, 6rem);
  padding-top: clamp(2rem, 5vw, 4rem);
}

#checkout .checkout-grid {
  align-items: start;
  row-gap: 1.5rem;
}

#checkout .checkout-grid__content .step--current {
  background: rgba(255, 255, 255, .94);
  border: 1px solid var(--cc-border);
  border-radius: 16px;
  box-shadow: 0 16px 42px rgba(30, 75, 150, .09);
  padding: clamp(1.35rem, 3vw, 2.25rem);
}

#checkout .step__title {
  margin-bottom: 1.6rem;
}

#checkout .step__title .page-title-section {
  color: var(--cc-ink);
  font-size: clamp(1.7rem, 3vw, 2.25rem);
  font-weight: 900;
  letter-spacing: -.035em;
}

#checkout .step__title hr {
  border-color: var(--cc-border);
  margin: 1.05rem 0 0;
  opacity: 1;
}

#checkout #personal-information-tabs {
  border-bottom: 1px solid var(--cc-border);
  gap: .4rem;
  margin-bottom: 1.45rem;
}

#checkout #personal-information-tabs .nav-link {
  border: 0;
  border-radius: 9px 9px 0 0;
  color: var(--cc-muted);
  font-weight: 800;
  padding: .7rem .2rem;
}

#checkout #personal-information-tabs .nav-link.active {
  border-bottom: 3px solid var(--cc-primary);
  color: var(--cc-ink);
}

#checkout .form-control,
#checkout .form-select {
  border-color: #d5e1f5;
  border-radius: 9px;
  min-height: 48px;
}

#checkout .form-control:focus,
#checkout .form-select:focus {
  border-color: var(--cc-primary);
  box-shadow: 0 0 0 .22rem rgba(47, 101, 255, .13);
}

#checkout-personal-information-step .form-text,
#checkout-personal-information-step .form-check-label em {
  display: none;
}

#checkout-personal-information-step .form-check {
  align-items: center;
  background: #f7faff;
  border: 1px solid #dce8fb;
  border-radius: 9px;
  display: flex;
  gap: .25rem;
  margin: .65rem 0;
  padding: .72rem .85rem;
}

#checkout-personal-information-step .form-check-input {
  flex: 0 0 auto;
  float: none;
  margin-left: 0;
  margin-top: 0;
}

#checkout .cart-summary__products-number {
  color: var(--cc-ink);
  font-size: .95rem;
  font-weight: 900;
  padding: 1.15rem 1.2rem .85rem;
}

#checkout .cart-summary__products > hr {
  display: none;
}

#checkout .cart-summary__products-accordion {
  border-bottom: 1px solid #e5edf9;
  border-top: 1px solid #e5edf9;
}

#checkout .cart-summary__products-accordion .accordion-button {
  background: #fff;
  box-shadow: none;
  color: var(--cc-ink);
  font-size: .9rem;
  font-weight: 800;
  padding: .9rem 1.2rem;
}

#checkout .cart-summary__subtotals .cart-summary__line {
  background: #fff;
  margin: 0;
}

#checkout .cart-summary__total .cart-summary__line {
  align-items: center;
  background: linear-gradient(90deg, #edf3ff, #f5fbff);
  border-top: 1px solid #dce8fb;
  display: flex;
  font-size: 1.05rem;
  justify-content: space-between;
  padding: 1.05rem 1.2rem;
}

#checkout .blockreassurance--checkout .reassurance__image,
#checkout .blockreassurance--checkout .reassurance__image svg {
  background: transparent !important;
}

#checkout .blockreassurance--checkout .reassurance__image svg,
#checkout .blockreassurance--checkout .reassurance__image svg * {
  fill: none !important;
  stroke: var(--cc-primary) !important;
}

#checkout .blockreassurance--checkout .reassurance__image img {
  display: none !important;
}

#checkout .blockreassurance--checkout .reassurance__image > svg {
  display: none !important;
}

#checkout .blockreassurance--checkout .reassurance__image::after {
  background: center / contain no-repeat;
  content: '';
  display: block;
  height: 38px;
  width: 38px;
}

#checkout .blockreassurance--checkout .reassurance:nth-child(1) .reassurance__image::after {
  background-image: url('../img/reassurance-shield.svg');
}

#checkout .blockreassurance--checkout .reassurance:nth-child(2) .reassurance__image::after {
  background-image: url('../img/reassurance-download.svg');
}

#checkout .blockreassurance--checkout .reassurance:nth-child(3) .reassurance__image::after {
  background-image: url('../img/reassurance-support.svg');
}

#checkout-addresses-step .form-fields {
  display: grid;
  gap: .9rem 1rem;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

#checkout-addresses-step .form-fields > .mb-3 {
  margin: 0 !important;
}

#checkout-addresses-step .form-fields > .mb-3:has([name='alias']),
#checkout-addresses-step .form-fields > .mb-3:has([name='company']),
#checkout-addresses-step .form-fields > .mb-3:has([name='vat_number']),
#checkout-addresses-step .form-fields > .mb-3:has([name='address2']),
#checkout-addresses-step .form-fields > .mb-3:has([name='phone']) {
  display: none;
}

#checkout-addresses-step .form-check:has([name='use_same_address']) {
  align-items: center;
  background: #f7faff;
  border: 1px solid #dce8fb;
  border-radius: 9px;
  display: flex;
  gap: .25rem;
  margin: 1rem 0 0;
  padding: .72rem .85rem;
}

#checkout-addresses-step .form-check:has([name='use_same_address']) .form-check-input {
  float: none;
  margin-left: 0;
  margin-top: 0;
}

#checkout-addresses-step .cc-invoice-address-toggle {
  align-items: center;
  background: #f7faff;
  border: 1px solid #dce8fb;
  border-radius: 9px;
  display: flex;
  gap: .5rem;
  margin: 1rem 0 0;
  padding: .8rem .9rem;
}

#checkout-addresses-step .cc-invoice-address-toggle .form-check-input {
  flex: 0 0 auto;
  float: none;
  margin: 0;
}

#checkout-addresses-step .form-fields > .mb-3:has([name='firstname']),
#checkout-addresses-step .form-fields > .mb-3:has([name='lastname']),
#checkout-addresses-step .form-fields > .mb-3:has([name='address1']),
#checkout-addresses-step .form-fields > .mb-3:has([name='id_country']) {
  grid-column: 1 / -1;
}

@media (max-width: 620px) {
  #checkout-addresses-step .form-fields {
    grid-template-columns: 1fr;
  }
}

#checkout .checkout-grid__aside-wrapper {
  position: sticky;
  top: 1.25rem;
}

#checkout .checkout__summary-accordion-item {
  background: #fff;
  border: 1px solid var(--cc-border);
  border-radius: 16px;
  box-shadow: 0 16px 42px rgba(30, 75, 150, .09);
  overflow: hidden;
}

#checkout .checkout__summary-accordion-header .accordion-button {
  background: #fff;
  box-shadow: none;
  color: var(--cc-ink);
  font-size: 1rem;
  font-weight: 900;
  padding: 1.1rem 1.2rem;
}

#checkout .cart-summary__line {
  border-top: 1px solid #e5edf9;
  padding: .9rem 1.2rem;
}

#checkout .cart-summary__line--bold {
  background: #f4f8ff;
  color: var(--cc-ink);
  font-size: 1rem;
}

#checkout .checkout-grid__aside .blockreassurance {
  background: rgba(255, 255, 255, .76);
  border: 1px solid var(--cc-border);
  border-radius: 16px;
  margin-top: 1rem;
  padding: 1rem;
}

/* Payment is intentionally a single, clear online-payment choice. */
#checkout-payment-step .payment-options__list {
  display: grid;
  gap: .85rem;
}

#checkout-payment-step .payment-options > div > .payment-option,
#checkout-payment-step .payment-option {
  background: #f7faff;
  border: 1px solid #dce8fb;
  border-radius: 12px;
  overflow: hidden;
  transition: border-color .18s ease, box-shadow .18s ease, background-color .18s ease;
}

#checkout-payment-step .payment-option:has(input[name='payment-option']:checked) {
  background: #fff;
  border-color: var(--cc-primary);
  box-shadow: 0 8px 22px rgba(47, 101, 255, .12);
}

#checkout-payment-step .payment-option {
  align-items: center;
  display: flex;
  gap: .8rem;
  margin: 0;
  min-height: 60px;
  padding: .85rem 1rem;
}

#checkout-payment-step .payment-option input[name='payment-option'] {
  flex: 0 0 auto;
  float: none;
  height: 1.15rem;
  margin: 0;
  width: 1.15rem;
}

#checkout-payment-step .payment-option label {
  color: var(--cc-ink);
  cursor: pointer;
  font-size: 1rem;
  font-weight: 800;
  margin: 0;
}

#checkout-payment-step .additional-information {
  border-top: 1px solid #e5edf9;
  margin: 0 0 .85rem;
  padding: 1rem;
}

/* This is only the module's non-JavaScript fallback and must not appear in checkout. */
#checkout-payment-step .payment-option__no-js-form,
#checkout-payment-step .payment-option__no-js-form button,
#checkout-payment-step .payment-option form.ps-hidden-by-js {
  display: none !important;
}

#checkout-payment-step .payment-options + .condition-label {
  margin-top: 1.15rem;
}

#checkout-payment-step .js-payment-confirmation button,
#checkout-payment-step #payment-confirmation button {
  min-width: 224px;
}

.cc-stripe-order-status {
  background: #f6f9ff;
  border: 1px solid #d5e2fb;
  border-radius: 12px;
  color: var(--cc-ink);
  margin: 1.25rem 0 1.6rem;
  padding: 1rem 1.15rem;
}

@media (max-width: 991px) {
  #checkout .checkout-grid__aside-wrapper {
    position: static;
  }
}

.cc-site-footer__brand p {
  line-height: 1.65;
  margin: .35rem 0 .2rem;
  max-width: 340px;
  text-align: left;
}

.cc-site-footer__logo {
  color: var(--cc-ink);
  margin-bottom: .45rem;
}

.cc-site-footer__logo img {
  filter: drop-shadow(0 12px 22px rgba(25, 201, 245, .22));
}

.cc-site-footer__bottom {
  align-items: center;
  border-top: 1px solid rgba(15, 92, 255, .16);
  display: flex;
  gap: 1rem;
  justify-content: center;
  margin-top: clamp(2rem, 5vw, 3.4rem);
  padding-top: 1.25rem;
}

.cc-site-footer__bottom span {
  color: var(--cc-muted);
  font-size: .88rem;
}

@media (max-width: 980px) {
  .cc-site-header__inner {
    grid-template-columns: minmax(0, 1fr) auto;
  }

  .cc-site-header__actions {
    flex-wrap: wrap;
    justify-content: flex-start;
  }

  .cc-site-header__menu-toggle {
    display: inline-flex;
  }

  .cc-site-header__nav,
  .cc-site-header__search,
  .cc-site-header__actions {
    grid-column: 1 / -1;
  }

  .cc-site-header__actions {
    order: 2;
  }

  .cc-site-header__search {
    order: 3;
  }

  .cc-site-header__nav {
    display: none;
    order: 4;
  }

  .cc-site-header__inner.is-menu-open .cc-site-header__nav {
    display: block;
  }

  .cc-main-menu__list[data-depth="0"] {
    align-items: stretch;
    background: rgba(255, 255, 255, .92);
    border: 1px solid var(--cc-border);
    border-radius: 8px;
    flex-direction: column;
    gap: .2rem;
    padding: .4rem;
  }

  .cc-main-menu__link {
    justify-content: space-between;
    min-height: 44px;
    width: 100%;
  }

  .cc-main-menu__item.has-children {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 44px;
  }

  .cc-main-menu__item.has-children > .cc-main-menu__link {
    grid-column: 1;
  }

  .cc-main-menu__submenu-toggle {
    align-items: center;
    align-self: start;
    background: transparent;
    border: 0;
    color: var(--cc-primary-dark);
    cursor: pointer;
    display: inline-flex;
    grid-column: 2;
    grid-row: 1;
    height: 44px;
    justify-content: center;
    padding: 0;
    width: 44px;
  }

  .cc-main-menu__submenu-toggle .cc-main-menu__chevron {
    margin: 0;
    transition: transform .18s ease;
  }

  .cc-main-menu__item.is-submenu-open > .cc-main-menu__submenu-toggle .cc-main-menu__chevron {
    transform: rotate(225deg);
  }

  .cc-main-menu__submenu,
  .cc-main-menu__submenu .cc-main-menu__submenu {
    display: none;
    box-shadow: none;
    grid-column: 1 / -1;
    left: auto;
    margin: .1rem 0 .35rem 1rem;
    opacity: 1;
    pointer-events: auto;
    position: static;
    top: auto;
    transform: none;
  }

  .cc-main-menu__item.is-submenu-open > .cc-main-menu__submenu {
    display: block;
  }

  .cc-hero {
    min-height: auto;
  }

  .cc-hero__layout,
  .cc-strip {
    grid-template-columns: 1fr;
  }

  .cc-grid {
    grid-template-columns: 1fr;
  }

  #js-product-list .products,
  #products .products {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

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

  .product__top,
  .page-product .product__container,
  .product__bottom {
    grid-template-columns: 1fr;
  }

  .product__infos,
  .page-product .product__right {
    position: static;
  }

  .page-product .blockreassurance--product {
    grid-template-columns: 1fr;
  }

  /* Columns stack on mobile, so there's no row-height mismatch to fill - go
     back to a simple fixed-aspect image instead of stretching to match. */
  .product__carousel {
    aspect-ratio: 16 / 9;
    flex: none;
    height: auto;
    min-height: 0;
  }

  .product__carousel .carousel-inner,
  .product__carousel .carousel-item {
    height: 100%;
  }

  .cc-license-policy__grid {
    grid-template-columns: 1fr;
  }

  .cc-contact-page {
    grid-template-columns: 1fr;
  }

  .cc-hero-nav {
    align-items: flex-start;
    flex-direction: column;
  }

  .cc-hero-nav__links {
    justify-content: flex-start;
    width: 100%;
  }
}

@media (max-width: 680px) {
  #header.header {
    position: static;
  }

  .cc-site-header__brand {
    font-size: 1rem;
  }

  .cc-site-header__nav a,
  .cc-main-menu__link,
  .cc-site-header__icon-link,
  .cc-site-header__cart {
    padding-left: .6rem;
    padding-right: .6rem;
  }

  .cc-site-header__inner {
    gap: .65rem;
    min-height: 0;
  }

  .cc-site-header__actions {
    gap: .2rem;
  }

  .cc-site-header__icon-link,
  .cc-site-header__cart {
    font-size: .84rem;
  }

  .cc-site-header__search input {
    min-height: 42px;
  }

  .cc-home__inner {
    padding-left: 1rem;
    padding-right: 1rem;
  }

  .cc-hero__metrics,
  .cc-preview__cards {
    grid-template-columns: 1fr;
  }

  .cc-hero h1 {
    font-size: 2.6rem;
  }

  .cc-hero-nav__links > a {
    padding-left: .6rem;
    padding-right: .6rem;
  }

  .cc-language-switch,
  .cc-currency-switch {
    width: 100%;
  }

  .cc-language-switch__item,
  .cc-currency-switch__item {
    flex: 1;
  }

  .cc-cookie-banner__inner {
    flex-direction: column;
    align-items: stretch;
  }

  .cc-cookie-banner__actions {
    justify-content: stretch;
  }

  .cc-cookie-banner__actions .cc-btn {
    flex: 1;
  }

  .cc-site-footer__grid {
    grid-template-columns: 1fr;
  }

  #js-product-list .products,
  #products .products {
    grid-template-columns: 1fr;
  }

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

  .cc-site-footer__grid {
    display: grid;
    gap: 1.5rem;
  }

  .cc-site-footer section {
    gap: .5rem;
  }

  .cc-site-footer section > a:not(.cc-site-footer__logo) {
    min-height: 38px;
  }

  .cc-site-footer section:not(.cc-site-footer__brand) {
    align-items: center;
    text-align: center;
  }

  .cc-site-footer__brand {
    align-items: center;
    text-align: center;
  }

  .cc-site-footer__brand p {
    text-align: center;
  }

  .cc-site-footer section:not(.cc-site-footer__brand) > a:not(.cc-site-footer__logo) {
    transform-origin: center;
  }

  .cc-site-footer .cc-store-email {
    text-align: center;
    transform-origin: center;
  }

  .subcategory__list {
    grid-template-columns: 1fr;
  }

  .cc-site-footer__bottom {
    align-items: center;
    flex-direction: column;
    text-align: center;
  }

  .cc-site-footer__bottom span {
    width: 100%;
  }

  .page-category #left-column {
    display: none;
  }

  .page-category #content-wrapper {
    padding-top: 1.25rem;
  }
}

.cc-free-download {
  margin-top: .9rem;
}

.cc-free-download__link {
  align-items: center;
  background: linear-gradient(135deg, var(--cc-primary), var(--cc-cyan));
  border-radius: 999px;
  box-shadow: 0 14px 30px rgba(15, 92, 255, .24);
  color: #fff;
  display: inline-flex;
  font-weight: 800;
  gap: .5rem;
  min-height: 46px;
  padding: 0 1.25rem;
  text-decoration: none;
  transition: transform .18s ease, box-shadow .18s ease;
}

.cc-free-download__link:hover {
  box-shadow: 0 18px 36px rgba(15, 92, 255, .3);
  color: #fff;
  transform: translateY(-1px);
}

.cc-free-download__size {
  color: rgba(255, 255, 255, .8);
  font-weight: 600;
}

@media (prefers-reduced-motion: reduce) {
  *,
  *:before,
  *:after {
    scroll-behavior: auto !important;
    transition: none !important;
  }
}
