@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;600;700;800&display=swap');
:root{--cream:#fbf6e9;--green:#245b37;--ink:#193c28;--yellow:#f8c749;--line:#d8ddcb}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:100px}body{margin:0;background:var(--cream);color:var(--ink);font-family:'DM Sans',Arial,sans-serif;font-size:16px;line-height:1.6}a{color:inherit;text-decoration:none}button{font:inherit}img{display:block;max-width:100%}.announcement{text-align:center;background:var(--green);color:var(--cream);padding:8px 16px;font-size:13px;letter-spacing:.08em}header{max-width:1440px;margin:auto;display:flex;align-items:center;justify-content:space-between;padding:25px 5%;gap:24px}.brand{font-family:Georgia,serif;font-size:34px;line-height:1;letter-spacing:-1.5px}.brand span{display:block;font-family:'DM Sans',sans-serif;font-size:9px;letter-spacing:1.4px;margin-top:10px}nav{display:flex;gap:34px;font-size:14px}nav a:hover{border-bottom:1px solid var(--green)}.button{display:inline-flex;justify-content:center;align-items:center;background:var(--green);color:#fff;padding:16px 27px;border-radius:100px;font-size:15px;font-weight:600;border:1px solid var(--green);transition:background .2s,transform .2s}.button:hover{background:#173e26;transform:translateY(-2px)}.small{padding:12px 23px;font-size:14px}.hero{max-width:1440px;margin:auto;display:grid;grid-template-columns:1.05fr 1fr;padding:22px 5% 65px;gap:6%;align-items:center}.hero-copy{padding:30px 0}.eyebrow{font-size:12px;font-weight:700;letter-spacing:2px;margin:0 0 23px}h1{font-family:Georgia,serif;font-weight:400;font-size:clamp(60px,6.7vw,99px);line-height:1.01;letter-spacing:-5px;margin:0 0 27px}h1 em{font-weight:400;color:#367b43}p{margin:0 0 24px}.intro{max-width:410px;font-size:17px;color:#52624f}.hero-notes{display:flex;gap:20px;font-size:12px;margin-top:30px}.hero-notes span:before{content:'✓';margin-right:7px}.hero-image{position:relative;height:590px}.hero-image>img{width:100%;height:100%;object-fit:cover;border-radius:160px 160px 16px 16px}.sun-label{position:absolute;left:-36px;top:47px;background:var(--yellow);width:140px;height:140px;border-radius:50%;display:flex;flex-direction:column;justify-content:center;text-align:center;font-size:14px;line-height:1.5;transform:rotate(-12deg);box-shadow:0 0 0 7px var(--cream)}.sun-label strong{font-family:Georgia,serif;font-size:19px}.image-caption{position:absolute;bottom:22px;left:0;right:0;text-align:center;color:white;font-size:11px;letter-spacing:2.5px}.ribbon{display:flex;justify-content:center;align-items:center;gap:34px;flex-wrap:wrap;background:var(--yellow);padding:21px 25px;font-size:14px;font-weight:600}.ribbon b{font-size:23px}.section{max-width:1280px;margin:auto;padding:95px 5%}h2{font-family:Georgia,serif;font-weight:400;font-size:clamp(38px,4.2vw,61px);line-height:1.1;letter-spacing:-2px;margin:0 0 25px}h3{font-size:21px;line-height:1.3;margin:0 0 14px}.split{display:grid;grid-template-columns:1fr 1fr;gap:8%;align-items:center}.section p{color:#53654f}.section .eyebrow{color:var(--green)}footer{background:var(--green);color:var(--cream);padding:55px 6% 25px;display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap}footer p{margin:0}footer>a:last-of-type{font-size:14px;text-decoration:underline}.footer-bottom{flex-basis:100%;display:flex;justify-content:space-between;border-top:1px solid #ffffff33;margin-top:25px;padding-top:20px;font-size:12px;color:#d5e0cf}.skip{position:fixed;top:-70px;left:10px;background:#fff;padding:12px;z-index:50}.skip:focus{top:10px}:focus-visible{outline:3px solid #cd7e14;outline-offset:5px}
@media(max-width:900px){h1{letter-spacing:-3px}.hero{gap:7%;padding-bottom:40px}.hero-image{height:490px}.hero-notes{gap:10px;flex-wrap:wrap}.sun-label{height:115px;width:115px;left:-22px}.ribbon{gap:18px}.ribbon span:last-child,.ribbon b:last-of-type{display:none}nav{gap:20px}.section{padding:65px 6%}}
@media(max-width:640px){header{padding:23px 6%;flex-wrap:wrap}.brand{font-size:30px}header .small{padding:10px 16px;font-size:12px}nav{order:3;justify-content:center;width:100%;padding-top:8px;font-size:13px}.hero{grid-template-columns:1fr;padding:0 6% 35px;gap:25px}.hero-copy{padding:23px 0 0}h1{font-size:64px}.intro{font-size:16px}.eyebrow{font-size:10px;letter-spacing:1.6px}.hero-image{height:460px;margin-left:15px;margin-top:5px}.hero-image>img{border-radius:140px 140px 14px 14px}.sun-label{left:-18px;top:25px}.hero-notes{font-size:12px;gap:18px}.ribbon{gap:10px 18px;font-size:12px}.ribbon b{font-size:17px}.ribbon span:nth-of-type(3),.ribbon b:nth-of-type(2){display:none}.split{grid-template-columns:1fr;gap:34px}.section{padding:58px 6%}.footer-bottom{flex-direction:column;gap:10px}footer{padding:40px 6% 25px;align-items:flex-start;flex-direction:column}footer p{font-size:14px}}
.product-visual{position:relative}.photo-crop{height:530px;overflow:hidden;border-radius:16px 160px 16px 16px;background:#f7f0df}.photo-crop img{height:100%;width:180%;max-width:none;object-fit:cover;object-position:right;transform:translateX(-43%)}.product-tag{position:absolute;bottom:24px;left:20px;background:var(--cream);border-radius:50px;padding:11px 20px;font-family:Georgia,serif;font-style:italic;font-size:18px}.flavours{display:flex;gap:9px;flex-wrap:wrap}.flavours span{padding:7px 14px;border-radius:30px;font-size:13px}.orange{background:#ffe0a5;color:#673b0b}.strawberry{background:#f7d2d3;color:#872c3c}.mango{background:#f5e697;color:#64520b}.product-facts{display:flex;gap:30px;margin:30px 0;padding:21px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.product-facts strong{display:block;font-family:Georgia,serif;font-size:29px;font-weight:400}.product-facts span{font-size:12px}.order-row{display:flex;gap:12px;align-items:center;flex-wrap:wrap}.quantity{display:flex;border:1px solid #b0bca6;border-radius:100px;align-items:center;height:57px;overflow:hidden}.quantity button{width:38px;height:100%;border:0;background:transparent;color:var(--green);font-size:22px;cursor:pointer}.quantity button:disabled{opacity:.35;cursor:default}.quantity output{min-width:25px;text-align:center}.section .order-note{font-size:12px;margin-top:12px;margin-bottom:0}.story{background:#e8eddc}.story-photo{height:480px;overflow:hidden;border-radius:160px 160px 16px 16px}.story-photo img{width:205%;height:100%;max-width:none;object-fit:cover;transform:translateX(-48%)}.text-link{font-size:14px;font-weight:600;border-bottom:1px solid var(--green);padding-bottom:5px}.routine>h2{max-width:620px}.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:30px;margin-top:40px}.step-photo{height:330px;background-image:url('assets/routine.jpeg');background-size:auto 510px;border-radius:110px 110px 10px 10px;background-repeat:no-repeat;background-color:#efe6d4}.step-one{background-position:7% 90%}.step-two{background-position:50% 90%}.step-three{background-position:93% 90%}.step-heading{display:flex;gap:13px;align-items:baseline;margin-top:22px}.step-heading>span{font-size:12px;color:#6c7d61}.step-heading h3{font-size:20px;font-family:Georgia,serif;font-weight:400}.steps p{font-size:14px;max-width:310px}.faq-section{background:#f2edde}.faq-section .split{align-items:start}.faqs details{border-bottom:1px solid #cfd3c0}.faqs summary{list-style:none;padding:21px 25px 21px 0;font-size:16px;cursor:pointer;position:relative;line-height:1.5}.faqs summary::-webkit-details-marker{display:none}.faqs summary:after{content:'+';position:absolute;right:0;font-size:22px;top:15px}.faqs details[open] summary:after{content:'−'}.faqs details p{font-size:14px;padding-right:18px}.contact{text-align:center}.contact>p:not(.eyebrow){margin-bottom:25px}.contact-links{display:flex;justify-content:center;gap:24px;flex-wrap:wrap;margin-top:30px;font-size:13px}.contact-links a:hover{text-decoration:underline}
@media(max-width:900px){.product-facts{gap:18px}.steps{gap:20px}.step-photo{height:270px;background-size:auto 440px}.product .button{padding:14px 19px}.contact-links{gap:14px}.photo-crop{height:490px}}
@media(max-width:640px){.photo-crop{height:420px}.story-photo{height:420px}.steps{grid-template-columns:1fr;gap:28px}.step-photo{height:340px;background-size:auto 535px}.step-one{background-position:5% 90%}.step-three{background-position:95% 90%}.steps p{max-width:none;margin-bottom:0}.product-facts{gap:32px}.contact-links{flex-direction:column;overflow-wrap:anywhere}.contact h2{font-size:44px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}
