/* Requested homepage refinements: warm yellow header, soft cards, glass menu and kinetic wordmark. */
:root{--funffy-refine-yellow:#fcc226;--funffy-refine-cream:#faf8f2;--funffy-refine-ink:#17140f}

.clean-header{
  background:var(--funffy-refine-yellow)!important;
  border:0!important;
  box-shadow:0 39px 0 var(--funffy-refine-yellow)!important;
}
.primary-nav{
  background:var(--funffy-refine-yellow)!important;
  border:0!important;
  box-shadow:none!important;
}
.primary-nav a{border:0!important}
.clean-header .primary-nav a.is-current::after{
  right:0!important;
  left:0!important;
  background:var(--funffy-refine-ink)!important;
  transform:scaleX(1)!important;
  transform-origin:center!important;
}
.mobile-menu a.is-current{color:#9c7000!important;font-weight:800!important}
.header-logo,.header-logo .wordmark-crop{background:transparent!important;border:0!important}

.brand-promises{
  gap:clamp(12px,2vw,28px)!important;
  padding:clamp(20px,3vw,38px) clamp(18px,4vw,68px)!important;
  border:0!important;
  background:var(--funffy-refine-cream)!important;
}
.brand-promises article{
  min-height:150px!important;
  padding:clamp(28px,3.2vw,48px)!important;
  border:0!important;
  border-radius:30px;
  background:rgba(255,255,255,.72);
  box-shadow:0 18px 50px rgba(54,43,20,.07);
}
.brand-promises article:last-child{border:0!important}

.menu-backdrop{
  position:fixed;
  inset:0;
  z-index:110;
  width:100%;
  height:100%;
  padding:0;
  border:0;
  background:rgba(20,16,10,.16);
  -webkit-backdrop-filter:blur(12px) saturate(.9);
  backdrop-filter:blur(12px) saturate(.9);
  cursor:pointer;
}
.menu-backdrop[hidden]{display:none}
.side-menu{
  color:var(--funffy-refine-ink)!important;
  background:rgba(250,248,242,.72)!important;
  border:1px solid rgba(255,255,255,.68)!important;
  border-left:0!important;
  box-shadow:22px 0 80px rgba(17,14,9,.22)!important;
  -webkit-backdrop-filter:blur(28px) saturate(1.2);
  backdrop-filter:blur(28px) saturate(1.2);
}
.side-menu-head{border:0!important}
.side-menu-head button,.side-menu>a{color:var(--funffy-refine-ink)!important}
.side-menu>a{border:0!important}
.side-menu>a:hover{color:#9c7000!important}
body.menu-open{overflow:hidden}

.fluffy-word-marquee{
  position:relative;
  overflow:hidden;
  padding:clamp(46px,6.5vw,96px) 0;
  background:var(--funffy-refine-cream);
}
.fluffy-word-track{
  display:flex;
  width:max-content;
  align-items:center;
  gap:0;
  animation:fluffyWordRun 28s linear infinite;
  will-change:transform;
}
.fluffy-word-group{
  display:flex;
  flex:0 0 auto;
  align-items:center;
  gap:clamp(22px,3vw,54px);
  padding-right:clamp(22px,3vw,54px);
}
.fluffy-word-group span{
  color:var(--funffy-refine-ink);
  font-size:clamp(66px,9.1vw,150px);
  font-weight:650;
  line-height:.86;
  letter-spacing:-.065em;
  white-space:nowrap;
}
.fluffy-pet-gallery{
  display:flex;
  flex:0 0 auto;
  align-items:center;
  gap:clamp(12px,1.25vw,22px);
}
.fluffy-word-group figure{
  position:relative;
  width:clamp(92px,9.5vw,158px);
  aspect-ratio:1;
  flex:0 0 auto;
  overflow:hidden;
  margin:0;
  border-radius:24px;
  transform:none;
  box-shadow:0 12px 30px rgba(28,21,11,.12);
}
.fluffy-word-group img{width:100%;height:100%;object-fit:cover}
.fluffy-word-group figure.focus-top img{object-position:center top}
.fluffy-word-group figure.focus-bottom img{object-position:center bottom}
.fluffy-word-group figure.focus-contain{background:#f1ece2}
.fluffy-word-group figure.focus-contain img{object-fit:contain;object-position:center}
@keyframes fluffyWordRun{to{transform:translateX(-50%)}}

/* Let the photo fill the whole hero and use continuous tonal overlays instead of a colour block. */
.new-hero{isolation:isolate;margin-top:-1px;background:#f4efe5!important}
.new-hero>.hero-panorama{inset:0!important;width:100%!important;height:100%!important;max-width:none!important;object-fit:cover!important;object-position:center bottom!important;animation:none!important}
.new-hero>.hero-family-layer{
  inset:auto -1% 0 auto!important;
  width:auto!important;
  height:104%!important;
  max-width:none!important;
  object-fit:contain!important;
  object-position:right bottom!important;
  animation:none!important;
  -webkit-mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.04) 10%,rgba(0,0,0,.2) 24%,rgba(0,0,0,.58) 38%,#000 54%);
  mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.04) 10%,rgba(0,0,0,.2) 24%,rgba(0,0,0,.58) 38%,#000 54%);
}
.new-hero-shade{
  background:linear-gradient(90deg,rgba(19,14,7,.68) 0%,rgba(19,14,7,.54) 24%,rgba(19,14,7,.34) 43%,rgba(19,14,7,.13) 61%,rgba(19,14,7,0) 82%)!important;
}
.new-hero::before{
  content:""!important;
  position:absolute!important;
  inset:-24px 0 0!important;
  z-index:1!important;
  pointer-events:none!important;
  opacity:1!important;
  background:linear-gradient(to bottom,rgba(252,194,38,.98) 0%,rgba(252,194,38,.8) 10%,rgba(252,194,38,.5) 23%,rgba(252,194,38,.23) 38%,rgba(252,194,38,.07) 51%,transparent 66%)!important;
  box-shadow:none!important;
  filter:blur(12px)!important;
  transform:scale(1.015)!important;
}
.new-hero::after{display:none!important}
.new-hero-copy{width:min(820px,92vw)!important}
.new-hero-copy .eyebrow{color:#17140f!important;text-shadow:0 1px 12px rgba(252,194,38,.48)}
.new-hero h1{display:grid;max-width:none!important;gap:.16em;font-size:clamp(52px,5.2vw,78px)!important;line-height:.94!important;letter-spacing:-.058em!important}
.new-hero h1>span{display:block;white-space:nowrap}
.new-hero-copy>div .button{border:1px solid rgba(255,255,255,.55)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.32),0 14px 38px rgba(15,11,6,.14);-webkit-backdrop-filter:blur(18px) saturate(1.18);backdrop-filter:blur(18px) saturate(1.18)}
.new-hero-copy>div .button-dark{background:rgba(18,15,11,.58)!important;color:#fff!important}
.new-hero-copy>div .button-cream{background:rgba(255,255,255,.48)!important;color:#17140f!important}

/* Each ritual bar enters decisively from the left as the scroll progress reaches it. */
.ritual-steps article{
  opacity:0!important;
  transform:translate3d(-110px,0,0) scale(.985)!important;
  transition:opacity .72s cubic-bezier(.2,.75,.2,1),transform .82s cubic-bezier(.16,1,.3,1),background .45s ease,box-shadow .45s ease!important;
  will-change:transform,opacity;
}
.ritual-steps article.active{
  opacity:1!important;
  transform:translate3d(0,0,0) scale(1)!important;
  background:rgba(255,255,255,.92)!important;
  box-shadow:0 18px 46px rgba(55,39,4,.12);
}
.ritual-steps article:nth-child(2){transition-delay:.08s!important}
.ritual-steps article:nth-child(3){transition-delay:.08s!important}
.ritual-progress{display:none!important}
.scroll-ritual h2{max-width:100%!important;font-size:clamp(46px,4.2vw,60px)!important;line-height:.94!important;letter-spacing:-.058em!important}
.scroll-ritual h2>span{display:block;white-space:nowrap}

/* One flowing editorial collage instead of two boxed entry cards. */
.home-warm-strip{overflow:hidden!important}
.home-warm-strip .warm-heading{display:block!important}
.home-warm-strip .warm-heading>div{max-width:1120px}
.home-warm-strip .warm-heading h2{margin:0!important}
.home-warm-strip .warm-heading h2>span{display:block;white-space:nowrap}
.home-warm-strip .warm-heading p{max-width:620px;margin:24px 0 0!important;color:#655d52;font-size:17px!important;line-height:1.65!important}
.home-warm-grid{
  position:relative!important;
  display:block!important;
  min-height:clamp(620px,60vw,820px)!important;
  margin-top:clamp(34px,5vw,70px);
  padding:0 clamp(8px,2vw,26px);
}
.home-warm-grid figure{
  position:absolute!important;
  min-height:0!important;
  margin:0!important;
  overflow:hidden!important;
  border:0!important;
  box-shadow:none!important;
  isolation:isolate;
  background:#eee6d9;
}
.home-warm-grid figure::before{
  content:"";
  position:absolute;
  inset:-9%;
  z-index:-1;
  background:center/cover no-repeat;
  filter:blur(32px) saturate(.9);
  opacity:.68;
  transform:scale(1.08);
}
.home-warm-grid figure:first-child::before{background-image:url("assets/warm-homecoming.webp")}
.home-warm-grid figure:nth-child(2)::before{background-image:url("assets/elderly-woman-cat-golden-retriever.webp")}
.home-warm-grid figure:first-child{
  left:1%!important;
  top:0!important;
  width:66%!important;
  height:76%!important;
  border-radius:48px 120px 48px 48px!important;
  transform:none!important;
}
.home-warm-grid figure:nth-child(2){
  right:1%!important;
  bottom:0!important;
  width:49%!important;
  height:68%!important;
  border-radius:54% 54% 40px 40px!important;
  transform:rotate(1.8deg)!important;
  box-shadow:-28px 26px 65px rgba(29,22,10,.18)!important;
  z-index:2;
}
.home-warm-grid img{
  width:100%!important;
  height:100%!important;
  position:relative;
  z-index:1;
  object-fit:contain!important;
  transform:none!important;
  filter:saturate(.96) contrast(1.02);
}
.home-warm-grid figure:first-child img{object-position:center center!important}
.home-warm-grid figure:nth-child(2) img{object-position:center center!important}
.home-warm-grid figcaption{
  z-index:3;
  inset:auto 28px 28px!important;
  width:auto!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  color:#fff!important;
  background:transparent!important;
  box-shadow:none!important;
  text-shadow:0 2px 18px rgba(0,0,0,.7);
}
.home-warm-grid figcaption b{font-size:clamp(20px,2vw,30px)!important}
.home-warm-grid figcaption span{color:#fff!important;font-size:15px!important}

/* Translucent cream glass on the homepage FAQ. */
.home-faq{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  background:
    radial-gradient(circle at 78% 22%,rgba(252,194,38,.22),transparent 34%),
    radial-gradient(circle at 18% 80%,rgba(252,194,38,.12),transparent 30%),
    var(--funffy-refine-cream)!important;
}
.home-faq::before{
  content:"";
  position:absolute;
  inset:5% 2%;
  z-index:-1;
  border-radius:44px;
  background:rgba(255,255,255,.18);
  filter:blur(20px);
}
.home-faq-list details{
  border:1px solid rgba(255,255,255,.72)!important;
  background:rgba(255,255,255,.48)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.86),0 18px 46px rgba(45,34,12,.09)!important;
  -webkit-backdrop-filter:blur(24px) saturate(1.15);
  backdrop-filter:blur(24px) saturate(1.15);
}
.home-faq-list details[open]{background:rgba(255,250,234,.62)!important}
.home-faq-list summary::after{background:rgba(23,20,15,.9)!important;box-shadow:0 8px 20px rgba(23,20,15,.14)}

.footer-logo .wordmark-crop img{
  filter:none!important;
  opacity:1!important;
}

.product-route-hero .product-route-packshot{
  object-fit:contain!important;
  object-position:center!important;
  padding:clamp(18px,2vw,34px)!important;
  background:rgba(255,255,255,.74)!important;
}

@media(max-width:900px){
  .clean-header{box-shadow:none!important}
  .brand-promises{grid-template-columns:1fr!important;padding:16px!important}
  .brand-promises article{min-height:0!important;border:0!important}
  .fluffy-word-track{animation-duration:29s}
  .home-warm-grid{min-height:920px!important;padding:0!important}
  .home-warm-grid figure:first-child{left:0!important;width:92%!important;height:56%!important;border-radius:36px 80px 36px 36px!important}
  .home-warm-grid figure:nth-child(2){right:0!important;width:78%!important;height:50%!important;border-radius:48% 48% 30px 30px!important}
}
@media(max-width:620px){
  .fluffy-word-marquee{padding:42px 0}
  .fluffy-word-group{gap:18px;padding-right:18px}
  .fluffy-pet-gallery{gap:10px}
  .fluffy-word-group span{font-size:56px}
  .fluffy-word-group figure{width:78px;border-radius:16px}
  .home-warm-grid{min-height:760px!important}
  .home-warm-grid figure:first-child{width:96%!important;height:52%!important}
  .home-warm-grid figure:nth-child(2){width:84%!important;height:48%!important}
  .home-warm-grid figcaption{inset:auto 18px 20px!important}
  .scroll-ritual h2{font-size:clamp(43px,12vw,56px)!important;line-height:.96!important}
  .scroll-ritual h2>span{white-space:normal}
  .new-hero h1{font-size:clamp(43px,11.5vw,54px)!important}
  .new-hero h1>span:first-child{white-space:nowrap}
  .new-hero h1>span:nth-child(2){max-width:340px;white-space:normal}
  .new-hero>.hero-panorama{display:none!important}
  .new-hero>.hero-family-layer{inset:0!important;width:100%!important;height:100%!important;object-fit:cover!important;object-position:80% bottom!important;-webkit-mask-image:none!important;mask-image:none!important}
  .new-hero-shade{background:linear-gradient(0deg,rgba(18,13,7,.82) 0%,rgba(18,13,7,.47) 43%,rgba(18,13,7,.10) 72%,rgba(18,13,7,0) 100%)!important}
  .home-warm-strip .warm-heading h2>span{white-space:normal}
}
@media(prefers-reduced-motion:reduce){
  .fluffy-word-track{animation:fluffyWordRun 29s linear infinite!important}
}

/* Formula story — cream glass with soft mustard light, never poster-like. */
.native-info{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  margin:clamp(26px,4vw,72px) clamp(18px,3.5vw,66px)!important;
  padding:clamp(56px,6vw,104px) clamp(28px,5vw,92px)!important;
  border:1px solid rgba(255,255,255,.76);
  border-radius:clamp(32px,4vw,58px);
  background:
    radial-gradient(circle at 88% 14%,rgba(252,194,38,.34),transparent 34%),
    radial-gradient(circle at 8% 92%,rgba(252,194,38,.17),transparent 31%),
    linear-gradient(118deg,rgba(255,255,255,.68),rgba(255,248,220,.52) 55%,rgba(255,239,166,.48))!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.95),
    0 28px 80px rgba(76,55,12,.10);
  -webkit-backdrop-filter:blur(30px) saturate(1.16);
  backdrop-filter:blur(30px) saturate(1.16);
}
.native-info::before,
.native-info::after{
  content:"";
  position:absolute;
  z-index:-1;
  pointer-events:none;
  border-radius:50%;
  filter:blur(38px);
}
.native-info::before{
  width:min(42vw,620px);
  aspect-ratio:1;
  right:-12%;
  top:-34%;
  background:rgba(252,194,38,.23);
}
.native-info::after{
  width:min(34vw,470px);
  aspect-ratio:1;
  left:-13%;
  bottom:-44%;
  background:rgba(255,220,107,.18);
}
.native-info .section-heading{
  position:relative;
  z-index:2;
  align-items:end;
  gap:clamp(28px,5vw,86px);
  margin-bottom:clamp(36px,4vw,62px);
}
.native-info .section-heading h2{
  max-width:900px;
  text-wrap:balance;
}
.native-info .section-heading>p{
  max-width:470px;
  padding:18px 22px;
  border:1px solid rgba(255,255,255,.72);
  border-radius:22px;
  background:rgba(255,255,255,.34);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.82);
  -webkit-backdrop-filter:blur(18px);
  backdrop-filter:blur(18px);
}
.native-info .ingredient-cards{
  position:relative;
  z-index:2;
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:clamp(14px,1.4vw,24px);
  border:0!important;
}
.native-info .ingredient-cards article{
  position:relative;
  overflow:hidden;
  min-height:310px;
  padding:clamp(28px,2.7vw,46px)!important;
  border:1px solid rgba(255,255,255,.78)!important;
  border-radius:30px;
  background:linear-gradient(145deg,rgba(255,255,255,.58),rgba(255,250,232,.32))!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.94),
    0 20px 48px rgba(66,48,10,.09);
  -webkit-backdrop-filter:blur(26px) saturate(1.12);
  backdrop-filter:blur(26px) saturate(1.12);
  transition:box-shadow .38s ease,border-color .38s ease;
}
.native-info .ingredient-cards article::before{
  content:attr(data-ingredient-index);
  position:absolute;
  right:18px;
  top:-8px;
  color:rgba(255,255,255,.16);
  font-size:clamp(92px,8vw,144px);
  font-weight:800;
  line-height:1;
  letter-spacing:-.08em;
  -webkit-text-stroke:1px rgba(151,106,0,.16);
  pointer-events:none;
}
.native-info .ingredient-cards article::after{
  content:"";
  position:absolute;
  inset:auto -42px -58px auto;
  width:170px;
  height:170px;
  border-radius:50%;
  background:radial-gradient(circle,rgba(252,194,38,.22),rgba(252,194,38,0) 68%);
  pointer-events:none;
}
.native-info .ingredient-index{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:48px;
  height:48px;
  border:1px solid rgba(151,106,0,.22);
  border-radius:50%;
  background:rgba(252,194,38,.18);
  color:#17130d;
  font-size:12px!important;
  font-weight:800;
  letter-spacing:.08em;
}
.native-info .ingredient-orb{
  position:relative;
  width:78px;
  height:78px;
  margin:24px 0 22px;
  border:1px solid rgba(255,255,255,.88);
  border-radius:50%;
  background:
    radial-gradient(circle at 35% 28%,rgba(255,255,255,.9),transparent 29%),
    linear-gradient(145deg,rgba(252,194,38,.30),rgba(255,255,255,.28));
  box-shadow:inset 0 0 24px rgba(255,255,255,.55),0 12px 30px rgba(173,121,0,.12);
}
.native-info .ingredient-orb i{
  position:absolute;
  width:12px;
  height:12px;
  border:2px solid rgba(124,87,0,.62);
  border-radius:50%;
  background:rgba(255,250,228,.92);
}
.native-info .ingredient-orb i::after{
  content:"";
  position:absolute;
  left:8px;
  top:4px;
  width:25px;
  height:1px;
  background:rgba(124,87,0,.34);
  transform-origin:left center;
}
.native-info .ingredient-orb i:nth-child(1){left:16px;top:18px}
.native-info .ingredient-orb i:nth-child(1)::after{transform:rotate(26deg)}
.native-info .ingredient-orb i:nth-child(2){left:44px;top:31px}
.native-info .ingredient-orb i:nth-child(2)::after{width:19px;transform:rotate(75deg)}
.native-info .ingredient-orb i:nth-child(3){left:27px;top:50px}
.native-info .ingredient-orb i:nth-child(3)::after{width:21px;transform:rotate(-92deg)}
.native-info .ingredient-orb i:nth-child(4){left:51px;top:55px}
.native-info .ingredient-orb i:nth-child(4)::after{display:none}
.native-info .ingredient-dmg .ingredient-orb{transform:rotate(21deg)}
.native-info .ingredient-lactoferrin .ingredient-orb{border-radius:42% 42% 52% 52%}
.native-info .ingredient-cards h3{
  position:relative;
  z-index:1;
  max-width:320px;
  margin:0 0 14px!important;
  font-size:clamp(25px,2vw,34px)!important;
  line-height:1.08;
}
.native-info .ingredient-cards p{
  position:relative;
  z-index:1;
  max-width:350px;
  margin:0;
  color:#5f584d!important;
  font-size:clamp(16px,1.2vw,19px);
  line-height:1.55;
}
@media(hover:hover){
  .native-info .ingredient-cards article:hover{
    border-color:rgba(252,194,38,.52)!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.98),0 26px 58px rgba(119,82,0,.15);
  }
}
@media(max-width:900px){
  .native-info{margin:22px 16px!important;padding:54px 24px!important;border-radius:34px}
  .native-info .section-heading{align-items:start}
  .native-info .ingredient-cards{grid-template-columns:1fr}
  .native-info .ingredient-cards article{min-height:245px}
  .native-info .section-heading>p{max-width:620px}
}
@media(max-width:620px){
  .native-info{margin:16px 10px!important;padding:42px 16px!important;border-radius:28px}
  .native-info .section-heading{gap:20px;margin-bottom:28px}
  .native-info .section-heading>p{padding:15px 17px;border-radius:18px}
  .native-info .ingredient-cards article{min-height:228px;padding:24px!important;border-radius:24px}
  .native-info .ingredient-orb{width:66px;height:66px;margin:18px 0}
  .native-info .ingredient-orb i:nth-child(1){left:12px;top:14px}
  .native-info .ingredient-orb i:nth-child(2){left:38px;top:24px}
  .native-info .ingredient-orb i:nth-child(3){left:23px;top:42px}
  .native-info .ingredient-orb i:nth-child(4){left:43px;top:46px}
}
@media(prefers-reduced-motion:reduce){
  .native-info .ingredient-cards article{transition:none}
}

/* Daily ritual artwork: large, open presentation with no boxed poster frame. */
.product-ritual{
  grid-template-columns:minmax(0,.88fr) minmax(420px,1.08fr)!important;
  gap:clamp(12px,2.8vw,48px)!important;
}
.product-ritual .scroll-ritual-stage{
  min-height:clamp(610px,49vw,780px)!important;
  margin-right:clamp(-100px,-5vw,-42px);
  place-items:center;
}
.product-ritual .ritual-card{
  width:min(760px,56vw)!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
}
.product-ritual .ritual-card img{
  width:100%!important;
  height:auto!important;
  display:block;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  filter:drop-shadow(0 30px 38px rgba(84,58,5,.12));
}
.product-ritual .ritual-drop{display:none!important}
.product-ritual .ritual-orbit{
  width:min(62vw,760px)!important;
  border-color:rgba(120,87,10,.09)!important;
}
@media(max-width:900px){
  .product-ritual{grid-template-columns:1fr!important;gap:14px!important}
  .product-ritual .scroll-ritual-stage{
    min-height:clamp(430px,94vw,700px)!important;
    margin:0 -24px -34px!important;
  }
  .product-ritual .ritual-card{width:min(760px,102vw)!important}
  .product-ritual .ritual-orbit{width:min(108vw,720px)!important}
}
@media(max-width:620px){
  .product-ritual .scroll-ritual-stage{min-height:390px!important;margin:0 -28px -30px!important}
  .product-ritual .ritual-card{width:112vw!important}
}