:root{--cream:#f6f1e7;--white:#fffdf8;--ink:#26231e;--green:#43503a;--gold:#c59a45;--line:#ddd4c5}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--cream);color:var(--ink);font-family:"DM Sans",sans-serif}header{height:74px;padding:0 6%;display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;z-index:10;background:#f6f1e7ee;border-bottom:1px solid var(--line);backdrop-filter:blur(8px)}.logo{color:var(--green);text-decoration:none;font-weight:700;letter-spacing:3px}.logo span{font-weight:400}nav{display:flex;gap:28px}nav a,footer a{color:inherit;text-decoration:none;font-size:14px}.cart{border:1px solid var(--ink);background:none;border-radius:30px;padding:9px 15px;cursor:pointer}.cart b{margin-left:5px}.hero{min-height:640px;padding:70px 8%;display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:center}.eyebrow{font-size:11px;font-weight:700;letter-spacing:2.4px;color:var(--green);margin:0 0 18px}.hero h1{font:600 clamp(55px,7vw,88px)/1.02 "Playfair Display",serif;margin:0 0 24px}.hero h1 i{color:var(--gold)}.lead{font-size:18px;line-height:1.7;max-width:520px;margin-bottom:30px}.btn{display:inline-block;padding:15px 23px;background:var(--green);color:#fff;text-decoration:none;font-weight:700}.hero-art{display:grid;place-items:center}.jar{width:min(390px,80%);height:430px;border-radius:48% 48% 16px 16px;background:radial-gradient(circle at 50% 28%,#f3db8d,#c99e48 48%,#755624);display:grid;place-items:center;box-shadow:28px 28px 0 #e5ddce}.jar strong{width:120px;height:120px;border:1px solid #fff9;border-radius:50%;display:grid;place-items:center;text-align:center;color:white;letter-spacing:3px}.jar small{font-size:11px;letter-spacing:4px}.statement{text-align:center;background:var(--white);padding:105px 20px}.statement h2,.heading h2,.about h2,.banner h2,.contact h2{font:600 48px/1.08 "Playfair Display",serif;margin:0 0 22px}.statement>p:last-child{max-width:650px;margin:auto;line-height:1.8}.shop{padding:100px 7%}.heading{display:flex;justify-content:space-between;align-items:end;margin-bottom:38px}.heading>p{color:#777}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}.product{background:var(--white);border:1px solid var(--line)}.photo{height:330px;display:grid;place-items:center}.photo span{background:#fffdf2;padding:24px;text-align:center;color:var(--green);font-weight:700;letter-spacing:3px;box-shadow:0 15px 30px #0002}.shea{background:linear-gradient(135deg,#eedc96,#b99037)}.mango{background:linear-gradient(135deg,#f3bd5e,#d8792d)}.cocoa{background:linear-gradient(135deg,#8c5d3a,#3b2419)}.details{padding:22px}.details h3{font:600 25px "Playfair Display",serif;margin:0 0 7px}.details p{color:#716b62;font-size:13px}.row{display:flex;justify-content:space-between;align-items:center;margin-top:20px}.row button{border:1px solid var(--green);background:none;color:var(--green);padding:9px 13px;cursor:pointer}.about{padding:100px 8%;background:#e8dfd0;display:grid;grid-template-columns:1fr 1fr;gap:70px}.about>p{line-height:1.9;max-width:600px}.banner{margin:0 7%;padding:65px 8%;background:var(--green);color:white;display:flex;justify-content:space-between;align-items:center;gap:30px}.banner .eyebrow{color:#e5ce96}.banner h2{margin-bottom:10px}.banner p:not(.eyebrow){line-height:1.6}.light{background:white;color:var(--green);white-space:nowrap}.contact{padding:100px 8%;display:flex;justify-content:space-between;align-items:end}.contact a{color:var(--green);font-size:20px}footer{border-top:1px solid var(--line);padding:35px 7%;display:flex;justify-content:space-between;align-items:center;font-size:12px}.overlay{display:none;position:fixed;inset:0;background:#0008;z-index:30}.overlay.open{display:block}.drawer{height:100%;width:min(430px,100%);margin-left:auto;background:var(--white);padding:35px;overflow:auto}.x{float:right;border:0;background:none;font-size:32px;cursor:pointer}.drawer h2{font:600 38px "Playfair Display",serif}.item{padding:15px 0;border-bottom:1px solid var(--line);display:flex;justify-content:space-between}.total{display:flex;justify-content:space-between;margin:30px 0;font-size:20px}.checkout{width:100%;padding:15px;background:var(--green);color:white;border:0;font-weight:700;cursor:pointer}@media(max-width:760px){nav{display:none}.hero{grid-template-columns:1fr;padding-top:45px}.hero-art{margin-top:20px}.jar{height:330px}.grid{grid-template-columns:1fr}.heading,.about,.banner,.contact{display:block}.heading>p{margin-top:12px}.statement h2,.heading h2,.about h2,.banner h2,.contact h2{font-size:39px}.about>p{margin-top:30px}.banner .btn{margin-top:25px}.contact a{display:block;margin-top:25px}footer{display:grid;gap:12px}}
.size-label{display:flex;align-items:center;gap:10px;margin-top:16px;font-size:13px;color:#625d54}.size{flex:1;max-width:150px;padding:9px;border:1px solid var(--line);background:#fffdf8;color:var(--ink);font:inherit}.cart-size{display:block;color:#777;font-size:12px;margin-top:4px}.item button{margin-left:8px;border:0;background:none;cursor:pointer;font-size:18px}.checkout-note{font-size:12px;line-height:1.5;color:#777}.contact-actions p{max-width:300px;font-size:12px;line-height:1.6;color:#716b62}

/* Brand logo asset and four-product shop layout */
.logo-image{display:inline-flex;align-items:center;flex-shrink:0;letter-spacing:normal}
.logo-image img{display:block;width:150px;height:56px;object-fit:contain;mix-blend-mode:multiply}
.footer-logo img{width:132px;height:58px}
.grid{grid-template-columns:repeat(4,minmax(0,1fr))}
.ivory{background:linear-gradient(135deg,#f8f2df,#ded1ad)}
@media(max-width:1050px){.grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){.logo-image img{width:122px;height:48px}.footer-logo img{width:120px;height:50px}.grid{grid-template-columns:1fr}}


/* Fix Yendi Care logo overflow */
header {
    height: 74px;
    min-height: 74px;
    overflow: hidden;
}

header .logo-image {
    display: flex;
    align-items: center;
    flex: 0 0 150px;
    width: 150px;
    height: 60px;
    overflow: hidden;
}

header .logo-image img {
    display: block;
    width: 100%;
    max-width: 150px;
    height: 56px;
    max-height: 56px;
    object-fit: contain;
}

footer .logo-image img {
    width: 132px;
    max-width: 132px;
    height: 58px;
    object-fit: contain;
}

@media (max-width: 760px) {
    header .logo-image {
        flex-basis: 122px;
        width: 122px;
    }

    header .logo-image img {
        max-width: 122px;
        height: 48px;
        max-height: 48px;
    }
}