*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,system-ui,-apple-system,Segoe UI,sans-serif;color:#123044;background:#f8fbfc}a{text-decoration:none;color:inherit}.site-header{height:76px;display:flex;align-items:center;gap:28px;padding:0 6%;background:#fff;position:sticky;top:0;z-index:20;border-bottom:1px solid #e7eef1}.brand{display:flex;align-items:center;gap:10px;margin-right:auto}.brand-mark{display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:#087ea4;color:#fff;font-weight:800;font-size:17px}.brand b{display:block;letter-spacing:2px;font-size:18px}.brand small{display:block;font-size:8px;letter-spacing:3px;color:#6b8792}.site-header nav{display:flex;gap:24px;font-size:14px;color:#45606d}.site-header nav a:hover{color:#087ea4}.cart-btn,.menu{border:0;background:none;cursor:pointer;font-size:18px}.cart-btn{padding:8px}.cart-btn span{font-size:12px;background:#087ea4;color:#fff;border-radius:99px;padding:3px 7px}.menu{display:none}.hero{min-height:650px;position:relative;overflow:hidden;display:flex;align-items:center;background:linear-gradient(135deg,#063b59,#087ea4 55%,#35b8cc);color:#fff}.hero:after{content:"";position:absolute;inset:auto -5% -130px;height:250px;background:#f8fbfc;border-radius:50% 50% 0 0/55% 55% 0 0}.hero-wave{position:absolute;right:-80px;top:70px;width:520px;height:520px;border:55px solid rgba(255,255,255,.08);border-radius:50%}.hero-content{position:relative;z-index:2;width:min(680px,88%);margin-left:8%}.eyebrow{font-size:12px;letter-spacing:3px;font-weight:800;color:#35b8cc;margin:0 0 16px}.hero .eyebrow{color:#b9f2f7}.hero h1{font-size:clamp(44px,7vw,78px);line-height:.98;margin:0 0 22px;letter-spacing:-3px}.hero h1 span{color:#b9f2f7}.hero p:not(.eyebrow){font-size:19px;line-height:1.6;max-width:530px;color:#e6f8fa}.actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}.btn{display:inline-flex;justify-content:center;align-items:center;border:0;border-radius:999px;padding:14px 23px;font-weight:800;cursor:pointer}.primary{background:#087ea4;color:#fff}.hero .primary{background:#fff;color:#075a78}.light{border:1px solid rgba(255,255,255,.55);color:#fff}.trust{margin-top:28px;font-size:13px;opacity:.8}.section{padding:90px 7%}.section-head{display:flex;justify-content:space-between;align-items:end;gap:30px;margin-bottom:38px}.section-head h2,.story h2,.why h2,.contact h2{font-size:clamp(32px,4vw,52px);line-height:1.05;margin:0;color:#123044}.section-head>p{max-width:380px;color:#6b7e87;line-height:1.6}.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}.card{background:#fff;border:1px solid #e5edef;border-radius:22px;overflow:hidden;box-shadow:0 12px 30px rgba(18,48,68,.06)}.jar-stage{height:300px;background:linear-gradient(145deg,#edf9fb,#dceff2);display:grid;place-items:center;position:relative}.jar{width:150px;height:185px;background:linear-gradient(90deg,rgba(255,255,255,.9),rgba(209,239,241,.35),rgba(255,255,255,.8));border:3px solid rgba(80,140,150,.35);border-radius:16px 16px 24px 24px;position:relative;box-shadow:0 18px 25px rgba(20,70,80,.2)}.jar:before{content:"";position:absolute;left:-8px;right:-8px;top:-22px;height:30px;border-radius:7px;background:linear-gradient(#555,#222);border:2px solid #222}.pickle{position:absolute;inset:32px 12px 12px;border-radius:10px;background:radial-gradient(circle at 30% 35%,#d98d23 0 9%,transparent 10%),radial-gradient(circle at 65% 55%,#b96919 0 10%,transparent 11%),radial-gradient(circle at 45% 75%,#e0a332 0 8%,transparent 9%),#9c5417;opacity:.92}.label{position:absolute;z-index:2;left:10px;right:10px;top:76px;height:76px;background:#f7fbf9;border:1px solid #c6d8d5;border-radius:4px;text-align:center;padding:9px 3px;color:#075a78;font-weight:900;font-size:12px}.label small{display:block;color:#7a4a1c;font-size:8px;margin-top:4px}.card-body{padding:20px}.card-body h3{margin:0 0 7px;font-size:19px}.meta{display:flex;justify-content:space-between;color:#72838b;font-size:13px;margin-bottom:16px}.price{font-weight:900;color:#087ea4;font-size:18px}.add{width:100%;background:#edf7f8;color:#075a78}.add:hover{background:#087ea4;color:#fff}.story{padding:100px 12%;background:#e9f7f8;display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center}.story>p{font-size:20px;line-height:1.8;color:#46616c}.why{background:#fff}.why h2{margin-bottom:36px}.why-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.why-grid article{padding:28px;background:#f5fafb;border-radius:20px;font-size:30px}.why-grid h3{font-size:20px;margin:18px 0 8px}.why-grid p{font-size:14px;line-height:1.6;color:#647982}.contact{padding:70px 7%;display:flex;align-items:center;justify-content:space-between;gap:30px;background:#063b59;color:#fff}.contact h2{color:#fff}.contact .eyebrow{color:#8be3ec}.contact p:not(.eyebrow){color:#c5dfe5}footer{padding:35px 7%;background:#042c42;color:#b7d0d7;display:flex;align-items:center;gap:28px;flex-wrap:wrap;font-size:13px}footer .brand{color:#fff}footer .brand-mark{background:#087ea4}footer a{color:#8be3ec}.footer-brand{margin-right:auto}.overlay{position:fixed;inset:0;background:rgba(0,20,30,.5);z-index:50;display:none}.overlay.show{display:block}.cart{margin-left:auto;width:min(430px,100%);height:100%;background:#fff;padding:30px;overflow:auto}.close{float:right;border:0;background:none;font-size:30px;cursor:pointer}.cart h2{margin-top:0}.cart-row{display:flex;justify-content:space-between;gap:12px;padding:15px 0;border-bottom:1px solid #e5edef}.qty button{border:1px solid #ccdfe4;background:#fff;border-radius:6px;padding:3px 8px;cursor:pointer}.cart-total{display:flex;justify-content:space-between;padding:24px 0;font-size:20px}.full{width:100%}@media(max-width:900px){.grid{grid-template-columns:repeat(2,1fr)}.site-header nav{display:none}.site-header nav.open{display:flex;position:absolute;top:76px;left:0;right:0;background:#fff;padding:20px;flex-direction:column}.menu{display:block}.story{grid-template-columns:1fr;gap:20px}.why-grid{grid-template-columns:1fr}.contact{flex-direction:column;align-items:flex-start}}@media(max-width:560px){.grid{grid-template-columns:1fr}.section{padding:65px 5%}.hero-content{margin-left:5%}.hero{min-height:600px}.hero h1{letter-spacing:-2px}.jar-stage{height:270px}footer{padding:30px 5%}.section-head{display:block}}