* { box-sizing: border-box; }
html { color-scheme: light; -webkit-text-size-adjust: 100%; }
body { margin: 0; min-height: 100vh; padding: 42px 20px; background-color: var(--page, #f2f2f2); color: var(--ink, #242424); font: 1rem/1.5 var(--body-font, 'Segoe UI', Arial, sans-serif); }
a { color: inherit; text-decoration: none; }
svg { width: 22px; height: 22px; flex-shrink: 0; }
a { -webkit-tap-highlight-color: transparent; }
:focus-visible { outline: 3px solid #1259ad; outline-offset: 4px; }
.skip-link { position: absolute; left: 8px; top: 8px; padding: 12px; background: white; color: #222; z-index: 10; transform: translateY(-200%); }
.skip-link:focus { transform: none; }
.card { max-width: 540px; margin: auto; overflow: hidden; background: var(--paper); border-radius: var(--radius); box-shadow: var(--shadow); }
.identity { padding: 29px 36px 34px; background: var(--primary); color: white; border-bottom: 7px solid var(--accent); }
.brand-row { display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.brand-name { font-size: 1.5rem; font-weight: 800; letter-spacing: -.055em; color: var(--accent); }
.brand-logo { display: block; width: 72px; height: 72px; object-fit: contain; }
.eyebrow { max-width: 105px; font-size: .75rem; text-transform: uppercase; letter-spacing: .09em; text-align: right; font-weight: 600; line-height: 1.5; }
.identity-copy { border-top: 1px solid #ffffff45; margin-top: 25px; padding-top: 27px; }
h1 { max-width: 380px; font: 800 3.25rem/1.02 var(--heading-font, 'Segoe UI', Arial, sans-serif); letter-spacing: -.05em; margin: 0 0 19px; overflow-wrap: anywhere; }
.role { max-width: 350px; margin: 0; font-size: 1.0625rem; line-height: 1.5; font-weight: 500; text-wrap: pretty; }
.card-body { padding: 28px 36px 0; }
.button { display: flex; align-items: center; justify-content: center; gap: 12px; padding: 15px 20px; min-height: 56px; border-radius: var(--button-radius); font-size: 1rem; font-weight: 700; line-height: 1.4; transition: background-color .15s, border-color .15s; }
.button-primary { background: var(--accent); color: var(--ink); border: 2px solid var(--accent); }
.button-primary:hover { background: var(--paper); }
[data-button-style="outline"] .button-primary { background: transparent; border-color: var(--primary); color: var(--primary); }
[data-button-style="soft"] .button-primary, [data-button-style="glass"] .button-primary { background: var(--panel); border-color: var(--accent); color: var(--ink); }
.contacts { padding: 28px 0 30px; scroll-margin-top: 20px; }
.section-label { color: var(--muted); font-size: .75rem; text-transform: uppercase; letter-spacing: .14em; margin: 0 0 8px; font-weight: 750; }
.contact-row { display: flex; align-items: center; gap: 15px; min-width: 0; padding: 17px 0; border-bottom: 1px solid #e3e3e3; }
.contact-row:hover .contact-value { color: var(--primary); }
.icon-box { display: grid; place-items: center; width: 42px; height: 44px; border-radius: 8px; background: var(--panel); color: var(--primary); flex-shrink: 0; }
.contact-copy { flex: 1; min-width: 0; }
.contact-label { display: block; font-size: .875rem; color: var(--muted); }
.contact-value { display: block; margin-top: 2px; font-size: 1.125rem; font-weight: 700; overflow-wrap: anywhere; }
.contact-value.email { font-size: 1rem; }
.row-arrow { color: var(--muted); display: flex; }
.row-arrow svg { width: 16px; height: 16px; }
.button-secondary { border: 1px solid #d5d5d5; background: var(--paper); color: var(--ink); }
.button-secondary:hover { border-color: var(--primary); background: var(--panel); }
.whatsapp { margin-top: 22px; font-weight: 600; font-size: .9375rem; }
.whatsapp svg:first-child { color: var(--primary); }
.whatsapp svg:last-child { margin-left: auto; width: 18px; height: 18px; }
.whatsapp span { margin-right: auto; }
.website-link { display: flex; align-items: center; gap: 12px; color: var(--primary); padding-top: 20px; min-height: 44px; font-weight: 600; }
.website-link svg:last-child { margin-left: auto; width: 17px; }
.website-link:hover span { text-decoration: underline; }
.presentation { padding-bottom: 24px; }
.presentation p { margin: 0 0 12px; }
.locations { margin: 0 -36px; padding: 27px 36px 23px; background: var(--panel); border-top: 1px solid #e7e7e7; }
.locations-heading { display: flex; justify-content: space-between; align-items: center; gap: 16px; margin-bottom: 17px; }
.locations h2 { font: 800 1.625rem/1.25 var(--heading-font, 'Segoe UI', Arial, sans-serif); letter-spacing: -.035em; margin: 0; }
.location-count { color: var(--primary); font-size: .9375rem; font-weight: 800; border: 1px solid #d7d7d7; border-radius: 20px; min-width: 39px; padding: 3px 10px; text-align: center; }
.location-list { margin: 0; padding: 0; list-style: none; }
.location-list li + li { border-top: 1px solid #dedede; }
.location-row { display: flex; align-items: center; gap: 15px; padding: 16px 0; min-height: 72px; }
.location-index { display: grid; place-items: center; width: 33px; height: 33px; background: var(--accent); border-radius: 50%; font-size: .75rem; font-weight: 800; color: var(--ink); flex-shrink: 0; }
.location-copy { flex: 1; min-width: 0; }
.location-name { display: block; font-size: 1.0625rem; font-weight: 700; line-height: 1.4; overflow-wrap: anywhere; }
.location-detail { display: block; color: var(--muted); font-size: .875rem; margin-top: 3px; overflow-wrap: anywhere; }
.location-arrow { display: flex; color: var(--primary); }
.location-arrow svg { width: 18px; height: 18px; }
.location-row:hover .location-name { color: var(--primary); text-decoration: underline; text-underline-offset: 4px; }
.card-footer { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 20px 36px; font-size: .75rem; color: var(--muted); border-top: 1px solid #e3e3e3; }
.card-footer span:first-child { font-weight: 800; letter-spacing: .13em; }
@media (max-width: 580px) {
    body { padding: 16px 12px; }
    .identity { padding: 26px 26px 30px; }
    .card-body { padding: 25px 26px 0; }
    h1 { font-size: 3rem; }
    .locations { margin-inline: -26px; padding-inline: 26px; }
    .card-footer { padding-inline: 26px; }
}
@media (max-width: 359px) {
    body { padding: 0; }
    .card { border-radius: 0; }
    .identity, .card-body, .card-footer { padding-inline: 22px; }
    .brand-row { gap: 12px; }
    .brand-name { font-size: 1.375rem; }
    h1 { font-size: 2.65rem; }
    .locations { margin-inline: -22px; padding-inline: 22px; }
    .contact-row { gap: 11px; }
    .icon-box { width: 34px; }
    .contact-value.email { font-size: .9375rem; }
}
@media (prefers-reduced-motion: reduce) { * { transition: none !important; } }
@media print { body { padding: 0; background: white; } .card { box-shadow: none; } .identity { print-color-adjust: exact; } .skip-link { display: none; } }