/* === HERO — THE WOW MOMENT === */
.hero_inicio {
    padding:20px 0 10px;
    position:relative;
}
.hero_inicio::before {
    content:''; position:absolute; top:-60px; left:50%; transform:translateX(-50%);
    width:80%; height:300px;
   
    pointer-events:none; z-index:0;
}
.hero_contenedor {
    position:relative; z-index:1;
    display:grid; grid-template-columns:1.1fr 1fr; gap:36px; align-items:center;
}
.hero_texto {
    background:#fff;
    border-radius:var(--radius-xl); padding:42px;
    box-shadow: var(--shadow-lg);
    position:relative; overflow:hidden;
    animation: slideUp .8s cubic-bezier(.22,.61,.36,1) both;
}
/* Paint stripe accent */
.hero_texto::before {
    content:''; position:absolute; top:0; left:0; width:6px; height:100%;
    background: var(--violet);
    border-radius:0 4px 4px 0;
}
.hero_texto::after {
    content:''; position:absolute; top:-50px; right:-50px;
    width:200px; height:200px;
   
    pointer-events:none;
}
.hero_texto .eyebrow { margin-bottom:14px; }
.hero_texto h1 {
    font-size: clamp(2.2rem, 4.5vw, 3.8rem);
    line-height:1.06; margin-bottom:16px;
    letter-spacing:-0.03em;
}
.hero_texto h1 span, .hero_texto h1 em {
    color: var(--violet);
    font-style:normal;
}
.hero_texto p { color:var(--text-secondary); font-size:1.05rem; max-width:50ch; line-height:1.7; }
.hero_acciones { display:flex; gap:12px; margin-top:26px; flex-wrap:wrap; }
.btn_hero {
    padding:14px 28px; border-radius:999px;
    background: var(--coral);
    color:#182534; font-weight:700; font-size:.92rem;
    box-shadow: var(--shadow-color);
    transition: all .35s cubic-bezier(.25,.46,.45,.94);
}
.btn_hero:hover { transform:translateY(-3px) scale(1.02); box-shadow: 0 14px 30px rgba(212,167,61,.24); }
.btn_hero.secundario {
    background:#fff; color:var(--text);
    border:1px solid var(--violet);
    box-shadow:none;
}
.btn_hero.secundario:hover { background:var(--violet); color:#fff; box-shadow:var(--shadow-violet); }

/* === GALLERY — Art-forward === */
.hero_galeria {
    display:grid; grid-template-columns:repeat(2,1fr); gap:12px;
    animation: slideUp .9s cubic-bezier(.22,.61,.36,1) .15s both;
}
.hero_card {
    position:relative; min-height:200px;
    border-radius:var(--radius-lg); overflow:hidden;
    background:#f8fafc;
    box-shadow:var(--shadow);
    cursor:pointer;
    transition: transform .5s cubic-bezier(.25,.46,.45,.94), box-shadow .5s ease;
}
.hero_card::after {
    content:''; position:absolute; inset:0;
    background: rgba(16,42,67,0.66);
    opacity:0; transition:opacity .5s;
}
.hero_card:hover { transform:scale(1.03) rotate(-0.5deg); box-shadow:var(--shadow-lg); }
.hero_card:hover::after { opacity:1; }
.hero_card_grande { grid-column:span 2; min-height:280px; }
.hero_card img {
    width:100%; height:100%; object-fit:contain; object-position:center; background:#f8fafc; padding:10px; box-sizing:border-box;
    transition: transform .7s cubic-bezier(.25,.46,.45,.94), filter .5s;
}
.hero_card:hover img { transform:scale(1.03); }
.hero_overlay {
    position:absolute; inset:auto 0 0 0; padding:22px;
    color:#fff;
    background: linear-gradient(180deg, transparent 0%, rgba(16,42,67,.82) 100%);
    z-index:2;
    transform:translateY(10px); opacity:0;
    transition: all .4s ease;
}
.hero_card:hover .hero_overlay { transform:translateY(0); opacity:1; }
.hero_overlay h3 { font-family:var(--font-display); font-size:1.15rem; margin-bottom:4px; }
.hero_overlay span { color:var(--amber-light); font-weight:700; font-size:1.1rem; }

/* === PRODUCTS GRID === */
.grid-productos {
    display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px;
}
.card-producto {
    background:#fff;
    border-radius:var(--radius-lg); overflow:hidden;
    box-shadow:var(--shadow);
    transition: all .45s cubic-bezier(.25,.46,.45,.94);
    animation: slideUp .6s cubic-bezier(.22,.61,.36,1) both;
    position:relative;
}
.card-producto:nth-child(1) { animation-delay:.05s; }
.card-producto:nth-child(2) { animation-delay:.12s; }
.card-producto:nth-child(3) { animation-delay:.19s; }
.card-producto:nth-child(4) { animation-delay:.26s; }
.card-producto:nth-child(5) { animation-delay:.33s; }
.card-producto:nth-child(6) { animation-delay:.4s; }
.card-producto:hover {
    transform:translateY(-10px) scale(1.01);
    box-shadow: 0 20px 50px rgba(124,92,252,0.12), 0 8px 20px rgba(0,0,0,0.06);
}
.card-producto .img_producto {
    display:block; height:270px; overflow:hidden;
    position:relative;
    background:#f8fafc;
}
.card-producto .img_producto::after {
    content:'VER OBRA'; position:absolute; inset:0;
    display:flex; align-items:center; justify-content:center;
    background: rgba(16,42,67,0.66);
    color:#fff; font-family:var(--font-display); font-weight:700;
    font-size:1.1rem; letter-spacing:.15em;
    opacity:0; transition:opacity .4s ease;
}
.card-producto:hover .img_producto::after { opacity:1; }
.card-producto .img_producto img {
    width:100%; height:100%; object-fit:contain; object-position:center; background:#f8fafc; padding:10px; box-sizing:border-box;
    transition: transform .6s cubic-bezier(.25,.46,.45,.94);
}
.card-producto:hover .img_producto img { transform:scale(1.02); }
.info_producto { padding:22px; }
.tag-categoria {
    display:inline-block; padding:5px 14px;
    border-radius:999px;
    font-size:.75rem; font-weight:700;
    letter-spacing:.06em; text-transform:uppercase;
    margin-bottom:12px;
}
/* Alternating category colors */
.card-producto:nth-child(3n+1) .tag-categoria { background:var(--coral-glow); color:var(--coral); }
.card-producto:nth-child(3n+2) .tag-categoria { background:var(--violet-glow); color:var(--violet); }
.card-producto:nth-child(3n+3) .tag-categoria { background:var(--teal-glow); color:var(--teal); }
.info_producto h3 { font-family:var(--font-display); font-size:1.1rem; margin-bottom:6px; }
.info_producto p { color:var(--text-muted); min-height:48px; font-size:.88rem; line-height:1.6; }
.precio-row { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:14px; }
.precio { font-size:1.35rem; font-weight:800; font-family:var(--font-display); color:var(--text); }
.btn-card {
    background: var(--violet);
    color:#fff; padding:10px 20px;
    border-radius:999px; font-weight:700; font-size:.84rem;
    box-shadow:var(--shadow-violet);
    transition:all .3s;
}
.btn-card:hover { transform:translateY(-2px); box-shadow:0 12px 30px rgba(124,92,252,.3); }

/* === CATEGORIES === */
.categorias-home .info_categorias { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.categoria {
    position:relative; min-height:280px;
    border-radius:var(--radius-lg); overflow:hidden;
    background:#f8fafc;
    box-shadow:var(--shadow);
    cursor:pointer;
    transition: all .5s cubic-bezier(.25,.46,.45,.94);
}
.categoria:hover { transform:translateY(-8px) scale(1.01); box-shadow:var(--shadow-lg); }
.categoria img {
    width:100%; height:100%; object-fit:contain; object-position:center; background:#f8fafc; padding:10px; box-sizing:border-box;
    transition:transform .7s cubic-bezier(.25,.46,.45,.94), filter .4s;
    filter:brightness(0.95) saturate(1.1);
}
.categoria:hover img { transform:scale(1.03); filter:brightness(1) saturate(1.1); }
.overlay_categoria {
    position:absolute; inset:auto 0 0 0; padding:24px;
    background:linear-gradient(180deg, transparent, rgba(26,26,46,.85));
    color:#fff;
    transition:padding .3s;
}
.categoria:hover .overlay_categoria { padding-bottom:30px; }
.overlay_categoria span { font-family:var(--font-display); font-weight:800; font-size:1.2rem; }

@media(max-width:920px){
    .hero_contenedor,.grid-productos,.categorias-home .info_categorias { grid-template-columns:1fr 1fr; }
    .hero_contenedor { grid-template-columns:1fr; }
}
@media(max-width:640px){
    .hero_texto{ padding:28px; }
    .grid-productos,.categorias-home .info_categorias,.hero_galeria { grid-template-columns:1fr; }
    .hero_card_grande{ grid-column:span 1; }
}
