:root{--cream:#f4ebdf;--paper:#fbf7ef;--green:#123c2b;--green-deep:#0b2e21;--green-muted:#4e6558;--orange:#f5a125;--line:#c6cbbb;--white:#fffaf0;--sans:'Sora',sans-serif;--serif:'Cormorant Garamond',serif;--arabic:'IBM Plex Sans Arabic',sans-serif;--header-h:100px;--gutter:clamp(24px,5.2vw,88px)}
*{box-sizing:border-box}html{scroll-behavior:smooth;scrollbar-color:var(--green) var(--cream);scrollbar-width:thin;scroll-padding-top:100px}body{margin:0;background:var(--cream);color:var(--green);font-family:var(--sans);font-weight:400;-webkit-font-smoothing:antialiased}body,button,input,select,textarea{font-size:14px}button,input,select,textarea{font:inherit}button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}a{color:inherit;text-decoration:none}button{cursor:pointer;color:inherit}button,select{touch-action:manipulation}svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}img{display:block;max-width:100%}button{border:0;background:none}button:disabled{cursor:wait;opacity:.55}h1,h2,h3,p{margin:0}h1,h2{text-wrap:balance;font-weight:500;letter-spacing:-.04em;line-height:1.08}h1 em,h2 em{font-family:var(--serif);font-weight:500;letter-spacing:-.035em;font-size:1.16em;line-height:.98}p{line-height:1.8}::selection{background:var(--orange);color:var(--green-deep)}:focus-visible{outline:2px solid currentColor;outline-offset:6px}input,textarea{caret-color:var(--green)}[hidden]{display:none!important}.icon-defs{position:absolute;width:0;height:0;overflow:hidden}.is-loading{overflow:hidden}.skip-link{position:fixed;top:12px;left:20px;z-index:100;padding:16px;background:var(--green);color:var(--white);transform:translateY(-150%)}.skip-link:focus{transform:none}

.header{height:var(--header-h);position:absolute;inset:0 0 auto;z-index:20;display:flex;align-items:center;justify-content:space-between;padding:0 var(--gutter);gap:24px}.kemet-brand{display:flex;align-items:center;gap:10px;font-size:19px;font-weight:600;line-height:1.1;letter-spacing:-.025em;min-width:170px}.kemet-brand img{width:38px;height:43px;object-fit:contain}.kemet-brand__small{display:block;font-size:12px;font-weight:400;letter-spacing:.12em;margin-top:4px}.header__fruivera{font-size:21px;letter-spacing:-.025em;font-weight:700;position:absolute;left:50%;transform:translateX(-50%)}.header__fruivera span,.footer__brand span{font-size:.4em;vertical-align:top;line-height:1.5;margin-inline-start:3px}.header__nav{display:flex;align-items:center;gap:28px;font-size:12px}.nav-link{position:relative}.nav-link::after{content:'';height:1px;position:absolute;left:0;right:0;bottom:-5px;background:currentColor;transform:scaleX(0);transform-origin:left;transition:transform .2s}.nav-link:hover::after{transform:scaleX(1)}.language{font-family:var(--arabic);padding:10px 0;min-width:48px}.header__contact{display:flex;align-items:center;gap:12px;padding:12px 16px;background:var(--green);color:var(--white);border-radius:4px;transition:background .2s}.header__contact:hover{background:var(--green-deep)}.header__contact svg{width:17px;height:17px}

.story{height:650svh;position:relative}.story__viewport{height:100svh;min-height:600px;overflow:hidden;position:relative;background:var(--cream)}.story__visual{position:absolute;inset:55px 0 0;mask-image:linear-gradient(to bottom,transparent 0%,#000 9%,#000 91%,transparent 100%)}.story__poster,#product-canvas{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}.story__poster{transition:opacity .2s}.has-frame .story__poster{opacity:0}#product-canvas{opacity:0}.has-frame #product-canvas{opacity:1}.story__content{position:absolute;inset:0;pointer-events:none}.chapter{position:absolute;left:var(--gutter);top:50%;transform:translateY(-48%);max-width:510px;width:37%;pointer-events:auto}.chapter h1,.chapter h2{font-size:clamp(46px,5vw,76px)}.chapter__description{font-size:14px;max-width:35ch;line-height:1.9;color:var(--green-muted);margin-top:30px}.chapter .text-link{margin-top:30px}.chapter--fruit,.chapter--inside{opacity:0;visibility:hidden;pointer-events:none}.chapter--fruit h2,.chapter--inside h2{font-size:clamp(42px,4.8vw,70px)}.text-link{display:inline-flex;gap:22px;align-items:center;font-size:12px;font-weight:500;padding:9px 0;border-bottom:1px solid currentColor;line-height:1.5;transition:gap .2s}.text-link:hover{gap:30px}.text-link svg{width:19px;height:19px}.story__bottom{position:absolute;bottom:35px;inset-inline:var(--gutter);display:flex;justify-content:space-between;align-items:center;gap:20px;font-size:11px;z-index:2}.scroll-cue{display:flex;align-items:center;gap:15px}.scroll-cue svg{height:20px;width:20px}.chapter-nav{display:flex;align-items:center;gap:23px}.chapter-nav button{display:flex;align-items:center;gap:8px;font-size:10px;padding:12px 0;color:var(--green-muted);transition:color .2s}.chapter-nav button>span:first-child{width:5px;height:5px;border:1px solid currentColor;border-radius:50%;transition:background .2s}.chapter-nav button.is-active{color:var(--green)}.chapter-nav button.is-active>span:first-child{background:var(--green)}.motion-switch{font-size:10px;color:var(--green-muted);text-decoration:underline;text-underline-offset:4px;padding:12px 0}.story__progress{height:2px;position:absolute;inset:auto 0 0;background:rgba(18,60,43,.09)}.story__progress span{display:block;width:100%;height:100%;background:var(--green);transform-origin:left;transform:scaleX(0)}.native-scroll .story__viewport{position:sticky;top:0}.static-mode .story{height:100svh;min-height:600px}.static-mode .chapter-nav,.static-mode .story__progress,.static-mode .motion-switch{display:none}.static-mode .story__viewport{position:relative!important;transform:none!important}.static-mode .scroll-cue{display:flex}

.brand-story{background:var(--green);color:var(--white);padding:100px var(--gutter) 0;display:grid;grid-template-columns:1.2fr 1fr;gap:40px 10%;position:relative;overflow:hidden}.brand-story h2{font-size:clamp(38px,4.2vw,64px)}.brand-story__copy{padding-top:10px;max-width:50ch}.brand-story__copy p{color:#d4dfd0;font-size:14px;line-height:1.95}.text-link--light{color:var(--white);margin-top:24px}.brand-story__word{grid-column:1/-1;font-size:clamp(72px,15.2vw,248px);line-height:1.3;letter-spacing:-.04em;font-weight:600;color:#e4e9d8;white-space:nowrap;margin:25px 0 -16px;direction:ltr}.brand-story__word span{font-size:.13em;vertical-align:top;position:relative;top:1.2em;margin-left:4px}.section{padding:110px var(--gutter)}.collection{background:var(--paper);scroll-margin-top:0}.section__intro{display:grid;grid-template-columns:1.2fr 1fr;gap:10%;align-items:end;margin-bottom:70px}.section__intro h2{font-size:clamp(36px,4.4vw,64px)}.section__intro p{max-width:46ch;color:var(--green-muted);font-size:14px}.variety-layout{display:grid;grid-template-columns:1.2fr 1fr;gap:10%;border-top:1px solid var(--line);padding-top:40px}.variety-selector{align-self:start;max-width:420px}.variety{display:flex;justify-content:space-between;align-items:center;width:100%;padding:19px 0;font-size:clamp(30px,3.4vw,49px);font-weight:400;letter-spacing:-.035em;border-bottom:1px solid var(--line);text-align:start;color:var(--green-muted)}.variety svg{width:30px;height:30px;transform:rotate(-45deg);transition:transform .25s}.variety.is-active{color:var(--green);font-weight:500}.variety.is-active svg{transform:rotate(0);color:#9b5a00}.variety:hover svg{transform:translateX(4px)}.variety-selector>p{font-size:12px;color:var(--green-muted);margin-top:24px}.specification h3{font-size:19px;font-weight:500;letter-spacing:-.02em;margin:11px 0 28px}.specs{margin:0 0 26px}.specs>div{display:grid;grid-template-columns:1fr 1.3fr;gap:20px;padding:17px 0;border-bottom:1px solid var(--line);font-size:12px;line-height:1.7}.specs dt{color:var(--green-muted)}.specs dd{margin:0;text-align:end;font-weight:500;font-variant-numeric:tabular-nums}.spec-sizes{max-width:240px;justify-self:end}.specification__note{font-size:10px;line-height:1.8;color:var(--green-muted);margin-top:17px;max-width:45ch}

.enquiry{background:var(--cream);display:grid;grid-template-columns:1.2fr 1fr;gap:10%;border-top:1px solid var(--line)}.enquiry h2{font-size:clamp(38px,4.6vw,66px)}.enquiry__intro>p{margin-top:25px;max-width:38ch;color:var(--green-muted);font-size:13px}.contact-email{display:flex;align-items:center;gap:20px;font-size:clamp(13px,1.5vw,20px);margin-top:45px;font-weight:500;direction:ltr;width:fit-content}.contact-email svg{width:18px;height:18px}.contact-phone{display:block;width:fit-content;font-size:12px;color:var(--green-muted);margin-top:15px;text-decoration:underline;text-underline-offset:5px}.enquiry-form{padding-top:8px}.enquiry-form label{display:flex;flex-direction:column;gap:12px;margin-bottom:28px;font-size:11px}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:25px}.enquiry-form input,.enquiry-form select,.enquiry-form textarea{background:transparent;border:0;border-bottom:1px solid #7c8f7c;border-radius:0;color:var(--green);padding:5px 0 12px;width:100%;font-size:12px;min-height:40px;resize:vertical}.enquiry-form input::placeholder,.enquiry-form textarea::placeholder{color:#54695b;opacity:1}.enquiry-form textarea{line-height:1.8}.enquiry-form input:focus,.enquiry-form select:focus,.enquiry-form textarea:focus{outline:0;border-bottom:2px solid var(--green)}.submit-button{width:100%;display:flex;align-items:center;justify-content:space-between;padding:20px 22px;background:var(--green);color:var(--white);font-size:12px;transition:background .2s;border-radius:4px}.submit-button:hover{background:var(--green-deep)}.submit-button svg{height:20px;width:20px}.form-note{font-size:10px;color:var(--green-muted);margin-top:12px}.footer{background:var(--green-deep);color:var(--white);padding:35px var(--gutter);display:flex;align-items:center;justify-content:space-between;gap:25px;font-size:10px}.footer__brand{font-size:23px;font-weight:600;letter-spacing:-.025em}.footer>a:last-child{display:flex;gap:12px;align-items:center}.footer svg{width:14px;height:14px}.footer>span{color:#d4dfd0}

.loader{position:fixed;inset:0;background:var(--green);color:var(--white);z-index:100;display:flex;align-items:center;justify-content:center;flex-direction:column;padding:32px}.loader__brand{position:absolute;top:50px;font-weight:600;font-size:30px;letter-spacing:-.03em}.loader__brand span{font-size:12px;vertical-align:top;margin-left:3px}.loader__center{width:min(100%,440px)}.loader__title{font-family:var(--serif);font-style:italic;font-size:35px;line-height:1.25;margin-bottom:34px}.loader__line{height:2px;background:#62816b;overflow:hidden}.loader__line span{display:block;height:100%;background:var(--orange);transform:scaleX(0);transform-origin:left;transition:transform .18s linear}.loader__status{display:flex;justify-content:space-between;gap:15px;font-size:10px;margin-top:18px;color:#e1e8d8;font-variant-numeric:tabular-nums}.loader progress{position:absolute;clip:rect(0,0,0,0);width:1px;height:1px;overflow:hidden}.loader__recovery{margin-top:24px;font-size:11px}.loader__recovery p{color:#e1e8d8}.loader__recovery button{color:var(--white);font-size:11px;padding:10px 0;border-bottom:1px solid currentColor;margin:10px 20px 0 0}.loader__by{position:absolute;bottom:35px;font-size:9px;letter-spacing:.12em}.noscript-note{position:fixed;bottom:0;left:0;right:0;background:var(--green);color:var(--white);padding:10px 24px;font-size:11px;z-index:30}

html[dir=rtl] body{font-family:var(--arabic)}html[dir=rtl] h1,html[dir=rtl] h2{letter-spacing:0;line-height:1.3;font-weight:500}html[dir=rtl] h1 em,html[dir=rtl] h2 em{font-family:var(--arabic);font-style:normal;font-size:1em;font-weight:400;letter-spacing:0;line-height:1.3}html[dir=rtl] .chapter{direction:rtl;text-align:right}html[dir=rtl] .chapter__description{font-size:16px}html[dir=rtl] .header{direction:ltr}html[dir=rtl] .header__nav{direction:rtl;font-size:14px}html[dir=rtl] .language{font-family:var(--sans);font-size:11px}html[dir=rtl] .brand-story__copy p,html[dir=rtl] .section__intro p{font-size:16px}html[dir=rtl] .specs>div{font-size:14px}html[dir=rtl] .text-link{font-size:14px}html[dir=rtl] .text-link svg,html[dir=rtl] .variety svg{transform:rotate(180deg)}html[dir=rtl] .enquiry-form label,html[dir=rtl] .enquiry-form input,html[dir=rtl] .enquiry-form select,html[dir=rtl] .enquiry-form textarea{font-size:14px}html[dir=rtl] .enquiry__intro>p{font-size:15px}html[dir=rtl] .loader__title{font-family:var(--arabic);font-style:normal;font-size:28px}html[dir=rtl] .kemet-brand,html[dir=rtl] .header__fruivera,html[dir=rtl] .footer__brand{font-family:var(--sans)}html[dir=rtl] .story__bottom{direction:ltr}html[dir=rtl] .chapter-nav{direction:rtl}

@media(min-width:1700px){.story__visual{inset:20px 0 0}.chapter{max-width:560px}.chapter h1{font-size:82px}}
@media(max-width:1100px){:root{--gutter:40px;--header-h:88px}.header__nav{gap:20px}.header__fruivera{font-size:18px}.kemet-brand{min-width:140px}.chapter{width:39%}.chapter h1,.chapter h2{font-size:48px}.chapter__description{font-size:12px;max-width:31ch}.chapter-nav{gap:15px}.scroll-cue{gap:8px}.brand-story,.section__intro,.variety-layout,.enquiry{gap:7%}.brand-story{padding-top:75px}.section{padding-top:85px;padding-bottom:85px}.contact-email{font-size:15px}}
@media(max-width:700px){:root{--gutter:24px;--header-h:80px}html{scroll-padding-top:30px}.header{gap:12px}.kemet-brand{min-width:0;font-size:15px;gap:6px}.kemet-brand img{height:32px;width:28px}.kemet-brand__small{font-size:9px;letter-spacing:.08em;margin-top:3px}.header__fruivera{font-size:15px;left:52%}.header__nav{gap:14px}.nav-link,.header__contact{display:none}.language{font-size:13px;min-width:40px}.story{height:500svh}.story__viewport{min-height:660px}.story__visual{inset:31% 0 12%;mask-image:linear-gradient(to bottom,transparent,#000 12%,#000 88%,transparent)}.chapter{left:var(--gutter);top:17%;transform:none;width:calc(100% - var(--gutter)*2);max-width:520px}.chapter h1,.chapter h2{font-size:43px;line-height:1.1}.chapter__description{font-size:12px;max-width:39ch;line-height:1.8;margin-top:20px}.chapter .text-link{font-size:11px;margin-top:13px;gap:14px}.chapter--fruit,.chapter--inside{top:17%}.story__bottom{bottom:22px;flex-wrap:wrap;gap:8px;justify-content:center}.scroll-cue{width:100%;justify-content:center;font-size:10px}.chapter-nav{width:100%;justify-content:space-between;gap:10px}.chapter-nav button{font-size:9px;gap:6px}.motion-switch{padding:4px;font-size:9px}.brand-story{display:block;padding-top:65px}.brand-story h2{font-size:40px}.brand-story__copy{margin-top:30px;max-width:48ch}.brand-story__copy p{font-size:12px}.brand-story__word{font-size:15vw;line-height:1.6;margin-top:30px;margin-bottom:-11px}.section{padding-top:65px;padding-bottom:65px}.section__intro{display:block;margin-bottom:40px}.section__intro h2{font-size:39px}.section__intro p{margin-top:27px;font-size:12px}.variety-layout{display:block;padding-top:20px}.variety-selector{display:grid;grid-template-columns:1fr 1fr;max-width:none;gap:0 25px}.variety{font-size:27px;padding:18px 0}.variety svg{width:21px;height:21px}.variety-selector>p{grid-column:1/-1;margin-top:15px;font-size:11px}.specification{margin-top:33px}.specification h3{font-size:17px;margin-bottom:14px}.specs>div{font-size:11px;gap:15px;padding:14px 0;grid-template-columns:.8fr 1.3fr}.specification__note{font-size:10px}.enquiry{display:block}.enquiry h2{font-size:40px}.enquiry__intro>p{font-size:12px}.contact-email{margin-top:28px;font-size:15px;gap:12px}.enquiry-form{margin-top:40px}.form-row{gap:20px}.enquiry-form label{font-size:11px}.enquiry-form input,.enquiry-form textarea{font-size:11px}.footer{flex-wrap:wrap;padding-top:30px;padding-bottom:30px;gap:24px 15px}.footer__brand{font-size:21px}.footer>span{font-size:9px;margin-inline-start:auto}.footer>a:last-child{width:100%;font-size:10px}.loader__title{font-size:29px}.static-mode .story{min-height:690px}html[dir=rtl] .chapter h1,html[dir=rtl] .chapter h2{font-size:39px;line-height:1.2}html[dir=rtl] .chapter__description{font-size:14px;margin-top:16px}html[dir=rtl] .brand-story__copy p,html[dir=rtl] .section__intro p{font-size:14px}html[dir=rtl] .enquiry h2{font-size:37px}html[dir=rtl] .specs>div{font-size:13px}}
@media(max-width:360px){.header__fruivera{font-size:13px}.chapter h1,.chapter h2{font-size:37px}.chapter__description{font-size:11px}.chapter{top:16%}.form-row{grid-template-columns:1fr;gap:0}.chapter-nav button{font-size:8px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important;animation:none!important}.story{height:100svh}.story__viewport{position:relative}.chapter-nav,.motion-switch{display:none}}

/* Feather only the studio plate edges; the product remains fully inside the image. */
.story__visual{mask-image:linear-gradient(to right,transparent,#000 5%,#000 95%,transparent),linear-gradient(to bottom,transparent,#000 10%,#000 89%,transparent);mask-composite:intersect}
.static-mode .motion-switch{display:block}
@media(max-width:700px){html[dir=ltr] .chapter--fruit h2{font-size:34px}.story__visual{mask-image:linear-gradient(to bottom,transparent,#000 12%,#000 88%,transparent);mask-composite:add}}
@media(prefers-reduced-motion:reduce){.static-mode .motion-switch{display:none}}

/* Keep the feather on the image bounds rather than its letterboxed container. */
.story__visual{inset:auto;left:50%;top:calc(50% + 27.5px);width:min(100%,calc((100svh - 55px)*1.7777778));height:auto;aspect-ratio:16/9;transform:translate(-50%,-50%);mask-image:linear-gradient(to right,transparent,#000 2%,#000 98%,transparent),linear-gradient(to bottom,transparent,#000 3%,#000 97%,transparent);mask-composite:intersect}
@media(max-width:700px){.story__visual{top:59.5%;width:100%;height:auto;mask-image:linear-gradient(to bottom,transparent,#000 7%,#000 93%,transparent);mask-composite:add}}
@media(max-height:600px) and (min-width:701px){:root{--header-h:64px}.story__viewport{min-height:0}.chapter{top:54%}.chapter h1,.chapter h2{font-size:35px}.chapter__description{font-size:11px;margin-top:16px}.chapter .text-link{margin-top:12px}.story__bottom{bottom:15px}.brand-story__word{font-size:14vw}}

/* Readable functional type at the smallest supported viewport. */
.kemet-brand__small{font-size:11px}
.chapter-nav button,.motion-switch,.scroll-cue{font-size:12px;min-height:44px}
.chapter-nav{gap:20px}
.specification__note,.form-note,.footer,.footer>span,.footer>a:last-child,.loader__status,.loader__recovery,.loader__recovery button,.loader__by{font-size:12px}
.brand-story__copy p,.footer>span{color:var(--white)}
.brand-story{padding-bottom:24px}
.brand-story__word{margin-bottom:0}
@media(max-width:700px){.chapter-nav{gap:8px}.chapter-nav button,.motion-switch,.scroll-cue{font-size:11px}.kemet-brand__small{font-size:11px}.header__fruivera{left:54%}.chapter .text-link,.variety-selector>p,.enquiry-form label,.enquiry-form input,.enquiry-form textarea,.specs>div{font-size:12px}.footer,.footer>span,.footer>a:last-child,.specification__note,.form-note{font-size:12px}.footer>span{margin-inline-start:0}.chapter-nav button{gap:6px}.story__bottom{bottom:12px;gap:0}.loader__by{font-size:11px;letter-spacing:.06em}}
@media(max-width:360px){.chapter-nav button{font-size:11px;gap:5px}.kemet-brand{font-size:14px}.header__fruivera{font-size:13px}}
html.lenis{scroll-behavior:auto}

/* Match the surrounding mobile studio to each frame's empty edge colours. */
#studio-backdrop{display:none;position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
@media(max-width:700px){
  #studio-backdrop{display:block}
  .story__visual{mask-image:linear-gradient(to right,transparent,#000 4%,#000 96%,transparent),linear-gradient(to bottom,transparent,#000 18%,#000 82%,transparent);mask-composite:intersect}
  .chapter--intro .text-link{background:transparent;color:var(--green);padding:9px 0;min-height:44px;border-bottom:1px solid currentColor;border-radius:0;width:fit-content;font-size:13px;margin-bottom:32px}
  html[dir=rtl] .chapter--intro .text-link{font-size:14px}
}

/* Keep Arabic copy clear of the product, preserving the image orientation. */
@media(min-width:701px){html[dir=rtl] .chapter{padding-right:clamp(24px,3vw,48px)}}
@media(max-width:700px){.story__visual{top:calc(59.5% + 24px)}}