/* Immersive Travel Asia — Contact page (contact-*).
   Ported from the approved demo (contact.html). Tokens come from ita.css. */

.contact-intro{background:var(--cream);padding:88px 0 64px;text-align:center}
.contact-intro .eyebrow{letter-spacing:5px;margin-bottom:18px}
.contact-title{font:500 54px/1.15 var(--serif);color:var(--jade);margin:0}
.contact-lead{font:400 18px/1.7 var(--sans);color:var(--sage);margin:16px auto 0;max-width:560px}

.contact-body{background:var(--cream);padding:0 0 96px}
.contact-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:28px;align-items:start;max-width:1160px}

/* --- Form card --- */
.contact-form-card{background:#fff;border:1px solid rgba(26,71,50,.1);padding:44px 46px}
.contact-row{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.contact-field{display:flex;flex-direction:column;gap:8px}
.contact-field--full{margin-top:20px}
.contact-field label{font:600 12px var(--sans);letter-spacing:1.5px;color:var(--jade);text-transform:uppercase}
.contact-field input,
.contact-field select,
.contact-field textarea{border:1px solid rgba(26,71,50,.25);border-radius:3px;padding:13px 14px;font:400 15px var(--sans);color:var(--jade);background:#FDFCF5;outline:none;width:100%}
.contact-field input:focus,
.contact-field select:focus,
.contact-field textarea:focus{border-color:var(--gold)}
.contact-field textarea{resize:vertical}
.contact-field input[readonly]{background:var(--cream);color:var(--sage);cursor:default}
.contact-journey label{color:var(--gold)}
.contact-submit{margin-top:26px;padding:15px 38px;border:0}
.contact-alt{font:400 14px/1.6 var(--sans);color:var(--sage);margin:16px 0 0}

.contact-thanks h2{font:500 32px/1.2 var(--serif);color:var(--jade);margin:0 0 12px}
.contact-thanks p{font:400 16px/1.7 var(--sans);color:var(--sage);margin:0}

/* --- Info aside --- */
.contact-aside{display:flex;flex-direction:column;gap:28px}
.contact-info{background:var(--jade);padding:36px 38px}
.contact-info-label{font:600 12px var(--sans);letter-spacing:2.5px;color:var(--gold-light);text-transform:uppercase;margin-bottom:20px}
.contact-info-lines{display:flex;flex-direction:column;gap:14px;font:400 15.5px/1.5 var(--sans);color:rgba(253,252,245,.9)}
.contact-social{display:flex;gap:12px;margin-top:4px}
.contact-social a{width:36px;height:36px;border:1px solid rgba(253,252,245,.35);border-radius:50%;display:flex;align-items:center;justify-content:center;color:#FDFCF5}
.contact-social a:hover{color:var(--gold-light);border-color:var(--gold-light)}
.contact-info-divider{border-top:1px solid rgba(253,252,245,.2);margin:24px 0 20px}
.contact-info-address{font:400 15.5px/1.7 var(--sans);color:rgba(253,252,245,.9)}
.contact-photo img{width:100%;height:260px;object-fit:cover;display:block}

@media (max-width:900px){
  .contact-intro{padding:56px 0 40px}
  .contact-title{font-size:36px}
  .contact-grid{grid-template-columns:1fr}
  .contact-form-card{padding:32px 26px}
  .contact-row{grid-template-columns:1fr}
}