/* ==========================================================
   FEARTICKET — Page-specific styles: contact.html
   Shared rules live in common.css.
   ========================================================== */

.contact-grid{display:grid; grid-template-columns:1.3fr 1fr; gap:48px; align-items:start;}

.c-form{display:flex; flex-direction:column; gap:16px;}

.c-form input, .c-form textarea{width:100%; background:var(--ink2); border:1px solid rgba(244,236,220,0.16); border-radius:8px;
  padding:14px 16px; font-family:'Space Grotesk',sans-serif; font-size:14.5px; color:var(--paper); transition:border-color .15s;}

.c-form input::placeholder, .c-form textarea::placeholder{color:var(--fog-dim);}

.c-form input:focus, .c-form textarea:focus{border-color:var(--ember);}

.buyer-deflect{display:flex; align-items:center; gap:18px; flex-wrap:wrap;
  margin:0 0 40px; padding:18px 24px; text-decoration:none;
  background:var(--ink2); border:1px solid rgba(244,236,220,0.16); border-left:3px solid var(--ember);
  border-radius:0 10px 10px 0; transition:border-color .15s, background .15s;}

.buyer-deflect:hover{background:#221B27; border-color:rgba(232,93,47,0.4); border-left-color:var(--ember);}

.bd-icon{width:38px; height:38px; border-radius:9px; flex-shrink:0;
  background:rgba(232,93,47,0.14); color:var(--ember);
  display:flex; align-items:center; justify-content:center; font-size:16px;}

.bd-text{flex:1; min-width:220px; font-size:14px; line-height:1.55; color:var(--fog);}

.bd-text strong{display:block; color:var(--paper); font-size:16px; font-weight:700; margin-bottom:3px;}

.bd-cta{flex-shrink:0; font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:13.5px;
  text-transform:uppercase; letter-spacing:0.06em; color:var(--ember); white-space:nowrap;}

@media (max-width:600px){
  .buyer-deflect{padding:16px 18px; gap:14px;}
  .bd-cta{width:100%;}
}

.c-form textarea{min-height:150px; resize:vertical;}

.c-form button{width:100%; padding:15px; background:var(--ember); color:var(--ink); border:none; border-radius:8px;
  font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:15px; cursor:pointer; transition:opacity .15s;}

.c-form button:hover{opacity:0.9;}

.c-form button:disabled{opacity:0.6; cursor:default;}

#contactResult{margin-top:4px; font-family:'Space Grotesk',sans-serif; font-size:14px; font-weight:600; min-height:1.4em;}

#contactResult.success{color:var(--scan);}

#contactResult.error{color:#e8735f;}

/* ==========================================================
   ZOHO CRM WEB-TO-LEAD
   The webform ships a light theme and a two-column float layout
   with visible left labels. These rules restyle it to the .c-form
   treatment above - one stacked column, dark fills, placeholder
   only - so the embedded form is indistinguishable from the
   hand-built one it replaces. Zoho's own <style> blocks are
   deleted from the page markup rather than fought with, which is
   why nothing here needs !important.
   ========================================================== */

.crmWebToEntityForm{color:var(--paper);}

.crmWebToEntityForm form{display:flex; flex-direction:column; gap:16px;}

/* the .section-head above already introduces the form; Zoho's own
   title would repeat it */
.crmWebToEntityForm .zcwf_title{display:none;}

.crmWebToEntityForm .zcwf_row{margin:0;}

/* labels stay in the accessibility tree but out of view - the visual
   design is placeholder-driven, exactly as .c-form was */
.crmWebToEntityForm .zcwf_col_lab{
  position:absolute; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0;
}

.crmWebToEntityForm .zcwf_col_fld{position:relative; width:100%; float:none; padding:0; margin:0;}

/* Zoho emits an empty help slot after every field */
.crmWebToEntityForm .zcwf_col_help:empty{display:none;}

.crmWebToEntityForm input[type=text],
.crmWebToEntityForm input[type=email],
.crmWebToEntityForm input[type=tel],
.crmWebToEntityForm textarea{
  width:100%; background:var(--ink2); border:1px solid rgba(244,236,220,0.16); border-radius:8px;
  padding:14px 16px; font-family:'Space Grotesk',sans-serif; font-size:14.5px; color:var(--paper);
  float:none; transition:border-color .15s;
}

.crmWebToEntityForm input::placeholder,
.crmWebToEntityForm textarea::placeholder{color:var(--fog-dim);}

.crmWebToEntityForm input:focus,
.crmWebToEntityForm textarea:focus{border-color:var(--ember);}

.crmWebToEntityForm textarea{min-height:150px; resize:vertical;}

/* the captcha is a light PNG served by Zoho, so it gets the same frame
   the inputs have rather than sitting raw on the dark panel */
.crmWebToEntityForm .zcwf_captcha_img{display:flex; align-items:center; gap:14px; flex-wrap:wrap;}

.crmWebToEntityForm .zcwf_captcha_img img{
  border:1px solid rgba(244,236,220,0.16); border-radius:8px; background:#fff;
}

.crmWebToEntityForm .zcwf_captcha_img a{
  font-family:'IBM Plex Mono',monospace; font-size:12px; color:var(--fog-dim);
  text-decoration:underline; text-underline-offset:3px;
}

.crmWebToEntityForm .zcwf_captcha_img a:hover{color:var(--ember);}

/* absolute so the hidden state leaves no gap under the field. Zoho's
   script toggles visibility inline, so the initial value must be
   visibility - not display or opacity. */
.crmWebToEntityForm .zcwf_captcha_err{
  position:absolute; left:0; top:100%; margin-top:6px; visibility:hidden;
  font-family:'Space Grotesk',sans-serif; font-size:13px; font-weight:600; color:#e8735f;
}

.crmWebToEntityForm .formsubmit.zcwf_button{
  width:100%; max-width:none; padding:15px; background:var(--ember); color:var(--ink);
  border:none; border-radius:8px; font-family:'Space Grotesk',sans-serif; font-weight:700;
  font-size:15px; cursor:pointer; transition:opacity .15s;
}

.crmWebToEntityForm .formsubmit.zcwf_button:hover{opacity:0.9;}

.crmWebToEntityForm .formsubmit.zcwf_button:disabled{opacity:0.6; cursor:default;}

/* .c-form had no reset control. It cannot simply be deleted: Zoho's success
   handler clears the form with form.reset.click(), where `reset` resolves to
   this input rather than the method - so hide it and leave it in the DOM. */
.crmWebToEntityForm input[type=reset]{display:none;}

/* The #wf_splash success toast (.wf_customMessageBox / .wf_customCircle /
   .wf_customCheckMark) is themed in common.css - the newsletter web-to-lead
   form on index.html renders the same markup, so both pages share one copy. */

.contact-info-card{background:var(--ink2); border:1px solid rgba(244,236,220,0.12); border-radius:12px; padding:30px 28px;}

.contact-info-card h3{font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:19px; color:var(--paper); margin-bottom:22px; text-transform:none;}

.ci-row{margin-bottom:20px;}

.ci-row:last-child{margin-bottom:0;}

.ci-label{display:block; font-family:'IBM Plex Mono',monospace; font-size:11px; letter-spacing:0.06em; text-transform:uppercase; color:var(--fog-dim); margin-bottom:4px;}

.ci-value{display:block; font-size:15px; color:var(--paper); text-decoration:none; font-weight:500;}

.ci-value:hover{color:var(--ember);}

@media (max-width:980px){
  .contact-grid{grid-template-columns:1fr;}
}

.lookup-card{max-width:760px; margin:0 auto 50px; background:var(--ink2); border:1px solid rgba(244,236,220,0.12);
  border-radius:12px; padding:28px 30px;}

.lookup-card h3{font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:17px; color:var(--paper); margin-bottom:6px; text-transform:none;}

.lookup-card p{font-size:13.5px; color:var(--fog); margin-bottom:18px;}

.lookup-row{display:flex; gap:10px; flex-wrap:wrap;}

.lookup-row input{flex:1; min-width:200px; background:var(--ink); border:1px solid rgba(244,236,220,0.16); border-radius:7px;
  padding:12px 14px; font-family:'Space Grotesk',sans-serif; font-size:14px; color:var(--paper);}

.lookup-row input::placeholder{color:var(--fog-dim);}

.lookup-row input:focus{border-color:var(--ember);}

.lookup-clear-btn{display:none; align-items:center; justify-content:center; width:40px; flex-shrink:0;
  background:rgba(244,236,220,0.08); color:var(--paper); border:1px solid rgba(244,236,220,0.16); border-radius:7px; cursor:pointer;}

.lookup-clear-btn.visible{display:flex;}

.lookup-clear-btn:hover{background:rgba(244,236,220,0.15);}

.lookup-clear-btn svg{width:15px; height:15px;}

.lookup-search-btn{display:flex; align-items:center; gap:8px; background:var(--ember); color:var(--ink); border:none; border-radius:7px; padding:0 22px;
  font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:14px; cursor:pointer; white-space:nowrap; flex-shrink:0;}

.lookup-search-btn:hover{opacity:0.9;}

.lookup-search-btn svg{width:15px; height:15px;}

.lookup-portal-links{display:flex; gap:18px; margin-top:16px; flex-wrap:wrap;}

.lookup-portal-links a{font-family:'IBM Plex Mono',monospace; font-size:12px; color:var(--fog-dim); text-decoration:underline; text-underline-offset:3px;}

.lookup-portal-links a:hover{color:var(--ember);}

.lookup-results{margin-top:20px;}

.lookup-results-msg{font-size:13.5px; color:var(--fog);}

.lookup-results-title{font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:17px; color:var(--paper); margin-bottom:12px; text-transform:none;}

.event-card{background:var(--ink); border:1px solid rgba(244,236,220,0.14); border-radius:10px; padding:20px 22px; margin-bottom:12px;}

.event-card:last-child{margin-bottom:0;}

.event-card h4{font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:16px; color:var(--paper); text-transform:none;
  padding-bottom:14px; margin-bottom:16px; border-bottom:1px solid rgba(244,236,220,0.12);}

.event-card-row{display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-bottom:16px;}

.event-card-row:last-child{margin-bottom:0;}

.ec-label{display:block; font-size:12.5px; color:var(--fog-dim); margin-bottom:4px;}

.event-card p{font-size:14px; color:var(--paper); font-weight:600; margin:0;}

.event-card p a{color:var(--ember); text-decoration:none;}

.event-card p a:hover{text-decoration:underline;}

.event-card p i{color:var(--fog-dim); margin-right:6px; font-weight:400;}

@media (max-width:600px){
  .event-card-row{grid-template-columns:1fr;}
}