:root { color-scheme: light; font-family: system-ui, sans-serif; color: #16324c; background: #fff; }
* { box-sizing: border-box; }
body { margin: 0; min-height: 100vh; display: flex; flex-direction: column; }
a { color: #0056a4; text-underline-offset: .2em; }
a:focus-visible { outline: 3px solid #329e47; outline-offset: 5px; }
.site-header { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: 1.25rem max(1.25rem, calc((100% - 1100px) / 2)); border-bottom: 1px solid #e3eaf0; }
.site-header > a { font-size: 1.25rem; font-weight: 700; text-decoration: none; }
main { flex: 1; width: min(100% - 2.5rem, 1100px); margin: 0 auto; }
.welcome { text-align: center; padding: 3rem 0; }
.brand-logo { display: block; width: min(100%, 380px); height: auto; margin: 0 auto 2rem; }
h1 { font-size: clamp(1.7rem, 4vw, 2.5rem); color: #0056a4; }
p { line-height: 1.6; }
footer { text-align: center; padding: 1.5rem; border-top: 1px solid #e3eaf0; color: #526473; }

/* Página temporal: recursos locales y diseño adaptable sin dependencias. */
.reconstruction-page { background: #f6f8f4; color: #20372f; }
.reconstruction-page main { width: min(100% - 3rem, 1160px); }
.skip-link { position: absolute; top: -100px; left: 1rem; z-index: 10; padding: .8rem 1rem; background: #fff; }
.skip-link:focus { top: 1rem; }
.reconstruction-header { width: min(100% - 3rem, 1160px); margin: 0 auto; padding: 2rem 0; display: flex; justify-content: space-between; align-items: center; gap: 1rem; border-bottom: 1px solid #dce4da; }
.wordmark { color: #0056a4; font-size: 1.6rem; font-weight: 800; letter-spacing: -.07em; text-decoration: none; }
.wordmark > span:first-child { font-weight: 500; }
.brand-dot { color: #27803a; }
.header-note { font-size: .82rem; color: #526458; }
.reconstruction-hero { display: grid; grid-template-columns: 1.2fr 1fr; align-items: center; gap: clamp(2rem, 6vw, 6rem); padding: clamp(3rem, 7vw, 6rem) 0; }
.eyebrow { display: flex; align-items: center; gap: .6rem; margin: 0 0 1.5rem; font-size: .7rem; font-weight: 700; letter-spacing: .13em; color: #526458; }
.status-dot { width: .5rem; height: .5rem; border-radius: 50%; background: #27803a; flex-shrink: 0; }
.hero-copy h1 { font-size: clamp(2.8rem, 5.8vw, 5.2rem); line-height: 1.05; letter-spacing: -.065em; margin: 0 0 1.75rem; color: #173e32; font-weight: 750; }
.hero-copy h1 span { color: #0056a4; }
.hero-description { max-width: 450px; font-size: 1.05rem; line-height: 1.8; color: #526458; margin: 0; }
.return-note { display: flex; align-items: center; gap: 1rem; margin-top: 2.2rem; }
.return-symbol { display: grid; place-items: center; width: 46px; height: 46px; border: 1px solid #bccfbd; border-radius: 50%; color: #247236; font-size: 1.7rem; flex-shrink: 0; }
.return-title { font-weight: 700; margin: 0; }
.return-description { margin: .2rem 0 0; font-size: .82rem; color: #526458; }
.brand-panel { position: relative; padding: 1.2rem; }
.brand-panel::before { content: ""; position: absolute; inset: 0; border-radius: 44% 44% 18% 18%; background: #e3ebdf; transform: rotate(5deg); }
.brand-card { position: relative; background: #fff; padding: clamp(1.5rem, 3vw, 2.5rem); border: 1px solid #e5e9e3; border-radius: 1.25rem; box-shadow: 0 18px 48px #20372f0d; }
.reconstruction-logo { display: block; width: 100%; height: auto; }
.brand-card-caption { display: flex; align-items: center; justify-content: center; gap: .5rem; margin-top: 2rem; padding-top: 1.25rem; border-top: 1px solid #edf0ea; font-size: .72rem; color: #526458; text-align: center; }
.brand-card-caption > span { width: 6px; height: 6px; border-radius: 50%; background: #27803a; flex-shrink: 0; }
.panel-note { position: relative; margin: 1.25rem 0 0; text-align: center; font-size: .75rem; color: #526458; }
.improvements { display: flex; justify-content: space-between; align-items: center; gap: 2rem; padding: 2rem 0 2.5rem; border-top: 1px solid #dce4da; }
.improvements .eyebrow { margin-bottom: .5rem; }
.improvements h2 { margin: 0; font-size: clamp(1.5rem, 3vw, 2rem); letter-spacing: -.04em; font-weight: 600; }
.improvements > p { margin: 0; font-size: .85rem; line-height: 1.9; color: #526458; }
.reconstruction-footer { width: min(100% - 3rem, 1160px); margin: auto auto 0; display: flex; justify-content: space-between; padding: 1.25rem 0; border-color: #dce4da; font-size: .7rem; color: #526458; }
.reconstruction-footer > span:last-child { letter-spacing: .16em; }
@media (max-width: 760px) {
  .reconstruction-hero { grid-template-columns: 1fr; gap: 2.5rem; padding-top: 3rem; }
  .brand-panel { width: min(100%, 430px); margin: 0 auto; }
  .hero-description { max-width: 100%; }
  .improvements { align-items: flex-start; flex-direction: column; gap: 1rem; }
  .reconstruction-header { padding: 1.25rem 0; }
  .header-note { font-size: .7rem; }
}
@media (max-width: 380px) {
  .reconstruction-page main, .reconstruction-header, .reconstruction-footer { width: calc(100% - 2rem); }
  .header-note { max-width: 85px; text-align: right; }
  .hero-copy h1 { font-size: 2.55rem; }
}