/** Shopify CDN: Minification failed

Line 3612:0 Expected "}" to go with "{"

**/
/* ================================================
   ARC THE STORY — custom.css
   Opgeschoond: 2026-05-13
   Backup: custom-backup-2026-05-13.css (in assets)
   ================================================ */

/* ================================================
   1. UITLIJNING VARIABELEN — enige bron van waarheid
   ================================================ */
:root {
  --container-pad-x: 30px;
  --container-pad-x-half: 15px;
  --larger-section-padding: 88px;
  --page-max: 1180px;
  --gutter: clamp(20px, 4vw, 56px);
}

@media screen and (max-width: 749px) {
  :root {
    --container-pad-x: 16px;
    --container-pad-x-half: 8px;
  }
}


/* ================================================
   2. MASTER UITLIJNING — alle secties op één lijn
   ================================================ */

/* Algemene content containers */
.template-index .page-width,
.template-index .container {
  max-width: 1340px;
  margin-left: auto;
  margin-right: auto;
  padding-left: var(--container-pad-x);
  padding-right: var(--container-pad-x);
}

/* Hero / banner tekst */
.template-index .banner__content,
.template-index .slideshow__text-wrapper,
.template-index .rich-text__wrapper {
  padding-left: var(--container-pad-x) !important;
  padding-right: var(--container-pad-x) !important;
}

/* Voorkom dubbele inspringing binnen banner */
.template-index .banner__content .banner__box,
.template-index .banner__content .banner__text,
.template-index .banner__content .rte {
  padding-left: 0 !important;
  margin-left: 0 !important;
  text-align: left !important;
}

/* Image with text secties */
.section-image-with-text .feature-text-paired,
.section-image-with-text .bw-btn-row,
.section-image-with-text .bw-bottom-row,
.bw-text-col{
  padding-left: var(--container-pad-x) !important;
  padding-right: var(--container-pad-x) !important;
}

/* Omgekeerde kolom (tekst rechts) */
.section-image-with-text .column--text-right .feature-text-paired {
  padding-left: 0 !important;
  padding-right: var(--container-pad-x) !important;
}
.template-index .container--no-max {
  padding-left: var(--container-pad-x) !important;
  padding-right: var(--container-pad-x) !important;
}
/* Mobiel */
@media (max-width: 767px) {
  .template-index .banner__content,
  .template-index .slideshow__text-wrapper,
  .template-index .rich-text__wrapper,
  .section-image-with-text .feature-text-paired,
  .section-image-with-text .bw-btn-row,
  .section-image-with-text .bw-bottom-row,
  .bw-text-col,
  .pcg-section__header {
    padding-left: var(--container-pad-x) !important;
    padding-right: var(--container-pad-x) !important;
  }
}


/* ================================================
   3. VERTICAAL RITME — sectie padding
   ================================================ */

/* Standaard secties */
.template-index .section-padding {
  padding-top: 72px;
  padding-bottom: 72px;
}

/* Grote storytelling secties */
.template-index .image-with-text.section-padding,
.template-index .banner.section-padding,
.template-index .slideshow.section-padding {
  padding-top: 96px !important;
  padding-bottom: 96px !important;
}

/* Compacte info secties */
.template-index .multicolumn.section-padding,
.template-index .icon-with-text.section-padding {
  padding-top: 48px;
  padding-bottom: 48px;
}

/* Multicolumn extra ruimte onderaan */
.template-index .multicolumn {
  padding-bottom: 96px !important;
  margin-bottom: 0 !important;
}

/* Icon row */
.template-index .icon-with-text {
  padding-top: 64px !important;
  padding-bottom: 64px !important;
}

.template-index .icon-with-text__item,
.template-index .icon-with-text__block {
  gap: 12px !important;
}

.template-index .icon-with-text p {
  line-height: 1.55 !important;
}

/* Titels */
.template-index h2 {
  margin-bottom: 32px !important;
}

/* Banner gap */
@media (min-width: 990px) {
  .template-index .banner__content {
    gap: 48px !important;
  }
  .template-index .multicolumn .multicolumn-card__image-wrapper {
    margin-bottom: 24px !important;
  }
}


/* ================================================
   4. GRID RITME
   ================================================ */

.template-index .grid,
.template-index .multicolumn-list,
.template-index .product-grid,
.template-index .collection-list {
  column-gap: 40px !important;
  row-gap: 40px !important;
}

.template-collection .product-grid {
  row-gap: 40px !important;
}


/* ================================================
   5. TYPOGRAFIE
   ================================================ */

/* Font face definities */
@font-face {
  font-family: 'MrGabe';
  src: url('{{ "MrGabe-BlackItalic.woff" | asset_url }}') format('woff');
  font-style: italic;
  font-weight: 900;
}

@font-face {
  font-family: 'IvyPresto';
  src: url('{{ "IvyPrestoDisplay-Regular.woff" | asset_url }}') format('woff');
  font-style: normal;
  font-weight: 400;
}

@font-face {
  font-family: 'IvyPresto';
  src: url('{{ "IvyPrestoDisplay-ThinItalic.woff" | asset_url }}') format('woff');
  font-style: italic;
  font-weight: 300;
}

@font-face {
  font-family: 'AWConqueror';
  src: url('/cdn/shop/files/AWConquerorStdSansRegular.woff2') format('woff2');
  font-style: normal;
  font-weight: 300;
}

/* Bold / italic normalisatie */
b, strong, .bold, .font-bold {
  font-weight: 400 !important;
}

i, em, .italic, .font-italic {
  font-style: normal !important;
}

/* Knoppen */
a.btn {
  font-family: 'AW Conqueror', sans-serif !important;
  font-weight: 300 !important;
  padding-bottom: 18px;
}

a.btn.btn-primary:hover {
  background-color: #f1eada;
  border-color: #f1eada;
  color: #2c180f;
}

/* Seperator voor titels */
.hometitle,
.align-ltr-left h2.majortitle {
  text-align: left;
  border-bottom: 1px solid;
  padding-bottom: 32px;
  margin-bottom: 32px;
}

.hometitle h2 a,
.align-ltr-left h2.majortitle {
  font-size: 40px;
  font-family: var(--heading-font-family) !important;
}

/* Testimonials */
.testimonials blockquote,
.testimonials .testimonial__blockquote,
.testimonials .testimonial__text,
.section-testimonials blockquote,
.section-testimonials .testimonial__blockquote,
.section-testimonials .testimonial__text {
  font-family: "Ivy Presto Display", serif !important;
  font-weight: 400 !important;
  font-size: 24px !important;
  line-height: 1.38 !important;
}

.testimonials .testimonial__author,
.section-testimonials .testimonial__author {
  font-family: "AW Conqueror Sans", system-ui, -apple-system, "Segoe UI", Arial, sans-serif !important;
  font-size: 13px !important;
  line-height: 1.2 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
}

.use-color-scheme--1 blockquote,
.use-color-scheme--1 .testimonial__author {
  color: #2C180F !important;
}

/* Navigatie font grootte */
@media (min-width: 768px) and (max-width: 1024px) {
  .navigation--left .navigation__tier-1 > .navigation__item > .navigation__link {
    font-size: 0.85em;
  }
}

@media (min-width: 1025px) and (max-width: 1200px) {
  .navigation--left .navigation__tier-1 > .navigation__item > .navigation__link {
    font-size: 0.9em;
  }
}

.navigation--left .navigation__tier-1 > .navigation__item > .navigation__link {
  font-size: 13px !important;
}


/* ================================================
   6. GLOBO PRODUCT OPTIONS
   ================================================ */

span.label-content,
span.gpo-helptext.break-word,
span.gpo-ov-helptext,
span.choicelist-item__value {
  font-family: "AW Conqueror Sans", sans-serif !important;
}

.gpo-selected-values {
  font-weight: 700 !important;
}

span.label-content {
  margin-bottom: 4px;
  line-height: 28px;
}

.gpo-label + .gpo-selected-values.has-value {
  font-size: 14px;
}

.globo-form-control .radio-wrapper {
  font-family: 'AW Conqueror Sans';
}

.globo-formbuilder-wizard button.action.next.submit {
  font-family: 'AW Conqueror Sans';
  color: #f1eada;
  font-weight: 500;
}

.globo-formbuilder-wizard span.label-content {
  font-size: 16px;
  font-weight: 500;
}


/* ================================================
   7. HEADER
   ================================================ */

.menu-promotion__image img {
  aspect-ratio: 1 / 1;
}

.template-index div.pageheader {
  background-color: #f1eada;
}

.template-index .announcement-bar {
  background-color: #2c180f;
}

.template-index .announcement-bar .announcement-bar-usp__text,
.template-index .announcement-bar span.text-start,
.template-index .announcement-bar svg {
  color: #f1eada;
}

.template-index .announcement-bar img {
  filter: invert(1);
}

.template-collection .announcement-bar--with-announcement {
  background-color: #b79d86;
}

.navigation .navigation__tier-1 {
  background-color: transparent;
}

.section-header li.navigation__item.navigation__item--with-children.navigation__item--with-small-menu {
  position: relative;
}
.logo-area__middle {
  padding-left: 20px;
}
/* Desktop navigatie */
@media (min-width: 768px) {
  #main-nav {
    display: none !important;
  }

  .section-header {
    height: 71px;
  }

  .navigation--left {
    visibility: visible !important;
    border: none;
  }

  .logo-area__left__inner {
    overflow: visible;
    width: 583px !important;
  }

  .pageheader--layout-inline-menu-center .logo-area__left,
  .pageheader--layout-inline-menu-left .logo-area__left {
    min-height: calc(22px * 2 + 1.5em);
  }

  .pageheader--layout-inline-menu-center .navigation--left,
  .pageheader--layout-inline-menu-left .navigation--left {
    width: auto;
    max-width: none;
  }

  .navigation--inline-with-dropdowns .navigation__tier-2-container {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 100;
    visibility: hidden;
    opacity: 0;
    pointer-events: none;
    transition: opacity 175ms ease-in, visibility 175ms;
    background: var(--main-nav-bg, #fff);
    border: 1px solid var(--heading-divider-col, #e5e5e5);
    border-top: none;
  }

  .navigation--inline-with-dropdowns .navigation__item--with-small-menu > .navigation__tier-2-container {
    width: max-content;
    min-width: 170px;
    max-width: 280px;
  }

  .navigation--inline-with-dropdowns .navigation__item--with-mega-menu > .navigation__tier-2-container {
    left: 50%;
    transform: translateX(-50%);
    width: 100vw;
    max-width: var(--page-width, 1400px);
  }

  .navigation--inline-with-dropdowns .navigation__item--with-children:hover > .navigation__tier-2-container,
  .navigation--inline-with-dropdowns .navigation__item--with-children:focus-within > .navigation__tier-2-container {
    visibility: visible;
    opacity: 1;
    pointer-events: auto;
  }

  .navigation--inline-with-dropdowns .navigation__children-toggle {
    display: none;
  }
}

.navigation__tier-2-container {
  background-color: #f1eada !important;
}

.navigation__tier-2-container a,
.navigation__tier-2 .navigation__link {
  color: #2c180f !important;
}


/* ================================================
   8. ANNOUNCEMENT BAR USP
   ================================================ */

.announcement-bar--sticky {
  z-index: 400;
}

.announcement-bar-usp {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 24px;
  width: 100%;
  flex-wrap: wrap;
}

.announcement-bar-usp__item {
  display: flex;
  align-items: center;
  gap: 8px;
  flex: 0 1 auto;
}

.announcement-bar-usp__icon {
  width: auto;
  height: 18px;
  max-width: 18px;
  object-fit: contain;
  flex-shrink: 0;
}

.announcement-bar-usp__text {
  font-size: inherit;
  color: inherit;
  white-space: nowrap;
}

@media (min-width: 768px) {
  .announcement-bar-usp {
    gap: 40px;
    flex-wrap: nowrap;
  }
}

@media (max-width: 767px) {
  .announcement-bar-usp {
    gap: 8px;
  }
  .announcement-bar-usp__item {
    gap: 6px;
  }
  .announcement-bar-usp__text {
    font-size: 10px;
  }
}


/* ================================================
   9. FOOTER
   ================================================ */

.shopify-section-group-footer-group.section-newsletter h2,
.shopify-section-group-footer-group.section-newsletter p,
.section-footer,
.section-footer .section-footer__title,
span.copy {
  color: #f1eada;
}

.shopify-section-group-footer-group.section-newsletter h2 {
  border-bottom: none;
  padding-bottom: 8px;
}

.section-footer__menu-block__menu li a,
ul.section-footer__lower-menu__list li a {
  color: #c7c5fc;
}

.section-footer__row.section-footer__row--blocks {
  gap: 0;
  margin-left: auto !important;
  margin-right: auto !important;
  border-bottom: 0;
  max-width: 1330px !important;
  padding: 10px 45px !important;
}

.section-footer__row.section-footer__row-lower {
  border-top: 1px solid #fff;
  padding: 32px 45px !important;
  max-width: 1330px !important;
}

@media (max-width: 1220px) and (min-width: 991px) {
  .section-footer__row.section-footer__row-lower {
    margin-left: 50px !important;
    margin-right: 50px !important;
  }
}

.shopify-section-group-footer-group,
.section-footer,
.section-footer__inner,
.section-footer__content {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.section-footer__row__col {
  padding-left: 0 !important;
  padding-right: 0 !important;
  padding-top: 0 !important;
}

.section-footer__row {
  align-items: start !important;
}

.section-footer__title {
  margin: 0 0 14px 0 !important;
  line-height: 1.15 !important;
}

.section-footer__text,
.section-footer__text p,
.section-footer__row a {
  line-height: 1.6 !important;
}

/* Footer lijst iconen */
.section-footer__text li {
  position: relative;
  list-style: none !important;
}

.section-footer__text li:after {
  content: "";
  position: absolute;
  left: -30px;
  top: 5px;
  width: 20px;
  height: 20px;
  background-size: contain;
}

.section-footer__text li:nth-child(1):after {
  background-image: url(/cdn/shop/files/mail.svg?v=1767348141);
}

/* Footer speciale link */
ul.section-footer__menu-block__menu li:last-child a[href="/collections/passe-partouts"] {
  border-top: 1px solid #c7c5fc !important;
  padding-top: 12px !important;
  display: inline-block;
}

/* Newsletter sectie */
.section-newsletter .container {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: center;
  /* padding: 32px 0 16px 0; */
  padding-top:32px;
  padding-bottom:32px;
  border-bottom: 1px solid #fff;
}

.section-newsletter button {
  background: #f1eada;
  width: 100%;
  transform: translateY(-16px);
}

@media (min-width: 768px) {
  .section-newsletter .container {
    justify-content: start;
  }
  .section-newsletter .container > h2 {
    flex: 0 0 50%;
    margin-bottom: 8px;
    text-align: left;
  }
  .section-newsletter .container > .rte {
    flex: 0 0 51%;
    margin-top: 0;
    text-align: left;
  }
  .section-newsletter .container > .signup-form {
    flex: 0 0 45%;
    /* margin-top: -24px; */
    margin-left: auto;
  }
  .section-newsletter button {
    transform: none;
    width: auto;
  }
  .section-newsletter .signup-form__inline-container {
    display: inline-flex;
    width: 100%;
    justify-content: flex-end;
  }
}

/* Newsletter footer rij */
.section-footer__newsletter .section-footer__row {
  display: grid !important;
  grid-template-columns: 1fr auto !important;
  align-items: center !important;
  column-gap: 40px !important;
}

.section-footer__newsletter .section-footer__row__col:first-child {
  max-width: 60ch !important;
}

.section-footer__newsletter form {
  display: flex !important;
  gap: 10px !important;
  align-items: center !important;
}

.section-footer__newsletter input[type="email"] {
  min-width: 280px;
}


/* ================================================
   10. PRODUCT / WINKEL
   ================================================ */

/* Prijzen verbergen */
.price,
.price__container,
.price__default,
.price__regular,
.price-item,
.product-price,
.product-block__title-price,
.product-grid-item__price,
.theme-money,
.price--sold-out,
[data-price-container],
.product-price--block {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
}

/* Koopknop en uitverkocht verbergen */
.product-form__payment-container,
button[name="add"],
.product-form__add-button,
.shopify-payment-button,
.product-inventory-notice,
.payment-and-quantity__add,
.price__label {
  display: none !important;
}

/* Vendor verbergen */
.product-vendor,
.product-block__vendor,
.product-block__title-price .vendor {
  display: none !important;
}

/* Cart labels */
span.cart-item__variant-label,
span.line-item-property__label {
  font-weight: 700;
}

/* Thumbnail carousel verbergen */
.media-gallery--layout-carousel .carousel-slider.carousel.block.thumbnails {
  display: none !important;
}


/* ================================================
   11. FEATURED COLLECTION
   ================================================ */

.section-featured-collection .slider__grid {
  display: flex !important;
  flex-wrap: nowrap !important;
  gap: 4px !important;
}

.section-featured-collection .slider__item {
  flex: 0 0 360px !important;
  width: 360px !important;
}

.section-featured-collection .product-block,
.section-featured-collection .block-inner,
.section-featured-collection .block-inner-inner,
.section-featured-collection .image-cont {
  background: transparent !important;
  background-color: transparent !important;
}

.section-featured-collection .container--not-mobile {
  padding-left: var(--container-pad-x) !important;
  padding-right: var(--container-pad-x) !important;
}

.section-featured-collection .product-block__title,
.section-featured-collection .block-title,
.section-featured-collection h3 {
  text-align: left !important;
  padding-left: 12px !important;
  font-size: 14px !important;
}

@media (max-width: 768px) {
  .section-featured-collection .slider__item {
    flex: 0 0 240px !important;
  }
}
.section-featured-collection .container--no-max {
  padding-left: 30px !important;
}

/* ================================================
   12. OVERIGE SECTIES
   ================================================ */

/* Multi column border */
.column-border .column.text-column {
  padding: 0 16px;
  border-left: 1px solid #000;
}

.column-border .column.text-column:last-child {
  border-right: 1px solid #000;
}

@media (max-width: 768px) {
  .column-border .column.text-column:last-child {
    border-right: 0;
  }
}

/* Collection slider knoppen */
.collection-slider button.slider-nav__btn.has-ltr-icon {
  position: absolute;
  bottom: -20px;
  right: 0;
}

.collection-slider button.slider-nav__btn.has-ltr-icon[name="prev"] {
  right: 45px;
}

/* Collection slider mobiel padding */
@media (max-width: 768px) {
  .collection-slider-row .container,
  .collection-slider-row .container--not-mobile {
    padding-left: var(--container-pad-x);
    padding-right: var(--container-pad-x);
  }
}

/* View all knop */
.view-all a.btn {
  margin-top: 16px;
  margin-bottom: 32px;
}

/* Video sectie */
@media (min-width: 1100px) {
  .video-section .text-overlay--for-banner .text-overlay__inner {
    padding: 50px;
  }
}

/* Rich text sectie */
@media (min-width: 992px) {
  .section-rich-text .large-text {
    max-width: 50%;
  }
}

/* Image with text overlay */
.section-image-with-text-overlay .text-overlay__inner.content-in-grid {
  max-width: 1320px;
  padding: 50px;
  margin: 0 auto;
}

@media (max-width: 1340px) and (min-width: 769px) {
  .section-image-with-text-overlay .text-overlay__inner.content-in-grid {
    max-width: 1340px;
  }
}

@media (max-width: 768px) {
  .section-image-with-text-overlay .text-overlay__inner.content-in-grid {
    padding: var(--container-pad-x);
  }
}

/* Multi column layout */
.section-multi-column .flexible-layout .column {
  padding-left: 0 !important;
}


/* ================================================
   13. ARC SLIDESHOW (eigen sectie)
   ================================================ */

.arc-slideshow .arc-slideshow__wrapper {
  position: relative;
}

.arc-slideshow__static-content .text-overlay__inner {
  display: flex;
  justify-content: center;
  padding-top: 50px;
  padding-bottom: 50px;
  padding-left: 30px; 
  padding-right: 30px; 
}


.arc-slideshow__static-content .text-overlay__text {
  max-width: 1240px;
  width: 100%;
}

.arc-slideshow .arc-slideshow__static-content {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 10;
  pointer-events: none;
  display: flex;
}

.arc-slideshow .arc-slideshow__static-content .text-overlay__inner {
  pointer-events: auto;
}

@media (min-width: 992px) {
  .arc-slideshow .text-overlay__rte.rte {
    max-width: 50ch;
  }
}

.arc-slideshow .arc-slideshow__static-content .text-overlay__text,
.arc-slideshow .arc-slideshow__static-content .text-overlay__reveal {
  opacity: 1 !important;
  transform: none !important;
}


/* ================================================
   14. GALLERY CAROUSEL (eigen sectie)
   ================================================ */

.gallery__item--has-carousel {
  position: relative;
}

.gallery-carousel {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.gallery-carousel__link {
  display: block;
  width: 100%;
  height: 100%;
}

.gallery-carousel__track {
  position: relative;
  width: 100%;
  height: 100%;
}

.gallery-carousel__slide {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.5s ease, visibility 0.5s ease;
  z-index: 1;
}

.gallery-carousel__slide.is-active {
  opacity: 1;
  visibility: visible;
  position: relative;
  z-index: 2;
}

.gallery-carousel__slide .gallery__image {
  width: 100%;
  height: 100%;
}

.gallery-carousel__slide .gallery__image img,
.gallery-carousel__slide .gallery__image .rimage__image {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.gallery-carousel__overlay {
  z-index: 5;
  pointer-events: none;
}

.gallery-carousel__overlay .text-overlay__inner {
  pointer-events: auto;
}

.gallery-carousel__arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 10;
  width: 36px;
  height: 36px;
  background: rgba(255, 255, 255, 0.9);
  border: none;
  border-radius: 50%;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #333;
  opacity: 0;
  transition: opacity 0.2s ease, transform 0.2s ease, background 0.2s ease;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
}

.gallery-carousel:hover .gallery-carousel__arrow {
  opacity: 1;
}

.gallery-carousel__arrow:hover {
  background: #fff;
  transform: translateY(-50%) scale(1.08);
}

.gallery-carousel__arrow:active {
  transform: translateY(-50%) scale(0.95);
}

.gallery-carousel__arrow--prev { left: 12px; }
.gallery-carousel__arrow--next { right: 12px; }

.gallery-carousel__arrow svg {
  width: 18px;
  height: 18px;
}

.gallery-carousel__dots {
  position: absolute;
  bottom: 16px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 10;
  display: flex;
  gap: 8px;
  padding: 6px 10px;
  background: rgba(0, 0, 0, 0.3);
  border-radius: 20px;
}

.gallery-carousel__dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  border: none;
  background: rgba(255, 255, 255, 0.5);
  cursor: pointer;
  padding: 0;
  transition: background 0.2s ease, transform 0.2s ease;
}

.gallery-carousel__dot:hover {
  background: rgba(255, 255, 255, 0.8);
}

.gallery-carousel__dot.is-active {
  background: #fff;
  transform: scale(1.2);
}

@media (max-width: 767px) {
  .gallery-carousel__arrow {
    width: 32px;
    height: 32px;
    opacity: 1;
  }
  .gallery-carousel__arrow--prev { left: 8px; }
  .gallery-carousel__arrow--next { right: 8px; }
  .gallery-carousel__arrow svg { width: 16px; height: 16px; }
  .gallery-carousel__dots { bottom: 12px; gap: 6px; padding: 5px 8px; }
  .gallery-carousel__dot { width: 6px; height: 6px; }
}


/* ================================================
   15. SECTIE-SPECIFIEKE OVERRIDES (op ID)
   ================================================ */

#section-id-template--28448670843144__multi_column_cDkaUy .hometitle {
  border-bottom: none !important;
}

#shopify-section-template--28448670843144__slideshow_MGQRED {
  padding-top: 0 !important;
  margin-top: 0 !important;
}

#shopify-section-template--28448670843144__multi_column_cDkaUy {
  padding-bottom: 25px !important;
  margin-bottom: 0 !important;
}

#shopify-section-template--28448671498504__multi_column_gC4F6c {
  padding-bottom: 0 !important;
  margin-bottom: 0 !important;
}

#shopify-section-template--28448670843144__multi_column_cDkaUy .text-column__text {
  border-top: 1px solid rgba(44, 24, 15, 0.15) !important;
  padding-top: 36px !important;
  margin-top: 12px !important;
  width: 98% !important;
}

.section-id--XnhuX7 {
  background-color: #c7c5fc !important;
  margin-top: 0 !important;
  padding-bottom: 40px !important;
}

.section-id--XnhuX7 h2 {
  font-size: 36px;
}
/* Uitlijning "Hoe wij het anders doen" met titel */
/* .section-multi-column .container {
  padding-left: 60px !important;
  padding-right: 60px !important;
} */
.section-multi-column .flexible-layout {
  margin-left: 0 !important;
}
.section-multi-column .flexible-layout .column:first-child {
  margin-left: 0 !important;
  padding-left: 0 !important;
}

/* homepage-changes css start  */
#pagefooter .section-footer__row {
    padding-left: 0 !important;
    padding-right: 0 !important;
}
/* body.template-index .section-featured-collection .collection-listing .product-grid {overflow: hidden;} */
.pageheader .logo-area.container.container--no-max {
    padding-left: var(--container-pad-x) !important;
    padding-right: var(--container-pad-x) !important;
}
.globo-form-app form .panels {
    z-index: unset !important;
}
@media(min-width:767px) and (max-width:1350px){
  .pageheader .logo-area__middle {
      padding-left: 0;
  }  
}
@media(min-width:1240px){
  body.template-index .section-featured-collection .container,
  body.template-index .section-image-with-text-overlay .container.text-overlay__inner,
  body.template-index .fully-spaced-row--medium .container,
  body .section-signup .container,.section-main-product product-form.product-info.container,
  body .section-footer .container,.product_multiclm .container,.our_story_page .container,
  .product_img_with_content .container,.container.story_house_page {
      max-width: 1240px !important;
      width: 100% !important;
      padding-left: 0 !important;
      padding-right: 0 !important;
  }
  .section-main-product product-form.product-info.container .media-gallery-size-medium {
      width: 50% !important;
  }
  .section-main-product product-form.product-info.container .media-gallery-size-medium + .product-column-right {
      width: 46% !important;
      max-width: 100%;
  }
  .voor_img_text_sec .container .flexible-layout {
      margin-left:  0;
  }
}
@media (min-width: 768px){
  .product_img_with_content .container .feature-text-paired {
    padding-left: 0 !important;
    margin-left: 0 !important;
  }
  .pageheader .logo-area .logo-area__left #NavigationTier2-2 ul.navigation__tier-2 {
      padding-left: 30px;
      padding-right: 30px;
  }
  .pageheader .logo-area .logo-area__left #NavigationTier2-2 ul.navigation__tier-2 li.navigation__item {
      flex: 1 0 50%;
      max-width: 50%;
  }
}
@media (min-width: 1100px) {
    .video-section .text-overlay--for-banner .text-overlay__inner {
        padding: 45px;
    }
}
@media(min-width: 768px){
    .pageheader .logo-area .logo-area__left #NavigationTier2-2 {
        max-width: 500px;
    }
    .pageheader .logo-area .logo-area__left #NavigationTier2-2 .container {
        max-width: 100% !important;
        padding-left: 0;
        padding-right: 0;
    }
    .navigation__columns {
        margin: 0 !important;
    }
}
@media(max-width:567px){
  body.template-index .section-featured-collection .container,
  body.template-index .section-image-with-text-overlay .container.text-overlay__inner,
  body.template-index .fully-spaced-row--medium .container,
  body .section-signup .container,
  body .section-footer .container {
      padding-left: 30px !important;
      padding-right: 30px !important;
  }
  body.template-index .section-featured-collection .container .collection-listing {
      padding-left: 0 !important;
      padding-right: 0 !important;
  }
  body.template-index .fully-spaced-row--medium .container .feature-text-paired {
      padding-left: 0 !important;
  }
  .container.are_the_story .bw-text-col {
      padding-left: 0 !important;
  }
  .prijzen_page .feature-text-paired {padding: 0 !important;}
  .section-collapsible-tabs .container,
  .our_story_page .container,.product_img_with_content .container {
    padding-left: 30px !important;
    padding-right: 30px !important;
  }
  .globo-form-app form .globo-formbuilder-wizard{
    padding-left: 22px !important;
    padding-right: 22px !important;

  }
  .voor_img_text_sec .feature-text-paired,.product_img_with_content .container .feature-text-paired {padding-left: 0 !important;padding-right: 0 !important;}
  .story_house_page.container {
      padding-left: 30px !important;
  }
  .story_house_page .bw-text-col {
      padding-left: 0 !important;
  }
}
/* homepage-changes css end  */

/* ==========================================================================
   1. CDN FONT DECLARATIONS
   ========================================================================== */

/* Headings: Ivy Presto Display */
@font-face {
  font-family: 'Ivy Presto Display';
  src: url('/cdn/shop/files/IvyPrestoDisplay-Regular.woff2?v=1786865225') format('woff2');
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

/* Body Text: AW Conqueror Sans */
@font-face {
  font-family: 'AW Conqueror Sans';
  src: url('/cdn/shop/files/AWConquerorStdSansRegular.woff2?v=1786872106') format('woff2');
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

/* ==========================================================================
   2. GLOBAL CSS VARIABLES OVERRIDE
   ========================================================================== */
*, *::before, *::after,
:root, body, product-block, carousel-slider {
  --font-heading-family: 'Ivy Presto Display', serif !important;
  --font-body-family: 'AW Conqueror Sans', sans-serif !important;
  --heading-font-family: 'Ivy Presto Display', serif !important;
  --body-font-family: 'AW Conqueror Sans', sans-serif !important;
}

/* ==========================================================================
   3. FALLBACK SELECTOR OVERRIDES
   ========================================================================== */

/* Body Text & UI Elements */
body, p, li, button, input, textarea, label {
  font-family: 'AW Conqueror Sans', sans-serif !important;
}

/* Headings, Specific Titles & Children inside Headings */
h1, h2, h3, h4, h5, h6,
h1 *, h2 *, h3 *, h4 *, h5 *, h6 *,
.majortitle, .has-paging_title, .text_overlay_rtc, [class*="title"] {
  font-family: 'Ivy Presto Display', serif !important;
}

/* Header Navigation Text Size Override */
.navigation__link,
.navigation__item > a,
#proxy-nav a {
  font-size: 16px !important;
}

/* ================================================
   ARC THE STORY — custom.css
   Opgeschoond: 2026-05-13
   Backup: custom-backup-2026-05-13.css (in assets)
   ================================================ */

/* ================================================
   1. UITLIJNING VARIABELEN — enige bron van waarheid
   ================================================ */
:root {
  --container-pad-x: 30px;
  --container-pad-x-half: 15px;
  --larger-section-padding: 88px;
  --page-max: 1180px;
  --gutter: clamp(20px, 4vw, 56px);
}

@media screen and (max-width: 749px) {
  :root {
    --container-pad-x: 16px;
    --container-pad-x-half: 8px;
  }
}


/* ================================================
   2. MASTER UITLIJNING — alle secties op één lijn
   ================================================ */

/* Algemene content containers */
.template-index .page-width,
.template-index .container {
  max-width: 1340px;
  margin-left: auto;
  margin-right: auto;
  padding-left: var(--container-pad-x);
  padding-right: var(--container-pad-x);
}

/* Hero / banner tekst */
.template-index .banner__content,
.template-index .slideshow__text-wrapper,
.template-index .rich-text__wrapper {
  padding-left: var(--container-pad-x) !important;
  padding-right: var(--container-pad-x) !important;
}

/* Voorkom dubbele inspringing binnen banner */
.template-index .banner__content .banner__box,
.template-index .banner__content .banner__text,
.template-index .banner__content .rte {
  padding-left: 0 !important;
  margin-left: 0 !important;
  text-align: left !important;
}

/* Image with text secties */
.section-image-with-text .feature-text-paired,
.section-image-with-text .bw-btn-row,
.section-image-with-text .bw-bottom-row,
.bw-text-col{
  padding-left: var(--container-pad-x) !important;
  padding-right: var(--container-pad-x) !important;
}

/* Omgekeerde kolom (tekst rechts) */
.section-image-with-text .column--text-right .feature-text-paired {
  padding-left: 0 !important;
  padding-right: var(--container-pad-x) !important;
}
.template-index .container--no-max {
  padding-left: var(--container-pad-x) !important;
  padding-right: var(--container-pad-x) !important;
}
/* Mobiel */
@media (max-width: 767px) {
  .template-index .banner__content,
  .template-index .slideshow__text-wrapper,
  .template-index .rich-text__wrapper,
  .section-image-with-text .feature-text-paired,
  .section-image-with-text .bw-btn-row,
  .section-image-with-text .bw-bottom-row,
  .bw-text-col,
  .pcg-section__header {
    padding-left: var(--container-pad-x) !important;
    padding-right: var(--container-pad-x) !important;
  }
}


/* ================================================
   3. VERTICAAL RITME — sectie padding
   ================================================ */

/* Standaard secties */
.template-index .section-padding {
  padding-top: 72px;
  padding-bottom: 72px;
}

/* Grote storytelling secties */
.template-index .image-with-text.section-padding,
.template-index .banner.section-padding,
.template-index .slideshow.section-padding {
  padding-top: 96px !important;
  padding-bottom: 96px !important;
}

/* Compacte info secties */
.template-index .multicolumn.section-padding,
.template-index .icon-with-text.section-padding {
  padding-top: 48px;
  padding-bottom: 48px;
}

/* Multicolumn extra ruimte onderaan */
.template-index .multicolumn {
  padding-bottom: 96px !important;
  margin-bottom: 0 !important;
}

/* Icon row */
.template-index .icon-with-text {
  padding-top: 64px !important;
  padding-bottom: 64px !important;
}

.template-index .icon-with-text__item,
.template-index .icon-with-text__block {
  gap: 12px !important;
}

.template-index .icon-with-text p {
  line-height: 1.55 !important;
}

/* Titels */
.template-index h2 {
  margin-bottom: 32px !important;
}

/* Banner gap */
@media (min-width: 990px) {
  .template-index .banner__content {
    gap: 48px !important;
  }
  .template-index .multicolumn .multicolumn-card__image-wrapper {
    margin-bottom: 24px !important;
  }
}


/* ================================================
   4. GRID RITME
   ================================================ */

.template-index .grid,
.template-index .multicolumn-list,
.template-index .product-grid,
.template-index .collection-list {
  column-gap: 40px !important;
  row-gap: 40px !important;
}

.template-collection .product-grid {
  row-gap: 40px !important;
}


/* ================================================
   5. TYPOGRAFIE
   ================================================ */

/* Font face definities */
@font-face {
  font-family: 'MrGabe';
  src: url('{{ "MrGabe-BlackItalic.woff" | asset_url }}') format('woff');
  font-style: italic;
  font-weight: 900;
}

@font-face {
  font-family: 'IvyPresto';
  src: url('{{ "IvyPrestoDisplay-Regular.woff" | asset_url }}') format('woff');
  font-style: normal;
  font-weight: 400;
}

@font-face {
  font-family: 'IvyPresto';
  src: url('{{ "IvyPrestoDisplay-ThinItalic.woff" | asset_url }}') format('woff');
  font-style: italic;
  font-weight: 300;
}

@font-face {
  font-family: 'AWConqueror';
  src: url('/cdn/shop/files/AWConquerorStdSansRegular.woff2') format('woff2');
  font-style: normal;
  font-weight: 300;
}

/* Bold / italic normalisatie */
b, strong, .bold, .font-bold {
  font-weight: 400 !important;
}

i, em, .italic, .font-italic {
  font-style: normal !important;
}

/* Knoppen */
a.btn {
  font-family: 'AW Conqueror', sans-serif !important;
  font-weight: 300 !important;
  padding-bottom: 18px;
}

a.btn.btn-primary:hover {
  background-color: #f1eada;
  border-color: #f1eada;
  color: #2c180f;
}

/* Seperator voor titels */
.hometitle,
.align-ltr-left h2.majortitle {
  text-align: left;
  border-bottom: 1px solid;
  padding-bottom: 32px;
  margin-bottom: 32px;
}

.hometitle h2 a,
.align-ltr-left h2.majortitle {
  font-size: 40px;
  font-family: var(--heading-font-family) !important;
}

/* Testimonials */
.testimonials blockquote,
.testimonials .testimonial__blockquote,
.testimonials .testimonial__text,
.section-testimonials blockquote,
.section-testimonials .testimonial__blockquote,
.section-testimonials .testimonial__text {
  font-family: "Ivy Presto Display", serif !important;
  font-weight: 400 !important;
  font-size: 24px !important;
  line-height: 1.38 !important;
}

.testimonials .testimonial__author,
.section-testimonials .testimonial__author {
  font-family: "AW Conqueror Sans", system-ui, -apple-system, "Segoe UI", Arial, sans-serif !important;
  font-size: 13px !important;
  line-height: 1.2 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
}

.use-color-scheme--1 blockquote,
.use-color-scheme--1 .testimonial__author {
  color: #2C180F !important;
}

/* Navigatie font grootte */
@media (min-width: 768px) and (max-width: 1024px) {
  .navigation--left .navigation__tier-1 > .navigation__item > .navigation__link {
    font-size: 0.85em;
  }
}

@media (min-width: 1025px) and (max-width: 1200px) {
  .navigation--left .navigation__tier-1 > .navigation__item > .navigation__link {
    font-size: 0.9em;
  }
}

.navigation--left .navigation__tier-1 > .navigation__item > .navigation__link {
  font-size: 13px !important;
}


/* ================================================
   6. GLOBO PRODUCT OPTIONS
   ================================================ */

span.label-content,
span.gpo-helptext.break-word,
span.gpo-ov-helptext,
span.choicelist-item__value {
  font-family: "AW Conqueror Sans", sans-serif !important;
}

.gpo-selected-values {
  font-weight: 700 !important;
}

span.label-content {
  margin-bottom: 4px;
  line-height: 28px;
}

.gpo-label + .gpo-selected-values.has-value {
  font-size: 14px;
}

.globo-form-control .radio-wrapper {
  font-family: 'AW Conqueror Sans';
}

.globo-formbuilder-wizard button.action.next.submit {
  font-family: 'AW Conqueror Sans';
  color: #f1eada;
  font-weight: 500;
}

.globo-formbuilder-wizard span.label-content {
  font-size: 16px;
  font-weight: 500;
}


/* ================================================
   7. HEADER
   ================================================ */

.menu-promotion__image img {
  aspect-ratio: 1 / 1;
}

.template-index div.pageheader {
  background-color: #f1eada;
}

.template-index .announcement-bar {
  background-color: #2c180f;
}

.template-index .announcement-bar .announcement-bar-usp__text,
.template-index .announcement-bar span.text-start,
.template-index .announcement-bar svg {
  color: #f1eada;
}

.template-index .announcement-bar img {
  filter: invert(1);
}

.template-collection .announcement-bar--with-announcement {
  background-color: #b79d86;
}

.navigation .navigation__tier-1 {
  background-color: transparent;
}

.section-header li.navigation__item.navigation__item--with-children.navigation__item--with-small-menu {
  position: relative;
}
.logo-area__middle {
  padding-left: 20px;
}
/* Desktop navigatie */
@media (min-width: 768px) {
  #main-nav {
    display: none !important;
  }

  .section-header {
    height: 71px;
  }

  .navigation--left {
    visibility: visible !important;
    border: none;
  }

  .logo-area__left__inner {
    overflow: visible;
    width: 583px !important;
  }

  .pageheader--layout-inline-menu-center .logo-area__left,
  .pageheader--layout-inline-menu-left .logo-area__left {
    min-height: calc(22px * 2 + 1.5em);
  }

  .pageheader--layout-inline-menu-center .navigation--left,
  .pageheader--layout-inline-menu-left .navigation--left {
    width: auto;
    max-width: none;
  }

  .navigation--inline-with-dropdowns .navigation__tier-2-container {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 100;
    visibility: hidden;
    opacity: 0;
    pointer-events: none;
    transition: opacity 175ms ease-in, visibility 175ms;
    background: var(--main-nav-bg, #fff);
    border: 1px solid var(--heading-divider-col, #e5e5e5);
    border-top: none;
  }

  .navigation--inline-with-dropdowns .navigation__item--with-small-menu > .navigation__tier-2-container {
    width: max-content;
    min-width: 170px;
    max-width: 280px;
  }

  .navigation--inline-with-dropdowns .navigation__item--with-mega-menu > .navigation__tier-2-container {
    left: 50%;
    transform: translateX(-50%);
    width: 100vw;
    max-width: var(--page-width, 1400px);
  }

  .navigation--inline-with-dropdowns .navigation__item--with-children:hover > .navigation__tier-2-container,
  .navigation--inline-with-dropdowns .navigation__item--with-children:focus-within > .navigation__tier-2-container {
    visibility: visible;
    opacity: 1;
    pointer-events: auto;
  }

  .navigation--inline-with-dropdowns .navigation__children-toggle {
    display: none;
  }
}

.navigation__tier-2-container {
  background-color: #f1eada !important;
}

.navigation__tier-2-container a,
.navigation__tier-2 .navigation__link {
  color: #2c180f !important;
}


/* ================================================
   8. ANNOUNCEMENT BAR USP
   ================================================ */

.announcement-bar--sticky {
  z-index: 400;
}

.announcement-bar-usp {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 24px;
  width: 100%;
  flex-wrap: wrap;
}

.announcement-bar-usp__item {
  display: flex;
  align-items: center;
  gap: 8px;
  flex: 0 1 auto;
}

.announcement-bar-usp__icon {
  width: auto;
  height: 18px;
  max-width: 18px;
  object-fit: contain;
  flex-shrink: 0;
}

.announcement-bar-usp__text {
  font-size: inherit;
  color: inherit;
  white-space: nowrap;
}

@media (min-width: 768px) {
  .announcement-bar-usp {
    gap: 40px;
    flex-wrap: nowrap;
  }
}

@media (max-width: 767px) {
  .announcement-bar-usp {
    gap: 8px;
  }
  .announcement-bar-usp__item {
    gap: 6px;
  }
  .announcement-bar-usp__text {
    font-size: 10px;
  }
}


/* ================================================
   9. FOOTER
   ================================================ */

.shopify-section-group-footer-group.section-newsletter h2,
.shopify-section-group-footer-group.section-newsletter p,
.section-footer,
.section-footer .section-footer__title,
span.copy {
  color: #f1eada;
}

.shopify-section-group-footer-group.section-newsletter h2 {
  border-bottom: none;
  padding-bottom: 8px;
}

.section-footer__menu-block__menu li a,
ul.section-footer__lower-menu__list li a {
  color: #c7c5fc;
}

.section-footer__row.section-footer__row--blocks {
  gap: 0;
  margin-left: auto !important;
  margin-right: auto !important;
  border-bottom: 0;
  max-width: 1330px !important;
  padding: 10px 45px !important;
}

.section-footer__row.section-footer__row-lower {
  border-top: 1px solid #fff;
  padding: 32px 45px !important;
  max-width: 1330px !important;
}

@media (max-width: 1220px) and (min-width: 991px) {
  .section-footer__row.section-footer__row-lower {
    margin-left: 50px !important;
    margin-right: 50px !important;
  }
}

.shopify-section-group-footer-group,
.section-footer,
.section-footer__inner,
.section-footer__content {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.section-footer__row__col {
  padding-left: 0 !important;
  padding-right: 0 !important;
  padding-top: 0 !important;
}

.section-footer__row {
  align-items: start !important;
}

.section-footer__title {
  margin: 0 0 14px 0 !important;
  line-height: 1.15 !important;
}

.section-footer__text,
.section-footer__text p,
.section-footer__row a {
  line-height: 1.6 !important;
}

/* Footer lijst iconen */
.section-footer__text li {
  position: relative;
  list-style: none !important;
}

.section-footer__text li:after {
  content: "";
  position: absolute;
  left: -30px;
  top: 5px;
  width: 20px;
  height: 20px;
  background-size: contain;
}

.section-footer__text li:nth-child(1):after {
  background-image: url(/cdn/shop/files/mail.svg?v=1767348141);
}

/* Footer speciale link */
ul.section-footer__menu-block__menu li:last-child a[href="/collections/passe-partouts"] {
  border-top: 1px solid #c7c5fc !important;
  padding-top: 12px !important;
  display: inline-block;
}

/* Newsletter sectie */
.section-newsletter .container {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: center;
  /* padding: 32px 0 16px 0; */
  padding-top:32px;
  padding-bottom:32px;
  border-bottom: 1px solid #fff;
}

.section-newsletter button {
  background: #f1eada;
  width: 100%;
  transform: translateY(-16px);
}

@media (min-width: 768px) {
  .section-newsletter .container {
    justify-content: start;
  }
  .section-newsletter .container > h2 {
    flex: 0 0 50%;
    margin-bottom: 8px;
    text-align: left;
  }
  .section-newsletter .container > .rte {
    flex: 0 0 51%;
    margin-top: 0;
    text-align: left;
  }
  .section-newsletter .container > .signup-form {
    flex: 0 0 45%;
    /* margin-top: -24px; */
    margin-left: auto;
  }
  .section-newsletter button {
    transform: none;
    width: auto;
  }
  .section-newsletter .signup-form__inline-container {
    display: inline-flex;
    width: 100%;
    justify-content: flex-end;
  }
}

/* Newsletter footer rij */
.section-footer__newsletter .section-footer__row {
  display: grid !important;
  grid-template-columns: 1fr auto !important;
  align-items: center !important;
  column-gap: 40px !important;
}

.section-footer__newsletter .section-footer__row__col:first-child {
  max-width: 60ch !important;
}

.section-footer__newsletter form {
  display: flex !important;
  gap: 10px !important;
  align-items: center !important;
}

.section-footer__newsletter input[type="email"] {
  min-width: 280px;
}


/* ================================================
   10. PRODUCT / WINKEL
   ================================================ */

/* Prijzen verbergen */
.price,
.price__container,
.price__default,
.price__regular,
.price-item,
.product-price,
.product-block__title-price,
.product-grid-item__price,
.theme-money,
.price--sold-out,
[data-price-container],
.product-price--block {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
}

/* Koopknop en uitverkocht verbergen */
.product-form__payment-container,
button[name="add"],
.product-form__add-button,
.shopify-payment-button,
.product-inventory-notice,
.payment-and-quantity__add,
.price__label {
  display: none !important;
}

/* Vendor verbergen */
.product-vendor,
.product-block__vendor,
.product-block__title-price .vendor {
  display: none !important;
}

/* Cart labels */
span.cart-item__variant-label,
span.line-item-property__label {
  font-weight: 700;
}

/* Thumbnail carousel verbergen */
.media-gallery--layout-carousel .carousel-slider.carousel.block.thumbnails {
  display: none !important;
}


/* ================================================
   11. FEATURED COLLECTION
   ================================================ */

.section-featured-collection .slider__grid {
  display: flex !important;
  flex-wrap: nowrap !important;
  gap: 4px !important;
}

.section-featured-collection .slider__item {
  flex: 0 0 360px !important;
  width: 360px !important;
}

.section-featured-collection .product-block,
.section-featured-collection .block-inner,
.section-featured-collection .block-inner-inner,
.section-featured-collection .image-cont {
  background: transparent !important;
  background-color: transparent !important;
}

.section-featured-collection .container--not-mobile {
  padding-left: var(--container-pad-x) !important;
  padding-right: var(--container-pad-x) !important;
}

.section-featured-collection .product-block__title,
.section-featured-collection .block-title,
.section-featured-collection h3 {
  text-align: left !important;
  padding-left: 12px !important;
  font-size: 14px !important;
}

@media (max-width: 768px) {
  .section-featured-collection .slider__item {
    flex: 0 0 240px !important;
  }
}
.section-featured-collection .container--no-max {
  padding-left: 30px !important;
}

/* ================================================
   12. OVERIGE SECTIES
   ================================================ */

/* Multi column border */
.column-border .column.text-column {
  padding: 0 16px;
  border-left: 1px solid #000;
}

.column-border .column.text-column:last-child {
  border-right: 1px solid #000;
}

@media (max-width: 768px) {
  .column-border .column.text-column:last-child {
    border-right: 0;
  }
}

/* Collection slider knoppen */
.collection-slider button.slider-nav__btn.has-ltr-icon {
  position: absolute;
  bottom: -20px;
  right: 0;
}

.collection-slider button.slider-nav__btn.has-ltr-icon[name="prev"] {
  right: 45px;
}

/* Collection slider mobiel padding */
@media (max-width: 768px) {
  .collection-slider-row .container,
  .collection-slider-row .container--not-mobile {
    padding-left: var(--container-pad-x);
    padding-right: var(--container-pad-x);
  }
}

/* View all knop */
.view-all a.btn {
  margin-top: 16px;
  margin-bottom: 32px;
}

/* Video sectie */
@media (min-width: 1100px) {
  .video-section .text-overlay--for-banner .text-overlay__inner {
    padding: 50px;
  }
}

/* Rich text sectie */
@media (min-width: 992px) {
  .section-rich-text .large-text {
    max-width: 50%;
  }
}

/* Image with text overlay */
.section-image-with-text-overlay .text-overlay__inner.content-in-grid {
  max-width: 1320px;
  padding: 50px;
  margin: 0 auto;
}

@media (max-width: 1340px) and (min-width: 769px) {
  .section-image-with-text-overlay .text-overlay__inner.content-in-grid {
    max-width: 1340px;
  }
}

@media (max-width: 768px) {
  .section-image-with-text-overlay .text-overlay__inner.content-in-grid {
    padding: var(--container-pad-x);
  }
}

/* Multi column layout */
.section-multi-column .flexible-layout .column {
  padding-left: 0 !important;
}


/* ================================================
   13. ARC SLIDESHOW (eigen sectie)
   ================================================ */

.arc-slideshow .arc-slideshow__wrapper {
  position: relative;
}

.arc-slideshow__static-content .text-overlay__inner {
  display: flex;
  justify-content: center;
  padding-top: 50px;
  padding-bottom: 50px;
  padding-left: 30px; 
  padding-right: 30px; 
}


.arc-slideshow__static-content .text-overlay__text {
  max-width: 1240px;
  width: 100%;
}

.arc-slideshow .arc-slideshow__static-content {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 10;
  pointer-events: none;
  display: flex;
}

.arc-slideshow .arc-slideshow__static-content .text-overlay__inner {
  pointer-events: auto;
}

@media (min-width: 992px) {
  .arc-slideshow .text-overlay__rte.rte {
    max-width: 50ch;
  }
}

.arc-slideshow .arc-slideshow__static-content .text-overlay__text,
.arc-slideshow .arc-slideshow__static-content .text-overlay__reveal {
  opacity: 1 !important;
  transform: none !important;
}


/* ================================================
   14. GALLERY CAROUSEL (eigen sectie)
   ================================================ */

.gallery__item--has-carousel {
  position: relative;
}

.gallery-carousel {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.gallery-carousel__link {
  display: block;
  width: 100%;
  height: 100%;
}

.gallery-carousel__track {
  position: relative;
  width: 100%;
  height: 100%;
}

.gallery-carousel__slide {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.5s ease, visibility 0.5s ease;
  z-index: 1;
}

.gallery-carousel__slide.is-active {
  opacity: 1;
  visibility: visible;
  position: relative;
  z-index: 2;
}

.gallery-carousel__slide .gallery__image {
  width: 100%;
  height: 100%;
}

.gallery-carousel__slide .gallery__image img,
.gallery-carousel__slide .gallery__image .rimage__image {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.gallery-carousel__overlay {
  z-index: 5;
  pointer-events: none;
}

.gallery-carousel__overlay .text-overlay__inner {
  pointer-events: auto;
}

.gallery-carousel__arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 10;
  width: 36px;
  height: 36px;
  background: rgba(255, 255, 255, 0.9);
  border: none;
  border-radius: 50%;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #333;
  opacity: 0;
  transition: opacity 0.2s ease, transform 0.2s ease, background 0.2s ease;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
}

.gallery-carousel:hover .gallery-carousel__arrow {
  opacity: 1;
}

.gallery-carousel__arrow:hover {
  background: #fff;
  transform: translateY(-50%) scale(1.08);
}

.gallery-carousel__arrow:active {
  transform: translateY(-50%) scale(0.95);
}

.gallery-carousel__arrow--prev { left: 12px; }
.gallery-carousel__arrow--next { right: 12px; }

.gallery-carousel__arrow svg {
  width: 18px;
  height: 18px;
}

.gallery-carousel__dots {
  position: absolute;
  bottom: 16px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 10;
  display: flex;
  gap: 8px;
  padding: 6px 10px;
  background: rgba(0, 0, 0, 0.3);
  border-radius: 20px;
}

.gallery-carousel__dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  border: none;
  background: rgba(255, 255, 255, 0.5);
  cursor: pointer;
  padding: 0;
  transition: background 0.2s ease, transform 0.2s ease;
}

.gallery-carousel__dot:hover {
  background: rgba(255, 255, 255, 0.8);
}

.gallery-carousel__dot.is-active {
  background: #fff;
  transform: scale(1.2);
}

@media (max-width: 767px) {
  .gallery-carousel__arrow {
    width: 32px;
    height: 32px;
    opacity: 1;
  }
  .gallery-carousel__arrow--prev { left: 8px; }
  .gallery-carousel__arrow--next { right: 8px; }
  .gallery-carousel__arrow svg { width: 16px; height: 16px; }
  .gallery-carousel__dots { bottom: 12px; gap: 6px; padding: 5px 8px; }
  .gallery-carousel__dot { width: 6px; height: 6px; }
}


/* ================================================
   15. SECTIE-SPECIFIEKE OVERRIDES (op ID)
   ================================================ */

#section-id-template--28448670843144__multi_column_cDkaUy .hometitle {
  border-bottom: none !important;
}

#shopify-section-template--28448670843144__slideshow_MGQRED {
  padding-top: 0 !important;
  margin-top: 0 !important;
}

#shopify-section-template--28448670843144__multi_column_cDkaUy {
  padding-bottom: 25px !important;
  margin-bottom: 0 !important;
}

#shopify-section-template--28448671498504__multi_column_gC4F6c {
  padding-bottom: 0 !important;
  margin-bottom: 0 !important;
}

#shopify-section-template--28448670843144__multi_column_cDkaUy .text-column__text {
  border-top: 1px solid rgba(44, 24, 15, 0.15) !important;
  padding-top: 36px !important;
  margin-top: 12px !important;
  width: 98% !important;
}

.section-id--XnhuX7 {
  background-color: #c7c5fc !important;
  margin-top: 0 !important;
  padding-bottom: 40px !important;
}

.section-id--XnhuX7 h2 {
  font-size: 36px;
}
/* Uitlijning "Hoe wij het anders doen" met titel */
/* .section-multi-column .container {
  padding-left: 60px !important;
  padding-right: 60px !important;
} */
.section-multi-column .flexible-layout {
  margin-left: 0 !important;
}
.section-multi-column .flexible-layout .column:first-child {
  margin-left: 0 !important;
  padding-left: 0 !important;
}

/* homepage-changes css start  */
#pagefooter .section-footer__row {
    padding-left: 0 !important;
    padding-right: 0 !important;
}
/* body.template-index .section-featured-collection .collection-listing .product-grid {overflow: hidden;} */
.pageheader .logo-area.container.container--no-max {
    padding-left: var(--container-pad-x) !important;
    padding-right: var(--container-pad-x) !important;
}
.globo-form-app form .panels {
    z-index: unset !important;
}
@media(min-width:767px) and (max-width:1350px){
  .pageheader .logo-area__middle {
      padding-left: 0;
  }  
}
@media(min-width:1240px){
  body.template-index .section-featured-collection .container,
  body.template-index .section-image-with-text-overlay .container.text-overlay__inner,
  body.template-index .fully-spaced-row--medium .container,
  body .section-signup .container,.section-main-product product-form.product-info.container,
  body .section-footer .container,.product_multiclm .container,.our_story_page .container,
  .product_img_with_content .container,.container.story_house_page {
      max-width: 1240px !important;
      width: 100% !important;
      padding-left: 0 !important;
      padding-right: 0 !important;
  }
  .section-main-product product-form.product-info.container .media-gallery-size-medium {
      width: 50% !important;
  }
  .section-main-product product-form.product-info.container .media-gallery-size-medium + .product-column-right {
      width: 46% !important;
      max-width: 100%;
  }
  .voor_img_text_sec .container .flexible-layout {
      margin-left:  0;
  }
}
@media (min-width: 768px){
  .product_img_with_content .container .feature-text-paired {
    padding-left: 0 !important;
    margin-left: 0 !important;
  }
  .pageheader .logo-area .logo-area__left #NavigationTier2-2 ul.navigation__tier-2 {
      padding-left: 30px;
      padding-right: 30px;
  }
  .pageheader .logo-area .logo-area__left #NavigationTier2-2 ul.navigation__tier-2 li.navigation__item {
      flex: 1 0 50%;
      max-width: 50%;
  }
}
@media (min-width: 1100px) {
    .video-section .text-overlay--for-banner .text-overlay__inner {
        padding: 45px;
    }
}
@media(min-width: 768px){
    .pageheader .logo-area .logo-area__left #NavigationTier2-2 {
        max-width: 500px;
    }
    .pageheader .logo-area .logo-area__left #NavigationTier2-2 .container {
        max-width: 100% !important;
        padding-left: 0;
        padding-right: 0;
    }
    .navigation__columns {
        margin: 0 !important;
    }
}
@media(max-width:567px){
  body.template-index .section-featured-collection .container,
  body.template-index .section-image-with-text-overlay .container.text-overlay__inner,
  body.template-index .fully-spaced-row--medium .container,
  body .section-signup .container,
  body .section-footer .container {
      padding-left: 30px !important;
      padding-right: 30px !important;
  }
  body.template-index .section-featured-collection .container .collection-listing {
      padding-left: 0 !important;
      padding-right: 0 !important;
  }
  body.template-index .fully-spaced-row--medium .container .feature-text-paired {
      padding-left: 0 !important;
  }
  .container.are_the_story .bw-text-col {
      padding-left: 0 !important;
  }
  .prijzen_page .feature-text-paired {padding: 0 !important;}
  .section-collapsible-tabs .container,
  .our_story_page .container,.product_img_with_content .container {
    padding-left: 30px !important;
    padding-right: 30px !important;
  }
  .globo-form-app form .globo-formbuilder-wizard{
    padding-left: 22px !important;
    padding-right: 22px !important;

  }
  .voor_img_text_sec .feature-text-paired,.product_img_with_content .container .feature-text-paired {padding-left: 0 !important;padding-right: 0 !important;}
  .story_house_page.container {
      padding-left: 30px !important;
  }
  .story_house_page .bw-text-col {
      padding-left: 0 !important;
  }
}
/* homepage-changes css end  */

/* ==========================================================================
   1. CDN FONT DECLARATIONS
   ========================================================================== */

/* Headings: Ivy Presto Display */
@font-face {
  font-family: 'Ivy Presto Display';
  src: url('/cdn/shop/files/IvyPrestoDisplay-Regular.woff2?v=1786865225') format('woff2');
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

/* Body Text: AW Conqueror Sans */
@font-face {
  font-family: 'AW Conqueror Sans';
  src: url('/cdn/shop/files/AWConquerorStdSansRegular.woff2?v=1786872106') format('woff2');
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

/* ==========================================================================
   2. GLOBAL CSS VARIABLES OVERRIDE
   ========================================================================== */
*, *::before, *::after,
:root, body, product-block, carousel-slider {
  --font-heading-family: 'Ivy Presto Display', serif !important;
  --font-body-family: 'AW Conqueror Sans', sans-serif !important;
  --heading-font-family: 'Ivy Presto Display', serif !important;
  --body-font-family: 'AW Conqueror Sans', sans-serif !important;
}

/* ==========================================================================
   3. FALLBACK SELECTOR OVERRIDES
   ========================================================================== */

/* Body Text & UI Elements */
body, p, li, button, input, textarea, label {
  font-family: 'AW Conqueror Sans', sans-serif !important;
}

/* Headings, Specific Titles & Children inside Headings */
h1, h2, h3, h4, h5, h6,
h1 *, h2 *, h3 *, h4 *, h5 *, h6 *,
.majortitle, .has-paging_title, .text_overlay_rtc, [class*="title"] {
  font-family: 'Ivy Presto Display', serif !important;
}

/* Header Navigation Text Size Override */
.navigation__link,
.navigation__item > a,
#proxy-nav a {
  font-size: 16px !important;
}

/* ==========================================================================
   ARC THE STORY - PERFECT 100VW MEGA MENU (CLEAN ACTIVE PAGE STATES)
   ========================================================================== */

@media (min-width: 769px) {

  /* 1. Sticky Header Outer Boundary & 100vw Anchor Parent */
  .section-header {
    position: sticky !important;
    top: 0 !important;
    z-index: 9990 !important;
    background-color: #ffffff !important;
  }

  #pageheader,
  .pageheader {
    background-color: #ffffff !important;
    position: relative !important; /* Main 100vw mega menu anchor */
  }

  /* Reset logo margin and padding */
  h1.logo,
  div.logo,
  .logo,
  .logo__link {
    margin: 0 !important;
    padding: 0 !important;
    line-height: 1 !important;
    display: flex !important;
    align-items: center !important;
  }

  /* 2. Main Header Container (Rigid 60px Height Lock) */
  .logo-area {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    position: static !important;
    max-width: 1340px !important;
    height: 60px !important;
    min-height: 60px !important;
    max-height: 60px !important;
    margin: 0 auto !important;
    padding: 0 20px !important;
    border: none !important;
    box-sizing: border-box !important;
  }

  /* Base Columns Alignment */
  .logo-area__left,
  .logo-area__middle,
  .logo-area__right {
    display: flex !important;
    align-items: center !important;
    height: 100% !important;
    box-sizing: border-box !important;
  }


  /* ==========================================================================
     3A. HOMEPAGE INDIVIDUAL CONTROLS (.template-index)
     ========================================================================== */

  .template-index .logo img,
  .template-index .logo__image {
    margin-top: 31px !important;
  }

  /* Homepage menu vertical offset */
  .template-index .navigation__tier-1 {
    margin-top: 20px !important;
  }

  .template-index .logo-area__right {
    margin-top: 0px !important;
  }


  /* ==========================================================================
     3B. INNER PAGES INDIVIDUAL CONTROLS (body:not(.template-index))
     ========================================================================== */

  body:not(.template-index) .logo img,
  body:not(.template-index) .logo__image {
    margin-top: 0px !important;
  }

  /* Inner pages menu vertical offset */
  body:not(.template-index) .navigation__tier-1 {
    margin-top: 20px !important;
  }

  body:not(.template-index) .logo-area__right {
    margin-top: 0px !important;
  }


  /* ========================================================================== */

  /* Left Column Element Styling */
  .logo img,
  .logo__image {
    display: block !important;
    height: auto !important;
    max-height: 40px !important; /* Safe max-height to prevent header overflow */
    object-fit: contain !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  /* Middle Column Element Styling */
  .logo-area__middle__inner,
  main-navigation,
  .navigation,
  .navigation__tier-1 {
    display: flex !important;
    align-items: center !important;
    margin: 0 !important;
    padding: 0 !important;
    position: static !important;
  }

  .navigation__tier-1 {
    gap: 28px !important;
    list-style: none !important;
  }

  /* Static positioning to anchor 100vw mega menu to #pageheader */
  .navigation__tier-1 > .navigation__item {
    position: static !important;
    display: flex !important;
    align-items: center !important;
    height: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  /* LINK TEXT WRAPPER: Relative positioning to bind underline width to text length */
  .navigation__tier-1 > .navigation__item > .navigation__link {
    position: relative !important;
    display: inline-flex !important;
    align-items: center !important;
    padding: 4px 0 !important;
    margin: 0 !important;
    color: #000000 !important;
    font-size: 14px !important;
    line-height: 1.2 !important;
    text-decoration: none !important;
    border: none !important;
    box-shadow: none !important;
    box-sizing: border-box !important;
  }

  /* Disable extra theme pseudo-elements */
  .navigation__tier-1 > .navigation__item::after,
  .navigation__tier-1 > .navigation__item::before,
  .navigation__tier-1 > .navigation__item > .navigation__link::before {
    content: none !important;
    display: none !important;
  }

  /* ACCURATE UNDERLINE (Isolated specifically to Tier 1 links) */
  .navigation__tier-1 > .navigation__item > .navigation__link::after {
    content: '' !important;
    position: absolute !important;
    bottom: -4px !important;
    left: 50% !important;
    width: 0 !important;
    height: 1px !important;
    background-color: #FE3B07 !important;
    transition: width 0.22s ease-in-out, left 0.22s ease-in-out !important;
  }

  .navigation__tier-1 > .navigation__item:hover > .navigation__link::after,
  .navigation__tier-1 > .navigation__item--active > .navigation__link::after {
    width: 100% !important;
    left: 0 !important;
  }

  /* Right Column Action Icons Styling */
  .logo-area__right,
  .logo-area__right__inner {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    height: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  .logo-area__right a,
  .logo-area__right button,
  .logo-area__right .header-icon,
  .logo-area__right__inner a {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 !important;
    margin: 0 !important;
    color: #000000 !important;
  }

  .logo-area__right > * + *,
  .logo-area__right a + a,
  .logo-area__right__inner > * + * {
    margin-left: 24px !important;
  }

  .logo-area__right svg {
    width: 24px !important;
    height: 24px !important;
    display: block !important;
  }


  /* ==========================================================================
     4. FULL-WIDTH 100VW MEGA MENU (FIXED ACTIVE STATE BUG)
     ========================================================================== */

  .navigation__tier-2-container,
  .navigation__child-tier,
  .mega-menu-editorial,
  .navigation__item--active > .navigation__tier-2-container,
  .navigation__item--active > .mega-menu-editorial {
    position: absolute !important;
    top: 100% !important; /* Flush alignment below header */
    padding-top: 26px !important; /* Visual floating gap of 26px */
    left: 50% !important;
    transform: translateX(-50%) !important;
    width: 100vw !important;
    max-width: 100vw !important;
    
    /* GRADIENT: 0-26px transparent, 26-27px Arc Red accent line (#FE3B07), 27px+ solid white */
    background-image: none !important;
    background-color: transparent !important;
    background: linear-gradient(to bottom, transparent 26px, #FE3B07 26px, #FE3B07 27px, #ffffff 27px) !important;
    
    border: none !important;
    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.05) !important;
    z-index: 9999 !important;
    box-sizing: border-box !important;

    display: none !important;
  }

  /* NATIVE HOVER TRIGGER */
  .navigation__item:hover > .navigation__tier-2-container,
  .navigation__item:hover > .mega-menu-editorial,
  .navigation__tier-2-container:hover,
  .mega-menu-editorial:hover {
    display: block !important;
  }

  /* INNER MEGA MENU CONTENT CONTAINER */
  .mega-menu-editorial__inner,
  .navigation__tier-2 {
    max-width: 1280px !important;
    margin: 0 auto !important;
    padding: 36px 40px !important;
    width: 100% !important;
    background-color: transparent !important;
    background: transparent !important;
    border: none !important;
    box-sizing: border-box !important;
  }


  /* ==========================================================================
     THEME RED BACKGROUND OVERRIDE
     ========================================================================== */

  /* 1. Mega menu container background (26px gap gradient + 1px red border + solid white) */
  body #pageheader .navigation__tier-2-container,
  body #pageheader .navigation__child-tier,
  body #pageheader .mega-menu-editorial,
  body #pageheader .mega-menu {
    background-image: none !important;
    background-color: transparent !important;
    background: linear-gradient(to bottom, transparent 26px, #FE3B07 26px, #FE3B07 27px, #ffffff 27px) !important;
  }

  /* 2. Neutralize theme red background on sub-menu text and links */
  body #pageheader .navigation__tier-2-container a,
  body #pageheader .navigation__tier-2-container li,
  body #pageheader .navigation__tier-2-container span,
  body #pageheader .navigation__tier-2-container div,
  body #pageheader .navigation__tier-2 .navigation__link,
  body #pageheader .mega-menu-editorial a,
  body #pageheader .mega-menu-editorial div,
  body #pageheader .mega-menu a,
  body #pageheader .mega-menu div {
    background-color: transparent !important;
    background: transparent !important;
    color: #000000 !important;
    box-shadow: none !important;
  }

  .navigation__tier-2-container *::after,
  .navigation__tier-2-container *::before,
  .mega-menu-editorial *::after,
  .mega-menu-editorial *::before {
    content: none !important;
    display: none !important;
  }

}


/* ==========================================================================
   ARC THE STORY - MOBILE HEADER & DRAWER ALIGNMENT FIX (MAX-WIDTH: 768PX)
   ========================================================================== */

@media (max-width: 768px) {

  .section-header,
  #pageheader,
  .pageheader,
  .logo-area {
    background-color: #ffffff !important;
  }

  .logo-area {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding-top: 8px !important;
    padding-bottom: 8px !important;
  }

  .logo-area__left,
  .logo-area__middle,
  .logo-area__right,
  .mobile-nav-toggle,
  .logo,
  h1.logo,
  div.logo,
  .logo__link {
    display: flex !important;
    align-items: center !important;
    margin: 0 !important;
    padding: 0 !important;
    font-size: inherit !important;
    line-height: 1 !important;
  }

  /* Base Logo Mobile Styling */
  .logo img,
  .logo__image {
    display: block !important;
    height: auto !important;
    max-height: 32px !important; /* Safe max-height to prevent mobile header overflow */
    object-fit: contain !important;
    padding: 0 !important;
    margin: 0 !important;
  }

  /* HOMEPAGE MOBILE LOGO CONTROLS */
  .template-index .logo img,
  .template-index .logo__image {
    margin-top: 27px !important;
  }

  /* INNER PAGES MOBILE LOGO CONTROLS */
  body:not(.template-index) .logo img,
  body:not(.template-index) .logo__image {
    margin-top: 0px !important;
  }

  /* Forced Pure White Mobile Drawer */
  .navigation-drawer,
  .navigation-drawer *,
  .navigation__child-tier,
  .navigation__child-tier *,
  .navigation__tier-2-container,
  .navigation__tier-2-container *,
  .mobile-navigation-drawer,
  .mobile-navigation-drawer * {
    background-color: #ffffff !important;
    background: #ffffff !important;
  }

  .navigation-drawer__header {
    border-bottom: 1px solid #f0f0f0 !important;
  }

}


/* ==========================================================================
   EDITORIAL MEGA MENU (ACE & TATE REFERENCE EXACT STYLING)
   ========================================================================== */

.mega-menu-editorial__inner {
  max-width: 1340px !important;
  margin: 0 auto !important;
  padding: 40px 20px !important;
  width: 100% !important;
}

.mega-menu-editorial__container {
  display: flex !important;
  justify-content: space-between !important;
  gap: 60px !important;
  align-items: flex-start !important;
}

/* Left Side: Links Grid */
.mega-menu-editorial__links-col {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 40px 60px !important;
  flex: 1 1 auto !important;
}

.mega-menu-editorial__links-col.has-promos {
  max-width: 55% !important;
}

.mega-menu-editorial__links-col.full-width {
  max-width: 100% !important;
}

.mega-menu-editorial__link-group {
  min-width: 160px !important;
  display: flex !important;
  flex-direction: column !important;
}

.mega-menu-editorial__group-title {
  font-weight: 600 !important;
  font-size: 14px !important;
  color: #000000 !important;
  text-decoration: none !important;
  margin-bottom: 12px !important;
  display: block !important;
}

.mega-menu-editorial__sub-list {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
}

.mega-menu-editorial__sub-list a {
  font-size: 13px !important;
  color: #4a4a4a !important;
  text-decoration: none !important;
  transition: color 0.15s ease !important;
}

.mega-menu-editorial__sub-list a:hover {
  color: #FE3B07 !important;
}

/* Right Side: Editorial Promos (Ace & Tate Aspect Ratio) */
.mega-menu-editorial__promos-col {
  display: flex !important;
  gap: 20px !important;
  width: 45% !important;
  max-width: 520px !important;
  flex-shrink: 0 !important;
}

.mega-menu-editorial__card {
  flex: 1 1 0% !important;
  width: 50% !important;
}

.mega-menu-editorial__card a {
  text-decoration: none !important;
  display: block !important;
  color: #000000 !important;
}

.mega-menu-editorial__image-wrapper {
  width: 100% !important;
  aspect-ratio: 4 / 5 !important; /* Editorial Portrait ratio like Ace & Tate */
  overflow: hidden !important;
  background-color: #f5f5f5 !important;
  margin-bottom: 12px !important;
}

.mega-menu-editorial__image-wrapper img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
  transition: transform 0.3s ease !important;
}

.mega-menu-editorial__caption {
  font-size: 13px !important;
  font-weight: 500 !important;
  color: #000000 !important;
  line-height: 1.4 !important;
  display: block !important;
}


/* ==========================================================================
   EDITORIAL MEGA MENU IMAGE SIZE CONSTRAINTS
   ========================================================================== */

/* Restrict right section width to prevent single image expansion */
.mega-menu-editorial__promo-images,
.mega-menu-editorial__promos-col {
  display: flex !important;
  gap: 20px !important;
  max-width: 460px !important; /* Maximum width for right promo area */
  width: 100% !important;
  margin-left: auto !important;
}

/* Lock individual card sizing */
.mega-menu-editorial__promo-item,
.mega-menu-editorial__card {
  flex: 1 1 0% !important;
  max-width: 220px !important; /* Maximum width per image card */
  width: 100% !important;
}

/* Lock image height and crop proportionally */
.mega-menu-editorial__promo-item img,
.mega-menu-editorial__image-wrapper img,
.mega-menu-editorial__card img {
  width: 100% !important;
  height: 260px !important; /* Fixed image height to prevent vertical expansion */
  max-height: 260px !important;
  object-fit: cover !important; /* Clean cropping without distortion */
  display: block !important;
}

/* Image caption styling */
.mega-menu-editorial__promo-caption,
.mega-menu-editorial__caption {
  margin-top: 10px !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  color: #000000 !important;
  line-height: 1.4 !important;
}


/* ==========================================================================
   EDITORIAL IMAGE SIZING AND ALIGNMENT REFINEMENTS
   ========================================================================== */

/* Set 340px image height for 4:5 portrait aspect ratio (Ace & Tate style) */
.mega-menu-editorial__promo-item img,
.mega-menu-editorial__image-wrapper img,
.mega-menu-editorial__card img {
  width: 100% !important;
  height: 340px !important;
  max-height: 340px !important;
  aspect-ratio: 4 / 5 !important;
  object-fit: cover !important;
  display: block !important;
}

/* Align top edge of images with the first line of navigation links */
.mega-menu-editorial__container,
.mega-menu-editorial__promo-images,
.mega-menu-editorial__promos-col {
  align-items: flex-start !important;
  padding-top: 0 !important;
  margin-top: 0 !important;
}

/* Image caption typography styling */
.mega-menu-editorial__promo-caption,
.mega-menu-editorial__caption {
  margin-top: 12px !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  color: #000000 !important;
  text-decoration: none !important;
}


/* ==========================================================================
   ACCESSIBILITY KEYBOARD & ESCAPE LOGIC
   ========================================================================== */

/* 1. Open mega menu during keyboard Tab navigation (:focus-within) */
.navigation__tier-1 > .navigation__item:focus-within > .navigation__tier-2-container,
.navigation__tier-1 > .navigation__item:focus-within > .mega-menu-editorial,
.navigation__tier-1 > .navigation__item:focus-within > .mega-menu {
  display: block !important;
}

/* 2. Visible Arc Red focus indicator during keyboard Tab navigation */
.navigation__link:focus-visible,
.mega-menu-editorial a:focus-visible {
  outline: 2px solid #FE3B07 !important;
  outline-offset: 3px !important;
}

/* 3. Hide menu specifically when Escape key is pressed */
.navigation__tier-1 > .navigation__item.is-escaped > .navigation__tier-2-container,
.navigation__tier-1 > .navigation__item.is-escaped > .mega-menu-editorial,
.navigation__tier-1 > .navigation__item.is-escaped > .mega-menu {
  display: none !important;
}


/* ==========================================================================
   FORCED CLOSE STATE VIA ESCAPE KEY (BODY CLASS)
   ========================================================================== */
html body.menu-escaped #pageheader .navigation__tier-2-container,
html body.menu-escaped #pageheader .mega-menu-editorial,
html body.menu-escaped #pageheader .mega-menu {
  display: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

/* ==========================================================================
   CLEAN HERO OVERLAY HEADER (NEGATIVE MARGIN METHOD)
   ========================================================================== */
@media (min-width: 769px) {

  /* 1. Set background header transparan khusus di halaman yang punya Hero Section */
  body.has-hero-header .section-header,
  body.has-hero-header #pageheader,
  body.has-hero-header .pageheader {
    background-color: transparent !important;
    transition: background-color 0.25s ease !important;
  }

  /* 2. Tarik section Hero pertama ke atas sejauh 60px (tinggi header) */
  body.has-hero-header main .shopify-section:first-child,
  body.has-hero-header #content .shopify-section:first-child {
    margin-top: -60px !important;
    position: relative !important;
    z-index: 1 !important;
  }

  /* 3. Pastikan z-index header tetap berada di atas Hero Image */
  body.has-hero-header .section-header {
    position: sticky !important;
    top: 0 !important;
    z-index: 9990 !important;
  }

  /* 4. Saat mouse di-hover ke header, background berubah jadi putih solid */
  body.has-hero-header .section-header:hover,
  body.has-hero-header #pageheader:hover {
    background-color: #ffffff !important;
  }

}

/* ==========================================================================
   FIX TOP WHITE STRIP: TRANSPARENT ALL HEADER OUTER WRAPPERS
   ========================================================================== */
@media (min-width: 769px) {

  /* 1. Hilangkan padding & margin bawaan pada seluruh layer pembungkus header */
  .section-header,
  page-header,
  #pageheader,
  .pageheader,
  .logo-area {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    margin-top: 0 !important;
    border: none !important;
    box-shadow: none !important;
  }

  /* 2. Kunci tinggi outer wrapper persis 60px (sejajar dengan logo-area) */
  .section-header,
  page-header,
  #pageheader {
    height: 60px !important;
    min-height: 60px !important;
    max-height: 60px !important;
  }

  /* 3. Paksa SELURUH layer pembungkus header transparan di halaman Hero */
  body.has-hero-header .section-header,
  body.has-hero-header page-header,
  body.has-hero-header #pageheader,
  body.has-hero-header .pageheader,
  body.has-hero-header .logo-area {
    background-color: transparent !important;
    background: transparent !important;
  }

  /* 4. Tarik Hero Section sejauh 60px ke atas */
  body.has-hero-header main .shopify-section:first-child,
  body.has-hero-header #content .shopify-section:first-child {
    margin-top: -60px !important;
  }

  /* 5. Saat di-hover, kembalikan background putih ke seluruh layer header */
  body.has-hero-header .section-header:hover,
  body.has-hero-header page-header:hover,
  body.has-hero-header #pageheader:hover {
    background-color: #ffffff !important;
    background: #ffffff !important;
  }

}

/* ==========================================================================
   SCROLLED SOLID HEADER & MEGA MENU PADDING ADJUSTMENT
   ========================================================================== */
@media (min-width: 769px) {

  /* 1. SOLID WHITE HEADER ON SCROLL (Saat halaman di-scroll ke bawah) */
  body.has-hero-header.is-scrolled .section-header,
  body.has-hero-header.is-scrolled page-header,
  body.has-hero-header.is-scrolled #pageheader,
  body.has-hero-header.is-scrolled .pageheader,
  body.has-hero-header.is-scrolled .logo-area {
    background-color: #ffffff !important;
    background: #ffffff !important;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05) !important;
  }

/* ==========================================================================
   PERFECT MEGA MENU POSITIONING & INTERNAL PADDING FIX
   ========================================================================== */
@media (min-width: 769px) {

  /* 1. Kunci posisi Mega Menu tepat di bawah header 60px */
  #pageheader .navigation__tier-2-container,
  #pageheader .mega-menu-editorial,
  #pageheader .mega-menu {
    position: absolute !important;
    top: 36px !important; /* Pas di batas bawah header 60px */
    left: 50% !important;
    transform: translateX(-50%) !important;
    width: 100vw !important;
    max-width: 100vw !important;
    padding-top: 0 !important; /* Hilangkan gap melayang luar */
    background: #ffffff !important;
    background-color: #ffffff !important;
    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.05) !important;
    z-index: 9999 !important;
  }

  /* 2. Beri jarak aman (padding-top) untuk konten dalam Mega Menu */
  .mega-menu-editorial__inner,
  .navigation__tier-2 {
    max-width: 1340px !important;
    margin: 0 auto !important;
    padding: 36px 20px 40px 20px !important; /* 36px padding atas agar teks tidak menabrak garis merah */
    width: 100% !important;
    box-sizing: border-box !important;
  }

}

/* ==========================================================================
   INSTANT TRANSPARENT HEADER FOR HOMEPAGE (ELIMINATE WHITE FLASHING)
   ========================================================================== */
@media (min-width: 769px) {

  /* Paksa transparan langsung via native Shopify class (.template-index) & .has-hero-header */
  .template-index .section-header,
  .template-index page-header,
  .template-index #pageheader,
  .template-index .pageheader,
  .template-index .logo-area,
  body.has-hero-header .section-header,
  body.has-hero-header page-header,
  body.has-hero-header #pageheader,
  body.has-hero-header .pageheader,
  body.has-hero-header .logo-area {
    background-color: transparent !important;
    background: transparent !important;
  }

  /* Tarik Hero Section ke atas seketika di Homepage & Hero Pages */
  .template-index main .shopify-section:first-child,
  .template-index #content .shopify-section:first-child,
  body.has-hero-header main .shopify-section:first-child,
  body.has-hero-header #content .shopify-section:first-child {
    margin-top: -60px !important;
  }

  /* Hover state: Tetap berubah jadi putih saat kursor di atas header */
  .template-index .section-header:hover,
  .template-index page-header:hover,
  .template-index #pageheader:hover,
  body.has-hero-header .section-header:hover,
  body.has-hero-header page-header:hover,
  body.has-hero-header #pageheader:hover {
    background-color: #ffffff !important;
    background: #ffffff !important;
  }

}

/* ==========================================================================
   ARC THE STORY - CLEAN HEADER & ACCURATE ITEM UNDERLINE (NO FULL RED LINE)
   ========================================================================== */
@media (min-width: 769px) {

  /* 1. Rigid 60px Height Lock for Header Wrappers */
  .section-header,
  page-header,
  #pageheader,
  .pageheader,
  .logo-area {
    height: 60px !important;
    min-height: 60px !important;
    max-height: 60px !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    margin-top: 0 !important;
    box-sizing: border-box !important;
  }

  .logo-area__middle,
  .logo-area__middle__inner,
  main-navigation,
  .navigation,
  .navigation__tier-1 {
    height: 100% !important;
    display: flex !important;
    align-items: center !important;
    margin: 0 !important;
    padding: 0 !important;
    position: static !important;
  }

  .navigation__tier-1 > .navigation__item {
    position: static !important;
    height: 100% !important;
    display: flex !important;
    align-items: center !important;
  }

  /* 2. Navigation Link: Centered Text with Full-Height Hit Box */
  .navigation__tier-1 > .navigation__item > .navigation__link {
    position: relative !important;
    height: 100% !important;
    display: inline-flex !important;
    align-items: center !important;
    padding: 0 !important;
    margin: 0 !important;
    color: #000000 !important;
    font-size: 14px !important;
    line-height: 1 !important;
    text-decoration: none !important;
    cursor: pointer !important;
  }

  /* 3. Arc Red Underline: STRICTLY scoped to the hovered link only (Bottom of Header) */
  .navigation__tier-1 > .navigation__item > .navigation__link::after {
    content: '' !important;
    position: absolute !important;
    bottom: 0 !important; /* Anchored exactly at the bottom boundary of 60px header */
    left: 0 !important;
    width: 0 !important;
    height: 2px !important; /* Clean 2px Arc Red active underline */
    background-color: #FE3B07 !important;
    transition: width 0.2s ease !important;
  }

  .navigation__tier-1 > .navigation__item:hover > .navigation__link::after,
  .navigation__tier-1 > .navigation__item--active > .navigation__link::after {
    width: 100% !important;
  }

  /* 4. Full-Width 100vw Mega Menu (Clean White, No Full-Width Red Border Line) */
  #pageheader .navigation__tier-2-container,
  #pageheader .mega-menu-editorial,
  #pageheader .mega-menu {
    position: absolute !important;
    top: 60px !important; /* Directly below the 60px header */
    left: 50% !important;
    transform: translateX(-50%) !important;
    width: 100vw !important;
    max-width: 100vw !important;
    padding-top: 0 !important;
    margin-top: 0 !important;
    background-color: #ffffff !important;
    border-top: none !important; /* REMOVED 100vw RED BORDER LINE */
    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.05) !important;
    z-index: 9999 !important;
  }

  /* 5. Inner Mega Menu Content Spacing */
  .mega-menu-editorial__inner,
  .navigation__tier-2 {
    max-width: 1340px !important;
    margin: 0 auto !important;
    padding: 36px 20px 40px 20px !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }

}

/* ==========================================================================
   ARC THE STORY - PERFECT CENTER-EXPANDING UNDERLINE (SCALE METHOD)
   ========================================================================== */
@media (min-width: 769px) {

  /* 1. Link Navigasi: Ukuran Terkunci Pas Selebar Teks (Tanpa Margin/Padding Siluman) */
  .navigation__tier-1 > .navigation__item > .navigation__link {
    position: relative !important;
    height: 100% !important;
    display: inline-flex !important;
    align-items: center !important;
    padding: 0 !important;
    margin: 0 !important;
    color: #000000 !important;
    font-size: 14px !important;
    line-height: 1 !important;
    text-decoration: none !important;
    cursor: pointer !important;
  }

  /* 2. Underline Merah: Pakai scaleX Agar Presisi 100% Di Tengah Teks */
  .navigation__tier-1 > .navigation__item > .navigation__link::after {
    content: '' !important;
    position: absolute !important;
    top: calc(50% + 11px) !important; /* Jarak vertikal pas di bawah teks */
    left: 0 !important;
    width: 100% !important; /* Mengunci lebar persis selebar kata */
    height: 2px !important;
    background-color: #FE3B07 !important;
    transform: scaleX(0) !important; /* Mulai dari skala 0 (tak terlihat) */
    transform-origin: center !important; /* Titik mekar tepat dari poros tengah teks */
    transition: transform 0.25s ease-in-out !important;
  }

  .navigation__tier-1 > .navigation__item:hover > .navigation__link::after,
  .navigation__tier-1 > .navigation__item--active > .navigation__link::after {
    transform: scaleX(1) !important; /* Merekam penuh pas 100% selebar teks */
  }

  /* 3. Mega Menu (Struktur Pilihanmu Tetap Utuh) */
  #pageheader .navigation__tier-2-container,
  #pageheader .mega-menu-editorial,
  #pageheader .mega-menu {
    position: absolute !important;
    top: 100% !important; /* Mengunci tepat di batas bawah #pageheader */
    left: 50% !important;
    transform: translateX(-50%) !important;
    width: 100vw !important;
    max-width: 100vw !important;
    padding-top: 0 !important;
    margin-top: 0 !important;
    background: #ffffff !important;
    background-color: #ffffff !important;
    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.05) !important;
    z-index: 9999 !important;
  }

  /* 4. Jarak Dalam Konten Mega Menu */
  .mega-menu-editorial__inner,
  .navigation__tier-2 {
    max-width: 1340px !important;
    margin: 0 auto !important;
    padding: 32px 20px 40px 20px !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }

}

/* ==========================================================================
   FORCE PASSE-PARTOUTS ALIGNMENT & REMOVE TOP BORDER (HIGH SPECIFICITY)
   ========================================================================== */
@media (min-width: 769px) {

  /* 1. Paksa kontainer utama menyusun kolom Lijsten & Passe-partouts berdampingan */
  body #pageheader .mega-menu-editorial__links-col,
  body .mega-menu-editorial__links-col,
  #pageheader .mega-menu-editorial__links-col {
    display: flex !important;
    flex-direction: row !important;
    align-items: flex-start !important;
    justify-content: flex-start !important;
    gap: 48px !important;
  }

  /* 2. Hapus border-top, margin-top, dan padding-top pada SELURUH grup link */
  body #pageheader .mega-menu-editorial__link-group,
  body .mega-menu-editorial__link-group,
  #pageheader .mega-menu-editorial__link-group,
  body #pageheader .mega-menu-editorial__link-group + .mega-menu-editorial__link-group,
  body .mega-menu-editorial__link-group + .mega-menu-editorial__link-group {
    border: none !important;
    border-top: none !important;
    border-top-width: 0 !important;
    margin-top: 0 !important;
    padding-top: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
  }

  /* 3. Pastikan judul Passe-partouts rata dari paling atas */
  body #pageheader .mega-menu-editorial__group-title,
  body .mega-menu-editorial__group-title {
    margin-top: 0 !important;
    padding-top: 0 !important;
  }

}

/* ==========================================================================
   KILL BORDER & PSEUDO-ELEMENT LINE ABOVE PASSE-PARTOUTS
   ========================================================================== */
@media (min-width: 769px) {

  /* 1. Hapus border, outline, dan shadow pada seluruh elemen grup & judul */
  body #pageheader .mega-menu-editorial__link-group,
  body #pageheader .mega-menu-editorial__group-title,
  body #pageheader a.mega-menu-editorial__group-title,
  body #pageheader .mega-menu-editorial__link-group + .mega-menu-editorial__link-group {
    border: none !important;
    border-top: none !important;
    border-top-width: 0 !important;
    box-shadow: none !important;
    background-image: none !important;
  }

  /* 2. Matikan pseudo-element (::before / ::after) yang sering dipakai tema untuk menggambar garis */
  body #pageheader .mega-menu-editorial__link-group::before,
  body #pageheader .mega-menu-editorial__link-group::after,
  body #pageheader .mega-menu-editorial__group-title::before,
  body #pageheader .mega-menu-editorial__group-title::after {
    content: none !important;
    display: none !important;
    border: none !important;
    height: 0 !important;
  }

}