/*
  Maderín · Edición 18
  Drop-in landing page styles for Shopify Dawn.
  All selectors are namespaced with .m18 to avoid collisions.
*/

:root {
  --m18-ink: #292722;
  --m18-muted: #655f56;
  --m18-paper: #fbf8f1;
  --m18-sand: #eee4d4;
  --m18-card: #fffdf8;
  --m18-red: #aa3b2d;
  --m18-red-dark: #883023;
  --m18-blue: #203a5c;
  --m18-line: rgba(72, 56, 41, 0.16);
  --m18-shadow: 0 12px 34px rgba(54, 42, 31, 0.08);
  --m18-radius: 12px;
  --m18-max: 1320px;
}

.m18-section {
  color: var(--m18-ink);
  background: var(--m18-paper);
}

.m18-section *,
.m18-section *::before,
.m18-section *::after { box-sizing: border-box; }

.m18-page-width {
  width: min(100% - 40px, var(--m18-max));
  margin-inline: auto;
}

.m18-kicker {
  margin: 0 0 12px;
  color: var(--m18-red);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.18em;
  line-height: 1.3;
  text-transform: uppercase;
}

.m18-title,
.m18-card__title,
.m18-quote__text {
  margin: 0;
  font-family: var(--font-heading-family, Georgia, serif);
  font-style: var(--font-heading-style, normal);
  font-weight: var(--font-heading-weight, 400);
  letter-spacing: -0.025em;
}

.m18-title { font-size: clamp(32px, 5vw, 68px); line-height: 0.98; }
.m18-title--section { font-size: clamp(30px, 3.5vw, 48px); line-height: 1.02; }

.m18-copy {
  margin: 18px 0 0;
  max-width: 460px;
  color: var(--m18-muted);
  font-size: clamp(15px, 1.2vw, 18px);
  line-height: 1.55;
}

.m18-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 24px;
}

.m18-button {
  min-height: 48px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 12px 20px;
  border: 1px solid var(--m18-red);
  border-radius: 4px;
  background: var(--m18-red);
  color: #fff;
  font-size: 14.5px;
  font-weight: 650;
  line-height: 1.1;
  text-decoration: none;
  transition: transform .2s ease, background .2s ease, border-color .2s ease;
}

.m18-button:hover { background: var(--m18-red-dark); border-color: var(--m18-red-dark); transform: translateY(-1px); }
.m18-button:focus-visible { outline: 3px solid rgba(32, 58, 92, .35); outline-offset: 3px; }
.m18-button--outline { background: transparent; color: var(--m18-red); }
.m18-button--outline:hover { background: rgba(170, 59, 45, .07); color: var(--m18-red-dark); }
.m18-button--blue { background: var(--m18-blue); border-color: var(--m18-blue); }
.m18-button--blue:hover { background: #172c47; border-color: #172c47; }
.m18-text-link {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  margin-top: 20px;
  color: var(--m18-red);
  font-size: 14.5px;
  font-weight: 650;
  text-decoration: none;
}
.m18-text-link:hover { text-decoration: underline; text-underline-offset: 3.5px; }

/* Hero */
.m18-hero {
  position: relative;
  min-height: clamp(520px, 63vw, 720px);
  display: grid;
  overflow: hidden;
  background: var(--m18-sand);
  isolation: isolate;
}
.m18-hero__media,
.m18-hero__media::after { position: absolute; inset: 0; }
.m18-hero__image { width: 100%; height: 100%; object-fit: cover; object-position: var(--m18-focus, 62% center); }
.m18-hero__media::after {
  content: '';
  background: linear-gradient(90deg, rgba(251,248,241,.98) 0%, rgba(251,248,241,.94) 28%, rgba(251,248,241,.52) 44%, rgba(251,248,241,0) 67%);
}
.m18-hero__content {
  position: relative;
  z-index: 2;
  width: min(100% - 40px, var(--m18-max));
  margin: auto;
  padding-block: clamp(50px, 9vw, 100px);
}
.m18-hero__panel { width: min(440px, 43%); }
.m18-hero__trust {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 16px;
  margin: 22px 0 0;
  padding: 0;
  list-style: none;
  color: var(--m18-muted);
  font-size: 12.5px;
}
.m18-hero__trust li { display: inline-flex; align-items: center; gap: 6px; }
.m18-hero__trust svg { width: 15px; height: 15px; color: var(--m18-red); }

/* Categories */
.m18-categories { padding: clamp(40px, 5vw, 70px) 0; background: #fffdf9; }
.m18-section-heading { text-align: center; margin-bottom: 28px; }
.m18-section-heading .m18-title--section { font-size: clamp(30px, 3.2vw, 44px); }
.m18-category-grid { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 20px; }
.m18-category {
  display: block;
  padding: 8px;
  border: 1px solid var(--m18-line);
  border-radius: var(--m18-radius);
  background: var(--m18-card);
  box-shadow: 0 4px 18px rgba(55,42,32,.04);
  color: inherit;
  text-decoration: none;
  transition: transform .2s ease, box-shadow .2s ease;
}
.m18-category:hover { transform: translateY(-.40px); box-shadow: var(--m18-shadow); }
.m18-category__media { aspect-ratio: 1.65/1; overflow: hidden; border-radius: 9px; background: var(--m18-sand); }
.m18-category__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .35s ease; }
.m18-category:hover .m18-category__media img { transform: scale(1.025); }
.m18-category__placeholder { width:100%; height:100%; display:grid; place-items:center; color:rgba(45,39,34,.3); }
.m18-category__label { display: flex; align-items: center; justify-content: center; gap: 9px; min-height: 52px; padding: 8px; font-size: 16.5px; }
.m18-category__label svg { width: 20px; height: 20px; color: #8c6b4e; flex:none; }

/* Collection */
.m18-collection { padding: clamp(40px, 5vw, 70px) 0; background: linear-gradient(90deg,#efe4d4,#f5ecdf); }
.m18-collection__layout { display: grid; grid-template-columns: minmax(230px,.9fr) minmax(0,3.1fr); gap: clamp(28px,4vw,50px); align-items: start; }
.m18-collection__intro { position: sticky; top: 100px; }
.m18-collection__intro .m18-title--section { font-size: clamp(31px,3.4vw,48px); }
.m18-divider { display:flex; align-items:center; gap:10px; margin-top:16px; color:var(--m18-red); }
.m18-divider::before,.m18-divider::after { content:''; width:48px; height:1px; background:currentColor; opacity:.65; }
.m18-divider svg { width:15px; height:15px; }
.m18-products { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 14px; }
.m18-product-card { min-width:0; overflow:hidden; border:1px solid rgba(255,255,255,.8); border-radius:10px; background:rgba(255,255,255,.8); }
.m18-product-card__media { position:relative; display:block; aspect-ratio:1/1.06; overflow:hidden; background:#eadfce; }
.m18-product-card__media img { width:100%; height:100%; object-fit:cover; transition:transform .35s ease, opacity .35s ease; }
.m18-product-card__img--secondary { position:absolute; inset:0; opacity:0; }
.m18-product-card:hover .m18-product-card__img--primary { transform:scale(1.025); }
.m18-product-card:hover .m18-product-card__img--secondary { opacity:1; }
.m18-product-card__badge { position:absolute; left:10px; top:10px; padding:4.5px 7.5px; border-radius:999px; background:var(--m18-red); color:#fff; font-size:10.5px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; }
.m18-product-card__body { padding:13px 13px 15px; }
.m18-product-card__title { font-size:16.5px; line-height:1.25; }
.m18-product-card__title a { color:inherit; text-decoration:none; }
.m18-product-card__title a:hover { color:var(--m18-red); }
.m18-price { display:flex; flex-wrap:wrap; gap:7px; margin-top:8px; font-size:13.5px; }
.m18-price__compare { color:#887f75; text-decoration:line-through; }
.m18-product-card__cta { display:inline-flex; margin-top:10px; color:var(--m18-red); font-size:12.5px; font-weight:650; text-decoration:none; }
.m18-product-card__cta:hover { text-decoration:underline; text-underline-offset:3px; }
.m18-empty { grid-column:1/-1; padding:30px; border:1px dashed var(--m18-line); border-radius:10px; text-align:center; color:var(--m18-muted); background:rgba(255,255,255,.45); }

/* Split feature */
.m18-feature { background:var(--m18-paper); }
.m18-feature__grid { display:grid; grid-template-columns:minmax(280px, .72fr) minmax(0,1.75fr); min-height:490px; }
.m18-feature__content { display:flex; flex-direction:column; justify-content:center; padding:clamp(40px,6vw,80px) clamp(30px,5vw,70px); }
.m18-feature__media { position:relative; min-height:420px; background:#ddd0bd; overflow:hidden; }
.m18-feature__media img { width:100%; height:100%; object-fit:cover; }
.m18-stamp { position:absolute; right:30px; bottom:30px; width:100px; aspect-ratio:1; display:grid; place-items:center; border:2px solid rgba(39,38,34,.62); border-radius:50%; background:rgba(251,248,241,.78); color:rgba(39,38,34,.75); font-size:12px; font-weight:750; letter-spacing:.13em; line-height:1.15; text-align:center; text-transform:uppercase; transform:rotate(-7deg); backdrop-filter:blur(4px); }

/* Scenography */
.m18-scenography { padding:clamp(40px,5vw,70px) 0; background:#fffdf9; }
.m18-scenography__layout { display:grid; grid-template-columns:minmax(260px,.85fr) minmax(0,2.5fr); gap:clamp(25px,4vw,50px); align-items:center; }
.m18-scenography__cards { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }
.m18-scenography-card { overflow:hidden; border:1px solid var(--m18-line); border-radius:10px; background:#fff; color:inherit; text-decoration:none; }
.m18-scenography-card__media { aspect-ratio:1.45/1; overflow:hidden; background:var(--m18-sand); }
.m18-scenography-card__media img { width:100%; height:100%; object-fit:cover; transition:transform .35s ease; }
.m18-scenography-card:hover img { transform:scale(1.025); }
.m18-scenography-card__body { padding:13px; text-align:center; }
.m18-scenography-card__title { margin:0; font-family:var(--font-heading-family,Georgia,serif); font-size:17.5px; }
.m18-scenography-card__text { margin:5px 0 0; color:var(--m18-muted); font-size:12.5px; line-height:1.4; }

/* Quote */
.m18-quote { position:relative; min-height:170px; display:grid; place-items:center; overflow:hidden; background:#eee4d4; }
.m18-quote__side { position:absolute; inset-block:0; width:34%; }
.m18-quote__side--left { left:0; }
.m18-quote__side--right { right:0; }
.m18-quote__side img { width:100%; height:100%; object-fit:cover; opacity:.62; }
.m18-quote__side--left img { object-position:left center; }
.m18-quote__side--right img { object-position:right center; }
.m18-quote::after { content:''; position:absolute; inset:0; background:linear-gradient(90deg,rgba(238,228,212,.1),rgba(238,228,212,.96) 32%,rgba(238,228,212,.96) 68%,rgba(238,228,212,.1)); }
.m18-quote__inner { position:relative; z-index:1; width:min(640px,80%); padding:30px 20px; text-align:center; }
.m18-quote__text { font-size:clamp(26px,3vw,42px); line-height:1.08; }

/* Utilities */
.m18-placeholder { width:100%; height:100%; display:grid; place-items:center; background:linear-gradient(135deg,#e8ddcc,#f7f0e5); color:rgba(45,39,34,.42); }
.m18-placeholder svg { width:60px; height:60px; }

@media screen and (max-width: 990px) {
  .m18-category-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .m18-collection__layout { grid-template-columns:1fr; }
  .m18-collection__intro { position:static; text-align:center; }
  .m18-collection__intro .m18-copy { margin-inline:auto; }
  .m18-collection__intro .m18-divider { justify-content:center; }
  .m18-products { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .m18-feature__grid { grid-template-columns:1fr 1.35fr; }
  .m18-scenography__layout { grid-template-columns:1fr; }
  .m18-scenography__intro { text-align:center; }
  .m18-scenography__intro .m18-copy { margin-inline:auto; }
  .m18-scenography__intro .m18-actions { justify-content:center; }
}

@media screen and (max-width: 749px) {
  .m18-page-width { width:min(100% - 30px,var(--m18-max)); }
  .m18-hero { min-height:720px; align-items:end; }
  .m18-hero__media::after { background:linear-gradient(0deg,rgba(251,248,241,.99) 0%,rgba(251,248,241,.94) 38%,rgba(251,248,241,.2) 68%,rgba(251,248,241,0) 100%); }
  .m18-hero__image { object-position:var(--m18-focus-mobile,65% top); }
  .m18-hero__content { align-self:end; width:min(100% - 30px,var(--m18-max)); padding-block:300px 45px; }
  .m18-hero__panel { width:100%; }
  .m18-title { font-size:clamp(40px,13vw,56px); }
  .m18-actions { display:grid; grid-template-columns:1fr; }
  .m18-button { width:100%; }
  .m18-category-grid { gap:12px; }
  .m18-category__label { font-size:13.5px; }
  .m18-category__label svg { width:17px; height:17px; }
  .m18-products { display:flex; overflow-x:auto; scroll-snap-type:x mandatory; padding-bottom:10px; margin-right:-1.50px; scrollbar-width:thin; }
  .m18-product-card { flex:0 0 min(76vw,290px); scroll-snap-align:start; }
  .m18-feature__grid { grid-template-columns:1fr; }
  .m18-feature__content { order:2; }
  .m18-feature__media { min-height:380px; }
  .m18-stamp { width:80px; right:15px; bottom:15px; font-size:9.5px; }
  .m18-scenography__cards { display:flex; overflow-x:auto; scroll-snap-type:x mandatory; padding-bottom:10px; margin-right:-1.50px; }
  .m18-scenography-card { flex:0 0 min(80vw,320px); scroll-snap-align:start; }
  .m18-quote__side { width:52%; }
  .m18-quote::after { background:rgba(238,228,212,.82); }
  .m18-quote__inner { width:92%; }
}

@media (prefers-reduced-motion: reduce) {
  .m18-section *, .m18-section *::before, .m18-section *::after { scroll-behavior:auto !important; transition:none !important; }
}