.contact-main [id] { scroll-margin-top: 100px; }
.contact-main h3 { font-size: 25px; line-height: 1.4; margin: 0 0 20px; }
.contact-icon { display: grid; place-items: center; flex-shrink: 0; width: 60px; height: 60px; border: 1px solid #d8b24a55; border-radius: 16px; color: #e3c16e; background: linear-gradient(140deg,#55462b,#252723); }
.contact-icon svg { width: 36px; height: 36px; }
.contact-hero { display: grid; grid-template-columns: 1.1fr 1fr; gap: 50px; align-items: center; padding-block: 55px; }
.contact-desk { padding: 32px; border: 1px solid #d8b24a66; border-radius: 20px; background: radial-gradient(ellipse at top right,#d8b24a19,transparent 70%),#232427; }
.contact-desk > .contact-icon { margin-bottom: 25px; }
.contact-desk h2 { font-size: 30px; margin: 14px 0 26px; }
.contact-channels { display: flex; flex-direction: column; gap: 12px; }
.contact-channels > a { display: flex; align-items: center; gap: 15px; min-height: 64px; padding: 14px 18px; box-sizing: border-box; border: 1px solid #d8b24a77; border-radius: 9px; color: #f3d88f; font-size: 14px; font-weight: 600; text-decoration: none; background: #15171688; }
.contact-channels > a:hover { background: #d8b24a18; border-color: #d8b24a; }
.contact-channels img { width: 28px; height: 28px; }
.contact-channels .contact-icon { width: 28px; height: 28px; border: 0; background: none; }
.contact-channels svg { width: 28px; height: 28px; }
.contact-channels small { display: block; font-size: 14px; font-weight: 400; overflow-wrap: anywhere; margin-top: 4px; }
.contact-routing { padding-block: 45px; border-block: 1px solid #d8b24a33; }
.contact-route-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 24px; margin-top: 32px; }
.contact-route-grid article { display: flex; flex-direction: column; align-items: flex-start; padding: 32px; border: 1px solid #d8b24a44; border-radius: 15px; background: #232427; }
.contact-route-grid article > .contact-icon { margin-bottom: 25px; }
.contact-route-grid article > div { flex: 1; }
.contact-route-link { align-self: stretch; text-align: center; margin-top: 20px; padding: 15px; border: 1px solid #d8b24a66; border-radius: 8px; color: #f0d18a; font-weight: 600; font-size: 14px; text-decoration: none; }
.contact-route-link:hover { background: #d8b24a14; }
.contact-prepare { padding-block: 50px; }
.contact-prepare-heading { max-width: 900px; }
.contact-message-guide { display: grid; grid-template-columns: .65fr 1.35fr; border: 1px solid #d8b24a55; border-radius: 16px; overflow: hidden; margin-top: 30px; background: #232427; }
.contact-tabs { display: flex; flex-direction: column; gap: 10px; padding: 25px; background: #191b1a; border-right: 1px solid #d8b24a33; }
.contact-tabs button { padding: 18px; text-align: left; font: inherit; font-size: 16px; font-weight: 600; color: #d4c4a1; background: transparent; border: 1px solid transparent; border-radius: 8px; cursor: pointer; }
.contact-tabs button[aria-selected=true] { background: #d8b24a18; border-color: #d8b24a88; color: #f1d38b; }
.contact-panels article { padding: 38px; }
.contact-panels article[hidden] { display: none; }
.contact-panels h3 { margin-top: 22px; }
.contact-panels p { margin-bottom: 0; }
.contact-privacy { display: flex; align-items: flex-start; gap: 24px; padding: 28px 32px; margin-top: 28px; background: #d8b24a08; border-left: 3px solid #d8b24a; border-radius: 0 12px 12px 0; }
.contact-privacy h3 { font-size: 22px; margin-bottom: 12px; }
.contact-privacy p { margin: 0; }
.contact-main a:focus-visible,.contact-main button:focus-visible,.contact-main [role=tabpanel]:focus-visible { outline: 3px solid #e5c678; outline-offset: 4px; }
@media(max-width:1000px) { .contact-hero { grid-template-columns: 1fr; gap: 25px; } .contact-desk { width: 100%; box-sizing: border-box; } }
@media(max-width:650px) { .contact-hero { padding-block: 35px; } .contact-desk,.contact-route-grid article { padding: 25px; } .contact-route-grid { grid-template-columns: 1fr; } .contact-main h3 { font-size: 23px; } .contact-message-guide { grid-template-columns: 1fr; } .contact-tabs { border-right: 0; border-bottom: 1px solid #d8b24a33; padding: 16px; gap: 6px; } .contact-tabs button { padding: 14px; } .contact-panels article { padding: 26px; } .contact-privacy { flex-direction: column; padding: 26px; } .contact-channels > a { padding: 14px; gap: 10px; } .contact-channels > a > span { min-width: 0; } }