/* Mobile-first CRO layer. Kept separate from the source design for easy A/B comparison. */
:root{--tap:44px;--safe-bottom:env(safe-area-inset-bottom,0px)}
.header-button,.close{min-width:var(--tap);min-height:var(--tap)}
.story-scroll-note{display:none;margin:10px 0 0;color:var(--an-muted);font-size:10px;letter-spacing:.04em}
.story-progress{display:none;height:2px;margin:2px 20px 0;background:var(--an-line);overflow:hidden}
.story-progress i{display:block;width:var(--story-progress,22%);height:100%;background:var(--an-logo-gold);transition:width .12s linear}
.mobile-buy-bar{display:none}
.product-card a,.product-card button,.filter-buttons a{touch-action:manipulation}

@media(max-width:760px){
  body{padding-bottom:0}
  #page{text-align:center}
  #page p{max-width:38rem;margin-left:auto;margin-right:auto}
  .heading,.page-hero,.hero-copy,.split-copy,.service-band>div,.review,.gift-packaging-copy,.content-page{text-align:center}
  .heading .section-title,.page-hero .display,.hero-copy .display,.split-copy .section-title,.service-band .section-title,.gift-packaging-copy .section-title{text-wrap:balance}
  .hero-copy>p:not(.kicker),.heading>p:last-child,.split-copy>p:not(.kicker),.service-band>div>p:not(.kicker){max-width:34rem}
  .top-note{font-size:8px;letter-spacing:.11em}
  .top-note button{min-height:29px;padding:0 3px}
  .header{height:72px;grid-template-columns:52px 1fr auto;padding-inline:8px 7px}
  .header.fixed{height:68px}
  .menu-trigger{justify-self:start}
  .wordmark{justify-self:center;min-width:0}
  .wordmark b{font-size:12px;letter-spacing:.09em;white-space:nowrap}
  .wordmark small{letter-spacing:.18em}
  .utility-nav{justify-self:end}
  .utility-nav .header-button{width:42px;padding:10px}
  .hero{height:calc(100svh - 101px);min-height:560px;max-height:820px}
  .hero-copy{left:20px;right:20px;bottom:68px;max-width:520px}
  .hero-copy .display{font-size:clamp(34px,10.2vw,46px);line-height:1.06}
  .hero-copy>p:not(.kicker){margin-bottom:23px;line-height:1.6}
  .hero-copy .btn{width:100%;max-width:330px;margin-inline:auto}
  .hero-nav{left:18px;right:18px;bottom:13px;justify-content:flex-end}
  .hero-nav button{min-width:var(--tap);min-height:var(--tap)}
  .assurances{gap:18px 0;padding:23px 16px}
  .assurance{justify-content:center;padding-inline:8px;min-width:0;text-align:left}
  .assurance i{flex:0 0 auto}
  .assurance b{font-size:10px}
  .assurance small{font-size:9px;line-height:1.3}
  .category-stories{padding-top:31px}
  .category-stories-head{padding-inline:20px}
  .story-scroll-note,.story-progress{display:block}
  .story-list{gap:16px;padding-inline:20px;scroll-padding-inline:20px;overscroll-behavior-inline:contain}
  .story-item{flex-basis:76px;min-width:76px}
  .story-ring{width:74px;height:74px}
  .story-ring:before,.story-image{width:66px;height:66px}
  .section{padding:64px 0}
  .heading{margin-bottom:30px;padding-inline:5px}
  .section-title{font-size:clamp(27px,8vw,38px)}
  .product-carousel{margin-right:calc((100vw - var(--page))/ -2);padding:2px calc((100vw - var(--page))/2) 18px 0;gap:12px;scroll-padding-left:0}
  .product-carousel .product-card{min-width:min(76vw,310px)}
  .quick{position:static;width:100%;height:44px;transform:none;background:var(--an-ink)}
  .product-media{display:flex;flex-direction:column;overflow:visible;background:transparent}
  .product-media>button:first-of-type{position:relative;aspect-ratio:1;background:var(--an-ivory)}
  .product-media>button:first-of-type img{position:absolute;inset:0}
  .product-meta{padding-top:13px;min-height:92px;align-items:center;text-align:center}
  .product-meta h3{font-size:13px}
  .product-meta small,.product-meta h3,.product-meta p{width:100%;text-align:center}
  .category-tiles{gap:12px}
  .category-tile{aspect-ratio:4/5}
  .category-tile div{min-height:76px;align-items:center;text-align:center}
  .category-tile h3,.category-tile small,.category-tile span{width:100%;text-align:center}
  .split-story figure{height:min(118vw,520px)}
  .service-band{gap:45px}
  .service-steps article{padding-block:18px 2px;text-align:center}
  .service-steps p{margin-inline:auto}
  .review{padding:28px 24px}
  .review blockquote{margin-inline:auto}
  .collection-tools{position:sticky;top:68px;z-index:20;margin-inline:calc((100vw - var(--page))/ -2);margin-bottom:24px;padding:10px max(12px,calc((100vw - var(--page))/2));background:rgba(252,249,243,.97);box-shadow:0 8px 20px rgba(58,31,18,.05)}
  .filter-buttons{gap:22px;padding-bottom:11px;scrollbar-width:none}
  .filter-buttons::-webkit-scrollbar{display:none}
  .filter-buttons a{display:flex;align-items:center;min-height:36px}
  .sort-select{min-height:44px;padding:10px 4px 7px}
  .collection-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:30px 12px}
  .page-hero{padding:48px 0 28px}
  .page-hero .display{font-size:clamp(32px,10vw,44px)}
  .breadcrumbs{line-height:1.6;margin-bottom:18px}
  .product-gallery{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:8px;margin-right:calc((100vw - var(--page))/ -2);padding-right:16px;scrollbar-width:none}
  .product-gallery::-webkit-scrollbar{display:none}
  .product-gallery img{min-width:88vw;scroll-snap-align:start}
  .product-summary{padding-bottom:92px}
  .product-summary h1{font-size:clamp(29px,9vw,40px)}
  .product-summary{text-align:center}
  .option-group,.product-benefits,.breadcrumbs{text-align:left}
  .chips{justify-content:center}
  .chips button{min-height:44px}
  .product-benefits summary{min-height:44px;display:flex;align-items:center}
  .mobile-buy-bar{position:fixed;z-index:65;left:0;right:0;bottom:0;display:flex;align-items:center;justify-content:space-between;gap:14px;padding:10px 14px calc(10px + var(--safe-bottom));background:rgba(252,249,243,.98);border-top:1px solid var(--an-line);box-shadow:0 -10px 30px rgba(58,31,18,.08)}
  .mobile-buy-bar div{display:grid;gap:2px}.mobile-buy-bar small{font-size:8px;color:var(--an-muted);text-transform:uppercase;letter-spacing:.1em}.mobile-buy-bar strong{font-size:13px;white-space:nowrap}.mobile-buy-bar .btn{min-height:48px;padding-inline:22px}
  .side-menu{padding:58px 24px calc(30px + var(--safe-bottom));overflow-y:auto}
  .side-menu>a{min-height:44px;display:flex;align-items:center}
  .side-menu>div a{min-height:38px;display:flex;align-items:center}
  .cart-foot{padding:18px 18px calc(18px + var(--safe-bottom))}
  .panel-content{padding-inline:18px}
  .cart-line{grid-template-columns:72px minmax(0,1fr) auto;gap:11px}
  .cart-line img{width:72px;height:72px}
  .cart-line strong{font-size:10px}
  .search{padding:38px 18px;max-height:100svh}
  .form-card input,.form-card textarea,.form-card select{font-size:16px}
  .content-page{padding-top:58px}
  .content-page>p,.content-page>h2{text-align:center}
  .content-page>ul,.content-page>ol{display:inline-block;max-width:38rem;padding-left:1.3rem;text-align:left}
  .form-card,.form-card p,.form-card h2,.faq-list,.faq-list p,.faq-list summary{text-align:left}
  .confirmation,.confirmation p,.confirmation h2{text-align:center}
  .packaging-details article{text-align:left}
  .footer{gap:35px 24px;text-align:center}
  .footer .wordmark{justify-content:center}
  .footer>div>a:not(.wordmark){min-height:32px;display:flex;align-items:center;justify-content:center;margin-block:4px}
  .footer-news label{text-align:left}
}

@media(max-width:359px){
  :root{--page:calc(100vw - 24px)}
  .wordmark .sigil{width:30px;height:30px}.wordmark b{font-size:10px}.wordmark small{display:none}
  .utility-nav .header-button{width:38px;padding:9px}
  .hero-copy{left:16px;right:16px}.hero-copy .display{font-size:32px}
  .assurances{grid-template-columns:1fr;padding-inline:14px}.assurance{border-right:0;border-bottom:1px solid var(--an-line);padding:0 4px 13px}.assurance:last-child{border-bottom:0}
  .category-tiles,.collection-grid{grid-template-columns:1fr}
  .category-tile{aspect-ratio:4/3}
  .collection-grid{gap:36px}
  .product-gallery img{min-width:91vw}
  .mobile-buy-bar .btn{padding-inline:17px}
}

@media(min-width:761px) and (max-width:1100px){
  :root{--page:calc(100vw - 48px)}
  .header{padding-inline:24px}
  .hero{min-height:650px}
  .category-stories{padding-inline:24px}
  .story-list{gap:clamp(22px,4vw,55px)}
  .collection-grid,.product-carousel{grid-template-columns:repeat(3,1fr)}
  .product-layout{gap:36px}
  .product-summary{top:90px}
  .footer{grid-template-columns:1.4fr repeat(3,1fr);gap:28px}
}

@media(hover:none){.product-card:hover,.category-tile:hover,.btn:hover{transform:none;filter:none;box-shadow:none}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.story-progress i{transition:none}}

/* Final mobile grid pass: one axis, one rhythm and predictable card geometry. */
@media(max-width:820px){
  :root{--mobile-gutter:clamp(16px,4.7vw,28px);--mobile-section:clamp(58px,14vw,82px);--mobile-copy:min(100%,38rem)}
  #page{width:100%;overflow:clip;text-align:center}
  #page :where(h1,h2,h3,p,blockquote){overflow-wrap:anywhere}
  #page :where(.heading,.page-hero,.content-page,.split-copy,.gift-packaging-copy){width:100%;max-width:42rem;margin-left:auto;margin-right:auto}
  #page :where(.heading,.page-hero,.hero-copy,.split-copy,.service-band>div,.review,.gift-packaging-copy){text-align:center}
  #page :where(.heading,.page-hero,.hero-copy,.split-copy,.service-band>div,.review,.gift-packaging-copy)>:where(p,h1,h2,h3,blockquote){margin-left:auto;margin-right:auto}
  #page :where(.display,.section-title,.page-hero h1,.product-summary h1){text-wrap:balance}
  #page :where(.heading>p:last-child,.page-hero>p:last-child,.hero-copy>p:not(.kicker),.split-copy>p:not(.kicker),.service-band>div>p:not(.kicker),.gift-packaging-copy>p:not(.kicker)){width:var(--mobile-copy);line-height:1.7}
  .section{width:calc(100% - var(--mobile-gutter)*2);padding-block:var(--mobile-section)}
  .heading{margin-bottom:clamp(30px,8vw,46px);padding-inline:0}
  .heading .kicker{margin-bottom:11px}
  .heading .section-title{margin-bottom:14px}
  .hero-copy{display:flex;flex-direction:column;align-items:center}
  .hero-slide:after{background:linear-gradient(0deg,rgba(42,26,18,.78) 0%,rgba(42,26,18,.28) 63%,rgba(42,26,18,.08) 100%)}
  .hero-copy>p:not(.kicker){color:rgba(255,255,255,.94)}
  .assurances{width:100%;grid-template-columns:repeat(2,minmax(0,1fr));gap:0;padding:0 var(--mobile-gutter);align-items:stretch}
  .assurance{display:grid;grid-template-rows:28px auto;place-items:start center;align-content:center;gap:8px;min-width:0;min-height:118px;padding:18px 12px;border:0;border-right:1px solid var(--an-line);border-bottom:1px solid var(--an-line);text-align:center}
  .assurance:nth-child(2n){border-right:0}
  .assurance:nth-last-child(-n+2){border-bottom:0}
  .assurance i{display:grid;width:28px;height:28px;place-items:center;margin:0;font-size:20px;line-height:1}
  .assurance span{display:grid;grid-template-rows:1.35em 2.6em;align-items:start;min-width:0;width:100%;text-align:center}
  .assurance b,.assurance small{width:100%;margin:0;text-align:center}
  .assurance b{line-height:1.35}
  .assurance small{display:flex;align-items:flex-start;justify-content:center;line-height:1.3}
  .category-stories-head{max-width:38rem;margin-inline:auto}
  .story-item{align-items:center;text-align:center}
  .story-item strong{width:100%;line-height:1.25}
  .category-tiles,.collection-grid{align-items:stretch}
  .category-tile{height:100%}
  .category-tile div{left:12px;right:12px;bottom:16px;justify-content:flex-end}
  .category-tile :where(small,h3,span){margin-left:auto;margin-right:auto;text-align:center}
  .product-card{height:100%;align-self:stretch}
  .product-media>button:first-of-type{width:100%}
  .product-meta{display:grid;grid-template-rows:auto minmax(2.8em,auto) auto;align-content:start;justify-items:center;width:100%;min-height:112px;padding:14px 4px 0;text-align:center}
  .product-meta :where(small,h3,p){width:100%;margin-left:auto;margin-right:auto;text-align:center}
  .product-meta h3{display:flex;align-items:center;justify-content:center;margin-block:6px;line-height:1.4}
  .product-meta p{align-self:end;margin-top:4px}
  .product-carousel .product-meta{min-height:105px}
  .split-copy{align-items:center;padding-inline:var(--mobile-gutter)}
  .service-band{padding-inline:var(--mobile-gutter)}
  .service-band .btn{align-self:center;margin-inline:auto}
  .service-steps{width:100%;max-width:38rem;margin-inline:auto}
  .service-steps article{text-align:center}
  .reviews{align-items:stretch}
  .review{display:flex;min-height:100%;flex-direction:column;align-items:center;justify-content:center}
  .review blockquote{max-width:32rem}
  .review p{margin-top:auto}
  .gift-packaging-copy{align-items:center;padding-inline:var(--mobile-gutter)}
  .packaging-details{width:100%;max-width:34rem}
  .packaging-details article{align-items:start;text-align:left}
  .packaging-details article :where(h3,p){text-align:left;margin-left:0;margin-right:0}
  .collection-layout,.product-page,.wishlist-page{width:calc(100% - var(--mobile-gutter)*2)}
  .page-hero{width:calc(100% - var(--mobile-gutter)*2)}
  .filter-buttons{align-items:center}
  .filter-buttons a{justify-content:center}
  .sort-select{text-align:center;text-align-last:center}
  .product-summary{text-align:center}
  .product-summary>.kicker,.product-summary>h1,.product-summary>.product-price,.product-summary>.product-copy{margin-left:auto;margin-right:auto}
  .product-summary>.product-copy{max-width:38rem}
  .product-summary :where(.option-group,.product-benefits){text-align:left}
  .option-group>span{text-align:center}
  .chips{justify-content:center}
  .content-page{width:calc(100% - var(--mobile-gutter)*2);padding-inline:0}
  .content-page>.display{text-align:center}
  .content-page>p,.content-page>h2{max-width:38rem;margin-left:auto;margin-right:auto;text-align:center}
  .form-card{width:100%;max-width:42rem;margin-left:auto;margin-right:auto;text-align:left}
  .form-card :where(label,input,select,textarea){text-align:left}
  .faq-list{width:100%;max-width:42rem;margin-inline:auto;text-align:left}
  .faq-list :where(summary,p){text-align:left;margin-left:0;margin-right:0}
  .confirmation{text-align:center}
  .confirmation :where(h2,p){text-align:center}
  .footer{padding-inline:var(--mobile-gutter);text-align:center;align-items:start}
  .footer>div{min-width:0}
  .footer h3,.footer p,.footer-floor span{text-align:center}
  .footer .wordmark{justify-content:center;margin-inline:auto}
  .footer-news{width:100%;max-width:38rem;margin-inline:auto}
  .footer-floor{justify-items:center;width:100%;text-align:center}
}

@media(max-width:359px){
  :root{--mobile-gutter:12px}
  .product-meta{min-height:104px}
  .footer{grid-template-columns:1fr}
  .assurances{grid-template-columns:1fr}
  .assurance{grid-template-columns:28px minmax(0,1fr);grid-template-rows:auto;place-items:center start;min-height:82px;border-right:0;border-bottom:1px solid var(--an-line);text-align:left}
  .assurance:nth-last-child(2){border-bottom:1px solid var(--an-line)}
  .assurance:last-child{border-bottom:0}
  .assurance span{grid-template-rows:auto auto;text-align:left}
  .assurance b,.assurance small{justify-content:flex-start;text-align:left}
}

@media(min-width:821px){
  .assurances{align-items:stretch}
  .assurance{min-width:0;min-height:82px;padding:12px 18px}
  .assurance span{min-width:0}
}

@media(min-width:360px) and (max-width:760px){
  .collection-grid>.product-card{display:grid;grid-template-rows:auto 1fr}
  .collection-grid .quick{margin-top:0}
}

/* Gap-painted assurance rules: every divider is owned by the grid, so no edge
   disappears when the column count changes at a breakpoint. */
.assurances{
  --assurance-line:rgba(107,58,21,.22);
  gap:1px;
  padding:1px 0;
  border:0;
  background:var(--assurance-line);
}
.assurance{
  border:0!important;
  background:var(--an-paper);
}

/* Footer typography uses one centred axis at every viewport size. */
.footer,.footer>div,.footer h3,.footer p,.footer a,.footer-floor,.footer-floor span{
  text-align:center;
}
.footer>div{
  min-width:0;
  justify-items:center;
}
.footer .wordmark{
  width:max-content;
  max-width:100%;
  margin-left:auto;
  margin-right:auto;
  justify-content:center;
}
.footer>div>a:not(.wordmark){
  width:max-content;
  max-width:100%;
  margin-left:auto;
  margin-right:auto;
}
.footer-news{
  justify-self:center;
  width:100%;
  max-width:34rem;
}
.footer-news label{
  align-items:center;
}
.footer-news input{
  text-align:center;
  padding-left:36px;
}
.footer-news button{
  width:36px;
  flex:0 0 36px;
}
.footer-floor{
  display:grid;
  grid-template-columns:1fr 1.45fr 1fr;
  align-items:stretch;
  gap:0;
  margin-top:8px;
  padding-top:0;
  border-top:1px solid rgba(107,58,21,.18);
  background:rgba(252,249,243,.5);
  font-size:9px;
  line-height:1.55;
  letter-spacing:.1em;
}
.footer-floor span{
  display:flex;
  min-width:0;
  min-height:62px;
  padding:16px 22px;
  align-items:center;
  justify-content:center;
  border-left:1px solid rgba(107,58,21,.14);
  text-wrap:balance;
  overflow-wrap:anywhere;
}
.footer-floor span:first-child{border-left:0}

@media(max-width:999px){
  .footer-news input{padding-left:32px}
  .footer-floor{grid-template-columns:1fr;width:100%;max-width:42rem;margin-left:auto;margin-right:auto;font-size:9px}
  .footer-floor span{width:100%;min-height:48px;padding:13px 16px;border-left:0;border-top:1px solid rgba(107,58,21,.12)}
  .footer-floor span:first-child{border-top:0}
}

@media(max-width:359px){
  .footer-floor{font-size:8px;letter-spacing:.08em}
  .footer-floor span{padding-inline:10px}
}
