/** Shopify CDN: Minification failed

Line 608:9 Expected identifier but found whitespace
Line 615:1 Expected "}" to go with "{"

**/


/* 1) Brand palette */
:root{
  --c-primary: #FFFEE0(175, 174, 249);
  --c-secondary:rgb(0, 0, 0);

  --c-accent-100: #d9d9d9;
  --c-accent-200: #a6a6a6;
  --c-accent-300:rgb(255, 255, 255);
}

/* 2) Global typography */
html, body {
  background: var(--c-primary);
  color: var(--c-secondary);
}

/* Use Anton for headings + nav */
h1, h2, h3, h4, h5, h6,
.header__heading,
.header__menu-item,
.menu-drawer__menu-item,
.button,
.shopify-policy__title {
  font-family: "Anton", sans-serif !important;
  letter-spacing: 0.5px;
}

/* Body stays clean + readable */
body, p, a, li, input, textarea, select {
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
}

/* Links */
a { color: var(--c-secondary); }
a:hover { color: var(--c-accent-300); }

/* Buttons (simple monochrome) */
.button, .button:before, .button:after {
  border-radius: 999px;
}
.button--primary {
  background: var(--c-secondary) !important;
  color: var(--c-primary) !important;
}
.button--secondary {
  background: transparent !important;
  color: var(--c-secondary) !important;
  border: 1px solid var(--c-secondary) !important;
}



.ai-header-nav-SECTIONID {
  background: ##FFFEE0 !important;
}





/* =========================
   Neatly Hero
========================= */
.neatly-hero {
  background: var(--c-primary); /* black */
  color: var(--c-primary);        /* white */
  padding: 70px 0;
}

.neatly-hero__inner{
  display: grid;
  grid-template-columns: 1.15fr 0.85fr;
  gap: 60px;
  align-items: center;
}

.neatly-hero__title{
  color:rgb(0, 0, 0) !important;
  font-family: "Anton", sans-serif;
  font-size: clamp(42px, 6vw, 78px);
  line-height: 0.95;
  letter-spacing: 1px;
  margin: 0 0 18px;
  text-transform: uppercase;
}

.neatly-hero__sub{
  max-width: 520px;
  font-size: 18px;
  line-height: 1.6;
  color: rgba(0, 0, 0, 0.85);
  margin: 0 0 26px;
}

/* Buttons */
.neatly-hero__buttons{
  display: flex;
  gap: 14px;
  color: hsla(0, 0.00%, 96.90%, 0.85);
  flex-wrap: wrap;
}

.neatly-btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 11px 18px;
  border-radius: 999px;
  text-decoration: none;
  font-family: "Anton", sans-serif;
  letter-spacing: 0.6px;
  text-transform: uppercase;
}

.neatly-btn--primary{
  background: var(--c-secondary); /* black button */
  color: var(--c-primary);        /* cream text */
  border: 2px solid var(--c-secondary);
}

.neatly-btn--primary:hover{
  background: #333;
}


/* Right placeholders */
.neatly-hero__right{
  display: grid;
  gap: 18px;
  justify-items: end;
}

.neatly-hero__placeholder{
  width: 100%;
  border-radius: 18px;
  border: 1px solid rgba(15, 13, 13, 0.18);
  background: rgba(255,255,255,0.06);
  display: flex;
  align-items: center;
  justify-content: center;
  color: rgba(255,255,255,0.55);
  font-size: 13px;
  text-transform: uppercase;
  letter-spacing: 0.12em;
}

.neatly-hero__placeholder--large{
  height: 220px;
  max-width: 420px;
}

.neatly-hero__stack{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
  width: 100%;
  max-width: 420px;
}

.neatly-hero__placeholder--small{
  height: 150px;
}

/* Mobile */
@media (max-width: 900px){
  .neatly-hero__inner{
    grid-template-columns: 1fr;
    gap: 30px;
  }
  .neatly-hero__right{
    justify-items: start;
  }
  .neatly-hero__placeholder--large,
  .neatly-hero__stack{
    max-width: 100%;
  }
}



/* Row 2 Single Block */
.neatly-row-single {
  margin-top: 22px;
}

.neatly-card--list-full {
  padding: 40px;
}

/* Make the heading less massive */
.neatly-card--list-full .neatly-h2 {
  font-size: 34px;
  margin-bottom: 22px;
}

/* Numbered list spacing */
.neatly-card--list-full .neatly-ol {
  font-size: 16px;
  gap: 18px;
}

.neatly-card--list-full li strong {
  font-weight: 700;
}





/* =========================================================
   Neatly Home Blocks (GoCardless-style)
   Section class: .neatly-home-blocks
========================================================= */

.neatly-home-blocks{
  background:rgb(0, 0, 0); /* soft beige */
  color: #000;
  padding: 48px 0 72px;
}

/* Trust pill */
.nhb-trust{
  display: flex;
  justify-content: center;
  margin-bottom: 28px;
}

.nhb-trust__pill{
  border-radius: 10px;
  padding: 12px 18px;
  width: 100%;
  max-width: 760px;
  text-align: center;
  font-size: 36px;
  color: rgb(255, 255, 255);
}

/* Main 2-column row */
.nhb-row{
  display: grid;
  grid-template-columns: 1.05fr 0.95fr;
  gap: 64px;
  align-items: start;
}

/* Left media */
.nhb-media__placeholder{
  width: 100%;
  max-width: 560px;
  height: 460px;
  border-radius: 26px;
  background: rgba(0,0,0,0.06);
  border: 2px dashed #a6a6a6;
  display: flex;
  align-items: center;
  justify-content: center;
}

.nhb-media__placeholder span{
  color:rgb(255, 255, 255);
  text-transform: uppercase;
  letter-spacing: 0.12em;
  font-size: 12px;
}

/* Right content */
.nhb-content{
  padding-top: 10px;
}

.nhb-title{
  font-family: "Anton", sans-serif;
  font-size: 48px;
  line-height: 1.05;
  margin: 0 0 28px;
  text-transform: none;
  letter-spacing: 0;
  color: rgb(255, 255, 255);
}

/* 2x2 features */
.nhb-grid{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 46px 70px;
  color: rgb(255, 255, 255);
}

.nhb-title{
  font-size: 40px;
  line-height: 1.05;
  margin: 0 0 18px;
  color: rgb(255, 255, 255);
}

.nhb-grid{
  gap: 28px 55px; /* tighter */
  
}

.nhb-item__title{
  font-size: 18px;
  margin: 0 0 8px;
  color: rgb(255, 255, 255);
}

.nhb-item__body{
  font-size: 14px;
  line-height: 1.55;
  max-width: 300px;
  color: rgb(255, 255, 255);
}

/* Mobile */
@media (max-width: 900px){
  .nhb-row{
    grid-template-columns: 1fr;
    gap: 28px;
  }

  .nhb-media__placeholder{
    max-width: 100%;
    height: 320px;
  }

  .nhb-title{
    font-size: 36px;
  }

  .nhb-grid{
    grid-template-columns: 1fr;
    gap: 18px;
  }

  .nhb-list-card{
    padding: 26px;
  }
}



/* =========================================================
   Neatly Plan Switcher
   Section class: .neatly-plan
========================================================= */

.neatly-plan{
  background:  #FFFEE0;
  padding: 80px 0;
  color: #000000;
}

.neatly-plan__inner{
  display: grid;
  grid-template-columns: 0.95fr 1.05fr;
  gap: 70px;
  align-items: center;
}

/* LEFT */
.neatly-plan__kicker{
  font-family: "Anton", sans-serif;
  color: #a6a6a6;
  letter-spacing: 0.08em;
  margin-bottom: 12px;
  font-size: 20px;
}

.neatly-plan__title{
  font-family: "Anton", sans-serif;
  font-size: 35px;
  line-height: 0.95;
  margin: 0 0 16px;
}

.neatly-plan__body{
  margin: 0 0 24px;
  color: #545454;
  line-height: 1.7;
  font-size: 18px;
  max-width: 520px;
}

.neatly-plan__cta{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  font-family: "Anton", sans-serif;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  padding: 14px 26px;
  border-radius: 999px;
  background: #000000;
  color: #FFFFFF;
}

/* RIGHT */
.neatly-plan__tabs{
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
  justify-content: flex-start;
  margin-bottom: 22px;
}

.neatly-tab{
  border: 1.5px solid #a6a6a6;
  background: transparent;
  color: #000000;
  padding: 12px 18px;
  border-radius: 999px;
  font-family: "Anton", sans-serif;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  cursor: pointer;
  line-height: 1;
}

.neatly-tab.is-active{
  background: #000000;
  color: #FFFFFF;
  border-color: #000000;
}

.neatly-plan__panel{
  display: grid;
  grid-template-columns: 0.9fr 0.6fr;
  gap: 36px;
  align-items: center;
}

/* IMAGE */
.neatly-plan__image{
  width: 100%;
  height: 360px;
  object-fit: cover;
  border-radius: 26px;
  border: 2px dashed #a6a6a6;
  background: #f3f3f3;
}

.neatly-plan__imagePlaceholder{
  width: 100%;
  height: 360px;
  border-radius: 26px;
  border: 2px dashed #a6a6a6;
  background: #f3f3f3;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #545454;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  font-size: 12px;
}

/* TEXT */
.neatly-plan__detailsTitle{
  font-family: "Anton", sans-serif;
  font-size: 44px;
  margin: 0 0 10px;
}

.neatly-plan__detailsText{
  color: #545454;
  line-height: 1.7;
  font-size: 18px;
  margin: 0;
}

/* MOBILE */
@media (max-width: 900px){
  .neatly-plan__inner{
    grid-template-columns: 1fr;
    gap: 30px;
  }
  .neatly-plan__title{
    font-size: 48px;
  }
  .neatly-plan__panel{
    grid-template-columns: 1fr;
    gap: 18px;
  }
  .neatly-plan__image,
  .neatly-plan__imagePlaceholder{
    height: 280px;
  }
  .neatly-plan__detailsTitle{
    font-size: 34px;
  }
}




/* Reverse layout (right content moved left) */
.neatly-plan--reversed .neatly-plan__inner{
  grid-template-columns: 1.05fr 0.95fr; /* optional tweak */
}

.neatly-plan--reversed .neatly-plan__left{
  order: 1;
}

.neatly-plan--reversed .neatly-plan__right{
  order: 2;
}

/* Mobile stays stacked naturally, but keep it consistent */
@media (max-width: 900px){
  .neatly-plan--reversed .neatly-plan__left,
  .neatly-plan--reversed .neatly-plan__right{
    order: initial;
  }
}



/* ===== Neatly Testimonials (Palette Version) ===== */

.neatly-testi{
  background: var(--c-primary); /* WHITE background */
  padding: 56px 0 60px;
}

.neatly-testi__heading{
  color: var(--c-secondary); /* BLACK heading */
}

.neatly-testi__card{
  background: var(--c-primary);
  box-shadow: 0 10px 30px rgba(0,0,0,0.06);
}

.neatly-testi__img,
.neatly-testi__imgPlaceholder{
  background: var(--c-accent-100);
}

.neatly-testi__quoteIcon{
  background: var(--c-accent-100);
  color: var(--c-secondary); /* BLACK quote icon */
}

.neatly-testi__text{
  color: var(--c-accent-300); /* grey paragraph */
}

.neatly-testi__name{
  color: var(--c-secondary); /* black name */
}

/* Button */
.neatly-testi__btn{
  border: 2px solid var(--c-secondary); /* BLACK outline */
  color: var(--c-secondary);
}

.neatly-testi__btn:hover{
  background: var(--c-secondary);
  color: var(--c-primary);
}



/* ======================================================
   Parallel Column Fix
====================================================== */

.neatly-contact__inner{
  align-items: stretch !important;
}

.neatly-contact__left{
  display: flex;
  flex-direction: column;
  height: 100%;
}

.neatly-contact__card{
  position: relative !important;
  top: auto !important;
  height: 100%;
}

.neatly-contact__faqWrap{
  margin-top: auto;
}

.neatly-contact__faq{
  flex-grow: 1;
}




.nhb-media__img {
  width: 100%;
  height:

  .nhb-media__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}