/* ============================================================
   Lexora — Contact page (Split-authority)
   Brand-matched: navy primary + teal-green accent (from logo),
   Inter (display) + Public Sans (body). No gradients in UI.
   Everything is scoped under .lexora-contact so it never leaks
   into the rest of the theme. No bracket-style left borders.
   ============================================================ */

.lexora-contact{
  /* Brand — taken from the live Lexora logo + site palette */
  --primary:#09243C;        /* deep navy */
  --primary-700:#051B2E;    /* darker navy (hover) */
  --primary-600:#0B2F4A;
  --primary-50:#EAF1F7;
  --primary-100:#D5E3EF;

  --accent:#1F9C8A;         /* teal-green (logo) */
  --accent-600:#17806F;
  --accent-300:#5FC8B8;     /* lighter teal — readable on navy */
  --accent-50:#E7F4F1;

  /* Neutrals (cool, matching the site) */
  --bg:#F5F7FA;
  --surface:#FFFFFF;
  --surface-2:#EEF2F6;
  --ink:#0B1F33;
  --ink-2:#4C5A68;          /* AA on white */
  --ink-3:#7C8896;
  --line:#E2E7EC;
  --line-strong:#CDD5DD;

  /* On-navy text roles (all AA on #09243C) */
  --on-navy:#F4F8FC;
  --on-navy-2:rgba(244,248,252,.74);
  --on-navy-line:rgba(244,248,252,.14);

  --display:'Inter', system-ui, -apple-system, sans-serif;
  --body:'Public Sans', system-ui, -apple-system, sans-serif;

  --r-sm:10px; --r:14px; --r-lg:22px;
  --shadow-1:0 1px 2px rgba(11,31,51,.06), 0 1px 1px rgba(11,31,51,.04);
  --shadow-2:0 10px 30px rgba(11,31,51,.09);
  --shadow-3:0 26px 60px rgba(9,36,60,.16);
  --maxw:1180px;
  --ease:cubic-bezier(.2,.7,.2,1);

  font-family:var(--body);
  color:var(--ink);
  font-size:17px;
  line-height:1.6;
  background:var(--bg);
  -webkit-font-smoothing:antialiased;
}

/* base resets within scope */
.lexora-contact *{box-sizing:border-box}
.lexora-contact img,.lexora-contact svg,.lexora-contact iframe{max-width:100%}
.lexora-contact a{color:inherit;text-decoration:none}
.lexora-contact h1,.lexora-contact h2{
  font-family:var(--display);font-weight:500;line-height:1.1;
  letter-spacing:-.025em;margin:0;color:var(--ink);text-wrap:balance}
.lexora-contact p{margin:0}
.lexora-contact .lx-wrap{max-width:var(--maxw);margin:0 auto;padding:0 24px;width:100%}
.lexora-contact .lx-muted{color:var(--ink-3);font-weight:400}

/* ---------------- Hero / split ---------------- */
.lexora-contact .lx-hero{padding:clamp(34px,6vw,76px) 0 clamp(30px,4vw,52px)}
.lexora-contact .lx-split{
  display:grid;grid-template-columns:1.02fr .98fr;align-items:stretch;
  background:var(--surface);border:1px solid var(--line);
  border-radius:var(--r-lg);box-shadow:var(--shadow-3);overflow:hidden}
@media(max-width:920px){
  .lexora-contact .lx-split{grid-template-columns:1fr}
}

/* Navy panel */
.lexora-contact .lx-panel{
  position:relative;overflow:hidden;background:var(--primary);color:var(--on-navy);
  padding:clamp(30px,4vw,52px);display:flex;flex-direction:column;justify-content:flex-start}
.lexora-contact .lx-panel-glow{
  position:absolute;inset:auto -120px -140px auto;width:360px;height:360px;border-radius:50%;
  background:radial-gradient(closest-side, rgba(31,156,138,.42), rgba(31,156,138,0));
  pointer-events:none;filter:blur(6px);opacity:.9}
.lexora-contact .lx-panel > *:not(.lx-panel-glow){position:relative;z-index:1}

.lexora-contact .lx-kicker{
  font-family:var(--display);font-weight:500;font-size:12.5px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--accent-300);margin-bottom:14px}
.lexora-contact .lx-title{
  color:#fff;font-size:clamp(30px,4.2vw,44px);margin-bottom:14px}
.lexora-contact .lx-lede{
  color:var(--on-navy-2);font-size:16.5px;line-height:1.62;max-width:42ch;margin-bottom:26px}

/* Contact channels */
.lexora-contact .lx-channels{list-style:none;margin:0 0 24px;padding:0;
  display:flex;flex-direction:column;gap:2px}
.lexora-contact .lx-channel{display:flex;align-items:center;gap:15px;
  padding:13px 0;border-top:1px solid var(--on-navy-line)}
.lexora-contact .lx-channel:first-child{border-top:0}
.lexora-contact .lx-ic{flex:0 0 auto;width:42px;height:42px;border-radius:12px;
  display:grid;place-items:center;color:var(--accent-300);
  background:rgba(31,156,138,.14);border:1px solid rgba(31,156,138,.26)}
.lexora-contact .lx-ic svg{width:21px;height:21px}
.lexora-contact .lx-channel-body{display:flex;flex-direction:column;gap:1px;min-width:0}
.lexora-contact .lx-channel-label{font-size:12px;letter-spacing:.06em;text-transform:uppercase;
  color:var(--on-navy-2);font-weight:500}
.lexora-contact .lx-channel-value{font-family:var(--display);font-weight:500;font-size:16.5px;
  color:#fff;word-break:break-word}
.lexora-contact a.lx-channel-value{transition:color .15s var(--ease)}
.lexora-contact a.lx-channel-value:hover{color:var(--accent-300)}
.lexora-contact .lx-channel-value .lx-muted{color:var(--on-navy-2);font-weight:400;font-size:13.5px;
  font-family:var(--body)}

/* Assurance row */
.lexora-contact .lx-assure{margin-top:auto;display:flex;flex-wrap:wrap;gap:10px 18px;
  padding-top:28px;border-top:1px solid var(--on-navy-line)}
.lexora-contact .lx-assure-item{display:inline-flex;align-items:center;gap:8px;
  font-size:13.5px;font-weight:500;color:var(--on-navy)}
.lexora-contact .lx-assure-item svg{width:18px;height:18px;color:var(--accent-300);flex:0 0 auto}

/* ---------------- Form card ---------------- */
.lexora-contact .lx-formcard{
  background:var(--surface);padding:clamp(28px,3.4vw,46px);display:flex;flex-direction:column;
  justify-content:flex-start}
.lexora-contact .lx-form-title{font-size:clamp(22px,2.6vw,28px);margin-bottom:8px}
.lexora-contact .lx-form-sub{color:var(--ink-2);font-size:15.5px;line-height:1.55;
  margin-bottom:24px;max-width:46ch}

/* Fine print */
.lexora-contact .lx-finehint{display:flex;align-items:center;gap:9px;margin-top:auto;
  padding-top:22px;font-size:13px;color:var(--ink-3)}
.lexora-contact .lx-finehint svg{width:17px;height:17px;color:var(--accent-600);flex:0 0 auto}

/* ---------------- Contact Form 7 (restyle in scope) ---------------- */
.lexora-contact .wpcf7{font-family:var(--body)}
.lexora-contact .wpcf7 .wrap-form,
.lexora-contact .wpcf7 .containter{padding:0;margin:0}
/* Replace the theme's Bootstrap grid with a controlled 2-col grid */
.lexora-contact .wpcf7 .row{display:grid;grid-template-columns:1fr 1fr;gap:14px 16px;margin:0}
.lexora-contact .wpcf7 .row > [class*="col-"]{
  width:100%!important;max-width:100%!important;flex:0 0 auto!important;padding:0!important;margin:0!important}
.lexora-contact .wpcf7 .row > .col-xl-12{grid-column:1 / -1}
@media(max-width:520px){
  .lexora-contact .wpcf7 .row{grid-template-columns:1fr}
}

.lexora-contact .wpcf7 .wpcf7-form-control-wrap{display:block;position:relative}

/* Inputs / select / textarea */
.lexora-contact .wpcf7 input.wpcf7-form-control,
.lexora-contact .wpcf7 select.wpcf7-form-control,
.lexora-contact .wpcf7 textarea.wpcf7-form-control{
  width:100%;font-family:var(--body);font-size:15.5px;color:var(--ink);
  background:var(--surface-2);border:1.5px solid var(--line);border-radius:12px;
  padding:14px 16px;line-height:1.4;outline:none;-webkit-appearance:none;appearance:none;
  transition:border-color .16s var(--ease),background .16s var(--ease),box-shadow .16s var(--ease)}
.lexora-contact .wpcf7 textarea.wpcf7-form-control{min-height:128px;resize:vertical;display:block}
.lexora-contact .wpcf7 .wpcf7-form-control::placeholder{color:var(--ink-2);opacity:1}

.lexora-contact .wpcf7 input.wpcf7-form-control:hover,
.lexora-contact .wpcf7 select.wpcf7-form-control:hover,
.lexora-contact .wpcf7 textarea.wpcf7-form-control:hover{border-color:var(--line-strong)}

.lexora-contact .wpcf7 input.wpcf7-form-control:focus,
.lexora-contact .wpcf7 select.wpcf7-form-control:focus,
.lexora-contact .wpcf7 textarea.wpcf7-form-control:focus{
  border-color:var(--accent);background:var(--surface);
  box-shadow:0 0 0 4px rgba(31,156,138,.16)}

/* Custom select chevron */
.lexora-contact .wpcf7 select.wpcf7-form-control{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%234C5A68' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 14px center;padding-right:44px;cursor:pointer}

/* Submit button (theme markup: button.wpcf7-submit.wpcf7-btn-abs) */
.lexora-contact .wpcf7 .wpcf7-submit,
.lexora-contact .wpcf7 button.wpcf7-submit{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  width:100%;font-family:var(--display);font-weight:500;font-size:16px;letter-spacing:-.01em;
  color:#fff;background:var(--primary);border:0;border-radius:12px;padding:16px 22px;cursor:pointer;
  position:static;box-shadow:var(--shadow-2);
  transition:background .18s var(--ease),transform .18s var(--ease),box-shadow .18s var(--ease)}
.lexora-contact .wpcf7 .wpcf7-submit:hover{background:var(--primary-700);transform:translateY(-2px);
  box-shadow:0 16px 34px rgba(9,36,60,.22)}
.lexora-contact .wpcf7 .wpcf7-submit:active{transform:translateY(0)}
.lexora-contact .wpcf7 .wpcf7-submit:focus-visible{outline:3px solid var(--accent-300);outline-offset:2px}
.lexora-contact .wpcf7 .wpcf7-submit svg{width:16px;height:15px}
.lexora-contact .wpcf7 .wpcf7-submit svg path{fill:#fff}
/* Submitting spinner sits inline */
.lexora-contact .wpcf7 .wpcf7-spinner{margin:0 0 0 10px}

/* Validation + response messages */
.lexora-contact .wpcf7 .wpcf7-not-valid{border-color:#C0392B!important;background:#FCF1EF}
.lexora-contact .wpcf7 .wpcf7-not-valid-tip{color:#C0392B;font-size:12.5px;font-weight:500;
  margin-top:6px;display:block}
.lexora-contact .wpcf7-response-output{
  grid-column:1 / -1;margin:6px 0 0!important;padding:13px 16px!important;border-radius:12px;
  border:1.5px solid var(--line)!important;font-size:14px;line-height:1.5;background:var(--surface-2)}
.lexora-contact .wpcf7 form.invalid .wpcf7-response-output,
.lexora-contact .wpcf7 form.failed .wpcf7-response-output{
  border-color:#E3B9B3!important;background:#FCF1EF;color:#8A2A1E}
.lexora-contact .wpcf7 form.sent .wpcf7-response-output{
  border-color:#A9DDD4!important;background:var(--accent-50);color:var(--accent-600)}

/* ---------------- Expertise strip ---------------- */
.lexora-contact .lx-strip{padding:6px 0 8px}
.lexora-contact .lx-strip-list{list-style:none;margin:0;padding:18px 0;
  display:flex;flex-wrap:wrap;gap:14px 34px;align-items:center;justify-content:center;
  border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.lexora-contact .lx-strip-list li{display:inline-flex;align-items:center;gap:9px;
  font-family:var(--display);font-weight:500;font-size:14.5px;color:var(--ink-2)}
.lexora-contact .lx-strip-list svg{width:19px;height:19px;color:var(--accent);flex:0 0 auto}

/* ---------------- Location ---------------- */
.lexora-contact .lx-map-sec{padding:clamp(34px,5vw,64px) 0 clamp(44px,6vw,80px)}
.lexora-contact .lx-map-head{margin-bottom:20px}
.lexora-contact .lx-map-title{font-size:clamp(22px,2.6vw,30px);margin-bottom:6px}
.lexora-contact .lx-map{border-radius:var(--r-lg);overflow:hidden;border:1px solid var(--line);
  box-shadow:var(--shadow-2);line-height:0;background:var(--surface-2)}
.lexora-contact .lx-map iframe{display:block;width:100%;border:0;filter:saturate(.92)}

/* ---------------- Reveal motion ---------------- */
.lexora-contact [data-reveal]{opacity:1;transform:none}
.lexora-contact.lx-ready [data-reveal]{opacity:0;transform:translateY(18px);
  animation:lxReveal .7s var(--ease) forwards}
.lexora-contact.lx-ready .lx-formcard[data-reveal]{animation-delay:.12s}
@keyframes lxReveal{to{opacity:1;transform:none}}

@media (prefers-reduced-motion: reduce){
  .lexora-contact.lx-ready [data-reveal]{opacity:1;transform:none;animation:none}
  .lexora-contact .wpcf7 .wpcf7-submit:hover{transform:none}
}