/* =========================================================
   CONTACT PAGE (contact.html only)
   Single implementation. Uses the shared tokens, header and
   footer from site.css; nothing here changes their layout.
   ========================================================= */

.page-contact{
  --ct-space:4.5rem;
  --ct-dark:#161412;
  --ct-text:#3f3b37;
  --ct-warm:#f6f3ee;
  --ct-field:#d9d2c8;
}

/* active navigation item (same treatment as the other inner pages) */
.page-contact .header nav a[aria-current="page"]{border-bottom-color:var(--orange);color:var(--ink)}

.page-contact main h2{
  margin:0;color:var(--ink);
  font-size:clamp(1.9rem,2.6vw,2.5rem);
  font-weight:800;line-height:1.1;letter-spacing:-.03em;
}
.page-contact main h2 em{color:var(--grey-2)}
.page-contact main .eyebrow{margin-bottom:.8rem}
.page-contact main svg{fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}

/* buttons */
.ct-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.55rem;min-height:50px;
  padding:.85rem 1.4rem;border:1px solid transparent;
  text-decoration:none;font-size:.92rem;font-weight:700;
  transition:background .2s,border-color .2s,color .2s;
}
.ct-btn--primary{background:var(--orange);border-color:var(--orange);color:var(--ink)}
.ct-btn--primary:hover{background:var(--orange-dark);border-color:var(--orange-dark)}
.ct-btn--ghost{border-color:rgba(255,255,255,.6);color:#fff}
.ct-btn--ghost:hover{border-color:#fff;background:rgba(255,255,255,.08)}
.page-contact main :is(a,button,input,select,textarea,[tabindex]):focus-visible{outline:2px solid var(--orange);outline-offset:3px}

/* ---------- A. hero ---------- */
.ct-hero{position:relative;overflow:hidden;min-height:380px;display:flex;align-items:center;color:#fff;background:var(--ct-dark)}
.ct-hero-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center}
.ct-hero::before{
  content:"";position:absolute;inset:0;z-index:1;
  background:linear-gradient(90deg,rgba(14,12,10,.92) 0%,rgba(14,12,10,.8) 45%,rgba(14,12,10,.45) 100%);
}
.ct-hero-inner{position:relative;z-index:2;width:100%;padding:3.6rem var(--pad)}
.ct-hero h1{margin:0;color:#fff;font-size:clamp(2.6rem,5vw,4.4rem);font-weight:800;line-height:1;letter-spacing:-.04em}
.ct-hero-text{max-width:600px;margin:1.2rem 0 0;color:#e6e1da;font-size:1.06rem;line-height:1.65}
.ct-hero-proof{display:flex;flex-wrap:wrap;gap:.8rem 2.2rem;margin:2rem 0 0;padding:1.3rem 0 0;list-style:none;border-top:1px solid rgba(255,255,255,.16);max-width:720px}
.ct-hero-proof li{display:flex;align-items:center;gap:.6rem;font-size:.95rem;font-weight:600;color:#fff}
.ct-hero-proof svg{width:22px;height:22px;color:var(--orange);flex:none}

/* ---------- B. form + sidebar ---------- */
.ct-main{padding:var(--ct-space) var(--pad)}
.ct-main-grid{display:grid;grid-template-columns:minmax(0,66fr) minmax(300px,34fr);gap:clamp(2rem,4.5vw,4.5rem);align-items:start}
.ct-intro{max-width:620px;margin:.9rem 0 2rem;color:var(--ct-text);font-size:1.04rem;line-height:1.65}
.ct-form-row{display:grid;grid-template-columns:1fr 1fr;gap:0 1.25rem}
.ct-field{display:flex;flex-direction:column;margin-bottom:.4rem}
.ct-field label{margin-bottom:.4rem;font-size:.86rem;font-weight:700;color:var(--ink)}
.ct-field label span{color:var(--orange-dark)}
.ct-field :is(input,select,textarea){
  width:100%;min-height:50px;padding:.7rem .9rem;
  border:1px solid var(--ct-field);border-radius:2px;background:#fff;
  color:var(--ink);font:400 1rem/1.4 var(--font);
  transition:border-color .2s,box-shadow .2s;
}
.ct-field textarea{min-height:150px;resize:vertical}
.ct-field :is(input,select,textarea):hover{border-color:#b9b0a4}
.ct-field :is(input,select,textarea):focus{border-color:var(--orange);box-shadow:0 0 0 3px rgba(239,138,23,.15);outline:none}
.ct-field [aria-invalid="true"]{border-color:#b3261e}
.ct-error{min-height:1.15rem;margin:.3rem 0 0;font-size:.8rem;color:#b3261e}
.ct-form-status{margin:.6rem 0 0;padding:.8rem 1rem;border-left:3px solid var(--orange);background:var(--ct-warm);font-size:.92rem;color:var(--ink)}
.ct-form-status.is-error{border-left-color:#b3261e}
.ct-form-footer{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:1.2rem 2rem;margin-top:1rem;padding-top:1.3rem;border-top:1px solid var(--line)}
.ct-form-notes p{margin:0;font-size:.84rem;line-height:1.55;color:var(--muted)}
.ct-form-notes p + p{margin-top:.25rem;max-width:460px}
.ct-form-notes a{color:var(--ink);text-underline-offset:3px}
.ct-submit{
  display:inline-flex;align-items:center;gap:.55rem;min-height:52px;padding:.85rem 1.6rem;
  border:1px solid var(--orange);background:var(--orange);color:var(--ink);
  font:700 .95rem var(--font);cursor:pointer;transition:background .2s,border-color .2s;
}
.ct-submit:hover{background:var(--orange-dark);border-color:var(--orange-dark)}

.ct-sidebar{padding-top:.3rem}
.ct-sidebar h3{margin:0 0 1.4rem;color:var(--ink);font-size:1.45rem;font-weight:800;letter-spacing:-.02em}
.ct-info{margin:0 0 1.8rem;padding:0;list-style:none}
.ct-info li{display:grid;grid-template-columns:22px 1fr;gap:.9rem;padding:1rem 0;border-top:1px solid var(--line)}
.ct-info li:last-child{border-bottom:1px solid var(--line)}
.ct-info svg{width:20px;height:20px;margin-top:.15rem;color:var(--orange)}
.ct-info span{display:block;font-size:.7rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.ct-info a,.ct-info p{display:block;margin:.25rem 0 0;color:var(--ink);font-size:1.02rem;line-height:1.5;text-decoration:none}
.ct-info a:hover{color:var(--orange-dark)}
.ct-support{padding:1.5rem 1.6rem;background:var(--ct-dark);color:#fff;border-left:2px solid var(--orange)}
.ct-support h4{margin:0 0 .5rem;font-size:1.05rem;font-weight:700;color:#fff}
.ct-support p{margin:0 0 1rem;color:#cfc9c1;font-size:.93rem;line-height:1.6}
.ct-support a{color:var(--orange);font-weight:700;text-decoration:none}
.ct-support a:hover{text-decoration:underline;text-underline-offset:4px}

/* ---------- C. location + consent map ---------- */
.ct-location{background:var(--ct-dark);color:#fff}
.ct-location-grid{display:grid;grid-template-columns:minmax(0,36fr) minmax(0,64fr);align-items:stretch}
.ct-location-text{padding:var(--ct-space) clamp(2rem,4vw,3.5rem) var(--ct-space) var(--pad)}
.page-contact .ct-location h2{color:#fff}
.ct-location-address{margin:1rem 0 1.6rem;color:#e6e1da;font-size:1.08rem;line-height:1.6}
.ct-access-list{margin:0 0 1.8rem;padding:0;list-style:none}
.ct-access-list li{display:grid;grid-template-columns:22px 1fr;gap:.85rem;padding:.8rem 0;border-top:1px solid rgba(255,255,255,.1)}
.ct-access-list svg{width:20px;height:20px;margin-top:.1rem;color:var(--orange)}
.ct-access-list strong{display:block;font-size:.98rem;color:#fff}
.ct-access-list span{display:block;margin-top:.1rem;font-size:.88rem;color:#b9b2aa}
.ct-location-actions{display:flex;flex-wrap:wrap;gap:.7rem}
.ct-qr-block{display:flex;align-items:center;gap:1.1rem;margin-top:1.8rem}
.ct-qr-code{width:92px;height:92px;flex:none;background:#fff;padding:4px}
.ct-qr-code svg{display:block;width:100%;height:100%;stroke:none}
.ct-qr-label{margin:0;font-size:.85rem;line-height:1.5;color:#b9b2aa}

.ct-map-frame{position:relative;min-height:460px;background:#e9e5dc}
.ct-map-consent{position:absolute;inset:0}
.ct-map-preview{width:100%;height:100%;object-fit:cover;display:block;cursor:pointer}
.ct-map-preview-panel{
  position:absolute;top:18px;right:18px;z-index:1;
  width:min(340px,calc(100% - 36px));padding:1.2rem 1.3rem;
  background:rgba(22,20,18,.94);border-left:2px solid var(--orange);color:#fff;
  box-shadow:0 12px 32px rgba(0,0,0,.2);
}
.ct-map-consent-label{display:block;font-size:.68rem;font-weight:800;letter-spacing:.16em;color:var(--orange)}
.ct-map-preview-panel strong{display:block;margin:.35rem 0 .3rem;font-size:1.05rem}
.ct-map-preview-panel p{margin:0 0 .9rem;font-size:.86rem;line-height:1.5;color:#cfc9c1}
.ct-map-load{
  display:inline-flex;align-items:center;gap:.5rem;min-height:44px;padding:.6rem 1.1rem;
  border:1px solid var(--orange);background:var(--orange);color:var(--ink);
  font:700 .9rem var(--font);cursor:pointer;
}
.ct-map-load:hover{background:var(--orange-dark);border-color:var(--orange-dark)}
.ct-map-iframe{position:absolute;inset:0;width:100%;height:100%;border:0;display:block}

/* ---------- D. why contact us ---------- */
.ct-why{padding:var(--ct-space) var(--pad)}
.ct-section-head{max-width:720px;margin-bottom:2.6rem}
.ct-why-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:2rem}
.ct-why-item{padding-top:1.3rem;border-top:1px solid var(--line)}
.ct-why-item svg{width:30px;height:30px;color:var(--orange)}
.ct-why-item h3{margin:1rem 0 .45rem;color:var(--ink);font-size:1.1rem;font-weight:700}
.ct-why-item p{margin:0;color:var(--ct-text);font-size:.97rem;line-height:1.6}

/* ---------- E. final CTA ---------- */
.ct-final{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);min-height:420px;background:var(--ct-dark);color:#fff}
.ct-final-media{position:relative;overflow:hidden}
.ct-final-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center}
.ct-final-inner{display:flex;flex-direction:column;justify-content:center;align-items:flex-start;padding:var(--ct-space) var(--pad) var(--ct-space) clamp(2rem,5vw,5rem)}
.page-contact .ct-final h2{color:#fff;font-size:clamp(1.9rem,3vw,2.8rem)}
.ct-final-inner > p:not(.eyebrow){max-width:520px;margin:1.1rem 0 1.8rem;color:#cfc9c1;font-size:1.04rem;line-height:1.65}

/* ---------- responsive ---------- */
@media(max-width:1100px){
  .ct-main-grid{grid-template-columns:minmax(0,1fr) minmax(280px,.55fr)}
  .ct-why-grid{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:2.2rem}
}
@media(max-width:1000px){
  .page-contact{--ct-space:3.75rem}
  .ct-main-grid{grid-template-columns:1fr}
  .ct-sidebar{display:grid;grid-template-columns:1fr 1fr;gap:0 2rem;align-items:start}
  .ct-sidebar .eyebrow,.ct-sidebar h3{grid-column:1/-1}
  .ct-location-grid{grid-template-columns:1fr}
  .ct-location-text{padding:var(--ct-space) var(--pad) 2.4rem}
  .ct-map-frame{min-height:380px}
  .ct-final{grid-template-columns:1fr}
  .ct-final-media{min-height:260px}
  .ct-final-inner{padding:3rem var(--pad)}
}
@media(max-width:680px){
  .page-contact{--ct-space:3rem}
  .ct-hero{min-height:0}
  .ct-hero-inner{padding:3rem var(--gutter)}
  .ct-hero-proof{flex-direction:column;gap:.7rem}
  .ct-main{padding:var(--ct-space) var(--gutter)}
  .ct-form-row{grid-template-columns:1fr}
  .ct-form-footer{flex-direction:column;align-items:stretch}
  .ct-submit{justify-content:center;width:100%}
  .ct-sidebar{display:block}
  .ct-location-text{padding:var(--ct-space) var(--gutter) 2rem}
  .ct-location-actions .ct-btn{flex:1 1 100%}
  .ct-map-frame{min-height:460px}
  .ct-map-preview-panel{top:auto;left:.75rem;right:.75rem;bottom:.75rem;width:auto}
  .ct-why{padding:var(--ct-space) var(--gutter)}
  .ct-why-grid{grid-template-columns:1fr;gap:1.6rem}
  .ct-final-media{min-height:220px}
  .ct-final-inner{padding:2.6rem var(--gutter)}
  .ct-final .ct-btn{width:100%}
}
@media(prefers-reduced-motion:reduce){
  .page-contact main *{transition:none !important}
}