/* ── Contact Us page — builds on homepage-styles.css + about-styles.css tokens ── */
.ct-hero { padding-bottom:64px; }
.ct-hero .ab-hero-sub { margin-bottom:0; }
.ct-sect { padding:72px 36px 96px; }
.ct-in { max-width:1080px; margin:0 auto; display:grid; grid-template-columns:1.2fr .8fr; gap:32px; align-items:start; }
@media(max-width:840px) { .ct-in { grid-template-columns:1fr; } }

/* form card */
.ct-card { background:var(--white); border:1px solid var(--line); border-radius:var(--r-lg); box-shadow:var(--sh); padding:34px 32px; }
.ct-card h2 { font-size:22px; font-weight:900; letter-spacing:-.02em; color:var(--ink); margin-bottom:22px; }
.ct-form { display:grid; gap:18px; }
.ct-row2 { display:grid; grid-template-columns:1fr 1fr; gap:18px; }
@media(max-width:560px) { .ct-row2 { grid-template-columns:1fr; } }
.ct-field { display:grid; gap:7px; }
.ct-field label { font-size:12.5px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; color:var(--ink); }
.ct-field label em { font-style:normal; text-transform:none; letter-spacing:0; font-weight:500; color:var(--ink-2); }
.ct-field input, .ct-field select, .ct-field textarea { font:inherit; font-size:15px; color:var(--ink); background:var(--paper); border:1.5px solid var(--line); border-radius:12px; padding:13px 15px; width:100%; transition:border-color .15s, box-shadow .15s; }
.ct-field input:focus, .ct-field select:focus, .ct-field textarea:focus { outline:none; border-color:var(--red); box-shadow:0 0 0 3px var(--red-soft); }
.ct-field textarea { min-height:132px; resize:vertical; }
.ct-field select { appearance:none; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23555' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 15px center; padding-right:40px; }
.ct-field select:invalid { color:var(--ink-2); }
.ct-hint { display:flex; align-items:center; gap:10px; flex-wrap:wrap; background:var(--red-soft); border-radius:10px; padding:11px 14px; font-size:13px; font-weight:600; color:var(--ink); line-height:1.5; }
.ct-hint svg { color:var(--red); flex-shrink:0; }
.ct-hint a { color:var(--red); font-weight:700; text-decoration:underline; text-underline-offset:3px; white-space:nowrap; }
.ct-err { font-size:13.5px; font-weight:600; color:var(--red); }
.ct-submit { justify-content:center; width:100%; border:none; cursor:pointer; font-family:inherit; }

/* success */
.ct-success { text-align:center; padding:26px 8px 10px; }
.ct-success-ic { width:58px; height:58px; border-radius:999px; background:var(--red); color:var(--cream); display:flex; align-items:center; justify-content:center; margin:0 auto 20px; }
.ct-success h2 { margin-bottom:10px; }
.ct-success p { font-size:15px; color:var(--ink-2); line-height:1.65; max-width:42ch; margin:0 auto 26px; text-wrap:pretty; }
.ct-success p strong { color:var(--ink); }
.ct-success-row { display:flex; gap:12px; justify-content:center; flex-wrap:wrap; }

/* side rail */
.ct-side { display:grid; gap:20px; position:sticky; top:calc(var(--nav-h) + 24px); }
@media(max-width:840px) { .ct-side { position:static; } }
.ct-side-card { background:var(--white); border:1px solid var(--line); border-radius:var(--r-lg); padding:26px 26px; }
.ct-side-card h3 { font-size:15.5px; font-weight:700; letter-spacing:-.01em; color:var(--ink); margin-bottom:10px; }
.ct-side-card p { font-size:13.5px; color:var(--ink-2); line-height:1.6; }
.ct-email-label { font-size:11.5px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--red); margin-bottom:12px; }
.ct-email-row { display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-bottom:12px; }
.ct-email-row a { font-size:17px; font-weight:900; letter-spacing:-.01em; color:var(--ink); text-decoration:none; word-break:break-all; }
.ct-email-row a:hover { color:var(--red); }
.ct-copy-btn { display:inline-flex; align-items:center; gap:6px; font:inherit; font-size:12px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; color:var(--ink); background:var(--paper); border:1.5px solid var(--line); border-radius:999px; padding:6px 13px; cursor:pointer; transition:border-color .15s, color .15s; }
.ct-copy-btn:hover { border-color:var(--red); color:var(--red); }
.ct-copy-btn.copied { border-color:var(--red); background:var(--red-soft); color:var(--red); }
.ct-response { display:flex; align-items:center; gap:8px; font-size:13px; font-weight:600; color:var(--ink-2); }
.ct-response svg { color:var(--red); flex-shrink:0; }
.ct-help-card { background:var(--navy); border:none; }
.ct-help-card h3 { color:var(--paper); }
.ct-help-card p { color:rgba(251,247,233,.66); margin-bottom:18px; }
.ct-help-cta { display:inline-flex; align-items:center; gap:8px; border-radius:999px; padding:11px 22px; font-size:12.5px; font-weight:700; letter-spacing:.05em; text-transform:uppercase; background:var(--red); color:var(--cream); box-shadow:0 3px 0 var(--red-deep); transition:transform .15s, box-shadow .15s; text-decoration:none; }
.ct-help-cta:hover { transform:translateY(-1px); box-shadow:0 5px 0 var(--red-deep); color:var(--cream); }

a { color:inherit; } a:hover { color:inherit; }
@media(max-width:640px) { .ct-sect { padding:48px 22px 72px; } .ct-card { padding:26px 20px; } }
