:root { color-scheme: light; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; color: #193848; background: #faf6e9; font-synthesis: none; }
* { box-sizing: border-box; }
body { margin: 0; line-height: 1.65; }
a { color: #166076; text-underline-offset: .2em; }
a:focus-visible { outline: 3px solid #a84935; outline-offset: 5px; }
header, main, footer { max-width: 1140px; margin: auto; padding: 1.4rem 2rem; }
header { display: flex; align-items: center; justify-content: space-between; gap: 1.25rem; border-bottom: 1px solid #d6cbb0; }
.brand { display: inline-flex; gap: .7rem; align-items: center; color: #193848; text-decoration: none; font-weight: 750; line-height: 1.2; letter-spacing: -.03em; white-space: nowrap; }
.brand img { border-radius: 13px; }
.brand strong { display: block; color: #a84935; letter-spacing: .09em; text-transform: uppercase; font-size: .8rem; margin-top: .25rem; }
nav { display: flex; flex-wrap: wrap; align-items: center; gap: .3rem 1rem; font-size: .88rem; }
nav a { display: inline-flex; min-height: 44px; align-items: center; text-decoration: none; }
nav a[aria-current="page"] { font-weight: 750; text-decoration: underline; }
.language { border: 1px solid #d6cbb0; border-radius: 999px; padding: 0 .8rem; }
h1, h2 { line-height: 1.12; letter-spacing: -.035em; text-wrap: balance; }
h1 { font-family: Georgia, "Times New Roman", serif; font-size: clamp(2.4rem, 5vw, 4.65rem); font-weight: 500; margin: .5rem 0 1.5rem; }
h2 { font-size: 1.65rem; margin: .4rem 0 1rem; }
p { margin: .65rem 0 1rem; }
main:not(.home) { max-width: 850px; padding-top: 3.4rem; padding-bottom: 4rem; }
main:not(.home) h1 { font-size: clamp(2.4rem, 5vw, 3.7rem); }
.eyebrow, .number { color: #98432f; text-transform: uppercase; font-size: .76rem; font-weight: 750; letter-spacing: .16em; }
.hero { display: grid; grid-template-columns: 1.12fr 1fr; gap: 3rem; align-items: center; padding: 3.7rem 0 4.4rem; }
.lead, .intro { font-size: 1.08rem; max-width: 42rem; }
.hero-art { margin: 0; transform: rotate(2deg); }
.hero-art img { width: 100%; height: auto; display: block; border-radius: 21%; box-shadow: 0 24px 45px #19384822; }
.hero-art figcaption { text-align: center; margin-top: 1.2rem; color: #64706c; font-size: .78rem; letter-spacing: .06em; }
.availability { text-transform: uppercase; font-size: .7rem; letter-spacing: .12em; font-weight: 750; margin: 1.6rem 0 .7rem; }
.button { display: inline-flex; justify-content: center; align-items: center; gap: 1.5rem; min-height: 48px; background: #193848; color: #fffdf6; padding: .8rem 1.2rem; border-radius: 8px; text-decoration: none; font-weight: 650; }
.button:hover { background: #28556b; }
.features { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; }
.card { background: #fffdf7; border: 1px solid #d6cbb0; border-radius: 12px; padding: 1.5rem; margin: 1.2rem 0; }
.features .card { margin: 0; padding: 1.6rem; }
.features h2 { margin-top: 1.6rem; font-size: 1.4rem; }
.features p { font-size: .95rem; }
.number { font-size: .69rem; }
.travel-note { display: grid; grid-template-columns: 1fr 1.25fr; gap: 3rem; margin: 3.5rem 0; padding: 2rem 0; border-top: 1px solid #d6cbb0; border-bottom: 1px solid #d6cbb0; }
.travel-note h2 { font-family: Georgia, serif; font-weight: 500; font-size: 2.5rem; }
.help-strip { text-align: center; padding: .5rem 1rem 3rem; }
.text-link { display: inline-flex; align-items: center; min-height: 44px; margin: .25rem .75rem; font-weight: 650; }
ul, ol { padding-left: 1.4rem; }
li { padding: .2rem 0; }
.warning { border-left: 3px solid #a84935; padding-left: 1rem; }
.card a { overflow-wrap: anywhere; }
footer { border-top: 1px solid #d6cbb0; font-size: .83rem; color: #576967; padding-top: 1.8rem; padding-bottom: 2rem; }
.footer-brand { font-weight: 750; font-size: 1rem; color: #193848; margin: 0; }
.footer-meta { display: flex; flex-wrap: wrap; justify-content: space-between; gap: .5rem 2rem; padding-top: .7rem; }
.skip { position: absolute; top: -100px; left: 1rem; background: white; padding: .75rem; z-index: 1; }
.skip:focus { top: 1rem; }
:target { scroll-margin-top: 1rem; }
@media (max-width: 850px) { header { flex-direction: column; align-items: flex-start; } .hero { gap: 1.5rem; } .features { grid-template-columns: 1fr; } .features h2 { margin-top: 1rem; } .travel-note { gap: 1.5rem; } }
@media (max-width: 600px) { header, main, footer { padding-left: 1.25rem; padding-right: 1.25rem; } nav { gap: .2rem .9rem; } .hero { grid-template-columns: 1fr; padding: 2.3rem 0 2.5rem; gap: 2rem; } .hero h1 { font-size: 3.2rem; } .hero-art { max-width: 340px; margin: 0 auto; transform: none; } .travel-note { grid-template-columns: 1fr; gap: .5rem; margin: 2.5rem 0; } .card { padding: 1.2rem; } main:not(.home) { padding-top: 2rem; } }
@media (prefers-reduced-motion: reduce) { * { scroll-behavior: auto; } }