:root{
  --p:#f9a618;
  --s:#334c9c;
  --t:#292929;
  --m:#6b7280;
  --bd:rgba(41,41,41,.10);
  --shadow:0 24px 70px rgba(0,0,0,.12);
  --shadow2:0 40px 110px rgba(0,0,0,.14);
  --r:26px;
}

body{
  font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial;
  color:var(--t);
  background:
    radial-gradient(900px 360px at 12% 8%, rgba(249,166,24,.16), transparent 60%),
    radial-gradient(900px 360px at 90% 10%, rgba(51,76,156,.14), transparent 62%),
    #fff;
  overflow-x:hidden;
}

/* ================= HERO BANNER (DIFFERENT LOOK) ================= */
.ct-hero{
  position:relative;
  padding:96px 0 54px;
  overflow:hidden;
  margin-top:-2em;
}
.ct-hero::before{
  content:"";
  position:absolute;
  inset:-40% -40%;
  background:
    radial-gradient(circle at 18% 25%, rgba(249,166,24,.30), transparent 55%),
    radial-gradient(circle at 85% 30%, rgba(51,76,156,.25), transparent 58%);
  filter:blur(18px);
  opacity:.9;
}
.ct-hero::after{
  content:"";
  position:absolute;
  inset:-120% -80%;
  background:linear-gradient(120deg, transparent 40%, rgba(255,255,255,.7) 50%, transparent 60%);
  transform:rotate(12deg) translateX(-30%);
  animation:heroSweep 9s ease-in-out infinite;
  opacity:.55;
}
@keyframes heroSweep{
  0%{transform:rotate(12deg) translateX(-40%)}
  50%{transform:rotate(12deg) translateX(40%)}
  100%{transform:rotate(12deg) translateX(-40%)}
}
.ct-hero .wrap{ position:relative; z-index:2; }
.ct-pill{
  display:inline-flex;align-items:center;gap:.55rem;
  padding:.55rem 1.05rem;
  border-radius:999px;
  background:rgba(249,166,24,.12);
  border:1px solid rgba(249,166,24,.28);
  color:var(--p);
  font-weight:900;
  font-size:12px;
  letter-spacing:.26em;
}
.ct-hero h1{
  font-weight:900;
  letter-spacing:-.8px;
}
.ct-hero p{ color:var(--m); max-width:760px; }

/* ================= PANELS ================= */
.ct-grid{
  padding:8em 0 80px;
}
.ct-card{
  position:relative;
  border-radius:var(--r);
  background:linear-gradient(180deg,#fff,#fbfbfd);
  border:1px solid var(--bd);
  box-shadow:var(--shadow);
  overflow:hidden;
  transition:transform .35s ease, box-shadow .35s ease;
}
.ct-card:hover{
  transform:translateY(-10px);
  box-shadow:var(--shadow2);
}

/* ================= LEFT PANEL: TIMELINE INFO ================= */
.ct-left{
  padding:26px;
}
.ct-leftHead{
  display:flex;align-items:flex-start;justify-content:space-between;gap:12px;
}
.ct-mark{
  width:48px;height:48px;border-radius:18px;
  display:grid;place-items:center;
  background:rgba(51,76,156,.10);
  border:1px solid rgba(51,76,156,.18);
  color:var(--s);
  box-shadow:0 16px 34px rgba(51,76,156,.16);
}
.ct-k{
  font-size:12px;
  font-weight:900;
  letter-spacing:.24em;
  text-transform:uppercase;
  color:rgba(41,41,41,.55);
}
.ct-h{
  font-weight:900;
  letter-spacing:-.25px;
  margin-top:6px;
}
.ct-muted{ color:var(--m); }

.ct-timeline{
  position:relative;
  margin-top:18px;
  padding-left:18px;
}
.ct-timeline::before{
  content:"";
  position:absolute;
  left:6px; top:8px; bottom:8px;
  width:2px;
  background:linear-gradient(180deg, rgba(249,166,24,.70), rgba(51,76,156,.55));
  opacity:.6;
}
.ct-step{
  position:relative;
  padding:14px 12px 14px 18px;
  border-radius:18px;
  border:1px solid rgba(41,41,41,.08);
  background:#fff;
  margin-bottom:12px;
  overflow:hidden;
}
.ct-step::before{
  content:"";
  position:absolute;
  left:-40%; top:-30%;
  width:60%; height:160%;
  background:linear-gradient(120deg, transparent 40%, rgba(249,166,24,.18) 50%, transparent 60%);
  transform:skewX(-18deg);
  animation:stepShine 6s ease-in-out infinite;
  opacity:.9;
}
@keyframes stepShine{
  0%{left:-60%; opacity:.0}
  30%{opacity:.7}
  55%{left:120%; opacity:.0}
  100%{left:120%; opacity:0}
}

.ct-stepDot{
  position:absolute;
  left:-2px; top:18px;
  width:16px;height:16px;border-radius:999px;
  background:linear-gradient(135deg,var(--p),var(--s));
  box-shadow:0 0 0 6px rgba(249,166,24,.12);
}
.ct-stepTitle{ font-weight:900; margin:0 0 4px; }
.ct-stepText{ margin:0; color:var(--m); font-size:.95rem; line-height:1.55; }

/* contact chips */
.ct-chips{
  display:grid;
  grid-template-columns:1fr;
  gap:10px;
  margin-top:14px;
}
.ct-chip{
  display:flex;gap:10px;align-items:center;
  padding:12px 14px;
  border-radius:18px;
  border:1px solid rgba(41,41,41,.10);
  background:#fff;
}
.ct-chip .ic{
  width:42px;height:42px;border-radius:16px;
  display:grid;place-items:center;
  background:rgba(249,166,24,.12);
  border:1px solid rgba(249,166,24,.22);
  color:var(--s);
}
.ct-chip .a{ font-weight:900; font-size:13px; color:rgba(41,41,41,.65); }
.ct-chip .b{ font-weight:800; }

/* socials */
.ct-socials{
  margin-top:14px;
  display:flex;gap:10px;flex-wrap:wrap;
}
.ct-sbtn{
  width:44px;height:44px;border-radius:999px;
  display:grid;place-items:center;
  background:#fff;
  border:1px solid rgba(41,41,41,.10);
  color:var(--t);
  text-decoration:none;
  transition:.25s ease;
}
.ct-sbtn:hover{
  transform:translateY(-3px);
  color:var(--s);
  border-color:rgba(51,76,156,.28);
  box-shadow:0 14px 30px rgba(51,76,156,.14);
}

/* ================= RIGHT PANEL: FORM (NEON EDGE + SHINE) ================= */
.ct-right{
  padding:26px;
}
.ct-right::before{
  content:"";
  position:absolute;
  inset:-1px;
  border-radius:var(--r);
  background:linear-gradient(135deg, rgba(249,166,24,.75), rgba(51,76,156,.70));
  opacity:.0;
  transition:opacity .35s ease;
}
.ct-right::after{
  content:"";
  position:absolute;
  inset:1px;
  border-radius:calc(var(--r) - 1px);
  background:linear-gradient(180deg,#fff,#fbfbfd);
}
.ct-card:hover .ct-right::before{ opacity:1; }

.ct-right > *{ position:relative; z-index:2; }

.ct-formTitle{
  font-weight:900;
  letter-spacing:-.25px;
}
.ct-label{
  color:rgba(41,41,41,.65);
  font-weight:800;
  font-size:.88rem;
}

.ct-input{
  border-radius:16px;
  border:1px solid rgba(41,41,41,.10);
  padding:.82rem 1rem;
  background:#fff;
  color:var(--t);
}
.ct-input:focus{
  border-color:rgba(249,166,24,.55);
  box-shadow:0 0 0 .2rem rgba(249,166,24,.18);
}

/* CTA button (gold) */
.ct-btn{
  position:relative;
  border:0;
  border-radius:999px;
  padding:.9rem 1.2rem;
  font-weight:900;
  color:#201600;
  background:linear-gradient(135deg,var(--p), #ffd67a);
  box-shadow:0 18px 45px rgba(249,166,24,.25);
  overflow:hidden;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.55rem;
}
.ct-btn i{ color:var(--s); transition:transform .25s ease; }
.ct-btn .shine{
  position:absolute; inset:-50% -60%;
  background:linear-gradient(120deg, transparent 40%, rgba(255,255,255,.7) 50%, transparent 60%);
  transform:translateX(-60%) rotate(18deg);
  opacity:0;
}
.ct-btn:hover i{ transform:translateX(6px); }
.ct-btn:hover .shine{ opacity:1; animation:btnShine .9s ease forwards; }
@keyframes btnShine{ to{ transform:translateX(55%) rotate(18deg);} }

.ct-alt{
  border-radius:999px;
  padding:.9rem 1.1rem;
  border:1px solid rgba(51,76,156,.30);
  background:#fff;
  text-decoration:none;
  font-weight:900;
  color:var(--s);
  display:inline-flex; align-items:center; gap:.55rem;
  transition:.25s ease;
}
.ct-alt span{ transition:transform .25s ease; }
.ct-alt:hover{
  transform:translateY(-3px);
  box-shadow:0 16px 34px rgba(51,76,156,.14);
}
.ct-alt:hover span{ transform:translateX(6px); }

/* ================= REVEAL ================= */
.reveal{
  opacity:0;
  transform:translateY(18px);
  transition:opacity .9s cubic-bezier(.2,.9,.23,1), transform .9s cubic-bezier(.2,.9,.23,1);
}
.reveal.in{ opacity:1; transform:none; }

@media (max-width:991.98px){
  .ct-hero{ padding:84px 0 40px; }
}