/* margin:0 and background are already set globally — these two are this
   page's own additions on top of that. */
body{ overflow-x:hidden; max-width:100%; }
*{ -webkit-text-size-adjust:100%; }
h1, h2, h3, p, span, a, label, li{ overflow-wrap:break-word; word-break:break-word; }

/* ================================================================
   HERO — #sg-contact-hero
   ================================================================ */
#sg-contact-hero{
  --ink:#14101F;
  --violet:#8B7FFF;
  --amber:#FFB84D;
  --white:#FFFFFF;
  position:relative;
  background:radial-gradient(circle at 15% 15%, #241A3E 0%, #14101F 45%), radial-gradient(circle at 85% 85%, #2A1B2E 0%, #14101F 50%), #14101F;
  overflow:hidden;
  padding:110px 24px 90px;
}
#sg-contact-hero .sg-hex-pattern{
  position:absolute; inset:0; z-index:0; opacity:0.4;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='84' height='96' viewBox='0 0 84 96'%3E%3Cpolygon points='42,0 84,24 84,72 42,96 0,72 0,24' fill='none' stroke='rgba(255,255,255,0.06)' stroke-width='1.5'/%3E%3C/svg%3E");
  background-size:84px 96px;
}
#sg-contact-hero .sg-container{ position:relative; z-index:2; }
#sg-contact-hero .sg-eyebrow{
  color:#B9AFFF; margin-bottom:20px;
}
#sg-contact-hero h1{
  font-size:clamp(30px, 4.6vw, 48px);
  line-height:1.15;
  font-weight:800;
  letter-spacing:-0.02em;
  color:#fff;
  margin:0 0 20px;
}
#sg-contact-hero h1 em{ color:var(--amber); font-style:italic; font-weight:700; }
#sg-contact-hero p{
  font-size:16.5px;
  font-weight:500;
  line-height:1.85;
  color:rgba(255,255,255,0.78);
  margin:0;
  max-width:560px;
  margin-left:auto;
  margin-right:auto;
}
@media (max-width: 620px){
  #sg-contact-hero{ padding:80px 20px 60px; }
}

/* ================================================================
   CONTACT MAIN — #sg-contact-page
   Split layout: headline + info card + stats (left), form (right)
   ================================================================ */
#sg-contact-page{
  --bg:#F3F1FB;  --ink:#17151F;
  --ink-soft:#655F80;
  --line:#E1DCF5;
  --violet:#5B4FE8;
  --violet-soft:#EEEBFC;
  --amber:#C98A2E;
  --amber-soft:#F5E7C6;
  --white:#FFFFFF;
  background:var(--bg);
  color:var(--ink);
  padding:100px 24px;
  position:relative;
  overflow:hidden;
}
#sg-contact-page .sg-bg-dots{
  position:absolute; inset:0; z-index:0; opacity:0.5; pointer-events:none;
  background-image:radial-gradient(circle, rgba(23,21,31,0.08) 1px, transparent 1px);
  background-size:22px 22px;
}
#sg-contact-page .sg-container{
  margin:0 auto;
  position:relative;
  z-index:2;
}
#sg-contact-page .sg-split{
  display:grid;
  grid-template-columns: 1fr 1.05fr;
  gap:64px;
  align-items:start;
}
#sg-contact-page .sg-info, #sg-contact-page .sg-form-wrap{ min-width:0; }

/* ---------- LEFT ---------- */
#sg-contact-page .sg-eyebrow{
  display:inline-flex; align-items:center; gap:8px;
  font-size:12.5px; font-weight:700; letter-spacing:0.1em; text-transform:uppercase;
  color:var(--violet);
  background:var(--white);
  border:1px solid var(--line);
  padding:8px 16px;
  border-radius:999px;
  margin-bottom:26px;
}
#sg-contact-page .sg-eyebrow .dot{
  width:6px; height:6px; border-radius:50%;
  background:#4ADE80;
  box-shadow:0 0 0 3px rgba(74,222,128,0.2);
  flex-shrink:0;
}
#sg-contact-page h2{
  font-size:clamp(26px, 3.4vw, 42px);
  line-height:1.2;
  font-weight:800;
  letter-spacing:-0.02em;
  margin:0 0 16px;
}
#sg-contact-page h2 .accent{ color:var(--violet); }
#sg-contact-page .sg-lead{
  font-size:15.5px;
  line-height:1.8;
  color:var(--ink-soft);
  margin:0 0 36px;
  max-width:440px;
}

#sg-contact-page .sg-info-card{
  background:#14101F;
  border-radius:20px;
  padding:8px;
  margin-bottom:24px;
  max-width:440px;
  width:100%;
  overflow:hidden;
}
#sg-contact-page .sg-info-row{
  display:flex;
  align-items:center;
  gap:14px;
  padding:16px;
  border-radius:14px;
  text-decoration:none;
  transition:background .2s ease;
  max-width:100%;
}
#sg-contact-page a.sg-info-row:hover{ background:rgba(255,255,255,0.05); }
#sg-contact-page .sg-info-icon{
  width:38px; height:38px;
  border-radius:11px;
  display:flex; align-items:center; justify-content:center;
  flex-shrink:0;
  font-size:14px;
}
#sg-contact-page .sg-info-row:nth-child(1) .sg-info-icon{ background:rgba(91,79,232,0.25); color:#8B7FFF; }
#sg-contact-page .sg-info-row:nth-child(2) .sg-info-icon{ background:rgba(201,138,46,0.25); color:#FFB84D; }
#sg-contact-page .sg-info-row:nth-child(3) .sg-info-icon{ background:rgba(74,222,128,0.2); color:#4ADE80; }
#sg-contact-page .sg-info-text{
  flex:1 1 0%;
  min-width:0;
}
#sg-contact-page .sg-info-text .label{
  display:block;
  font-size:10.5px;
  font-weight:700;
  letter-spacing:0.08em;
  text-transform:uppercase;
  color:rgba(255,255,255,0.5);
  margin-bottom:3px;
  overflow-wrap:break-word;
}
#sg-contact-page .sg-info-text .value{
  display:block;
  font-size:14.5px;
  font-weight:700;
  color:#fff;
  overflow-wrap:break-word;
}

#sg-contact-page .sg-stat-row{
  display:flex;
  gap:12px;
  max-width:440px;
  width:100%;
}
#sg-contact-page .sg-stat-chip{
  flex:1;
  min-width:0;
  background:var(--white);
  border:1px solid var(--line);
  border-radius:14px;
  padding:16px 12px;
  text-align:center;
}
#sg-contact-page .sg-stat-chip .num{
  display:block;
  font-size:20px;
  font-weight:800;
  color:var(--violet);
  margin-bottom:4px;
}
#sg-contact-page .sg-stat-chip .lab{
  display:block;
  font-size:11px;
  font-weight:600;
  color:var(--ink-soft);
  line-height:1.35;
}

/* ---------- RIGHT: form ---------- */
#sg-contact-page .sg-form-wrap{ position:relative; }
#sg-contact-page .sg-form-card{
  background:var(--white);
  border:1px solid var(--line);
  border-radius:22px;
  padding:40px;
  box-shadow:0 30px 60px -34px rgba(23,21,31,0.3);
}
#sg-contact-page .sg-form-card h2{
  font-size:20px;
  font-weight:800;
  margin:0 0 8px;
}
#sg-contact-page .sg-form-card > p{
  font-size:13.5px;
  line-height:1.6;
  color:var(--ink-soft);
  margin:0 0 26px;
}
#sg-contact-page .sg-form-row{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
  margin-bottom:16px;
}
#sg-contact-page .sg-field{ display:flex; flex-direction:column; gap:7px; }
#sg-contact-page .sg-field.is-full{ margin-bottom:16px; }
#sg-contact-page .sg-field.is-message{ margin-bottom:20px; }
#sg-contact-page label{ font-size:12.5px; font-weight:700; color:var(--ink); }
#sg-contact-page label .req{ color:var(--violet); margin-left:2px; }
#sg-contact-page .sg-optional{ font-weight:400; opacity:.6; }
#sg-contact-page input, #sg-contact-page textarea, #sg-contact-page select{
  font-family:inherit;
  font-size:14px;
  color:var(--ink);
  background:#FAFAF8;
  border:1px solid var(--line);
  border-radius:10px;
  padding:12px 14px;
  outline:none;
  width:100%;
  transition:border-color .15s ease, background .15s ease;
}
#sg-contact-page select{
  appearance:none;
  -webkit-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' stroke='%23655F80' stroke-width='1.6' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right 14px center;
  padding-right:36px;
}
#sg-contact-page input::placeholder, #sg-contact-page textarea::placeholder{ color:#A79FC2; }
#sg-contact-page input:focus, #sg-contact-page textarea:focus, #sg-contact-page select:focus{
  border-color:var(--violet);
  background:#fff;
}
#sg-contact-page textarea{ resize:vertical; min-height:110px; font-family:inherit; }
#sg-contact-page .sg-submit-btn{
  width:100%;
  background:linear-gradient(120deg, var(--violet), #4a3fd1);
  color:#fff;
  font-family:inherit;
  font-weight:700;
  font-size:15px;
  padding:16px 24px;
  border:none;
  border-radius:11px;
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  box-shadow:0 14px 28px -12px rgba(91,79,232,0.5);
}
#sg-contact-page .sg-submit-btn:hover{ filter:brightness(1.06); }
#sg-contact-page .sg-submit-btn:disabled{ opacity:0.65; cursor:not-allowed; }
#sg-contact-page .sg-submit-btn i{ font-size:0.9em; }
#sg-contact-page .sg-submit-btn.is-loading .fa-paper-plane{ animation: sg-spin 0.9s linear infinite; }
@keyframes sg-spin{ 0%{ transform:rotate(0deg); } 100%{ transform:rotate(360deg); } }
#sg-contact-page .sg-trust-note{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  margin:14px 0 0;
  font-size:11.5px;
  color:var(--ink-soft);
  text-align:center;
}
#sg-contact-page .sg-trust-note i{ color:var(--amber); font-size:10px; }
#sg-contact-page .sg-form-error{
  display:none; margin:14px 0 0; font-size:12.5px; color:#D6485A; text-align:center;
}
#sg-contact-page .sg-form-error.is-visible{ display:block; }

#sg-contact-page .sg-thankyou{
  display:none;
  position:absolute; inset:0;
  background:#fff;
  border:1px solid var(--line);
  border-radius:22px;
  flex-direction:column;
  align-items:center; justify-content:center;
  text-align:center;
  padding:60px 44px;
  box-shadow:0 30px 60px -34px rgba(23,21,31,0.3);
}
#sg-contact-page .sg-thankyou.is-visible{ display:flex; }
#sg-contact-page .sg-thankyou-icon{
  width:88px; height:88px; border-radius:50%;
  background:linear-gradient(135deg, var(--violet), #4a3fd1);
  display:flex; align-items:center; justify-content:center;
  margin-bottom:28px;
  box-shadow:0 16px 34px -10px rgba(91,79,232,0.55);
}
#sg-contact-page .sg-thankyou-icon i{ color:#fff; font-size:36px; }
#sg-contact-page .sg-thankyou h3{ margin:0 0 14px; font-size:32px; font-weight:800; letter-spacing:-0.01em; }
#sg-contact-page .sg-thankyou p{ margin:0; font-size:16.5px; line-height:1.75; color:var(--ink-soft); max-width:380px; }
#sg-contact-page .sg-thankyou-btn{
  margin-top:28px;
  display:inline-flex; align-items:center; gap:8px;
  padding:15px 28px; border-radius:999px;
  border:1px solid var(--line);
  background:var(--violet-soft);
  color:var(--violet);
  font-size:14.5px; font-weight:700;
  cursor:pointer;
}
#sg-contact-page .sg-thankyou-btn:hover{ background:var(--violet); color:#fff; }
@media (max-width: 620px){
  #sg-contact-page .sg-thankyou{ padding:44px 24px; }
  #sg-contact-page .sg-thankyou-icon{ width:72px; height:72px; }
  #sg-contact-page .sg-thankyou-icon i{ font-size:30px; }
  #sg-contact-page .sg-thankyou h3{ font-size:26px; }
  #sg-contact-page .sg-thankyou p{ font-size:15px; }
}
#sg-contact-page .sg-form-card.is-hidden{ display:none !important; }

@media (max-width: 980px){
  #sg-contact-page .sg-split{ grid-template-columns:1fr; gap:44px; }
  #sg-contact-page .sg-info-card, #sg-contact-page .sg-stat-row{ max-width:100%; }
}
@media (max-width: 620px){
  #sg-contact-page{ padding:70px 20px; }
  #sg-contact-page .sg-form-card{ padding:26px 20px; }
  #sg-contact-page .sg-form-row{ grid-template-columns:1fr; }
  #sg-contact-page .sg-stat-row{ flex-direction:column; }
}

/* ================================================================
   WHAT HAPPENS NEXT — #sg-contact-process
   ================================================================ */
#sg-contact-process{
  --bg:#FFF8EC;
  --ink:#1F1A12;
  --ink-soft:#8A7B5E;
  --line:#F0E0C4;
  --violet:#5B4FE8;
  --violet-soft:#EEEBFC;
  --amber:#C98A2E;
  --amber-soft:#F5E7C6;
  background:var(--bg);
  color:var(--ink);
  padding:90px 24px;
}
#sg-contact-process .sg-container{ margin:0 auto; }
#sg-contact-process h2{
  font-size:clamp(26px, 3.4vw, 42px);
  font-weight:800;
  letter-spacing:-0.02em;
  margin:0 0 14px;
}
#sg-contact-process h2 span{ color:var(--violet); font-style:italic; font-weight:700; }
#sg-contact-process .sg-process-header p{
  font-size:15.5px;
  line-height:1.8;
  color:var(--ink-soft);
  margin:0;
}
#sg-contact-process .sg-steps-row{
  display:grid;
  grid-template-columns:repeat(4, 1fr);
  gap:24px;
}
#sg-contact-process .sg-step-card{
  position:relative;
  background:#FAFAF8;
  border:1px solid var(--line);
  border-radius:18px;
  padding:28px 22px;
}
#sg-contact-process .sg-step-num{
  width:44px; height:44px;
  border-radius:12px;
  background:linear-gradient(135deg, var(--violet), #4a3fd1);
  color:#fff;
  display:flex; align-items:center; justify-content:center;
  font-size:17px;
  margin-bottom:18px;
  box-shadow:0 8px 18px -8px rgba(91,79,232,0.5);
}
#sg-contact-process .sg-step-card:nth-child(2n) .sg-step-num{
  background:linear-gradient(135deg, var(--amber), #b8791f);
  box-shadow:0 8px 18px -8px rgba(201,138,46,0.5);
}
#sg-contact-process .sg-step-card h3{
  margin:0 0 8px;
  font-size:16px;
  font-weight:700;
}
#sg-contact-process .sg-step-card p{
  margin:0;
  font-size:13.5px;
  line-height:1.65;
  color:var(--ink-soft);
}
@media (max-width: 900px){
  #sg-contact-process .sg-steps-row{ grid-template-columns:repeat(2, 1fr); }
}
@media (max-width: 560px){
  #sg-contact-process{ padding:70px 20px; }
  #sg-contact-process .sg-steps-row{ grid-template-columns:1fr; }
}

/* ================================================================
   FAQ — #sg-contact-faq (two-column, 5 left / 5 right, card accordion)
   ================================================================ */
#sg-contact-faq{
  --bg:#F1F7F4;
  --ink:#16211C;
  --ink-soft:#5C6E64;
  --line:#DCEAE2;
  --violet:#5B4FE8;
  --violet-soft:#EEEBFC;
  --amber:#C98A2E;
  --amber-soft:#F5E7C6;
  --white:#FFFFFF;
  background:var(--bg);
  color:var(--ink);
  padding:90px 24px 100px;
}
#sg-contact-faq .sg-container{ margin:0 auto; }
#sg-contact-faq h2{
  font-size:clamp(24px, 3.4vw, 42px);
  font-weight:800;
  letter-spacing:-0.02em;
  margin:0 0 14px;
}
#sg-contact-faq h2 span{ color:var(--violet); font-style:italic; font-weight:700; }
#sg-contact-faq .sg-faq-header p{
  font-size:15px;
  line-height:1.7;
  color:var(--ink-soft);
  margin:0;
}

#sg-contact-faq .sg-faq-columns{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:18px 24px;
  align-items:start;
}
#sg-contact-faq .sg-faq-col{
  display:flex;
  flex-direction:column;
  gap:18px;
}

#sg-contact-faq .sg-faq-item{
  width:100%;
  max-width:100%;
  background:var(--white);
  border:1px solid var(--line);
  border-radius:18px;
  overflow:hidden;
  box-shadow:0 12px 26px -20px rgba(20,22,28,0.2);
  transition:box-shadow .25s ease, transform .25s ease, border-color .25s ease;
}
#sg-contact-faq .sg-faq-item:hover{
  transform:translateY(-3px);
  box-shadow:0 20px 34px -18px rgba(20,22,28,0.25);
}
#sg-contact-faq .sg-faq-item.is-open{ border-color:var(--violet); }

#sg-contact-faq .sg-faq-q{
  width:100%;
  max-width:100%;
  display:flex;
  align-items:center;
  gap:16px;
  background:none;
  border:none;
  padding:20px;
  font-family:inherit;
  cursor:pointer;
  text-align:left;
}
#sg-contact-faq .sg-faq-num{
  flex:0 0 32px;
  flex-shrink:0;
  width:32px; height:32px;
  border-radius:10px;
  display:flex; align-items:center; justify-content:center;
  font-size:12px; font-weight:800;
}
/* 5-color cycle, matched by row position within each column */
#sg-contact-faq .sg-faq-col .sg-faq-item:nth-child(1) .sg-faq-num{ background:#F5E7C6; color:#C98A2E; }
#sg-contact-faq .sg-faq-col .sg-faq-item:nth-child(2) .sg-faq-num{ background:#DCE8FE; color:#2F6FED; }
#sg-contact-faq .sg-faq-col .sg-faq-item:nth-child(3) .sg-faq-num{ background:#D8F3E4; color:#1F9D66; }
#sg-contact-faq .sg-faq-col .sg-faq-item:nth-child(4) .sg-faq-num{ background:#EDE4FC; color:#7C3AED; }
#sg-contact-faq .sg-faq-col .sg-faq-item:nth-child(5) .sg-faq-num{ background:#D7F3F0; color:#0D9488; }

#sg-contact-faq .sg-faq-col .sg-faq-item:nth-child(1) .sg-faq-q i{ color:#C98A2E; }
#sg-contact-faq .sg-faq-col .sg-faq-item:nth-child(2) .sg-faq-q i{ color:#2F6FED; }
#sg-contact-faq .sg-faq-col .sg-faq-item:nth-child(3) .sg-faq-q i{ color:#1F9D66; }
#sg-contact-faq .sg-faq-col .sg-faq-item:nth-child(4) .sg-faq-q i{ color:#7C3AED; }
#sg-contact-faq .sg-faq-col .sg-faq-item:nth-child(5) .sg-faq-q i{ color:#0D9488; }

#sg-contact-faq .sg-faq-col .sg-faq-item:nth-child(1).is-open .sg-faq-q i{ background:#C98A2E; color:#fff; border-color:#C98A2E; }
#sg-contact-faq .sg-faq-col .sg-faq-item:nth-child(2).is-open .sg-faq-q i{ background:#2F6FED; color:#fff; border-color:#2F6FED; }
#sg-contact-faq .sg-faq-col .sg-faq-item:nth-child(3).is-open .sg-faq-q i{ background:#1F9D66; color:#fff; border-color:#1F9D66; }
#sg-contact-faq .sg-faq-col .sg-faq-item:nth-child(4).is-open .sg-faq-q i{ background:#7C3AED; color:#fff; border-color:#7C3AED; }
#sg-contact-faq .sg-faq-col .sg-faq-item:nth-child(5).is-open .sg-faq-q i{ background:#0D9488; color:#fff; border-color:#0D9488; }
#sg-contact-faq .sg-faq-item.is-open .sg-faq-q i{ transform:rotate(135deg); }
#sg-contact-faq .sg-faq-q .sg-faq-text{ flex:1 1 0%; min-width:0; max-width:100%; font-size:15px; font-weight:700; color:var(--ink); line-height:1.4; overflow-wrap:break-word; word-break:break-word; white-space:normal; }
#sg-contact-faq .sg-faq-q i{
  flex-shrink:0; width:26px; height:26px; border-radius:50%;
  background:var(--bg); border:1px solid var(--line);
  display:flex; align-items:center; justify-content:center;
  font-size:11px;
  transition:transform .3s ease, background .3s ease, color .3s ease, border-color .3s ease;
}
#sg-contact-faq .sg-faq-a{ display:grid; grid-template-rows:0fr; transition:grid-template-rows .35s ease; }
#sg-contact-faq .sg-faq-a > div{ overflow:hidden; }
#sg-contact-faq .sg-faq-a p{ margin:0; padding:0 20px 20px 66px; font-size:13.5px; line-height:1.7; color:var(--ink-soft); }
#sg-contact-faq .sg-faq-item.is-open .sg-faq-a{ grid-template-rows:1fr; }

@media (max-width: 780px){
  #sg-contact-faq .sg-faq-columns{ grid-template-columns:1fr; }
}
@media (max-width: 480px){
  #sg-contact-faq{ padding:70px 20px 90px; }
  #sg-contact-faq .sg-faq-q{ padding:16px; gap:10px; }
  #sg-contact-faq .sg-faq-num{ width:28px; height:28px; font-size:11px; }
  #sg-contact-faq .sg-faq-q .sg-faq-text{ font-size:14px; }
  #sg-contact-faq .sg-faq-a p{ padding-left:16px; padding-right:16px; }
  #sg-contact-process .sg-step-card{ padding:22px 18px; }
}
