/* Source CSSOM port: source utilities, project rules and page style blocks. */
@scope (.freshfruit-blogs-content) {
/* Source: style.css */
@layer properties;
@layer theme, base, components, utilities;
@layer base {
*, ::after, ::before, ::backdrop, ::file-selector-button { box-sizing: border-box; margin: 0px; padding: 0px; border: 0px solid; }
h1, h2, h3, h4, h5, h6 { font-size: inherit; font-weight: inherit; }
a { color: inherit; text-decoration: inherit; }
img, svg, video, canvas, audio, iframe, embed, object { display: block; vertical-align: middle; }
img, video { max-width: 100%; height: auto; }
button, input, select, optgroup, textarea, ::file-selector-button { font: inherit; letter-spacing: inherit; color: inherit; border-radius: 0px; background-color: transparent; opacity: 1; }
button, input:where([type="button"], [type="reset"], [type="submit"]), ::file-selector-button { appearance: button; }
}
@layer utilities {
.pointer-events-none { pointer-events: none; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border-width: 0px; }
.absolute { position: absolute; }
.relative { position: relative; }
.inset-0 { inset: 0px; }
.top-1\/2 { top: calc(50%); }
.top-\[12px\] { top: 12px; }
.top-\[45px\] { top: 45px; }
.top-\[68px\] { top: 68px; }
.top-\[103px\] { top: 103px; }
.top-\[180px\] { top: 180px; }
.top-\[237px\] { top: 237px; }
.right-0 { right: 0px; }
.right-4 { right: calc(var(--spacing) * 4); }
.right-\[8px\] { right: 8px; }
.right-\[14px\] { right: 14px; }
.bottom-0 { bottom: 0px; }
.bottom-\[41px\] { bottom: 41px; }
.left-0 { left: 0px; }
.left-1\/2 { left: calc(50%); }
.left-\[-17\.38\%\] { left: -17.38%; }
.left-\[12px\] { left: 12px; }
.left-\[163px\] { left: 163px; }
.z-0 { z-index: 0; }
.z-10 { z-index: 10; }
.z-20 { z-index: 20; }
.z-30 { z-index: 30; }
.z-40 { z-index: 40; }
.order-1 { order: 1; }
.order-2 { order: 2; }
.order-3 { order: 3; }
.order-4 { order: 4; }
.col-start-1 { grid-column-start: 1; }
.mx-0 { margin-inline: 0px; }
.mx-\[14px\] { margin-inline: 14px; }
.mt-0 { margin-top: 0px; }
.mt-2 { margin-top: calc(var(--spacing) * 2); }
.mt-3 { margin-top: calc(var(--spacing) * 3); }
.mt-5 { margin-top: calc(var(--spacing) * 5); }
.mt-6 { margin-top: calc(var(--spacing) * 6); }
.mt-8 { margin-top: calc(var(--spacing) * 8); }
.mt-\[8px\] { margin-top: 8px; }
.mt-\[12px\] { margin-top: 12px; }
.mt-\[15px\] { margin-top: 15px; }
.mt-\[24px\] { margin-top: 24px; }
.mt-\[42px\] { margin-top: 42px; }
.mt-\[88px\] { margin-top: 88px; }
.mt-\[142px\] { margin-top: 142px; }
.mb-5 { margin-bottom: calc(var(--spacing) * 5); }
.mb-\[22px\] { margin-bottom: 22px; }
.ml-auto { margin-left: auto; }
.box-border { box-sizing: border-box; }
.block { display: block; }
.contents { display: contents; }
.flex { display: flex; }
.hidden { display: none; }
.inline-flex { display: inline-flex; }
.h-4 { height: calc(var(--spacing) * 4); }
.h-6 { height: calc(var(--spacing) * 6); }
.h-10 { height: calc(var(--spacing) * 10); }
.h-12 { height: calc(var(--spacing) * 12); }
.h-\[9px\] { height: 9px; }
.h-\[17px\] { height: 17px; }
.h-\[20px\] { height: 20px; }
.h-\[21px\] { height: 21px; }
.h-\[24px\] { height: 24px; }
.h-\[27px\] { height: 27px; }
.h-\[29px\] { height: 29px; }
.h-\[32px\] { height: 32px; }
.h-\[40px\] { height: 40px; }
.h-\[48px\] { height: 48px; }
.h-\[61px\] { height: 61px; }
.h-\[88px\] { height: 88px; }
.h-\[139px\] { height: 139px; }
.h-\[163px\] { height: 163px; }
.h-\[198px\] { height: 198px; }
.h-\[204px\] { height: 204px; }
.h-\[238px\] { height: 238px; }
.h-\[239px\] { height: 239px; }
.h-\[260px\] { height: 260px; }
.h-\[330px\] { height: 330px; }
.h-\[397px\] { height: 397px; }
.h-\[442px\] { height: 442px; }
.h-auto { height: auto; }
.h-full { height: 100%; }
.min-h-\[100dvh\] { min-height: 100dvh; }
.\!w-\[275px\] { width: 275px !important; }
.w-4 { width: calc(var(--spacing) * 4); }
.w-6 { width: calc(var(--spacing) * 6); }
.w-10 { width: calc(var(--spacing) * 10); }
.w-12 { width: calc(var(--spacing) * 12); }
.w-\[9px\] { width: 9px; }
.w-\[15px\] { width: 15px; }
.w-\[17px\] { width: 17px; }
.w-\[20px\] { width: 20px; }
.w-\[22px\] { width: 22px; }
.w-\[24px\] { width: 24px; }
.w-\[27px\] { width: 27px; }
.w-\[48px\] { width: 48px; }
.w-\[87px\] { width: 87px; }
.w-\[132px\] { width: 132px; }
.w-\[138\.91\%\] { width: 138.91%; }
.w-\[139px\] { width: 139px; }
.w-\[198px\] { width: 198px; }
.w-\[256px\] { width: 256px; }
.w-\[258px\] { width: 258px; }
.w-\[275px\] { width: 275px; }
.w-\[280px\] { width: 280px; }
.w-\[288px\] { width: 288px; }
.w-\[342px\] { width: 342px; }
.w-\[390px\] { width: 390px; }
.w-auto { width: auto; }
.w-full { width: 100%; }
.max-w-\[312px\] { max-width: 312px; }
.max-w-full { max-width: 100%; }
.min-w-0 { min-width: 0px; }
.flex-1 { flex: 1 1 0%; }
.shrink-0 { flex-shrink: 0; }
.origin-center { transform-origin: center center; }
.origin-top-left { transform-origin: 0px 0px; }
.-translate-x-1\/2 { --tw-translate-x: calc(calc(1 / 2 * 100%) * -1); translate: var(--tw-translate-x) var(--tw-translate-y); }
.-translate-y-1\/2 { --tw-translate-y: calc(calc(1 / 2 * 100%) * -1); translate: var(--tw-translate-x) var(--tw-translate-y); }
.rotate-180 { rotate: 180deg; }
.rotate-\[2\.65deg\] { rotate: 2.65deg; }
.rotate-y-180 { --tw-rotate-y: rotateY(180deg); transform: var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,); }
.cursor-pointer { cursor: pointer; }
.appearance-none { appearance: none; }
.flex-col { flex-direction: column; }
.flex-wrap { flex-wrap: wrap; }
.items-center { align-items: center; }
.items-start { align-items: flex-start; }
.justify-between { justify-content: space-between; }
.justify-center { justify-content: center; }
.justify-end { justify-content: flex-end; }
.justify-start { justify-content: flex-start; }
.gap-1 { gap: var(--spacing); }
.gap-2 { gap: calc(var(--spacing) * 2); }
.gap-3 { gap: calc(var(--spacing) * 3); }
.gap-4 { gap: calc(var(--spacing) * 4); }
.gap-\[2px\] { gap: 2px; }
.gap-\[14px\] { gap: 14px; }
.gap-\[20px\] { gap: 20px; }
.gap-\[24px\] { gap: 24px; }
.self-start { align-self: flex-start; }
.overflow-hidden { overflow: hidden; }
.overflow-visible { overflow: visible; }
.rounded-\[14px\] { border-radius: 14px; }
.rounded-\[20px\] { border-radius: 20px; }
.rounded-\[44px\] { border-radius: 44px; }
.rounded-\[49px\] { border-radius: 49px; }
.rounded-\[50px\] { border-radius: 50px; }
.rounded-full { border-radius: calc(infinity * 1px); }
.border { border-style: var(--tw-border-style); border-width: 1px; }
.border-0 { border-style: var(--tw-border-style); border-width: 0px; }
.border-\[\#A9A9A9\] { border-color: rgb(169, 169, 169); }
.bg-\[\#7C83FF\] { background-color: rgb(124, 131, 255); }
.bg-\[\#8C8C8C\]\/60 { background-color: color-mix(rgb(140, 140, 140) 60%, transparent); }
.bg-\[\#8D8D8D17\] { background-color: rgba(141, 141, 141, 0.09); }
.bg-\[\#25E96D\] { background-color: rgb(37, 233, 109); }
.bg-\[\#090909\]\/32 { background-color: color-mix(rgb(9, 9, 9) 32%, transparent); }
.bg-\[\#ADD909\] { background-color: rgb(173, 217, 9); }
.bg-\[\#C38CFD\] { background-color: rgb(195, 140, 253); }
.bg-\[\#DAFC5F\] { background-color: rgb(218, 252, 95); }
.bg-\[\#ECEDFF80\] { background-color: rgba(236, 237, 255, 0.5); }
.bg-\[\#F1FFBD\] { background-color: rgb(241, 255, 189); }
.bg-\[\#F7F7F7\] { background-color: rgb(247, 247, 247); }
.bg-\[\#FF52B4\] { background-color: rgb(255, 82, 180); }
.bg-\[\#FF485B\] { background-color: rgb(255, 72, 91); }
.bg-\[\#FFA552\] { background-color: rgb(255, 165, 82); }
.bg-transparent { background-color: transparent; }
.bg-white { background-color: var(--color-white); }
.bg-white\/50 {
  background-color: color-mix(in srgb, rgb(255, 255, 255), transparent);
  @supports (color: color-mix(in lab, red, red)) {
  background-color: color-mix(in oklab, var(--color-white) 50%, transparent);
}
}
.bg-\[linear-gradient\(255\.75deg\,\#F1FCD1_-7\.03\%\,\#BDEC12_114\.34\%\)\] { background-image: linear-gradient(255.75deg, rgb(241, 252, 209) -7.03%, rgb(189, 236, 18) 114.34%); }
.bg-\[url\(\'\.\.\/image\/pt1\.png\'\)\] { background-image: url("../image/products/pt1.png"); }
.bg-\[url\(\'\.\.\/image\/pt2\.png\'\)\] { background-image: url("../image/pt2.png"); }
.bg-\[url\(\'\.\.\/image\/pt3\.png\'\)\] { background-image: url("../image/pt3.png"); }
.bg-\[url\(\'\.\.\/image\/pt4\.png\'\)\] { background-image: url("../image/pt4.png"); }
.bg-\[url\(\'\.\.\/image\/pt5\.png\'\)\] { background-image: url("../image/pt5.png"); }
.bg-\[url\(\'\.\.\/image\/pt6\.png\'\)\] { background-image: url("../image/pt6.png"); }
.bg-\[url\(\'\.\.\/image\/pt7\.png\'\)\] { background-image: url("../image/pt7.png"); }
.bg-slider1 { background-image: var(--background-image-slider1); }
.bg-slider2 { background-image: var(--background-image-slider2); }
.bg-slider3 { background-image: var(--background-image-slider3); }
.bg-slider4 { background-image: var(--background-image-slider4); }
.bg-slider5 { background-image: var(--background-image-slider5); }
.bg-slider6 { background-image: var(--background-image-slider6); }
.bg-slider7 { background-image: var(--background-image-slider7); }
.bg-cover { background-size: cover; }
.bg-bottom { background-position: center bottom; }
.object-contain { object-fit: contain; }
.object-cover { object-fit: cover; }
.object-fill { object-fit: fill; }
.p-0 { padding: 0px; }
.p-2 { padding: calc(var(--spacing) * 2); }
.px-4 { padding-inline: calc(var(--spacing) * 4); }
.px-6 { padding-inline: calc(var(--spacing) * 6); }
.px-\[16px\] { padding-inline: 16px; }
.py-0 { padding-block: 0px; }
.py-\[60px\] { padding-block: 60px; }
.pt-3 { padding-top: calc(var(--spacing) * 3); }
.pt-8 { padding-top: calc(var(--spacing) * 8); }
.pt-\[92px\] { padding-top: 92px; }
.pr-6 { padding-right: calc(var(--spacing) * 6); }
.pr-10 { padding-right: calc(var(--spacing) * 10); }
.pb-2 { padding-bottom: calc(var(--spacing) * 2); }
.pb-4 { padding-bottom: calc(var(--spacing) * 4); }
.pb-9 { padding-bottom: calc(var(--spacing) * 9); }
.pb-24 { padding-bottom: calc(var(--spacing) * 24); }
.pl-5 { padding-left: calc(var(--spacing) * 5); }
.pl-6 { padding-left: calc(var(--spacing) * 6); }
.text-center { text-align: center; }
.text-left { text-align: left; }
.text-right { text-align: right; }
.font-\[\'Helvetica_Now_Var\'\] { font-family: "Helvetica Now Var"; }
.font-\[\'Inter\'\] { font-family: Inter; }
.text-xl { font-size: var(--text-xl); line-height: var(--tw-leading, var(--text-xl--line-height)); }
.text-\[12px\] { font-size: 12px; }
.text-\[14px\] { font-size: 14px; }
.text-\[16px\] { font-size: 16px; }
.text-\[18px\] { font-size: 18px; }
.text-\[20px\] { font-size: 20px; }
.text-\[24px\] { font-size: 24px; }
.text-\[30px\] { font-size: 30px; }
.text-\[40px\] { font-size: 40px; }
.leading-\[1\.0\] { --tw-leading: 1.0; line-height: 1; }
.leading-\[1\.2\] { --tw-leading: 1.2; line-height: 1.2; }
.leading-\[1\.4\] { --tw-leading: 1.4; line-height: 1.4; }
.leading-\[1\.05\] { --tw-leading: 1.05; line-height: 1.05; }
.leading-\[1\.5\] { --tw-leading: 1.5; line-height: 1.5; }
.leading-\[1\.32\] { --tw-leading: 1.32; line-height: 1.32; }
.leading-\[15px\] { --tw-leading: 15px; line-height: 15px; }
.leading-tight { --tw-leading: var(--leading-tight); line-height: var(--leading-tight); }
.font-bold { --tw-font-weight: var(--font-weight-bold); font-weight: var(--font-weight-bold); }
.font-extralight { --tw-font-weight: var(--font-weight-extralight); font-weight: var(--font-weight-extralight); }
.font-light { --tw-font-weight: var(--font-weight-light); font-weight: var(--font-weight-light); }
.font-medium { --tw-font-weight: var(--font-weight-medium); font-weight: var(--font-weight-medium); }
.font-normal { --tw-font-weight: var(--font-weight-normal); font-weight: var(--font-weight-normal); }
.font-semibold { --tw-font-weight: var(--font-weight-semibold); font-weight: var(--font-weight-semibold); }
.tracking-\[-0\.04em\] { --tw-tracking: -0.04em; letter-spacing: -0.04em; }
.tracking-tight { --tw-tracking: var(--tracking-tight); letter-spacing: var(--tracking-tight); }
.tracking-tighter { --tw-tracking: var(--tracking-tighter); letter-spacing: var(--tracking-tighter); }
.whitespace-nowrap { white-space: nowrap; }
.text-\[\#000000\] { color: rgb(0, 0, 0); }
.text-\[\#8B8B8B\] { color: rgb(139, 139, 139); }
.text-\[\#8C8C8C\] { color: rgb(140, 140, 140); }
.text-\[\#95D600\] { color: rgb(149, 214, 0); }
.text-\[\#141BA9\] { color: rgb(20, 27, 169); }
.text-\[\#5686FF\] { color: rgb(86, 134, 255); }
.text-\[\#030303\] { color: rgb(3, 3, 3); }
.text-\[\#393939\] { color: rgb(57, 57, 57); }
.text-\[\#636363\] { color: rgb(99, 99, 99); }
.text-\[\#666666\] { color: rgb(102, 102, 102); }
.text-black { color: var(--color-black); }
.text-white { color: var(--color-white); }
.blur-\[56px\] { --tw-blur: blur(56px); filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,); }
.backdrop-blur-\[12px\] { --tw-backdrop-blur: blur(12px); backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,); }
.backdrop-blur-md { --tw-backdrop-blur: blur(var(--blur-md)); backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,); }
.transition { transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events; transition-timing-function: var(--tw-ease, var(--default-transition-timing-function)); transition-duration: var(--tw-duration, var(--default-transition-duration)); }
.transition-\[filter\] { transition-property: filter; transition-timing-function: var(--tw-ease, var(--default-transition-timing-function)); transition-duration: var(--tw-duration, var(--default-transition-duration)); }
.transition-colors { transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to; transition-timing-function: var(--tw-ease, var(--default-transition-timing-function)); transition-duration: var(--tw-duration, var(--default-transition-duration)); }
.outline-none { --tw-outline-style: none; outline-style: none; }
.select-none { user-select: none; }
@media (hover: hover) {
.hover\:bg-white:hover { background-color: var(--color-white); }
.hover\:brightness-95:hover { --tw-brightness: brightness(95%); filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,); }
}
.focus\:border-black:focus { border-color: var(--color-black); }
.focus-visible\:outline:focus-visible { outline-style: var(--tw-outline-style); outline-width: 1px; }
.focus-visible\:outline-2:focus-visible { outline-style: var(--tw-outline-style); outline-width: 2px; }
.focus-visible\:outline-offset-2:focus-visible { outline-offset: 2px; }
.focus-visible\:outline-\[\#141BA9\]:focus-visible { outline-color: rgb(20, 27, 169); }
@media (width >= 48rem) {
.md\:pointer-events-none { pointer-events: none; }
.md\:absolute { position: absolute; }
.md\:relative { position: relative; }
.md\:static { position: static; }
.md\:inset-auto { inset: auto; }
.md\:top-\[43px\] { top: 43px; }
.md\:top-\[133px\] { top: 133px; }
.md\:top-\[163px\] { top: 163px; }
.md\:top-\[317px\] { top: 317px; }
.md\:top-\[324px\] { top: 324px; }
.md\:top-auto { top: auto; }
.md\:right-0 { right: 0px; }
.md\:right-\[12\.4\%\] { right: 12.4%; }
.md\:right-\[15px\] { right: 15px; }
.md\:right-\[283px\] { right: 283px; }
.md\:bottom-0 { bottom: 0px; }
.md\:bottom-\[44px\] { bottom: 44px; }
.md\:left-\[-9\.13\%\] { left: -9.13%; }
.md\:left-\[12\.81\%\] { left: 12.81%; }
.md\:left-auto { left: auto; }
.md\:z-0 { z-index: 0; }
.md\:z-10 { z-index: 10; }
.md\:z-auto { z-index: auto; }
.md\:order-none { order: 0; }
.md\:col-span-2 { grid-column: span 2 / span 2; }
.md\:col-start-2 { grid-column-start: 2; }
.md\:row-start-1 { grid-row-start: 1; }
.md\:m-0 { margin: 0px; }
.md\:mx-\[96px\] { margin-inline: 96px; }
.md\:mt-0 { margin-top: 0px; }
.md\:mt-2 { margin-top: calc(var(--spacing) * 2); }
.md\:mt-4 { margin-top: calc(var(--spacing) * 4); }
.md\:mt-6 { margin-top: calc(var(--spacing) * 6); }
.md\:mt-\[20px\] { margin-top: 20px; }
.md\:mt-\[32px\] { margin-top: 32px; }
.md\:mt-\[38px\] { margin-top: 38px; }
.md\:mt-\[40px\] { margin-top: 40px; }
.md\:mt-\[56px\] { margin-top: 56px; }
.md\:mt-\[257px\] { margin-top: 257px; }
.md\:mb-3 { margin-bottom: calc(var(--spacing) * 3); }
.md\:mb-\[58px\] { margin-bottom: 58px; }
.md\:mb-\[137px\] { margin-bottom: 137px; }
.md\:ml-\[63px\] { margin-left: 63px; }
.md\:ml-\[229px\] { margin-left: 229px; }
.md\:block { display: block; }
.md\:contents { display: contents; }
.md\:flex { display: flex; }
.md\:grid { display: grid; }
.md\:hidden { display: none; }
.md\:inline-flex { display: inline-flex; }
.md\:aspect-auto { aspect-ratio: auto; }
.md\:h-8 { height: calc(var(--spacing) * 8); }
.md\:h-\[15px\] { height: 15px; }
.md\:h-\[17px\] { height: 17px; }
.md\:h-\[20px\] { height: 20px; }
.md\:h-\[32px\] { height: 32px; }
.md\:h-\[33px\] { height: 33px; }
.md\:h-\[35px\] { height: 35px; }
.md\:h-\[37px\] { height: 37px; }
.md\:h-\[38px\] { height: 38px; }
.md\:h-\[40px\] { height: 40px; }
.md\:h-\[41px\] { height: 41px; }
.md\:h-\[56px\] { height: 56px; }
.md\:h-\[58px\] { height: 58px; }
.md\:h-\[68px\] { height: 68px; }
.md\:h-\[72px\] { height: 72px; }
.md\:h-\[134px\] { height: 134px; }
.md\:h-\[200px\] { height: 200px; }
.md\:h-\[224px\] { height: 224px; }
.md\:h-\[247px\] { height: 247px; }
.md\:h-\[249px\] { height: 249px; }
.md\:h-\[264px\] { height: 264px; }
.md\:h-\[291px\] { height: 291px; }
.md\:h-\[308px\] { height: 308px; }
.md\:h-\[367px\] { height: 367px; }
.md\:h-\[384px\] { height: 384px; }
.md\:h-\[418px\] { height: 418px; }
.md\:h-\[442px\] { height: 442px; }
.md\:h-\[512px\] { height: 512px; }
.md\:h-\[513px\] { height: 513px; }
.md\:h-\[581px\] { height: 581px; }
.md\:h-\[592px\] { height: 592px; }
.md\:h-\[614px\] { height: 614px; }
.md\:h-auto { height: auto; }
.md\:h-full { height: 100%; }
.md\:\!w-\[430px\] { width: 430px !important; }
.md\:w-\[17px\] { width: 17px; }
.md\:w-\[20px\] { width: 20px; }
.md\:w-\[27px\] { width: 27px; }
.md\:w-\[33px\] { width: 33px; }
.md\:w-\[34px\] { width: 34px; }
.md\:w-\[37px\] { width: 37px; }
.md\:w-\[38px\] { width: 38px; }
.md\:w-\[41px\] { width: 41px; }
.md\:w-\[56px\] { width: 56px; }
.md\:w-\[72px\] { width: 72px; }
.md\:w-\[105px\] { width: 105px; }
.md\:w-\[119\.67\%\] { width: 119.67%; }
.md\:w-\[167px\] { width: 167px; }
.md\:w-\[196px\] { width: 196px; }
.md\:w-\[213px\] { width: 213px; }
.md\:w-\[249px\] { width: 249px; }
.md\:w-\[255px\] { width: 255px; }
.md\:w-\[291px\] { width: 291px; }
.md\:w-\[379px\] { width: 379px; }
.md\:w-\[413px\] { width: 413px; }
.md\:w-\[414px\] { width: 414px; }
.md\:w-\[462px\] { width: 462px; }
.md\:w-\[720px\] { width: 720px; }
.md\:w-\[726px\] { width: 726px; }
.md\:w-\[998px\] { width: 998px; }
.md\:w-auto { width: auto; }
.md\:w-full { width: 100%; }
.md\:max-w-\[1950px\] { max-width: 1950px; }
.md\:max-w-none { max-width: none; }
.md\:flex-none { flex: 0 0 auto; }
.md\:origin-center { transform-origin: center center; }
.md\:translate-x-0 { --tw-translate-x: 0px; translate: var(--tw-translate-x) var(--tw-translate-y); }
.md\:rotate-\[-10deg\] { rotate: -10deg; }
.md\:grid-cols-\[998px_462px\] { grid-template-columns: 998px 462px; }
.md\:items-center { align-items: center; }
.md\:justify-center { justify-content: center; }
.md\:gap-0 { gap: 0px; }
.md\:gap-6 { gap: calc(var(--spacing) * 6); }
.md\:gap-x-\[146px\] { column-gap: 146px; }
.md\:self-end { align-self: flex-end; }
.md\:justify-self-start { justify-self: flex-start; }
.md\:overflow-hidden { overflow: hidden; }
.md\:overflow-visible { overflow: visible; }
.md\:rounded-\[20px\] { border-radius: 20px; }
.md\:rounded-none { border-radius: 0px; }
.md\:border-\[6px\] { border-style: var(--tw-border-style); border-width: 6px; }
.md\:border-\[\#F0F0F0\] { border-color: rgb(240, 240, 240); }
.md\:bg-black { background-color: var(--color-black); }
.md\:object-contain { object-fit: contain; }
.md\:object-right-bottom { object-position: right bottom; }
.md\:px-0 { padding-inline: 0px; }
.md\:px-6 { padding-inline: calc(var(--spacing) * 6); }
.md\:px-8 { padding-inline: calc(var(--spacing) * 8); }
.md\:px-16 { padding-inline: calc(var(--spacing) * 16); }
.md\:px-24 { padding-inline: calc(var(--spacing) * 24); }
.md\:px-\[23px\] { padding-inline: 23px; }
.md\:py-10 { padding-block: calc(var(--spacing) * 10); }
.md\:pt-0 { padding-top: 0px; }
.md\:pt-6 { padding-top: calc(var(--spacing) * 6); }
.md\:pt-\[56px\] { padding-top: 56px; }
.md\:pt-\[136px\] { padding-top: 136px; }
.md\:pb-\[59px\] { padding-bottom: 59px; }
.md\:pl-24 { padding-left: calc(var(--spacing) * 24); }
.md\:font-\[\'Helvetica_Now_Var\'\] { font-family: "Helvetica Now Var"; }
.md\:text-2xl { font-size: var(--text-2xl); line-height: var(--tw-leading, var(--text-2xl--line-height)); }
.md\:text-xl { font-size: var(--text-xl); line-height: var(--tw-leading, var(--text-xl--line-height)); }
.md\:text-\[16px\] { font-size: 16px; }
.md\:text-\[20px\] { font-size: 20px; }
.md\:text-\[24px\] { font-size: 24px; }
.md\:text-\[32px\] { font-size: 32px; }
.md\:text-\[40px\] { font-size: 40px; }
.md\:leading-6 { --tw-leading: calc(var(--spacing) * 6); line-height: calc(var(--spacing) * 6); }
.md\:leading-\[1\.32\] { --tw-leading: 1.32; line-height: 1.32; }
.md\:font-extralight { --tw-font-weight: var(--font-weight-extralight); font-weight: var(--font-weight-extralight); }
.md\:font-light { --tw-font-weight: var(--font-weight-light); font-weight: var(--font-weight-light); }
.md\:font-normal { --tw-font-weight: var(--font-weight-normal); font-weight: var(--font-weight-normal); }
.md\:text-\[\#7C83FF\] { color: rgb(124, 131, 255); }
.md\:text-black { color: var(--color-black); }
.md\:text-white { color: var(--color-white); }
.md\:capitalize { text-transform: capitalize; }
}
}
@property --tw-translate-x { syntax: "*"; inherits: false; initial-value: 0; }
@property --tw-translate-y { syntax: "*"; inherits: false; initial-value: 0; }
@property --tw-translate-z { syntax: "*"; inherits: false; initial-value: 0; }
@property --tw-scale-x { syntax: "*"; inherits: false; initial-value: 1; }
@property --tw-scale-y { syntax: "*"; inherits: false; initial-value: 1; }
@property --tw-scale-z { syntax: "*"; inherits: false; initial-value: 1; }
@property --tw-rotate-x { syntax: "*"; inherits: false; }
@property --tw-rotate-y { syntax: "*"; inherits: false; }
@property --tw-rotate-z { syntax: "*"; inherits: false; }
@property --tw-skew-x { syntax: "*"; inherits: false; }
@property --tw-skew-y { syntax: "*"; inherits: false; }
@property --tw-pan-x { syntax: "*"; inherits: false; }
@property --tw-pan-y { syntax: "*"; inherits: false; }
@property --tw-pinch-zoom { syntax: "*"; inherits: false; }
@property --tw-scroll-snap-strictness { syntax: "*"; inherits: false; initial-value: proximity; }
@property --tw-space-y-reverse { syntax: "*"; inherits: false; initial-value: 0; }
@property --tw-space-x-reverse { syntax: "*"; inherits: false; initial-value: 0; }
@property --tw-divide-x-reverse { syntax: "*"; inherits: false; initial-value: 0; }
@property --tw-border-style { syntax: "*"; inherits: false; initial-value: solid; }
@property --tw-divide-y-reverse { syntax: "*"; inherits: false; initial-value: 0; }
@property --tw-gradient-position { syntax: "*"; inherits: false; }
@property --tw-gradient-from { syntax: "<color>"; inherits: false; initial-value: #0000; }
@property --tw-gradient-via { syntax: "<color>"; inherits: false; initial-value: #0000; }
@property --tw-gradient-to { syntax: "<color>"; inherits: false; initial-value: #0000; }
@property --tw-gradient-stops { syntax: "*"; inherits: false; }
@property --tw-gradient-via-stops { syntax: "*"; inherits: false; }
@property --tw-gradient-from-position { syntax: "<length-percentage>"; inherits: false; initial-value: 0%; }
@property --tw-gradient-via-position { syntax: "<length-percentage>"; inherits: false; initial-value: 50%; }
@property --tw-gradient-to-position { syntax: "<length-percentage>"; inherits: false; initial-value: 100%; }
@property --tw-leading { syntax: "*"; inherits: false; }
@property --tw-font-weight { syntax: "*"; inherits: false; }
@property --tw-tracking { syntax: "*"; inherits: false; }
@property --tw-ordinal { syntax: "*"; inherits: false; }
@property --tw-slashed-zero { syntax: "*"; inherits: false; }
@property --tw-numeric-figure { syntax: "*"; inherits: false; }
@property --tw-numeric-spacing { syntax: "*"; inherits: false; }
@property --tw-numeric-fraction { syntax: "*"; inherits: false; }
@property --tw-shadow { syntax: "*"; inherits: false; initial-value: 0 0 #0000; }
@property --tw-shadow-color { syntax: "*"; inherits: false; }
@property --tw-shadow-alpha { syntax: "<percentage>"; inherits: false; initial-value: 100%; }
@property --tw-inset-shadow { syntax: "*"; inherits: false; initial-value: 0 0 #0000; }
@property --tw-inset-shadow-color { syntax: "*"; inherits: false; }
@property --tw-inset-shadow-alpha { syntax: "<percentage>"; inherits: false; initial-value: 100%; }
@property --tw-ring-color { syntax: "*"; inherits: false; }
@property --tw-ring-shadow { syntax: "*"; inherits: false; initial-value: 0 0 #0000; }
@property --tw-inset-ring-color { syntax: "*"; inherits: false; }
@property --tw-inset-ring-shadow { syntax: "*"; inherits: false; initial-value: 0 0 #0000; }
@property --tw-ring-inset { syntax: "*"; inherits: false; }
@property --tw-ring-offset-width { syntax: "<length>"; inherits: false; initial-value: 0px; }
@property --tw-ring-offset-color { syntax: "*"; inherits: false; initial-value: #fff; }
@property --tw-ring-offset-shadow { syntax: "*"; inherits: false; initial-value: 0 0 #0000; }
@property --tw-outline-style { syntax: "*"; inherits: false; initial-value: solid; }
@property --tw-blur { syntax: "*"; inherits: false; }
@property --tw-brightness { syntax: "*"; inherits: false; }
@property --tw-contrast { syntax: "*"; inherits: false; }
@property --tw-grayscale { syntax: "*"; inherits: false; }
@property --tw-hue-rotate { syntax: "*"; inherits: false; }
@property --tw-invert { syntax: "*"; inherits: false; }
@property --tw-opacity { syntax: "*"; inherits: false; }
@property --tw-saturate { syntax: "*"; inherits: false; }
@property --tw-sepia { syntax: "*"; inherits: false; }
@property --tw-drop-shadow { syntax: "*"; inherits: false; }
@property --tw-drop-shadow-color { syntax: "*"; inherits: false; }
@property --tw-drop-shadow-alpha { syntax: "<percentage>"; inherits: false; initial-value: 100%; }
@property --tw-drop-shadow-size { syntax: "*"; inherits: false; }
@property --tw-backdrop-blur { syntax: "*"; inherits: false; }
@property --tw-backdrop-brightness { syntax: "*"; inherits: false; }
@property --tw-backdrop-contrast { syntax: "*"; inherits: false; }
@property --tw-backdrop-grayscale { syntax: "*"; inherits: false; }
@property --tw-backdrop-hue-rotate { syntax: "*"; inherits: false; }
@property --tw-backdrop-invert { syntax: "*"; inherits: false; }
@property --tw-backdrop-opacity { syntax: "*"; inherits: false; }
@property --tw-backdrop-saturate { syntax: "*"; inherits: false; }
@property --tw-backdrop-sepia { syntax: "*"; inherits: false; }
@property --tw-duration { syntax: "*"; inherits: false; }
@property --tw-ease { syntax: "*"; inherits: false; }
@property --tw-contain-size { syntax: "*"; inherits: false; }
@property --tw-contain-layout { syntax: "*"; inherits: false; }
@property --tw-contain-paint { syntax: "*"; inherits: false; }
@property --tw-contain-style { syntax: "*"; inherits: false; }
@property --tw-text-shadow-color { syntax: "*"; inherits: false; }
@property --tw-text-shadow-alpha { syntax: "<percentage>"; inherits: false; initial-value: 100%; }
@property --tw-content { syntax: "*"; inherits: false; initial-value: ""; }
@keyframes spin {
100% { transform: rotate(360deg); }
}
@keyframes ping {
75%, 100% { transform: scale(2); opacity: 0; }
}
@keyframes pulse {
50% { opacity: 0.5; }
}
@keyframes bounce {
0%, 100% { transform: translateY(-25%); animation-timing-function: cubic-bezier(0.8, 0, 1, 1); }
50% { transform: none; animation-timing-function: cubic-bezier(0, 0, 0.2, 1); }
}
@layer properties {
@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
*, ::before, ::after, ::backdrop { --tw-translate-x: 0; --tw-translate-y: 0; --tw-translate-z: 0; --tw-scale-x: 1; --tw-scale-y: 1; --tw-scale-z: 1; --tw-rotate-x: initial; --tw-rotate-y: initial; --tw-rotate-z: initial; --tw-skew-x: initial; --tw-skew-y: initial; --tw-pan-x: initial; --tw-pan-y: initial; --tw-pinch-zoom: initial; --tw-scroll-snap-strictness: proximity; --tw-space-y-reverse: 0; --tw-space-x-reverse: 0; --tw-divide-x-reverse: 0; --tw-border-style: solid; --tw-divide-y-reverse: 0; --tw-gradient-position: initial; --tw-gradient-from: #0000; --tw-gradient-via: #0000; --tw-gradient-to: #0000; --tw-gradient-stops: initial; --tw-gradient-via-stops: initial; --tw-gradient-from-position: 0%; --tw-gradient-via-position: 50%; --tw-gradient-to-position: 100%; --tw-leading: initial; --tw-font-weight: initial; --tw-tracking: initial; --tw-ordinal: initial; --tw-slashed-zero: initial; --tw-numeric-figure: initial; --tw-numeric-spacing: initial; --tw-numeric-fraction: initial; --tw-shadow: 0 0 #0000; --tw-shadow-color: initial; --tw-shadow-alpha: 100%; --tw-inset-shadow: 0 0 #0000; --tw-inset-shadow-color: initial; --tw-inset-shadow-alpha: 100%; --tw-ring-color: initial; --tw-ring-shadow: 0 0 #0000; --tw-inset-ring-color: initial; --tw-inset-ring-shadow: 0 0 #0000; --tw-ring-inset: initial; --tw-ring-offset-width: 0px; --tw-ring-offset-color: #fff; --tw-ring-offset-shadow: 0 0 #0000; --tw-outline-style: solid; --tw-blur: initial; --tw-brightness: initial; --tw-contrast: initial; --tw-grayscale: initial; --tw-hue-rotate: initial; --tw-invert: initial; --tw-opacity: initial; --tw-saturate: initial; --tw-sepia: initial; --tw-drop-shadow: initial; --tw-drop-shadow-color: initial; --tw-drop-shadow-alpha: 100%; --tw-drop-shadow-size: initial; --tw-backdrop-blur: initial; --tw-backdrop-brightness: initial; --tw-backdrop-contrast: initial; --tw-backdrop-grayscale: initial; --tw-backdrop-hue-rotate: initial; --tw-backdrop-invert: initial; --tw-backdrop-opacity: initial; --tw-backdrop-saturate: initial; --tw-backdrop-sepia: initial; --tw-duration: initial; --tw-ease: initial; --tw-contain-size: initial; --tw-contain-layout: initial; --tw-contain-paint: initial; --tw-contain-style: initial; --tw-text-shadow-color: initial; --tw-text-shadow-alpha: 100%; --tw-content: ""; }
}
}
/* Source: project-styles.css */


@layer base {
*, ::before, ::after, ::placeholder { font-family: var(--font-helvetica); }
button, input, optgroup, select, textarea { font-family: var(--font-helvetica); }
}
* { font-family: var(--font-helvetica); }
@keyframes pageFlip {
0% { transform: rotateY(180deg); opacity: 0; }
50% { transform: rotateY(90deg); opacity: 0.5; filter: brightness(1.2); }
100% { transform: rotateY(0deg); opacity: 1; }
}
@keyframes bookLoop {
0%, 85% { }
90% { }
100% { }
}
.swiper { width: 306px; height: 408px; }
.swiper-slide { width: 306px; height: 408px; }
.swiper-pagination { bottom: 60px !important; }
.swiper-pagination-bullet { background: rgba(255, 255, 255, 0.6); opacity: 1; }
.swiper-pagination-bullet-active { background: white; }
@keyframes float {
0%, 100% { transform: translateY(0px); }
50% { transform: translateY(-10px); }
}
@media (max-width: 770px) {
.textproduct { font-weight: 800; font-size: 30px; line-height: 100%; letter-spacing: 0%; vertical-align: bottom; }
}
@supports (animation-timeline: scroll()) {
@keyframes shiftBottom {
0% { bottom: 100px; }
100% { bottom: 50px; }
}
@media (max-width: 768px) {
@keyframes shiftBottom {
0% { bottom: 300px; }
100% { bottom: 250px; }
}
}
}
@media (min-width: 768px) and (max-width: 1023.98px) {
[class*="text-[40px]"] { font-size: 30px !important; line-height: 1.15 !important; }
}
.features-swiper .phone-mockup { box-shadow: none !important; filter: none !important; }
.product-swiper:not([data-product-slider="banana-style"]) img[src^="image/slider"][src$=".png"] { filter: drop-shadow(rgba(0, 0, 0, 0.4) -12px 20px 60px); }
@keyframes component-gentle-wobble {
0%, 100% { transform: rotate(0deg); }
25% { transform: rotate(-1.25deg); }
50% { transform: rotate(0deg); }
75% { transform: rotate(1.05deg); }
}
@keyframes berry-middle-settle {
0% { translate: 0px; rotate: 0deg; }
28% { translate: 1.5px 3px; rotate: 0.75deg; }
54% { translate: -1.25px -2px; rotate: -0.5deg; }
78% { translate: 0.75px 1px; rotate: 0.25deg; }
100% { translate: 0px; rotate: 0deg; }
}
@keyframes berry-middle-idle {
0%, 100% { translate: 0px; rotate: 0deg; }
30% { translate: 0.75px -1px; rotate: 0.22deg; }
65% { translate: -0.75px 0.75px; rotate: -0.2deg; }
}
.product-swiper:not([data-product-slider="banana-style"]) [data-product-card] { --product-cart-control: #ff4358; }
.product-swiper:not([data-product-slider="banana-style"]) .product-weight-option { box-sizing: border-box; margin: 0px; padding: 0px; outline: none; cursor: pointer; -webkit-tap-highlight-color: transparent; transition: border-color 180ms, background-color 180ms, transform 180ms cubic-bezier(0.22, 1, 0.36, 1); border: 2px solid transparent !important; }
.product-swiper:not([data-product-slider="banana-style"]) .product-weight-option:hover { border-color: rgba(154, 154, 154, 0.52) !important; }
.product-swiper:not([data-product-slider="banana-style"]) .product-weight-option:active { transform: scale(0.96); }
.product-swiper:not([data-product-slider="banana-style"]) .product-weight-option.is-selected { border-color: rgb(154, 154, 154) !important; }
.product-swiper:not([data-product-slider="banana-style"]) .product-weight-option:focus-visible { outline: rgb(17, 17, 17) solid 2px; outline-offset: 2px; }
.product-swiper:not([data-product-slider="banana-style"]) .product-cart-trigger { flex: 0 0 auto; border: 0px; cursor: pointer; -webkit-tap-highlight-color: transparent; }
.product-swiper:not([data-product-slider="banana-style"]) .product-cart-trigger:focus-visible { outline: rgb(255, 255, 255) solid 3px; outline-offset: 2px; }
.product-swiper:not([data-product-slider="banana-style"]) .product-quantity-control { display: none; width: 168px; height: 56px; flex: 0 0 168px; align-items: center; justify-content: space-between; overflow: hidden; border-radius: 28px; background: var(--product-cart-control); color: rgb(255, 255, 255); transform-origin: right center; }
.product-swiper:not([data-product-slider="banana-style"]) [data-product-card].is-cart-active .product-cart-trigger { display: none; }
.product-swiper:not([data-product-slider="banana-style"]) [data-product-card].is-cart-active .product-quantity-control { display: flex; animation: 360ms cubic-bezier(0.22, 1, 0.36, 1) 0s 1 normal both running product-cart-controls-in; }
.product-swiper:not([data-product-slider="banana-style"]) .product-quantity-button { display: grid; width: 56px; height: 56px; flex: 0 0 56px; place-items: center; margin: 0px; padding: 0px; border: 0px; border-radius: 999px; outline: none; background: transparent; color: inherit; cursor: pointer; -webkit-tap-highlight-color: transparent; transition: background-color 180ms, transform 180ms cubic-bezier(0.22, 1, 0.36, 1); }
.product-swiper:not([data-product-slider="banana-style"]) .product-quantity-button:hover { background: rgba(255, 255, 255, 0.12); }
.product-swiper:not([data-product-slider="banana-style"]) .product-quantity-button:active { transform: scale(0.88); }
.product-swiper:not([data-product-slider="banana-style"]) .product-quantity-button:focus-visible { outline: rgb(255, 255, 255) solid 2px; outline-offset: -4px; }
.product-swiper:not([data-product-slider="banana-style"]) .product-quantity-value { min-width: 24px; color: rgb(255, 255, 255); font-family: "Helvetica Now Var", Helvetica, Arial, sans-serif; font-size: 26px; font-weight: 400; line-height: 1; text-align: center; font-variant-numeric: tabular-nums; }
@keyframes product-cart-controls-in {
0% { opacity: 0; transform: scale(0.72); }
100% { opacity: 1; transform: scale(1); }
}
@media (prefers-reduced-motion: reduce) {
.product-swiper:not([data-product-slider="banana-style"]) .product-weight-option, .product-swiper:not([data-product-slider="banana-style"]) .product-quantity-button { transition: none; }
.product-swiper:not([data-product-slider="banana-style"]) [data-product-card].is-cart-active .product-quantity-control { animation: auto ease 0s 1 normal none running none; }
}
.goddess-product-section select, [data-slider-product-options] select, [data-float-product-options] select { color-scheme: light; font-family: "Helvetica Now Var", Helvetica, Arial, sans-serif; letter-spacing: 0px; font-weight: 400 !important; }
.goddess-product-section select option, [data-slider-product-options] select option, [data-float-product-options] select option { padding: 10px 14px; border: 0px; font-family: inherit; font-size: 16px; font-weight: 400; line-height: 1.35; }
[data-slider-product-options] select option { color: rgb(17, 17, 17); background-color: rgb(255, 255, 255); }
[data-slider-product-options] select option:checked { color: rgb(17, 17, 17); background: linear-gradient(0deg, rgb(241, 241, 237) 0%, rgb(241, 241, 237) 100%) rgb(241, 241, 237); }
[data-slider-product-options] select, [data-slider-product-options] .custom-select-trigger, [data-slider-product-options] select option { font-size: 14px !important; }
@media (min-width: 768px) {
[data-slider-product-options] select, [data-slider-product-options] .custom-select-trigger, [data-slider-product-options] select option { font-size: 20px !important; }
}
[data-float-product-options] select, [data-float-product-options] .custom-select-trigger, [data-float-product-options] select option { font-size: 20px !important; }
[data-float-product-options] .custom-select-trigger { justify-content: flex-start; color: rgb(255, 255, 255); box-sizing: border-box; backdrop-filter: none; padding: 0px 30px 0px 12px !important; width: 100% !important; height: 100% !important; border: 0.5px solid rgb(188, 188, 188) !important; border-radius: 72.6447px !important; background: rgba(20, 27, 169, 0.7) !important; }
[data-float-product-options] .custom-select-trigger > .custom-select-arrow { right: 12px !important; }
[data-float-product-options] .custom-select-trigger > .custom-select-arrow path { fill: rgb(255, 255, 255); }
@media (min-width: 768px) {
[data-float-product-options] select, [data-float-product-options] .custom-select-trigger, [data-float-product-options] select option { font-size: 20px !important; }
[data-float-product-options] .custom-select-trigger { backdrop-filter: blur(10.5552px); border-width: 1px !important; background: rgba(255, 255, 255, 0.1) !important; }
}
.custom-select-native { position: absolute !important; inset: 0px !important; width: 100% !important; height: 100% !important; opacity: 0 !important; pointer-events: none !important; }
.custom-select-trigger { position: relative; align-items: center; text-align: left; line-height: 1; white-space: nowrap; display: flex !important; font-weight: 400 !important; }
.custom-select-trigger--inline { padding-inline-end: min(2.08333vw, 40px) !important; }
.custom-select-trigger--pack-inline { padding-inline-start: min(7.55208vw, 145px) !important; }
.custom-select-trigger:focus-visible { box-shadow: rgba(17, 22, 170, 0.16) 0px 0px 0px 3px; }
.custom-select-trigger > .custom-select-arrow { flex: 0 0 10px; position: absolute !important; top: 50% !important; right: 16px !important; width: 10px !important; height: 6px !important; transform: translateY(-50%) !important; transform-origin: 50% 50% !important; display: block !important; }
.custom-select-menu { --custom-select-font-size: 16px; position: fixed; z-index: 99999; display: grid; gap: 3px; box-sizing: border-box; margin: 0px; padding: 5px; overflow: hidden auto; border: 1px solid rgba(169, 169, 169, 0.78); border-radius: 20px; color: rgb(17, 17, 17); background: rgba(255, 255, 255, 0.88); box-shadow: rgba(5, 11, 97, 0.12) 0px 12px 30px; backdrop-filter: blur(16px); opacity: 0; visibility: hidden; pointer-events: none; transform: translateY(-4px) scale(0.985); transform-origin: center top; transition: opacity 150ms, transform 150ms, visibility 150ms; }
.custom-select-menu.custom-select-menu--open { opacity: 1; visibility: visible; pointer-events: auto; transform: translateY(0px) scale(1); }
.custom-select-menu--goddess { border-color: rgba(255, 255, 255, 0.92); color: rgb(5, 11, 97); background: rgba(244, 248, 232, 0.9); }
.custom-select-menu--float { scrollbar-width: thin; scrollbar-color: rgba(255, 255, 255, 0.48) transparent; scrollbar-gutter: stable; scroll-behavior: smooth; overscroll-behavior: contain; border: 1px solid rgba(255, 255, 255, 0.34); border-radius: 10px; padding: 4px; color: rgb(255, 255, 255); background: rgba(20, 27, 169, 0.68); box-shadow: rgba(5, 11, 97, 0.12) 0px 8px 20px; backdrop-filter: blur(14px); }
.custom-select-menu--float::-webkit-scrollbar { width: 4px; }
.custom-select-menu--float::-webkit-scrollbar-track { margin-block: 7px; background: transparent; }
.custom-select-menu--float::-webkit-scrollbar-thumb { border-radius: 999px; background: rgba(255, 255, 255, 0.48); }
.custom-select-menu--float::-webkit-scrollbar-thumb:hover { background: rgba(255, 255, 255, 0.7); }
.custom-select-menu--float::-webkit-scrollbar-button, .custom-select-menu--float::-webkit-scrollbar-corner { display: none; width: 0px; height: 0px; }
.custom-select-menu--float .custom-select-option:hover, .custom-select-menu--float .custom-select-option:focus-visible { background: rgba(255, 255, 255, 0.12); }
.custom-select-menu--float .custom-select-option[aria-selected="true"] { color: rgb(255, 255, 255); background: rgba(218, 252, 95, 0.24); }
.custom-select-menu--float .custom-select-option { min-height: 30px; justify-content: flex-start; border-radius: 6px; padding: 5px 8px; color: rgb(255, 255, 255); text-shadow: none; }
@media (min-width: 768px) {
.custom-select-menu--float { border-radius: 12px; padding: 5px; background: rgba(255, 255, 255, 0.14); }
.custom-select-menu--float .custom-select-option { min-height: 32px; padding-inline: 10px; }
}
.custom-select-option { display: flex; min-height: 36px; width: 100%; align-items: center; box-sizing: border-box; border: 0px; border-radius: 15px; padding: 7px 14px; color: inherit; background: transparent; font-family: "Helvetica Now Var", Helvetica, Arial, sans-serif; font-size: var(--custom-select-font-size); font-weight: 400; line-height: 1.15; text-align: left; white-space: nowrap; cursor: pointer; transition: background-color 120ms; }
.custom-select-menu--goddess .custom-select-option { min-height: 42px; }
.custom-select-option:hover, .custom-select-option:focus-visible { outline: none; background: rgba(255, 255, 255, 0.72); }
.custom-select-option[aria-selected="true"] { background: rgba(218, 252, 95, 0.52); }
@media (prefers-reduced-motion: reduce) {
.custom-select-menu, .custom-select-option { transition: none; }
}
@layer base {
html.farsh22-page button:not(:disabled), html.farsh22-page [role="button"]:not(:disabled) { cursor: pointer; }
}
@media (min-width: 1500px) {
html.farsh22-page.truffle-page-b2b main.dashboard-main-panel > .dashboard-main-scroll > :last-child > :nth-child(2)::-webkit-scrollbar { width: 4px; }
html.farsh22-page.truffle-page-b2b main.dashboard-main-panel > .dashboard-main-scroll > :last-child > :nth-child(2)::-webkit-scrollbar-track { background: transparent; }
html.farsh22-page.truffle-page-b2b main.dashboard-main-panel > .dashboard-main-scroll > :last-child > :nth-child(2)::-webkit-scrollbar-thumb { background: var(--dashboard-scrollbar-color); border-radius: 999px; }
}
@keyframes f22-pageFlip {
0% { transform: rotateY(180deg); opacity: 0; }
50% { transform: rotateY(90deg); opacity: 0.5; filter: brightness(1.2); }
100% { transform: rotateY(0deg); opacity: 1; }
}
@keyframes f22-bookLoop {
0%, 85% { }
90% { }
100% { }
}
html.farsh22-page .swiper { width: 306px; height: 408px; }
html.farsh22-page .swiper-slide { width: 306px; height: 408px; }
html.farsh22-page .swiper-pagination { bottom: 60px !important; }
html.farsh22-page .swiper-pagination-bullet { background: rgba(255, 255, 255, 0.6); opacity: 1; }
html.farsh22-page .swiper-pagination-bullet-active { background: white; }
@keyframes f22-float {
0%, 100% { transform: translateY(0px); }
50% { transform: translateY(-10px); }
}
@supports (animation-timeline: scroll()) {
@keyframes f22-shiftBottom {
0% { bottom: 100px; }
100% { bottom: 50px; }
}
@media (max-width: 768px) {
@keyframes f22-shiftBottom {
0% { bottom: 300px; }
100% { bottom: 250px; }
}
}
}
html.farsh22-page .features-swiper .phone-mockup { box-shadow: none !important; filter: none !important; }
html.farsh22-page .product-swiper:not([data-product-slider="banana-style"]) img[src^="image/slider"][src$=".png"] { filter: drop-shadow(rgba(0, 0, 0, 0.4) -12px 20px 60px); }
@keyframes f22-component-gentle-wobble {
0%, 100% { transform: rotate(0deg); }
25% { transform: rotate(-1.25deg); }
50% { transform: rotate(0deg); }
75% { transform: rotate(1.05deg); }
}
@keyframes f22-berry-middle-settle {
0% { translate: 0px; rotate: 0deg; }
28% { translate: 1.5px 3px; rotate: 0.75deg; }
54% { translate: -1.25px -2px; rotate: -0.5deg; }
78% { translate: 0.75px 1px; rotate: 0.25deg; }
100% { translate: 0px; rotate: 0deg; }
}
@keyframes f22-berry-middle-idle {
0%, 100% { translate: 0px; rotate: 0deg; }
30% { translate: 0.75px -1px; rotate: 0.22deg; }
65% { translate: -0.75px 0.75px; rotate: -0.2deg; }
}
html.farsh22-page .product-swiper:not([data-product-slider="banana-style"]) [data-product-card] { --product-cart-control: #ff4358; }
html.farsh22-page .product-swiper:not([data-product-slider="banana-style"]) .product-weight-option { box-sizing: border-box; margin: 0px; padding: 0px; outline: none; cursor: pointer; -webkit-tap-highlight-color: transparent; transition: border-color 180ms, background-color 180ms, transform 180ms cubic-bezier(0.22, 1, 0.36, 1); border: 2px solid transparent !important; }
html.farsh22-page .product-swiper:not([data-product-slider="banana-style"]) .product-weight-option:hover { border-color: rgba(154, 154, 154, 0.52) !important; }
html.farsh22-page .product-swiper:not([data-product-slider="banana-style"]) .product-weight-option:active { transform: scale(0.96); }
html.farsh22-page .product-swiper:not([data-product-slider="banana-style"]) .product-weight-option.is-selected { border-color: rgb(154, 154, 154) !important; }
html.farsh22-page .product-swiper:not([data-product-slider="banana-style"]) .product-weight-option:focus-visible { outline: rgb(17, 17, 17) solid 2px; outline-offset: 2px; }
html.farsh22-page .product-swiper:not([data-product-slider="banana-style"]) .product-cart-trigger { flex: 0 0 auto; border: 0px; cursor: pointer; -webkit-tap-highlight-color: transparent; }
html.farsh22-page .product-swiper:not([data-product-slider="banana-style"]) .product-cart-trigger:focus-visible { outline: rgb(255, 255, 255) solid 3px; outline-offset: 2px; }
html.farsh22-page .product-swiper:not([data-product-slider="banana-style"]) .product-quantity-control { display: none; width: 168px; height: 56px; flex: 0 0 168px; align-items: center; justify-content: space-between; overflow: hidden; border-radius: 28px; background: var(--product-cart-control); color: rgb(255, 255, 255); transform-origin: right center; }
html.farsh22-page .product-swiper:not([data-product-slider="banana-style"]) [data-product-card].is-cart-active .product-cart-trigger { display: none; }
html.farsh22-page .product-swiper:not([data-product-slider="banana-style"]) [data-product-card].is-cart-active .product-quantity-control { display: flex; animation: 360ms cubic-bezier(0.22, 1, 0.36, 1) 0s 1 normal both running f22-product-cart-controls-in; }
html.farsh22-page .product-swiper:not([data-product-slider="banana-style"]) .product-quantity-button { display: grid; width: 56px; height: 56px; flex: 0 0 56px; place-items: center; margin: 0px; padding: 0px; border: 0px; border-radius: 999px; outline: none; background: transparent; color: inherit; cursor: pointer; -webkit-tap-highlight-color: transparent; transition: background-color 180ms, transform 180ms cubic-bezier(0.22, 1, 0.36, 1); }
html.farsh22-page .product-swiper:not([data-product-slider="banana-style"]) .product-quantity-button:hover { background: rgba(255, 255, 255, 0.12); }
html.farsh22-page .product-swiper:not([data-product-slider="banana-style"]) .product-quantity-button:active { transform: scale(0.88); }
html.farsh22-page .product-swiper:not([data-product-slider="banana-style"]) .product-quantity-button:focus-visible { outline: rgb(255, 255, 255) solid 2px; outline-offset: -4px; }
html.farsh22-page .product-swiper:not([data-product-slider="banana-style"]) .product-quantity-value { min-width: 24px; color: rgb(255, 255, 255); font-family: "Helvetica Now Var", Helvetica, Arial, sans-serif; font-size: 26px; font-weight: 400; line-height: 1; text-align: center; font-variant-numeric: tabular-nums; }
@keyframes f22-product-cart-controls-in {
0% { opacity: 0; transform: scale(0.72); }
100% { opacity: 1; transform: scale(1); }
}
@media (prefers-reduced-motion: reduce) {
html.farsh22-page .product-swiper:not([data-product-slider="banana-style"]) .product-weight-option, html.farsh22-page .product-swiper:not([data-product-slider="banana-style"]) .product-quantity-button { transition: none; }
html.farsh22-page .product-swiper:not([data-product-slider="banana-style"]) [data-product-card].is-cart-active .product-quantity-control { animation: auto ease 0s 1 normal none running none; }
}
html.farsh22-page [data-slider-product-options] select, html.farsh22-page [data-slider-product-options] .custom-select-trigger, html.farsh22-page [data-slider-product-options] select option { font-size: 14px !important; }
@media (min-width: 768px) {
html.farsh22-page [data-slider-product-options] select, html.farsh22-page [data-slider-product-options] .custom-select-trigger, html.farsh22-page [data-slider-product-options] select option { font-size: 20px !important; }
}
html.farsh22-page [data-float-product-options] select, html.farsh22-page [data-float-product-options] .custom-select-trigger, html.farsh22-page [data-float-product-options] select option { font-size: 20px !important; }
html.farsh22-page [data-float-product-options] .custom-select-trigger { justify-content: flex-start; color: rgb(255, 255, 255); box-sizing: border-box; backdrop-filter: none; padding: 0px 30px 0px 12px !important; width: 100% !important; height: 100% !important; border: 0.5px solid rgb(188, 188, 188) !important; border-radius: 72.6447px !important; background: rgba(20, 27, 169, 0.7) !important; }
html.farsh22-page [data-float-product-options] .custom-select-trigger > .custom-select-arrow { right: 12px !important; }
html.farsh22-page [data-float-product-options] .custom-select-trigger > .custom-select-arrow path { fill: rgb(255, 255, 255); }
@media (min-width: 768px) {
html.farsh22-page [data-float-product-options] select, html.farsh22-page [data-float-product-options] .custom-select-trigger, html.farsh22-page [data-float-product-options] select option { font-size: 20px !important; }
html.farsh22-page [data-float-product-options] .custom-select-trigger { backdrop-filter: blur(10.5552px); border-width: 1px !important; background: rgba(255, 255, 255, 0.1) !important; }
}
html.farsh22-page .custom-select-native { position: absolute !important; inset: 0px !important; width: 100% !important; height: 100% !important; opacity: 0 !important; pointer-events: none !important; }
html.farsh22-page .custom-select-trigger { position: relative; align-items: center; text-align: left; line-height: 1; white-space: nowrap; display: flex !important; font-weight: 400 !important; }
html.farsh22-page .custom-select-trigger--inline { padding-inline-end: min(2.08333vw, 40px) !important; }
html.farsh22-page .custom-select-trigger--pack-inline { padding-inline-start: min(7.55208vw, 145px) !important; }
html.farsh22-page .custom-select-trigger:focus-visible { box-shadow: rgba(17, 22, 170, 0.16) 0px 0px 0px 3px; }
html.farsh22-page .custom-select-trigger > .custom-select-arrow { flex: 0 0 10px; position: absolute !important; top: 50% !important; right: 16px !important; width: 10px !important; height: 6px !important; transform: translateY(-50%) !important; transform-origin: 50% 50% !important; display: block !important; }
html.farsh22-page .custom-select-menu { --custom-select-font-size: 16px; position: fixed; z-index: 99999; display: grid; gap: 3px; box-sizing: border-box; margin: 0px; padding: 5px; overflow: hidden auto; border: 1px solid rgba(169, 169, 169, 0.78); border-radius: 20px; color: rgb(17, 17, 17); background: rgba(255, 255, 255, 0.88); box-shadow: rgba(5, 11, 97, 0.12) 0px 12px 30px; backdrop-filter: blur(16px); opacity: 0; visibility: hidden; pointer-events: none; transform: translateY(-4px) scale(0.985); transform-origin: center top; transition: opacity 150ms, transform 150ms, visibility 150ms; }
html.farsh22-page .custom-select-menu.custom-select-menu--open { opacity: 1; visibility: visible; pointer-events: auto; transform: translateY(0px) scale(1); }
html.farsh22-page .custom-select-menu--goddess { border-color: rgba(255, 255, 255, 0.92); color: rgb(5, 11, 97); background: rgba(244, 248, 232, 0.9); }
html.farsh22-page .custom-select-menu--float { scrollbar-width: thin; scrollbar-color: rgba(255, 255, 255, 0.48) transparent; scrollbar-gutter: stable; scroll-behavior: smooth; overscroll-behavior: contain; border: 1px solid rgba(255, 255, 255, 0.34); border-radius: 10px; padding: 4px; color: rgb(255, 255, 255); background: rgba(20, 27, 169, 0.68); box-shadow: rgba(5, 11, 97, 0.12) 0px 8px 20px; backdrop-filter: blur(14px); }
html.farsh22-page .custom-select-menu--float::-webkit-scrollbar { width: 4px; }
html.farsh22-page .custom-select-menu--float::-webkit-scrollbar-track { margin-block: 7px; background: transparent; }
html.farsh22-page .custom-select-menu--float::-webkit-scrollbar-thumb { border-radius: 999px; background: rgba(255, 255, 255, 0.48); }
html.farsh22-page .custom-select-menu--float::-webkit-scrollbar-thumb:hover { background: rgba(255, 255, 255, 0.7); }
html.farsh22-page .custom-select-menu--float::-webkit-scrollbar-button, html.farsh22-page .custom-select-menu--float::-webkit-scrollbar-corner { display: none; width: 0px; height: 0px; }
html.farsh22-page .custom-select-menu--float .custom-select-option:hover, html.farsh22-page .custom-select-menu--float .custom-select-option:focus-visible { background: rgba(255, 255, 255, 0.12); }
html.farsh22-page .custom-select-menu--float .custom-select-option[aria-selected="true"] { color: rgb(255, 255, 255); background: rgba(218, 252, 95, 0.24); }
html.farsh22-page .custom-select-menu--float .custom-select-option { min-height: 30px; justify-content: flex-start; border-radius: 6px; padding: 5px 8px; color: rgb(255, 255, 255); text-shadow: none; }
@media (min-width: 768px) {
html.farsh22-page .custom-select-menu--float { border-radius: 12px; padding: 5px; background: rgba(255, 255, 255, 0.14); }
html.farsh22-page .custom-select-menu--float .custom-select-option { min-height: 32px; padding-inline: 10px; }
}
html.farsh22-page .custom-select-option { display: flex; min-height: 36px; width: 100%; align-items: center; box-sizing: border-box; border: 0px; border-radius: 15px; padding: 7px 14px; color: inherit; background: transparent; font-family: "Helvetica Now Var", Helvetica, Arial, sans-serif; font-size: var(--custom-select-font-size); font-weight: 400; line-height: 1.15; text-align: left; white-space: nowrap; cursor: pointer; transition: background-color 120ms; }
html.farsh22-page .custom-select-menu--goddess .custom-select-option { min-height: 42px; }
html.farsh22-page .custom-select-option:hover, html.farsh22-page .custom-select-option:focus-visible { outline: none; background: rgba(255, 255, 255, 0.72); }
html.farsh22-page .custom-select-option[aria-selected="true"] { background: rgba(218, 252, 95, 0.52); }
@media (prefers-reduced-motion: reduce) {
html.farsh22-page .custom-select-menu, html.farsh22-page .custom-select-option { transition: none; }
}
html.farsh22-page.friturez-theme button:hover:not(:disabled), html.farsh22-page.friturez-theme .status-btn:hover:not(:disabled) { background-color: rgba(218, 252, 95, 0.22) !important; border-color: rgba(154, 197, 0, 0.45) !important; color: rgb(31, 31, 31) !important; box-shadow: none !important; }
html.farsh22-page.friturez-theme :is(.fz-primary-button, button[class*="bg-[#C9A64A]"], button[class*="bg-[#d4af37]"], button[class*="bg-[#B89844]"]):hover:not(:disabled) { background-color: rgb(189, 236, 18) !important; border-color: rgb(189, 236, 18) !important; color: rgb(20, 27, 169) !important; }
.swiper { display: block; list-style: none; margin-left: auto; margin-right: auto; overflow: hidden; padding: 0px; position: relative; z-index: 1; }
.swiper-vertical > .swiper-wrapper { flex-direction: column; }
.swiper-wrapper { box-sizing: initial; display: flex; height: 100%; position: relative; transition-property: transform; transition-timing-function: var(--swiper-wrapper-transition-timing-function,initial); width: 100%; z-index: 1; }
.swiper-android .swiper-slide, .swiper-ios .swiper-slide, .swiper-wrapper { transform: translateZ(0px); }
.swiper-horizontal { touch-action: pan-y; }
.swiper-vertical { touch-action: pan-x; }
.swiper-slide { display: block; flex-shrink: 0; height: 100%; position: relative; transition-property: transform; width: 100%; }
.swiper-slide-invisible-blank { visibility: hidden; }
.swiper-autoheight, .swiper-autoheight .swiper-slide { height: auto; }
.swiper-autoheight .swiper-wrapper { align-items: flex-start; transition-property: transform, height; }
.swiper-backface-hidden .swiper-slide { backface-visibility: hidden; transform: translateZ(0px); }
.swiper-3d.swiper-css-mode .swiper-wrapper { perspective: 1200px; }
.swiper-3d .swiper-wrapper { transform-style: preserve-3d; }
.swiper-3d {
  perspective: 1200px;
  & .swiper-cube-shadow, & .swiper-slide { transform-style: preserve-3d; }
}
.swiper-css-mode {
  & > .swiper-wrapper {
  overflow: auto; scrollbar-width: none;
  &::-webkit-scrollbar { display: none; }
}
  & > .swiper-wrapper > .swiper-slide { scroll-snap-align: start; }
  &.swiper-horizontal {
  & > .swiper-wrapper { scroll-snap-type: x mandatory; }
  & > .swiper-wrapper > .swiper-slide:first-child { margin-inline-start: var(--swiper-slides-offset-before); scroll-margin-inline-start: var(--swiper-slides-offset-before); }
  & > .swiper-wrapper > .swiper-slide:last-child { margin-inline-end: var(--swiper-slides-offset-after); }
}
  &.swiper-vertical {
  & > .swiper-wrapper { scroll-snap-type: y mandatory; }
  & > .swiper-wrapper > .swiper-slide:first-child { margin-block-start: var(--swiper-slides-offset-before); scroll-margin-block-start: var(--swiper-slides-offset-before); }
  & > .swiper-wrapper > .swiper-slide:last-child { margin-block-end: var(--swiper-slides-offset-after); }
}
  &.swiper-free-mode {
  & > .swiper-wrapper { scroll-snap-type: none; }
  & > .swiper-wrapper > .swiper-slide { scroll-snap-align: none; }
}
  &.swiper-centered {
  & > .swiper-wrapper::before { content: ""; flex-shrink: 0; order: 9999; }
  & > .swiper-wrapper > .swiper-slide { scroll-snap-align: center; scroll-snap-stop: always; }
}
  &.swiper-centered.swiper-horizontal {
  & > .swiper-wrapper > .swiper-slide:first-child { margin-inline-start: var(--swiper-centered-offset-before); }
  & > .swiper-wrapper::before { height: 100%; min-height: 1px; width: var(--swiper-centered-offset-after); }
}
  &.swiper-centered.swiper-vertical {
  & > .swiper-wrapper > .swiper-slide:first-child { margin-block-start: var(--swiper-centered-offset-before); }
  & > .swiper-wrapper::before { height: var(--swiper-centered-offset-after); min-width: 1px; width: 100%; }
}
}
.swiper-3d {
  & .swiper-slide-shadow, & .swiper-slide-shadow-bottom, & .swiper-slide-shadow-left, & .swiper-slide-shadow-right, & .swiper-slide-shadow-top { height: 100%; left: 0px; pointer-events: none; position: absolute; top: 0px; width: 100%; z-index: 10; }
  & .swiper-slide-shadow { background: rgba(0, 0, 0, 0.15); }
  & .swiper-slide-shadow-left { background-image: linear-gradient(270deg, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); }
  & .swiper-slide-shadow-right { background-image: linear-gradient(90deg, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); }
  & .swiper-slide-shadow-top { background-image: linear-gradient(0deg, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); }
  & .swiper-slide-shadow-bottom { background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); }
}
.swiper-lazy-preloader { border-right-color: ; border-right-style: ; border-right-width: ; border-bottom-color: ; border-bottom-style: ; border-bottom-width: ; border-left-color: ; border-left-style: ; border-left-width: ; border-image-source: ; border-image-slice: ; border-image-width: ; border-image-outset: ; border-image-repeat: ; border-radius: 50%; border-top: 4px solid rgba(0, 0, 0, 0); box-sizing: border-box; height: 42px; left: 50%; margin-left: -21px; margin-top: -21px; position: absolute; top: 50%; transform-origin: 50% center; width: 42px; z-index: 10; }
.swiper-watch-progress .swiper-slide-visible, .swiper:not(.swiper-watch-progress) {
  & .swiper-lazy-preloader { animation: 1s linear 0s infinite normal none running swiper-preloader-spin; }
}
.swiper-lazy-preloader-white { --swiper-preloader-color: #fff; }
.swiper-lazy-preloader-black { --swiper-preloader-color: #000; }
@keyframes swiper-preloader-spin {
0% { transform: rotate(0deg); }
100% { transform: rotate(1turn); }
}
.swiper-virtual .swiper-slide { backface-visibility: hidden; transform: translateZ(0px); }
.swiper-virtual.swiper-css-mode {
  & .swiper-wrapper::after { content: ""; left: 0px; pointer-events: none; position: absolute; top: 0px; }
}
.swiper-virtual.swiper-css-mode.swiper-horizontal {
  & .swiper-wrapper::after { height: 1px; width: var(--swiper-virtual-size); }
}
.swiper-virtual.swiper-css-mode.swiper-vertical {
  & .swiper-wrapper::after { height: var(--swiper-virtual-size); width: 1px; }
}
.swiper-button-next, .swiper-button-prev {
  align-items: center; color: var(--swiper-navigation-color,var(--swiper-theme-color)); cursor: pointer; display: flex; height: var(--swiper-navigation-size); justify-content: center; position: absolute; width: var(--swiper-navigation-size); z-index: 10;
  &.swiper-button-disabled { cursor: auto; opacity: 0.35; pointer-events: none; }
  &.swiper-button-hidden { cursor: auto; opacity: 0; pointer-events: none; }
  .swiper-navigation-disabled & { display: none !important; }
  & ::slotted(svg), & svg { height: 100%; object-fit: contain; transform-origin: center center; width: 100%; fill: currentcolor; pointer-events: none; }
}
.swiper-button-lock { display: none; }
.swiper-button-next, .swiper-button-prev { margin-top: calc(0px - var(--swiper-navigation-size)/2); top: var(--swiper-navigation-top-offset,50%); }
.swiper-button-prev {
  left: var(--swiper-navigation-sides-offset,4px); right: auto;
  & .swiper-navigation-icon, & ::slotted(.swiper-navigation-icon) { transform: rotate(180deg); }
}
.swiper-button-next { left: auto; right: var(--swiper-navigation-sides-offset,4px); }
.swiper-horizontal {
  & .swiper-button-next, & .swiper-button-prev, & ~ .swiper-button-next, & ~ .swiper-button-prev { margin-left: 0px; margin-top: calc(0px - var(--swiper-navigation-size)/2); top: var(--swiper-navigation-top-offset,50%); }
  &.swiper-rtl .swiper-button-next, &.swiper-rtl ~ .swiper-button-next, & ~ .swiper-button-prev, & .swiper-button-prev { left: var(--swiper-navigation-sides-offset,4px); right: auto; }
  &.swiper-rtl .swiper-button-prev, &.swiper-rtl ~ .swiper-button-prev, & ~ .swiper-button-next, & .swiper-button-next { left: auto; right: var(--swiper-navigation-sides-offset,4px); }
  &.swiper-rtl .swiper-button-next, &.swiper-rtl ~ .swiper-button-next, & ~ .swiper-button-prev, & .swiper-button-prev {
  & .swiper-navigation-icon, & ::slotted(.swiper-navigation-icon) { transform: rotate(180deg); }
}
  &.swiper-rtl .swiper-button-prev, &.swiper-rtl ~ .swiper-button-prev {
  & .swiper-navigation-icon, & ::slotted(.swiper-navigation-icon) { transform: rotate(0deg); }
}
}
.swiper-vertical {
  & .swiper-button-next, & .swiper-button-prev, & ~ .swiper-button-next, & ~ .swiper-button-prev { left: var(--swiper-navigation-top-offset,50%); margin-left: calc(0px - var(--swiper-navigation-size)/2); margin-top: 0px; right: auto; }
  & .swiper-button-prev, & ~ .swiper-button-prev {
  bottom: auto; top: var(--swiper-navigation-sides-offset,4px);
  & .swiper-navigation-icon, & ::slotted(.swiper-navigation-icon) { transform: rotate(-90deg); }
}
  & .swiper-button-next, & ~ .swiper-button-next {
  bottom: var(--swiper-navigation-sides-offset,4px); top: auto;
  & .swiper-navigation-icon, & ::slotted(.swiper-navigation-icon) { transform: rotate(90deg); }
}
}
.swiper-pagination {
  position: absolute; text-align: center; transform: translateZ(0px); transition: opacity 0.3s; z-index: 10;
  &.swiper-pagination-hidden { opacity: 0; }
  &.swiper-pagination-disabled, .swiper-pagination-disabled > & { display: none !important; }
}
.swiper-horizontal > .swiper-pagination-bullets, .swiper-pagination-bullets.swiper-pagination-horizontal, .swiper-pagination-custom, .swiper-pagination-fraction { bottom: var(--swiper-pagination-bottom,8px); left: 0px; top: var(--swiper-pagination-top,auto); width: 100%; }
.swiper-pagination-bullets-dynamic {
  font-size: 0px; overflow: hidden;
  & .swiper-pagination-bullet { position: relative; transform: scale(0.33); }
  & .swiper-pagination-bullet-active, & .swiper-pagination-bullet-active-main { transform: scale(1); }
  & .swiper-pagination-bullet-active-prev { transform: scale(0.66); }
  & .swiper-pagination-bullet-active-prev-prev { transform: scale(0.33); }
  & .swiper-pagination-bullet-active-next { transform: scale(0.66); }
  & .swiper-pagination-bullet-active-next-next { transform: scale(0.33); }
}
.swiper-pagination-bullet {
  background: var(--swiper-pagination-bullet-inactive-color,#000); border-radius: var(--swiper-pagination-bullet-border-radius,50%); display: inline-block; height: var(--swiper-pagination-bullet-height,var(--swiper-pagination-bullet-size,8px)); opacity: var(--swiper-pagination-bullet-inactive-opacity,.2); width: var(--swiper-pagination-bullet-width,var(--swiper-pagination-bullet-size,8px));
  button& { appearance: none; border-width: medium; border-style: none; border-color: currentcolor; border-image: none; box-shadow: none; margin: 0px; padding: 0px; }
  .swiper-pagination-clickable & { cursor: pointer; }
  &:only-child { display: none !important; }
}
.swiper-pagination-bullet-active { background: var(--swiper-pagination-color,var(--swiper-theme-color)); opacity: var(--swiper-pagination-bullet-opacity,1); }
.swiper-pagination-vertical.swiper-pagination-bullets, .swiper-vertical > .swiper-pagination-bullets {
  left: var(--swiper-pagination-left,auto); right: var(--swiper-pagination-right,8px); top: 50%; transform: translate3d(0px, -50%, 0px);
  & .swiper-pagination-bullet { display: block; margin: var(--swiper-pagination-bullet-vertical-gap,6px) 0; }
  &.swiper-pagination-bullets-dynamic {
  top: 50%; transform: translateY(-50%); width: 8px;
  & .swiper-pagination-bullet { display: inline-block; transition: transform 0.2s, top 0.2s; }
}
}
.swiper-horizontal > .swiper-pagination-bullets, .swiper-pagination-horizontal.swiper-pagination-bullets {
  & .swiper-pagination-bullet { margin: 0 var(--swiper-pagination-bullet-horizontal-gap,4px); }
  &.swiper-pagination-bullets-dynamic {
  left: 50%; transform: translateX(-50%); white-space: nowrap;
  & .swiper-pagination-bullet { transition: transform 0.2s, left 0.2s; }
}
}
.swiper-horizontal.swiper-rtl > .swiper-pagination-bullets-dynamic .swiper-pagination-bullet { transition: transform 0.2s, right 0.2s; }
.swiper-pagination-fraction { color: var(--swiper-pagination-fraction-color,inherit); }
.swiper-pagination-progressbar {
  background: var(--swiper-pagination-progressbar-bg-color,#00000040); position: absolute;
  & .swiper-pagination-progressbar-fill { background: var(--swiper-pagination-color,var(--swiper-theme-color)); height: 100%; left: 0px; position: absolute; top: 0px; transform: scale(0); transform-origin: left top; width: 100%; }
  .swiper-rtl & .swiper-pagination-progressbar-fill { transform-origin: right top; }
  &.swiper-pagination-horizontal, &.swiper-pagination-vertical.swiper-pagination-progressbar-opposite, .swiper-horizontal > &, .swiper-vertical > &.swiper-pagination-progressbar-opposite { height: var(--swiper-pagination-progressbar-size,4px); left: 0px; top: 0px; width: 100%; }
  &.swiper-pagination-horizontal.swiper-pagination-progressbar-opposite, &.swiper-pagination-vertical, .swiper-horizontal > &.swiper-pagination-progressbar-opposite, .swiper-vertical > & { height: 100%; left: 0px; top: 0px; width: var(--swiper-pagination-progressbar-size,4px); }
}
.swiper-pagination-lock { display: none; }
.swiper-scrollbar {
  background: var(--swiper-scrollbar-bg-color,#0000001a); border-radius: var(--swiper-scrollbar-border-radius,10px); position: relative; touch-action: none;
  &.swiper-scrollbar-disabled, .swiper-scrollbar-disabled > & { display: none !important; }
  &.swiper-scrollbar-horizontal, .swiper-horizontal > & { bottom: var(--swiper-scrollbar-bottom,4px); height: var(--swiper-scrollbar-size,4px); left: var(--swiper-scrollbar-sides-offset,1%); position: absolute; top: var(--swiper-scrollbar-top,auto); width: calc(100% - var(--swiper-scrollbar-sides-offset, 1%)*2); z-index: 50; }
  &.swiper-scrollbar-vertical, .swiper-vertical > & { height: calc(100% - var(--swiper-scrollbar-sides-offset, 1%)*2); left: var(--swiper-scrollbar-left,auto); position: absolute; right: var(--swiper-scrollbar-right,4px); top: var(--swiper-scrollbar-sides-offset,1%); width: var(--swiper-scrollbar-size,4px); z-index: 50; }
}
.swiper-scrollbar-drag { background: var(--swiper-scrollbar-drag-bg-color,#00000080); border-radius: var(--swiper-scrollbar-border-radius,10px); height: 100%; left: 0px; position: relative; top: 0px; width: 100%; }
.swiper-scrollbar-cursor-drag { cursor: move; }
.swiper-scrollbar-lock { display: none; }
.swiper-zoom-container {
  align-items: center; display: flex; height: 100%; justify-content: center; text-align: center; width: 100%;
  & > canvas, & > img, & > svg { max-height: 100%; max-width: 100%; object-fit: contain; }
}
.swiper-slide-zoomed { cursor: move; touch-action: none; }
.swiper .swiper-notification { left: 0px; opacity: 0; pointer-events: none; position: absolute; top: 0px; z-index: -1000; }
.swiper-free-mode > .swiper-wrapper { margin: 0px auto; transition-timing-function: ease-out; }
.swiper-grid > .swiper-wrapper { flex-wrap: wrap; }
.swiper-grid-column > .swiper-wrapper { flex-flow: column wrap; }
.swiper-fade {
  &.swiper-free-mode {
  & .swiper-slide { transition-timing-function: ease-out; }
}
  & .swiper-slide {
  pointer-events: none; transition-property: opacity;
  & .swiper-slide { pointer-events: none; }
}
  & .swiper-slide-active {
  pointer-events: auto;
  & .swiper-slide-active { pointer-events: auto; }
}
}
.swiper.swiper-cube { overflow: visible; }
.swiper-cube {
  & .swiper-slide {
  backface-visibility: hidden; height: 100%; pointer-events: none; transform-origin: 0px 0px; visibility: hidden; width: 100%; z-index: 1;
  & .swiper-slide { pointer-events: none; }
}
  &.swiper-rtl .swiper-slide { transform-origin: 100% 0px; }
  & .swiper-slide-active {
  &, & .swiper-slide-active { pointer-events: auto; }
}
  & .swiper-slide-active, & .swiper-slide-next, & .swiper-slide-prev { pointer-events: auto; visibility: visible; }
  & .swiper-cube-shadow {
  bottom: 0px; height: 100%; left: 0px; opacity: 0.6; position: absolute; width: 100%; z-index: 0;
  &::before { background: rgb(0, 0, 0); inset: 0px; content: ""; filter: blur(50px); position: absolute; }
}
}
.swiper-cube {
  & .swiper-slide-next + .swiper-slide { pointer-events: auto; visibility: visible; }
}
.swiper-cube {
  & .swiper-slide-shadow-cube.swiper-slide-shadow-bottom, & .swiper-slide-shadow-cube.swiper-slide-shadow-left, & .swiper-slide-shadow-cube.swiper-slide-shadow-right, & .swiper-slide-shadow-cube.swiper-slide-shadow-top { backface-visibility: hidden; z-index: 0; }
}
.swiper.swiper-flip { overflow: visible; }
.swiper-flip {
  & .swiper-slide {
  backface-visibility: hidden; pointer-events: none; z-index: 1;
  & .swiper-slide { pointer-events: none; }
}
  & .swiper-slide-active {
  &, & .swiper-slide-active { pointer-events: auto; }
}
}
.swiper-flip {
  & .swiper-slide-shadow-flip.swiper-slide-shadow-bottom, & .swiper-slide-shadow-flip.swiper-slide-shadow-left, & .swiper-slide-shadow-flip.swiper-slide-shadow-right, & .swiper-slide-shadow-flip.swiper-slide-shadow-top { backface-visibility: hidden; z-index: 0; }
}
.swiper-creative {
  & .swiper-slide { backface-visibility: hidden; overflow: hidden; transition-property: transform, opacity, height; }
}
.swiper.swiper-cards { overflow: visible; }
.swiper-cards {
  & .swiper-slide { backface-visibility: hidden; overflow: hidden; transform-origin: center bottom; }
}
@keyframes daily-fortune-soft-pulse {
0%, 100% { opacity: 0; transform: scale(0.88); }
34% { opacity: 0.56; transform: scale(1.08); }
52% { opacity: 0.2; transform: scale(1.16); }
70% { opacity: 0.42; transform: scale(1.24); }
}
@keyframes daily-fortune-inner-pulse {
0%, 100% { opacity: 0.92; transform: scale(1); filter: brightness(1); }
50% { opacity: 1; transform: scale(1.045); filter: brightness(1.08) saturate(1.08); }
}
@media (max-width: 767.98px) {
.blueberry-page .product-swiper:not([data-product-slider="banana-style"]) .product-quantity-control { width: 130px; height: 48px; flex-basis: 130px; border-radius: 29.23px; }
.blueberry-page .product-swiper:not([data-product-slider="banana-style"]) .product-quantity-button { width: 48px; height: 48px; flex-basis: 48px; }
}
@keyframes daily-fortune-soft-pulse {
0%, 100% { opacity: 0; transform: scale(0.88); }
34% { opacity: 0.56; transform: scale(1.08); }
52% { opacity: 0.2; transform: scale(1.16); }
70% { opacity: 0.42; transform: scale(1.24); }
}
@keyframes daily-fortune-inner-pulse {
0%, 100% { opacity: 0.92; transform: scale(1); filter: brightness(1); }
50% { opacity: 1; transform: scale(1.045); filter: brightness(1.08) saturate(1.08); }
}
@media (max-width: 767.98px) {
.totfarangi-page .blueberry-page .product-swiper:not([data-product-slider="banana-style"]) .product-quantity-control { width: 130px; height: 48px; flex-basis: 130px; border-radius: 29.23px; }
.totfarangi-page .blueberry-page .product-swiper:not([data-product-slider="banana-style"]) .product-quantity-button { width: 48px; height: 48px; flex-basis: 48px; }
}
.product-swiper:not([data-product-slider="banana-style"]) { width: 100%; height: 100%; }
.product-swiper:not([data-product-slider="banana-style"]) .product-quantity-value { min-width: 24px; color: rgb(255, 255, 255); font-family: "Helvetica Now Var", Helvetica, Arial, sans-serif; font-size: 20px; font-weight: 400; line-height: 1; text-align: center; }
.product-swiper:not([data-product-slider="banana-style"]) [data-product-card] .flex.items-center.justify-between.mt-2:last-child { position: relative; min-height: 56px; }
.product-swiper:not([data-product-slider="banana-style"]) .product-cart-trigger, .product-swiper:not([data-product-slider="banana-style"]) .product-quantity-control { position: absolute; top: 0px; bottom: 0px; right: 0px; margin: auto; transform: none; }
.product-swiper:not([data-product-slider="banana-style"]) .product-cart-trigger { z-index: 2; }
.product-swiper:not([data-product-slider="banana-style"]) .product-quantity-control { z-index: 1; display: none; width: 168px; height: 56px; flex: 0 0 168px; align-items: center; justify-content: space-between; overflow: hidden; border-radius: 999px; padding: 0px 20px; background: var(--product-cart-control, #7c83ff); color: rgb(255, 255, 255); }
.product-swiper:not([data-product-slider="banana-style"]) .product-quantity-control:not(.hidden) { display: flex; }
.product-swiper:not([data-product-slider="banana-style"]) .product-quantity-button { display: grid; width: 56px; height: 56px; flex: 0 0 56px; place-items: center; margin: 0px; padding: 0px; border: 0px; border-radius: 999px; background: transparent; color: inherit; }
@media (max-width: 767.98px) {
.product-swiper:not([data-product-slider="banana-style"]) [data-product-card] .flex.items-center.justify-between.mt-2:last-child { min-height: 48px; }
.product-swiper:not([data-product-slider="banana-style"]) .product-quantity-control { width: 130px; height: 48px; flex-basis: 130px; padding: 0px 16px; }
.product-swiper:not([data-product-slider="banana-style"]) .product-quantity-button { width: 48px; height: 48px; flex-basis: 48px; }
}
.swiper-wrapper { display: flex; }
@keyframes daily-fortune-soft-pulse {
0%, 100% { opacity: 0; transform: scale(0.88); }
34% { opacity: 0.56; transform: scale(1.08); }
52% { opacity: 0.2; transform: scale(1.16); }
70% { opacity: 0.42; transform: scale(1.24); }
}
@keyframes daily-fortune-inner-pulse {
0%, 100% { opacity: 0.92; transform: scale(1); filter: brightness(1); }
50% { opacity: 1; transform: scale(1.045); filter: brightness(1.08) saturate(1.08); }
}
@media (max-width: 767.98px) {
.product-swiper:not([data-product-slider="banana-style"]) .product-quantity-control { width: 130px; height: 48px; flex-basis: 130px; border-radius: 29.23px; }
.product-swiper:not([data-product-slider="banana-style"]) .product-quantity-button { width: 48px; height: 48px; flex-basis: 48px; }
}
@media (min-width: 768px) and (max-width: 1200px) {
.features-swiper-shell { margin-top: clamp(84px, 10vw, 144px) !important; }
.features-swiper-shell .nav-btn { align-items: center; justify-content: center; border-radius: 999px; padding: 0px; top: auto !important; bottom: 12px !important; width: 40px !important; height: 40px !important; display: flex !important; transform: none !important; }
.features-swiper-shell .btn-prev { left: calc(50% - 50px) !important; right: auto !important; }
.features-swiper-shell .btn-next { left: calc(50% + 10px) !important; right: auto !important; }
.features-swiper-shell .nav-btn svg { width: 11px; height: 20px; }
}
@media (min-width: 768px) and (max-width: 1000px) {
.features-swiper-shell .nav-btn { display: none !important; }
.features-swiper .swiper-pagination { justify-content: center; align-items: center; pointer-events: auto; display: flex !important; }
}
@media (min-width: 768px) and (max-width: 1200px) {
.features-swiper-shell .nav-btn { display: flex !important; }
}
@media (min-width: 1201px) {
.features-swiper-shell .nav-btn { align-items: center; justify-content: center; padding: 0px; top: auto !important; bottom: 28px !important; display: flex !important; width: 40px !important; height: 40px !important; transform: none !important; }
.features-swiper-shell .btn-prev { left: calc(50% - 48px) !important; right: auto !important; }
.features-swiper-shell .btn-next { left: calc(50% + 8px) !important; right: auto !important; }
.features-swiper-shell .nav-btn svg { width: 20px; height: 20px; }
}
.features-swiper .phone-mockup { box-shadow: none !important; filter: none !important; }
.features-swiper .swiper-slide > div { box-shadow: none !important; filter: none !important; }
.features-swiper-shell .swiper-slide, .features-swiper-shell .swiper-slide > div, .features-swiper-shell .swiper-slide > div > .phone-mockup { box-shadow: none !important; filter: none !important; }
.features-swiper .swiper-slide-shadow, .features-swiper .swiper-slide-shadow-flip, .features-swiper .swiper-slide-shadow-bottom, .features-swiper .swiper-slide-shadow-top, .features-swiper .swiper-slide-shadow-left, .features-swiper .swiper-slide-shadow-right { display: none !important; opacity: 0 !important; background: transparent !important; }
@media (min-width: 1201px) {
.features-swiper-shell .btn-prev { left: calc(50% - 24px) !important; }
.features-swiper-shell .btn-next { left: calc(50% + 32px) !important; }
}
@media (min-width: 800px) and (max-width: 1000px) {
.features-swiper-shell .nav-btn { bottom: 96px !important; }
}
@media (min-width: 1001px) and (max-width: 1100px) {
.features-swiper-shell .nav-btn { display: none !important; }
}
@keyframes daily-fortune-visible-pulse {
0%, 100% { box-shadow: rgba(218, 252, 95, 0.7) 0px 0px 0px 0px, rgba(0, 0, 0, 0.1) 0px 10px 25px; }
50% { box-shadow: rgba(218, 252, 95, 0) 0px 0px 0px 12px, rgba(218, 252, 95, 0.48) 0px 10px 32px; }
}
@keyframes daily-fortune-visible-ring {
0% { opacity: 0.75; transform: scale(0.92); }
70%, 100% { opacity: 0; transform: scale(1.24); }
}
@media (min-width: 768px) and (max-width: 1919px) {
:scope.desktop-reference-canvas-page > main, :scope.desktop-reference-canvas-page > section, :scope.desktop-reference-canvas-page > footer, :scope.desktop-reference-canvas-page > div:not(.desktop-reference-canvas) { width: 1920px; max-width: none; zoom: clamp(0.4, 100vw / 1920px, 1); }
}
/* Source: animations.css */
@keyframes ffAboutFruitFloat {
0%, 100% { translate: 0px; }
50% { translate: 0px -22px; }
}
@keyframes ffAboutTiltFloat {
0%, 100% { transform: rotate(-2.6deg); }
50% { transform: rotate(2.6deg); }
}

        /* اختیاری: اگر به هر دلیل CSS سوایپر دیر لود شد، این fallback کمک می‌کند */
        .product-swiper:not([data-product-slider="banana-style"]) {
            width: 100%;
            height: 100%;
            overflow: visible;
        }

        .swiper-wrapper {
            display: flex;
        }

        .blog-recipes-swiper {
            width: 100%;
            height: 260px;
            overflow: visible;
        }

        .blog-recipes-swiper .swiper-slide {
            width: 280px;
            min-width: 280px;
            height: 260px;
        }

        [data-blog-text-motion] {
            will-change: opacity, transform;
        }

        [data-blog-text-motion].blog-text-motion-fallback {
            opacity: 0;
            transform: translate3d(0, 48px, 0);
            transition: opacity 900ms cubic-bezier(.22, 1, .36, 1),
                transform 900ms cubic-bezier(.22, 1, .36, 1);
        }

        [data-blog-text-motion].blog-text-motion-fallback.is-visible {
            opacity: 1;
            transform: translate3d(0, 0, 0);
        }

        @media (min-width: 768px) {
            .blog-recipes-swiper {
                height: 384px;
            }

            .blog-recipes-swiper .swiper-slide {
                width: 414px;
                min-width: 414px;
                height: 384px;
            }
        }


        @media (max-width: 767px) {
            #cart-title-img {
                width: 420px !important;
                max-width: none !important;
                height: 32px !important;
                margin-left: -15px !important;
                margin-right: 0 !important;
            }
        }

        .rect {
            --clip-size: 50px;

            clip-path: polygon(round 20px,
                    100% 0,
                    0 var(--clip-size),
                    0 calc(100% - var(--clip-size)),
                    100% 100%);
        }

        @media (max-width: 391px) {
            .rect {
                --clip-size: 35px;
            }
        }

}
/* Recipe middle content follows the 998px frontend column. The utility
   classes are kept in the markup, while these stable selectors also cover
   pages served from an already-built stylesheet. */
@media (min-width: 768px) {
  .freshfruit-blogs-content[data-blogs-preview="blog-single"] .recipe-middle-content {
    /* 998px content column + the existing 96px left padding. */
    width: 1094px;
  }

  .freshfruit-blogs-content[data-blogs-preview="blog-single"] .recipe-middle-card {
    min-height: 442px;
  }

  .freshfruit-blogs-content[data-blogs-preview="blog-single"] .recipe-prep-chip {
    width: max-content;
    min-width: 105px;
    padding-left: 16px;
    padding-right: 16px;
    white-space: nowrap;
  }
}