.contact-page { background: var(--color-surface); color: var(--color-on-surface); }
.contact-shell { width: min(100% - 2 * var(--spacing-xl), var(--content-max-width)); margin: 0 auto; }
.contact-hero { background: var(--color-primary); color: var(--color-on-primary); padding: var(--spacing-4xl) 0 var(--spacing-3xl); }
.contact-hero .hero-title { color: #fff; max-width: 14ch; }
.contact-hero .hero-subtitle { max-width: 56rem; color: rgba(255,255,255,.78); }
.contact-eyebrow { display: block; color: var(--color-accent); font-size: var(--font-size-xs); font-weight: 700; letter-spacing: .16em; text-transform: uppercase; margin-bottom: var(--spacing-sm); }
.contact-section { padding: var(--spacing-4xl) 0; }
.contact-section-tint { background: var(--color-surface-tint); }
.contact-section-dark { background: var(--color-primary); color: #fff; }
.contact-section-dark .section-title { color: #fff; }
.contact-grid { display: grid; grid-template-columns: 1fr 1fr; gap: var(--spacing-3xl); align-items: start; }
.contact-cards { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: var(--spacing-md); margin-top: var(--spacing-xl); }
.contact-cards-four { grid-template-columns: repeat(4,minmax(0,1fr)); }
.contact-card { border: 1px solid var(--color-outline); border-radius: var(--border-radius-lg); background: var(--color-surface-elevated); padding: var(--spacing-lg); box-shadow: var(--shadow-level-1); min-width: 0; }
.contact-card h3 { margin: 0 0 var(--spacing-sm); font-family: var(--font-family-heading); font-size: var(--font-size-lg); }
.contact-card p { margin: 0; color: var(--color-on-surface-secondary); overflow-wrap: anywhere; }
.contact-card a { color: var(--color-secondary); text-decoration: none; font-weight: 600; }
.contact-form-wrap { background: var(--color-primary); color: #fff; border-radius: var(--border-radius-xl); padding: var(--spacing-xl); box-shadow: var(--shadow-level-2); }
.contact-form-wrap h2 { margin: 0 0 var(--spacing-xs); font-family: var(--font-family-heading); font-size: var(--font-size-2xl); }
.contact-form-wrap > p { color: rgba(255,255,255,.72); margin: 0 0 var(--spacing-lg); }
.contact-form { display: grid; grid-template-columns: 1fr 1fr; gap: var(--spacing-md); }
.contact-form label { display: grid; gap: .45rem; font-size: var(--font-size-sm); font-weight: 600; }
.contact-form input, .contact-form select, .contact-form textarea { width: 100%; min-width: 0; border: 1px solid rgba(255,255,255,.26); border-radius: var(--border-radius-md); background: rgba(255,255,255,.08); color: #fff; padding: .8rem .9rem; box-sizing: border-box; }
.contact-form select option { color: #111; }
.contact-form input::placeholder, .contact-form textarea::placeholder { color: rgba(255,255,255,.6); }
.contact-form-full { grid-column: 1 / -1; }
.visit-steps { list-style: none; margin: var(--spacing-xl) 0 0; padding: 0; display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: var(--spacing-md); }
.visit-steps li { border-top: 2px solid var(--color-accent); padding-top: var(--spacing-md); }
.visit-steps strong, .visit-steps span { display: block; }
.visit-steps span { margin-top: .4rem; color: var(--color-on-surface-secondary); }
.faq-list { margin-top: var(--spacing-xl); display: grid; gap: var(--spacing-sm); }
.faq-list details { border: 1px solid rgba(255,255,255,.18); border-radius: var(--border-radius-md); background: rgba(255,255,255,.05); padding: 0 var(--spacing-md); }
.faq-list summary { cursor: pointer; padding: var(--spacing-md) 0; font-weight: 700; }
.faq-list p { color: rgba(255,255,255,.76); padding: 0 0 var(--spacing-md); margin: 0; }
.notfound-page { min-height: 65vh; display: grid; place-items: center; padding: var(--spacing-3xl) var(--spacing-lg); background: var(--color-surface); }
.notfound-card { width: min(100%, 44rem); text-align: center; padding: var(--spacing-3xl); border: 1px solid var(--color-outline); border-radius: var(--border-radius-xl); background: var(--color-surface-elevated); }
.notfound-card h1 { font-family: var(--font-family-heading); font-size: var(--font-size-4xl); margin: 0 0 var(--spacing-md); }
.notfound-card p { margin: 0 0 var(--spacing-lg); color: var(--color-on-surface-secondary); }
@media(max-width:991px){ .contact-grid { grid-template-columns: 1fr; } .contact-cards-four { grid-template-columns: repeat(2,minmax(0,1fr)); } .visit-steps { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media(max-width:767px){ .contact-shell { width: min(100% - 2 * var(--spacing-lg), var(--content-max-width)); } .contact-section { padding: var(--spacing-3xl) 0; } .contact-cards, .contact-cards-four, .contact-form, .visit-steps { grid-template-columns: 1fr; } .contact-form-full { grid-column: auto; } .contact-form-wrap { padding: var(--spacing-lg); } .notfound-card { padding: var(--spacing-xl); } }