/* Páginas interiores (aviso, contenido, contacto) con el lenguaje de la landing. */

.af-notice,.af-page{flex:1;padding:4.5rem 0}
.af-notice h1,.af-page h1{
  font-family:var(--display);font-weight:400;text-transform:uppercase;
  font-size:clamp(2.4rem,6vw,3.6rem);line-height:.95;margin:.4rem 0 1.2rem;
  text-shadow:0 0 24px rgba(139,92,246,.35);
}
.af-notice-cta{margin-top:2rem}

/* Texto largo que viene de Shopify > Páginas */
.af-prose{max-width:68ch;color:var(--muted);font-size:.98rem;line-height:1.7}
.af-prose > * + *{margin-top:1rem}
.af-prose h2,.af-prose h3{
  font-family:var(--display);font-weight:400;text-transform:uppercase;
  color:var(--text);line-height:1;margin-top:2.4rem;
}
.af-prose h2{font-size:1.9rem}
.af-prose h3{font-size:1.4rem}
.af-prose strong,.af-prose b{color:var(--text)}
.af-prose a{color:var(--aura-soft);text-decoration:underline}
.af-prose a:hover{color:var(--text)}
.af-prose ul,.af-prose ol{padding-left:1.2rem}
.af-prose li + li{margin-top:.4rem}
.af-prose li::marker{color:var(--aura)}
.af-prose table{width:100%;border-collapse:collapse;font-size:.9rem}
.af-prose th,.af-prose td{border:1px solid var(--line);padding:.6rem .8rem;text-align:left}
.af-prose th{color:var(--text);font-weight:700}
.af-prose img{border-radius:12px}
.af-prose blockquote{border-left:2px solid var(--aura);padding-left:1rem;color:var(--text)}

/* Formulario de contacto */
.af-form-contact{margin-top:2.4rem;max-width:34rem;display:grid;gap:1.1rem}
.af-field{display:grid;gap:.4rem}
.af-field label{
  font-size:.7rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);
}
.af-field input,.af-field textarea{
  width:100%;padding:.8rem 1rem;
  background:var(--panel);border:1px solid var(--line);border-radius:12px;
  color:var(--text);font-family:var(--body);font-size:.95rem;line-height:1.5;
}
.af-field input:focus,.af-field textarea:focus{
  outline:none;border-color:var(--aura-soft);box-shadow:0 0 18px rgba(139,92,246,.3);
}
.af-field textarea{resize:vertical}
.af-form-contact .btn{justify-self:start}
.af-form-ok{
  padding:.9rem 1.1rem;border-radius:12px;
  background:rgba(255,209,102,.12);border:1px solid rgba(255,209,102,.35);color:var(--victoria);
  font-weight:700;font-size:.9rem;
}
.af-form-error{
  padding:.9rem 1.1rem;border-radius:12px;
  background:rgba(255,77,109,.12);border:1px solid rgba(255,77,109,.4);color:var(--debt);
  font-size:.9rem;
}
.af-form-error ul{list-style:none;margin-top:.4rem}

/* Páginas de políticas: Shopify las sirve con su propio marcado y sin
   plantilla de tema, así que hay que estilar sus clases directamente. */
.af-shop > main{flex:1}
.shopify-policy__container{
  width:min(1120px,100% - 2.5rem);margin-inline:auto;padding:4.5rem 0;
}
.shopify-policy__title{text-align:left}
.shopify-policy__title h1{
  font-family:var(--display);font-weight:400;text-transform:uppercase;
  font-size:clamp(2.4rem,6vw,3.6rem);line-height:.95;margin:0 0 1.6rem;
  color:var(--text);text-shadow:0 0 24px rgba(139,92,246,.35);
}
.shopify-policy__body{max-width:68ch;color:var(--muted);font-size:.98rem;line-height:1.7}
.shopify-policy__body > * + *,
.shopify-policy__body .rte > * + *{margin-top:1rem}
.shopify-policy__body h2,.shopify-policy__body h3{
  font-family:var(--display);font-weight:400;text-transform:uppercase;
  color:var(--text);line-height:1;margin-top:2.4rem;
}
.shopify-policy__body h2{font-size:1.9rem}
.shopify-policy__body h3{font-size:1.4rem}
.shopify-policy__body strong,.shopify-policy__body b{color:var(--text)}
.shopify-policy__body a{color:var(--aura-soft);text-decoration:underline}
.shopify-policy__body a:hover{color:var(--text)}
.shopify-policy__body ul,.shopify-policy__body ol{padding-left:1.2rem}
.shopify-policy__body li + li{margin-top:.4rem}
.shopify-policy__body li::marker{color:var(--aura)}
.shopify-policy__body table{width:100%;border-collapse:collapse;font-size:.9rem}
.shopify-policy__body th,.shopify-policy__body td{
  border:1px solid var(--line);padding:.6rem .8rem;text-align:left;
}
.shopify-policy__body th{color:var(--text);font-weight:700}

/* --- Blog --- */
.af-posts{list-style:none;margin:2.4rem 0 0;padding:0;display:grid;gap:1.4rem}
@media(min-width:760px){.af-posts{grid-template-columns:1fr 1fr}}
.af-post-link{display:flex;flex-direction:column;height:100%;
  background:var(--panel);border:1px solid var(--line);border-radius:16px;overflow:hidden;
  transition:border-color .2s,transform .2s}
.af-post-link:hover{border-color:var(--aura-soft);transform:translateY(-2px)}
.af-post-img{aspect-ratio:16/9;overflow:hidden;background:#0E0E13}
.af-post-img img{width:100%;height:100%;object-fit:cover}
.af-post-t{padding:1.2rem 1.3rem 1.4rem;display:flex;flex-direction:column;gap:.5rem;flex:1}
.af-post-t time{font-size:.7rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
  color:var(--muted)}
.af-post-t h2{font-family:var(--display);font-weight:400;text-transform:uppercase;
  font-size:1.5rem;line-height:1.05;margin:0;color:var(--text)}
.af-post-t p{color:var(--muted);font-size:.9rem;margin:0;flex:1}
.af-post-more{font-size:.72rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
  color:var(--aura-soft)}

.af-meta{color:var(--muted);font-size:.82rem;font-weight:700;letter-spacing:.06em;
  text-transform:uppercase;margin:-.6rem 0 1.6rem}
.af-article-img{margin:0 0 2rem;border-radius:16px;overflow:hidden;border:1px solid var(--line)}
.af-article-img img{width:100%;height:auto;display:block}
.af-page .eyebrow a{color:var(--aura-soft)}
.af-page .eyebrow a:hover{color:var(--text)}

.af-pag{display:flex;align-items:center;justify-content:center;gap:1.2rem;margin-top:2.4rem;
  font-family:var(--display);font-size:1.2rem;color:var(--muted)}
.af-pag a{color:var(--aura-soft);padding:.3rem .7rem;border:1px solid var(--line);border-radius:8px}
.af-pag a:hover{border-color:var(--aura-soft);color:var(--text)}

/* --- Blog: miga de pan, etiquetas y enlaces internos --- */
.af-crumbs{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:.6rem;
  font-size:.7rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--muted)}
.af-crumbs a{color:var(--aura-soft)}
.af-crumbs a:hover{color:var(--text)}

.af-tags{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:2rem}
.af-tags a{font-size:.72rem;font-weight:700;letter-spacing:.08em;color:var(--muted);
  border:1px solid var(--line);border-radius:999px;padding:.3rem .7rem}
.af-tags a:hover{border-color:var(--aura-soft);color:var(--aura-soft)}

.af-more{margin-top:3.5rem;border-top:1px solid var(--line);padding-top:2rem}
.af-more > h2{font-family:var(--display);font-weight:400;text-transform:uppercase;
  font-size:1.6rem;letter-spacing:.02em;color:var(--text);margin:0}
.af-post-t h3{font-family:var(--display);font-weight:400;text-transform:uppercase;
  font-size:1.5rem;line-height:1.05;margin:0;color:var(--text)}