/* Barbería: solo páginas internas, sin modificar site.css ni otras páginas. */
.ara-barberia,.ara-barberia *{box-sizing:border-box}
.ara-barberia .ara-breadcrumb{font:11px/1.6 var(--mono);letter-spacing:.10em;color:var(--muted);margin-bottom:24px}
.ara-barberia .ara-breadcrumb a{color:var(--accent)}
.ara-barberia .ara-intro{padding:clamp(38px,5vw,72px) 0}
.ara-barberia .ara-hero-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:clamp(26px,5vw,70px);align-items:center}
.ara-barberia .ara-hero-grid h1{font-size:clamp(34px,4.1vw,62px);margin:20px 0 24px}
.ara-barberia .ara-eyebrow{font:11px/1.5 var(--mono);color:var(--accent);text-transform:uppercase;letter-spacing:.17em}
.ara-barberia .ara-hero-grid p{font-size:17px;line-height:1.75;max-width:54ch;color:var(--fg-2)}
.ara-barberia .ara-hero-image{display:block;margin:0;aspect-ratio:5/4;overflow:hidden;border:1px solid var(--border)}
.ara-barberia .ara-hero-image img{width:100%;height:100%;object-fit:cover;display:block}
.ara-barberia .ara-action-row{display:flex;gap:12px;flex-wrap:wrap;margin-top:26px}
.ara-barberia .ara-action-row .btn{min-height:46px}
.ara-barberia .specs-bar .specs-list{width:100%}
.ara-barberia .specs-bar .specs-list dd{font-size:15px}
.ara-barberia .ara-body{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(245px,.85fr);gap:clamp(28px,5vw,76px);align-items:start}
.ara-barberia .ara-body p{font-size:16px;line-height:1.75}
.ara-barberia .ara-body h2,.ara-barberia .ara-section h2{font-size:clamp(28px,3.4vw,44px);margin:16px 0 24px}
.ara-barberia .ara-points{list-style:none;margin:26px 0 0;padding:0;display:grid;gap:18px}
.ara-barberia .ara-points li{display:flex;gap:14px;line-height:1.65;font-size:16px;color:var(--fg-2)}
.ara-barberia .ara-points li::before{content:'/' ;color:var(--accent);font-family:var(--serif);font-size:23px;line-height:1}
.ara-barberia .ara-aside{border:1px solid var(--border-strong);padding:28px;background:var(--surface)}
.ara-barberia .ara-aside h3{font-size:25px;margin:12px 0}
.ara-barberia .ara-aside p{font-size:14px;line-height:1.6;color:var(--fg-2)}
.ara-barberia .ara-aside .btn{display:flex;margin-top:18px;text-align:center}
.ara-barberia .ara-section{padding:clamp(42px,5vw,70px) 0}
.ara-barberia .ara-section.alt{background:var(--bg-2)}
.ara-barberia .ara-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:var(--border);border:1px solid var(--border);margin-top:30px}
.ara-barberia .ara-step{padding:26px;background:var(--bg)}
.ara-barberia .ara-step small{font-family:var(--mono);color:var(--accent)}
.ara-barberia .ara-step h3{font-size:22px;margin:16px 0 12px}
.ara-barberia .ara-step p{font-size:14px;line-height:1.75;color:var(--fg-2)}
.ara-barberia .ara-related{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:32px}
.ara-barberia .ara-related a{display:block;padding:22px;border:1px solid var(--border-strong);background:var(--bg);color:var(--fg-2);min-width:0}
.ara-barberia .ara-related a:hover{border-color:var(--accent)}
.ara-barberia .ara-related strong{font-size:16px;display:block;color:var(--fg);margin-bottom:6px}
.ara-barberia .ara-related span{font-size:13px;line-height:1.6;display:block}
.ara-barberia .faq{margin-top:32px}
.ara-barberia .ara-cta{background:var(--surface);border-top:1px solid var(--border);text-align:center;padding:56px 0}
.ara-barberia .ara-cta .lede{margin:14px auto 28px;max-width:50ch}
.ara-barberia .ara-muted{font-size:13px;color:var(--muted);margin-top:14px}
@media(max-width:820px){.ara-barberia .ara-hero-grid,.ara-barberia .ara-body{grid-template-columns:1fr}.ara-barberia .ara-hero-image{max-width:650px;aspect-ratio:5/3}.ara-barberia .ara-steps{grid-template-columns:1fr}.ara-barberia .ara-aside{max-width:none}}
@media(max-width:540px){.ara-barberia .ara-related{grid-template-columns:1fr}.ara-barberia .ara-hero-grid h1{font-size:clamp(30px,9vw,44px)}.ara-barberia .ara-action-row{flex-direction:column}.ara-barberia .ara-action-row a{width:100%}.ara-barberia .ara-hero-image{aspect-ratio:4/3}}
/* El blog conserva el esquema de artículos original; sus fotos tienen marco editorial sin cortes. */
.ara-barberia-article .article-figure{margin:30px 0 38px;max-width:100%;padding:0}
.ara-barberia-article .article-figure img{width:100%;height:auto;max-height:560px;object-fit:contain;display:block;margin:auto;background:#13100e}
.ara-barberia-article .article-figure figcaption{font:12px/1.6 var(--sans);color:var(--muted);margin-top:11px}
.ara-barberia-article .article-summary{border-left:2px solid var(--accent);background:var(--surface);padding:22px 24px;margin:28px 0 32px}
.ara-barberia-article .article-summary p{margin:8px 0 0}
.ara-barberia-article .article-related{padding:28px;border:1px solid var(--border-strong);margin:34px 0}
.ara-barberia-article .article-related h3{margin:0 0 12px}
.ara-barberia-article .article-related p{margin:0 0 15px}
.ara-barberia-article .article-toc{margin:26px 0 40px;padding:24px;background:var(--surface);border:1px solid var(--border-strong)}
.ara-barberia-article .article-toc p{margin:0 0 12px}
.ara-barberia-article .article-toc ol{margin:0;padding-left:22px}
.ara-barberia-article .article-toc li{margin:7px 0;color:var(--fg-2)}
.ara-barberia-article .article-toc a:hover{color:var(--accent)}
/* Evita el desbordamiento horizontal causado por el banner global en móviles,
   solo en las páginas de barbería actualizadas. */
@media (max-width:600px){
  body.ara-barberia-page .site-test-banner__inner{max-width:100%;min-width:0;box-sizing:border-box;gap:7px}
  body.ara-barberia-page .site-test-banner__text{white-space:normal;min-width:0;flex:1 1 auto;overflow-wrap:break-word}
  body.ara-barberia-page .site-test-banner__cta{flex:0 0 auto}
  body.ara-barberia-page .site-test-banner__close{flex:0 0 24px}
}
