/** Shopify CDN: Minification failed

Line 322:1 Expected "}" to go with "{"

**/
/* ============================================================
   SEVEN SCENTS — home-page.css  (homepage only, linked)
   Padding-only rhythm (Design System v1.2 §3).
   v2 FIX: every class is now .hp- prefixed so nothing collides
   with Booster framework classes (.grid/.item/.tag/.disc/.info/
   .map/.chip all exist in Booster and were overriding us — that
   was the cause of the giant section heights, the black tagline
   bar, and the missing scent circles).
   Body class is `template--index` (confirmed in theme.liquid).
   ============================================================ */

/* 0. Kill Booster's stacked between-section margin (page-scoped)
   + belt-and-braces: stop any section wrapper stretching tall. */
.template--index .shopify-section,
.template--index .s__holder { margin-bottom:0 !important; }
.template--index main .shopify-section { min-height:0 !important; height:auto !important; }

/* tokens */
.template--index{
  --navy:#112a46; --navy-hover:#0d2138; --cream-bg:#faf8f4; --cream:#f4e9dd;
  --secondary:#6b675e; --gold:#c8a96e; --gold-text:#856436; --bronze:#775e30;
  --line:#e3d9cb; --footer:#293133; --footer-gold:#D4BB8C;
  --shadow:0 10px 26px rgba(17,42,70,.08); --radius:8px; --radius-sm:4px;
  --ring-floral:#E4B1C3; --ring-citrus:#ECD285; --ring-vanilla:#EBD3AE;
  --ring-fruity:#E7A48F; --ring-fresh:#A9CAD4; --ring-woody:#C3A07B; --ring-herbal:#AFC3A4;
}

/* shared building blocks */
/* Match the theme's content width AND fill it. Booster's custom-Liquid
   wrapper shrink-wraps content to its intrinsic width, which collapsed the
   narrow sections (newsletter, map, centred pills). width:100% forces every
   section to the full container width — same as the header/footer, and the
   same width as the grid-heavy sections. */
.hp-wrap{ box-sizing:border-box !important; width:100% !important; max-width:none !important; margin-left:0 !important; margin-right:0 !important; padding-left:0 !important; padding-right:0 !important; }
/* belt-and-braces: the block children fill .hp-wrap too */
.hp-visit__grid, .hp-tiles, .hp-diff, .hp-journal, .hp-rgrid,
.hp-concern, .hp-scent, .hp-trust__grid, .hp-hero__grid,
.hp-dupe__grid, .hp-founder__grid{ width:100%; }
.hp-eyebrow{font-size:.9375rem; text-transform:uppercase; letter-spacing:.16em; font-weight:700; color:var(--bronze); margin:0 0 12px;}
.hp-hairline{width:56px; height:2px; background:var(--gold); border:0; margin:18px 0 0;}
.hp-head{max-width:720px;} .hp-head.hp-center{margin:0 auto; text-align:center;} .hp-head.hp-center .hp-hairline{margin-left:auto; margin-right:auto;}
.hp-lede{font-size:20px; color:var(--secondary); margin-top:16px; max-width:640px;}
.hp-btn{display:inline-block; font-weight:600; font-size:16px; padding:14px 26px; border-radius:var(--radius-sm); text-decoration:none; min-height:48px; line-height:1.25; border:1px solid transparent; transition:background .2s,color .2s,border-color .2s,transform .2s;}
.hp-btn--filled{background:var(--navy) !important; color:#fff !important;} .hp-btn--filled:hover{background:var(--navy-hover) !important;}
.hp-btn--outline{background:transparent !important; color:var(--navy) !important; border-color:var(--navy) !important;} .hp-btn--outline:hover{background:var(--navy) !important; color:#fff !important;}
.hp-btn--light{background:#fff !important; color:var(--navy) !important; border-color:var(--line) !important;} .hp-btn--light:hover{border-color:var(--gold) !important;}
.hp-textlink{display:inline-block; font-weight:600; color:var(--bronze); text-decoration:none; border-bottom:1px solid var(--gold); padding-bottom:2px;} .hp-textlink:hover{color:var(--navy);}

/* section rhythm — change 72 here if any section feels too airy */
.hp-sec{padding:72px 0;} .hp-sec--cream{background:var(--cream);}

/* FULL-BLEED backgrounds ------------------------------------------------
   Paint the FULL-WIDTH Booster section wrapper (.shopify-section) rather
   than the inner content box. :has() matches the wrapper that contains
   each of our sections, so the colour spans edge-to-edge while content
   stays centred via .hp-wrap. Container-independent — no viewport math,
   so it can't shift left/clip like the earlier method. Inner backgrounds
   below stay as a harmless fallback. Plain white sections aren't listed. */
.template--index .shopify-section:has(.hp-hero){ background:var(--cream); }
.template--index .shopify-section:has(.hp-trust){ background:var(--cream-bg); }
.template--index .shopify-section:has(.hp-dupe){ background:var(--navy); }
.template--index .shopify-section:has(.hp-sec--cream){ background:var(--cream); }
.template--index .shopify-section:has(.hp-reviews){ background:var(--cream); }
.template--index .shopify-section:has(.hp-email){ background:#d3e0cf; }

/* 1. hero */
.hp-hero{background:var(--cream);}
.hp-hero__grid{display:grid; grid-template-columns:0.82fr 1fr; min-height:480px; align-items:stretch;}
.hp-hero__copy{padding:64px 56px 64px 0; display:flex; flex-direction:column; justify-content:center;}
.hp-hero h1{margin-bottom:6px;}
.hp-hero__tag{background:transparent !important; font-family:var(--titleFont,'Playfair Display',serif); font-style:italic; color:var(--gold-text) !important; font-size:20px; margin:14px 0 0; padding:0 !important;}
.hp-hero__lede{font-size:20px; line-height:1.6; color:var(--secondary); margin:16px 0 30px; max-width:520px;}
.hp-hero__cta{display:flex; gap:14px; flex-wrap:wrap; align-items:center;}
.hp-hero__find{margin-top:30px;}
.hp-hero__shot{min-height:480px; position:relative; overflow:hidden; background:var(--cream);}
.hp-hero__shot img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover;}

/* 2. trust bar */
.hp-trust{background:var(--cream-bg); border-bottom:1px solid var(--line);}
.hp-trust__grid{display:grid; grid-template-columns:repeat(4,1fr); gap:24px; padding:34px 0;}
.hp-trust__item{display:flex; gap:14px; align-items:flex-start;}
.hp-ic{flex:0 0 40px; width:40px; height:40px; border-radius:50%; background:var(--cream); display:flex; align-items:center; justify-content:center;}
.hp-ic svg{width:20px; height:20px; stroke:var(--gold-text); fill:none; stroke-width:1.7;}
.hp-trust__t{font-weight:600; font-size:15px; margin:0 0 2px; color:var(--navy);} .hp-trust__d{font-size:13.5px; color:var(--secondary); line-height:1.5;}

/* 3. shop by product */
.hp-tiles{display:grid; grid-template-columns:repeat(5,1fr); gap:20px; margin-top:40px;}
.hp-tile{display:block; text-decoration:none; border:1px solid var(--line); border-radius:var(--radius); background:#fff; overflow:hidden; transition:transform .2s,border-color .2s,box-shadow .2s;}
.hp-tile:hover{transform:translateY(-3px); border-color:var(--gold); box-shadow:var(--shadow);}
.hp-tile__img{aspect-ratio:1/1; background:var(--cream); overflow:hidden; display:block;}
.hp-tile__img img{width:100%; height:100%; object-fit:cover;}
.hp-tile__label{padding:14px 12px; text-align:center; font-weight:600; font-size:15px; color:var(--navy); display:block;}

/* 4. perfume dupes (text on navy) */
.hp-dupe{background:var(--navy);}
.hp-dupe__grid{display:grid; grid-template-columns:1.15fr 0.85fr; gap:56px; align-items:center; padding:76px 0;}
.hp-dupe h2{color:#fff !important;} .hp-dupe .hp-eyebrow{color:var(--footer-gold) !important;} .hp-dupe .hp-hairline{background:var(--footer-gold);}
.hp-dupe__p{color:rgba(255,255,255,.82) !important; font-size:20px; line-height:1.6; margin-top:16px; max-width:520px;}
.hp-chips{display:flex; flex-wrap:wrap; gap:12px; margin-top:28px;}
.hp-chip{display:inline-block; padding:11px 18px; border:1px solid rgba(255,255,255,.4); border-radius:var(--radius-sm); color:#fff !important; text-decoration:none; font-weight:600; font-size:15px; min-height:44px; line-height:1.5;}
.hp-chip:hover{background:#fff; color:var(--navy) !important; border-color:#fff;}
.hp-chip--primary{background:var(--footer-gold); color:var(--navy) !important; border-color:var(--footer-gold);} .hp-chip--primary:hover{background:#fff;}
.hp-dupe__art{aspect-ratio:1/1; max-width:420px; margin-left:auto; border-radius:var(--radius); overflow:hidden; background:#0d2138;}
.hp-dupe__art img{width:100%; height:100%; object-fit:cover;}

/* 5. shop by scent — coloured pills (scent name INSIDE a pill of its colour) */
.hp-scent{display:flex; flex-wrap:wrap; justify-content:center; gap:14px; margin-top:40px;}
.hp-pill{display:inline-flex; align-items:center; justify-content:center; padding:16px 32px; border-radius:100px; text-decoration:none; color:var(--navy); font-weight:600; font-size:17px; line-height:1.2; min-height:54px; box-shadow:inset 0 0 0 1px rgba(17,42,70,.06); transition:transform .2s, box-shadow .2s;}
.hp-pill:hover{transform:translateY(-3px); box-shadow:var(--shadow);}

/* 6. shop by concern */
.hp-concern{display:flex; flex-wrap:wrap; gap:14px; margin-top:38px;}
.hp-cchip{display:inline-flex; align-items:center; gap:9px; padding:13px 20px; background:#fff; border:1px solid var(--line); border-radius:100px; text-decoration:none; color:var(--navy); font-weight:600; font-size:15.5px; min-height:46px; transition:border-color .2s,transform .2s,box-shadow .2s;}
.hp-cchip:hover{border-color:var(--gold); transform:translateY(-2px); box-shadow:var(--shadow);}
.hp-dot{width:10px; height:10px; border-radius:50%; flex:0 0 10px;}

/* 7. founder */
.hp-founder__grid{display:grid; grid-template-columns:1.1fr 1fr; gap:56px; align-items:center;}
.hp-founder__photo{aspect-ratio:3/2; border-radius:var(--radius); overflow:hidden; background:var(--cream);}
.hp-founder__photo img{width:100%; height:100%; object-fit:cover;}
.hp-founder p{color:var(--secondary); margin-top:16px; font-size:20px; line-height:1.6;}
.hp-sig{font-family:var(--titleFont,'Playfair Display',serif); font-style:italic; color:var(--navy); font-size:20px; margin-top:20px;}
.hp-founder__cta{margin-top:26px;}

/* 8. difference */
.hp-diff{display:grid; grid-template-columns:repeat(3,1fr); gap:26px; margin-top:44px;}
.hp-dcard{background:#fff; border:1px solid var(--line); border-radius:var(--radius); padding:30px 28px;}
.hp-dcard h3{font-size:20px; margin:16px 0 8px; color:var(--navy);} .hp-dcard p{color:var(--secondary); font-size:15.5px;}

/* 9. reviews */
.hp-reviews{background:var(--cream);}
.hp-rev-head{display:flex; flex-direction:column; align-items:center; text-align:center;}
.hp-rev-stars{color:#F5A623; font-size:22px; letter-spacing:2px; margin-top:14px;}
.hp-rev-sub{color:var(--secondary); font-size:15px; margin-top:6px;}
.hp-rgrid{display:grid; grid-template-columns:repeat(3,1fr); gap:26px; margin-top:44px;}
.hp-rcard{background:#fff; border:1px solid var(--line); border-radius:var(--radius); padding:30px 28px;}
.hp-rcard .hp-stars{color:#F5A623; font-size:16px; letter-spacing:2px; margin-bottom:14px;}
.hp-rcard p{font-size:16px; color:var(--navy);}
.hp-who{margin-top:18px; font-weight:600; font-size:14px; color:var(--navy);}
.hp-who small{display:block; font-weight:400; color:var(--secondary); font-size:12.5px; margin-top:2px;}

/* 11. journal */
.hp-journal{display:grid; grid-template-columns:repeat(3,1fr); gap:26px; margin-top:44px;}
.hp-jcard{display:block; text-decoration:none; background:#fff; border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; transition:transform .2s,border-color .2s,box-shadow .2s;}
.hp-jcard:hover{transform:translateY(-3px); border-color:var(--gold); box-shadow:var(--shadow);}
.hp-jcard__img{aspect-ratio:16/10; background:var(--cream); overflow:hidden; display:block;} .hp-jcard__img img{width:100%; height:100%; object-fit:cover;}
.hp-jcard__body{padding:22px 24px 26px;}
.hp-cat{font-size:.72rem; text-transform:uppercase; letter-spacing:.14em; font-weight:700; color:var(--bronze);}
.hp-jcard h3{font-size:20px; margin:10px 0 8px; color:var(--navy);} .hp-jcard p{color:var(--secondary); font-size:15px;}
.hp-journal-more{text-align:center; margin-top:40px;}

/* 13. visit us */
.hp-visit__grid{display:grid; grid-template-columns:1fr 1.5fr; border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; background:#fff;}
.hp-visit__info{padding:44px 42px;} .hp-visit__info h2{font-size:34px;}
.hp-rating{display:flex; align-items:center; gap:10px; margin:18px 0 24px; flex-wrap:wrap;}
.hp-num{font-weight:700; font-size:20px; color:var(--navy);} .hp-st{color:#F5A623 !important; letter-spacing:2px;} .hp-cnt{color:var(--secondary); font-size:14px;}
.hp-visit dt{font-size:.75rem; text-transform:uppercase; letter-spacing:.16em; font-weight:700; color:var(--bronze); margin-top:20px;}
.hp-visit dd{margin:6px 0 0; font-size:16px; line-height:1.6; color:var(--navy);}
.hp-map{min-height:100%;} .hp-map iframe{width:100%; height:100%; min-height:520px; border:0; display:block;}
.hp-visit__cta{margin-top:26px;}

/* 15. email (text on dark) */
.hp-email{background:#d3e0cf;}
.hp-email__inner{max-width:760px; margin:0 auto; text-align:center;}
.hp-email .hp-eyebrow{color:var(--bronze) !important;} .hp-email h2{color:var(--navy) !important;}
.hp-email__p{color:var(--navy) !important; margin-top:14px; font-size:17px;}
.hp-email__form{margin-top:26px;}

/* MOBILE — 20px gutters everywhere, 2-up grids */
@media (max-width:767px){
  .hp-sec{padding:48px 0;}
  .hp-hero__grid{grid-template-columns:1fr; min-height:0;}
  .hp-hero__copy{padding:20px 0 36px; order:2;} /* tighter gap between image and title */
  .hp-hero__shot{order:1; min-height:0; height:auto;}
  .hp-hero__shot img{position:static; width:100%; height:auto; object-fit:contain;}
  .hp-hero__cta{flex-direction:column; align-items:stretch;} .hp-hero__cta .hp-btn{width:100%; text-align:center;}
  .hp-trust__grid{grid-template-columns:repeat(2,1fr); gap:22px 18px; padding:30px 0;}
  .hp-tiles{grid-template-columns:repeat(2,1fr); gap:14px; margin-top:30px;}
  .hp-dupe__grid{grid-template-columns:1fr; gap:32px; padding:48px 0;} .hp-dupe__art{order:-1;} .hp-chip{width:100%; text-align:center; box-sizing:border-box;}
  .hp-pill{padding:13px 20px; font-size:15px; min-height:46px;}
  .hp-founder__grid{grid-template-columns:1fr; gap:28px;} .hp-founder__photo{max-width:none; width:100%;} .hp-founder__cta .hp-btn{width:100%; text-align:center;}
  .hp-diff{grid-template-columns:1fr; gap:16px;} .hp-rgrid{grid-template-columns:1fr; gap:16px;} .hp-journal{grid-template-columns:1fr; gap:18px;}
  .hp-visit__grid{grid-template-columns:1fr;} .hp-visit__info{padding:34px 24px;} .hp-map iframe{min-height:320px;} .hp-visit__cta .hp-btn{width:100%; text-align:center;}
}
@media (min-width:768px) and (max-width:1024px){
  .hp-tiles{grid-template-columns:repeat(3,1fr);}
  .hp-diff,.hp-rgrid,.hp-journal{grid-template-columns:repeat(2,1fr);}
}


/* ============================================================
   FIDELITY OVERRIDES — force the mockup's colours & sizes so
   Booster's theme text styles can't override them. Added last +
   !important + .template--index specificity so these always win.
   ============================================================ */

/* headings — navy, Playfair, mockup size (desktop). Mobile scale is
   left to custom.css §1 clamps (this rule only applies from 768up). */
.template--index .hp-wrap h2{ color:var(--navy) !important; }
@media (min-width:768px){
  .template--index .hp-wrap h2{ font-size:2.75rem !important; line-height:1.15 !important; }
  .template--index .hp-visit__info h2{ font-size:2.125rem !important; } /* 34px */
}
.template--index .hp-dcard h3,
.template--index .hp-jcard h3{ color:var(--navy) !important; font-size:20px !important; }

/* eyebrows — bronze, uppercase, small */
.template--index .hp-eyebrow{ color:var(--bronze) !important; font-size:.9375rem !important; font-weight:700 !important; letter-spacing:.16em !important; text-transform:uppercase !important; }

/* ledes & body — secondary grey, mockup sizes */
.template--index .hp-lede{ color:var(--secondary) !important; font-size:20px !important; line-height:1.6 !important; }
.template--index .hp-hero__lede{ color:var(--secondary) !important; font-size:20px !important; line-height:1.6 !important; }
.template--index .hp-founder p{ color:var(--secondary) !important; font-size:20px !important; line-height:1.6 !important; }
.template--index .hp-dcard p{ color:var(--secondary) !important; font-size:15.5px !important; }
.template--index .hp-jcard p{ color:var(--secondary) !important; font-size:15px !important; }
.template--index .hp-trust__t{ color:var(--navy) !important; font-size:15px !important; }
.template--index .hp-trust__d{ color:var(--secondary) !important; font-size:13.5px !important; }
.template--index .hp-rev-sub{ color:var(--secondary) !important; }
.template--index .hp-cat{ color:var(--bronze) !important; }

/* links / accents */
.template--index .hp-hero__tag{ color:var(--gold-text) !important; background:transparent !important; }
.template--index .hp-textlink{ color:var(--bronze) !important; }
.template--index .hp-sig{ color:var(--navy) !important; }

/* visit block */
.template--index .hp-visit dt{ color:var(--bronze) !important; }
.template--index .hp-visit dd{ color:var(--navy) !important; }
.template--index .hp-num{ color:var(--navy) !important; }
.template--index .hp-cnt{ color:var(--secondary) !important; }
.template--index .hp-st{ color:#F5A623 !important; }

/* scent pills / concern chips — navy text */
.template--index .hp-pill,
.template--index .hp-cchip{ color:var(--navy) !important; }

/* INVERTED sections (on navy / dark) — placed last so they win */
.template--index .hp-dupe h2{ color:#fff !important; }
.template--index .hp-email h2{ color:var(--navy) !important; }
.template--index .hp-dupe .hp-eyebrow{ color:var(--footer-gold) !important; }
.template--index .hp-email .hp-eyebrow{ color:var(--bronze) !important; }
/* Founder eyebrow was rendering larger/different — pin it to match the others */
.template--index .hp-founder .hp-eyebrow{ font-size:.9375rem !important; font-weight:700 !important; letter-spacing:.16em !important; text-transform:uppercase !important; line-height:1.4 !important; font-family:'Inter',sans-serif !important; color:var(--bronze) !important; }
.template--index .hp-dupe__p{ color:rgba(255,255,255,.82) !important; font-size:20px !important; line-height:1.6 !important; }
.template--index .hp-email__p{ color:var(--navy) !important; font-size:17px !important; }
.template--index .hp-dupe .hp-chip{ color:#fff !important; }
.template--index .hp-dupe .hp-chip--primary{ color:var(--navy) !important; }
/* Secondary dupe buttons (Perfume oils / Perfume sprays) hover -> footer gold */
.template--index .hp-dupe .hp-chip:not(.hp-chip--primary):hover{ background:var(--footer-gold) !important; color:var(--navy) !important; border-color:var(--footer-gold) !important; }
/* "Shop by designer brand ->" textlink — gold on the navy dupe band */
.hp-dupe__find{ margin-top:30px; }
.template--index .hp-dupe .hp-textlink--gold{ color:var(--footer-gold) !important; border-bottom:1px solid var(--footer-gold); }
.template--index .hp-dupe .hp-textlink--gold:hover{ color:#fff !important; border-bottom-color:#fff; }

/* Shopify-native email form (Shopify Email — no Klaviyo needed) */
.hp-email__row{display:flex; gap:12px; justify-content:center; flex-wrap:wrap; margin-top:26px;}
.hp-email__row input[type="email"]{flex:0 1 340px; width:100%; max-width:360px; height:52px; background:#fff; border:1px solid var(--navy); border-radius:var(--radius-sm); padding:14px 17px; font-size:16px; color:var(--navy); font-family:inherit;}
.hp-email__row input[type="email"]:focus{outline:2px solid var(--gold);}
.hp-email__ok{color:var(--navy) !important; margin-top:20px; font-weight:600;}
@media (max-width:767px){
  .hp-email__row{flex-direction:column; align-items:stretch;}
  .hp-email__row input[type="email"]{ flex:0 0 auto; width:100%; max-width:none; height:52px; }
  .hp-email__row .hp-btn{width:100%; text-align:center;}
}


/* Mobile side gutter — line 34 zeroes .hp-wrap padding for desktop
   header/footer alignment, but on phones there's no theme gutter, so
   sections sat flush against the edges. Restore 20px each side (matches
   the collection pages). */
@media (max-width:767px){
  .template--index .hp-wrap{ box-sizing:border-box !important; padding-left:15px !important; padding-right:15px !important; }
}
/* Widen ONLY the grid column that was capping some sections at ~610px.
   Do NOT touch .s__content / .layout__content — that wrapper provides
   the desktop side gutter, and forcing it to 100% removed it. */
.template--index .shopify-section .s__block--liquidBlock{
  flex:0 0 100% !important;
  max-width:100% !important;
  width:100% !important;
  padding-left:0 !important;
  padding-right:0 !important;
}
.template--index .shopify-section .block__liquid{ width:100%; }
@media (max-width:767px){
  .hp-scent, .hp-concern{
    display:flex !important;
    flex-wrap:nowrap !important;
    justify-content:flex-start !important;
    overflow-x:auto;
    scroll-snap-type:x mandatory;
    -webkit-overflow-scrolling:touch;
    gap:12px;
    /* start at the 20px gutter, but leave ~48px of runway on the right
       so the next pill is clearly half-visible (the peek) */
    margin-left:-20px; margin-right:-20px;
    padding:4px 48px 4px 20px;
    scrollbar-width:none;
    scroll-padding-left:15px;
  }
  .hp-scent::-webkit-scrollbar,
  .hp-concern::-webkit-scrollbar{ display:none; }
  .hp-scent > *, .hp-concern > *{ scroll-snap-align:start; flex:0 0 auto; }

@media (max-width:767px){
  .hp-scent-wrap, .hp-concern-wrap{ position:relative; }
  .hp-scent-wrap::after, .hp-concern-wrap::after{
    content:"›";
    position:absolute; top:50%; right:6px; transform:translateY(-50%);
    width:30px; height:30px; border-radius:50%;
    background:#6E8F5C;                    /* natural green */
    color:#fff;
    font-size:20px; line-height:30px; text-align:center;
    box-shadow:0 2px 8px rgba(17,42,70,.18);
    pointer-events:none;
  }
}