:root{color-scheme:light;--ink:#122d2d;--muted:#526666;--green:#07574e;--cream:#f7f6ef;--line:#dce5dd;--mint:#e9f2e9;--accent:#ddf786}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:100px}
body{margin:0;background:var(--cream);color:var(--ink);font-family:Manrope,Arial,sans-serif;-webkit-font-smoothing:antialiased}
html[lang=ar] body{font-family:Cairo,Arial,sans-serif}
button,a{-webkit-tap-highlight-color:transparent}
a{color:inherit;text-decoration:none}
button{font:inherit;cursor:pointer}
img{max-width:100%;display:block}
a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid #31786b;outline-offset:5px}
.skip{position:absolute;transform:translateY(-200%);background:white;padding:1rem;z-index:5}
.skip:focus{transform:translateY(0)}
.wrap{width:min(1352px,calc(100% - 96px));margin-inline:auto}
header{background:var(--cream);position:sticky;top:0;z-index:4;border-bottom:1px solid var(--line)}
.nav{height:78px;display:flex;align-items:center;justify-content:space-between;gap:22px}
.brand{display:grid;line-height:1.05;gap:6px;direction:ltr;text-align:left;font-family:Manrope,Arial,sans-serif;flex-shrink:0}
.brand strong{font-size:31px;font-weight:800;letter-spacing:-.088em}
.brand small{color:var(--green);font-size:10px;font-weight:800;letter-spacing:.075em}
nav{display:flex;gap:30px;align-items:center;font-size:14px;font-weight:750}
nav a:hover,.simple:hover{color:#08776a;text-decoration:underline;text-underline-offset:5px}
.actions,.hero-actions{display:flex;align-items:center;gap:12px}
.lang{background:transparent;border:1px solid #a8bbb2;color:var(--ink);border-radius:100px;padding:8px 14px;min-height:42px;font-weight:800}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:14px;min-height:52px;border:1px solid transparent;padding:10px 22px;border-radius:999px;font-weight:800;font-size:14px;line-height:1.45;transition:background .18s,color .18s,border-color .18s}
.btn.primary{background:var(--green);color:white}
.btn.primary:hover{background:#073e36}
.btn.light{background:var(--accent);color:#17342c}
.btn.light:hover{background:#efffae}
.btn.outline{border-color:#a7b9af}
.btn.outline:hover{background:#e8f1e8}
.btn.small{min-height:42px;padding:7px 17px}
.arrow{font-family:Arial,sans-serif;font-size:19px;line-height:1}
[dir=rtl] .arrow{transform:scaleX(-1)}
.hero{display:grid;grid-template-columns:1fr 1fr;min-height:530px;margin-top:24px;background:#e5efe6;border:1px solid #d5e4d9;border-radius:33px;overflow:hidden}
.hero-copy{padding:54px clamp(28px,5.2vw,76px);align-self:center}
.eyebrow{color:var(--green);font-size:12px;font-weight:850;letter-spacing:.1em;text-transform:uppercase;margin:0 0 18px;display:flex;gap:8px;align-items:center}
.eyebrow::before{content:"";display:inline-block;width:8px;height:8px;background:#4a8b72;border-radius:50%;flex:none}
[lang=ar] .eyebrow{letter-spacing:0}
h1,h2,h3,p{margin-top:0}
h1{font-size:clamp(47px,5.2vw,84px);line-height:1.02;letter-spacing:-.079em;margin-bottom:23px;font-weight:850}
h1 em{color:var(--green);font-style:normal;display:block}
[lang=ar] h1{letter-spacing:-.049em;line-height:1.19;font-size:clamp(44px,5.15vw,79px)}
.hero-copy>p:not(.eyebrow){color:#344f49;font-size:17px;line-height:1.8;max-width:440px;margin-bottom:30px}
.hero-visual{position:relative;background:#b6dedc;min-height:100%;display:grid;place-items:center;overflow:hidden}
.hero-visual>img{position:absolute;width:100%;height:100%;object-fit:cover;inset:0}
.hero-visual .photo-label{position:absolute;inset-inline-start:20px;bottom:20px;margin:0;background:#f9fbf2;color:var(--ink);padding:6px 15px;border-radius:99px;font-size:12px;font-weight:800}
.trust{display:grid;grid-template-columns:repeat(3,1fr);margin-top:22px;border-block:1px solid var(--line);padding:19px 0}
.trust div{text-align:center;font-weight:800;font-size:14px;padding:0 10px}
.trust div+div{border-inline-start:1px solid var(--line)}
.trust span{color:#367c63;margin-inline-end:6px}
section{margin-top:74px}
h2{font-size:clamp(32px,4vw,58px);line-height:1.12;letter-spacing:-.065em;margin-bottom:14px;font-weight:850}
[lang=ar] h2{letter-spacing:-.045em;line-height:1.25}
.section-head{display:flex;justify-content:space-between;align-items:end;gap:25px;margin-bottom:24px}
.section-head p:last-child,.faq-intro p{color:var(--muted);margin-bottom:0;line-height:1.65}
.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:17px}
.card{background:#fdfcf7;border:1px solid var(--line);border-radius:23px;overflow:hidden;display:flex;flex-direction:column}
.card-media{display:block;aspect-ratio:1.12;overflow:hidden;background:var(--mint)}
.card-media img{width:100%;height:100%;object-fit:cover;transition:transform .3s}
.card-media:hover img{transform:scale(1.035)}
.card-body{padding:23px;display:flex;flex:1;flex-direction:column;align-items:start}
.color{margin:0 0 8px;color:var(--green);font-weight:850;font-size:12px}
.color::before{content:"";display:inline-block;width:9px;height:9px;border:1px solid #596967;border-radius:50%;margin-inline-end:7px;background:var(--swatch);vertical-align:middle}
.card h3{font-family:Manrope,Arial,sans-serif;font-size:26px;line-height:1.16;letter-spacing:-.052em;margin-bottom:10px}
.card-body>p:not(.color){color:var(--muted);font-size:14px;line-height:1.65;margin-bottom:20px}
.card-body .btn{margin-top:auto}
.feature{background:#104841;color:white;border-radius:26px;padding:42px clamp(24px,5vw,70px);display:grid;grid-template-columns:1fr 1fr;gap:38px;align-items:center}
.feature .eyebrow,.feature p{color:#def2e6}
.feature .eyebrow::before{background:var(--accent)}
.feature p:last-child{margin:0}
.steps{display:grid;gap:13px}
.step{border-top:1px solid #ffffff50;padding-top:12px;font-size:15px;line-height:1.65}
.step strong{color:var(--accent);display:block}
.faq{display:grid;grid-template-columns:2fr 3fr;gap:48px}
details{border-top:1px solid #cfddd2}
details:last-child{border-bottom:1px solid #cfddd2}
summary{list-style:none;cursor:pointer;font-weight:800;padding:17px 0;display:flex;justify-content:space-between;align-items:center;gap:10px}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";font-size:22px;color:var(--green);line-height:1}
details[open]>summary::after{content:"−"}
details p{color:var(--muted);line-height:1.7;margin-bottom:17px}
.help{margin-bottom:60px;background:#e6f0e6;border-radius:22px;padding:25px 30px;display:flex;justify-content:space-between;align-items:center;gap:24px}
.help h2{font-size:clamp(26px,3vw,39px);margin:0}
footer{border-top:1px solid var(--line);padding:23px 0}
.foot{display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap}
.foot-logo{width:122px;height:54px;object-fit:contain}
footer a{font-weight:800;font-size:13px}
@media(max-width:900px){.wrap{width:calc(100% - 48px)}nav{gap:16px}.hero{min-height:455px}.hero-copy{padding:35px 24px}.hero-actions{flex-wrap:wrap}.card-body{padding:16px}}
@media(max-width:680px){.wrap{width:calc(100% - 28px)}.nav{height:65px;gap:10px}.brand strong{font-size:27px}.brand small{font-size:9px}nav,.nav .shop-top{display:none}.hero{margin-top:14px;border-radius:23px;grid-template-columns:1fr}.hero-copy{padding:30px 21px 28px}.hero-copy>p:not(.eyebrow){font-size:15px;margin-bottom:20px}.hero-visual{min-height:0;aspect-ratio:1.15}.eyebrow{margin-bottom:12px}.trust{padding:13px 0;margin-top:16px}.trust div{font-size:11px;padding:0 5px}.trust span{margin-inline-end:2px}section{margin-top:48px}.section-head{display:block}.grid{grid-template-columns:1fr;gap:15px}.card-media{aspect-ratio:1.32}.card-body{padding:19px}.feature,.faq{grid-template-columns:1fr;gap:24px}.feature{padding:25px 21px}.help{margin-bottom:42px;flex-wrap:wrap;padding:19px}.btn{min-height:46px;padding-inline:16px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important}}
.hero-visual{isolation:isolate;background:radial-gradient(ellipse at 49% 32%,#e9fffa 0%,#b8e2de 37%,#7ac6c2 74%,#63b3b0 100%)}
.hero-visual::before,.hero-visual::after{position:absolute;content:"";z-index:-1;pointer-events:none}
.hero-visual::before{width:77%;height:83%;inset:9% 11%;border:1px solid #f7ffffa3;border-radius:50%;box-shadow:0 0 0 23px #f7ffff21,0 0 0 49px #f7ffff18,0 0 0 79px #f7ffff13;transform:rotate(-32deg)}
.hero-visual::after{width:46%;height:14%;left:27%;bottom:8%;border-radius:50%;background:#235d625d;filter:blur(24px);transform:rotate(-8deg)}
.hero-visual>img{object-fit:contain;width:77%;height:85%;inset:6% 11.5% 9%;filter:drop-shadow(13px 20px 22px #235d6268);transform:rotate(-9deg)}
.card-media img{object-fit:contain}
.card-media.elite{background:#e4eff8}
.card-media.mint,.card-media.pink{background:#fff}
.foot-logo{object-position:left center}
[dir=rtl] .foot-logo{object-position:right center}