/* AthletiGo contact page, /get-to-touch/
   Same tokens and the same voice as the other templates. The form itself is
   styled by assets/intake.css, which this page already loads. */

:root{
  --void:#050506;--ink:#0b0b0d;--ink-2:#101013;
  --orange:#FF6F20;--orange-2:#C9541F;--ember:#ff9450;--deep:#2b1004;
  --cream:#FBF3EA;--muted:#8d8880;--line:rgba(251,243,234,.10);
  --maxw:1180px;--gutter:clamp(20px,5vw,54px);
}

.contact{background:var(--void);color:var(--cream);
  font-family:"Heebo",system-ui,-apple-system,"Segoe UI",sans-serif;direction:rtl}
.contact .wrap{max-width:var(--maxw);margin:0 auto;padding:0 var(--gutter)}
.contact a{color:var(--cream);text-decoration:none}

/* head */
.ct-head{padding:clamp(52px,9vh,110px) 0 clamp(24px,3.5vw,44px)}
.contact .eyebrow{font-size:clamp(14px,1.6vw,17px);letter-spacing:.22em;color:var(--orange-2);margin:0 0 14px}
.contact .num{font-family:"Barlow Condensed","Heebo",sans-serif;font-weight:700}
.contact .h1{font-size:clamp(34px,6vw,68px);line-height:1.02;font-weight:900;
  letter-spacing:-.03em;margin:0 0 16px;color:#FBF3EA}
.ct-lead{color:#c7c1b9;font-weight:200;font-size:clamp(16px,2vw,20px);line-height:1.6;
  margin:0;max-width:48ch}

/* body: the form wide, the direct routes narrow */
.ct-body{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,320px);
  gap:clamp(24px,3.4vw,56px);align-items:start;padding-bottom:clamp(40px,6vh,80px)}
.ct-quick{display:none}
.ct-form{min-width:0}
/* the shared form arrives with its own page padding; this is not a page */
.ct-form .intake{padding:0}
.ct-form .intake .wrap{padding:0;max-width:none}
.ct-side{display:grid;gap:clamp(14px,1.8vw,20px);position:sticky;top:96px}

.ct-direct{display:grid;gap:10px}
.ct-direct .btn{display:block;text-align:center;background:var(--orange);color:var(--deep);
  font-weight:700;font-size:16px;padding:14px 22px;border-radius:999px;
  transition:transform .25s cubic-bezier(.2,.8,.2,1),box-shadow .25s ease}
.ct-direct .btn:hover{transform:translateY(-3px);box-shadow:0 16px 44px rgba(255,111,32,.35)}
.ct-direct .btn.ghost{background:transparent;color:var(--cream);border:1px solid var(--line);
  font-weight:500;box-shadow:none}
.ct-direct .btn.ghost:hover{border-color:var(--orange);color:var(--orange);transform:translateY(-2px)}

.ct-assure{border:1px solid var(--line);border-radius:16px;background:var(--ink);
  padding:clamp(16px,2vw,22px)}
.ct-assure-top{display:flex;align-items:center;gap:14px;margin:0 0 12px}
.ct-face{width:96px;height:96px;border-radius:50%;object-fit:cover;flex:0 0 auto;
  border:1px solid var(--line)}
.ct-today{font-size:17px;font-weight:700;color:#FBF3EA;line-height:1.25}
.ct-assure ul{list-style:none;margin:0;padding:0;display:grid;gap:7px}
.ct-assure li{color:var(--muted);font-weight:200;font-size:15px}
.ct-assure li::before{content:"·";color:var(--orange-2);margin-inline-end:8px}
.ct-stars{display:flex;align-items:baseline;gap:9px;margin:14px 0 0;
  padding-top:14px;border-top:1px solid var(--line);flex-wrap:wrap}
.ct-stars b{font-size:26px;font-weight:900;color:var(--orange);line-height:1}
.ct-stars span[aria-hidden]{color:var(--orange-2);letter-spacing:.18em;font-size:13px}
.ct-of{color:var(--muted);font-size:13.5px;font-weight:200}

/* where we are */
.ct-where{border-top:1px solid var(--line);padding:clamp(36px,6vh,72px) 0 clamp(52px,8vh,100px)}
.ct-where-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,380px);
  gap:clamp(22px,3vw,48px);align-items:start}
.ct-where h2{margin:0 0 18px;font-size:clamp(21px,2.7vw,30px);font-weight:900;letter-spacing:-.02em}
.ct-details{display:grid;grid-template-columns:auto 1fr;gap:10px 18px;margin:0}
.ct-details dt{color:var(--orange-2);font-family:"Barlow Condensed","Heebo",sans-serif;
  font-weight:700;letter-spacing:.12em;font-size:12px;padding-top:3px}
.ct-details dd{margin:0;color:#c7c1b9;font-weight:200;font-size:16px}
.ct-details a{border-bottom:1px solid rgba(255,111,32,.55);transition:color .2s ease}
.ct-details a:hover{color:var(--orange)}

/* A still map: one image, no embed, no script, no call to a map service. */
.ct-place{min-width:0}
.ct-map{display:block;border:1px solid var(--line);border-radius:16px;overflow:hidden;
  background:var(--ink);transition:border-color .25s ease}
.ct-map:hover{border-color:rgba(255,111,32,.5)}
.ct-map img{display:block;width:100%;height:auto;aspect-ratio:800/520;object-fit:cover}
.ct-map span{display:block;padding:12px 16px;color:var(--muted);font-size:13.5px;font-weight:200;
  border-top:1px solid var(--line)}
.ct-map:hover span{color:var(--cream)}
.ct-attr{margin:8px 2px 0;color:var(--muted);font-size:11.5px;font-weight:200;opacity:.75}

@media (max-width:900px){
  .ct-body{grid-template-columns:1fr}
  .ct-side{position:static}
  .ct-where-grid{grid-template-columns:1fr}
}

/* Phone order: head, the two quick buttons, the form, then the assurances.
   The stacked three-button block belongs to the wide layout, so it steps
   aside here and the two that matter come first. */
@media (max-width:760px){
  .ct-quick{display:grid;grid-template-columns:1fr 1fr;gap:10px;order:1;margin:0 0 22px}
  .ct-quick .btn{display:block;text-align:center;background:var(--orange);color:var(--deep);
    font-weight:700;font-size:15.5px;padding:13px 10px;border-radius:999px}
  .ct-quick .btn.ghost{background:transparent;color:var(--cream);border:1px solid var(--line);font-weight:500}
  .ct-form{order:2}
  .ct-side{order:3;margin-top:26px}
  .ct-direct{display:none}
  .ct-face{width:76px;height:76px}
}

@media (prefers-reduced-motion:reduce){
  .contact *{transition:none !important;animation:none !important}
}
