/* The contact page (resources/views/contact.blade.php), on top of legal.css (its tokens, .lg and .lg-wrap).
   Colour modes follow data-bs-theme on <html>. */
:root,:root[data-bs-theme=light]{--ct-card:#FFFFFF;--ct-field:#CDCDDA;--ct-fieldbg:#FFFFFF;--ct-focus:#5955D1;--ct-ring:rgba(89,85,209,.2);--ct-ictile:#E4E3F9;--ct-icfg:#4743B5;--ct-err:#B42323;--ct-errline:#D93636;--ct-errbg:#FFF3F3;--ct-errring:rgba(217,54,54,.18);--ct-ok:#00754E;--ct-okbg:#F0F9F6;--ct-okline:#BFE6D6;--ct-oktile:#D6F1E6;--ct-shadow:0 1px 2px rgba(12,36,60,.04),0 12px 32px rgba(12,36,60,.06)}
:root[data-bs-theme=dark]{--ct-card:#1E1E1E;--ct-field:rgba(255,255,255,.18);--ct-fieldbg:#232323;--ct-focus:#A9A6F5;--ct-ring:rgba(169,166,245,.28);--ct-ictile:#2B2A4D;--ct-icfg:#C9C7FA;--ct-err:#FF9C9C;--ct-errline:#F2685F;--ct-errbg:#320B0B;--ct-errring:rgba(242,104,95,.25);--ct-ok:#4FD1A5;--ct-okbg:#001F14;--ct-okline:#0D3A2A;--ct-oktile:#0D3A2A;--ct-shadow:none}

/* Layout: one column on phones and tablets, the form on the right from 992px */
.ct-grid{display:grid;grid-template-columns:minmax(0,1fr);grid-template-areas:"intro" "email" "before" "form";padding-top:clamp(44px,6vw,88px);padding-bottom:clamp(8px,2vw,32px)}
.ct-intro{grid-area:intro;padding-bottom:clamp(32px,3.4vw,48px)}
.ct-email{grid-area:email}
.ct-before{grid-area:before}
.ct-form{grid-area:form;align-self:start;margin-top:40px}
@media (min-width:992px){
  .ct-grid{grid-template-columns:minmax(0,1fr) minmax(0,600px);grid-template-areas:"intro form" "email form" "before form";grid-template-rows:auto auto 1fr;column-gap:clamp(48px,6.7vw,96px)}
  .ct-form{margin-top:0}
}

/* Left column */
.ct h2{margin:0}
.ct p{margin:0}
.ct .lg-lead{margin-top:20px;max-width:580px}
.ct-h2{font-size:22px;line-height:1.25;letter-spacing:-.02em;font-weight:600;color:var(--lg-head)}
.ct-form-head .ct-h2{font-size:clamp(24px,2.2vw,28px)}
.ct-row{display:flex;align-items:center;gap:14px;margin-bottom:12px}
.ct-ic{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;flex:none;border-radius:10px;background:var(--ct-ictile);color:var(--ct-icfg)}
.ct-email,.ct-sec{max-width:600px}
.ct-email{padding:clamp(22px,2.4vw,28px) clamp(20px,2.4vw,28px);border:1px solid var(--lg-tint-line);border-radius:16px;background:var(--lg-tint)}
.ct-email .ct-row{margin-bottom:0}
.ct .ct-kicker{margin-top:20px;font-size:12px;font-weight:600;line-height:1.5;letter-spacing:.08em;text-transform:uppercase;color:var(--lg-muted)}
.ct a.ct-mail{display:inline-block;margin-top:4px;font-size:clamp(22px,2vw,26px);line-height:1.25;letter-spacing:-.02em;font-weight:600;overflow-wrap:anywhere}
.ct .ct-meta{display:flex;align-items:center;gap:8px;margin-top:16px;font-size:15px;color:var(--lg-muted)}
.ct-meta svg{flex:none}
.ct-sec{margin-top:clamp(32px,3vw,40px);padding-top:clamp(28px,2.4vw,32px);border-top:1px solid var(--lg-line)}
.ct-body{margin:0;font-size:16px;line-height:1.65;font-style:normal;color:var(--lg-text)}
.ct-body strong{font-weight:600;color:var(--lg-head)}
.ct a.ct-mail,.ct .ct-body a,.ct .ct-fine a,.ct .ct-summary a{color:var(--lg-link);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
.ct a.ct-mail:hover,.ct .ct-body a:hover,.ct .ct-fine a:hover{color:var(--lg-link);text-decoration-thickness:2px}

/* The form card */
.ct-form{padding:clamp(24px,2.8vw,40px) clamp(20px,2.8vw,40px);border:1px solid var(--lg-line);border-radius:clamp(14px,1.2vw,16px);background:var(--ct-card);box-shadow:var(--ct-shadow)}
.ct-form-head{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:8px 16px;margin-bottom:28px}
.ct-fields{display:grid;grid-template-columns:minmax(0,1fr);gap:20px}
@media (min-width:640px){.ct-fields{grid-template-columns:repeat(2,minmax(0,1fr))}}
.ct-field{display:flex;flex-direction:column;gap:6px;min-width:0}
.ct-full{grid-column:1/-1}
.ct-label{margin:0;font-size:14px;font-weight:500;line-height:1.4;color:var(--lg-head)}
.ct-req{margin-left:3px;font-weight:600;color:var(--lg-link)}
.ct-fine .ct-req{margin:0 3px 0 0}
.ct-input{display:block;width:100%;min-height:48px;margin:0;padding:12px 14px;border:1px solid var(--ct-field);border-radius:8px;background:var(--ct-fieldbg);color:var(--lg-head);font:inherit;font-size:15px;line-height:1.4;appearance:none;-webkit-appearance:none}
.ct-input:focus{outline:none;border-color:var(--ct-focus);box-shadow:0 0 0 3px var(--ct-ring)}
.ct-input[aria-invalid=true]{border-color:var(--ct-errline)}
.ct-input[aria-invalid=true]:focus{box-shadow:0 0 0 3px var(--ct-errring)}
textarea.ct-input{min-height:168px;resize:vertical}
.ct-sel{position:relative}
.ct-sel .ct-input{padding-right:44px;cursor:pointer}
.ct-sel .ct-input:has(option[value=""]:checked){color:var(--lg-muted)}
.ct-sel option{color:var(--lg-head);background:var(--ct-card)}
.ct-sel svg{position:absolute;top:50%;right:14px;transform:translateY(-50%);color:var(--lg-muted);pointer-events:none}
.ct .ct-error{display:flex;align-items:flex-start;gap:6px;font-size:13.5px;line-height:1.45;color:var(--ct-err)}
.ct-error svg{flex:none;margin-top:1px}
.ct-submit{gap:16px;margin-top:4px}
.ct-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;width:100%;min-height:48px;padding:12px 24px;border:1px solid #5955D1;border-radius:8px;background:#5955D1;color:#FFFFFF;font:inherit;font-size:15px;font-weight:600;line-height:1.3;white-space:nowrap;cursor:pointer}
.ct-btn:hover{background:#4743B5;border-color:#4743B5}
.ct-btn.disabled,.ct-btn[aria-disabled=true]{opacity:.7;cursor:progress;pointer-events:none}
.ct-btn .spinner-border{margin:0!important}
.ct .ct-fine{font-size:13.5px;line-height:1.55;color:var(--lg-muted)}
.ct-hp{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}

/* Error summary and the sent message */
.ct-summary{display:flex;gap:12px;margin-bottom:24px;padding:16px;border:1px solid var(--ct-errline);border-radius:10px;background:var(--ct-errbg);color:var(--ct-err)}
.ct-summary svg{flex:none;margin-top:1px}
.ct .ct-summary p{font-size:14px;line-height:1.5}
.ct .ct-summary-title{font-weight:600}
.ct-summary ul{margin:6px 0 0;padding-left:18px;font-size:14px;line-height:1.6}
.ct .ct-summary a{color:var(--ct-err)}
.ct-success{display:flex;flex-direction:column;align-items:flex-start;gap:16px;padding:28px;border:1px solid var(--ct-okline);border-radius:12px;background:var(--ct-okbg)}
.ct-success .ct-ic{background:var(--ct-oktile);color:var(--ct-ok)}
.ct .ct-success p{font-size:18px;line-height:1.5;font-weight:500;color:var(--lg-head)}
.ct-summary:focus,.ct-success:focus{outline:none}

.ct a:focus-visible,.ct-btn:focus-visible{outline:2px solid var(--ct-focus);outline-offset:3px;border-radius:6px}