/* TERRACOTA — capa visual y de movimiento ligera */
:root{
  --terracota-bg:#080908;
  --terracota-surface:#0e100e;
  --terracota-surface-2:#121412;
  --terracota-gold:#d8b957;
  --terracota-gold-soft:#a88c3b;
  --terracota-text:#f2f0e9;
  --terracota-muted:#aaa9a2;
  --terracota-border:rgba(255,255,255,.085);
  --ease-premium:cubic-bezier(.22,1,.36,1);
}

body{
  background:
    radial-gradient(circle at 78% 12%, rgba(216,185,87,.045), transparent 31%),
    var(--terracota-bg);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

/* Loader pequeño: sólo CSS, sin librerías ni imágenes extra */
.page-loader{
  position:fixed;
  inset:0;
  z-index:9999;
  display:grid;
  place-items:center;
  background:#080908;
  opacity:1;
  visibility:visible;
  transition:opacity .24s ease,visibility .24s ease;
}
.page-loader__inner{display:grid;justify-items:center;gap:13px}
.page-loader__name{
  font-size:13px;
  line-height:1;
  letter-spacing:.34em;
  padding-left:.34em;
  color:#eeeae0;
  font-weight:600;
}
.page-loader__line{
  width:108px;
  height:1px;
  background:rgba(255,255,255,.12);
  overflow:hidden;
  position:relative;
}
.page-loader__line:after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,transparent,var(--terracota-gold),transparent);
  transform:translateX(-100%);
  animation:terracota-load .58s var(--ease-premium) infinite;
}
body.page-ready .page-loader{opacity:0;visibility:hidden;pointer-events:none}
body.page-leaving .page-loader{opacity:1;visibility:visible;pointer-events:auto}
body.page-leaving .page-loader__line:after{animation-duration:.35s}
@keyframes terracota-load{to{transform:translateX(100%)}}

/* Entrada de contenido */
body:not(.home-page) > section,
body:not(.home-page) > footer,
body.home-page > .hero{
  opacity:0;
  transform:translateY(8px);
  transition:opacity .42s var(--ease-premium),transform .42s var(--ease-premium);
}
body.page-ready:not(.home-page) > section,
body.page-ready:not(.home-page) > footer,
body.page-ready.home-page > .hero{
  opacity:1;
  transform:none;
}

header{
  border-bottom-color:rgba(255,255,255,.075)!important;
  background:rgba(8,9,8,.86)!important;
  backdrop-filter:blur(16px) saturate(115%);
  -webkit-backdrop-filter:blur(16px) saturate(115%);
  box-shadow:0 1px 0 rgba(255,255,255,.02);
}
.brand-logo img{filter:contrast(1.04) brightness(.98)}
nav a{transition:color .22s ease,opacity .22s ease}
nav:hover a:not(:hover){opacity:.58}
nav a.active{opacity:1!important}
.shop,.cta,.goldbtn,.ghostbtn,.quick button,.filter,.iconbtn{
  transition:transform .22s var(--ease-premium),border-color .22s ease,background .22s ease,color .22s ease,box-shadow .22s ease;
}
.shop:hover,.cta:hover,.goldbtn:hover{transform:translateY(-1px);box-shadow:0 8px 28px rgba(188,153,58,.12)}
.iconbtn:hover{transform:translateY(-1px);border-color:rgba(216,185,87,.58);color:var(--terracota-gold)}

/* Inicio */
.hero:before{transform:scale(1.01);transition:transform 5s ease}
body.page-ready .hero:before{transform:scale(1)}
.hero-inner{max-width:710px}
.hero h1{font-family:Georgia,'Times New Roman',serif;font-weight:400;letter-spacing:-.045em;text-wrap:balance}
.hero p{max-width:570px;color:#c5c2ba}
.eyebrow{font-weight:600}

/* Cabeceras internas */
.page-hero{
  position:relative;
  overflow:hidden;
  background:
    linear-gradient(100deg,rgba(255,255,255,.018),transparent 50%),
    #090a09!important;
}
.page-hero:after{
  content:"";
  position:absolute;
  right:8.7%;
  bottom:0;
  width:140px;
  height:1px;
  background:linear-gradient(90deg,transparent,var(--terracota-gold));
  opacity:.75;
}
.page-hero h1,.page-wrap h2,.section h2{
  font-family:Georgia,'Times New Roman',serif;
  font-weight:400!important;
  letter-spacing:-.025em;
}
.page-hero p{font-size:15px;max-width:660px!important}

/* Catálogo */
.section.dark{background:transparent!important}
.filters{align-items:center}
.filter{border-radius:999px;background:rgba(255,255,255,.025)!important;padding:10px 15px!important}
.filter.active{background:rgba(216,185,87,.11)!important;box-shadow:inset 0 0 0 1px rgba(216,185,87,.18)}
.grid{gap:16px!important}
.product{
  background:linear-gradient(180deg,#111310,#0d0f0d)!important;
  border-color:var(--terracota-border)!important;
  border-radius:2px;
  box-shadow:0 10px 36px rgba(0,0,0,.1);
}
.product:hover{
  transform:translateY(-5px)!important;
  border-color:rgba(216,185,87,.5)!important;
  box-shadow:0 20px 46px rgba(0,0,0,.24);
}
.photo{background:#e8e3d9!important;position:relative}
.photo:after{content:"";position:absolute;inset:0;box-shadow:inset 0 0 0 1px rgba(0,0,0,.04);pointer-events:none}
.photo img{object-fit:contain!important}
.info{padding:17px 17px 12px!important}
.name{font-size:15px!important;color:#f1efe9;min-height:42px}
.desc{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;min-height:56px;color:#9f9f98!important}
.quick{padding:0 17px 17px!important}
.quick button{background:transparent!important;border-color:rgba(255,255,255,.12)!important}
.quick button:hover{background:rgba(216,185,87,.08)!important;border-color:rgba(216,185,87,.52)!important}

/* Modal */
.modal{backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);background:rgba(0,0,0,.76)!important}
.modal.open .box{animation:modal-in .32s var(--ease-premium)}
.box{border-color:rgba(216,185,87,.5)!important;border-radius:3px;overflow:hidden}
@keyframes modal-in{from{opacity:0;transform:translateY(10px) scale(.985)}to{opacity:1;transform:none}}

/* Nosotros / Blog / Contacto */
.aboutimg{min-height:440px!important;box-shadow:0 24px 60px rgba(0,0,0,.24)}
.aboutcopy p,.contactcopy p,.article-card p{color:#aaa9a2!important}
.article-card{
  min-height:220px;
  background:linear-gradient(145deg,#111310,#0d0f0d)!important;
  border-color:var(--terracota-border)!important;
  transition:transform .28s var(--ease-premium),border-color .25s ease;
}
.article-card:hover{transform:translateY(-5px);border-color:rgba(216,185,87,.42)!important}
.contactform input,.contactform textarea{
  background:#0e100e!important;
  border-color:rgba(255,255,255,.12)!important;
  transition:border-color .2s ease,box-shadow .2s ease;
}
.contactform input:focus,.contactform textarea:focus{border-color:rgba(216,185,87,.7)!important;box-shadow:0 0 0 3px rgba(216,185,87,.06)}
footer{border-top-color:rgba(255,255,255,.08)!important}

/* Imágenes faltantes: categoría como fallback, sin icono roto */
.product img.image-fallback{object-fit:cover!important;filter:saturate(.74) brightness(.83)}

@media (prefers-reduced-motion:reduce){
  *,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
}

@media(max-width:760px){
  .page-loader__name{font-size:11px}
  .page-loader__line{width:88px}
  .hero h1{font-size:46px!important}
  .hero p{font-size:14px!important;line-height:1.65!important}
  .page-hero h1{font-size:39px!important}
  .page-hero:after{right:18px;width:90px}
  .section,.page-wrap{padding-left:18px!important;padding-right:18px!important}
  .filters{flex-wrap:nowrap!important;overflow-x:auto;padding-bottom:5px;scrollbar-width:none}
  .filters::-webkit-scrollbar{display:none}
  .filter{flex:0 0 auto}
  .grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important}
  .photo{height:205px!important}
  .info{padding:13px 12px 8px!important}
  .name{font-size:13px!important;min-height:38px}
  .desc{display:none}
  .quick{padding:0 12px 12px!important}
  .quick button{padding:9px 5px!important;font-size:9px!important}
  .aboutimg{min-height:330px!important}
  .article-card{min-height:0}
}

@media(max-width:390px){
  .grid{grid-template-columns:1fr!important}
  .photo{height:290px!important}
  .name{min-height:0}
}