:root{--ink:#171715;--cream:#f4efe7;--ivory:#fbf8f3;--stone:#e6ded2;--gold:#9b7440;--muted:#6f685e;--line:#ddd4c8}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--ivory);color:var(--ink);font-family:Montserrat,Arial,sans-serif}a{text-decoration:none;color:inherit}img{display:block;width:100%;height:100%;object-fit:cover}button,input{font:inherit}.topbar{height:44.2px;background:#1d1e1c;color:#f7f3ed;display:grid;grid-template-columns:1fr 1fr 1fr;align-items:center;padding:0 4.5vw;font-size:13.0px;letter-spacing:.02em}.topbar-center{text-align:center;font-family:"Cormorant Garamond",serif;font-style:italic;font-size:15.6px;color:#cdbb9b}.topbar>div:last-child{text-align:right}.header{height:91.0px;background:#fffaf4;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;padding:0 4vw;border-bottom:1.3px solid #eee7de;position:sticky;top:0;z-index:20}.brand{display:flex;flex-direction:column}.brand strong{font-family:"Cormorant Garamond",serif;font-size:46.8px;letter-spacing:.19em;font-weight:500;line-height:.8}.brand span{font-size:7.8px;letter-spacing:.25em;margin-top:9.1px}#giemei-nav{display:none}.header-actions{display:flex;justify-content:flex-end;align-items:center;gap:15.6px;min-width:0}.search{width:clamp(150px,15vw,266.5px);height:44.2px;border:1.3px solid #d8d0c6;display:flex;align-items:center;background:white;min-width:0}.search input{border:0;outline:0;width:100%;padding:0 13.0px;font-size:11.7px;background:transparent}.search span{font-size:26.0px;padding-right:10.4px}.header-actions button{border:0;background:none;font-size:26.0px;min-width:49.4px;position:relative}.header-actions button small{display:block;font-family:"Cormorant Garamond",serif;font-size:10.4px}.cart svg{width:20px;height:20px;display:block;margin:0 auto}.cart i{position:absolute;top:-2.6px;right:1.3px;background:#111;color:white;border-radius:26.0px;width:16.9px;height:16.9px;font-size:10.4px;font-style:normal;display:grid;place-items:center}.hero{position:relative;height:533.0px;background:#f3ede5;overflow:hidden}.hero-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center}.hero-copy{position:relative;z-index:2;height:100%;max-width:600px;padding:59.8px 39.0px 39.0px 5.5vw;background:linear-gradient(90deg,rgba(248,244,238,.94) 0%,rgba(245,239,231,.72) 45%,rgba(245,239,231,0) 70%)}.eyebrow{font-size:11.7px;letter-spacing:.33em;display:flex;align-items:center;gap:26.0px}.eyebrow span{width:71.5px;height:1.3px;background:#a98552}.hero h1{font-family:"Cormorant Garamond",serif;font-weight:500;font-size:71.5px;line-height:.83;margin:18.2px 0 16.9px;letter-spacing:-.035em}.hero-lead{font-family:"Cormorant Garamond",serif;font-size:23.4px;line-height:1.15;margin:0 0 24.7px}.hero-buttons{display:flex;gap:19.5px}.btn{height:49.4px;display:inline-flex;align-items:center;justify-content:center;padding:0 27.3px;font-size:10.4px;letter-spacing:.08em;border:1.3px solid #1b1b1a}.btn-dark{background:#181816;color:#fff}.btn-light{background:#fbf8f3}.btn-light.filled{background:white;border:0}.hero-tags{margin-top:29.9px;font-size:9.1px;letter-spacing:.3em}.benefits{height:83.2px;display:grid;grid-template-columns:repeat(4,1fr);background:#fbf8f3;border-bottom:1.3px solid #e7dfd5;align-items:center;padding:0 4.5vw}.benefits>div{display:flex;align-items:center;gap:15.6px;height:46.8px;padding:0 35.1px;border-right:1.3px solid #dfd7cb}.benefits>div:last-child{border:0}.benefit-icon{font-size:37.7px;color:#a57b45}.benefits p{margin:0}.benefits b{display:block;font-size:10.4px;letter-spacing:.04em}.benefits small{font-family:"Cormorant Garamond",serif;font-size:13.0px;color:#555}.section{padding:23.4px 3vw}.section-title{height:41.6px;display:grid;grid-template-columns:45.5px auto 45.5px 1fr;align-items:center;gap:16.9px;margin-bottom:9.1px}.section-title span{height:1.3px;background:#b99a6b}.section-title h2{font-family:"Cormorant Garamond",serif;font-size:26.0px;letter-spacing:.12em;font-weight:500;margin:0}.section-title a{font-size:10.4px;text-align:right}.section-title.simple{grid-template-columns:1fr auto}.section-title.simple h2{text-align:center}.product-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:16px}.life-grid{display:flex;flex-wrap:wrap;gap:24px;justify-content:space-between}.category-carousel{position:relative}.category-carousel__arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:3;width:42px;height:42px;border-radius:50%;border:1.3px solid rgba(155,116,64,.55);background:rgba(251,248,243,.94);color:#9b7440;font-size:24px;line-height:1;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background .25s,color .25s;box-shadow:0 2px 10px rgba(23,24,22,.08);padding:0}.category-carousel__arrow:hover{background:#9b7440;color:#fbf8f3}.category-carousel__arrow--prev{left:-8px}.category-carousel__arrow--next{right:-8px}.category-grid.category-track{display:flex;flex-wrap:nowrap;gap:20px;overflow-x:auto;scroll-snap-type:none;scrollbar-width:none;-ms-overflow-style:none}.category-grid.category-track::-webkit-scrollbar{display:none}.category-track .category-card{flex:0 0 210px;scroll-snap-align:start}.category-card{background:#f8f4ee;border:1.3px solid #ece4da;overflow:hidden;width:100%}.category-card__img{position:relative;height:297px;overflow:hidden;background:#efe8dc}.category-card__img img{display:block;width:100%;height:100%;object-fit:cover}.category-card.category-fallback .category-card__img::after{content:"";position:absolute;inset:0;background:linear-gradient(rgba(244,239,231,.34),rgba(155,116,64,.16))}.category-card>div:last-child{height:70px;padding:11.7px 13.0px;position:relative}.category-card b,.category-card small{display:block;font-size:10.4px}.category-card small{font-family:"Cormorant Garamond",serif;font-size:13.0px;color:#716b63;margin-top:2.6px}.category-card em{position:absolute;right:13.0px;bottom:11.7px;color:#9b7440;font-style:normal}.products{padding-top:10.4px;padding-bottom:36px}.product-grid article{background:#f9f5ef;border:1.3px solid #ece3d8;min-width:0}.product-img{height:188.5px;position:relative;background:#eee}.product-img>button{position:absolute;right:10.4px;top:9.1px;border:0;background:transparent;font-size:23.4px}.product-info{padding:9.1px 11.7px}.product-info span,.product-info b{display:block;font-family:"Cormorant Garamond",serif}.product-info span{font-size:14.3px}.product-info b{font-size:18.2px;margin:3.9px 0 7.8px}.product-info>button{width:100%;height:31.2px;background:#1a1a18;color:#fff;border:0;font-size:9.1px;letter-spacing:.08em}.campaign{height:370px;display:grid;grid-template-columns:56% 44%}.campaign article{position:relative;overflow:hidden}.campaign-left img{position:absolute;inset:0}.shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(15,15,14,.65),rgba(15,15,14,.12))}.campaign-copy{position:absolute;z-index:2;left:4.5vw;top:32.5px;color:white}.campaign-copy small{font-size:9.1px;letter-spacing:.35em}.campaign-copy h2{font-family:"Cormorant Garamond",serif;font-size:32.5px;line-height:.95;font-weight:400;letter-spacing:.12em;margin:9.1px 0}.campaign-copy h2 strong{font-size:50.7px;font-weight:500}.campaign-copy p{font-family:"Cormorant Garamond",serif;font-size:16.9px;margin:0 0 13.0px}.script{position:absolute;z-index:2;right:31.2px;bottom:36.4px;color:#d1ac72;font-family:Allura,cursive;font-size:36.4px;line-height:.75;transform:rotate(-6deg)}.campaign-right{display:grid;grid-template-columns:48% 52%;background:#f2eae0}.campaign-right-copy{padding:35.1px 6.5px 13.0px 41.6px;z-index:2}.campaign-right-copy h2{font-family:"Cormorant Garamond",serif;font-size:37.7px;line-height:.9;font-weight:500;margin:0}.campaign-right-copy span{display:block;width:28.6px;height:1.3px;background:#b99767;margin:15.6px 0}.campaign-right-copy small{display:block;font-family:inherit;font-size:9.1px;letter-spacing:.35em;text-transform:uppercase;color:#b99767;margin-bottom:13px}.campaign-right-copy p{font-family:"Cormorant Garamond",serif;font-size:18.2px}.campaign-right img{object-position:center}.campaign-right-img{grid-column:2;position:relative;overflow:hidden}.campaign-right-img img{width:100%;height:100%;object-fit:contain;object-position:center;display:block}.campaign-right-img.fallback::after{content:'';position:absolute;inset:0;background:linear-gradient(285deg,rgba(244,239,231,.30),rgba(155,116,64,.16));pointer-events:none}.manifesto{min-height:153.4px;padding:16.9px 4vw;display:grid;grid-template-columns:28% 39% 33%;align-items:center;background:#fbf8f3}.manifesto-brand{border-right:1.3px solid #b69a72}.manifesto-brand small{font-size:9.1px;letter-spacing:.28em}.manifesto-brand h2{font-family:"Cormorant Garamond",serif;font-size:54.6px;letter-spacing:.12em;margin:0;line-height:.85;font-weight:500}.manifesto-brand p{font-family:Allura,cursive;color:#9b7440;font-size:33.8px;margin:2.6px 0 0}.manifesto-text{font-family:"Cormorant Garamond",serif;font-size:16.9px;line-height:1.25;padding:0 41.6px;color:#615c55}.manifesto-art{display:flex;align-items:center;gap:10.4px;justify-content:flex-end}.manifesto-art img{width:188.5px;height:101.4px;object-fit:cover;mix-blend-mode:multiply}.manifesto-art p{font-family:Allura,cursive;font-size:28.6px;line-height:.85;text-align:center}.lifestyle{padding-top:14.3px;padding-bottom:10.4px}.life-grid article{border:1.3px solid #e9e0d5;background:#faf6f0;padding-bottom:6.5px;flex:1 1 0;min-width:0}.life-grid img{height:220px}.life-grid .product-noimage{height:220px;display:flex;align-items:center;justify-content:center;color:#cdbb9b;background:#faf6f0}.life-grid .product-noimage svg{width:34.0px;height:34.0px}.life-grid span,.life-grid b{display:block;padding:0 10.4px;font-family:"Cormorant Garamond",serif}.life-grid span{font-size:13.0px;margin-top:6.5px}.life-grid b{font-size:15.6px}.instagram{background:#fbf8f3}.instagram-head{height:40.3px;padding:0 3vw;display:flex;justify-content:space-between;align-items:center;font-size:10.4px;letter-spacing:.14em}.instagram-strip{display:grid;grid-template-columns:repeat(9,1fr);overflow:hidden}.instagram-strip img{width:100%;height:auto;object-fit:cover;transition:.4s}.instagram-strip img:hover{transform:scale(1.06);filter:contrast(1.05)}.footer{background:#171816;color:#eee9e1;display:grid;grid-template-columns:1.25fr 0.7fr 0.9fr 1fr 1fr;column-gap:36.4px;row-gap:18px;padding:31.2px 4vw 26px;position:relative;font-family:"Cormorant Garamond",serif}.footer-brand strong{font-size:44px;letter-spacing:.17em;font-weight:500}.footer-brand small{display:block;font-size:10.5px;letter-spacing:.19em}.footer h4{font-size:20.5px;font-weight:500;margin:0 0 14px}.footer a,.footer p,.footer small{display:block;font-size:15.5px;color:#c8c2b9;line-height:1.55;margin:0}.footer button{background:transparent;color:#eee;border:1.3px solid #72644f;height:40px;font-size:12.5px;padding:0 15.6px}.cards{background:#f6f2eb;color:#1b1b1b;display:inline-block;padding:6.5px;font-family:Arial;font-weight:bold;font-size:13px;margin-bottom:10.4px}.footer-credit{grid-column:1/-1;display:flex;align-items:center;justify-content:flex-start;gap:8px;font-size:14px;color:#aaa399}.footer-credit a{display:inline-flex;align-items:center;gap:7px;color:#cdbb9b;font-weight:500;font-size:14px}.footer-credit a:hover{color:#eee9e1}.footer-credit img{width:20px;height:20px;border-radius:50%;object-fit:cover;display:inline-block}.footer-bottom{grid-column:1/-1;border-top:1.3px solid #393934;display:grid;grid-template-columns:1fr 1fr 1fr;align-items:center;padding:14px 0 0;font-size:12.5px;color:#aaa399}.footer-bottom em{text-align:center;color:#ad8d60;font-family:Allura,cursive;font-size:24px}.footer-bottom span:last-child{text-align:right;line-height:1.5}.footer-bottom span:last-child a{display:inline}@media(max-width:900px){.header{height:auto;grid-template-columns:1fr auto;padding:20.8px}.hero{height:auto;min-height:560.0px}.hero-copy{height:auto;max-width:none;padding:58.5px 28.6px}.hero h1{font-size:61.1px}.benefits{height:auto;grid-template-columns:repeat(2,minmax(0,1fr));padding:13.0px}.benefits>div{border:0;min-width:0;gap:10.4px;padding:13.0px}.benefits>div p{min-width:0;overflow-wrap:anywhere}.category-grid,.product-grid{grid-template-columns:repeat(2,1fr)}.life-grid article{width:100%;flex:0 0 calc(50% - 12px)}.campaign{height:auto;grid-template-columns:1fr}.campaign-left{height:364.0px}.campaign-right{height:312.0px}.manifesto{grid-template-columns:1fr;gap:19.5px}.manifesto-brand{border:0}.manifesto-art{justify-content:flex-start}.instagram-strip{grid-template-columns:repeat(4,1fr)}.instagram-strip img:nth-child(n+5){display:none}.footer{grid-template-columns:1fr 1fr;padding-bottom:24px}.footer-bottom{grid-template-columns:1fr;padding:12px 0 0;gap:6.5px}.footer-bottom em,.footer-bottom span:last-child{text-align:left}} .footer a:hover{color:#eee} .footer .footer-social a{display:inline-block} .footer .footer-contact{display:inline} .footer .footer-maps{display:inline-block;background:transparent;color:#eee;border:1.3px solid #72644f;height:40px;font-size:12.5px;padding:0 15.6px;line-height:38px;text-transform:uppercase} .footer-local-address{margin:0;line-height:1.7}.footer-local-ciudad{padding-left:18px;color:#c8c2b9;font-size:14px}.footer-local-phone,.footer-local-email{margin:4px 0;line-height:1.6}.footer-local-phone a,.footer-local-email a{display:inline-block;color:#c8c2b9;font-size:14.5px}.footer-local-phone a:hover,.footer-local-email a:hover{color:#cdbb9b}.footer .footer-maps:hover{border-color:#eee} .footer-brand strong{font-size:clamp(24px,3vw,44px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%} .giemei-page{max-width:820px;margin:0 auto;padding:84px 4vw 64px} .giemei-page__heading{text-align:center;margin-bottom:44px} .giemei-page__heading h1{font-family:"Cormorant Garamond",serif;font-weight:500;font-size:32px;letter-spacing:.02em;margin:0 0 8px;color:var(--ink)} .giemei-page__heading p{font-size:13px;color:var(--muted);margin:0} .giemei-page__content p,.giemei-page__content li{font-size:15px;line-height:1.75;color:var(--muted)} .giemei-page__content h3{font-family:"Cormorant Garamond",serif;font-weight:500;font-size:21px;margin:34px 0 12px;color:var(--ink)} .giemei-page__content ul{padding-left:20px;margin:0 0 12px} .giemei-page__content a{color:var(--gold)} .giemei-page__contacto{margin-top:44px;padding:20px 24px;background:var(--cream);border-radius:8px} .giemei-page__contacto p{font-size:14px;color:var(--ink);margin:0} .giemei-page__contacto a{color:var(--gold)} .giemei-faq{max-width:640px;margin:0 auto} .giemei-faq-item{border-bottom:1px solid var(--line);padding:16px 0} .giemei-faq-item summary{list-style:none;cursor:pointer;font-weight:600;font-size:14.5px;color:var(--ink);padding-right:28px;position:relative;transition:color .25s} .giemei-faq-item summary::-webkit-details-marker{display:none} .giemei-faq-item summary::after{content:"+";position:absolute;right:0;top:0;font-size:16px;color:var(--gold)} .giemei-faq-item[open] summary{color:var(--gold)} .giemei-faq-item[open] summary::after{transform:rotate(45deg)} .giemei-faq-item .giemei-faq-answer{padding-top:12px;font-size:14px;line-height:1.7;color:var(--muted)} .giemei-faq-item .giemei-faq-answer p{margin:0 0 6px} .payment-methods{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:10.4px}.payment-methods img{width:auto;height:28px;object-fit:contain;background:#fff;border-radius:4px;padding:3px 6px;display:block} .product-detail{padding:6vw 4vw 4vw;background:var(--ivory)}.product-detail .container{max-width:1200px;margin:0 auto}.breadcrumb{display:flex;align-items:center;gap:10px;font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.06em;margin-bottom:36px}.breadcrumb a:hover{color:var(--gold)}.breadcrumb span{color:var(--line)}.product-detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:5vw;align-items:start;margin-bottom:6vw}.product-detail-media{position:sticky;top:120px}.product-detail-image{border:1.3px solid var(--line);background:var(--cream);aspect-ratio:3/4;overflow:hidden;max-width:500px}.product-detail-image img{width:100%;height:100%;object-fit:cover}.product-detail-info{padding-top:20px}.product-detail-category{font-family:Montserrat,Arial,sans-serif;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--gold)}.product-detail-info h1{font-family:'Cormorant Garamond',serif;font-size:clamp(32px,4vw,52px);font-weight:500;margin:12px 0 18px;line-height:1.05}.product-detail-price{font-family:'Cormorant Garamond',serif;font-size:28px;color:var(--ink);margin:0 0 24px}.product-detail-desc{font-size:14px;line-height:1.8;color:var(--muted);margin-bottom:24px}.product-detail-specs{font-size:13px;line-height:1.9;color:var(--muted);margin-bottom:28px}.product-detail-specs ul{margin:0;padding-left:18px}.product-detail-actions{display:flex;align-items:center;gap:16px;margin-bottom:28px;flex-wrap:wrap}.product-detail-qty{display:flex;align-items:center;border:1.3px solid var(--line);background:#fff;height:49.4px}.product-detail-qty button{width:42px;height:100%;border:0;background:none;font-size:18px;color:var(--ink);cursor:pointer}.product-detail-qty input{width:48px;height:100%;border:0;text-align:center;font-size:14px;outline:none;-moz-appearance:textfield}.product-detail-qty input::-webkit-outer-spin-button,.product-detail-qty input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.product-detail-meta{display:grid;gap:10px;font-size:12px;letter-spacing:.04em;color:var(--muted)}.product-detail-meta span{color:var(--gold);margin-right:6px}.related-products{padding-top:4vw;border-top:1.3px solid var(--line)}@media (max-width:991px){.product-detail-grid{grid-template-columns:1fr}.product-detail-media{position:static}} .product-img .product-noimage.giemei-noimage,.life-grid .product-noimage.giemei-noimage{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:linear-gradient(165deg,#f3ebdd,#e8d9c4);color:#9b7440}.product-img .product-noimage.giemei-noimage svg,.life-grid .product-noimage.giemei-noimage svg{width:36px;height:36px;opacity:.85}.life-grid .product-noimage.giemei-noimage{height:220px} .product-detail-image .product-noimage.giemei-noimage{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:linear-gradient(165deg,#f3ebdd,#e8d9c4);color:#9b7440}.product-detail-image .product-noimage.giemei-noimage svg{width:72px;height:72px;opacity:.85} .product-detail-thumbs{display:flex;gap:10px;margin-top:14px;flex-wrap:wrap}.product-detail-thumb{width:68px;height:90px;padding:0;border:1.3px solid var(--line);background:var(--cream);cursor:pointer;overflow:hidden;transition:border-color .25s}.product-detail-thumb img{width:100%;height:100%;object-fit:cover;display:block}.product-detail-thumb.is-active{border-color:var(--gold)} .instagram{position:relative;padding-bottom:26px} .instagram-handle{border-bottom:1px solid var(--gold);padding-bottom:2px;transition:color .25s} .instagram-handle:hover{color:var(--gold)} .instagram-carousel{display:flex;gap:1.6vw;overflow-x:auto;scroll-snap-type:x proximity;scrollbar-width:none;padding:0 3vw;max-width:1020px;margin:0 auto} .instagram-carousel::-webkit-scrollbar{display:none} .insta-post{flex:0 0 calc((100% - 4.8vw)/4);scroll-snap-align:start} .insta-post>a{display:block;position:relative;aspect-ratio:210/297;overflow:hidden;border-radius:6px;background:var(--stone)} .insta-post-img{width:100%;height:100%;object-fit:cover;transition:transform .5s} .insta-post>a:hover .insta-post-img{transform:scale(1.05)} .insta-post::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,rgba(23,23,21,.55));opacity:0;transition:opacity .3s;border-radius:6px;pointer-events:none} .insta-post>a:hover::after{opacity:1} .insta-post-btn{position:absolute;left:50%;bottom:16px;transform:translate(-50%,10px);padding:9px 16px;background:#171715;color:#fffaf4;font-size:11px;letter-spacing:.08em;white-space:nowrap;opacity:0;pointer-events:none;transition:.3s;z-index:2;border-radius:3px} .insta-post>a:hover .insta-post-btn{opacity:1;transform:translate(-50%,0)} .insta-arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:3;width:44px;height:44px;border:none;border-radius:50%;background:#171715;color:#fffaf4;font-size:26px;line-height:1;cursor:pointer;display:grid;place-items:center;transition:.25s;box-shadow:0 2px 10px rgba(23,23,21,.25)} .insta-arrow:hover{background:var(--gold)} .insta-prev{left:0.6vw}.insta-next{right:0.6vw} .insta-dots{display:flex;justify-content:center;gap:8px;margin-top:18px} .insta-dot{width:9px;height:9px;padding:0;border:1.3px solid var(--gold);border-radius:50%;background:transparent;cursor:pointer;transition:.25s} .insta-dot.active{background:var(--gold)} @media(max-width:767px){.instagram-carousel{gap:0}.insta-post{flex:0 0 100%;scroll-snap-align:center}.insta-arrow{width:36px;height:36px;font-size:20px}} .topbar-center.topbar-carousel{position:relative;overflow:hidden;align-self:stretch;height:44.2px} .topbar-frase{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;opacity:0;transform:translateY(8px);transition:opacity .5s,transform .5s;font-size:16.8px} .topbar-frase.is-visible{opacity:1;transform:none} /* ========================================================================== RESPONSIVE HOME2 — correcciones para <=900px (bloque legible, al final) 1) elimina el scroll horizontal de pagina 2) adapta topbar, header y nav a movil ========================================================================== */ /* --- 1) Red de seguridad ------------------------------------------------- `clip` en vez de `hidden`: `hidden` convierte al elemento en contenedor de scroll y romperia el `position:sticky` de .header */ html{overflow-x:clip} @supports not (overflow:clip){html{overflow-x:hidden}} .brand__logo{width:54px;height:54px;max-width:54px;max-height:54px;flex:0 0 54px;border-radius:50%;object-fit:cover} .product-detail-qty{display:inline-flex;align-items:center;gap:4px;width:max-content;height:56px;padding:5px;border:1px solid var(--line);border-radius:8px;background:#fff} .product-detail-qty .qtybtn{display:grid;width:44px;height:44px;flex:0 0 44px;place-items:center;padding:0;border:0;border-radius:6px;background:#f4efe7;color:var(--ink);font-family:Montserrat,Arial,sans-serif;font-size:20px;font-weight:600;line-height:1;cursor:pointer;transition:background .18s,color .18s,transform .12s} .product-detail-qty .qtybtn:hover{background:var(--gold);color:#fff} .product-detail-qty .qtybtn:active{transform:scale(.94)} .product-detail-qty .qtybtn:focus-visible{outline:2px solid var(--gold);outline-offset:2px} .product-detail-qty input{width:48px;height:44px;flex:0 0 48px;padding:0;border:0;background:transparent;color:var(--ink);font-family:Montserrat,Arial,sans-serif;font-size:17px;font-weight:600;text-align:center;outline:none} /* --- 2) Grid de destacados: que ningun track baje de su min-content ------- */ .product-info span{overflow-wrap:anywhere} .product-info b{white-space:nowrap} /* --- 3) Elementos que solo existen dentro del drawer -------------------- */ .nav-close, .nav-search{display:none} /* --- 4) Boton hamburguesa ------------------------------------------------ */ .nav-toggle{display:none;width:40px;height:40px;padding:0;border:0;background:none;color:var(--ink);cursor:pointer;place-items:center} .nav-toggle svg{width:24px;height:24px;display:block} /* --- 5) Backdrop del drawer ---------------------------------------------- */ .nav-backdrop{position:fixed;inset:0;z-index:50;background:rgba(23,23,21,.45);opacity:0;visibility:hidden;transition:opacity .3s,visibility .3s} .nav-backdrop.is-open{opacity:1;visibility:visible} /* ========================================================================== <=900px — tablet y movil ========================================================================== */ @media(max-width:900px){ /* --- Topbar: version condensada, solo el carrusel de frases ------------ */ .topbar{grid-template-columns:1fr;justify-items:center;padding:0 4vw} .topbar>div:first-child, .topbar>div:last-child{display:none} .topbar-center{font-size:14px} /* --- Header: marca + 3 acciones no entran en 375px -------------------- */ .search{display:none} .header{grid-template-columns:auto minmax(0,1fr) auto;column-gap:10px;padding:14px;align-items:center} .brand{min-width:0} .brand strong{font-size:clamp(24px,6.6vw,34px);white-space:nowrap} .brand span{font-size:6.4px;letter-spacing:.16em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .header-actions{gap:6px} .header-actions button{min-width:40px;font-size:22px} .header-actions button small{display:none} /* --- Nav: pasa a drawer lateral off-canvas ---------------------------- */ #giemei-nav{ display:flex; position:fixed; top:0; left:0; bottom:0; width:min(84vw,340px); z-index:60; flex-direction:column; align-items:stretch; justify-content:flex-start; gap:0; padding:20px 24px 34px; background:#fffaf4; border-right:1.3px solid #eee7de; box-shadow:10px 0 34px rgba(23,23,21,.18); transform:translateX(-100%); visibility:hidden; transition:transform .32s ease,visibility .32s; overflow-y:auto; -webkit-overflow-scrolling:touch; } #giemei-nav.is-open{transform:none;visibility:visible} body.nav-open{position:fixed;width:100%;overflow:hidden} .nav-toggle{display:grid} .nav-close{display:grid;position:sticky;top:0;margin-left:auto;width:44px;height:44px;padding:0;border:0;background:none;color:var(--ink);font-size:30px;line-height:1;cursor:pointer;place-items:center} .nav-search{display:flex;align-items:center;height:44.2px;margin:0 0 18px;border:1.3px solid #d8d0c6;background:#fff} .nav-search input{flex:1;min-width:0;border:0;outline:0;background:transparent;padding:0 13px;font-size:12.7px} .nav-search span{font-size:24px;padding-right:10px} #giemei-nav a{position:static;padding:15px 0;border-bottom:1.3px solid #eee7de;font-size:19px} #giemei-nav a:after{display:none} #giemei-nav a:hover{color:var(--gold)} /* --- Hero: el texto a tamano fijo se pasa del ancho en 320-390px ------- */ .hero-copy{padding:40px 22px} .hero h1{font-size:clamp(38px,10.5vw,61.1px)} .hero-lead{font-size:clamp(15px,4.4vw,20px)} .hero-buttons{flex-wrap:wrap;gap:12px} .btn{height:46px;padding:0 20px;font-size:9.8px} .hero-tags{letter-spacing:.2em;line-height:1.7} /* --- Titulos de seccion: el track `auto` desbordaba en movil ----------- */ .section-title{height:auto;grid-template-columns:1fr auto;gap:10px} .section-title>span{display:none} .section-title h2{font-size:19px;letter-spacing:.08em} .section-title.simple h2{text-align:left} /* --- Grid de destacados ------------------------------------------------ */ .product-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px} .product-img{height:auto;aspect-ratio:3/4} .product-info{padding:8px 9px} .product-info span{font-size:13px} .product-info b{font-size:16px;margin:3px 0 6px} .product-info>button{height:30px;font-size:8.4px;letter-spacing:.04em} .related-products .product-grid article{display:flex;flex-direction:column} .related-products .product-info{display:flex;flex:1;flex-direction:column;align-items:stretch} .product-img>button{font-size:20px} /* --- Campaign: la copy no puede desbordar su columna de 48% ------------- */ .campaign-right{grid-template-columns:1fr;height:auto} .campaign-right-img{grid-column:auto;height:300px} .campaign-right-copy{padding:30px 22px 34px} .campaign-right-copy h2{font-size:clamp(28px,8.4vw,37.7px)} } /* --- <=480px: ajustes finos ---------------------------------------------- */ @media(max-width:480px){ .header{column-gap:6px;padding:12px} .nav-toggle{width:36px;height:36px} .header-actions button{min-width:34px;font-size:20px} .brand span{display:none} .brand strong{font-size:clamp(21px,6.2vw,26px);letter-spacing:.14em} .product-grid{gap:10px} .product-info{padding:7px 8px} .product-info>button{font-size:7.8px;letter-spacing:0} .btn{padding:0 16px;font-size:9.2px} } /* ========================================================================== MENU DE CUENTA — dropdown del boton Cuenta (sesion iniciada) Vive aqui porque este stylesheet lo cargan los dos layouts publicos (layout.app y giemei.layout). ========================================================================== */ .header__account-wrap{position:relative;display:inline-flex} /* El trigger es un