@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;450;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');
:root{--ink:#163854;--ocean:#165b91;--paper:#f7fbff;--muted:#566e82;--line:#d5e4ef;--serif:Georgia,'Times New Roman',serif}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:35px}body{margin:0;background:var(--paper);color:var(--ink);font:14px 'DM Sans',Arial,sans-serif}button,input,select{font:inherit}button,a,input,select{touch-action:manipulation}button,a{-webkit-tap-highlight-color:transparent}button{cursor:pointer;color:inherit;border:0}a{color:inherit;text-decoration:none}button:disabled{opacity:.45;cursor:not-allowed}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid #2385c1;outline-offset:4px}h1,h2,h3,p{margin-top:0}h1,h2{font-weight:500;letter-spacing:-1.5px}h2{font-size:36px;line-height:1.2}p{line-height:1.8}em{font-family:var(--serif);font-weight:400}small{font-size:10px}
header{height:92px;display:flex;align-items:center;justify-content:space-between;gap:25px;padding:0 6%;border-bottom:1px solid #e1ebf2;background:#ffffff}.logo{display:inline-flex;align-items:center;text-decoration:none;padding:4px 0}.logo-img{height:64px;width:auto;max-width:240px;object-fit:contain;transition:transform .2s ease;filter:drop-shadow(0 5px 12px rgba(22,91,145,.15))}.logo:hover .logo-img{transform:scale(1.05)}nav{display:flex;gap:32px;align-items:center;font-size:12px}nav a:hover,.text-link:hover{color:#1976b5}.bag{background:none;border:1px solid #c9deec;padding:12px 16px;border-radius:30px;font-size:12px;white-space:nowrap}.bag span{display:inline-grid;place-items:center;background:var(--ocean);color:white;border-radius:50%;width:22px;height:22px;margin-left:10px}
.hero{display:grid;grid-template-columns:1.08fr 1fr;min-height:550px;margin:0 6%;gap:55px;align-items:center;padding:55px 0 65px}.eyebrow{font-size:10px;letter-spacing:1.6px;font-weight:600;margin-bottom:23px}.hero h1{font-size:clamp(35px,3.55vw,57px);line-height:1.15;margin-bottom:24px;letter-spacing:-2px}.hero h1 em{display:inline-block;margin-top:6px}.hero-copy>p{font-size:14px;max-width:390px;color:#566e82;margin-bottom:30px}.button{background:linear-gradient(120deg,#164e80,#197fb8);color:#fff;border-radius:5px;padding:16px 22px;display:inline-flex;justify-content:space-between;gap:28px;align-items:center;font-size:12px;min-height:48px;transition:background .2s,transform .2s}.button:hover{background:linear-gradient(120deg,#103e69,#14679c);transform:translateY(-1px)}.button span{font-size:19px;line-height:16px}.text-link{font-size:12px;display:block;margin-top:21px}.text-link span{margin-left:15px}
.hero-art{height:420px;position:relative;overflow:hidden;border-radius:100px 5px 5px 5px;background:radial-gradient(ellipse at 40% 28%,#e8f7ff,#b9dff3 62%,#70acd4);box-shadow:inset -25px -25px 75px #2367931c}.sun-circle{position:absolute;border-radius:50%;width:270px;height:270px;top:30px;left:25px;background:linear-gradient(130deg,#ffffff99,#b9e5ff00)}.pedestal{position:absolute;bottom:-135px;left:-5%;width:110%;height:280px;border-radius:50%;background:linear-gradient(90deg,#b8d9ec,#edf9ff 45%,#80b4d5);box-shadow:0 -6px 20px #245a8529}.hero-bottle,.hero-tube,.hero-jar{position:absolute;z-index:2;display:flex;flex-direction:column;align-items:center;text-align:center;color:#153c5b;box-shadow:16px 15px 20px #174c7926;font-family:var(--serif)}.hero-bottle{width:112px;height:230px;bottom:86px;left:calc(50% - 130px);background:linear-gradient(90deg,#448bbd,#90c9e8 35%,#b4e0f5 50%,#599bc7);border-radius:23px 23px 12px 12px;transform:rotate(-8deg)}.hero-bottle:before{content:'';position:absolute;top:-30px;width:57px;height:33px;border-radius:4px;background:linear-gradient(90deg,#123c62,#326d9b,#123c62)}.hero-bottle:after{content:'';position:absolute;width:65px;height:12px;background:#173f65;top:-39px;left:29px;border-radius:4px}.hero-bottle>span,.hero-tube>span{margin-top:35px;font:700 21px 'Manrope',sans-serif;letter-spacing:-1.5px}.hero-bottle b,.hero-tube b{font-size:30px;font-weight:400;line-height:1;margin-top:26px}.hero-bottle small,.hero-tube small{margin-top:23px;font:7px/1.6 Arial;letter-spacing:1px}.hero-tube{width:117px;height:220px;bottom:75px;left:calc(50% + 10px);background:linear-gradient(90deg,#b8d8ee,#f2fbff 50%,#c7e3f3);border-radius:3px 3px 25px 25px;transform:rotate(9deg);border-top:6px solid #a8cfe7}.hero-tube:after{content:'';position:absolute;bottom:0;width:100px;height:25px;background:linear-gradient(90deg,#215b88,#599ac4,#29628f);border-radius:0 0 10px 10px}.hero-tube b{margin-top:22px;font-size:26px}.hero-tube small{margin-top:17px}.hero-jar{bottom:38px;left:calc(50% - 65px);width:130px;height:73px;border-radius:9px 9px 20px 20px;background:linear-gradient(90deg,#86badd,#d6effc,#a6d2ec)}.hero-jar:before{content:'';position:absolute;top:-12px;height:18px;width:132px;border-radius:7px 7px 2px 2px;background:linear-gradient(90deg,#397aa8,#80b9df,#2d6996)}.hero-jar>span{font:700 18px 'Manrope',sans-serif;letter-spacing:-1px;margin-top:16px}.hero-jar b{font-size:11px;font-weight:400;margin-top:4px}
.section{padding:70px 6%}.catalog{padding-top:32px}.section-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:28px}.section-heading h2{margin-bottom:0;font-size:32px}.section-heading>p{font-size:12px;color:var(--muted);margin:0}.category-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:17px}.category{padding:25px 22px;text-align:left;border-radius:6px;min-height:108px;transition:transform .2s}.category:hover{transform:translateY(-3px)}.category h3{font-size:17px;letter-spacing:-.4px;margin:0 0 6px;font-weight:500}.category h3 b{float:right;font-weight:400}.category p{font-size:11px;margin:0;color:#456780}.cat-skin{background:linear-gradient(125deg,#edf8ff,#d2eafb)}.cat-baby{background:linear-gradient(125deg,#f0f6ff,#dce9fc)}.cat-health{background:linear-gradient(125deg,#e5f3ff,#c8e2f5)}.cat-well{background:linear-gradient(125deg,#edfbff,#d4effa)}
.continuous{background:linear-gradient(120deg,#123e68 0%,#165e94 58%,#278abc 100%);color:#f5fbff;display:grid;grid-template-columns:1.25fr 1fr;gap:65px;align-items:center;margin:0 6%;padding:54px;border-radius:6px}.continuous .eyebrow{font-size:8px;color:#d3edff;letter-spacing:1.3px}.continuous h2{font-size:33px;line-height:1.3}.continuous h2 em{color:#c7eaff}.continuous p{font-size:12px;color:#d5eafb;max-width:360px}.light{background:#e8f6ff;color:var(--ink);margin-top:10px}.light:hover{background:#ffffff}.continuous>div>small{display:block;margin-top:15px;font-size:9px;color:#d2e9fa}.care-card{background:#f8fcff;color:var(--ink);padding:25px;border-radius:7px}.care-card-top{display:flex;align-items:center;gap:13px;padding-bottom:22px;border-bottom:1px solid var(--line);font-size:12px}.care-card-top>span:last-child{margin-left:auto;font-size:22px}.care-card small{display:block;font-size:9px;color:var(--muted);margin-top:5px}.timeline{padding:14px 0}.timeline>div{display:flex;align-items:center;gap:13px;position:relative;padding:12px 0}.timeline i{width:7px;height:7px;border-radius:50%;background:#2582bc}.timeline>div>span{color:#517894;font-size:9px}.timeline p{margin:0;color:var(--ink);line-height:1.4;font-size:12px}.care-bottom{font-size:8px;text-align:center;background:#e4f2fc;padding:12px;border-radius:4px}.how{text-align:center}.how .eyebrow{margin-bottom:14px}.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:50px;margin-top:40px}.steps article>span{font:italic 32px var(--serif);color:#427da7}.steps h3{font-size:15px;font-weight:500;margin:17px 0 10px}.steps p{font-size:12px;color:var(--muted);max-width:290px;margin:auto}.faq{border-top:1px solid var(--line);display:grid;grid-template-columns:1fr 1.2fr;gap:60px;padding-top:50px;padding-bottom:50px}.faq h2{font-size:32px}.faq .eyebrow{font-size:8px}details{border-bottom:1px solid var(--line);padding:17px 0;font-size:12px}summary{cursor:pointer;list-style:none;position:relative;padding-right:25px;line-height:1.6}summary:after{content:'+';position:absolute;right:0;font-size:19px;top:-3px}details[open] summary:after{content:'−'}details p{color:var(--muted);font-size:12px;margin:15px 0 0}footer{padding:45px 6% 0;display:grid;grid-template-columns:2fr 1fr 1fr;gap:25px;background:#e8f2fa}footer .logo{font-size:35px}footer p{font-size:11px;color:var(--muted);margin-top:16px}footer strong{font-size:11px;font-weight:500;margin-bottom:18px;display:block}footer>div>a:not(.logo),footer button{display:block;font-size:10px;color:var(--muted);margin:12px 0;background:none;padding:0;text-align:left}.footer-bottom{grid-column:1/-1;border-top:1px solid var(--line);padding:22px 0;display:flex;justify-content:space-between;font-size:9px;color:var(--muted);margin-top:20px}

.products-heading{display:flex;align-items:center;justify-content:space-between;gap:25px;margin:70px 0 27px}.products-heading h2{font-size:33px;margin:0}.catalog-controls{display:flex;gap:15px}.search{display:flex;align-items:center;gap:9px;border-bottom:1px solid #aebbd7;padding:9px 0}.search span{font-size:24px}.search input{border:0;background:none;width:190px;font-size:12px;color:var(--ink)}select{border:1px solid var(--line);border-radius:7px;padding:10px;background:transparent;color:var(--ink);font-size:12px}.filter-row{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px}#filters{display:flex;gap:9px;flex-wrap:wrap}#filters button{border:1px solid var(--line);background:transparent;border-radius:6px;padding:10px 15px;font-size:12px}#filters button.active{background:var(--ink);color:white;border-color:var(--ink)}#results{color:var(--muted);font-size:11px;white-space:nowrap}.demo-note{font-size:11px;color:var(--muted);margin-bottom:20px}.products{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:36px 22px}.product{min-width:0}.product-visual{height:255px;background:#f1f4fa;position:relative;border-radius:12px;display:flex;align-items:center;justify-content:center;width:100%;overflow:hidden}.product-visual img{height:85%;width:85%;object-fit:contain}.product-tag{position:absolute;top:13px;left:12px;font-size:10px;background:white;padding:6px 9px;border-radius:4px}.pack{height:154px;width:78px;border-radius:5px 5px 15px 15px;background:linear-gradient(90deg,#d8e1f2,#fff 45%,#e7edf8);box-shadow:8px 13px 15px #18347c16;display:flex;align-items:center;flex-direction:column;justify-content:center;text-align:center;transform:rotate(-5deg);border-top:5px solid #ced6e7;border-bottom:19px solid #4564be;color:#24407e;gap:9px;position:relative}.pack span{font:700 10px 'Manrope',sans-serif;max-width:68px}.pack strong{font-size:8px;line-height:1.4;padding:0 5px;font-weight:400;letter-spacing:.3px}.pack small{font-size:6px}.pack:after{content:'';width:25px;height:1px;background:#8398ca;position:absolute;bottom:30px}.pack-1{width:84px;height:140px;border-radius:6px;background:linear-gradient(90deg,#448bbd,#b4e0f5,#599bc7);border-top:26px solid #21418e;border-bottom:0;color:#153c5b}.pack-2{border-bottom-color:#559dd0;background:linear-gradient(90deg,#c2e1f4,#effaff,#c7e3f3)}.pack-3{width:105px;height:135px;border-radius:5px;border:0;background:linear-gradient(90deg,#e0e6f4,#fff);border-top:24px solid #5273c9}.product-brand{font-size:10px;letter-spacing:1px;color:var(--muted);margin:18px 0 8px;text-transform:uppercase}.product-title{background:none;padding:0;text-align:left;font-size:15px;font-weight:600;line-height:1.45}.product-size{font-size:11px;color:var(--muted);margin-top:6px}.product-bottom{display:flex;align-items:center;justify-content:space-between;margin-top:15px}.price{font-size:17px;font-weight:700}.add{background:#eaf0ff;color:var(--ocean);border-radius:7px;width:37px;height:37px;font-size:23px}.add:hover{background:var(--ocean);color:white}.empty{grid-column:1/-1;text-align:center;padding:50px;color:var(--muted)}

dialog{border:1px solid var(--line);border-radius:10px;padding:30px;max-width:640px;width:calc(100% - 30px);color:var(--ink);background:var(--paper);max-height:90dvh;overflow:auto}dialog::backdrop{background:#182b6666;backdrop-filter:blur(4px)}body:has(dialog[open]){overflow:hidden}.drawer{margin:0 0 0 auto;height:100dvh;max-height:100dvh;border-radius:0;max-width:470px;width:100%}.dialog-heading{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:25px}.dialog-heading h2{font-size:28px;margin-bottom:0}.dialog-heading .eyebrow{font-size:8px;margin-bottom:10px}.icon-button{background:none;font-size:29px;padding:0 5px}.cart-item{display:flex;justify-content:space-between;gap:12px;padding:20px 0;border-bottom:1px solid var(--line)}.cart-item h3{font-size:13px;font-weight:500;margin:0 0 8px}.cart-item small{color:var(--muted)}.qty{display:flex;align-items:center;gap:10px;margin-top:12px}.qty button{width:25px;height:25px;border:1px solid var(--line);border-radius:4px;background:none}.qty .remove{border:0;width:auto;font-size:10px;margin-left:10px;color:#375f7e}.field{display:flex;flex-direction:column;gap:10px;margin:25px 0 15px;font-size:12px}.field select{font-size:12px;padding:12px}.total{display:flex;justify-content:space-between;padding:20px 0;border-top:1px solid var(--line);font-size:17px}.muted{font-size:11px;color:var(--muted)}.full{width:100%;justify-content:center}.admin-actions{display:flex;gap:12px;flex-wrap:wrap;margin:25px 0}.secondary{padding:12px 18px;background:transparent;border:1px solid var(--line);border-radius:5px;font-size:12px}.upload{display:block;background:#edf2ff;border:1px dashed #91a8e0;border-radius:6px;padding:25px;margin-top:22px;font-size:12px}.upload input{display:block;margin-top:15px;max-width:100%;font-size:11px}#import-status{font-size:12px;margin:20px 0}#import-preview{font-size:12px;margin-bottom:20px;line-height:1.8}#toast{position:fixed;bottom:25px;left:50%;transform:translateX(-50%) translateY(90px);background:var(--ocean);color:white;padding:15px 25px;border-radius:6px;font-size:12px;z-index:100;transition:transform .25s;max-width:90vw;box-shadow:0 5px 20px #18347c22}#toast.show{transform:translateX(-50%) translateY(0)}.detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:25px;align-items:center}.detail-grid .product-visual{height:290px}.detail-grid h2{font-size:25px}.detail-grid p{font-size:12px;color:var(--muted)}.detail-close{display:flex;justify-content:flex-end;margin-bottom:10px}.summary-box{padding:20px;background:#edf2ff;border-radius:6px;margin:20px 0;line-height:1.8;font-size:12px;white-space:pre-wrap}.summary-actions{display:flex;gap:10px;flex-wrap:wrap}



/* Catalog and dialogs share the ocean blue palette. */
.products-heading h2{font-size:29px;font-weight:500}.products-heading{margin-top:50px}.product-visual{background:#e9f3fb;border-radius:5px}.product:nth-child(4n+2) .product-visual{background:#e1effb}.product:nth-child(4n+3) .product-visual{background:#e6f6fc}.product:nth-child(4n+4) .product-visual{background:#edf3ff}.pack{background:linear-gradient(90deg,#bedcf0,#f7fcff 40%,#d8edf9);color:#204f72;border-top-color:#b8d7ed;border-bottom-color:#4382b4}.pack:after{background:#6b9cbe}.pack-1{background:linear-gradient(90deg,#276591,#75b2d9,#b9e3f7,#4c8dbb);border-top-color:#153e65;color:#143852}.pack-2{border-bottom-color:#559dd0;background:linear-gradient(90deg,#c2e1f4,#effaff,#c2e1f4)}.pack-3{background:linear-gradient(90deg,#cbdfef,#f6fbff);border-top-color:#316fa8;color:#204f79}.pack span{font:10px var(--serif)}.product-title{font-size:14px;font-weight:500}.price{font-size:15px;font-weight:400}.product-size{font-size:10px}.product-brand{font-size:9px}.add{border:1px solid #bcd6e8;background:transparent;color:var(--ink);border-radius:50%;width:33px;height:33px;font-size:21px}.search{border-color:#bed6e7}#filters button{border-radius:20px;font-size:11px}#filters button.active{background:var(--ocean);border-color:var(--ocean)}.upload,.summary-box{background:#e5f2fc}.upload{border-color:#76a9ce}dialog::backdrop{background:#12395566}.qty .remove{color:#375f7e}
@media(min-width:1500px){.hero h1{font-size:56px}}
@media(max-width:1050px){nav{gap:17px}.hero{gap:28px}.hero-art{height:390px}.hero h1{font-size:39px}.category{padding:20px 15px}.category h3{font-size:14px}.continuous{gap:30px;padding:38px}.products-heading{align-items:flex-start;flex-direction:column}.product-visual{height:210px}}
@media(max-width:760px){header{height:75px;padding:0 5%}nav{display:none}.logo{font-size:36px}.hero{grid-template-columns:1fr;margin:0 5%;padding:36px 0 30px;gap:30px;min-height:0}.hero-copy>p{font-size:13px;max-width:100%;margin-bottom:24px}.hero h1{font-size:clamp(31px,8.6vw,43px);letter-spacing:-1.5px}.hero-art{height:320px;border-top-left-radius:75px}.hero-bottle{height:185px;width:95px;left:calc(50% - 105px);bottom:65px}.hero-bottle>span,.hero-tube>span{margin-top:26px;font-size:18px}.hero-bottle b{font-size:26px;margin-top:22px}.hero-bottle small{margin-top:16px}.hero-tube{height:190px;width:100px;left:calc(50% + 12px);bottom:50px}.hero-tube b{font-size:23px;margin-top:18px}.hero-tube:after{width:90px}.hero-jar{bottom:24px;width:112px;height:62px;left:calc(50% - 56px)}.hero-jar:before{width:114px}.hero-jar>span{font-size:16px;margin-top:10px}.eyebrow{font-size:8px;margin-bottom:20px}.section{padding:45px 5%}.catalog{padding-top:22px}.section-heading{align-items:flex-start}.section-heading>p{display:none}.section-heading h2{font-size:28px}.category-grid{grid-template-columns:1fr 1fr;gap:10px}.category{min-height:92px;padding:20px 15px}.category h3{font-size:14px}.category p{font-size:9px}.products-heading{margin-top:38px;gap:18px}.products-heading h2{font-size:27px}.catalog-controls{width:100%;gap:12px}.search{flex:1;min-width:0}.search input{width:100%;min-width:0}.catalog-controls select{max-width:135px;font-size:10px}.filter-row{display:block}#results{display:block;margin-top:12px}#filters{gap:6px}#filters button{font-size:9px;padding:8px 10px}.products{grid-template-columns:1fr 1fr;gap:27px 13px}.product-visual{height:205px}.product-title{font-size:12px}.product-brand{font-size:8px}.product-size{font-size:9px}.product-tag{font-size:8px}.continuous{margin:0 5%;padding:30px 24px;grid-template-columns:1fr;gap:30px}.continuous h2{font-size:30px}.continuous .eyebrow{line-height:1.8}.care-card{padding:20px}.steps{grid-template-columns:1fr;gap:30px;margin-top:30px}.steps p{max-width:330px}.steps h3{margin-top:10px}.how h2{font-size:30px}.faq{grid-template-columns:1fr;gap:5px;padding-top:35px}.faq h2{font-size:30px}footer{grid-template-columns:1fr 1fr;padding:35px 5% 0}footer>div:first-child{grid-column:1/-1}.footer-bottom{font-size:8px;gap:15px;line-height:1.6}.detail-grid{grid-template-columns:1fr}.detail-grid .product-visual{height:230px}dialog{padding:24px}.drawer{padding:25px}.hero .button{padding:16px 20px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important}}

/* Section identities and illustrated product cards. */
:root{--beauty:#c74773;--beauty-soft:#fff0f5;--baby:#1689bf;--baby-soft:#e8f8ff;--health:#2d8d5d;--health-soft:#ecfff4;--well:#725ac6;--well-soft:#f5f1ff}
.category{position:relative;overflow:hidden;border:1px solid #ffffffa8;box-shadow:0 18px 35px #164e8012;min-height:142px;padding:24px 22px 20px}.category:before{content:'';position:absolute;inset:auto -34px -54px auto;width:125px;height:125px;border-radius:50%;background:#fff8}.category:hover{transform:translateY(-5px);box-shadow:0 24px 42px #164e8020}.category h3,.category p{position:relative;z-index:1}.category-icon{position:relative;z-index:1;display:block;width:44px;height:44px;margin-bottom:17px;border-radius:15px;background:#fff9;box-shadow:inset 0 0 0 1px #fff}.category-icon:before,.category-icon:after{content:'';position:absolute;display:block}.cat-skin{background:linear-gradient(135deg,#fff4f8,#ffd5e3 58%,#f4a8c0);color:#84334f}.cat-skin .category-icon:before{width:18px;height:27px;left:13px;top:9px;border-radius:8px 8px 5px 5px;background:linear-gradient(#c74773,#f7a9c0)}.cat-skin .category-icon:after{width:22px;height:8px;left:11px;top:27px;border-radius:6px;background:#fff}.cat-baby{background:linear-gradient(135deg,#effbff,#bfefff 58%,#73ceee);color:#175e83}.cat-baby .category-icon:before{width:25px;height:22px;left:9px;top:15px;border-radius:4px 4px 13px 13px;background:#fff;border:3px solid #1689bf}.cat-baby .category-icon:after{width:18px;height:28px;right:7px;top:7px;border-radius:8px;background:linear-gradient(#1689bf,#8bddff)}.cat-health{background:linear-gradient(135deg,#f0fff6,#bdeed1 58%,#79d19b);color:#236b4a}.cat-health .category-icon:before{width:26px;height:26px;left:9px;top:9px;border-radius:8px;background:#fff}.cat-health .category-icon:after{width:18px;height:5px;left:13px;top:20px;background:#2d8d5d;box-shadow:0 0 0 0 #2d8d5d;transform:rotate(90deg)}.cat-well{background:linear-gradient(135deg,#f8f5ff,#ded4ff 58%,#b9a8ff);color:#51408f}.cat-well .category-icon:before{width:24px;height:24px;left:10px;top:11px;border-radius:50%;background:#fff}.cat-well .category-icon:after{width:18px;height:18px;left:13px;top:14px;border-radius:50%;border:4px solid #725ac6;border-left-color:transparent}.product{--card:#e9f3fb;--accent:var(--ocean);background:#fff;border:1px solid #dce9f2;border-radius:20px;padding:10px;box-shadow:0 18px 42px #164e8011;transition:transform .2s,box-shadow .2s,border-color .2s}.product:hover{transform:translateY(-5px);box-shadow:0 25px 55px #164e8020;border-color:color-mix(in srgb,var(--accent),white 45%)}.product-beauty{--card:var(--beauty-soft);--accent:var(--beauty)}.product-bebes-y-ninos{--card:var(--baby-soft);--accent:var(--baby)}.product-salud-continua{--card:var(--health-soft);--accent:var(--health)}.product-bienestar-diario{--card:var(--well-soft);--accent:var(--well)}.product-visual-button{padding:0;border:0;background:none;width:100%;display:block}.product-visual{height:245px;border-radius:16px;background:radial-gradient(circle at 26% 20%,#fff 0 16%,transparent 17%),linear-gradient(145deg,var(--card),#fff);color:var(--accent);border:1px solid color-mix(in srgb,var(--accent),white 70%);box-shadow:inset 0 -35px 75px color-mix(in srgb,var(--accent),transparent 88%)}.product-svg{width:88%;height:88%;filter:drop-shadow(0 18px 18px color-mix(in srgb,var(--accent),transparent 78%))}.product-meta{padding:16px 4px 4px;display:flex;flex-direction:column;gap:16px;min-height:155px}.product-brand{color:var(--accent);letter-spacing:1.1px;text-transform:uppercase;font-weight:700}.product-title{font-size:15px;line-height:1.35;text-align:left;color:var(--ink);min-height:42px}.product-title:hover{color:var(--accent)}.product-size{margin-top:7px}.product-bottom{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:auto}.price{color:var(--ink);font-weight:700}.add{border-color:color-mix(in srgb,var(--accent),white 45%);color:var(--accent);background:#fff}.add:hover:not(:disabled){background:var(--accent);color:#fff}.product-tag{background:#ffffffe8;color:var(--accent);box-shadow:0 8px 18px #164e8015}.product-visual-beauty{background:#ffffff}.product-visual-bebes-y-ninos{background:radial-gradient(circle at 23% 18%,#fff 0 15%,transparent 16%),linear-gradient(145deg,#effbff,#beeefe)}.product-visual-salud-continua{background:radial-gradient(circle at 23% 18%,#fff 0 15%,transparent 16%),linear-gradient(145deg,#f0fff6,#cbf1dc)}.product-visual-bienestar-diario{background:radial-gradient(circle at 23% 18%,#fff 0 15%,transparent 16%),linear-gradient(145deg,#f8f5ff,#ded4ff)}#filters button.active[data-filter="Beauty"]{background:var(--beauty);border-color:var(--beauty)}#filters button.active[data-filter="Bebés y niños"]{background:var(--baby);border-color:var(--baby)}#filters button.active[data-filter="Salud continua"]{background:var(--health);border-color:var(--health)}#filters button.active[data-filter="Bienestar diario"]{background:var(--well);border-color:var(--well)}
@media(max-width:1050px){.product-visual{height:220px}.category{min-height:132px}}
@media(max-width:760px){.category{min-height:126px}.category-icon{width:36px;height:36px;margin-bottom:13px}.products{gap:18px 12px}.product{border-radius:16px;padding:7px}.product-visual{height:190px;border-radius:13px}.product-meta{padding:13px 2px 2px;min-height:145px}.product-title{font-size:12px;min-height:36px}}

/* Multi-page storefront */
.shop-header{height:90px;position:sticky;top:0;z-index:100;background:#ffffff;border-bottom:1px solid #e1ebf2;box-shadow:0 3px 14px rgba(22,91,145,.04)}.shop-header nav a{font-size:12px}.header-actions{display:flex;align-items:center;gap:22px}.build-link,.text-link{font-size:12px;font-weight:600;color:var(--ocean)}.build-link span{margin-left:6px}.shop-footer{display:grid;grid-template-columns:1fr 1fr;gap:24px 40px;padding:48px 6%;border-top:1px solid var(--line);font-size:12px;background:#ffffff}.shop-footer p{color:var(--muted);line-height:1.7}.footer-links{display:flex;align-content:start;gap:17px;flex-wrap:wrap}.footer-links button{padding:0;background:none;font-size:12px}.shop-footer>small{grid-column:1/-1;color:var(--muted)}#app{min-height:65vh}.page{--accent:var(--ocean);--soft:#edf8ff}.theme-beauty,.product-beauty{--accent:var(--beauty);--soft:var(--beauty-soft)}.theme-baby,.product-bebes-y-ninos{--accent:var(--baby);--soft:var(--baby-soft)}.theme-health,.product-salud-continua{--accent:var(--health);--soft:var(--health-soft)}.theme-well,.product-bienestar-diario{--accent:var(--well);--soft:var(--well-soft)}.home-hero{display:grid;grid-template-columns:1.05fr .95fr;gap:30px;align-items:center;padding:78px 8% 86px;background:linear-gradient(110deg,#eff9ff,#d9f1ff 62%,#c5eaff);min-height:490px}.hero-copy{max-width:540px}.hero-copy h1,.category-hero h1,.simple-page-hero h1{font-size:clamp(38px,5vw,66px);font-weight:500;line-height:1.08;letter-spacing:-2.3px;margin:14px 0 20px}.hero-copy h1 em,.simple-page-hero h1 em{font-family:var(--serif);font-weight:400}.hero-copy p,.category-hero p,.simple-page-hero p{color:#4d6577;line-height:1.8;max-width:450px;margin-bottom:26px}.home-hero-art{height:350px;max-width:440px;width:100%;margin:0 auto;display:grid;place-items:center;background:radial-gradient(ellipse at center,rgba(255,255,255,.85) 0%,rgba(255,255,255,.35) 62%,transparent 100%);border-radius:50%;}.home-hero-art svg{width:76%;height:80%;filter:drop-shadow(0 20px 18px #164e8018)}.section{padding:70px 7%}.home-categories{padding-top:62px}.section-heading{margin-bottom:30px}.section-heading .eyebrow,.products-heading .eyebrow,.promo-strip .eyebrow{display:block;color:var(--muted);font-size:9px;letter-spacing:1.7px;margin-bottom:12px}.category-grid{gap:18px}.category{display:block;text-decoration:none;min-height:250px;border-radius:18px;padding:22px;transition:transform .2s,box-shadow .2s}.category-art{display:flex;align-items:center;justify-content:center;height:135px;margin:-4px -3px 15px;background:#ffffff70;border:1px solid #fff9;border-radius:13px}.category-art svg{width:90%;height:90%;max-width:230px}.category-emoji-img{display:block;width:100%;height:100%;object-fit:contain;border-radius:14px;mix-blend-mode:multiply}.category-art .category-emoji-img{max-height:120px;max-width:120px;margin:auto}.home-hero-art .category-emoji-img{max-height:330px;max-width:100%;width:auto}.category-hero-art .category-emoji-img{max-height:200px;width:auto}.box-art .category-emoji-img{max-height:190px;width:auto}.category-label{display:block;font-size:17px;font-weight:600;letter-spacing:-.4px}.category-label b{float:right;font-weight:400}.category-copy{display:block;font-size:11px;margin-top:7px;line-height:1.6;max-width:220px;color:color-mix(in srgb,currentColor,transparent 20%)}.category:before,.category-icon,.category-icon:before,.category-icon:after{display:none!important}.cat-skin{background:linear-gradient(145deg,#fff6f9,#fbdce6)}.cat-baby{background:linear-gradient(145deg,#f1fbff,#d1f1fc)}.cat-health{background:linear-gradient(145deg,#f4fff7,#d5f2df)}.cat-well{background:linear-gradient(145deg,#faf8ff,#e8e0fc)}.featured-section{background:#fbfdff}.products-heading{margin:0 0 27px}.products-heading h2{font-size:32px}.products{grid-template-columns:repeat(4,minmax(0,1fr));gap:22px}.product{border-radius:18px;padding:10px}.product-visual{height:260px;border-radius:14px;background:#ffffff;border:1px solid #edf2f7;box-shadow:none}.product-visual img{height:100%;width:100%;object-fit:contain;padding:8px}.product-meta{min-height:142px}.product-title{display:inline-block;text-decoration:none}.product-tag{background:var(--accent,#165b91);color:white}.promo-strip{display:grid;grid-template-columns:1.2fr .8fr;align-items:center;margin:40px 7%;padding:45px 55px;border-radius:20px;background:linear-gradient(120deg,#1d6ea7 0%,#2d83be 52%,#4aa0de 100%);color:white}.promo-strip p{max-width:430px;color:#eaf4fd;line-height:1.8}.promo-strip .eyebrow{color:#cce7fc}.promo-strip h2{font-size:35px}.promo-strip .button{background:#fff;color:#1a659b}.box-art{display:grid;place-items:center}.box-art svg{width:200px;filter:drop-shadow(0 12px 16px #001d3e66)}.box-art .category-emoji-img{max-height:200px;width:auto;mix-blend-mode:multiply;filter:contrast(1.18) brightness(1.06)}.how-home{text-align:center}.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:44px;margin:35px 0 24px}.steps article>span,.how-detail article>span{font:italic 32px var(--serif);color:#427da7}.steps h3{font-size:15px;font-weight:500;margin:14px 0 8px}.steps p{font-size:12px;color:var(--muted);max-width:270px;margin:auto}.text-link{display:inline-block;margin-top:10px}.category-hero{display:grid;grid-template-columns:1.2fr .8fr;gap:36px;align-items:center;min-height:310px;padding:45px 8%;background:linear-gradient(120deg,var(--soft),#fff)}.category-hero .eyebrow{display:block;color:var(--accent);font-size:9px;letter-spacing:1.6px;margin:28px 0 10px}.category-hero h1{font-size:clamp(36px,4.8vw,58px);max-width:690px;margin:0 0 15px}.category-hero p{max-width:600px;margin-bottom:20px}.back-link{display:block;color:var(--muted);font-size:11px;margin-bottom:16px}.category-hero-art{height:205px;display:grid;place-items:center}.category-hero-art svg{height:100%;width:100%;max-width:300px}.category-quicklinks{display:flex;gap:8px;flex-wrap:wrap}.subcat-link{padding:9px 15px;background:#fff;border:1px solid color-mix(in srgb,var(--accent),white 65%);border-radius:22px;color:var(--accent);font-size:11px}.subcat-link.active,.subcat-link:hover{background:var(--accent);color:white}.catalog-page{padding-top:54px}.catalog-page .products-heading{display:flex;align-items:end;justify-content:space-between}.catalog-page .products-heading h2{font-size:28px;margin:0}.results-count{display:block;color:var(--muted);font-size:11px;margin-top:7px}.catalog-page #filters{display:flex;gap:8px;flex-wrap:wrap}.catalog-page #filters button{border:1px solid color-mix(in srgb,var(--accent),white 72%);background:#fff;border-radius:22px;padding:9px 14px;font-size:11px}.catalog-page #filters button.active{background:var(--accent);border-color:var(--accent);color:#fff}.catalog-page .product{--accent:var(--accent)}.catalog-page .demo-note{margin-top:25px}.other-sections{background:#f8fbfd}.other-sections h2{font-size:25px}.product-detail-page{padding-top:34px}.product-detail-layout{display:grid;grid-template-columns:1fr 1fr;gap:8%;align-items:center;max-width:1120px;margin:0 auto}.product-detail-photo{height:490px;display:grid;place-items:center;background:#ffffff;border-radius:22px;border:1px solid #edf2f7}.product-detail-photo img{width:90%;height:90%;object-fit:contain}.product-detail-photo svg{height:80%;width:80%}.product-detail-copy h1{font-size:42px;line-height:1.13;letter-spacing:-1.5px;margin:10px 0}.product-detail-copy .product-brand{font-size:10px;letter-spacing:1.4px}.product-detail-copy>p{line-height:1.8;color:var(--muted)}.detail-price{font-size:25px;font-weight:700;margin:24px 0}.detail-price small{display:block;font-size:10px;color:var(--muted);font-weight:400;margin-top:5px}.product-detail-copy .button{background:var(--accent);margin:9px 0}.stock-note,.source-link{display:block;font-size:10px;color:var(--muted);margin-top:12px}.source-link{color:var(--accent)}.related-section{background:#fbfdff}.related-section h2{font-size:29px}.simple-page-hero{background:linear-gradient(120deg,#edf8ff,#fff);min-height:380px;padding-top:60px}.simple-page-hero h1{max-width:720px}.simple-page-hero p{max-width:580px}.box-steps{background:#fafcff}.how-detail{display:grid;grid-template-columns:repeat(3,1fr);gap:36px}.how-detail article{padding:28px;border:1px solid var(--line);border-radius:16px}.how-detail h2{font-size:20px}.how-detail p{font-size:12px;line-height:1.8;color:var(--muted)}.not-found{text-align:center;min-height:360px;padding-top:100px}.loading{padding:100px;text-align:center;color:var(--muted)}
@media(max-width:900px){.shop-header nav{gap:14px}.shop-header nav a{font-size:10px}.header-actions{gap:10px}.build-link{display:none}.home-hero{padding:60px 6%;min-height:420px}.products{grid-template-columns:repeat(3,minmax(0,1fr))}.category-grid{grid-template-columns:repeat(2,1fr)}.category-hero{padding:38px 6%}.product-detail-photo{height:400px}}
@media(max-width:650px){.shop-header{height:76px;padding:0 4%;gap:8px}.logo-img{height:48px;max-width:170px}.shop-header nav{display:none}.header-actions{margin-left:auto}.bag{padding:8px 11px}.home-hero{grid-template-columns:1fr;padding:45px 6%;gap:24px}.home-hero-art{height:220px}.section{padding:48px 5%}.section-heading h2,.products-heading h2{font-size:27px}.category-grid{gap:10px}.category{min-height:220px;padding:13px;border-radius:14px}.category-art{height:110px}.category-label{font-size:14px}.category-copy{font-size:9px}.products{grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}.product{padding:7px;border-radius:14px}.product-visual{height:170px}.product-meta{padding:11px 2px 2px;min-height:140px}.product-title{font-size:12px}.promo-strip{grid-template-columns:1fr;margin:20px 5%;padding:30px 24px}.promo-strip h2{font-size:28px}.box-art{display:none}.steps{grid-template-columns:1fr;gap:24px}.category-hero{grid-template-columns:1fr;gap:0;padding:28px 5%}.category-hero-art{height:135px;grid-row:1}.category-hero .eyebrow{margin-top:8px}.category-hero h1{font-size:38px}.catalog-page{padding-top:35px}.catalog-page .products-heading{align-items:start;flex-direction:column;gap:18px}.catalog-page .catalog-controls{width:100%}.catalog-page .search{flex:1;min-width:0}.catalog-page .search input{width:100%;min-width:0}.catalog-page select{max-width:125px;font-size:10px}.filter-row{display:block}.filter-row #results{display:block;margin-top:10px}.product-detail-layout{grid-template-columns:1fr;gap:26px}.product-detail-photo{height:330px}.product-detail-copy h1{font-size:34px}.how-detail{grid-template-columns:1fr;gap:14px}.shop-footer{grid-template-columns:1fr;padding:35px 5%;gap:16px}.shop-footer>small{grid-column:auto}}

/* A quiet blue canvas keeps the message and family in focus. */
.home-hero {
  color: #163854;
  background: linear-gradient(115deg, #f8fbfd 0%, #edf6fc 58%, #e4f1fa 100%);
  padding-top: 58px;
  padding-bottom: 58px;
  gap: clamp(30px, 5vw, 76px);
}
.home-hero .hero-copy h1 {
  font-size: clamp(36px, 4.1vw, 58px);
  line-height: 1.14;
  letter-spacing: -1.8px;
}
.home-hero .hero-copy p {
  color: #4d6577;
  max-width: 370px;
}
.home-hero .hero-copy h1 em {
  color: #2b658b;
}
.home-hero .button {
  background: #163e60;
  color: #fff;
  border-radius: 8px;
  box-shadow: 0 6px 16px #103c6010;
}
.home-hero .button:hover {
  background: #20567f;
}
.home-hero .button:focus-visible {
  outline-color: #165b91;
}
.hero-carousel {
  min-width: 0;
  width: 100%;
  max-width: 470px;
  margin: 0 auto;
}
.hero-carousel-tunnel {
  position: relative;
  width: 100%;
  aspect-ratio: 1 / 1;
  max-height: 470px;
  margin: 0 auto;
  border-radius: 50% 50% 28px 28px / 50% 50% 28px 28px;
  overflow: hidden;
  background: linear-gradient(180deg, #d8ebf9 0%, #ebf5fc 40%, #ffffff 100%);
  border: 3.5px solid #ffffff;
  box-shadow: 0 24px 50px rgba(22, 91, 145, 0.12),
              0 4px 16px rgba(22, 91, 145, 0.05),
              inset 0 2px 10px rgba(255, 255, 255, 0.95);
}
.hero-carousel-tunnel::before {
  content: '';
  position: absolute;
  inset: 10px;
  border-radius: 50% 50% 20px 20px / 50% 50% 20px 20px;
  border: 1.5px solid rgba(255, 255, 255, 0.85);
  box-shadow: inset 0 8px 24px rgba(22, 91, 145, 0.08);
  pointer-events: none;
  z-index: 4;
}
.hero-carousel-slides {
  display: grid;
  width: 100%;
  height: 100%;
  position: relative;
}
.hero-slide {
  grid-area: 1 / 1;
  min-width: 0;
  min-height: 0;
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  animation: hero-arrive .45s ease-out;
}
.hero-slide[hidden] { display: none; }
.hero-family-frame {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #cce3f2;
  position: relative;
  overflow: hidden;
}
.hero-family-image {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .45s ease;
}
.hero-family-frame:hover .hero-family-image {
  transform: scale(1.025);
}
.hero-news {
  height: 100%;
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  padding: clamp(48px, 9vw, 68px) clamp(28px, 5.5vw, 46px) clamp(28px, 4vw, 36px);
  position: relative;
  overflow: hidden;
  box-sizing: border-box;
}
.hero-news-arch-backdrop {
  position: absolute;
  top: 14px;
  left: 50%;
  transform: translateX(-50%);
  width: 86%;
  height: 88%;
  border-radius: 50% 50% 18px 18px / 48% 48% 18px 18px;
  border: 1px dashed rgba(22, 91, 145, 0.16);
  pointer-events: none;
  z-index: 1;
}
.hero-news-beauty {
  background: radial-gradient(circle at 50% 18%, #ffffff 0%, #fff1f6 52%, #fde4ee 100%);
}
.hero-news-beauty .hero-news-arch-backdrop {
  border-color: rgba(199, 71, 115, 0.22);
}
.hero-news-box {
  background: radial-gradient(circle at 50% 18%, #ffffff 0%, #edf6fd 52%, #d7edf9 100%);
}
.hero-news-box .hero-news-arch-backdrop {
  border-color: rgba(22, 91, 145, 0.2);
}
.hero-news-blog {
  background: radial-gradient(circle at 50% 18%, #ffffff 0%, #f4fbf7 52%, #dcf3e7 100%);
}
.hero-news-blog .hero-news-arch-backdrop {
  border-color: rgba(45, 141, 93, 0.24);
}
.hero-news-promos {
  background: radial-gradient(circle at 50% 18%, #ffffff 0%, #eff7fe 52%, #d8edf9 100%);
}
.hero-news-promos .hero-news-arch-backdrop {
  border-color: rgba(22, 91, 145, 0.22);
}
.hero-news-badge {
  display: inline-flex;
  align-items: center;
  font-size: 9.5px;
  font-weight: 700;
  letter-spacing: 1.6px;
  padding: 5px 14px;
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.9);
  backdrop-filter: blur(6px);
  box-shadow: 0 2px 8px rgba(22, 91, 145, 0.06);
  margin-bottom: 14px;
  position: relative;
  z-index: 2;
}
.hero-news-beauty .hero-news-badge {
  color: #c74773;
}
.hero-news-box .hero-news-badge {
  color: #165b91;
}
.hero-news-blog .hero-news-badge {
  color: #236b4a;
}
.hero-news-promos .hero-news-badge {
  color: #165b91;
}
.hero-news h2 {
  font-size: clamp(26px, 3.2vw, 36px);
  line-height: 1.15;
  letter-spacing: -1.2px;
  margin-bottom: 12px;
  color: #163854;
  position: relative;
  z-index: 2;
}
.hero-news h2 em {
  color: #2b658b;
}
.hero-news-beauty h2 em {
  color: #c74773;
}
.hero-news-blog h2 em {
  color: #2d8d5d;
}
.hero-news-promos h2 em {
  color: #165b91;
}
.hero-news p {
  font-size: 13px;
  line-height: 1.65;
  color: #4d6577;
  margin-bottom: 18px;
  max-width: 320px;
  position: relative;
  z-index: 2;
}
.hero-news-link {
  font-size: 12px;
  font-weight: 600;
  color: #ffffff;
  background: #163e60;
  padding: 10px 20px;
  border-radius: 8px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  transition: background .2s, transform .2s, box-shadow .2s;
  box-shadow: 0 4px 14px rgba(22, 62, 96, 0.18);
  position: relative;
  z-index: 2;
}
.hero-news-beauty .hero-news-link {
  background: #c74773;
  box-shadow: 0 4px 14px rgba(199, 71, 115, 0.22);
}
.hero-news-link:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 18px rgba(22, 62, 96, 0.25);
}
.hero-news-beauty .hero-news-link:hover {
  background: #af365f;
  box-shadow: 0 6px 18px rgba(199, 71, 115, 0.3);
}
.hero-news-link.hero-blog-btn {
  background: #236b4a;
  box-shadow: 0 4px 14px rgba(35, 107, 74, 0.22);
}
.hero-news-link.hero-blog-btn:hover {
  background: #1c573c;
  box-shadow: 0 6px 18px rgba(35, 107, 74, 0.3);
}
.hero-news-link.hero-promo-btn {
  background: #164e80;
  box-shadow: 0 4px 14px rgba(22, 78, 128, 0.22);
}
.hero-news-link.hero-promo-btn:hover {
  background: #103b62;
  box-shadow: 0 6px 18px rgba(22, 78, 128, 0.3);
}
.hero-blog-topics, .hero-promo-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin: 10px 0 20px;
  position: relative;
  z-index: 2;
}
.hero-blog-topics span {
  border: 1px solid #c7e9d7;
  background: rgba(255, 255, 255, 0.92);
  border-radius: 20px;
  padding: 6px 12px;
  font-size: 11px;
  font-weight: 500;
  color: #1f6444;
  box-shadow: 0 2px 6px rgba(45, 141, 93, 0.05);
}
.hero-promo-badges span {
  border: 1px solid #c0dcf2;
  background: rgba(255, 255, 255, 0.92);
  border-radius: 20px;
  padding: 6px 12px;
  font-size: 11px;
  font-weight: 600;
  color: #164e80;
  box-shadow: 0 2px 6px rgba(22, 91, 145, 0.05);
}
.hero-news-products {
  display: flex;
  align-self: flex-end;
  margin-top: auto;
  height: clamp(60px, 7.5vw, 84px);
  gap: 12px;
  padding: 6px 14px;
  background: rgba(255, 255, 255, 0.88);
  border-radius: 14px;
  border: 1px solid rgba(255, 255, 255, 0.95);
  backdrop-filter: blur(6px);
  box-shadow: 0 4px 14px rgba(22, 91, 145, 0.08);
  position: relative;
  z-index: 2;
}
.hero-news-products img {
  width: 62px;
  height: 100%;
  object-fit: contain;
}
.hero-news-steps {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 10px 0 20px;
  position: relative;
  z-index: 2;
}
.hero-news-steps span {
  border: 1px solid #c8dfee;
  background: rgba(255, 255, 255, 0.88);
  border-radius: 20px;
  padding: 6px 12px;
  font-size: 11px;
  font-weight: 500;
  color: #275678;
  box-shadow: 0 2px 6px rgba(22, 91, 145, 0.04);
}
.hero-carousel-controls {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 14px;
}
.hero-carousel-dots {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 6px 14px;
  border-radius: 20px;
  background: rgba(255, 255, 255, 0.7);
  backdrop-filter: blur(6px);
  border: 1px solid rgba(213, 228, 239, 0.65);
  box-shadow: 0 2px 10px rgba(22, 91, 145, 0.05);
}
.hero-dot {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: 50%;
  cursor: pointer;
  transition: transform .2s ease;
}
.hero-dot:hover {
  transform: scale(1.2);
}
.hero-dot-pip {
  display: block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #9ab7cc;
  transition: all .25s cubic-bezier(0.4, 0, 0.2, 1);
}
.hero-dot:hover .hero-dot-pip {
  background: #567e9c;
}
.hero-dot[aria-current="true"] .hero-dot-pip {
  width: 10px;
  height: 10px;
  background: #165b91;
  box-shadow: 0 0 0 3px rgba(22, 91, 145, 0.22);
}
.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}
@keyframes hero-arrive { from { opacity: 0; transform: translateX(8px); } to { opacity: 1; transform: translateX(0); } }
@media (max-width: 1000px) {
  .hero-news-products, .hero-news-steps { display: none; }
}
@media (max-width: 650px) {
  .home-hero {
    padding: 40px 6% 28px;
    gap: 24px;
    background: linear-gradient(160deg, #f8fbfd 0%, #edf6fc 60%, #e4f1fa 100%);
  }
  .home-hero .hero-copy h1 { font-size: clamp(33px, 7.8vw, 46px); letter-spacing: -1.2px; }
  .hero-carousel { max-width: 360px; }
  .hero-news { padding: 36px 20px 20px; }
  .hero-news h2 { font-size: 28px; }
  .hero-news-products { height: 60px; }
  .hero-carousel-controls { margin-top: 10px; }
}
@media (prefers-reduced-motion: reduce) {
  .hero-slide { animation: none; }
  .hero-dot-pip { transition: none; }
}

/* Clean white packshot cards and product detail harmonization */
.product-visual:has(img),
.product-beauty .product-visual,
.product-detail-photo {
  background: #ffffff !important;
  box-shadow: none !important;
  border: 1px solid #e1ebf2 !important;
}
.product-visual:has(img) img,
.product-detail-photo img {
  background: #ffffff !important;
  mix-blend-mode: normal !important;
}


/* Dedicated category sections (Beauty, Bebés y niños, Salud continua, Bienestar diario) */
.home-beauty { background:#fffaf8; }
.page-category.theme-baby { background: #fbfdff; }
.page-category.theme-health { background: #fbfffd; }
.page-category.theme-well { background: #fdfbff; }

.page-category.theme-baby .cat-hero, .page-category.theme-baby .beauty-hero { background: linear-gradient(115deg, #f0f9ff, #edf7fd 65%, #e6f3fa); }
.page-category.theme-health .cat-hero, .page-category.theme-health .beauty-hero { background: linear-gradient(115deg, #f2fff7, #edfbf2 65%, #e5f7ed); }
.page-category.theme-well .cat-hero, .page-category.theme-well .beauty-hero { background: linear-gradient(115deg, #faf7ff, #f6f1fd 65%, #ede6fa); }

.beauty-hero { padding-top:40px; padding-bottom:40px; background:linear-gradient(115deg,#fff5f2,#faf5fb 65%,#f1f7fa); }
.cat-hero { padding-top:40px; padding-bottom:40px; }
.cat-hero .eyebrow, .beauty-hero .eyebrow { display:block; color:var(--accent, var(--beauty)); margin:24px 0 14px; }
.cat-hero h1, .beauty-hero h1 { font-size:clamp(36px,5vw,62px); line-height:1.1; letter-spacing:-1.8px; margin:0 0 18px; font-weight:500; }
.cat-hero>p, .beauty-hero>p { max-width:660px; font-size:15px; line-height:1.8; color:var(--muted); }
.cat-stats, .beauty-stats { display:flex; flex-wrap:wrap; gap:12px 24px; margin-top:24px; font-size:12px; }
.cat-stats span+span, .beauty-stats span+span { border-left:1px solid #d5cbd4; padding-left:24px; }
.cat-content, .beauty-content { padding-top:24px; }
.beauty-nav { display:none; }

.cat-tiles, .beauty-tiles { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:20px; margin-bottom:44px; }
.beauty-tiles-home { grid-template-columns:repeat(3,minmax(0,1fr)); margin-bottom:0; }
.cat-tile, .beauty-tile { display:flex; flex-direction:column; align-items:center; text-align:center; position:relative; min-height:228px; gap:14px; padding:18px 16px; border:1px solid #e1ebf2; border-radius:20px; background:var(--tile-color,#ffffff); text-decoration:none; transition:transform .2s,box-shadow .2s,border-color .2s; box-shadow:0 4px 18px rgba(22,91,145,.04); }
.cat-tile:hover, .beauty-tile:hover { transform:translateY(-4px); border-color:#d5cbd4; box-shadow:0 12px 30px color-mix(in srgb, var(--accent, #c74773), transparent 85%); }
.cat-tile.active, .beauty-tile.active { border-color:var(--accent, var(--beauty)); box-shadow:0 0 0 2px var(--accent, var(--beauty)),0 8px 24px color-mix(in srgb, var(--accent, #c74773), transparent 85%); background:#fffbfa; }
.cat-tile.active strong, .beauty-tile.active strong { color:var(--accent, var(--beauty)); }
.cat-tile-photo, .beauty-tile-photo { width:100%; height:142px; border-radius:14px; background:#ffffff; display:flex; align-items:center; justify-content:center; overflow:hidden; border:1px solid #edf2f7; }
.cat-tile-photo img, .beauty-tile-photo img { display:block; width:100%; height:100%; max-height:134px; padding:4px; object-fit:contain; }
.cat-tile-copy, .beauty-tile-copy { min-width:0; width:100%; display:flex; flex-direction:column; align-items:center; }
.cat-tile-copy strong, .beauty-tile-copy strong { display:block; font-size:16px; font-weight:600; line-height:1.35; color:var(--ink); }
.cat-tile-copy small, .beauty-tile-copy small { display:block; color:var(--muted); font-size:12px; margin-top:6px; }

.cat-controls, .beauty-controls { display:flex; align-items:end; flex-wrap:wrap; gap:16px; margin:30px 0 38px; padding:22px; background:#faf9fc; border:1px solid #ece7ee; border-radius:15px; scroll-margin-top:105px; }
.cat-controls label, .beauty-controls label { display:flex; flex-direction:column; gap:9px; min-width:0; }
.cat-controls label>span, .beauty-controls label>span { font-size:11px; color:var(--muted); }
.cat-controls input, .beauty-controls input, .cat-controls select, .beauty-controls select { height:43px; border:1px solid #d9dce5; border-radius:8px; padding:0 12px; background:white; font:inherit; font-size:12px; max-width:100%; }
.cat-search, .beauty-search { flex:1 1 240px; }
.cat-controls select, .beauty-controls select { min-width:160px; }
.cat-controls .button, .beauty-controls .button { height:43px; padding:0 20px; border-radius:8px; font-size:12px; background:var(--accent, var(--beauty)); color:#ffffff; }

.beauty-product-section { margin:0 0 58px; }
.cat-section-heading, .beauty-section-heading { display:flex; align-items:end; justify-content:space-between; gap:20px; margin-bottom:24px; }
.cat-section-heading .eyebrow, .beauty-section-heading .eyebrow { font-size:9px; color:var(--accent, var(--beauty)); letter-spacing:1.5px; }
.cat-section-heading h2, .beauty-section-heading h2 { font-size:30px; margin:8px 0 10px; letter-spacing:-.8px; }
.cat-section-heading p, .beauty-section-heading p { color:var(--muted); font-size:12px; line-height:1.7; margin:0; max-width:560px; }
.cat-section-heading .text-link, .beauty-section-heading .text-link { flex-shrink:0; margin-bottom:3px; }

.cat-results-heading, .beauty-results-heading { display:flex; align-items:center; justify-content:space-between; gap:18px; margin-bottom:24px; scroll-margin-top:105px; }
.cat-results-heading h2, .beauty-results-heading h2 { font-size:25px; margin:0; }
.cat-results-heading>span, .beauty-results-heading>span { font-size:12px; color:var(--muted); white-space:nowrap; }

/* Balanced 4-column product grid and comfortable card sizing in Category and Beauty Pages */
.page-beauty .products, .page-category .products { grid-template-columns:repeat(4,minmax(0,1fr)); gap:20px; }
.page-beauty .product, .page-category .product { padding:12px; border-radius:18px; border:1px solid #e2ecf3; background:#ffffff; box-shadow:0 4px 18px rgba(22,91,145,0.04); transition:transform .2s,box-shadow .2s,border-color .2s; display:flex; flex-direction:column; }
.page-beauty .product:hover, .page-category .product:hover { transform:translateY(-4px); box-shadow:0 12px 28px color-mix(in srgb, var(--accent, #c74773), transparent 85%); border-color:color-mix(in srgb, var(--accent, #c74773), white 65%); }
.page-beauty .product-visual, .page-category .product-visual { height:260px; border-radius:14px; background:#ffffff; padding:8px; border:1px solid #edf2f7; display:flex; align-items:center; justify-content:center; }
.page-beauty .product-visual img, .page-category .product-visual img { height:100%; width:100%; max-height:240px; padding:4px; object-fit:contain; }
.page-beauty .product-meta, .page-category .product-meta { padding:12px 2px 2px; min-height:132px; display:flex; flex-direction:column; }
.page-beauty .product-brand, .page-category .product-brand { font-size:10.5px; font-weight:700; letter-spacing:1.1px; color:var(--accent, var(--beauty)); margin:0 0 5px; text-transform:uppercase; }
.page-beauty .product-title, .page-category .product-title { font-size:14.5px; font-weight:600; line-height:1.38; color:var(--ink); min-height:40px; }
.page-beauty .product-size, .page-category .product-size { font-size:11.5px; color:var(--muted); margin-top:4px; }
.page-beauty .product-bottom, .page-category .product-bottom { display:flex; align-items:center; justify-content:space-between; margin-top:auto; padding-top:10px; border-top:1px solid #f2edf3; gap:8px; }
.page-beauty .price, .page-category .price { font-size:17px; font-weight:700; color:var(--ink); }
.page-beauty .add, .page-category .add { flex-shrink:0; width:38px; height:38px; border-radius:10px; background:var(--accent, var(--beauty)); color:#ffffff; border:none; font-size:21px; display:grid; place-items:center; transition:transform .15s,background .15s; }
.page-beauty .add:hover:not(:disabled), .page-category .add:hover:not(:disabled) { opacity:0.9; transform:scale(1.05); }

/* Adaptación para botón de Caja Familiar en páginas de categoría */
.page-beauty .box-add-btn, .page-category .box-add-btn {
  width: 38px;
  height: 38px;
  border-radius: 10px;
  border: 1.5px solid color-mix(in srgb, var(--accent, #c74773), white 70%);
  background: var(--soft, #fff5f8);
  color: var(--accent, var(--beauty));
}
.page-beauty .box-add-btn:hover:not(:disabled), .page-category .box-add-btn:hover:not(:disabled) {
  background: color-mix(in srgb, var(--accent, #c74773), white 80%);
  border-color: var(--accent, var(--beauty));
}
.page-beauty .box-add-btn.in-box, .page-category .box-add-btn.in-box {
  background: var(--accent, var(--beauty));
  color: #ffffff;
  border-color: var(--accent, var(--beauty));
  box-shadow: 0 2px 8px color-mix(in srgb, var(--accent, #c74773), transparent 75%);
}

.cat-empty, .beauty-empty { text-align:center; padding:50px 15px; }
.cat-empty h2, .beauty-empty h2 { font-size:22px; }
.cat-tile:focus-visible, .beauty-tile:focus-visible, .cat-controls :focus-visible, .beauty-controls :focus-visible { outline:3px solid var(--ocean); outline-offset:4px; }
@media(max-width:1080px) {
  .cat-tiles, .beauty-tiles { grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
  .page-beauty .products, .page-category .products { grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }
  .page-beauty .product-visual, .page-category .product-visual { height:240px; }
  .page-beauty .product-visual img, .page-category .product-visual img { max-height:220px; }
}
@media(max-width:780px) {
  .cat-section-heading, .beauty-section-heading { align-items:start; flex-direction:column; gap:8px; }
  .cat-tiles, .beauty-tiles { grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
  .page-beauty .products, .page-category .products { grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
  .page-beauty .product-visual, .page-category .product-visual { height:200px; }
  .page-beauty .product-visual img, .page-category .product-visual img { max-height:185px; }
  .page-beauty .product-title, .page-category .product-title { font-size:13.5px; min-height:36px; }
  .page-beauty .price, .page-category .price { font-size:15.5px; }
  .page-beauty .add, .page-category .add,
  .page-beauty .box-add-btn, .page-category .box-add-btn { width:35px; height:35px; border-radius:9px; font-size:19px; }
}
@media(max-width:500px) {
  .page-beauty .products, .page-category .products { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
  .page-beauty .product, .page-category .product { padding:8px; border-radius:14px; }
  .page-beauty .product-visual, .page-category .product-visual { height:160px; border-radius:12px; }
  .page-beauty .product-visual img, .page-category .product-visual img { max-height:146px; padding:2px; }
  .page-beauty .product-meta, .page-category .product-meta { padding:8px 1px 1px; min-height:112px; }
  .page-beauty .product-brand, .page-category .product-brand { font-size:9.5px; margin:0 0 3px; }
  .page-beauty .product-title, .page-category .product-title { font-size:12px; min-height:32px; line-height:1.3; }
  .page-beauty .product-size, .page-category .product-size { font-size:10px; margin-top:2px; }
  .page-beauty .product-bottom, .page-category .product-bottom { padding-top:6px; }
  .page-beauty .price, .page-category .price { font-size:14px; }
  .page-beauty .add, .page-category .add,
  .page-beauty .box-add-btn, .page-category .box-add-btn { width:30px; height:30px; border-radius:8px; font-size:16px; }
}
@media(max-width:340px) {
  .page-beauty .products, .page-category .products { grid-template-columns:1fr; }
}
@media(max-width:480px) {
  .cat-hero, .beauty-hero { padding-top:26px; padding-bottom:30px; }
  .cat-hero h1, .beauty-hero h1 { font-size:37px; }
  .cat-tiles, .beauty-tiles { grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
  .cat-tile, .beauty-tile { min-height:190px; align-items:center; padding:14px 10px; gap:10px; }
  .cat-tile-photo, .beauty-tile-photo { width:100%; height:110px; }
  .cat-tile-photo img, .beauty-tile-photo img { max-height:102px; padding:3px; }
  .cat-tile-copy strong, .beauty-tile-copy strong { font-size:13.5px; }
  .cat-tile-copy small, .beauty-tile-copy small { font-size:11px; margin-top:4px; }
  .cat-controls, .beauty-controls { padding:14px; gap:14px; }
  .cat-controls label, .beauty-controls label { flex:1 1 110px; }
  .cat-controls .cat-search, .beauty-controls .beauty-search { flex-basis:100%; }
  .cat-controls select, .beauty-controls select { min-width:0; width:100%; }
  .cat-controls .button, .beauty-controls .beauty-search-button { width:100%; }
  .cat-section-heading h2, .beauty-section-heading h2 { font-size:26px; }
}

/* ==========================================================================
   Interactive 3D Inflatable Balloon Category Navigation & Popover
   ========================================================================== */
/* Balance the header around the category control. */
.shop-header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  align-items: center;
}
.shop-header > .logo { justify-self: start; }
.shop-header > .header-actions { justify-self: end; }

.category-balloon-wrapper {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  z-index: 110;
}

.category-balloon-trigger {
  background: transparent;
  border: none;
  padding: 0;
  cursor: pointer;
  outline: none;
  font-family: inherit;
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
  display: inline-flex;
  align-items: center;
}

.category-balloon-trigger:focus-visible .balloon-pill {
  outline: 3px solid var(--ocean);
  outline-offset: 4px;
}

/* Preserve the balloon proportions; only the count sits inside it. */
.balloon-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 44px;
  min-height: 60px;
  padding: 2px;
  border-radius: 20px;
  color: var(--ink);
  white-space: nowrap;
  user-select: none;
  transition: background .2s ease;
}

.category-balloon-trigger:hover .balloon-pill,
.category-balloon-trigger[aria-expanded="true"] .balloon-pill {
  background: #eff8fc;
}

.balloon-3d-bubble {
  position: relative;
  top: 4px;
  display: block;
  flex: 0 0 56px;
  width: 56px;
  height: 56px;
  transform-origin: 50% 75%;
  transition: transform .25s cubic-bezier(.34, 1.56, .64, 1);
}

.balloon-image {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  filter: drop-shadow(0 2px 2px rgba(22, 91, 145, .10));
}

.balloon-count {
  position: absolute;
  top: 42%;
  left: 49%;
  transform: translate(-50%, -50%);
  color: #ffffff;
  text-shadow: 0 1px 2px rgba(22, 91, 145, .45);
  font-size: 13px;
  font-weight: 700;
  line-height: 1;
}

.category-balloon-trigger:hover .balloon-3d-bubble {
  transform: translateY(-2px) rotate(-4deg);
}

.category-balloon-trigger:active .balloon-3d-bubble,
.category-balloon-trigger.is-squished .balloon-3d-bubble {
  transform: scaleX(1.09) scaleY(.89);
}

/* Backdrop: Hidden on desktop, subtle dim on mobile (no blur) */
.balloon-backdrop {
  display: none !important;
}

@media(max-width: 760px) {
  .balloon-backdrop {
    display: block !important;
    position: fixed;
    inset: 0;
    background: rgba(18, 57, 85, 0.4);
    z-index: 95;
    transition: opacity 0.2s ease;
  }
  .balloon-backdrop[hidden] {
    display: none !important;
  }
}

/* The Balloon Categories Popover Panel */
.categories-balloon-panel {
  position: absolute;
  top: calc(100% + 14px);
  left: 50%;
  transform: translateX(-50%);
  width: 580px;
  max-width: calc(100vw - 32px);
  background: #ffffff;
  border: 1px solid #d5e4ef;
  border-radius: 24px;
  padding: 22px;
  box-shadow:
    0 20px 48px rgba(22, 91, 145, 0.16),
    0 3px 10px rgba(22, 91, 145, 0.05);
  z-index: 120;
  transform-origin: top center;
  animation: balloonPopIn 0.22s cubic-bezier(0.16, 1, 0.3, 1) forwards;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

.categories-balloon-panel[hidden] {
  display: none !important;
}

@keyframes balloonPopIn {
  0% {
    opacity: 0;
    transform: translateX(-50%) scale(0.95) translateY(-6px);
  }
  100% {
    opacity: 1;
    transform: translateX(-50%) scale(1) translateY(0);
  }
}

.balloon-panel-arrow {
  position: absolute;
  top: -7px;
  left: 50%;
  transform: translateX(-50%) rotate(45deg);
  width: 13px;
  height: 13px;
  background: #ffffff;
  border-top: 1px solid #d5e4ef;
  border-left: 1px solid #d5e4ef;
  box-shadow: -2px -2px 4px rgba(22, 91, 145, 0.04);
}

.balloon-panel-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 16px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--line);
}

.balloon-panel-eyebrow {
  display: block;
  font-size: 9px;
  letter-spacing: 1.5px;
  font-weight: 700;
  color: var(--ocean);
  margin-bottom: 3px;
}

.balloon-panel-title {
  font-size: 18px;
  font-weight: 600;
  margin: 0;
  color: var(--ink);
  letter-spacing: -0.4px;
}

.balloon-panel-close {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: #f0f6fa;
  color: var(--muted);
  font-size: 20px;
  line-height: 1;
  transition: all 0.2s ease;
  border: none;
  cursor: pointer;
}

.balloon-panel-close:hover {
  background: #e1ebf2;
  color: var(--ink);
  transform: scale(1.08);
}

/* Category grid inside popover */
.balloon-categories-grid {
  display: grid !important;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  margin-bottom: 16px;
}

.balloon-cat-card {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 14px;
  border-radius: 16px;
  text-decoration: none;
  color: var(--ink);
  border: 1.5px solid transparent;
  transition: transform 0.22s cubic-bezier(0.34, 1.56, 0.64, 1),
              box-shadow 0.22s ease,
              border-color 0.22s ease;
  position: relative;
  overflow: hidden;
}

.balloon-cat-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 20px rgba(22, 91, 145, 0.1);
}

.balloon-cat-card:active {
  transform: scale(0.97);
}

.balloon-cat-beauty {
  background: linear-gradient(135deg, #fff3f7 0%, #fde7ef 100%);
  border-color: #fbd3e1;
}
.balloon-cat-beauty:hover {
  border-color: #f7a9c4;
}

.balloon-cat-baby {
  background: linear-gradient(135deg, #f0faff 0%, #def2fe 100%);
  border-color: #c7e7fc;
}
.balloon-cat-baby:hover {
  border-color: #92d0f8;
}

.balloon-cat-health {
  background: linear-gradient(135deg, #f1fbf5 0%, #dbf5e7 100%);
  border-color: #c3eed6;
}
.balloon-cat-health:hover {
  border-color: #8eddb0;
}

.balloon-cat-well {
  background: linear-gradient(135deg, #f8f6ff 0%, #ece6ff 100%);
  border-color: #ded6ff;
}
.balloon-cat-well:hover {
  border-color: #baa8ff;
}

.balloon-cat-visual {
  width: 48px;
  height: 48px;
  border-radius: 14px;
  background: #ffffff;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 2px 6px rgba(22, 91, 145, 0.08);
  border: 1px solid rgba(22, 91, 145, 0.08);
  flex-shrink: 0;
  overflow: hidden;
}

.balloon-cat-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  mix-blend-mode: normal;
  border-radius: 12px;
  transition: transform 0.25s ease;
}

.balloon-cat-card:hover .balloon-cat-img {
  transform: scale(1.08);
}

.balloon-cat-info {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
  flex: 1;
}

.balloon-cat-name {
  font-size: 14px;
  font-weight: 700;
  color: var(--ink);
  letter-spacing: -0.3px;
}

.balloon-cat-desc {
  font-size: 11px;
  color: var(--muted);
  line-height: 1.35;
  white-space: normal;
}

.balloon-cat-arrow {
  color: var(--ocean);
  opacity: 0.6;
  transition: all 0.2s ease;
  flex-shrink: 0;
}

.balloon-cat-card:hover .balloon-cat-arrow {
  opacity: 1;
  transform: translateX(3px);
}

/* Active Category in Popover */
.balloon-cat-card.is-current {
  box-shadow: 0 0 0 2px var(--ocean), 0 8px 20px rgba(22, 91, 145, 0.15);
}

.balloon-cat-card.is-current::after {
  content: 'Viendo ahora';
  position: absolute;
  top: 6px;
  right: 8px;
  font-size: 8px;
  font-weight: 700;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  background: var(--ocean);
  color: #ffffff;
  padding: 2px 7px;
  border-radius: 10px;
}

/* Footer Banner: Arma tu caja */
.balloon-box-banner {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 12px 16px;
  border-radius: 16px;
  background: linear-gradient(120deg, #144f80 0%, #1a6da3 55%, #2a88bf 100%);
  color: #ffffff;
  text-decoration: none;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.balloon-box-banner:hover {
  transform: translateY(-1px);
  box-shadow: 0 8px 22px rgba(20, 79, 128, 0.25);
}

.balloon-box-thumb {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.15);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  overflow: hidden;
}

.balloon-box-thumb img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  mix-blend-mode: screen;
}

.balloon-box-info {
  display: flex;
  flex-direction: column;
  gap: 1px;
  flex: 1;
  min-width: 0;
}

.balloon-box-kicker {
  font-size: 8px;
  letter-spacing: 1.2px;
  font-weight: 700;
  color: #c9e8fc;
}

.balloon-box-title {
  font-size: 13px;
  font-weight: 700;
  color: #ffffff;
}

.balloon-box-sub {
  font-size: 10px;
  color: #e2f2fc;
}

.balloon-box-btn {
  font-size: 11px;
  font-weight: 700;
  background: #ffffff;
  color: #144f80;
  padding: 6px 12px;
  border-radius: 20px;
  white-space: nowrap;
  transition: transform 0.2s ease;
}

.balloon-box-banner:hover .balloon-box-btn {
  transform: scale(1.05);
}

/* ==========================================================================
   Responsive Adaptations
   ========================================================================== */
@media(max-width: 760px) {
  .category-balloon-wrapper { flex: 0 0 auto; }
  .balloon-pill { min-height: 48px; padding: 2px; }
  .balloon-3d-bubble { top: 3px; flex-basis: 44px; width: 44px; height: 44px; }
  .balloon-count { font-size: 12px; }

  .categories-balloon-panel {
    position: fixed;
    top: auto;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    max-width: 100%;
    transform: none;
    border-radius: 28px 28px 0 0;
    border: 1px solid #d5e4ef;
    border-bottom: none;
    background: #ffffff;
    box-shadow: 0 -8px 30px rgba(22, 91, 145, 0.2);
    padding: 20px 20px 30px;
    max-height: 85dvh;
    overflow-y: auto;
    z-index: 1002;
    animation: balloonSlideUp 0.25s cubic-bezier(0.16, 1, 0.3, 1) forwards;
  }

  @keyframes balloonSlideUp {
    0% {
      opacity: 0;
      transform: translateY(100%);
    }
    100% {
      opacity: 1;
      transform: translateY(0);
    }
  }

  .balloon-panel-arrow {
    display: none;
  }

  .balloon-categories-grid {
    grid-template-columns: 1fr !important;
    gap: 10px;
  }
}

@media(max-width: 650px) {
  .shop-header {
    height: 74px;
    padding: 0 4%;
    gap: 8px;
  }
  .logo-img {
    height: 42px;
    max-width: 135px;
  }
  .header-actions {
    gap: 8px;
  }
  .bag {
    padding: 8px 10px;
    font-size: 11px;
  }
}

@media(max-width: 650px) {
  .shop-header > .logo { flex: 0 0 auto; }
  .shop-header .logo-img { width: clamp(72px, 22vw, 120px); height: auto; }
  .shop-header .header-actions { flex: 0 0 auto; }
}

@media(max-width: 380px) {
  .shop-header { gap: 5px; }
  .balloon-3d-bubble { flex-basis: 38px; width: 38px; height: 38px; }
  .balloon-count { font-size: 11px; }
  .shop-header .bag { padding: 8px; font-size: 10px; }
}

@media(prefers-reduced-motion: reduce) {
  .balloon-pill, .balloon-3d-bubble { transition: none; }
  .category-balloon-trigger:hover .balloon-3d-bubble,
  .category-balloon-trigger:active .balloon-3d-bubble,
  .category-balloon-trigger.is-squished .balloon-3d-bubble { transform: none; }
  .categories-balloon-panel { animation: none; }
}

/* Blog and Promos dedicated pages */
.blog-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 28px;
}
.blog-card {
  background: #ffffff;
  border: 1px solid var(--line);
  border-radius: 18px;
  padding: 32px 28px;
  box-shadow: 0 12px 30px rgba(22, 91, 145, 0.05);
  display: flex;
  flex-direction: column;
  transition: transform .2s ease, box-shadow .2s ease;
}
.blog-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 18px 40px rgba(22, 91, 145, 0.1);
}
.blog-cat {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 1.2px;
  text-transform: uppercase;
  margin-bottom: 14px;
}
.cat-badge-baby { color: #1689bf; }
.cat-badge-beauty { color: #c74773; }
.cat-badge-health { color: #2d8d5d; }
.cat-badge-well { color: #725ac6; }
.blog-card h2 {
  font-size: 20px;
  line-height: 1.35;
  margin-bottom: 12px;
  font-weight: 600;
  color: var(--ink);
}
.blog-card p {
  font-size: 13px;
  line-height: 1.7;
  color: var(--muted);
  margin-bottom: 20px;
}
.blog-card .text-link {
  margin-top: auto;
  font-weight: 600;
  color: var(--ocean);
}
@media (max-width: 760px) {
  .blog-grid {
    grid-template-columns: 1fr;
    gap: 18px;
  }
  .blog-card {
    padding: 24px 20px;
  }
}

/* ==========================================================================
   Modal Selector: Canasta vs Caja Familiar
   ========================================================================== */
dialog.choice-dialog {
  padding: 0;
  border: 1px solid #d5e4ef;
  border-radius: 24px;
  background: #ffffff;
  max-width: 480px;
  width: calc(100% - 32px);
  box-shadow: 0 20px 50px rgba(18, 57, 85, 0.22);
  overflow: hidden;
  animation: choiceFadeIn 0.22s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

@keyframes choiceFadeIn {
  0% {
    opacity: 0;
    transform: translateY(12px) scale(0.97);
  }
  100% {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

.choice-dialog::backdrop {
  background: rgba(16, 42, 67, 0.45);
  backdrop-filter: blur(4px);
}

.choice-dialog-header {
  padding: 20px 22px 16px;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  border-bottom: 1px solid #edf4f9;
  background: #fbfdfe;
}

.choice-product-summary {
  display: flex;
  align-items: center;
  gap: 14px;
  flex: 1;
  min-width: 0;
}

.choice-product-thumb {
  width: 58px;
  height: 58px;
  border-radius: 14px;
  background: #ffffff;
  border: 1px solid #e2ecf3;
  padding: 4px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  box-shadow: 0 2px 8px rgba(22, 91, 145, 0.06);
  overflow: hidden;
}

.choice-product-thumb img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}

.choice-product-details {
  display: flex;
  flex-direction: column;
  min-width: 0;
  gap: 2px;
}

.choice-product-brand {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: var(--ocean);
}

.choice-product-name {
  font-size: 15px;
  font-weight: 600;
  color: var(--ink);
  margin: 0;
  line-height: 1.3;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.choice-product-pricing {
  display: flex;
  align-items: baseline;
  gap: 8px;
  margin-top: 3px;
}

.choice-product-price {
  font-size: 15px;
  font-weight: 700;
  color: var(--ink);
}

.choice-product-size {
  font-size: 11px;
  color: var(--muted);
}

.choice-close {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: #f0f6fa;
  color: var(--muted);
  font-size: 20px;
  border: none;
  cursor: pointer;
  transition: all 0.2s ease;
  flex-shrink: 0;
}

.choice-close:hover {
  background: #e1ebf2;
  color: var(--ink);
  transform: scale(1.06);
}

.choice-dialog-body {
  padding: 20px 22px 24px;
}

.choice-prompt-label {
  font-size: 13px;
  font-weight: 600;
  color: var(--ink);
  margin: 0 0 14px;
}

.choice-destinations {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.choice-card {
  width: 100%;
  text-align: left;
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 16px 18px;
  border-radius: 18px;
  border: 1.5px solid #e1ebf2;
  background: #ffffff;
  cursor: pointer;
  transition: all 0.22s cubic-bezier(0.2, 0.8, 0.2, 1);
  position: relative;
  overflow: hidden;
}

.choice-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(22, 91, 145, 0.12);
}

.choice-card:active {
  transform: scale(0.98);
}

.choice-card-cart:hover {
  border-color: #92d0f8;
  background: linear-gradient(135deg, #f7fcff 0%, #edf7ff 100%);
}

.choice-card-box:hover {
  border-color: #8eddb0;
  background: linear-gradient(135deg, #f5fcf8 0%, #ebf9f1 100%);
}

.choice-icon-wrap {
  width: 44px;
  height: 44px;
  border-radius: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  transition: transform 0.2s ease;
}

.choice-card:hover .choice-icon-wrap {
  transform: scale(1.08);
}

.choice-icon-wrap.cart-icon {
  background: #eaf5fc;
  color: var(--ocean);
}

.choice-icon-wrap.box-icon {
  background: #e9f8ef;
  color: #1a7f4c;
}

.choice-card-content {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 3px;
}

.choice-card-title-row {
  display: flex;
  align-items: center;
  gap: 8px;
}

.choice-title {
  font-size: 15px;
  font-weight: 700;
  color: var(--ink);
}

.choice-badge {
  font-size: 9.5px;
  font-weight: 700;
  letter-spacing: 0.4px;
  text-transform: uppercase;
  padding: 2px 7px;
  border-radius: 8px;
}

.badge-cart {
  background: #d8eefa;
  color: #115788;
}

.badge-box {
  background: #d2f4e0;
  color: #14693e;
}

.choice-desc {
  font-size: 11.5px;
  color: var(--muted);
  line-height: 1.35;
  margin: 0;
}

.choice-current-status {
  font-size: 11px;
  font-weight: 600;
  color: var(--ocean);
  margin-top: 3px;
}

.choice-action-arrow {
  font-size: 20px;
  font-weight: 400;
  color: var(--muted);
  transition: all 0.2s ease;
  flex-shrink: 0;
}

.choice-card:hover .choice-action-arrow {
  color: var(--ink);
  transform: scale(1.15);
}

/* Badge for .add button when item is in cart or box */
.add {
  position: relative;
}
.add-count-badge {
  position: absolute;
  top: -6px;
  right: -6px;
  background: #25D366;
  color: #ffffff;
  font-size: 10px;
  font-weight: 800;
  border-radius: 10px;
  padding: 2px 6px;
  line-height: 1;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
}

/* Mobile: Bottom-sheet style */
@media(max-width: 600px) {
  dialog.choice-dialog {
    position: fixed;
    top: auto;
    bottom: 0;
    left: 0;
    right: 0;
    max-width: 100%;
    width: 100%;
    border-radius: 26px 26px 0 0;
    border-bottom: none;
    margin: 0;
    animation: choiceSlideUp 0.25s cubic-bezier(0.16, 1, 0.3, 1) forwards;
  }

  @keyframes choiceSlideUp {
    0% {
      opacity: 0;
      transform: translateY(100%);
    }
    100% {
      opacity: 1;
      transform: translateY(0);
    }
  }
}

.product-tag.tag-out {
  background: #fef2f2 !important;
  color: #b91c1c !important;
  border: 1px solid #fecaca;
  box-shadow: 0 4px 12px rgba(185, 28, 28, 0.12);
  font-weight: 700;
}

.product.is-out-of-stock .product-visual img {
  opacity: 0.75;
}