* { box-sizing: border-box; }
:root { color-scheme: light; }
body { margin: 0; background: var(--paper); color: var(--ink); font: 1.0625rem/1.65 var(--body-font); }
.statement-wrap { width: min(88%, 72ch); margin-inline: auto; overflow-wrap: anywhere; }
header { padding-block: 2rem; border-bottom: 1px solid var(--rule); }
main { padding-block: 3rem; }
h1, h2 { font-family: var(--heading-font); color: var(--ink); line-height: 1.25; }
h1 { font-size: clamp(2rem, 6vw, 3rem); margin: .5rem 0 1.5rem; }
h2 { font-size: 1.5rem; margin: 2.5rem 0 1rem; }
p { margin: 0 0 1.4rem; }
.statement-date { font-size: 1rem; }
a { color: var(--link); text-decoration: underline; text-underline-offset: .2em; }
a:hover { text-decoration-thickness: 2px; }
a:focus-visible { outline: 3px solid var(--link); outline-offset: 4px; }
header a, footer a, .statement-contact { display: inline-flex; align-items: center; min-height: 44px; padding-block: .4rem; }
footer { border-top: 1px solid var(--rule); padding-block: 1.5rem 2.5rem; }
footer nav { display: flex; flex-wrap: wrap; gap: .75rem 2rem; }
.statement-skip { position: absolute; top: 1rem; left: 1rem; z-index: 10; transform: translateY(-250%); padding: .7rem 1rem; background: var(--paper); color: var(--ink); }
.statement-skip:focus { transform: none; }
body[data-site="claudiakure.com"] { --paper: #faf7f4; --ink: #392e31; --link: #754a55; --rule: #c5b4b7; --body-font: "Segoe UI", sans-serif; --heading-font: Georgia, serif; }
body[data-site="claudiakure.com"] h1, body[data-site="claudiakure.com"] h2 { letter-spacing: .05em; }
body[data-site="grupoimd.com.co"] { --paper: #f8faf9; --ink: #203b42; --link: #185c62; --rule: #b5c9c9; --body-font: "Open Sans", Arial, sans-serif; --heading-font: "Open Sans", Arial, sans-serif; }
body[data-site="ecobaby.com.co"] { --paper: #f7fbfd; --ink: #263b44; --link: #255c77; --rule: #b2ccd8; --body-font: Sarabun, Arial, sans-serif; --heading-font: Lora, Georgia, serif; }
body[data-site="rxhorizonte.com"] { --paper: #fafbf9; --ink: #263b44; --link: #345924; --rule: #b9c9b2; --body-font: "Segoe UI", Arial, sans-serif; --heading-font: "Segoe UI", Arial, sans-serif; }
@media (forced-colors: active) { a:focus-visible { outline-color: Highlight; } }
