.logo-container{
display:flex;
align-items:center;
gap:15px;
}

.logo{
 height: 100px;
 width:auto;
}

header h1{
font-size:22px;
margin:0;
}
:root{
    --beige:#e8d8ca;
    --beige-soft:#f5ede6;
    --rose-beige:#dcc0b0;
    --brown:#4d372f;
    --brown-soft:#6b4f43;
    --light:#fcf8f4;
    --card:#fffaf7;
}
*{box-sizing:border-box;margin:0;padding:0;font-family:'Montserrat',sans-serif;}
body{
    background:linear-gradient(180deg,#fdfaf7 0%, #f7efe8 100%);
    color:var(--brown);
}
header{
    display:flex;
    justify-content:space-between;
    align-items:center;
    padding:20px 60px;
    background:var(--beige-soft);
    position:sticky;
    top:0;
    z-index:1000;
    border-bottom:1px solid #eadccf;
}
header h1{font-weight:800;letter-spacing:2px;}
nav a{
    margin:0 15px;
    text-decoration:none;
    color:var(--brown);
    font-weight:600;
}
nav a:hover{color:var(--brown-soft);}
.product-search{
  min-width:240px;
  padding:8px 12px;
  border-radius:999px;
  border:1px solid #d8c5b8;
  background:#fffaf6;
  color:#4d372f;
}
.product-search:focus{
  outline:2px solid #ead2c3;
  border-color:#bf9986;
}
.cart-toggle{background:var(--brown);color:white;border:none;padding:10px 18px;border-radius:30px;cursor:pointer;font-weight:700;position:relative;}
.cart-count{position:absolute;top:-8px;right:-8px;background:var(--rose-beige);color:var(--brown);font-size:12px;padding:4px 7px;border-radius:50%;font-weight:800;}
.hero{
    height:85vh;
    background:
      linear-gradient(120deg, rgba(77,55,47,0.40), rgba(220,192,176,0.45)),
      url('https://images.unsplash.com/photo-1544161515-4ab6ce6db874?auto=format&fit=crop&w=1600&q=80') center/cover;
    display:flex;
    align-items:center;
    padding-left:80px;
    color:white;
}
.hero h2{font-size:55px;max-width:600px;}
.hero button{
    margin-top:20px;
    padding:15px 40px;
    background:var(--beige);
    border:none;
    font-weight:700;
    cursor:pointer;
}
.section-title{
    text-align:center;
    padding:60px 0 30px;
    font-size:32px;
    font-weight:800;
    color:var(--brown);
}
.products{
    padding:40px 60px;
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(250px,1fr));
    gap:30px;
}
.card{
    background:var(--card);
    padding:20px;
    border-radius:12px;
    text-align:center;
    border:1px solid #efdfd2;
    box-shadow:0 8px 20px rgba(109,76,57,0.08);
}
.card img{width:100%;border-radius:10px;}
.card h3{margin:10px 0;}
.card button{
    margin-top:10px;
    padding:10px 20px;
    background:var(--brown);
    color:white;
    border:none;
    cursor:pointer;
}
.cart{
    position:fixed;
    right:-400px;
    top:0;
    width:350px;
    height:100%;
    background:white;
    box-shadow:-5px 0 15px rgba(0,0,0,0.1);
    padding:20px;
    transition:0.4s;
    overflow-y:auto;
    z-index:2000;
}
.cart.active{right:0;}
.cart h2{margin:0;font-size:24px;line-height:1.1;}
.cart-header{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:12px;
    margin-bottom:12px;
    padding-bottom:10px;
    border-bottom:1px solid #ead9cd;
}
.cart-sub{
    margin-top:4px;
    font-size:13px;
    color:#7d6256;
}
.cart-close{
    margin:0 !important;
    width:34px;
    height:34px;
    padding:0;
    border-radius:50% !important;
    background:#3b2a24 !important;
    display:flex;
    align-items:center;
    justify-content:center;
}
.cart-meta{
    margin-bottom:10px;
    display:inline-block;
    font-size:12px;
    font-weight:700;
    color:#6f5448;
    background:#f2e4d8;
    border:1px solid #e4d1c3;
    border-radius:999px;
    padding:5px 10px;
}
.cart-item{margin-bottom:10px;font-size:14px;}
.total{
    margin-top:16px;
    font-weight:800;
    font-size:24px;
    color:#262626;
    background:#fff;
    border:1px solid #ead9cd;
    border-radius:10px;
    padding:12px;
}
.checkout{
    margin-top:20px;
    padding:12px;
    width:100%;
    background:#f0c14b;
    border:none;
    font-weight:700;
    cursor:pointer;
    color:#111;
    border:1px solid #a88734;
}
.checkout:hover{
    background:#e6b83f !important;
    transform:none !important;
}
.checkout-clear{
    margin-top:10px;
    width:100%;
    background:#b28b79;
    color:#fff;
}
.checkout-clear:hover{
    background:#9a7564;
}
.checkout-actions{
    display:grid;
    gap:10px;
    margin-top:14px;
}
.checkout-alt{
    width:100%;
    background:#1f8f52;
    color:#fff;
}
.checkout-alt:hover{
    background:#187343;
}
.checkout-ig{
    width:100%;
    background: linear-gradient(45deg,#c13584,#e1306c,#f56040);
    color:#fff;
}
.checkout-ig:hover{
    background: linear-gradient(45deg,#ac2e75,#c72a5f,#df5336);
}
.checkout-panel{
    position:fixed;
    inset:0;
    background:rgba(40,27,22,0.45);
    display:none;
    align-items:center;
    justify-content:center;
    padding:20px;
    z-index:3000;
}
.checkout-panel.active{
    display:flex;
}
.checkout-card{
    width:min(980px, 100%);
    max-height:90vh;
    overflow:auto;
    background:#fffaf7;
    border:1px solid #ebd9cc;
    border-radius:16px;
    padding:24px;
    position:relative;
}
.checkout-close{
    position:absolute;
    top:14px;
    right:14px;
    width:36px;
    height:36px;
    padding:0;
    border-radius:50%;
}
.checkout-subtitle{
    margin:8px 0 14px;
    color:#7a5f53;
}
.checkout-summary{
    background:#f8eee7;
    border:1px solid #ead9cd;
    border-radius:10px;
    padding:12px;
    font-size:14px;
}
.checkout-layout{
    display:grid;
    grid-template-columns:minmax(260px, 0.9fr) minmax(320px, 1.1fr);
    gap:14px;
    align-items:start;
    margin-top:10px;
}
.checkout-side,
.checkout-main{
    background:#fff;
    border:1px solid #ead9cd;
    border-radius:12px;
    padding:14px;
}
.checkout-side h3,
.checkout-main h3{
    font-size:16px;
    margin-bottom:10px;
    color:#3f2f28;
}
.checkout-form{
    display:grid;
    gap:10px;
}
.checkout-form input,
.checkout-form select,
.checkout-form textarea{
    width:100%;
    padding:10px;
    border:1px solid #d9c6b7;
    border-radius:8px;
    font:inherit;
    background:#fff;
}
.checkout-confirm{
    width:100%;
    margin-top:14px;
    background:#f0c14b !important;
    color:#111 !important;
    border:1px solid #a88734 !important;
}
.checkout-confirm:hover{
    background:#e6b83f !important;
    transform:none !important;
}
.checkout-message{
    margin-top:10px;
    font-size:14px;
    color:#2b6d3a;
    font-weight:600;
}
@media (max-width: 680px){
    .checkout-card{
        padding:18px;
    }
    .checkout-subtitle{
        font-size:14px;
    }
    .checkout-layout{
        grid-template-columns:1fr;
    }
}
.whatsapp-float {
    position: fixed;
    right: 20px;
    bottom: 20px;
    display: flex;
    align-items: center;
    gap: 8px;
    background: #25D366;
    color: white;
    padding: 12px 18px;
    border-radius: 40px;
    text-decoration: none;
    font-weight: 600;
    box-shadow: 0 6px 18px rgba(0,0,0,0.25);
    transition: 0.3s ease;
    z-index: 999;
    animation: pulseWhats 2s infinite;
}

.whatsapp-float:hover {
    transform: scale(1.08);
    background: #1ebe5d;
}

@keyframes pulseWhats {
    0% { box-shadow: 0 0 0 0 rgba(37,211,102,0.6); }
    70% { box-shadow: 0 0 0 10px rgba(37,211,102,0); }
    100% { box-shadow: 0 0 0 0 rgba(37,211,102,0); }
}
.instagram-float {
    position: fixed;
    right: 20px;
    bottom: 90px; /* arriba del WhatsApp */
    background: #E1306C;
    color: white;
    padding: 12px 18px;
    border-radius: 30px;
    text-decoration: none;
    font-weight: 600;
    box-shadow: 0 4px 10px rgba(0,0,0,0.2);
    transition: 0.3s ease;
    z-index: 999;
}

.instagram-float {
    position: fixed;
    right: 20px;
    bottom: 95px;
    display: flex;
    align-items: center;
    gap: 8px;
    background: linear-gradient(45deg,#E1306C,#F56040,#FCAF45);
    color: white;
    padding: 12px 18px;
    border-radius: 40px;
    text-decoration: none;
    font-weight: 600;
    box-shadow: 0 6px 18px rgba(0,0,0,0.25);
    transition: 0.3s ease;
    z-index: 999;
    animation: pulse 2s infinite;
}

.instagram-float:hover {
    transform: scale(1.08);
}

@keyframes pulse {
    0% { box-shadow: 0 0 0 0 rgba(225,48,108,0.6); }
    70% { box-shadow: 0 0 0 10px rgba(225,48,108,0); }
    100% { box-shadow: 0 0 0 0 rgba(225,48,108,0); }
}
.card {
opacity: 0;
transform: translateY(20px);
transition: all 0.6s ease;
}

.card.show {
opacity: 1;
transform: translateY(0);
}
.card:hover{
transform: translateY(-8px);
box-shadow: 0 16px 32px rgba(109,76,57,0.18);
transition: 0.3s ease;
}
.card img{
transition: transform 0.4s ease;
filter: sepia(16%) saturate(88%) hue-rotate(-10deg) brightness(1.03);
}

.card:hover img{
transform: scale(1.05);
}
button{
background:var(--brown);
color:white;
border:none;
padding:10px 18px;
border-radius:8px;
cursor:pointer;
font-weight:600;
transition:0.3s;
}

button:hover{
background:var(--brown-soft);
transform:scale(1.05);
}
.footer{
  background: #5a4136;
  color: #f8ede6;
  padding: 40px 20px;
}

.footer-container{
  max-width: 1200px;
  margin: auto;
  text-align: center;
}

.footer h3{
  font-size: 22px;
  margin-bottom: 10px;
  font-weight: 800;
}

.footer p{
  margin: 8px 0;
  font-size: 14px;
}

.footer-links,
.footer-social{
  margin: 15px 0;
}

.footer a{
  color: #ccc;
  margin: 0 10px;
  text-decoration: none;
  font-size: 14px;
  transition: 0.3s;
}

.footer a:hover{
  color: white;
}

.copy{
  margin-top: 20px;
  font-size: 12px;
  color: #ead9cc;
}
.product-images {
  position: relative;
  width: 100%;
  height: 250px;
  overflow: hidden;
}

.product-images img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: none;
}

.product-images img.active {
  display: block;
}

.color-picker {
  display: flex;
  gap: 10px;
  margin: 10px 0;
  justify-content: center;
  align-items: center;
}

.color-picker .color {
  width: 20px;
  height: 20px;
  border-radius: 50%;
  cursor: pointer;
  border: 2px solid #ccc;
  transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}
.color-picker .color:hover{
  transform: scale(1.08);
}
.color-picker .color.selected{
  border-color: #4d372f;
  box-shadow: 0 0 0 3px rgba(77,55,47,0.18);
  transform: scale(1.1);
}
.size-add-row{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  margin-top:10px;
}
.size-add-row select{
  min-width:72px;
  height:40px;
  padding:0 10px;
  border:1px solid #d9c6b7;
  border-radius:8px;
  background:#fff;
}
.size-add-row button{
  margin-top:0;
}
.product-images {
  position: relative;
  width: 100%;
  height: 250px;
  overflow: hidden;
}

.product-images img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: none;
}

.product-images img.active {
  display: block;
}

.card .prev, .card .next {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  background: rgba(77,55,47,0.70);
  color: white;
  border: none;
  padding: 5px 10px;
  cursor: pointer;
  font-weight: bold;
}

.card .prev { left: 10px; }
.card .next { right: 10px; }

/* Theme polish: femenino beige */
:root{
  --cream:#fff7f1;
  --sand:#f2e6dc;
  --accent:#b88d78;
}

body{
  background:
    radial-gradient(1200px 600px at -10% -20%, #fffdfb 0%, transparent 60%),
    radial-gradient(900px 500px at 110% 10%, #f6ebe2 0%, transparent 55%),
    linear-gradient(180deg,#fdfaf7 0%, #f5ece4 100%);
}

header{
  backdrop-filter: blur(8px);
  box-shadow: 0 6px 20px rgba(90,64,49,0.08);
}

nav a{
  position: relative;
  transition: color 0.25s ease;
}

nav a::after{
  content: "";
  position: absolute;
  left: 0;
  bottom: -6px;
  width: 100%;
  height: 2px;
  background: var(--accent);
  transform: scaleX(0);
  transform-origin: center;
  transition: transform 0.25s ease;
}

nav a:hover::after{
  transform: scaleX(1);
}

.hero{
  border-bottom-left-radius: 34px;
  border-bottom-right-radius: 34px;
  overflow: hidden;
}

.hero h2{
  text-shadow: 0 6px 18px rgba(0,0,0,0.25);
  line-height: 1.1;
}

.section-title{
  letter-spacing: 0.4px;
}

.card{
  border-radius: 16px;
  box-shadow: 0 12px 26px rgba(109,76,57,0.1);
}

.card:hover{
  box-shadow: 0 20px 34px rgba(109,76,57,0.2);
}

.card button,
button{
  border-radius: 999px;
  letter-spacing: 0.2px;
}

.size-add-row select,
.checkout-form input,
.checkout-form select,
.checkout-form textarea{
  border-color: #d7c1b1;
}

.size-add-row select:focus,
.checkout-form input:focus,
.checkout-form select:focus,
.checkout-form textarea:focus{
  outline: 2px solid #e6cdbd;
  border-color: #be9885;
}

.cart{
  background: #fffaf6;
  border-left: 1px solid #ecd9cc;
  box-shadow: -10px 0 28px rgba(90,64,49,0.15);
}

.checkout-card{
  box-shadow: 0 24px 50px rgba(74,50,39,0.22);
}

section[style*="background:white"]{
  background: linear-gradient(180deg, var(--cream), var(--sand)) !important;
  border-top: 1px solid #ecdbce;
  border-bottom: 1px solid #ecdbce;
}

.new-arrivals{
  padding: 10px 60px 40px;
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(230px,1fr));
  gap:22px;
}

.arrival-card{
  position:relative;
  background:#fffaf6;
  border:1px solid #ead8cb;
  border-radius:18px;
  padding:14px;
  box-shadow:0 10px 24px rgba(90,64,49,0.1);
}

.arrival-card img{
  width:100%;
  height:220px;
  object-fit:cover;
  border-radius:12px;
  margin-bottom:10px;
}

.arrival-card h3{
  margin:4px 0;
}

.arrival-card p{
  font-size:14px;
  color:#6f5449;
  margin-bottom:8px;
}

.arrival-tag{
  position:absolute;
  top:12px;
  left:12px;
  background:#4d372f;
  color:#fff;
  border-radius:20px;
  padding:4px 10px;
  font-size:11px;
  font-weight:700;
}

.size-guide{
  padding:0 60px 30px;
}

.size-guide-note{
  text-align:center;
  margin-bottom:12px;
  color:#7b5e53;
}

.size-guide-table-wrap{
  overflow:auto;
  background:#fff9f4;
  border:1px solid #e9d7c9;
  border-radius:14px;
}

.size-guide-table{
  width:100%;
  border-collapse:collapse;
  min-width:520px;
}

.size-guide-table th,
.size-guide-table td{
  padding:12px 14px;
  border-bottom:1px solid #efdfd3;
  text-align:center;
}

.size-guide-table th{
  background:#f5e9df;
  color:#4d372f;
}

.faq-section{
  padding:0 60px 40px;
  max-width:980px;
  margin:0 auto;
  display:grid;
  gap:12px;
}

.faq-item{
  background:#fffaf6;
  border:1px solid #ead9cc;
  border-radius:12px;
  padding:12px 14px;
}

.faq-item summary{
  cursor:pointer;
  font-weight:700;
  color:#4d372f;
}

.faq-item p{
  margin-top:10px;
  color:#6f5449;
  line-height:1.55;
}

.location-section{
  padding:40px 60px;
  max-width:1100px;
  margin:auto;
}

.location-intro{
  text-align:center;
  font-size:16px;
  margin-bottom:20px;
}

.location-layout{
  display:grid;
  grid-template-columns:1.15fr 0.85fr;
  gap:18px;
  align-items:stretch;
}

.location-map-card,
.satisfaction-card{
  background:#fff9f4;
  border:1px solid #ead7ca;
  border-radius:14px;
  padding:14px;
  box-shadow:0 10px 24px rgba(90,64,49,0.09);
}

.map-link{
  margin-top:12px;
  display:inline-block;
  padding:10px 20px;
  background:#4d372f;
  color:#fff;
  border-radius:999px;
  text-decoration:none;
  font-weight:600;
}

.satisfaction-card h3{
  margin-bottom:6px;
}

.satisfaction-card p{
  margin-bottom:10px;
  color:#6f5449;
  font-size:14px;
}

.satisfaction-card input,
.satisfaction-card select,
.satisfaction-card textarea{
  width:100%;
  margin-top:8px;
  padding:10px;
  border:1px solid #d8c5b8;
  border-radius:8px;
  background:#fff;
  font:inherit;
}

.satisfaction-card button{
  width:100%;
  margin-top:12px;
}

@media (max-width: 900px){
  header{
    padding: 16px 18px;
    gap: 12px;
    flex-wrap: wrap;
  }

  nav{
    width: 100%;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    row-gap: 8px;
  }

  .hero{
    height: 62vh;
    padding-left: 26px;
  }

  .hero h2{
    font-size: 38px;
  }

  .products{
    padding: 26px 18px;
    gap: 18px;
  }

  .new-arrivals,
  .size-guide,
  .faq-section{
    padding-left:18px;
    padding-right:18px;
  }

  .location-section{
    padding:24px 18px;
  }

  .location-layout{
    grid-template-columns:1fr;
  }

  .cart{
    width:min(250px, 74vw);
    right:-100vw;
    padding:10px;
  }

  .cart h2{
    font-size:18px;
    margin-bottom:10px;
  }

  .cart .total{
    font-size:14px;
  }

  .cart .cart-line span{
    font-size:12px;
    line-height:1.35;
  }

  .cart .qty-controls button{
    padding:3px 6px !important;
  }
}

@media (max-width: 600px){
  header{
    padding:10px 12px;
    gap:8px;
  }

  .logo{
    height:58px;
  }

  nav{
    order:3;
    width:100%;
    justify-content:flex-start;
    overflow-x:auto;
    flex-wrap:nowrap;
    gap:12px;
    padding-bottom:4px;
    scrollbar-width:thin;
  }

  nav a{
    margin:0;
    white-space:nowrap;
    font-size:13px;
  }

  .cart-toggle{
    padding:8px 12px;
    font-size:12px;
    margin-left:auto;
  }

  .hero{
    height:54vh;
    min-height:280px;
    padding:18px 14px;
    align-items:flex-end;
  }

  .hero h2{
    font-size:28px;
    max-width:100%;
  }

  .section-title{
    padding:34px 0 18px;
    font-size:24px;
  }

  .catalog-controls{
    padding:0 12px;
    gap:10px !important;
    margin-bottom:18px !important;
  }

  #filterCategory,
  #sortPrice,
  .product-search{
    width:100%;
    min-width:0;
  }

  .products{
    grid-template-columns:1fr;
    gap:14px;
    padding:18px 12px;
  }

  .card{
    padding:14px;
    border-radius:14px;
  }

  .product-images{
    height:220px;
  }

  .size-add-row{
    flex-wrap:wrap;
  }

  .size-add-row select,
  .size-add-row button{
    width:100%;
  }

  .cart{
    width:92vw;
    max-width:92vw;
    padding:12px;
  }
  .cart h2{
    font-size:20px;
  }
  .total{
    font-size:20px;
    padding:10px;
  }

  .checkout-card{
    padding:14px;
    border-radius:12px;
  }

  .checkout-actions button{
    font-size:13px;
    padding:10px;
  }

  .whatsapp-float,
  .instagram-float{
    right:12px;
    padding:10px 12px;
    border-radius:999px;
    font-size:0;
    gap:0;
  }

  .whatsapp-float{
    bottom:74px;
  }

  .instagram-float{
    bottom:20px;
  }

  .whatsapp-float span,
  .instagram-float span{
    display:none;
  }

  .back-to-top{
    left:12px !important;
    bottom:20px !important;
    width:40px;
    height:40px;
    padding:0 !important;
    border-radius:50% !important;
    display:flex;
    align-items:center;
    justify-content:center;
    z-index:1001;
  }

  .trust-banner,
  .payment-methods,
  .testimonials,
  .about-section,
  .location-section{
    padding-left:12px !important;
    padding-right:12px !important;
  }

  .payment-methods{
    gap:16px !important;
    justify-content:flex-start !important;
  }

  .new-arrivals{
    padding:10px 12px 24px;
    gap:12px;
  }

  .arrival-card img{
    height:180px;
  }

  .footer{
    padding:26px 12px;
  }
}