:root{
  --bg:#f7edd8;
  --bg2:#f2e4cc;
  --surface:rgba(255,255,255,.58);
  --surface2:rgba(255,255,255,.78);
  --stroke:rgba(34,22,14,.12);
  --stroke2:rgba(34,22,14,.18);
  --text:rgba(34,22,14,.92);
  --muted:rgba(34,22,14,.68);
  --muted2:rgba(34,22,14,.52);
  --shadow:rgba(0,0,0,.14);
  --gold:#d8b15a;
  --gold2:#f3df9d;
  --coffee:#4a2f1b;
  --palm:#3f6c4a;
  --beige:#efe3c8;
  --ghazal:#7b1e2b;
  --radius:18px;
  --radius2:28px;
  --max:1180px;
  --pad:18px;
  --pad2:26px;
  --ring:0 0 0 4px rgba(216,177,90,.18);
  --ease:cubic-bezier(.2,.8,.2,1);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:"IBM Plex Sans Arabic",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  background:
    radial-gradient(1200px 600px at 15% 10%, rgba(216,177,90,.14), transparent 62%),
    radial-gradient(900px 520px at 90% 25%, rgba(63,108,74,.1), transparent 58%),
    radial-gradient(800px 520px at 50% 110%, rgba(74,47,27,.12), transparent 62%),
    linear-gradient(180deg, var(--bg), var(--bg2));
  color:var(--text);
  line-height:1.7;
  text-rendering:optimizeLegibility;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}

img,video{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button{font:inherit}

.container{max-width:var(--max);margin:0 auto;padding:0 var(--pad)}

.skip{
  position:absolute;
  inset-inline-start:12px;
  top:10px;
  padding:10px 12px;
  border-radius:999px;
  background:rgba(34,22,14,.9);
  border:1px solid var(--stroke);
  transform:translateY(-140%);
  transition:transform .2s var(--ease);
  z-index:1000;
}
.skip:focus{transform:translateY(0);outline:none;box-shadow:var(--ring)}

.header{
  position:sticky;
  top:0;
  z-index:50;
  padding-top:env(safe-area-inset-top);
  backdrop-filter:blur(14px);
  background:linear-gradient(180deg, rgba(247,237,216,.92), rgba(247,237,216,.62));
  border-bottom:1px solid rgba(34,22,14,.08);
}
.header__inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:12px 0;
  gap:14px;
}
.brand{display:flex;align-items:center;gap:10px;min-width:120px}
.brand__logo{height:36px;width:auto;filter:drop-shadow(0 12px 26px rgba(0,0,0,.18))}

.header__actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap;justify-content:flex-start}

.header__progress{
  height:1px;
  background:rgba(34,22,14,.08);
}
.header__progress span{
  display:block;
  height:1px;
  width:0%;
  background:linear-gradient(90deg, rgba(216,177,90,.0), rgba(216,177,90,.95), rgba(243,223,157,.65));
}

.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  padding:11px 14px;
  border-radius:999px;
  border:1px solid var(--stroke);
  background:rgba(255,255,255,.42);
  color:var(--text);
  transition:transform .18s var(--ease), background .18s var(--ease), border-color .18s var(--ease);
  user-select:none;
  -webkit-tap-highlight-color:transparent;
  white-space:nowrap;
}
.btn:focus{outline:none;box-shadow:var(--ring)}
.btn:hover{transform:translateY(-1px);border-color:rgba(216,177,90,.35);background:rgba(216,177,90,.06)}
.btn:active{transform:translateY(0)}
.btn--primary{
  border-color:rgba(216,177,90,.35);
  background:linear-gradient(180deg, rgba(243,223,157,.22), rgba(216,177,90,.12));
  box-shadow:0 18px 40px rgba(0,0,0,.18);
}
.btn--primary:hover{background:linear-gradient(180deg, rgba(243,223,157,.28), rgba(216,177,90,.16))}
.btn--ghost{background:rgba(255,255,255,.28)}
.btn--lg{padding:13px 18px}
.btn--xl{padding:15px 20px;font-weight:600}

.iconbtn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:42px;
  height:42px;
  border-radius:999px;
  border:1px solid var(--stroke);
  background:rgba(255,255,255,.36);
  transition:transform .18s var(--ease), background .18s var(--ease), border-color .18s var(--ease);
  -webkit-tap-highlight-color:transparent;
}
.iconbtn svg{width:19px;height:19px;fill:rgba(34,22,14,.82)}
.iconbtn:hover{transform:translateY(-1px);border-color:rgba(216,177,90,.35);background:rgba(216,177,90,.06)}
.iconbtn:focus{outline:none;box-shadow:var(--ring)}
.iconbtn--btn{cursor:pointer}

.kicker{
  display:inline-flex;
  align-items:center;
  gap:10px;
  font-size:13px;
  letter-spacing:.2px;
  color:rgba(74,47,27,.92);
  padding:7px 12px;
  border-radius:999px;
  border:1px solid rgba(216,177,90,.28);
  background:rgba(216,177,90,.06);
}

.hero{
  position:relative;
  padding:34px 0 18px;
  overflow:hidden;
}
.hero__bg{
  position:absolute;
  inset:0;
  background-image:
    radial-gradient(620px 420px at 30% 10%, rgba(243,223,157,.18), transparent 60%),
    radial-gradient(540px 400px at 70% 15%, rgba(63,108,74,.12), transparent 60%),
    radial-gradient(520px 360px at 55% 70%, rgba(74,47,27,.16), transparent 65%),
    url("assets/SaveClip.App_681773410_17871245877664693_160721050666855338_n.jpg");
  background-size:auto, auto, auto, cover;
  background-position:center, center, center, center;
  background-repeat:no-repeat;
  opacity:.22;
  filter:saturate(1.02) contrast(1.03) brightness(1.02);
  pointer-events:none;
}
.hero__inner{
  display:grid;
  gap:18px;
  align-items:center;
  grid-template-areas:
    "media"
    "copy";
}
.hero__copy{padding:8px 0;grid-area:copy}
.hero__media{position:relative;grid-area:media;direction:ltr}
.heroMediaGrid{
  display:grid;
  grid-template-columns:1.15fr .85fr;
  gap:12px;
  align-items:stretch;
  grid-template-rows:auto 1fr;
  min-height:500px;
}
.heroLogoWrap{grid-column:1 / -1}
.heroLogoWrap .heroShot{border-radius:24px;background:transparent}
.heroLogoWrap .heroShot img{aspect-ratio:21/6}
.heroLogoWrap .heroShot__shade{background:linear-gradient(180deg, rgba(0,0,0,0) 55%, rgba(0,0,0,.08))}
.heroLogoWrap img#heroShot2{height:120px;mix-blend-mode:multiply;filter:contrast(1.18)}
.heroVideoWrap{position:relative}
.heroSide{
  display:grid;
  grid-template-columns:1fr;
  gap:10px;
  height:100%;
}
.heroVideoWrap{height:100%}
.heroVideoWrap .frame{min-height:0;height:100%}
.heroVideoWrap .frame__video{height:100%}
.heroShot{
  position:relative;
  padding:0;
  border-radius:22px;
  overflow:hidden;
  border:1px solid rgba(216,177,90,.22);
  background:rgba(255,255,255,.28);
  box-shadow:0 24px 70px rgba(0,0,0,.14);
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}
.heroShot:focus{outline:none;box-shadow:var(--ring)}
.heroShot img{
  width:100%;
  height:100%;
  aspect-ratio:1/1;
  object-fit:cover;
  display:block;
  filter:saturate(1.04) contrast(1.03) brightness(.94);
  transform:scale(1.02);
  transition:transform .5s var(--ease);
}
.heroShot:hover img{transform:scale(1.06)}
.heroShot__shade{
  position:absolute;
  inset:0;
  background:linear-gradient(180deg, rgba(0,0,0,0) 40%, rgba(0,0,0,.22));
  pointer-events:none;
}
.hero__title{
  font-size:clamp(28px, 4.2vw, 52px);
  line-height:1.1;
  margin:14px 0 10px;
  letter-spacing:-.3px;
}
h1#heroTitle{text-align:center}
.hero__subtitle{margin:0 0 16px;color:var(--muted);max-width:56ch}
.hero__cta{display:flex;gap:10px;flex-wrap:wrap}

.frame{
  position:relative;
  border-radius:var(--radius2);
  overflow:hidden;
  border:1px solid rgba(216,177,90,.22);
  background:
    radial-gradient(600px 360px at 20% 20%, rgba(243,223,157,.16), transparent 60%),
    linear-gradient(180deg, rgba(255,255,255,.55), rgba(255,255,255,.18));
  box-shadow:0 40px 120px rgba(0,0,0,.22);
  transform:translateZ(0);
  min-height:320px;
}
.frame__video{
  width:100%;
  height:100%;
  aspect-ratio:auto;
  object-fit:cover;
  filter:saturate(1.06) contrast(1.02) brightness(.92);
  pointer-events:none;
}
.frame__shine{
  position:absolute;
  inset:0;
  background:linear-gradient(115deg, rgba(243,223,157,.0) 30%, rgba(243,223,157,.12) 50%, rgba(243,223,157,0) 70%);
  transform:translateX(-60%);
  mix-blend-mode:screen;
  pointer-events:none;
}
.frame__grain{
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 10% 10%, rgba(255,255,255,.04) 0, transparent 35%),
    radial-gradient(circle at 70% 30%, rgba(255,255,255,.02) 0, transparent 35%),
    radial-gradient(circle at 30% 80%, rgba(255,255,255,.03) 0, transparent 40%);
  opacity:.6;
  pointer-events:none;
}

.hero__floating{position:absolute;inset:-14px;pointer-events:none}
.float{
  position:absolute;
  width:140px;
  height:140px;
  border-radius:999px;
  filter:blur(22px);
  opacity:.7;
  transform:translateZ(0);
}
.float--a{inset:auto 12% 10% auto;background:rgba(216,177,90,.26)}
.float--b{inset:14% auto auto 10%;background:rgba(63,108,74,.22);width:160px;height:160px}
.float--c{inset:auto auto 4% 28%;background:rgba(74,47,27,.3);width:180px;height:180px}

.section{
  padding:54px 0;
}
.section--tight{padding:42px 0}
.sprinkleWrap{position:relative}
.sprinkles{
  position:absolute;
  inset:-10px;
  pointer-events:none;
  overflow:hidden;
}
.sprinkle{
  position:absolute;
  width:140px;
  height:140px;
  border-radius:22px;
  object-fit:cover;
  opacity:.16;
  filter:saturate(1.02) contrast(1.02) brightness(.96);
  box-shadow:0 24px 70px rgba(0,0,0,.12);
  border:1px solid rgba(216,177,90,.2);
  transform:rotate(-6deg) translateZ(0);
  mix-blend-mode:multiply;
}
.sprinkle--a{top:-16px;inset-inline-end:-26px;transform:rotate(10deg)}
.sprinkle--b{bottom:14px;inset-inline-start:-22px;transform:rotate(-10deg)}
.sprinkle--c{top:40%;inset-inline-end:-34px;width:120px;height:120px;opacity:.12}
.sprinkle--d{top:-22px;inset-inline-start:12%;width:160px;height:160px;opacity:.14;transform:rotate(-8deg)}
.sprinkle--e{bottom:-26px;inset-inline-end:10%;width:160px;height:160px;opacity:.14;transform:rotate(8deg)}
.sprinkle--f{top:-18px;inset-inline-start:-26px;transform:rotate(-12deg)}
.sprinkle--g{bottom:-22px;inset-inline-end:-26px;transform:rotate(12deg)}
.sprinkle--h{top:10px;inset-inline-end:-30px;width:180px;height:180px;opacity:.12;transform:rotate(14deg)}
.section__head{margin-bottom:18px}
.section__head--row{display:flex;align-items:flex-end;justify-content:space-between;gap:14px;flex-wrap:wrap}
.section__title{margin:0;font-size:clamp(22px, 3vw, 34px);line-height:1.15;letter-spacing:-.2px}
.section__sub{margin:8px 0 0;color:var(--muted);max-width:70ch}
.section__cta{margin-top:18px}

.grid{display:grid;gap:12px}
.grid--3{grid-template-columns:1fr}

.card{
  position:relative;
  padding:16px 14px;
  border-radius:var(--radius);
  border:1px solid rgba(255,255,255,.1);
  background:linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.02));
  box-shadow:0 20px 60px rgba(0,0,0,.35);
  overflow:hidden;
}
.card::before{
  content:"";
  position:absolute;
  inset:-40% -30% auto -30%;
  height:60%;
  background:radial-gradient(340px 180px at 50% 50%, rgba(216,177,90,.16), transparent 60%);
  opacity:.65;
  pointer-events:none;
}
.card__title{margin:0 0 6px;font-weight:600}
.card__body{margin:0;color:var(--muted)}

.ingredients{
  display:grid;
  grid-template-columns:1fr;
  gap:12px;
}
.ingredient{
  display:flex;
  gap:12px;
  align-items:flex-start;
  padding:16px 14px;
  border-radius:var(--radius);
  border:1px solid rgba(255,255,255,.1);
  background:rgba(255,255,255,.03);
}
.ingredient__icon{
  width:42px;
  height:42px;
  border-radius:14px;
  background:linear-gradient(180deg, rgba(243,223,157,.22), rgba(216,177,90,.08));
  border:1px solid rgba(216,177,90,.22);
  display:flex;
  align-items:center;
  justify-content:center;
  flex:0 0 auto;
}
.ingredient__icon svg{width:20px;height:20px;fill:rgba(243,223,157,.95)}
.ingredient__name{margin:0;font-weight:600}
.ingredient__note{margin:2px 0 0;color:var(--muted)}

.story{padding-top:30px}
.story__inner{
  display:grid;
  grid-template-columns:1fr;
  gap:14px;
  align-items:center;
}
.story__image{
  position:relative;
  border-radius:var(--radius2);
  overflow:hidden;
  border:1px solid rgba(255,255,255,.1);
  background:rgba(255,255,255,.03);
  box-shadow:0 30px 90px rgba(0,0,0,.55);
}
.story__image img{
  width:100%;
  height:auto;
  aspect-ratio:4/3;
  object-fit:cover;
  filter:saturate(1.02) contrast(1.03) brightness(.94);
}
.story__overlay{
  position:absolute;
  inset:0;
  background:
    radial-gradient(700px 380px at 70% 40%, rgba(243,223,157,.18), transparent 60%),
    linear-gradient(180deg, rgba(0,0,0,0) 50%, rgba(0,0,0,.18));
  pointer-events:none;
}
.story__text p{margin:0 0 12px;color:var(--muted)}
.story__cta{display:flex;gap:10px;flex-wrap:wrap;margin-top:10px}

.gallery{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
  grid-auto-flow:dense;
}
.gitem--lg{grid-column:span 2;grid-row:span 2}
.gitem{
  position:relative;
  border-radius:16px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.1);
  background:rgba(255,255,255,.02);
  cursor:pointer;
  padding:0;
  appearance:none;
}
.gitem:focus{outline:none;box-shadow:var(--ring)}
.gitem img{
  width:100%;
  height:100%;
  aspect-ratio:1/1;
  object-fit:cover;
  filter:saturate(1.04) contrast(1.03) brightness(.92);
  transform:scale(1.02);
  transition:transform .4s var(--ease);
}
.gitem:hover img{transform:scale(1.06)}
.gitem::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg, rgba(0,0,0,0) 40%, rgba(0,0,0,.42));
  opacity:.9;
  pointer-events:none;
}

.table{
  border-radius:var(--radius2);
  overflow:hidden;
  border:1px solid rgba(255,255,255,.1);
  background:linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.02));
}
.table__head,.table__row{
  display:grid;
  grid-template-columns:1.1fr 1fr 1fr;
  gap:0;
}
.table__cell{
  padding:14px 12px;
  border-bottom:1px solid rgba(255,255,255,.08);
  border-inline-end:1px solid rgba(255,255,255,.06);
}
.table__cell:last-child{border-inline-end:none}
.table__cell--muted{color:var(--muted)}
.table__head .table__cell{
  background:rgba(216,177,90,.06);
  border-bottom:1px solid rgba(216,177,90,.16);
  font-weight:600;
}
.table__row:last-child .table__cell{border-bottom:none}

.steps{
  list-style:none;
  padding:0;
  margin:0;
  display:grid;
  gap:10px;
}
.step{
  display:grid;
  grid-template-columns:auto 1fr;
  gap:12px;
  padding:14px 14px;
  border-radius:var(--radius);
  border:1px solid rgba(255,255,255,.1);
  background:rgba(255,255,255,.03);
}
.step__num{
  width:42px;
  height:42px;
  border-radius:14px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight:700;
  background:linear-gradient(180deg, rgba(243,223,157,.2), rgba(216,177,90,.08));
  border:1px solid rgba(216,177,90,.2);
  color:rgba(243,223,157,.96);
}
.step__title{margin:0;font-weight:600}
.step__body{margin:2px 0 0;color:var(--muted)}

.slider{
  border-radius:var(--radius2);
  border:1px solid rgba(255,255,255,.1);
  background:rgba(255,255,255,.02);
  overflow:hidden;
  direction:ltr;
}
.slider__track{
  display:flex;
  gap:12px;
  padding:14px;
  will-change:transform;
}
.tcard{
  min-width:min(420px, 88vw);
  border-radius:18px;
  border:1px solid rgba(255,255,255,.1);
  background:linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.02));
  padding:16px 14px;
  position:relative;
  overflow:hidden;
  direction:rtl;
}
.tcard::before{
  content:"";
  position:absolute;
  inset:-40% -30% auto -30%;
  height:55%;
  background:radial-gradient(360px 190px at 50% 50%, rgba(63,108,74,.16), transparent 60%);
  opacity:.75;
  pointer-events:none;
}
.tcard__quote{margin:0 0 12px;color:rgba(255,255,255,.86);font-size:15px}
.tcard__meta{display:flex;gap:10px;align-items:center;color:var(--muted);font-size:13px}
.tcard__dot{
  width:8px;
  height:8px;
  border-radius:999px;
  background:rgba(216,177,90,.6);
}

.faq{display:grid;gap:10px}
.faq__item{
  border-radius:var(--radius);
  border:1px solid rgba(255,255,255,.1);
  background:rgba(255,255,255,.02);
  overflow:hidden;
}
.faq__btn{
  width:100%;
  background:transparent;
  border:0;
  color:var(--text);
  text-align:start;
  padding:14px 14px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  cursor:pointer;
}
.faq__btn:focus{outline:none;box-shadow:var(--ring)}
.faq__q{margin:0;font-weight:600}
.faq__chev{
  width:34px;
  height:34px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.12);
  display:flex;
  align-items:center;
  justify-content:center;
  background:rgba(255,255,255,.02);
  flex:0 0 auto;
  transition:transform .2s var(--ease), border-color .2s var(--ease);
}
.faq__chev svg{width:18px;height:18px;fill:rgba(255,255,255,.82)}
.faq__panel{
  max-height:0;
  overflow:hidden;
  transition:max-height .34s var(--ease);
}
.faq__a{margin:0;padding:0 14px 14px;color:var(--muted)}
.faq__item[data-open="true"] .faq__chev{transform:rotate(180deg);border-color:rgba(216,177,90,.35)}

.trust__inner{
  display:grid;
  grid-template-columns:1fr;
  gap:14px;
  align-items:stretch;
}
.trust__card{
  border-radius:var(--radius2);
  border:1px solid rgba(255,255,255,.1);
  background:linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.02));
  padding:18px 16px;
  box-shadow:0 30px 90px rgba(0,0,0,.5);
}
.checklist{
  margin:14px 0 0;
  padding:0;
  list-style:none;
  display:grid;
  gap:8px;
}
.checklist li{
  display:flex;
  gap:10px;
  align-items:flex-start;
  color:var(--ghazal);
  font-weight:600;
}
.checklist li::before{
  content:"✓";
  color:var(--ghazal);
  width:20px;
  flex:0 0 auto;
}
.trust__media{
  border-radius:var(--radius2);
  overflow:hidden;
  border:1px solid rgba(255,255,255,.1);
  background:
    radial-gradient(700px 420px at 30% 30%, rgba(243,223,157,.18), transparent 60%),
    radial-gradient(640px 420px at 70% 70%, rgba(63,108,74,.16), transparent 60%),
    linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.01));
  box-shadow:0 40px 120px rgba(0,0,0,.55);
  position:relative;
  min-height:220px;
}
.trust__panel{
  position:absolute;
  inset:0;
  background:
    linear-gradient(115deg, rgba(243,223,157,0) 35%, rgba(243,223,157,.12) 55%, rgba(243,223,157,0) 75%);
  transform:translateX(-60%);
  opacity:.9;
}

.social{
  display:grid;
  grid-template-columns:1fr;
  gap:10px;
}
.social__card{
  display:flex;
  gap:12px;
  align-items:center;
  padding:14px 14px;
  border-radius:var(--radius);
  border:1px solid rgba(255,255,255,.1);
  background:rgba(255,255,255,.02);
  transition:transform .18s var(--ease), border-color .18s var(--ease), background .18s var(--ease);
}
.social__card:hover{transform:translateY(-1px);border-color:rgba(216,177,90,.35);background:rgba(216,177,90,.06)}
.social__icon{
  width:44px;
  height:44px;
  border-radius:16px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:linear-gradient(180deg, rgba(243,223,157,.2), rgba(216,177,90,.06));
  border:1px solid rgba(216,177,90,.2);
}
.social__icon svg{width:21px;height:21px;fill:rgba(255,255,255,.92)}
.social__title{font-weight:700}
.social__hint{font-size:13px;color:var(--muted)}

.final{
  position:relative;
  padding:56px 0;
  overflow:hidden;
}
.final__bg{
  position:absolute;
  inset:-10% -30%;
  background:
    radial-gradient(740px 440px at 25% 25%, rgba(243,223,157,.22), transparent 60%),
    radial-gradient(660px 420px at 70% 60%, rgba(74,47,27,.28), transparent 60%),
    radial-gradient(520px 380px at 80% 20%, rgba(63,108,74,.18), transparent 60%);
  pointer-events:none;
}
.final__inner{
  display:grid;
  grid-template-columns:1fr;
  gap:14px;
  align-items:center;
}
.final__media{
  max-width:420px;
  width:100%;
  margin-inline:auto;
}
.final__image{
  position:relative;
  border-radius:var(--radius2);
  overflow:hidden;
  border:1px solid rgba(216,177,90,.22);
  background:rgba(255,255,255,.02);
  box-shadow:0 40px 140px rgba(0,0,0,.65);
}
.final__image img{
  width:100%;
  aspect-ratio:4/3;
  object-fit:cover;
  filter:saturate(1.04) contrast(1.04) brightness(.92);
}
.final__shine{
  position:absolute;
  inset:0;
  background:linear-gradient(115deg, rgba(243,223,157,0) 35%, rgba(243,223,157,.12) 55%, rgba(243,223,157,0) 75%);
  transform:translateX(-55%);
  pointer-events:none;
}
.final__title{
  margin:10px 0 8px;
  font-size:clamp(26px, 4vw, 44px);
  line-height:1.1;
}
.final__sub{margin:0 0 16px;color:var(--muted);max-width:60ch}
.final__cta{display:flex;gap:10px;flex-wrap:wrap}
.final__meta{margin-top:12px;color:var(--muted2);font-size:13px}

.footer{
  border-top:1px solid rgba(34,22,14,.08);
  background:linear-gradient(180deg, rgba(255,255,255,.35), rgba(247,237,216,.9));
  padding:28px 0;
}
.footer__inner{
  display:grid;
  grid-template-columns:1fr;
  gap:16px;
}
.footer__logo{height:36px;width:auto;opacity:.98;filter:drop-shadow(0 10px 22px rgba(0,0,0,.14))}
.footer__desc{margin:10px 0 0;color:var(--muted);max-width:60ch}
.footer__links{display:flex;gap:12px;flex-wrap:wrap}
.footer__link{
  padding:10px 12px;
  border-radius:999px;
  border:1px solid rgba(34,22,14,.1);
  background:rgba(255,255,255,.35);
}
.footer__link:hover{border-color:rgba(216,177,90,.35);background:rgba(216,177,90,.06)}
.footer__label{color:var(--muted2);font-size:13px}
.footer__phone{display:inline-block;margin-top:6px;font-weight:700}
.footer__copy{margin-top:10px;color:var(--muted2);font-size:12px}

.lightbox{
  position:fixed;
  inset:0;
  display:grid;
  place-items:center;
  background:rgba(0,0,0,.76);
  opacity:0;
  pointer-events:none;
  transition:opacity .2s var(--ease);
  z-index:80;
  padding:18px;
}
.lightbox[data-open="true"]{opacity:1;pointer-events:auto}
.lightbox__img{
  max-width:min(980px, 92vw);
  max-height:82vh;
  border-radius:18px;
  border:1px solid rgba(255,255,255,.14);
  box-shadow:0 30px 120px rgba(0,0,0,.7);
}
.lightbox__close{
  position:fixed;
  top:14px;
  inset-inline-start:14px;
  width:44px;
  height:44px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(0,0,0,.3);
  backdrop-filter:blur(10px);
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
}
.lightbox__close svg{width:20px;height:20px;fill:rgba(255,255,255,.9)}
.lightbox__close:focus{outline:none;box-shadow:var(--ring)}

.noscript{
  margin:18px;
  padding:14px;
  border-radius:16px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(0,0,0,.45);
}

@media (max-width: 480px){
  :root{--pad:16px}
  .header__inner{gap:10px;padding:10px 0}
  .brand__logo{height:32px}
  .header__actions{
    flex-wrap:nowrap;
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
    padding-bottom:2px;
  }
  .header__actions::-webkit-scrollbar{display:none}
  .header__actions{touch-action:pan-y}
  .btn{padding:10px 12px;font-size:14px}
  .btn--lg{padding:12px 14px}
  .btn--xl{padding:14px 16px}
  .iconbtn{width:38px;height:38px}
  .iconbtn svg{width:18px;height:18px}
  .hero{padding:22px 0 14px}
  .heroMediaGrid{min-height:460px;gap:10px}
  .frame{min-height:0}
  .hero__cta{flex-direction:column;align-items:stretch}
  .hero__cta .btn{width:100%}
  .section{padding:44px 0}
  .section--tight{padding:36px 0}
  .sprinkles{inset:-6px}
  .sprinkle{opacity:.1}
  .sprinkle--c,.sprinkle--g{display:none}
  .heroShot{border-radius:18px}
}

@media (min-width: 520px){
  .gallery{grid-template-columns:repeat(3,minmax(0,1fr))}
}

@media (min-width: 760px){
  .container{padding:0 var(--pad2)}
  .hero{padding:48px 0 22px}
  .hero__inner{
    grid-template-columns:1.15fr .85fr;
    gap:26px;
    grid-template-areas:"media copy";
  }
  .frame{min-height:460px}
  .heroMediaGrid{grid-template-columns:1.2fr .8fr;gap:14px}
  .heroSide{grid-template-columns:1fr;gap:12px}
  .heroShot img{aspect-ratio:4/3}
  .heroLogoWrap .heroShot img{aspect-ratio:21/6}
  .grid--3{grid-template-columns:repeat(3,minmax(0,1fr))}
  .ingredients{grid-template-columns:repeat(2,minmax(0,1fr))}
  .story__inner{grid-template-columns:1fr 1.1fr;gap:22px}
  .gallery{grid-template-columns:repeat(4,minmax(0,1fr))}
  .final__inner{grid-template-columns:1fr 1.05fr;gap:22px}
  .final__media{max-width:520px;margin-inline:0}
  .trust__inner{grid-template-columns:1fr 1fr}
  .social{grid-template-columns:repeat(3,minmax(0,1fr))}
  .footer__inner{grid-template-columns:1.2fr .9fr .9fr;align-items:start}
  .section{
    content-visibility:auto;
    contain-intrinsic-size:1px 900px;
  }
}

@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  .btn,.iconbtn,.gitem img,.faq__panel,.social__card{transition:none}
}
