@charset "UTF-8";
.vy-link{
  display:inline-flex;
  align-items:center;
  min-height:44px;
  font-size:1.5rem;
  font-weight:500;
  color:var(--vy-green);
  text-decoration-line:underline;
  text-decoration-thickness:1px;
  text-underline-offset:0.4em;
}
.vy-link:hover{
  color:var(--vy-sage);
}

.vy-hero{
  display:grid;
  background-color:var(--vy-sand);
}
.vy-hero__media{
  position:relative;
  aspect-ratio:4/3;
  max-height:46svh;
  width:100%;
  overflow:hidden;
  background-color:var(--vy-sand);
}
.vy-hero__media picture,
.vy-hero__media img{
  display:block;
  width:100%;
  height:100%;
}
.vy-hero__media img{
  -o-object-fit:cover;
     object-fit:cover;
  -o-object-position:40% 55%;
     object-position:40% 55%;
}
.vy-hero__placeholder{
  width:100%;
  height:100%;
  background-color:var(--vy-sand);
}
.vy-hero__content{
  display:grid;
  align-content:end;
  justify-items:start;
  grid-gap:16px;
  gap:16px;
  padding:24px var(--page-gutter) 40px;
}
.vy-hero__heading{
  max-width:12ch;
  font-size:clamp(3.6rem, 2.4rem + 4vw, 7.2rem);
  line-height:0.98;
  letter-spacing:-0.02em;
}
.vy-hero__text{
  max-width:38ch;
  font-size:1.7rem;
  color:var(--vy-sage);
}
.vy-hero__button{
  width:100%;
  margin-block-start:8px;
}

:lang(ar) .vy-hero__heading{
  max-width:14ch;
  line-height:1.3;
  letter-spacing:0;
}

@media (min-width: 768px){
  .vy-hero__button{
    width:auto;
  }
}
@media (min-width: 1024px){
  .vy-hero{
    grid-template-columns:minmax(0, 1fr) minmax(0, 1fr);
    height:max(480px, min(68svh, 620px));
  }
  .vy-hero__media{
    aspect-ratio:auto;
    max-height:none;
    height:100%;
  }
  .vy-hero__media picture,
  .vy-hero__media img{
    position:absolute;
    inset:0;
  }
  .vy-hero__content{
    align-content:center;
    padding:48px 56px;
    gap:20px;
  }
}
.vy-products{
  max-width:var(--page-max);
  margin-inline:auto;
  padding:72px var(--page-gutter);
}
.vy-products__head{
  display:flex;
  flex-wrap:wrap;
  align-items:baseline;
  justify-content:space-between;
  gap:8px 24px;
  margin-block-end:32px;
}
.vy-products__grid{
  display:grid;
  grid-gap:48px;
  gap:48px;
}

.vy-card__link{
  display:grid;
  grid-gap:16px;
  gap:16px;
  color:inherit;
}
.vy-card__link:hover .vy-card__media img{
  scale:1.02;
}
.vy-card__link:hover .vy-card__title{
  text-decoration-color:currentColor;
}
.vy-card__media{
  position:relative;
  aspect-ratio:1/1;
  overflow:hidden;
  background-color:var(--vy-sand);
}
.vy-card__media img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  padding:12%;
  -o-object-fit:contain;
     object-fit:contain;
  mix-blend-mode:multiply;
  transition:scale 0.8s var(--ease-out);
}
.vy-card__placeholder{
  width:100%;
  height:100%;
}
.vy-card__info{
  display:grid;
  justify-items:start;
  grid-gap:6px;
  gap:6px;
}
.vy-card__title{
  font-size:clamp(1.8rem, 1.5rem + 0.8vw, 2.6rem);
  text-decoration-line:underline;
  text-decoration-thickness:1px;
  text-underline-offset:0.2em;
  text-decoration-color:transparent;
  transition:text-decoration-color var(--transition-duration-normal) var(--ease-out);
}
.vy-card__price{
  flex-shrink:0;
  font-size:1.5rem;
  font-weight:500;
  font-feature-settings:"tnum";
  font-variant-numeric:tabular-nums;
}
.vy-card__status{
  margin-block-start:6px;
  font-size:1.4rem;
  color:var(--vy-sage);
}

@media (min-width: 768px){
  .vy-products__grid{
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:64px 32px;
  }
}
@media (min-width: 1024px){
  .vy-products{
    padding-block:120px;
  }
  .vy-products__head{
    margin-block-end:48px;
  }
  .vy-products__grid > li:nth-child(even){
    margin-block-start:160px;
  }
}
@media (prefers-reduced-motion: reduce){
  .vy-card__link:hover .vy-card__media img{
    scale:1;
  }
}
.vy-promise{
  color:var(--vy-ivory);
  background-color:var(--vy-green);
}
.vy-promise__list{
  max-width:var(--page-max);
  margin-inline:auto;
  padding:40px var(--page-gutter);
  display:grid;
}
.vy-promise__item{
  display:grid;
  align-content:start;
  grid-gap:8px;
  gap:8px;
  padding-block:24px;
}
.vy-promise__item + .vy-promise__item{
  border-block-start:1px solid rgba(var(--vy-ivory-rgb), 0.2);
}
.vy-promise__title{
  font-size:clamp(2.4rem, 2rem + 1vw, 3.2rem);
  line-height:1.15;
}
.vy-promise__text{
  max-width:40ch;
  font-size:1.5rem;
  color:rgba(var(--vy-ivory-rgb), 0.78);
}
.vy-promise .vy-link{
  color:var(--vy-ivory);
}
.vy-promise .vy-link:hover{
  color:rgba(var(--vy-ivory-rgb), 0.78);
}
.vy-promise .vy-link:focus-visible{
  outline-color:var(--vy-ivory);
}

@media (min-width: 1024px){
  .vy-promise__list{
    grid-auto-flow:column;
    grid-auto-columns:minmax(0, 1fr);
    padding-block:88px;
  }
  .vy-promise__item{
    padding-block:0;
    padding-inline:40px;
  }
  .vy-promise__item:first-child{
    padding-inline-start:0;
  }
  .vy-promise__item + .vy-promise__item{
    border-block-start:0;
    border-inline-start:1px solid rgba(var(--vy-ivory-rgb), 0.2);
  }
}
.vy-statement__inner{
  max-width:var(--page-max);
  margin-inline:auto;
  padding:96px var(--page-gutter);
  display:grid;
  grid-gap:32px;
  gap:32px;
}
.vy-statement__mark{
  width:56px;
}
.vy-statement__mark .vy-mark-svg{
  width:100%;
  height:auto;
}
.vy-statement__heading{
  max-width:18ch;
  font-size:clamp(3.2rem, 2.2rem + 3vw, 6rem);
  line-height:1.05;
}
.vy-statement__body{
  display:grid;
  justify-items:start;
  grid-gap:16px;
  gap:16px;
  max-width:46ch;
}
.vy-statement__body p{
  font-size:1.7rem;
  color:var(--vy-sage);
}

:lang(ar) .vy-statement__heading{
  line-height:1.4;
}

@media (min-width: 1024px){
  .vy-statement__inner{
    grid-template-columns:repeat(12, minmax(0, 1fr));
    -moz-column-gap:32px;
         column-gap:32px;
    padding-block:160px;
  }
  .vy-statement__mark{
    grid-column:1/span 2;
    grid-row:1/span 2;
    width:96px;
  }
  .vy-statement__heading{
    grid-column:3/span 9;
  }
  .vy-statement__body{
    grid-column:7/span 5;
  }
}
.vy-faq{
  background-color:var(--vy-sand);
}
.vy-faq__inner{
  max-width:var(--page-max);
  margin-inline:auto;
  padding:72px var(--page-gutter);
  display:grid;
  grid-gap:24px;
  gap:24px;
}
.vy-faq__list{
  border-block-start:1px solid var(--vy-rule);
}
.vy-faq__item{
  border-block-end:1px solid var(--vy-rule);
}
.vy-faq__item summary{
  position:relative;
  display:block;
  padding-block:20px;
  padding-inline-end:40px;
  font-size:1.7rem;
  font-weight:500;
  line-height:1.4;
  list-style:none;
  cursor:pointer;
}
.vy-faq__item summary::-webkit-details-marker{
  display:none;
}
.vy-faq__item summary::before, .vy-faq__item summary::after{
  content:"";
  position:absolute;
  inset-inline-end:4px;
  inset-block-start:50%;
  width:14px;
  height:1.5px;
  background-color:currentColor;
  transition:rotate var(--transition-duration-normal) var(--ease-out);
}
.vy-faq__item summary::after{
  rotate:90deg;
}
.vy-faq__item[open] summary::after{
  rotate:0deg;
}
.vy-faq__answer{
  max-width:62ch;
  padding-block-end:24px;
  font-size:1.6rem;
  color:var(--vy-sage);
}
.vy-faq__answer p + p{
  margin-block-start:12px;
}
.vy-faq__more{
  justify-self:start;
}

@media (min-width: 1024px){
  .vy-faq__inner{
    grid-template-columns:repeat(12, minmax(0, 1fr));
    -moz-column-gap:32px;
         column-gap:32px;
    padding-block:120px;
  }
  .vy-faq__heading{
    grid-column:1/span 4;
  }
  .vy-faq__list,
  .vy-faq__more{
    grid-column:6/span 7;
  }
}
.vy-products__empty{
  font-size:1.6rem;
  color:var(--vy-sage);
}

.vy-spotlight{
  display:grid;
  background-color:var(--vy-ivory);
}
.vy-spotlight[data-tone=sand]{
  background-color:var(--vy-sand);
}
.vy-spotlight__media{
  position:relative;
  aspect-ratio:1/1;
  max-height:50svh;
  width:100%;
  overflow:hidden;
  background-color:var(--vy-sand);
}
.vy-spotlight__media img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  -o-object-fit:cover;
     object-fit:cover;
  -o-object-position:50% 45%;
     object-position:50% 45%;
}
.vy-spotlight[data-tone=sand] .vy-spotlight__media{
  background-color:var(--vy-ivory);
}
.vy-spotlight__content{
  display:grid;
  align-content:center;
  justify-items:start;
  grid-gap:20px;
  gap:20px;
  padding:40px var(--page-gutter) 56px;
}
.vy-spotlight__kicker{
  font-size:1.4rem;
  font-weight:500;
  color:var(--vy-sage);
}
.vy-spotlight__title{
  max-width:14ch;
  font-size:clamp(3.4rem, 2.4rem + 3vw, 6.4rem);
  line-height:1.02;
}
.vy-spotlight__text{
  max-width:42ch;
  font-size:1.7rem;
  color:var(--vy-sage);
}
.vy-spotlight__facts{
  width:100%;
  max-width:440px;
  border-block-start:1px solid var(--vy-rule);
}
.vy-spotlight__facts li{
  padding-block:12px;
  font-size:1.5rem;
  border-block-end:1px solid var(--vy-rule);
}
.vy-spotlight__buy{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:16px 24px;
  width:100%;
  margin-block-start:8px;
}
.vy-spotlight__buy .yc-btn{
  flex:1 1 100%;
}
.vy-spotlight__price{
  font-family:var(--font-display);
  font-size:3.2rem;
  line-height:1;
}

:lang(ar) .vy-spotlight__title{
  line-height:1.35;
}

@media (min-width: 768px){
  .vy-spotlight__buy .yc-btn{
    flex:0 0 auto;
  }
}
@media (min-width: 1024px){
  .vy-spotlight{
    grid-template-columns:minmax(0, 1fr) minmax(0, 1fr);
    min-height:680px;
  }
  .vy-spotlight[data-image=end] .vy-spotlight__media{
    order:2;
  }
  .vy-spotlight__media{
    aspect-ratio:auto;
    max-height:none;
  }
  .vy-spotlight__content{
    padding:80px max(40px, min(6vw, 112px));
    gap:24px;
  }
}
[data-packshot]{
  --packshot-pad:24px;
  position:relative;
}
[data-packshot] img.vy-photo{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  max-width:none;
  padding:var(--packshot-pad);
  -o-object-fit:contain;
     object-fit:contain;
  mix-blend-mode:multiply;
}

.vy-hero .vy-hero__media[data-packshot],
.vy-spotlight .vy-spotlight__media[data-packshot]{
  background-color:transparent;
}

.vy-hero__media[data-packshot]{
  aspect-ratio:auto;
  height:44svh;
  min-height:300px;
  max-height:none;
}

.vy-spotlight__media[data-packshot]{
  aspect-ratio:auto;
  height:52svh;
  min-height:320px;
  max-height:560px;
  --packshot-pad:28px;
}

@media (min-width: 1024px){
  .vy-hero__media[data-packshot]{
    height:auto;
    --packshot-pad:56px;
  }
  .vy-spotlight:has([data-packshot]){
    min-height:0;
    height:max(560px, min(78svh, 720px));
  }
  .vy-spotlight__media[data-packshot]{
    height:auto;
    max-height:none;
    --packshot-pad:64px;
  }
}
.vy-collection__intro{
  max-width:52ch;
  margin-block-start:16px;
  font-size:1.7rem;
  color:var(--vy-sage);
}
.vy-collection__count{
  margin-block-end:24px;
  font-size:1.4rem;
  color:var(--vy-sage);
}
.vy-collection__list{
  padding-block-start:40px;
}

.vy-collection .vy-products__grid{
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:32px 16px;
}

@media (min-width: 1024px){
  .vy-collection .vy-products__grid{
    grid-template-columns:repeat(3, minmax(0, 1fr));
    gap:56px 32px;
  }
  .vy-collection .vy-products__grid > li:nth-child(even){
    margin-block-start:0;
  }
  .vy-collection .vy-products__grid:has(> li:nth-child(2):last-child){
    grid-template-columns:repeat(2, minmax(0, 1fr));
    max-width:960px;
  }
}
.vy-card__mark{
  position:absolute;
  inset:0;
  display:grid;
  align-items:center;
  justify-items:center;
  place-items:center;
}
.vy-card__mark .vy-mark-svg{
  width:22%;
  height:auto;
  opacity:0.5;
}

.vy-related .vy-products__grid{
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:32px 16px;
}

@media (min-width: 1024px){
  .vy-related .vy-products__grid{
    grid-template-columns:repeat(4, minmax(0, 1fr));
  }
  .vy-related .vy-products__grid > li:nth-child(even){
    margin-block-start:0;
  }
}
.vy-duo__prices{
  display:inline-flex;
  align-items:baseline;
  gap:12px;
}
.vy-duo__prices s{
  font-size:1.7rem;
  color:var(--vy-sage);
}

.vy-duo__saving{
  font-size:1.5rem;
  font-weight:500;
}

.vy-categories{
  max-width:var(--page-max);
  margin-inline:auto;
  padding:64px var(--page-gutter);
}
.vy-categories__head{
  margin-block-end:28px;
}
.vy-categories__grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  grid-gap:32px 16px;
  gap:32px 16px;
}

.vy-tile__link{
  display:grid;
  grid-gap:14px;
  gap:14px;
  color:inherit;
}
.vy-tile__media{
  position:relative;
  aspect-ratio:1/1;
  overflow:hidden;
  background-color:var(--vy-sand);
}
.vy-tile__media[data-packshot]{
  --packshot-pad:14%;
}
.vy-tile__mark{
  position:absolute;
  inset:0;
  display:grid;
  align-items:center;
  justify-items:center;
  place-items:center;
  background-color:var(--vy-green);
}
.vy-tile__mark .vy-mark-svg{
  width:26%;
  height:auto;
}
.vy-tile__mark .vy-mark-svg g{
  fill:var(--vy-ivory);
}
.vy-tile__info{
  display:grid;
  grid-gap:4px;
  gap:4px;
}
.vy-tile__title{
  font-size:clamp(2rem, 1.6rem + 1vw, 2.8rem);
}
.vy-tile__text{
  font-size:1.4rem;
  color:var(--vy-sage);
}
.vy-tile__cta{
  justify-self:start;
  margin-block-start:6px;
  font-size:1.4rem;
  font-weight:500;
  text-decoration-line:underline;
  text-decoration-thickness:1px;
  text-underline-offset:0.35em;
}
.vy-tile__cta--soon{
  -webkit-text-decoration:none;
  text-decoration:none;
  color:var(--vy-sage);
}
.vy-tile a.vy-tile__link:hover .vy-photo{
  scale:1.03;
}
.vy-tile .vy-photo{
  transition:scale 0.8s var(--ease-out);
}

@media (max-width: 1023px){
  .vy-categories__grid > li:nth-child(3):last-child{
    grid-column:1/-1;
  }
  .vy-categories__grid > li:nth-child(3):last-child .vy-tile__media{
    aspect-ratio:2/1;
  }
}
@media (min-width: 1024px){
  .vy-categories{
    padding-block:112px;
  }
  .vy-categories__head{
    margin-block-end:48px;
  }
  .vy-categories__grid{
    grid-template-columns:repeat(3, minmax(0, 1fr));
    gap:32px;
  }
}
@media (prefers-reduced-motion: reduce){
  .vy-tile a.vy-tile__link:hover .vy-photo{
    scale:1;
  }
}
.vy-products__head h2 .vy-ar{
  font-size:0.6em;
  color:var(--vy-sage);
}

.vy-promise__title .vy-arb{
  margin-block-start:4px;
  font-size:0.6em;
  color:rgba(var(--vy-ivory-rgb), 0.72);
}

.vy-promise__title .vy-arb{
  font-size:0.7em;
  color:rgba(var(--vy-ivory-rgb), 0.85);
}

.vy-tile__title .vy-arb{
  font-family:"Amiri", "IBM Plex Sans Arabic", serif;
  font-size:0.75em;
}

.vy-tile__cta .vy-arb{
  display:inline;
  margin:0;
  font-size:1em;
  color:inherit;
}
.vy-tile__cta .vy-fr::after{
  content:"·";
  margin-inline:0.5em;
  opacity:0.6;
}

.vy-card__title .vy-arb{
  font-size:0.8em;
}