/* =========================================================
   TOKENS
   ========================================================= */
:root{
  --plum:        #2A2118;
  --plum-deep:   #1C160F;
  --cream:       #FBF3E6;
  --coral:       #C1622E;
  --coral-deep:  #9C4C22;
  --mustard:     #D9A44C;
  --sage:        #8CA377;
  --sage-deep:   #6C8560;
  --pink-accent:      #E8637E;
  --pink-accent-deep: #C94764;
  --purple-accent:      #8C5BA6;
  --purple-accent-deep: #6F4380;

  --display: 'Fraunces', serif;
  --body:    'Space Grotesk', sans-serif;
  --mono:    'JetBrains Mono', monospace;

  --radius-lg: 28px;
  --radius-md: 18px;
  --radius-sm: 10px;

  --ease: cubic-bezier(.16,.84,.44,1);
}

*{ box-sizing: border-box; }
html{ scroll-behavior: smooth; }

body{
  margin:0;
  background: var(--plum);
  color: var(--cream);
  font-family: var(--body);
  font-size: 17px;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}

h1,h2,h3{
  font-family: var(--display);
  margin: 0;
  line-height: 1.05;
  letter-spacing: -0.01em;
}

p{ margin: 0; }
ul{ margin:0; padding:0; list-style:none; }
a{ color: inherit; text-decoration: none; }

@media (prefers-reduced-motion: reduce){
  *{ animation: none !important; transition: none !important; }
  html{ scroll-behavior: auto; }
}

/* grain texture overlay for warmth/texture */
.grain{
  position: fixed; inset:0; pointer-events:none; z-index: 999;
  opacity: .05; mix-blend-mode: overlay;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* =========================================================
   NAV
   ========================================================= */
.nav{
  position: sticky; top:0; z-index: 100;
  display:flex; align-items:center; justify-content:space-between;
  padding: 22px 6vw;
  background: rgba(43,27,52,.72);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid rgba(255,246,233,.08);
}
.nav__mark{
  font-family: var(--display);
  font-weight: 700; font-size: 1.4rem;
}
.nav__mark .dot{ color: var(--coral); }
.nav__links{ display:flex; align-items:center; gap: 2.2rem; }
.nav__links a{
  font-family: var(--mono); font-size: .82rem; letter-spacing: .03em;
  text-transform: uppercase; opacity: .85;
  transition: opacity .2s var(--ease);
}
.nav__links a:hover{ opacity: 1; color: var(--coral); }
.nav__links a.is-active{ opacity: 1; color: var(--coral); border-bottom: 1px solid var(--coral); padding-bottom: 2px; }
.mobile-menu a.is-active{ opacity: 1; color: var(--coral); }
.nav__cta{
  background: var(--coral); color: var(--plum-deep) !important;
  padding: 9px 18px; border-radius: 999px; font-weight: 700;
  opacity: 1 !important;
}
.nav__cta:hover{ background: var(--mustard); }

.nav__burger{
  display:none; flex-direction:column; gap:5px; background:none; border:none; cursor:pointer; padding: 6px;
}
.nav__burger span{ width: 22px; height: 2px; background: var(--cream); display:block; }

.mobile-menu{
  display:none; flex-direction:column; position: sticky; top: 69px; z-index: 99;
  background: var(--plum-deep); padding: 1.2rem 6vw; gap: 1rem;
  border-bottom: 1px solid rgba(255,246,233,.1);
}
.mobile-menu a{ font-family: var(--mono); text-transform: uppercase; font-size: .85rem; }
.mobile-menu.open{ display:flex; }

@media (max-width: 780px){
  .nav__links{ display:none; }
  .nav__burger{ display:flex; }
}

/* =========================================================
   HERO
   ========================================================= */
.hero{
  position: relative;
  padding: 6.5rem 6vw 5rem;
  display:flex; flex-direction:column; align-items:flex-start;
  overflow:hidden;
}
.hero__blob{
  position:absolute; border-radius: 50%; filter: blur(60px); opacity:.5; z-index:0;
}
.hero__blob--pink{ width:420px; height:420px; background: var(--coral); top:-140px; right:-100px; }
.hero__blob--yellow{ width:280px; height:280px; background: var(--mustard); bottom:-80px; left:-60px; opacity:.35; }
.hero__blob--sage{ width:220px; height:220px; background: var(--sage); top:40%; right:12%; opacity:.28; }

.eyebrow{
  font-family: var(--mono); text-transform: uppercase; font-size: .78rem;
  letter-spacing: .08em; color: var(--mustard); margin-bottom: 1.1rem; z-index:1;
}
.eyebrow--center{ text-align:center; width:100%; }

.hero__title{
  font-size: clamp(2.6rem, 6.4vw, 5.2rem);
  font-weight: 900; z-index:1;
  max-width: 14ch;
}
.hero__title-em{
  font-style: italic; font-weight: 600; color: var(--coral);
}
.hero__sub{
  margin-top: 1.6rem; max-width: 46ch; font-size: 1.15rem; opacity:.88; z-index:1;
}
.hero__actions{
  margin-top: 2.3rem; display:flex; gap: 1rem; flex-wrap:wrap; z-index:1;
}

.btn{
  font-family: var(--mono); text-transform: uppercase; font-size: .8rem;
  letter-spacing: .04em; padding: 14px 26px; border-radius: 999px;
  display:inline-block; font-weight: 700; transition: transform .25s var(--ease), background .25s var(--ease);
  border: 2px solid transparent; cursor:pointer; background: transparent;
}
.btn--primary{ background: var(--coral); color: var(--plum-deep); }
.btn--primary:hover{ background: var(--mustard); transform: translateY(-2px); }
.btn--ghost{ border-color: var(--cream); color: var(--cream); }
.btn--ghost:hover{ border-color: var(--coral); color: var(--coral); transform: translateY(-2px); }
.btn--outline-light{ border-color: rgba(255,246,233,.4); color: var(--cream); }
.btn--disabled{ opacity: .55; cursor: default; }
.btn--disabled:hover{ transform:none; }

/* flip hero card */
.hero__card{
  margin-top: 3.5rem; width: min(380px, 90vw); height: 220px;
  perspective: 1200px; cursor:pointer; z-index:1; align-self:flex-end;
}
.hero__card-inner{
  position: relative; width:100%; height:100%; transition: transform .7s var(--ease);
  transform-style: preserve-3d;
}
.hero__card.flipped .hero__card-inner{ transform: rotateY(180deg); }
.hero__card-face{
  position:absolute; inset:0; backface-visibility: hidden;
  border-radius: var(--radius-lg); padding: 1.6rem;
  display:flex; flex-direction:column; gap:.6rem;
  box-shadow: 0 20px 40px rgba(0,0,0,.25);
}
.hero__card-front{ background: var(--mustard); color: var(--plum-deep); justify-content:space-between; }
.hero__card-back{ background: var(--coral); color: var(--plum-deep); transform: rotateY(180deg); justify-content:center; }
.hero__card-label{ font-family: var(--mono); font-size: .72rem; text-transform:uppercase; letter-spacing:.06em; opacity:.7; }
.hero__card-icon{ font-size: 2.2rem; }
.hero__card-question{ font-family: var(--display); font-weight:700; font-size: 1.25rem; }
.hero__card-back p{ font-family: var(--body); font-weight:500; font-size: 1.05rem; }

/* =========================================================
   INTRO STRIP
   ========================================================= */
.intro{
  padding: 3rem 6vw; border-top: 1px solid rgba(255,246,233,.1);
  border-bottom: 1px solid rgba(255,246,233,.1);
}
.intro p{
  max-width: 62ch; margin: 0 auto; text-align:center;
  font-family: var(--display); font-size: 1.35rem; font-weight: 500;
  font-style: italic; opacity: .92;
}

/* =========================================================
   BRAND BLOCKS
   ========================================================= */
.brand-block{ padding: 6rem 6vw; }
.brand-block--dark{ background: var(--plum-deep); }

.brand-block__tag{ margin-bottom: 2.4rem; }
.tag-label{
  font-family: var(--mono); font-size: .78rem; text-transform:uppercase;
  letter-spacing:.08em; color: var(--sage); border: 1px solid var(--sage);
  padding: 6px 14px; border-radius: 999px;
}
.tag-label--light{ color: var(--mustard); border-color: var(--mustard); }

.brand-block__grid{
  display:grid; grid-template-columns: 1.15fr .85fr; gap: 4rem; align-items:center;
}
.brand-block__grid--reverse{ grid-template-columns: .85fr 1.15fr; }
.brand-block__grid--reverse .brand-block__copy{ order:2; }
.brand-block__grid--reverse .tales-deck{ order:1; }

.brand-block__copy h2{
  font-size: clamp(2.1rem, 4vw, 3rem); font-weight: 800;
}
.brand-block__copy h2.light{ color: var(--mustard); }
.tm{ font-size: .5em; vertical-align: super; }
.services-h2-sub{ font-style: italic; font-weight: 500; opacity: .75; }

.brand-block__lede{
  margin-top: 1.2rem; font-size: 1.08rem; max-width: 52ch; opacity:.88;
}
.brand-block__lede.light{ opacity:.82; }

.brand-block__list{
  margin-top: 1.8rem; display:flex; flex-direction:column; gap: 1rem; max-width: 52ch;
}
.brand-block__list li{
  padding-left: 1.4rem; position:relative; font-size: .98rem; opacity:.9;
}
.brand-block__list li::before{
  content:"-"; position:absolute; left:0; color: var(--coral);
}
.brand-block__grid--reverse .brand-block__list li::before{ color: var(--mustard); }

.brand-block__copy .btn{ margin-top: 2.2rem; }
.cookbook-cta{ display:flex; align-items:center; gap: 1rem; flex-wrap:wrap; margin-top: 2.2rem; }
.cookbook-cta .btn{ margin-top: 0; }

.kitchen-resources__heading{
  margin-top: 2.6rem; font-size: 1.05rem; font-weight: 700; color: var(--cream); opacity:.92;
}
.kitchen-resources__note{
  margin-top: 1rem; font-size: .92rem; opacity:.8;
}
.kitchen-resources__note a{ color: var(--sage); text-decoration: underline; }

@media (max-width: 480px){
  .cookbook-cta{ flex-direction:column; align-items:stretch; }
  .cookbook-cta .btn{ text-align:center; }
}

.stock-notice{
  margin-top: 1.8rem; padding: 1.4rem 1.6rem; border-radius: var(--radius-md);
  background: rgba(255,246,233,.05); border: 1px solid rgba(255,246,233,.14);
  max-width: 46ch;
}
.stock-notice__text{ font-size: .88rem; opacity:.85; line-height:1.55; }
.stock-notice__form{
  margin-top: 1rem; display:flex; gap: .7rem; flex-wrap:wrap;
}
.stock-notice__input{
  font-family: var(--body); font-size: .92rem; padding: 10px 16px; border-radius: 999px;
  border: 2px solid rgba(255,246,233,.25); background: rgba(255,246,233,.06); color: var(--cream);
  flex: 1 1 200px; min-width: 180px;
}
.stock-notice__input::placeholder{ color: rgba(255,246,233,.5); }
.stock-notice__input:focus{ outline:none; border-color: var(--coral); }
.stock-notice__form .btn{ margin-top: 0; padding: 10px 20px; font-size: .74rem; }

/* recipe card */
.recipe-card{
  background: var(--cream); color: var(--plum-deep);
  border-radius: var(--radius-lg); padding: 2.4rem;
  transform: rotate(-2deg);
  box-shadow: 0 24px 50px rgba(0,0,0,.3);
}
.recipe-card__eyebrow{
  font-family: var(--mono); font-size: .75rem; text-transform:uppercase;
  letter-spacing:.06em; color: var(--coral-deep); font-weight:700;
}
.recipe-card h3{
  margin-top: .6rem; font-size: 1.7rem; font-weight: 800;
}
.recipe-card__sub{
  display:block; margin-top: .3rem; opacity:.7; font-style:italic;
}
.recipe-card__tags{
  margin-top: 1.3rem; display:flex; flex-wrap:wrap; gap: .5rem;
}
.recipe-card__tags span{
  background: var(--sage); color: var(--plum-deep);
  font-family: var(--mono); font-size: .7rem; text-transform:uppercase;
  padding: 5px 11px; border-radius: 999px; font-weight:700;
}
.recipe-card__note{
  margin-top: 1.3rem; font-size: .92rem; opacity:.75; line-height:1.5;
}

/* feed recipes */
.feed-recipes{
  margin-top: 4.5rem; padding-top: 3.5rem; border-top: 1px solid rgba(255,246,233,.1);
}
.feed-recipes__eyebrow{
  font-family: var(--mono); font-size: .75rem; text-transform:uppercase; letter-spacing:.08em;
  color: var(--sage);
}
.feed-recipes__title{
  margin-top: .6rem; font-size: clamp(1.4rem, 2.6vw, 1.9rem); font-weight: 700; max-width: 28ch;
}
.feed-recipes__grid{
  margin-top: 2rem; display:grid; grid-template-columns: repeat(3, 1fr); gap: 1.2rem;
}
.feed-card{
  background: rgba(255,246,233,.05); border: 1px solid rgba(255,246,233,.14);
  border-radius: var(--radius-md); padding: 1.5rem;
  transition: border-color .25s var(--ease), transform .25s var(--ease);
}
.feed-card:hover{ border-color: var(--coral); transform: translateY(-3px); }
.feed-card h4{
  font-family: var(--display); font-size: 1.05rem; font-weight: 700; line-height:1.3;
}
.feed-card__sub{
  margin-top: .3rem; font-size: .85rem; opacity:.75; font-style: italic;
}
.feed-card .recipe-card__tags{ margin-top: .9rem; }
.feed-card .recipe-card__tags span{ background: var(--sage); color: var(--plum-deep); }

.feed-recipes__follow{
  margin-top: 2rem; font-family: var(--mono); font-size: .82rem; opacity:.8;
}
.feed-recipes__follow a{ color: var(--coral); }
.feed-recipes__follow a:hover{ color: var(--mustard); }

@media (max-width: 780px){
  .feed-recipes__grid{ grid-template-columns: 1fr; }
}

/* recipe carousel image galleries (from the feed) */
.recipe-carousels{
  margin-top: 3rem; display:flex; flex-direction:column; gap: 2.2rem;
}
.recipe-carousel__title{
  font-size: 1rem; font-weight:700; margin-bottom: .8rem;
}
.recipe-carousel__track{
  display:flex; gap: 1rem; overflow-x:auto; padding-bottom: .6rem;
  scroll-snap-type: x proximity; -webkit-overflow-scrolling: touch;
}
.recipe-carousel__track::-webkit-scrollbar{ height: 6px; }
.recipe-carousel__track::-webkit-scrollbar-thumb{ background: rgba(42,33,24,.2); border-radius: 999px; }
.recipe-carousel__track img{
  flex: 0 0 auto; width: 200px; aspect-ratio: 4 / 5; object-fit: cover;
  border-radius: var(--radius-md); scroll-snap-align: center;
  box-shadow: 0 10px 24px rgba(0,0,0,.18);
}

@media (max-width: 540px){
  .recipe-carousel__track img{ width: 168px; }
}

/* services / directory card */
.services-card{
  background: var(--cream); color: var(--plum-deep);
  border-radius: var(--radius-lg); padding: 2.4rem;
  transform: rotate(2deg);
  box-shadow: 0 24px 50px rgba(0,0,0,.3);
}
.services-card__eyebrow{
  font-family: var(--mono); font-size: .75rem; text-transform:uppercase;
  letter-spacing:.06em; color: var(--sage-deep); font-weight:700;
}
.services-card__list{
  margin-top: 1.2rem; display:flex; flex-direction:column; gap: .9rem;
  padding-top: 1rem; border-top: 1px solid rgba(43,27,52,.12);
}
.services-card__list li{
  display:flex; justify-content:space-between; align-items:baseline; gap: 1rem;
}
.services-card__label{
  font-family: var(--display); font-weight: 700; font-size: 1.05rem;
}
.services-card__meta{
  font-family: var(--mono); font-size: .82rem; white-space:nowrap; opacity:.75;
}
.services-card__details{
  margin-top: 1.4rem; padding-top: 1.2rem; border-top: 1px solid rgba(43,27,52,.12);
  display:flex; flex-direction:column; gap: .4rem; font-size: .92rem;
}
.services-card__note{
  margin-top: 1.3rem; font-size: .85rem; opacity:.7; line-height:1.5;
}
.services-card__notice{
  margin-top: .8rem; font-size: .85rem; font-weight:700; color: var(--coral);
  background: rgba(193,98,46,.1); border: 1px solid rgba(193,98,46,.3);
  border-radius: var(--radius-sm); padding: 8px 12px; display:inline-block;
}

/* PMHSS card */
.pmhss-card{
  background: var(--cream); color: var(--plum-deep);
  border-radius: var(--radius-lg); padding: 2.4rem;
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap: 1.4rem;
  min-height: 260px; box-shadow: 0 24px 50px rgba(0,0,0,.3);
}
.pmhss-card__badge{
  font-family: var(--mono); font-size: .68rem; text-transform:uppercase; letter-spacing:.06em;
  background: var(--sage); color: var(--plum-deep); padding: 5px 12px; border-radius: 999px; font-weight:700;
}
.pmhss-card__rings{ display:flex; gap: .7rem; }
.pmhss-card__rings span{
  width: 46px; height: 46px; border-radius: 50%;
  display:flex; align-items:center; justify-content:center;
  font-family: var(--display); font-weight:800; font-size: 1.1rem;
  border: 2px solid var(--plum-deep);
}
.pmhss-card__rings span:nth-child(1){ background: var(--pink-accent); }
.pmhss-card__rings span:nth-child(2){ background: var(--mustard); }
.pmhss-card__rings span:nth-child(3){ background: var(--sage); }
.pmhss-card__rings span:nth-child(4){ background: var(--pink-accent); opacity:.75; }
.pmhss-card__rings span:nth-child(5){ background: var(--mustard); opacity:.75; }
.pmhss-card__caption{ font-family: var(--mono); font-size: .78rem; opacity:.7; }

.disclaimer-note{
  margin-top: 1.2rem; font-size: .82rem; opacity:.65; max-width: 48ch; line-height: 1.6;
}

/* clinicians resource library */
.clinicians__heading{ font-size: clamp(2rem, 3.8vw, 2.8rem); font-weight:800; max-width: 20ch; }
.clinicians__sub{ margin-top: 1rem; max-width: 60ch; }

.resource-grid{
  margin-top: 3rem; display:grid; grid-template-columns: repeat(2, 1fr); gap: 1.4rem;
}
.resource-card{
  background: rgba(255,246,233,.05); border: 1px solid rgba(255,246,233,.14);
  border-radius: var(--radius-md); padding: 1.8rem; display:flex; flex-direction:column; gap: .8rem;
  transition: border-color .25s var(--ease), transform .25s var(--ease);
}
.resource-card:hover{ border-color: var(--mustard); transform: translateY(-3px); }
.resource-card__badge{
  font-family: var(--mono); font-size: .68rem; text-transform:uppercase; letter-spacing:.06em;
  color: var(--mustard); border: 1px solid var(--mustard); padding: 3px 10px; border-radius: 999px;
  width: fit-content;
}
.resource-card h3{ font-size: 1.2rem; font-weight: 700; }
.resource-card p{ font-size: .9rem; opacity:.82; line-height:1.55; }
.resource-card__cta{
  margin-top: auto; font-family: var(--mono); font-size: .76rem; text-transform:uppercase;
  letter-spacing:.03em; color: var(--coral); font-weight:700;
}
.resource-card:hover .resource-card__cta{ color: var(--mustard); }

.resource-card__actions{
  margin-top: auto; display:flex; align-items:center; justify-content:space-between; gap: 1rem;
}
.resource-card__price{
  font-family: var(--display); font-weight: 800; font-size: 1.3rem; color: var(--mustard);
}
.resource-card__buy{
  font-family: var(--mono); font-size: .76rem; text-transform:uppercase; letter-spacing:.03em;
  font-weight:700; background: var(--coral); color: var(--plum-deep);
  padding: 9px 18px; border-radius: 999px; transition: background .2s var(--ease);
}
.resource-card__buy:hover{ background: var(--mustard); }

@media (max-width: 780px){
  .resource-grid{ grid-template-columns: 1fr; }
}

.resource-group__heading{
  margin-top: 3.4rem; margin-bottom: -1.4rem; font-size: 1.1rem; font-weight: 800;
  text-transform: uppercase; letter-spacing: .04em; color: var(--mustard);
}
.resource-group__heading.light{ color: var(--mustard); }
.resource-grid + .resource-group__heading{ margin-top: 3.4rem; }

/* Adventures headings sit above plain text/cards, not a .resource-grid, so they need normal spacing below them instead of the negative pull-up used in Resources */
#adventures .resource-group__heading{ margin-bottom: .8rem; }

/* clinician directory Payhip CTA */
.directory-transparency{
  margin-top: 1.2rem; max-width: 34rem; font-size: .88rem; opacity:.75; line-height:1.55;
}
.directory-submit-btn{ margin-top: 1.6rem; }

/* clinician directory tabs */
.directory-tabs{
  display:flex; gap: .6rem; margin-top: 2rem; border-bottom: 1px solid rgba(255,246,233,.16);
}
.directory-tab{
  font-family: var(--body); font-size: .95rem; font-weight:700; color: var(--cream); opacity:.55;
  background: none; border: none; border-bottom: 3px solid transparent;
  padding: .8rem .2rem; cursor:pointer; transition: opacity .2s var(--ease), border-color .2s var(--ease);
}
.directory-tab:hover{ opacity:.8; }
.directory-tab.is-active{ opacity:1; border-bottom-color: var(--coral); }

.directory-panel{ margin-top: 1.6rem; max-width: 40rem; }
.directory-panel__lede{ font-size: .96rem; opacity:.85; margin-bottom: .4rem; line-height:1.55; }

.directory-listing{ margin-top: 1.4rem; display:flex; flex-direction:column; gap: 1.2rem; }
.directory-listing__empty{
  font-size: .92rem; opacity:.7; font-style:italic; line-height:1.6;
}
.directory-listing-card{
  background: rgba(255,246,233,.05); border: 1px solid rgba(255,246,233,.16);
  border-radius: var(--radius-md); padding: 1.4rem 1.7rem;
}
.directory-listing-card h4{ font-size: 1.05rem; margin-bottom: .2rem; }
.directory-listing-card__location{
  font-family: var(--mono); font-size: .76rem; text-transform:uppercase; letter-spacing:.04em;
  color: var(--sage); margin-bottom: .5rem;
}
.directory-listing-card p:not(.directory-listing-card__location){ font-size: .92rem; opacity:.85; line-height:1.5; }

/* Auntie's Adventures */
.adventure-card{
  margin-top: 2.6rem; max-width: 34rem; display:flex; gap: 1.6rem; align-items:flex-start;
  background: rgba(255,246,233,.05); border: 1px solid rgba(255,246,233,.16);
  border-radius: var(--radius-md); padding: 1.8rem 2rem;
}
.adventure-card__date{
  flex: 0 0 auto; width: 72px; text-align:center; background: var(--coral);
  border-radius: var(--radius-sm); padding: .7rem 0; color: var(--cream);
}
.adventure-card__month{
  display:block; font-family: var(--mono); font-size: .74rem; letter-spacing:.08em;
  text-transform:uppercase; opacity:.9;
}
.adventure-card__day{
  display:block; font-family: var(--display); font-size: 1.8rem; font-weight:800; line-height:1.1;
}
.adventure-card__body h3{ font-size: 1.15rem; margin-bottom: .4rem; }
.adventure-card__body p{ font-size: .92rem; opacity:.82; margin-bottom: .3rem; line-height:1.5; }
.adventure-card__note{ opacity:.7 !important; font-size: .86rem !important; margin-bottom: 1.1rem !important; }

@media (max-width: 540px){
  .adventure-card{ flex-direction:column; }
  .adventure-card__date{ width: fit-content; padding: .5rem 1rem; }
}

/* Auntie's Adventures: photo carousel */
.adventure-gallery{
  margin-top: 2rem; max-width: 100%; overflow: hidden; position: relative;
}
.adventure-gallery__track{
  display:flex; gap: 1.2rem; overflow-x: auto; scroll-snap-type: x proximity;
  padding: .5rem .2rem 1.2rem; -webkit-overflow-scrolling: touch;
}
.adventure-gallery__track::-webkit-scrollbar{ height: 6px; }
.adventure-gallery__track::-webkit-scrollbar-thumb{ background: rgba(43,31,20,.2); border-radius: 999px; }
.adventure-gallery__img{
  flex: 0 0 auto; width: 320px; aspect-ratio: 4 / 3; object-fit: cover;
  border-radius: var(--radius-md); scroll-snap-align: center;
  box-shadow: 0 12px 28px rgba(0,0,0,.18);
}
.adventure-gallery__note{
  margin-top: .6rem; font-family: var(--mono); font-size: .84rem; opacity: .7;
}
@media (max-width: 540px){
  .adventure-gallery__img{ width: 240px; }
}

/* GeniTALES deck visual */
.tales-deck{
  position:relative; height: 320px; display:flex; align-items:center; justify-content:center;
}
.tales-deck__card{
  position:absolute; width: 180px; height: 250px; border-radius: var(--radius-md);
  display:flex; align-items:center; justify-content:center;
  font-family: var(--display); font-size: 3.5rem; font-weight:800;
  box-shadow: 0 20px 40px rgba(0,0,0,.35);
}
.tales-deck__card--1{ background: var(--pink-accent); color: var(--plum-deep); transform: rotate(-9deg) translateX(-40px); z-index:1; }
.tales-deck__card--2{ background: var(--mustard); color: var(--plum-deep); transform: rotate(4deg); z-index:2; }
.tales-deck__card--3{ background: var(--sage); color: var(--plum-deep); transform: rotate(14deg) translateX(46px); z-index:1; font-size:2.4rem; }

.tales-deck--photo{ height: auto; }
.tales-deck__photo{
  width: 100%; max-width: 340px; border-radius: var(--radius-md);
  box-shadow: 0 25px 50px rgba(0,0,0,.4); display:block; margin: 0 auto;
}

.tales-title{ color: var(--purple-accent) !important; }
.tag-label--tales{ color: var(--purple-accent); border-color: var(--purple-accent); }

@media (max-width: 900px){
  .brand-block__grid, .brand-block__grid--reverse{
    grid-template-columns: 1fr; gap: 3rem;
  }
  .brand-block__grid--reverse .brand-block__copy{ order:1; }
  .brand-block__grid--reverse .tales-deck{ order:2; }
  .recipe-card, .services-card{ transform:none; }
}

/* =========================================================
   WISDOM / FLIP CARDS
   ========================================================= */
.wisdom{ padding: 6rem 6vw; text-align:center; }
.wisdom__title{
  font-size: clamp(1.8rem, 3.4vw, 2.6rem); font-weight: 800; max-width: 24ch;
  margin: 0 auto 3.4rem;
}
.wisdom__grid{
  display:grid; grid-template-columns: repeat(4, 1fr); gap: 1.6rem;
  max-width: 1100px; margin: 0 auto;
}
.flip-card{ height: 200px; perspective: 1100px; cursor:pointer; text-align:left; }
.flip-card__inner{
  position:relative; width:100%; height:100%; transition: transform .6s var(--ease);
  transform-style: preserve-3d;
}
.flip-card.is-flipped .flip-card__inner,
.flip-card:hover .flip-card__inner,
.flip-card:focus-visible .flip-card__inner{ transform: rotateY(180deg); }
@media (hover: none){
  /* Touchscreens: tap toggles the .is-flipped class via JS instead of :hover,
     which doesn't behave reliably on touch. */
  .flip-card:hover .flip-card__inner{ transform: none; }
  .flip-card.is-flipped .flip-card__inner{ transform: rotateY(180deg); }
}
.flip-card__face{
  position:absolute; inset:0; backface-visibility:hidden; border-radius: var(--radius-md);
  padding: 1.5rem; display:flex; flex-direction:column; justify-content:space-between;
}
.flip-card__front{ background: rgba(255,246,233,.06); border: 1px solid rgba(255,246,233,.15); }
.flip-card__back{
  background: var(--sage); color: var(--plum-deep); transform: rotateY(180deg);
  justify-content:center;
}
.flip-card__icon{ font-size: 1.8rem; }
.flip-card__front p{ font-family: var(--display); font-weight:600; font-size: 1.1rem; }
.flip-card__back p{ font-weight:500; font-size: .98rem; }

@media (max-width: 900px){
  .wisdom__grid{ grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 540px){
  .wisdom__grid{ grid-template-columns: 1fr; }
}

/* =========================================================
   DID YOU KNOW / REELS
   ========================================================= */
.reels{
  padding: 6rem 0 5rem; text-align:center; background: var(--plum-deep);
  overflow: hidden;
}
.reels .brand-block__tag,
.reels__heading, .reels__sub{ padding-left: 6vw; padding-right: 6vw; }
.reels__heading{
  font-size: clamp(1.8rem, 3.4vw, 2.6rem); font-weight: 800; max-width: 20ch;
  margin: 0 auto;
}
.reels__sub{
  max-width: 46ch; margin: 1rem auto 0; opacity:.8; font-size: 1rem;
}
.reels__track{
  margin-top: 3rem; display:flex; gap: 1.4rem; overflow-x: auto;
  scroll-snap-type: x proximity; padding: .5rem 6vw 1.5rem;
  -webkit-overflow-scrolling: touch;
}
.reels__track::-webkit-scrollbar{ height: 6px; }
.reels__track::-webkit-scrollbar-thumb{ background: rgba(255,246,233,.2); border-radius: 999px; }

.reel-card{
  position: relative; flex: 0 0 auto; width: 240px; aspect-ratio: 9 / 16;
  border-radius: var(--radius-md); overflow: hidden; scroll-snap-align: center;
  background: var(--plum); border: 1px solid rgba(255,246,233,.12);
  cursor: pointer;
}
.reel-card__video{
  position:absolute; inset:0; width:100%; height:100%; object-fit: cover;
}
.reel-card__sound{
  position:absolute; top: .7rem; right: .7rem; z-index: 2;
  width: 34px; height: 34px; border-radius: 50%; border: none;
  background: rgba(28,22,15,.55); color: var(--cream); font-size: .95rem;
  display:flex; align-items:center; justify-content:center;
  backdrop-filter: blur(4px);
}
.reel-card__caption{
  position:absolute; left:0; right:0; bottom:0; z-index: 1;
  padding: 1.1rem 1rem 1rem; text-align:left;
  background: linear-gradient(180deg, rgba(28,22,15,0) 0%, rgba(28,22,15,.85) 65%);
}
.reel-card__eyebrow{
  display:block; font-family: var(--mono); font-size: .68rem; text-transform:uppercase;
  letter-spacing:.05em; color: var(--sage); margin-bottom: .35rem;
}
.reel-card__caption p{
  font-family: var(--body); font-size: .86rem; font-weight:500; color: var(--cream);
  line-height: 1.35;
}
.reel-card.is-playing .reel-card__caption{ opacity:.55; }
.reel-card:focus-visible{ outline: 2px solid var(--sage); outline-offset: 2px; }

.reels__follow{
  margin-top: 2.4rem; padding: 0 6vw; font-family: var(--mono); font-size: .82rem; opacity:.8;
}
.reels__follow a{ color: var(--sage); }

@media (max-width: 540px){
  .reel-card{ width: 200px; }
}

/* =========================================================
   NEWSLETTER
   ========================================================= */
.newsletter{
  padding: 6rem 6vw; text-align:center; background: var(--plum-deep);
  border-top: 1px solid rgba(255,246,233,.08); border-bottom: 1px solid rgba(255,246,233,.08);
}
.newsletter__inner{ max-width: 640px; margin: 0 auto; }
.newsletter__title{
  font-size: clamp(1.8rem, 3.6vw, 2.6rem); font-weight: 800; margin: 0 auto;
}
.newsletter__sub{
  margin-top: 1rem; opacity:.8; font-size: 1rem;
}
.newsletter__form{
  margin-top: 2.2rem; display:flex; gap: .8rem; justify-content:center; flex-wrap:wrap;
}
.newsletter__input{
  font-family: var(--body); font-size: 1rem; padding: 14px 20px; border-radius: 999px;
  border: 2px solid rgba(255,246,233,.25); background: rgba(255,246,233,.06); color: var(--cream);
  min-width: 280px; flex: 1 1 280px; max-width: 360px;
}
.newsletter__input::placeholder{ color: rgba(255,246,233,.5); }
.newsletter__input:focus{ outline:none; border-color: var(--coral); }
.newsletter__form .btn{ border:none; }

@media (max-width: 540px){
  .newsletter__input{ min-width: 100%; max-width: none; }
}

/* =========================================================
   CONTACT
   ========================================================= */
.contact{
  position:relative; padding: 7rem 6vw; text-align:center; overflow:hidden;
  background: linear-gradient(180deg, var(--plum) 0%, var(--plum-deep) 100%);
}
.contact__blob{
  position:absolute; width:500px; height:500px; border-radius:50%;
  background: var(--coral); filter: blur(90px); opacity:.25;
  top:-200px; left:50%; transform:translateX(-50%);
}
.contact__title{
  position:relative; font-size: clamp(1.9rem, 4vw, 2.8rem); font-weight:800;
  max-width: 22ch; margin: 0 auto;
}
.contact__sub{
  position:relative; margin-top: 1rem; opacity:.8; font-size: 1.05rem;
}
.contact__email{
  position:relative; display:inline-block; margin-top: 2rem;
  font-family: var(--display); font-weight:700; font-size: clamp(1.4rem, 3vw, 2rem);
  color: var(--mustard); border-bottom: 2px solid var(--mustard); padding-bottom: 4px;
  transition: color .2s var(--ease), border-color .2s var(--ease);
}
.contact__email:hover{ color: var(--coral); border-color: var(--coral); }

.contact__socials{
  position:relative; margin-top: 2.6rem; display:flex; gap: 2rem; justify-content:center; flex-wrap:wrap;
}
.contact__socials a{
  font-family: var(--mono); font-size: .82rem; text-transform:uppercase; letter-spacing:.03em;
  opacity:.8; transition: opacity .2s var(--ease);
}
.contact__socials a:hover{ opacity:1; color: var(--sage); }

/* =========================================================
   FOOTER
   ========================================================= */
.footer{
  padding: 2.4rem 6vw; text-align:center; border-top: 1px solid rgba(255,246,233,.08);
}
.footer p{ font-family: var(--mono); font-size: .74rem; opacity:.5; letter-spacing:.02em; }