/* ============================================================
   CONTACT (.ct-) — form first, rail, Instagram strip.
   Spec: docs/superpowers/specs/2026-11-01-contact-page-design.md
   Side padding comes from .container; the spec's 48px is --gutter at 1440.
   ============================================================ */
.ct{background:var(--white);color:var(--text);}

/* Title block */
.ct-head{padding:56px 0 0;}
.ct-crumb{margin:0 0 10px;font-family:var(--font-display);font-size:13px;font-weight:400;line-height:1.7;letter-spacing:3px;text-transform:uppercase;color:var(--red-ink);}
.ct-crumb a{color:inherit;text-decoration:none;}
.ct-crumb a:hover{text-decoration:underline;}
.ct .ct-h1{margin:0;font-family:var(--font-display);font-size:clamp(56px,12vw,88px);font-weight:700;line-height:.9;letter-spacing:0;text-transform:uppercase;color:var(--text);}

/* Two columns, 7/5 */
.ct-body{padding:40px 0 72px;}
.ct-grid{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:64px;align-items:start;}

/* Form */
.ct-form{display:flex;flex-direction:column;gap:22px;}
.ct-form[hidden]{display:none;}
.ct-topic-pick{display:flex;flex-direction:column;gap:10px;}
.ct-lbl{margin:0;font-family:var(--font-body);font-size:12px;font-weight:500;line-height:1.4;letter-spacing:.3px;text-transform:uppercase;color:var(--muted);}
.ct-opt{margin-left:4px;color:var(--gray-text);text-transform:none;letter-spacing:0;font-weight:400;}
.ct-pills{display:flex;flex-wrap:wrap;gap:8px;}
.ct-pill{display:inline-flex;align-items:center;height:40px;margin:0;padding:0 18px;box-sizing:border-box;border:1.5px solid var(--text);border-radius:0;background:var(--white);color:var(--text);font-family:var(--font-display);font-size:14px;font-weight:400;line-height:1;letter-spacing:1.5px;text-transform:uppercase;cursor:pointer;transition:background .15s ease,color .15s ease;}
.ct-pill:hover{background:var(--off);}
.ct-pill[aria-pressed="true"]{background:var(--text);color:var(--white);}
.ct-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;}
.ct-row[hidden]{display:none;}
.ct-field{display:flex;flex-direction:column;gap:6px;min-width:0;}
.ct-in{display:block;width:100%;height:48px;margin:0;padding:0 14px;box-sizing:border-box;border:1.5px solid var(--text);border-radius:0;background:var(--white);color:var(--text);font-family:var(--font-body);font-size:15px;font-weight:400;-webkit-appearance:none;appearance:none;}
.ct-in::placeholder{color:var(--gray-text);opacity:1;}
.ct-ta{height:auto;min-height:150px;padding:12px 14px;line-height:1.6;resize:vertical;}
.ct-in:focus-visible{outline:2px solid var(--redbar-a);outline-offset:0;border-color:var(--redbar-a);}
.ct-in[aria-invalid="true"]{border-color:var(--red-ink);}
.ct-err{margin:0;font-family:var(--font-body);font-size:13px;font-weight:500;line-height:1.4;color:var(--red-ink);}
.ct-err[hidden]{display:none;}
.ct-error{margin:0;font-family:var(--font-body);font-size:14px;font-weight:500;line-height:1.5;color:var(--red-ink);}
.ct-error[hidden]{display:none;}
.ct-send-row{display:flex;align-items:center;gap:20px;}
.ct-send{display:inline-flex;align-items:center;justify-content:center;height:50px;margin:0;padding:0 28px;border:0;border-radius:0;background:var(--redbar-a);color:var(--white);font-family:var(--font-display);font-size:15px;font-weight:500;line-height:1;letter-spacing:2px;text-transform:uppercase;cursor:pointer;transition:background .2s ease;}
.ct-send:hover{background:var(--redbar-b);}
.ct-send:disabled{cursor:progress;opacity:.75;}

/* Success replaces the form; the rail stays */
.ct-success{padding:8px 0 24px;}
.ct-success[hidden]{display:none;}
.ct-success:focus{outline:none;}
.ct-success h2{margin:0 0 10px;font-family:var(--font-display);font-size:42px;font-weight:700;line-height:1.05;letter-spacing:0;text-transform:uppercase;color:var(--text);}
.ct-success p{margin:0;max-width:520px;font-size:15px;line-height:1.7;}

/* Rail */
.ct-rail{display:flex;flex-direction:column;gap:28px;padding-left:48px;border-left:1px solid var(--rule-paper);}
.ct-rail-sec{display:flex;flex-direction:column;align-items:flex-start;gap:8px;}
.ct-rail-sec p{margin:0;font-size:15px;line-height:1.7;}
.ct .ct-k{margin:0;font-family:var(--font-display);font-size:13px;font-weight:400;line-height:1.7;letter-spacing:3px;text-transform:uppercase;color:var(--red-ink);}
.ct-mail{font-weight:500;color:var(--text);text-decoration:none;border-bottom:1px solid var(--text);overflow-wrap:anywhere;}
.ct-mail:hover{color:var(--red-ink);border-bottom-color:var(--red-ink);}
.ct-ln{display:inline-flex;align-items:center;gap:8px;padding-bottom:3px;border-bottom:2px solid var(--redbar-a);font-family:var(--font-display);font-size:14px;font-weight:500;line-height:1.4;letter-spacing:2px;text-transform:uppercase;color:var(--text);text-decoration:none;}
.ct-ln:hover{color:var(--red-ink);}
.ct-rail-sec .ct-ln + .ct-ln{margin-top:2px;}
.ct-ig{align-self:flex-start;margin:6px 0 0 52px;}
.ct-ig .soc-mark svg{fill:var(--text);}

/* Fans strip */
.ct-strip{background:var(--ink);color:var(--white);border-bottom:1px solid var(--rule-ink);}
.ct-strip-in{display:flex;align-items:center;justify-content:space-between;gap:24px;padding-top:36px;padding-bottom:36px;}
.ct-strip-t{margin:0;font-family:var(--font-display);font-size:24px;font-weight:600;line-height:1.2;text-transform:uppercase;}
.ct-ln--light,.ct-ln--light:hover{color:var(--white);}

@media (max-width:899px){
  .ct-head{padding-top:44px;}
  .ct-body{padding:32px 0 56px;}
  .ct-grid{grid-template-columns:minmax(0,1fr);gap:48px;}
  .ct-rail{padding-left:0;padding-top:40px;border-left:0;border-top:1px solid var(--rule-paper);}
  .ct-strip-in{flex-direction:column;align-items:flex-start;gap:14px;}
  .ct-strip-t{font-size:22px;}
}
@media (max-width:599px){
  .ct-row{grid-template-columns:minmax(0,1fr);}
  .ct-pill{padding:0 14px;}
}
@media (prefers-reduced-motion:reduce){
  .ct-pill,.ct-send{transition:none;}
}