/* Mercavía: diseño para la demo anonimizada. */
:root { --brand:#0756a2; --brand-dark:#063b72; --brand-2:#f3bd24; --text:#14283d; --muted:#536678; --line:#dfe7ec; --shadow:none; --radius:4px; --radius-sm:4px; --max:1200px; }
body { background:#fff; font-family:Arial,Helvetica,sans-serif; }
.site-header { width:min(100% - 3rem,var(--max)); padding:0; }
.topbar { min-height:92px; padding:1rem 0; background:#fff; border:0; border-radius:0; box-shadow:none; backdrop-filter:none; }
.brand-logo { height:54px; }
.brand > span { border-left:1px solid #d4e0e8; padding-left:1rem; font-size:.74rem; text-transform:uppercase; letter-spacing:.08em; line-height:1.5; }
.brand strong { color:var(--brand-dark); font-size:.86rem; }
.nav { gap:1.1rem; }
.nav a { border-radius:0; padding:.7rem .25rem; color:var(--text); font-size:.9rem; font-weight:700; border-bottom:2px solid transparent; }
.nav a:hover,.nav a[aria-current="page"] { color:var(--brand); background:transparent; border-color:var(--brand); }
main { width:min(100% - 3rem,var(--max)); }
.hero-panel,.info-panel,.card,.section,.mini-card { border:0; box-shadow:none; border-radius:0; }
.section { padding:clamp(2.5rem,5vw,5rem) 0; margin:0; background:transparent; border-bottom:1px solid var(--line); }
.section h2 { font-size:clamp(2rem,3.3vw,3.2rem); line-height:1.1; }
.section h3 { line-height:1.2; }
.section-header { gap:2rem; margin-bottom:2rem; }
.section-header p { margin-top:1rem; }
.eyebrow { padding:0; margin-bottom:1.1rem; background:none; box-shadow:none; color:var(--brand); border-radius:0; text-transform:uppercase; letter-spacing:.14em; font-size:.72rem; font-weight:800; }
.button { border-radius:3px; padding:1rem 1.35rem; font-size:.88rem; }
.button-primary { background:var(--brand); box-shadow:none; }
.button-primary:hover { background:var(--brand-dark); }
.button-secondary { border-color:#b4c9d8; color:var(--brand-dark); }
.button-tertiary,.pill { background:#edf4f8; color:var(--brand-dark); }
.card,.mini-card { background:#f4f8fa; padding:1.7rem; }
.pill { border-radius:3px; padding:.6rem .8rem; font-weight:700; }
.footer { background:#082c50; color:#fff; padding:3rem max(1.5rem,calc((100% - 1200px)/2)); margin-top:0; }
.footer-inner { border:0; border-radius:0; background:transparent; padding:0; }
.footer .meta { color:#d3e3ed; }
.page-hero { margin-top:1rem; padding:clamp(2.5rem,5vw,5rem); background:linear-gradient(110deg,rgba(4,48,91,.95),rgba(4,70,128,.75)),url("images/centro.webp") center/cover; }
.page-hero .eyebrow { color:#ffd567; }
.breadcrumbs { margin:1rem 0; }
.demo-hero { min-height:590px; position:relative; display:flex; align-items:center; background:linear-gradient(90deg,rgba(3,38,72,.93),rgba(3,47,88,.70) 52%,rgba(3,47,88,.12)),url("images/centro.webp") center/cover; color:white; }
.demo-hero__inner { padding:clamp(2rem,6vw,5rem); max-width:760px; }
.demo-hero .eyebrow { color:#ffdb70; }
.demo-hero h1 { font-size:clamp(2.8rem,5.8vw,5.3rem); letter-spacing:-.045em; line-height:1.02; margin:0; }
.demo-hero p { color:#eef6fc; font-size:1.12rem; line-height:1.65; max-width:52ch; }
.demo-hero .button-secondary { background:transparent; color:white; border-color:#fff; }
.proof-strip { display:grid; grid-template-columns:repeat(3,1fr); background:var(--brand-dark); color:white; }
.proof-strip div { padding:1.6rem 2rem; border-right:1px solid rgba(255,255,255,.2); }
.proof-strip strong { display:block; font-size:2rem; }
.proof-strip span { color:#dcecf5; font-size:.88rem; }
.story { display:grid; grid-template-columns:1fr 1fr; align-items:center; gap:clamp(2rem,6vw,5rem); }
.story img { width:100%; min-height:340px; height:100%; object-fit:cover; }
.story p { line-height:1.7; }
.category-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line); border:1px solid var(--line); }
.category-grid article { background:#fff; padding:2rem; }
.category-grid span { color:var(--brand); font-weight:800; font-size:.75rem; letter-spacing:.12em; }
.category-grid h3 { font-size:1.2rem; margin:.8rem 0; }
.brand-band { background:#f3f8fb; padding:clamp(2rem,5vw,4rem); display:grid; grid-template-columns:1fr 1fr; gap:2rem; align-items:center; }
.brand-word { font-size:clamp(2.7rem,6vw,5.5rem); line-height:1; font-weight:900; font-style:italic; letter-spacing:-.09em; color:var(--brand); }
.center-links { display:grid; grid-template-columns:repeat(3,1fr); gap:.75rem; }
.center-links a { display:flex; justify-content:space-between; padding:1.2rem; background:#f1f6f9; color:var(--brand-dark); font-weight:700; }
.center-links a:hover { background:#e1eef5; }
.instagram-demo__notice { max-width:34ch; }
:focus-visible { outline:3px solid #f0b500; outline-offset:3px; }
@media(max-width:760px) {
 .site-header,main { width:min(100% - 2rem,var(--max)); }
 .topbar { min-height:78px; align-items:center; }
 .brand-logo { height:42px; }
 .brand > span { font-size:.64rem; }
 .demo-hero { min-height:520px; background-position:60% center; }
 .demo-hero__inner { padding:2rem; }
 .proof-strip div { padding:1rem .7rem; }
 .proof-strip strong { font-size:1.5rem; }
 .proof-strip span { font-size:.74rem; }
 .story,.brand-band { grid-template-columns:1fr; }
 .category-grid,.center-links { grid-template-columns:1fr 1fr; }
 .section-header { display:block; }
 .section-header .button { margin-top:1rem; width:auto; }
}
@media(max-width:420px) { .category-grid,.center-links { grid-template-columns:1fr; } .brand > span { display:none; } }