:root {
  --ink: #0a2c5c;
  --muted: #6b7280;
  --line: #e7ecf3;
  --panel: #ffffff;
  --bg: #fffefe;
  --brand: #7f56d9;
  --blue: #0069ff;
}

* {
  box-sizing: border-box;
}
html,
body {
  height: 100%;
}
body {
  margin: 0;
  font-family:
    Inter,
    system-ui,
    Segoe UI,
    Roboto,
    Arial,
    sans-serif;
  color: #0f172a;
  background: transparent;
}

.tg-schedule {
  max-width: 1200px;
  margin: 0 auto;
  padding: 32px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 64px;
  align-items: start;
}
.tg-visual img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 20px;
}

.tg-copy h1 {
  margin: 0 0 8px;
  font:
    800 36px/1.2 Inter,
    system-ui;
  color: #0b1220;
}
.tg-copy p {
  margin: 0 0 20px;
  color: #6c7280;
  font-size: 18px;
}

.tg-top-tabs {
  display: flex;
  gap: 0;
  margin: 10px 0 24px;
}
.tg-top-tab {
  flex: 1;
  padding: 12px 16px;
  border: 1px solid #d8dbe4;
  background: #fff;
  color: #111;
  border-right: none;
  cursor: pointer;
  font-weight: 700;
  border-radius: 6px 0 0 6px;
}
.tg-top-tab:last-child {
  border-right: 1px solid #d8dbe4;
  border-radius: 0 6px 6px 0;
}
.tg-top-tab.is-active {
  background: #0b1220;
  color: #fff;
}

.tg-mini-tabs {
  display: flex;
  gap: 0;
  margin-bottom: 20px;
}
.tg-mini-tab {
  padding: 12px 16px;
  background: #fff;
  color: #111;
  border: 1px solid #eaeaea;
  cursor: pointer;
}
.tg-mini-tab.is-active {
  outline: 2px solid #0b1220;
  font-weight: 700;
}
.tg-mini-tab + .tg-mini-tab {
  border-left: none;
}

.tg-form {
  display: grid;
  gap: 18px;
}
.tg-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
}
.tg-field {
  display: grid;
  gap: 6px;
}
.tg-field > span {
  color: #111827;
  font-weight: 600;
  font-size: 14px;
}
.tg-field input,
.tg-field textarea,
.tg-phone select {
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 12px 14px;
  background: #fff;
  color: #111;
  font-size: 16px;
}
.tg-field input::placeholder,
.tg-field textarea::placeholder {
  color: #9aa3b2;
}
.tg-field textarea {
  resize: vertical;
  min-height: 140px;
}
.tg-phone .tg-phone-wrap {
  display: flex;
  gap: 12px;
}
.tg-phone select {
  flex: 0 0 110px;
}
.tg-check {
  display: flex;
  align-items: center;
  gap: 10px;
  color: #111827;
}
.tg-check a {
  color: #6b6fea;
  text-decoration: underline;
}
.tg-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 14px 20px;
  border: 0;
  border-radius: 8px;
  cursor: pointer;
  font-weight: 700;
}
.tg-primary {
  background: var(--brand);
  color: #fff;
  box-shadow: 0 1px 2px rgba(10, 13, 18, 0.06);
}
.tg-primary:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}

.tg-view[hidden] {
  display: none;
}

.tg-cal-card {
  background: #fff;
  color: #1a1a1a;
  border: 1px solid rgba(26, 26, 26, 0.08);
  border-radius: 16px;
  overflow: hidden;
}
.tg-cal-head {
  display: flex;
  gap: 16px;
  padding: 28px;
}
.tg-avatar {
  width: 64px;
  height: 64px;
  border-radius: 999px;
}
.tg-cal-account {
  color: rgba(26, 26, 26, 0.6);
  font-weight: 700;
}
.tg-cal-title {
  font:
    700 28px/1.3 Inter,
    system-ui;
  margin-top: 2px;
}
.tg-cal-meta {
  margin: 12px 0 0;
  padding: 0 0 0 20px;
}
.tg-cal-meta li {
  margin: 4px 0;
}
.tg-cal-body {
  padding: 0 28px 28px;
}
.tg-cal-body h3 {
  margin: 0 0 16px;
  font: 700 20px/1.3 Inter;
}
.tg-monthbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin: 10px 0 14px;
}
.tg-month {
  font-weight: 600;
}
.tg-nav {
  width: 38px;
  height: 38px;
  border-radius: 999px;
  border: 0;
  background: #f2f7ff;
  cursor: pointer;
}
.tg-calendar {
  border-top: 1px solid #f0f0f0;
  padding-top: 10px;
}
.tg-weekdays,
.tg-days {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 6px;
}
.tg-weekdays div {
  font-size: 12px;
  text-transform: uppercase;
  text-align: center;
  color: #666;
}
.tg-day {
  height: 44px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  cursor: pointer;
  color: rgba(26, 26, 26, 0.6);
  background: #fff;
  border: 1px solid transparent;
}
.tg-day.is-today {
  border-color: rgba(0, 105, 255, 0.12);
}
.tg-day.is-active {
  background: rgba(0, 105, 255, 0.1);
  color: #0069ff;
  font-weight: 700;
}
.tg-slots {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
  margin: 14px 0;
}
.tg-slot {
  border: 1px solid #d8e7ff;
  border-radius: 10px;
  padding: 10px;
  text-align: center;
  cursor: pointer;
  background: #fff;
}
.tg-slot.is-active {
  background: #1673ff;
  color: #fff;
  border-color: #1673ff;
}
.tg-cal-confirm {
  display: grid;
  gap: 14px;
  margin-top: 10px;
}
.tg-legal {
  font-size: 12px;
  color: #555;
}

@media (max-width: 992px) {
  .tg-schedule {
    grid-template-columns: 1fr;
    gap: 28px;
  }
  .tg-row {
    grid-template-columns: 1fr;
  }
}

.tg-thanks {
  max-width: 900px;
  margin: 80px auto;
  text-align: center;
  color: #111;
}
.tg-mail {
  width: 140px;
  height: auto;
  display: block;
  margin: 0 auto 24px;
}
.tg-thanks h1 {
  font:
    800 80px/1.05 Inter,
    system-ui;
  margin: 10px 0;
}
.tg-thanks .lead {
  font: 600 22px/1.4 Inter;
  margin: 6px 0 4px;
}
.tg-back {
  color: #111;
  text-decoration: none;
  font-weight: 500;
}

.tg-confirm {
  max-width: 1100px;
  margin: 60px auto;
  color: #111;
}
.tg-confirm-card {
  border: 1px solid #eaeaea;
  border-radius: 16px;
  padding: 28px;
  background: #fff;
}
.tg-confirm-top {
  display: grid;
  place-items: center;
  gap: 10px;
  text-align: center;
}
.tg-check {
  width: 36px;
  height: 36px;
  border: 2px solid #1673ff;
  border-radius: 999px;
  display: grid;
  place-items: center;
  color: #1673ff;
  font-weight: 700;
}
.tg-confirm-detail {
  border: 1px solid #e9e9e9;
  border-radius: 12px;
  padding: 16px;
  margin-top: 14px;
  background: #fafafa;
}
.tg-confirm-detail h3 {
  margin: 0 0 8px;
}
.tg-confirm-detail ul {
  margin: 0;
  padding-left: 20px;
}

.tg-schedule {
  max-width: 1280px;
  margin: 64px auto;
  padding: 0 32px;
}
.tg-visual img {
  border-radius: 24px;
}
.tg-pane {
  max-width: 560px;
  margin-left: auto;
}

.tg-copy h1 {
  font:
    800 40px/1.15 Inter,
    system-ui;
  margin: 0 0 6px;
}
.tg-copy p {
  font:
    400 16px/1.6 Inter,
    system-ui;
  color: #6b7280;
  margin: 0 0 18px;
}

.tg-top-tabs {
  gap: 0;
  margin: 10px 0 22px;
}
.tg-top-tab {
  border: 1px solid #e5e7eb;
  background: #fff;
  color: #111;
  border-right: none;
  padding: 10px 16px;
  border-radius: 8px 0 0 8px;
  font-weight: 600;
}
.tg-top-tab:last-child {
  border-right: 1px solid #e5e7eb;
  border-radius: 0 8px 8px 0;
}
.tg-top-tab.is-active {
  background: #0b1220;
  color: #fff;
}

.tg-mini-tabs {
  gap: 0;
  margin: 0 0 18px;
}
.tg-mini-tab {
  border: 1px solid #e5e7eb;
  background: #fff;
  padding: 10px 14px;
}
.tg-mini-tab + .tg-mini-tab {
  border-left: none;
}
.tg-mini-tab.is-active {
  outline: 2px solid #0b1220;
  font-weight: 700;
}

.tg-form {
  display: grid;
  gap: 16px;
}
.tg-row {
  gap: 16px;
}
.tg-btn.tg-primary {
  width: 100%;
  height: 48px;
}

.tg-cal-card {
  margin-top: 8px;
}
.tg-cal-confirm {
  gap: 12px;
}
.tg-legal {
  font-size: 12px;
  color: #6b7280;
}

@media (max-width: 992px) {
  .tg-pane {
    max-width: 100%;
    margin: 0;
  }
  .tg-schedule {
    margin: 40px auto;
    padding: 0 16px;
  }
}

.tg-visual {
  position: relative;
  aspect-ratio: 3 / 5;
  max-height: 720px;
  border-radius: 28px;
  overflow: hidden;
  background: #0a0f1a;
}
.tg-visual > img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}

.tg-schedule {
  max-width: 1280px;
  margin: 72px auto;
  padding: 0 32px;
}
.tg-pane {
  max-width: 560px;
  margin-left: auto;
}

@media (max-width: 992px) {
  .tg-visual {
    aspect-ratio: 16/9;
    max-height: 360px;
  }
  .tg-pane {
    max-width: 100%;
    margin: 0;
  }
}

.tg-mini-tabs {
  display: inline-flex;
  border-radius: 8px;
  overflow: hidden;
  border: 1px solid #e5e7eb;
  margin: 8px 0 18px;
}
.tg-mini-tab {
  padding: 10px 16px;
  background: #fff;
  border-right: 1px solid #e5e7eb;
  font:
    600 14px/1.2 Inter,
    system-ui;
  color: #111;
  cursor: pointer;
}
.tg-mini-tab:last-child {
  border-right: 0;
}
.tg-mini-tab.is-active {
  background: #f8faff;
  outline: 2px solid #0b1220;
  outline-offset: -2px;
}

.tg-top-tabs {
  display: flex;
  border-radius: 8px;
  overflow: hidden;
  border: 1px solid #e5e7eb;
  margin: 10px 0 22px;
}
.tg-top-tab {
  flex: 1;
  padding: 10px 16px;
  background: #fff;
  color: #111;
  font-weight: 700;
}
.tg-top-tab.is-active {
  background: #0b1220;
  color: #fff;
}

.tg-consent {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin: 8px 0 6px;
  font:
    400 13px/1.5 Inter,
    system-ui;
  color: #6b7280;
}
.tg-consent input[type="checkbox"] {
  width: 18px;
  height: 18px;
  margin-top: 2px;
  border: 1px solid #d1d5db;
  border-radius: 4px;
  appearance: none;
  display: inline-grid;
  place-content: center;
  background: #fff;
}
.tg-consent input[type="checkbox"]:checked {
  background: #0b1220;
  border-color: #0b1220;
}
.tg-consent input[type="checkbox"]:checked::after {
  content: "";
  width: 10px;
  height: 10px;
  clip-path: polygon(14% 44%, 0 65%, 50% 100%, 100% 14%, 80% 0, 43% 62%);
  background: #fff;
}
.tg-consent a {
  color: #0b1220;
  text-decoration: underline;
  text-underline-offset: 2px;
}

.tg-thanks {
  max-width: 960px;
  margin: 96px auto;
  padding: 24px;
}
.tg-thanks .tg-card {
  border: 1px solid #e5e7eb;
  border-radius: 16px;
  padding: 24px;
  background: #fff;
}
.tg-thanks h1 {
  font:
    800 32px/1.2 Inter,
    system-ui;
  text-align: center;
  margin: 12px 0 4px;
}
.tg-thanks p {
  color: #6b7280;
  text-align: center;
  margin: 0 0 18px;
}
.tg-thanks .tg-summary {
  max-width: 720px;
  margin: 18px auto 0;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  padding: 18px;
}

.tg-cal-card {
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 16px;
  padding: 18px;
  max-width: 520px;
}
.tg-cal-card h4 {
  font:
    700 16px/1.3 Inter,
    system-ui;
  margin: 0 0 8px;
}
.tg-cal-meta {
  color: #6b7280;
  font:
    400 14px/1.5 Inter,
    system-ui;
  margin: 2px 0 12px;
}
.tg-cal-times {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
}
.tg-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 36px;
  border: 1px solid #d1d5db;
  border-radius: 8px;
  background: #fff;
  font:
    600 13px/1 Inter,
    system-ui;
  cursor: pointer;
}
.tg-chip:hover {
  border-color: #111;
}

.tg-cal-confirm {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 8px 0 14px;
  color: #111;
}

#sch-view-details .tg-form {
  display: grid;
  gap: 14px;
}
#sch-view-details .tg-form input {
  height: 44px;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  padding: 0 12px;
}

.tg-consent {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin-top: 2px;
  color: #6b7280;
  font:
    400 13px/1.5 Inter,
    system-ui;
}
.tg-consent input[type="checkbox"] {
  width: 18px;
  height: 18px;
  border: 1px solid #d1d5db;
  border-radius: 4px;
  appearance: none;
  display: grid;
  place-items: center;
  background: #fff;
  margin-top: 2px;
}
.tg-consent input[type="checkbox"]:checked {
  background: #0b1220;
  border-color: #0b1220;
}
.tg-consent input[type="checkbox"]:checked::after {
  content: "";
  width: 10px;
  height: 10px;
  background: #fff;
  clip-path: polygon(14% 44%, 0 65%, 50% 100%, 100% 14%, 80% 0, 43% 62%);
}
.tg-consent a {
  color: #0b1220;
  text-decoration: underline;
  text-underline-offset: 2px;
}

#sch-view-details .tg-btn.tg-primary {
  height: 44px;
  width: 100%;
  border-radius: 10px;
}

.tg-mini-tabs {
  display: inline-flex;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  overflow: hidden;
  margin: 8px 0 18px;
}
.tg-mini-tab {
  padding: 10px 16px;
  background: #fff;
  border-right: 1px solid #e5e7eb;
  font: 600 14px/1.2 Inter;
}
.tg-mini-tab:last-child {
  border-right: 0;
}
.tg-mini-tab.is-active {
  background: #f8faff;
  outline: 2px solid #0b1220;
  outline-offset: -2px;
}

.tg-schedule {
  max-width: 1280px;
  margin: 72px auto;
  padding: 0 32px;
  display: grid;
  grid-template-columns: 1fr 560px;
  gap: 56px;
}
.tg-visual {
  position: relative;
  aspect-ratio: 3/5;
  max-height: 720px;
  border-radius: 28px;
  overflow: hidden;
  background: #0a0f1a;
}
.tg-visual > img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.tg-pane {
  max-width: 560px;
  margin-left: auto;
}
@media (max-width: 992px) {
  .tg-schedule {
    grid-template-columns: 1fr;
    gap: 24px;
    padding: 0 16px;
  }
  .tg-visual {
    aspect-ratio: 16/9;
    max-height: 360px;
  }
  .tg-pane {
    max-width: 100%;
    margin: 0;
  }
}

.tg-top-tabs {
  display: flex;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  overflow: hidden;
  margin: 10px 0 22px;
}
.tg-top-tab {
  flex: 1;
  padding: 10px 16px;
  background: #fff;
  color: #111;
  font:
    700 14px/1 Inter,
    system-ui;
}
.tg-top-tab.is-active {
  background: #0b1220;
  color: #fff;
}
.tg-tab {
  display: none;
}
.tg-tab.is-visible {
  display: block;
}

.tg-form {
  display: grid;
  gap: 16px;
}
.tg-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}
.tg-field span {
  display: block;
  margin-bottom: 6px;
  font: 600 13px/1 Inter;
}
.tg-field input,
.tg-field textarea {
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  padding: 10px 12px;
}
.tg-field textarea {
  min-height: 120px;
  resize: vertical;
}

.tg-consent {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin: 2px 0 4px;
  color: #6b7280;
  font: 400 13px/1.5 Inter;
}
.tg-consent input {
  width: 18px;
  height: 18px;
  border: 1px solid #d1d5db;
  border-radius: 4px;
  appearance: none;
  display: grid;
  place-items: center;
  background: #fff;
  margin-top: 2px;
}
.tg-consent input:checked {
  background: #0b1220;
  border-color: #0b1220;
}
.tg-consent input:checked::after {
  content: "";
  width: 10px;
  height: 10px;
  background: #fff;
  clip-path: polygon(14% 44%, 0 65%, 50% 100%, 100% 14%, 80% 0, 43% 62%);
}
.tg-consent a {
  text-decoration: underline;
  text-underline-offset: 2px;
  color: #0b1220;
}

.tg-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 46px;
  border-radius: 10px;
  padding: 0 16px;
  border: 0;
  cursor: pointer;
  font: 700 14px/1 Inter;
}
.tg-primary {
  background: #6b4de6;
  color: #fff;
  width: 100%;
}
.tg-secondary {
  background: #f3f4f6;
  color: #111;
}

.tg-cal-card {
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 16px;
  padding: 18px;
}
.tg-cal-profile {
  display: flex;
  gap: 12px;
  align-items: center;
  margin-bottom: 8px;
}
.tg-avatar {
  width: 40px;
  height: 40px;
  border-radius: 999px;
  object-fit: cover;
}
.tg-cal-account {
  font: 600 13px/1 Inter;
  color: #111;
}
.tg-cal-title {
  font: 800 18px/1.2 Inter;
  margin-top: 2px;
}
.tg-cal-sub {
  color: #6b7280;
  font: 400 13px/1.5 Inter;
  margin-top: 6px;
}

.tg-cal-h {
  font: 700 14px/1.3 Inter;
  margin: 10px 0;
}
.tg-monthbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin: 6px 0 10px;
}
.tg-month {
  font: 600 14px/1 Inter;
}
.tg-nav {
  width: 28px;
  height: 28px;
  border-radius: 8px;
  border: 1px solid #e5e7eb;
  background: #fff;
}

.tg-weekdays {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 6px;
  color: #6b7280;
  font: 600 12px/1 Inter;
}
.tg-days {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 6px;
}
.tg-day {
  height: 36px;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  background: #fff;
  display: grid;
  place-items: center;
  cursor: pointer;
}
.tg-day.is-muted {
  opacity: 0.45;
}
.tg-day.is-selected {
  border-color: #0b1220;
  outline: 2px solid #0b1220;
  outline-offset: -2px;
}

.tg-cal-times {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
}
.tg-chip {
  height: 36px;
  border: 1px solid #d1d5db;
  border-radius: 8px;
  background: #fff;
  font: 600 13px/1 Inter;
}
.tg-chip.is-picked {
  border-color: #0b1220;
  outline: 2px solid #0b1220;
  outline-offset: -2px;
}

.tg-cal-confirm {
  display: flex;
  gap: 8px;
  align-items: center;
  margin: 8px 0 12px;
}
.tg-cal-cta-row {
  display: flex;
  gap: 10px;
  margin-top: 12px;
}
/* === Schedule (scoped) — Figma faithful === */
@import url("https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;600;700;800&display=swap");

:root {
  --ink: #0b1220;
  --muted: #6b7280;
  --line: #e5e7eb;
  --panel: #fff;
  --brand: #7f56d9;
  --accent: #1673ff;
  --chip: #f4f6ff;
}

.sch-scope,
.sch-scope * {
  box-sizing: border-box;
}
.sch-scope {
  font-family:
    "Open Sans",
    system-ui,
    Segoe UI,
    Roboto,
    Arial,
    sans-serif;
  color: var(--ink);
}
.sch-scope img {
  display: block;
  max-width: 100%;
}

/* layout */
.sch-scope.tg-schedule {
  max-width: 1280px;
  margin: 72px auto;
  padding: 0 32px;
  display: grid;
  grid-template-columns: 1fr 560px;
  gap: 56px;
}
.sch-scope .tg-visual {
  position: relative;
  aspect-ratio: 3/5;
  max-height: 720px;
  border-radius: 28px;
  overflow: hidden;
  background: #0a0f1a;
}
.sch-scope .tg-visual > img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.sch-scope .tg-copy h1 {
  margin: 0 0 6px;
  font: 800 40px/1.15 "Open Sans";
}
.sch-scope .tg-copy p {
  margin: 0 0 18px;
  color: var(--muted);
}

/* top tabs */
.sch-scope .tg-top-tabs {
  display: flex;
  border: 1px solid var(--line);
  border-radius: 10px;
  overflow: hidden;
  margin: 10px 0 18px;
  background: #fff;
}
.sch-scope .tg-top-tab {
  flex: 1;
  padding: 11px 14px;
  background: #fff;
  color: #111;
  font: 700 14px/1 "Open Sans";
  cursor: pointer;
}
.sch-scope .tg-top-tab.is-active {
  background: #0b1220;
  color: #fff;
}
.sch-scope .tab-view {
  display: none;
}
.sch-scope .tab-view.is-visible {
  display: block;
}

/* investor/fund mini tabs */
.sch-scope .tg-mini-tabs {
  display: inline-flex;
  gap: 8px;
  margin-bottom: 10px;
}
.sch-scope .tg-mini-tab {
  height: 34px;
  padding: 0 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  font: 600 13px/34px "Open Sans";
  cursor: pointer;
}
.sch-scope .tg-mini-tab.is-active {
  background: #0b1220;
  color: #fff;
  border-color: #0b1220;
}

/* form */
.sch-scope .tg-form {
  display: grid;
  gap: 14px;
}
.sch-scope .tg-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
}
.sch-scope .tg-field span {
  display: block;
  margin: 0 0 6px;
  font: 600 12px/1 "Open Sans";
}
.sch-scope .tg-field input,
.sch-scope .tg-field textarea {
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 10px 12px;
  background: #fff;
  font: 400 14px/1.45 "Open Sans";
}
.sch-scope .tg-field textarea {
  min-height: 120px;
  resize: vertical;
}
.sch-scope .tg-phone .tg-phone-wrap {
  display: grid;
  grid-template-columns: 110px 1fr;
  gap: 8px;
}
.sch-scope .tg-phone select {
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 10px 12px;
  background: #fff;
  font: 600 14px/1 "Open Sans";
}
.sch-scope .tg-check {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  color: var(--muted);
  font: 400 13px/1.5 "Open Sans";
}
.sch-scope .tg-check input {
  width: 18px;
  height: 18px;
  appearance: none;
  border: 1px solid #d1d5db;
  border-radius: 4px;
  background: #fff;
  margin-top: 2px;
  display: grid;
  place-items: center;
}
.sch-scope .tg-check input:checked {
  background: #0b1220;
  border-color: #0b1220;
}
.sch-scope .tg-check input:checked::after {
  content: "";
  width: 10px;
  height: 10px;
  background: #fff;
  clip-path: polygon(14% 44%, 0 65%, 50% 100%, 100% 14%, 80% 0, 43% 62%);
}
.sch-scope .tg-check a {
  color: #0b1220;
  text-decoration: underline;
  text-underline-offset: 2px;
}

.sch-scope .tg-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 46px;
  border-radius: 12px;
  padding: 0 16px;
  border: 0;
  cursor: pointer;
  font: 700 14px/1 "Open Sans";
}
.sch-scope .tg-primary {
  background: var(--brand);
  color: #fff;
  width: 100%;
}
.sch-scope .tg-secondary {
  background: #f3f4f6;
  color: #111;
}

/* card (Calendly-style) */
.sch-scope .tg-cal-card {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 18px;
  box-shadow: 0 1px 0 rgba(16, 24, 40, 0.02);
}
.sch-scope .tg-cal-head {
  display: flex;
  gap: 12px;
  align-items: center;
  margin-bottom: 8px;
}
.sch-scope .tg-avatar {
  width: 40px;
  height: 40px;
  border-radius: 999px;
  object-fit: cover;
}
.sch-scope .tg-cal-account {
  font: 600 12px/1.1 "Open Sans";
  color: #6b7280;
}
.sch-scope .tg-cal-title {
  font: 800 18px/1.2 "Open Sans";
  margin-top: 2px;
}
.sch-scope .tg-cal-meta {
  margin: 6px 0 0;
  padding: 0;
  list-style: none;
  color: #6b7280;
  font: 400 13px/1.5 "Open Sans";
}
.sch-scope .tg-cal-h {
  font: 700 14px/1.3 "Open Sans";
  margin: 10px 0;
}
.sch-scope .tg-monthbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin: 8px 0 12px;
}
.sch-scope .tg-month {
  font: 600 14px/1 "Open Sans";
}
.sch-scope .tg-nav {
  width: 28px;
  height: 28px;
  border-radius: 8px;
  border: 1px solid var(--line);
  background: #fff;
  cursor: pointer;
}

.sch-scope .tg-calendar {
  border-top: 1px solid #f2f2f2;
  padding-top: 10px;
}
.sch-scope .tg-weekdays {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 6px;
  color: #667085;
  font: 600 12px/1 "Open Sans";
  text-transform: uppercase;
}
.sch-scope .tg-days {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 6px;
}
.sch-scope .tg-day {
  height: 40px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #fff;
  display: grid;
  place-items: center;
  cursor: pointer;
  font: 600 13px/1 "Open Sans";
  color: #111;
}
.sch-scope .tg-day.is-muted {
  opacity: 0.45;
}
.sch-scope .tg-day:hover {
  border-color: #d0d4dc;
}
.sch-scope .tg-day.is-selected {
  border-color: #0b1220;
  outline: 2px solid #0b1220;
  outline-offset: -2px;
}

.sch-scope .tg-cal-times {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
}
.sch-scope .tg-chip {
  height: 36px;
  border: 1px solid #d8e7ff;
  border-radius: 10px;
  background: #fff;
  text-align: center;
  font: 700 13px/36px "Open Sans";
  cursor: pointer;
}
.sch-scope .tg-chip:hover {
  background: var(--chip);
}
.sch-scope .tg-chip.is-picked {
  background: var(--accent);
  color: #fff;
  border-color: var(--accent);
}

/* Thanks pages */
.sch-scope .tg-thanks {
  max-width: 1200px;
  margin: 96px auto 48px;
  padding: 0 32px;
  display: grid;
  grid-template-columns: 1fr 480px;
  gap: 56px;
}
.sch-scope .tg-thanks h1 {
  font: 800 44px/1.15 "Open Sans";
  margin: 0 0 8px;
}
.sch-scope .tg-thanks p {
  color: var(--muted);
  margin: 0 0 16px;
}
.sch-scope .tg-card {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 18px;
}
.sch-scope .tg-summary {
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 14px;
  margin-top: 10px;
}

@media (max-width: 992px) {
  .sch-scope.tg-schedule {
    grid-template-columns: 1fr;
    gap: 24px;
    margin: 40px auto;
    padding: 0 16px;
  }
  .sch-scope .tg-visual {
    aspect-ratio: 16/9;
    max-height: 360px;
  }
  .sch-scope .tg-row {
    grid-template-columns: 1fr;
  }
  .sch-scope .tg-thanks {
    grid-template-columns: 1fr;
    gap: 24px;
    padding: 0 16px;
  }
}


/* Inter like the mock */
@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap");

:root {
  --ink-900: #181d27;
  --ink-700: #414651;
  --ink-600: #535862;
  --ink-500: #717680;
  --line-300: #d5d7da;
  --line-200: #eaeaea;
  --brand: #7f56d9;
  --brand-600: #6e46cf;
}

.gt-wrap {
  font-family:
    Inter,
    system-ui,
    -apple-system,
    Segoe UI,
    Roboto,
    Arial,
    sans-serif;
  width: 100%;
  padding: 0 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 64px;
  box-sizing: border-box;
  margin: 0 auto;
  max-width: 1280px;
}

/* Left hero */
.gt-hero {
  margin: 0;
  flex: 1 1 0;
  align-self: stretch;
  position: relative;
}
.gt-hero img {
  width: 576px;
  height: 800px;
  object-fit: cover;
  border-radius: 20px;
  display: block;
}

/* Right pane */
.gt-pane {
  flex: 1 1 0;
  align-self: stretch;
  display: flex;
  align-items: center;
}
.gt-pane > * {
  width: 100%;
}
.gt-head {
  width: 480px;
  margin: 0 auto 24px;
}
.gt-title {
  margin: 0;
  color: var(--ink-900);
  font-weight: 600;
  font-size: 36px;
  line-height: 44px;
}
.gt-sub {
  margin: 8px 0 0;
  color: var(--ink-600);
  font-size: 20px;
  line-height: 30px;
}

/* Tabs bar exactly like the ref (Investor “raised”, Fund Raising flat, thin divider) */
.gt-tabs {
  width: 480px;
  margin: 12px auto 0;
  position: relative;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0;
  border-bottom: 1px solid var(--line-200);
}
.gt-tab-input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}
.gt-tab {
  text-align: center;
  padding: 12px 16px;
  cursor: pointer;
  user-select: none;
  color: rgba(0, 0, 0, 0.7);
  font-size: 16px;
  line-height: 20px;
  font-weight: 500;
}
/* Default “flat” look */
#gt-tab-fund:checked ~ label[for="gt-tab-fund"],
#gt-tab-investor:not(:checked) ~ label[for="gt-tab-fund"] {
  border-bottom: 1px solid transparent;
}
/* Selected tab gets top-rounded border and bolder text; sits above divider */
#gt-tab-investor:checked ~ label[for="gt-tab-investor"],
#gt-tab-fund:checked ~ label[for="gt-tab-fund"] {
  background: #fff;
  border: 1px solid #000;
  border-bottom-color: #fff;
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
  font-weight: 700;
  color: #000;
  position: relative;
  top: 1px;
}

/* Form shell */
.gt-form {
  width: 480px;
  margin: 24px auto 0;
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.gt-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 32px;
}

.gt-label {
  display: flex;
  flex-direction: column;
  gap: 6px;
  color: var(--ink-700);
  font-size: 14px;
  font-weight: 500;
}
.gt-input,
.gt-select,
.gt-textarea,
.gt-phone-input {
  width: 100%;
  padding: 12px 16px;
  border-radius: 8px;
  border: 1px solid var(--line-300);
  background: #fff;
  box-shadow: 0 1px 2px rgba(10, 13, 18, 0.05);
  font-size: 16px;
  line-height: 24px;
  color: var(--ink-900);
  outline: none;
  transition:
    border-color 0.15s ease,
    box-shadow 0.15s ease;
  box-sizing: border-box;
}
.gt-input::placeholder,
.gt-phone-input::placeholder {
  color: var(--ink-500);
}
.gt-input:focus,
.gt-select:focus,
.gt-textarea:focus,
.gt-phone-input:focus {
  border-color: #aaa;
  box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.06);
}

/* Country select + phone inline exactly like mock */
.gt-phone {
  display: flex;
  align-items: center;
  border: 1px solid var(--line-300);
  border-radius: 8px;
  box-shadow: 0 1px 2px rgba(10, 13, 18, 0.05);
  overflow: hidden;
}
.gt-phone .gt-select {
  border: 0;
  border-right: 1px solid var(--line-300);
  padding: 12px 12px 12px 16px;
  width: 110px;
  color: var(--ink-900);
  appearance: none;
  background-image: none;
}
.gt-phone .gt-phone-input {
  border: 0;
  border-radius: 0;
  padding-left: 16px;
}

.gt-textarea {
  resize: vertical;
  min-height: 154px;
  padding: 10px 14px;
}

/* Checkbox + text */
.gt-check {
  display: flex;
  align-items: center;
  gap: 12px;
  color: var(--ink-600);
  font-size: 16px;
  line-height: 24px;
}
.gt-check input[type="checkbox"] {
  width: 20px;
  height: 20px;
  border: 1px solid var(--line-300);
  border-radius: 6px;
  appearance: none;
  display: grid;
  place-items: center;
  background: #fff;
}
.gt-check input[type="checkbox"]:checked {
  background: #333;
  border-color: #333;
  background-image: linear-gradient(#333, #333);
}
.gt-check a {
  text-decoration: underline;
  color: var(--ink-600);
}

/* Primary CTA */
.gt-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border-radius: 8px;
  padding: 12px 20px;
  font-size: 16px;
  font-weight: 600;
  line-height: 24px;
  cursor: pointer;
  border: 1px solid transparent;
}
.gt-btn-primary {
  background: var(--brand);
  color: #fff;
  border-color: var(--brand);
  box-shadow: 0 1px 2px rgba(10, 13, 18, 0.05);
}
.gt-btn-primary:hover {
  background: var(--brand-600);
  border-color: var(--brand-600);
}
.gt-btn-primary:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}

/* Responsiveness matching the layout behavior in the mock */
@media (max-width: 1100px) {
  .gt-wrap {
    flex-direction: column;
    gap: 32px;
  }
  .gt-hero img {
    width: 100%;
    height: auto;
  }
  .gt-head,
  .gt-tabs,
  .gt-form {
    width: 100%;
    max-width: 480px;
  }
}
@media (max-width: 560px) {
  .gt-row {
    grid-template-columns: 1fr;
    gap: 16px;
  }
  .gt-wrap {
    padding: 0 20px;
  }
}
/* ----- FIX: force vertical stacking + left alignment ----- */
.gt-pane {
  /* stop flex from pulling children out of normal flow */
  display: block !important;
  align-self: stretch;
  flex: 1 1 0;
}

/* keep the stack tight and left-aligned at 480px like the mock */
.gt-head,
.gt-tabs,
.gt-form {
  width: 480px;
  max-width: 480px;
  margin: 0 !important; /* no centering */
}

/* ensure the tab rail sits under the heading, not beside it */
.gt-head {
  margin-bottom: 24px !important;
}
.gt-tabs {
  margin-top: 0 !important;
}

/* grid for first/last name even if globals touch <label> */
.gt-row {
  display: grid !important;
  grid-template-columns: 1fr 1fr;
  gap: 32px;
}
.gt-label {
  display: flex !important;
  width: 100%;
}

/* phone combo must stretch full width; no squished second field */
.gt-phone {
  display: flex !important;
  width: 100%;
  border: 1px solid var(--line-300);
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 0 1px 2px rgba(10, 13, 18, 0.05);
}
.gt-phone .gt-select {
  width: 110px;
  min-width: 110px;
  border-right: 1px solid var(--line-300);
  padding: 12px 12px 12px 16px;
}
.gt-phone .gt-phone-input {
  flex: 1 1 auto;
  min-width: 0;
  border: 0;
  padding: 12px 16px;
}

/* tighten the textarea to the 154px min height spec */
.gt-textarea {
  min-height: 154px;
}

/* Desktop spacing between left image and form matches spec */
.gt-wrap {
  gap: 64px !important;
}

/* Responsive: stack cleanly when narrow */
@media (max-width: 1100px) {
  .gt-head,
  .gt-tabs,
  .gt-form {
    max-width: 100%;
    width: 100%;
  }
}
/* ====== CONTACT: Get in touch ====== */

/* Layout */
.gt-wrap {
  display: grid;
  grid-template-columns: minmax(520px, 576px) minmax(480px, 1fr);
  gap: 64px;
  padding: 32px;
  align-items: center;
}

.gt-pane {
  max-width: 480px;
  margin: 0 auto;
}

/* Heading */
.gt-title {
  font:
    600 36px/44px Inter,
    system-ui,
    -apple-system,
    Segoe UI,
    Roboto,
    Arial,
    sans-serif;
  color: #181d27;
  margin: 0 0 8px;
}
.gt-sub {
  font:
    400 20px/30px Inter,
    system-ui,
    -apple-system,
    Segoe UI,
    Roboto,
    Arial,
    sans-serif;
  color: #535862;
  margin: 0;
}

/* Tabs */
.gt-tabs {
  position: relative;
  display: flex;
  align-items: flex-end;
  gap: 24px;
  padding-top: 8px;
  margin-top: 8px;
  border-bottom: 1px solid #eaeaea;
}
.gt-tab-input {
  position: absolute;
  inset: 0;
  opacity: 0;
  pointer-events: none;
}
.gt-tab {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 40px;
  min-width: 160px;
  padding: 0 16px;
  font: 600 14px/20px Inter;
  color: #000;
  background: #fff;
  border: 1px solid #000;
  border-bottom-color: transparent;
  border-radius: 4px 4px 0 0;
}
#gt-tab-fund + .gt-tab {
  font-weight: 500;
  color: rgba(0, 0, 0, 0.7);
  border: 0;
  border-bottom: 1px solid #eaeaea;
  border-radius: 0;
}
/* underline to match comp */
.gt-tab-underline {
  position: absolute;
  left: 0;
  right: 0;
  bottom: -1px;
  height: 1px;
  background: #eaeaea;
}

/* when Fund tab is active (pure CSS fallback if you later toggle classes) */
#gt-tab-fund:checked + .gt-tab + .gt-tab-input + .gt-tab {
  border: 1px solid #000;
  border-bottom-color: #fff;
  border-radius: 4px 4px 0 0;
  font-weight: 700;
  color: #000;
}
#gt-tab-fund:checked ~ .gt-tab-underline {
  background: #eaeaea;
}

/* Form */
.gt-form {
  margin-top: 32px;
  display: flex;
  flex-direction: column;
  gap: 32px;
}
.gt-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 32px;
}
.gt-label {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.gt-label > .gt-input,
.gt-label > .gt-textarea,
.gt-phone,
.gt-select {
  width: 100%;
  background: #fff;
  border: 1px solid #d5d7da;
  border-radius: 8px;
  box-shadow: 0 1px 2px rgba(10, 13, 18, 0.05);
}
.gt-input,
.gt-select {
  height: 44px;
  padding: 12px 16px;
  font: 400 16px/24px Inter;
  color: #181d27;
}
.gt-textarea {
  padding: 10px 14px;
  font: 400 16px/24px Inter;
  resize: vertical;
}
.gt-input::placeholder,
.gt-textarea::placeholder {
  color: #717680;
}

/* Phone combo */
.gt-phone {
  display: flex;
  overflow: hidden;
}
.gt-select {
  width: auto;
  min-width: 92px;
  border-right: 0;
  border-radius: 8px 0 0 8px;
}
.gt-phone-input {
  border-left: 0;
  flex: 1;
  border-radius: 0 8px 8px 0;
}

/* Checkbox */
.gt-check {
  display: flex;
  align-items: center;
  gap: 12px;
  color: #535862;
}
.gt-check input[type="checkbox"] {
  appearance: none;
  width: 18px;
  height: 18px;
  border: 1px solid #d5d7da;
  border-radius: 6px;
  background: #fff;
  display: inline-block;
  position: relative;
}
.gt-check input[type="checkbox"]:checked {
  background: #7f56d9;
  border-color: #7f56d9;
}
.gt-check input[type="checkbox"]:checked::after {
  content: "";
  position: absolute;
  left: 5px;
  top: 2px;
  width: 5px;
  height: 10px;
  border: 2px solid #fff;
  border-top: 0;
  border-left: 0;
  transform: rotate(45deg);
}



/* Error state — subtle & matches comp */
.gt-label.is-error .gt-input,
.gt-label.is-error .gt-textarea,
.gt-label.is-error .gt-select,
.gt-label.is-error .gt-phone {
  border-color: #e11d48; /* subtle red */
  box-shadow: 0 0 0 3px rgba(225, 29, 72, 0.08);
}
.gt-error {
  margin-top: 6px;
  font: 400 12px/16px Inter;
  color: #c0173c;
}

/* Responsive */
@media (max-width: 1024px) {
  .gt-wrap {
    grid-template-columns: 1fr;
  }
  .gt-pane {
    max-width: 560px;
  }
  .gt-row {
    grid-template-columns: 1fr;
    gap: 24px;
  }
}
/* ===== Tabs: Investor / Fund Raising ===== */
.gt-tabs {
  position: relative;
  display: flex; /* one row */
  align-items: flex-end;
  gap: 0;
  width: 100%;
  border-bottom: 1px solid #e9eaeb;
  margin-top: 8px;
}

/* hide the radios – they still toggle :checked */
.gt-tab-input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

/* tab look */
.gt-tab {
  flex: 1 1 0; /* equal width */
  text-align: center;
  padding: 12px 16px;
  font:
    600 16px/20px Inter,
    system-ui,
    -apple-system,
    Segoe UI,
    Roboto,
    Arial,
    sans-serif;
  color: #6b7280; /* inactive text */
  background: #fff;
  cursor: pointer;
  user-select: none;
  border: 1px solid transparent; /* so height doesn’t jump */
  border-bottom: 0;
  border-radius: 8px 8px 0 0;
}

/* active state comes from the radio right before each label */
#gt-tab-investor:checked + .gt-tab {
  color: #0f172a;
  border-color: #d1d5db; /* outline like the mock */
  background: #fff;
}
#gt-tab-fund:checked + .gt-tab {
  color: #0f172a;
  border-color: #d1d5db;
  background: #fff;
}

/* underline slider (thin black line under the active tab) */
.gt-tab-underline {
  position: absolute;
  left: 0;
  bottom: -1px; /* sits on the bottom border */
  width: 50%;
  height: 2px;
  background: #111827;
  transform: translateX(0); /* Investor by default */
  transition: transform 0.25s ease;
  pointer-events: none;
}

/* move underline when Fund Raising is checked */
#gt-tab-fund:checked ~ .gt-tab-underline {
  transform: translateX(100%);
}
#gt-tab-investor:checked ~ .gt-tab-underline {
  transform: translateX(0);
}

/* small viewport: keep tabs readable */
@media (max-width: 520px) {
  .gt-tab {
    padding: 10px 12px;
    font-weight: 600;
    font-size: 15px;
  }
}
/* ===== gap between tabs and form ===== */
.gt-form {
  margin-top: 40px; /* spacing between tabs and first input */
  display: flex;
  flex-direction: column;
  gap: 24px; /* uniform spacing between stacked elements */
}

/* tidy up rows */
.gt-form .gt-row {
  display: flex;
  gap: 32px; /* space between first and last name fields */
}

.gt-form .gt-label {
  flex: 1;
  display: flex;
  flex-direction: column;
  font:
    500 14px/20px Inter,
    system-ui;
  color: #414651;
  gap: 6px;
}
:root {
  --ink-900: #181d27;
  --ink-700: #414651;
  --ink-600: #535862;
  --ink-500: #717680;
  --line: #eaeaea;
  --field: #d5d7da;
  --brand: #7f56d9;
  --brand-600: #6941c6;
  --bg: #fff;
}

/* Layout */
body {
  margin: 0;
  background: #fff;
  font-family:
    Inter,
    system-ui,
    -apple-system,
    Segoe UI,
    Roboto,
    Arial,
    sans-serif;
  color: var(--ink-900);
}
.wrap {
  padding: 32px;
  display: flex;
  gap: 64px;
  align-items: center;
  justify-content: center;
}
.hero {
  flex: 1 1 0;
  position: relative;
  align-self: stretch;
}
.hero img {
  width: 576px;
  height: 800px;
  object-fit: cover;
  border-radius: 20px;
  display: block;
}
.pane {
  flex: 1 1 0;
  align-self: stretch;
  display: flex;
  align-items: center;
  justify-content: center;
}
.card {
  width: 480px;
  display: flex;
  flex-direction: column;
  gap: 48px;
}

/* Header */
.title {
  font-size: 36px;
  line-height: 44px;
  font-weight: 600;
  color: var(--ink-900);
  margin: 0;
}
.sub {
  font-size: 20px;
  line-height: 30px;
  color: var(--ink-600);
  margin: 0;
}

/* Tabs */
.tabs {
  position: relative;
  display: flex;
  gap: 0;
  width: 100%;
  border-bottom: 1px solid var(--line);
}
.tab-input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}
.tab {
  flex: 1 1 0;
  text-align: center;
  padding: 12px 16px;
  font-size: 16px;
  line-height: 20px;
  font-weight: 500;
  color: rgba(0, 0, 0, 0.7);
  cursor: pointer;
  user-select: none;
}
/* Active tab pill (left border + subtle outline like figma) */
.tab--send {
  border: 1px solid transparent;
  border-bottom: none;
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
}
.tab--meet {
  border: 1px solid transparent;
  border-bottom: none;
  border-top-right-radius: 4px;
}
/* underline */
.tabs::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -1px;
  height: 1px;
  background: var(--line);
}
/* Active visuals */
#tab-send:checked + .tab--send {
  font-weight: 700;
  color: #000;
  background: #fff;
  border-color: #000;
}
#tab-meet:checked ~ .tab--meet {
  font-weight: 700;
  color: #000;
}

/* Content area spacing below tabs */
.section {
  display: flex;
  flex-direction: column;
  gap: 32px;
  margin-top: 16px;
}

/* Form rows */
.row {
  display: flex;
  gap: 32px;
}
.row > .field {
  flex: 1 1 0;
}

.label {
  display: block;
  font-size: 14px;
  line-height: 20px;
  font-weight: 500;
  color: var(--ink-700);
  margin-bottom: 6px;
}
.input,
.textarea,
.select,
.phone-box {
  width: 100%;
  background: #fff;
  border: 1px solid var(--field);
  border-radius: 8px;
  box-shadow: 0 1px 2px rgba(10, 13, 18, 0.05);
  font-size: 16px;
  line-height: 24px;
  color: var(--ink-900);
  padding: 12px 16px;
}
.input::placeholder,
.textarea::placeholder {
  color: var(--ink-500);
}
.textarea {
  min-height: 140px;
  resize: vertical;
  padding: 10px 14px;
}

/* Phone composite */
.phone-box {
  display: flex;
  gap: 0;
  padding: 0;
  overflow: hidden;
}
.select {
  border: none;
  border-right: 1px solid var(--field);
  border-radius: 8px 0 0 8px;
  padding: 12px 12px 12px 16px;
  width: 120px;
  flex: 0 0 120px;
  appearance: none;
  background: #fff;
  background-image:
    linear-gradient(45deg, transparent 50%, var(--ink-500) 50%),
    linear-gradient(135deg, var(--ink-500) 50%, transparent 50%);
  background-position:
    calc(100% - 18px) calc(50% - 3px),
    calc(100% - 12px) calc(50% - 3px);
  background-size:
    6px 6px,
    6px 6px;
  background-repeat: no-repeat;
}
.tel {
  border: none;
  flex: 1 1 auto;
  padding: 12px 16px;
  min-width: 0;
}

/* Checkbox + text */
.check {
  display: flex;
  gap: 12px;
  align-items: center;
}
.check input[type="checkbox"] {
  width: 20px;
  height: 20px;
  border: 1px solid var(--field);
  border-radius: 6px;
  accent-color: var(--brand);
}
.check span {
  color: var(--ink-600);
  font-size: 16px;
  line-height: 24px;
}
.check a {
  color: var(--ink-600);
  text-decoration: underline;
}
/* Validation (native) tweaks */
.input:invalid,
.textarea:invalid,
.tel:invalid {
  border-color: #ef4444;
}
.input:focus,
.textarea:focus,
.select:focus,
.tel:focus {
  outline: 2px solid var(--brand-600);
  outline-offset: 0;
  border-color: var(--brand-600);
}

/* Tab content switch */
.pane-form,
.pane-meet {
  display: none;
}
#tab-send:checked ~ .tab--send ~ .tab--meet ~ .section .pane-form {
  display: block;
}
#tab-meet:checked ~ .tab--send ~ .tab--meet ~ .section .pane-meet {
  display: block;
}

/* Responsive */
@media (max-width: 1080px) {
  .wrap {
    flex-direction: column;
    gap: 32px;
  }
  .hero img {
    width: 100%;
    height: auto;
  }
  .card {
    width: min(560px, 100%);
  }
}

/* ===== Get in touch page (schedule-message.html) ===== */
:root {
  --gt-bg: #ffffff;
  --gt-text: #181d27;
  --gt-muted: #535862;
  --gt-border: #eaeaea;
  --gt-input: #d5d7da;
  --gt-shadow: 0 1px 2px rgba(10, 13, 18, 0.05);
  --gt-primary: #7f56d9;
  --gt-primary-ink: #fff;
}
.gt-page {
  padding: 32px;
}
.gt-wrap {
  max-width: 1100px;
  margin: 0 auto;
  display: grid;
  gap: 64px;
  grid-template-columns: 1fr 1fr;
  align-items: center;
}
.gt-media {
  margin: 0;
  border-radius: 20px;
  overflow: hidden;
  background: #f6f7f9;
  box-shadow: var(--gt-shadow);
}
.gt-media img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.gt-form-col {
  max-width: 480px;
  margin-left: auto;
  margin-right: 0;
}
.gt-head {
  margin-bottom: 24px;
}
.gt-h1 {
  margin: 0 0 8px;
  font:
    600 36px/44px Inter,
    system-ui,
    sans-serif;
  color: var(--gt-text);
}
.gt-sub {
  margin: 0;
  color: var(--gt-muted);
  font:
    400 20px/30px Inter,
    system-ui,
    sans-serif;
}

/* tabs (visual only, left active) */
.gt-tabs {
  display: flex;
  gap: 0;
  border-bottom: 1px solid var(--gt-border);
  margin: 8px 0 24px;
}
.gt-tab {
  padding: 12px 16px;
  background: #fff;
  border: 1px solid transparent;
  border-radius: 4px 4px 0 0;
  font: 600 16px/20px Inter;
  color: rgba(0, 0, 0, 0.7);
}
.gt-tab.is-active {
  border-color: #000;
  border-bottom-color: #fff;
  color: #000;
}

/* form controls */
.gt-form {
  display: grid;
  gap: 24px;
}
.gt-grid-2 {
  display: grid;
  gap: 32px;
  grid-template-columns: 1fr 1fr;
}
.gt-label {
  display: block;
  color: #414651;
  font: 500 14px/20px Inter;
}
.gt-input,
.gt-textarea,
.gt-select {
  margin-top: 6px;
  width: 100%;
  background: #fff;
  border-radius: 8px;
  border: 1px solid var(--gt-input);
  box-shadow: var(--gt-shadow);
  padding: 12px 16px;
  font: 400 16px/24px Inter;
  color: #1a1a1a;
}
.gt-textarea {
  min-height: 140px;
  resize: vertical;
}
.gt-phone {
  display: flex;
  gap: 0;
  align-items: stretch;
  border-radius: 8px;
  overflow: hidden;
  border: 1px solid var(--gt-input);
  box-shadow: var(--gt-shadow);
}
.gt-select {
  border: 0;
  border-right: 1px solid var(--gt-input);
  padding-right: 12px;
  padding-left: 16px;
  width: auto;
  min-width: 88px;
}
.gt-input--phone {
  border: 0;
  border-radius: 0;
  padding-left: 16px;
}

/* checkbox */
.gt-check {
  display: flex;
  align-items: center;
  gap: 12px;
  color: #535862;
  font: 400 16px/24px Inter;
}
.gt-check input {
  width: 20px;
  height: 20px;
  border: 1px solid var(--gt-input);
  border-radius: 6px;
}
.gt-link {
  text-decoration: underline;
  color: #535862;
}


/* responsive */
@media (max-width: 1024px) {
  .gt-wrap {
    gap: 40px;
  }
}
@media (max-width: 900px) {
  .gt-wrap {
    grid-template-columns: 1fr;
    gap: 24px;
  }
  .gt-form-col {
    max-width: 100%;
  }
  .gt-grid-2 {
    grid-template-columns: 1fr;
    gap: 16px;
  }
}
/* ============== Layout/typography (same as before, trimmed) */
.sch { --ink-900:#181d27; --ink-600:#535862; --line:#EAEAEA; --brand:#7F56D9; --brand-600:#6941C6; }
.sch-page{padding:72px 16px 40px}
.sch-hero img{width:576px;height:800px;object-fit:cover;border-radius:20px;background:#e9ebf3;box-shadow:0 12px 0 0 #C7D7FF inset}
.sch-title{font-weight:800;font-size:32px;line-height:1.1;margin:0 0 4px;color:var(--ink-900)}
.sch-sub{color:var(--ink-600);margin:0 0 16px}
.sch-tabs{border-bottom:1px solid var(--line)}
.sch-tab-input{position:absolute;opacity:0;pointer-events:none}
.sch-tab{display:inline-flex;align-items:center;justify-content:center;padding:10px 16px;margin-right:12px;background:#fff;color:rgba(0,0,0,.85);border:1px solid var(--line);border-bottom:none;border-top-left-radius:6px;border-top-right-radius:6px;font-weight:600}
#sch-send:checked + .sch-tab--send{outline:1px solid #000;outline-offset:-1px}
#sch-meet:checked + .sch-tab--meet{outline:1px solid #000;outline-offset:-1px}
.sch-section{background:#fff;border:1px solid var(--line);border-top:none;border-radius:0 10px 10px 10px}



.dm-bar{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}
.dm-month{font-weight:700}
.dm-nav{width:36px;height:36px;border-radius:999px;border:1px solid #e5e5e5;background:#fff}
.dm-week{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;color:#1A1A1A}
.dm-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:6px}
.dm-day{height:44px;border-radius:999px;border:1px solid transparent;background:#fff}
.dm-day.is-can:hover{border-color:#0069FF;background:rgba(0,105,255,.08)}
.dm-day.is-picked{border-color:#0069FF}
.dm-times{margin-top:12px}
.dm-timegrid{display:flex;flex-wrap:wrap;gap:8px}
.dm-chip{padding:8px 12px;border:1px solid #e5e5e5;border-radius:999px;background:#fff}
.dm-chip.is-picked{border-color:#0069FF}

.dm-form{display:grid;gap:12px;margin-top:8px}
.dm-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.dm-field{display:grid;gap:6px}
.dm-field--full{grid-column:1/-1}

/* Calendly wrapper */
.sch-cal-embed{min-height:820px;border:1px solid rgba(26,26,26,.1);border-radius:16px;background:#fff;overflow:hidden}

@media (max-width:980px){
  .sch-wrap{grid-template-columns:1fr;gap:24px}
  .sch-hero img{width:100%;height:auto}
  .dm-row{grid-template-columns:1fr}
  .sch-btn{width:100%}
}
/* ---- Robust panel toggling: driven by body classes, not fragile :checked ~ combinators ---- */
.sch-panel{display:none}
body.tab-send  #sch-panel-send{display:block}
body.tab-meet  #sch-panel-meet{display:grid; gap:20px}

/* Active tab outline via body class (keeps your visual) */
body.tab-send  label[for="sch-send"]{outline:1px solid #000; outline-offset:-1px;}
body.tab-meet  label[for="sch-meet"]{outline:1px solid #000; outline-offset:-1px;}

/* Hero only on Send Message */
body.tab-meet .sch-hero{display:none;}

/* Ensure the card area isn't collapsing */
.sch-section{min-height:320px}
/* Put the form on a column-width (≈520–560px) like Figma */
#sch-panel-send { max-width:560px; }

/* Headings spacing/size (already close; tighten slightly) */
.sch-title { font-size:40px; line-height:1.1; margin-bottom:6px; }
.sch-sub { font-size:15px; color:#667085; margin-bottom:16px; }

/* Tabs look and spacing */
.sch-tabs { margin-top:8px; border-bottom:1px solid #E9EAEB; }
.sch-tab { 
  height:42px; padding:0 16px; 
  border:1px solid #E9EAEB; border-bottom:none; border-radius:8px 8px 0 0;
  background:#fff; font-weight:600; font-size:14px;
}
body.tab-send  label[for="sch-send"],
body.tab-meet  label[for="sch-meet"] { outline:1px solid #000; outline-offset:-1px; }

/* Form grid + fields */
.sch-row{ display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-bottom:12px; }
.sch-field{ display:block; margin-bottom:12px; }
.sch-label{ display:block; margin:0 0 6px; font-size:12px; font-weight:600; color:#667085; }

/* Inputs: height, radius, neutral border, generous padding */
.sch-input,.sch-textarea,.sch-select,.sch-tel{
  height:44px; padding:10px 14px; border-radius:10px; 
  border:1px solid #D0D5DD; background:#fff; color:#101828;
  box-shadow:none; outline:none;
}
.sch-textarea{ height:auto; min-height:140px; line-height:1.4; }
.sch-input::placeholder,.sch-tel::placeholder,.sch-textarea::placeholder{ color:#98A2B3; }

/* Focus style (brand ring), but KEEP borders neutral otherwise */
.sch-input:focus,.sch-textarea:focus,.sch-select:focus,.sch-tel:focus{
  border-color:#7F56D9;
  box-shadow:0 0 0 3px color-mix(in srgb,#7F56D9 18%, transparent);
}
/* Kill browser “invalid red” */
.sch input:invalid,.sch textarea:invalid,.sch select:invalid{ border-color:#D0D5DD; box-shadow:none; }

/* Phone row layout */
.sch-phone-box{ display:grid; grid-template-columns:120px 1fr; gap:8px; }

/* Checkbox row */
.sch-check{ 
  display:grid; grid-template-columns:18px 1fr; align-items:start; gap:10px; 
  color:#667085; margin:4px 0 16px; font-size:14px;
}
.sch-check a{ color:#7F56D9; text-decoration:underline; }

/* Primary CTA — full width like Figma */
.sch-btn{ 
  display:inline-flex; align-items:center; justify-content:center; 
  padding:12px 16px; border-radius:10px; border:1px solid #7F56D9; 
  background:#7F56D9; color:#fff; font-weight:700; 
}
.sch-btn--primary{ width:100%; height:44px; font-size:14px; }
.sch-btn:hover{ background:#6941C6; border-color:#6941C6; }

/* Calendly wrapper (meeting tab) */
#sch-panel-meet{ gap:20px; }
.sch-meetcard{ border:1px solid rgba(26,26,26,.1); border-radius:16px; padding:24px; background:#fff; max-width:560px; }
.sch-cal-embed{ min-height:820px; border:1px solid rgba(26,26,26,.1); border-radius:16px; overflow:hidden; background:#fff; }

/* Ensure panel never looks “collapsed” while loading */
.sch-section{ min-height:320px; }

/* Responsive polish */
@media (max-width:980px){
  .sch-wrap{ grid-template-columns:1fr; gap:28px; }
  .sch-hero img{ width:100%; height:auto; }
  .sch-row{ grid-template-columns:1fr; }
  .sch-phone-box{ grid-template-columns:1fr; }
  #sch-panel-send,.sch-meetcard{ max-width:100%; }
}
.sch-wrap{
  /* 576 (hero) + 56 gap + 576 (form) = 1208px */
  max-width: 1208px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 576px 576px;   /* <-- equal columns */
  gap: 56px;
  align-items: start;
  justify-content: center;               /* center the pair */
}
.sch-pane{ max-width:576px; width:576px; }
.sch-section{ width:100%; } /* card fills the 576px column */
/* ===== Layout to match Figma ===== */
.tg-schedule{
  max-width: 1208px;             /* 576 + 56 + 576 */
  margin: 48px auto;
  padding: 0 24px;
  display: grid;
  grid-template-columns: 576px 576px;
  gap: 56px;
  align-items: start;
  justify-content: center;
}
.tg-visual img{
  width: 576px; height: 800px;
  border-radius: 20px; object-fit: cover; display: block;
}

/* Panels + tabs */
.tg-top-tabs{ display:flex; gap:8px; margin: 8px 0 0; }
.tg-top-tab{ padding:10px 14px; border:1px solid #EAEAEA; border-bottom:none; border-radius:6px 6px 0 0; background:#fff; font:600 14px/20px Inter; color:#000000b3; }
.tg-top-tab.is-active{ outline:1px solid #000; outline-offset:-1px; }
.tg-tab{ border:1px solid #EAEAEA; border-radius:0 8px 8px 8px; background:#fff; padding:20px; }
.tg-tab[hidden]{ display:none!important; } .tg-tab.is-visible{ display:block; }

/* Form → exact card width */
.tg-form{ max-width:576px; }
.tg-row{ display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.tg-field{ margin-bottom:12px; }
.tg-field>span{ display:block; margin-bottom:6px; font:500 12px/16px Inter; color:#6B7280; }
.tg-field input, .tg-field textarea, .tg-field select{
  width:100%; box-sizing:border-box; padding:12px 14px; border:1px solid #D5D7DA; border-radius:8px; background:#fff;
  font:400 16px/24px Inter; color:#111; box-shadow:0 1px 2px rgba(10,13,18,.05);
}
.tg-field textarea{ min-height:144px; resize:vertical; }
.tg-phone .tg-phone-wrap{ display:grid; grid-template-columns: 88px 1fr; gap:8px; }
.tg-consent{ display:flex; gap:10px; align-items:center; color:#535862; font:400 14px/20px Inter; }
.tg-btn{ border:none; border-radius:8px; padding:12px 16px; cursor:pointer; }
.tg-primary{ width:100%; background:#7F56D9; color:#fff; font:600 16px/24px Inter; box-shadow:0 1px 2px rgba(10,13,18,.05); }
.tg-secondary{ background:#F5F7FA; color:#111; }

/* Calendly inline shell (looks like Figma card) */
.tg-cal-card{ max-width:576px; border:1px solid rgba(26,26,26,.10); border-radius:16.8px; background:#fff; overflow:hidden; padding:0; }
#cal-slot{ min-height:740px; } /* lets Calendly breathe */

/* Hide hero only after time pick (and optionally expand layout) */
.hide-hero .tg-visual{ display:none; }
.hide-hero .tg-schedule{ grid-template-columns: 1fr; gap: 0; }

@media (max-width: 980px){
  .tg-schedule{ grid-template-columns:1fr; gap:24px; }
  .tg-visual img, .tg-form, .tg-cal-card{ width:100%; max-width:100%; }
}
/* ===== Figma layout: equal columns, centered ===== */
.tg-schedule{
  max-width: 1208px;              /* 576 + 56 + 576 */
  margin: 48px auto;
  padding: 0 24px;
  display: grid;
  grid-template-columns: 576px 576px;
  gap: 56px;
  align-items: start;
  justify-content: center;
}
.tg-visual img{
  width: 576px; height: 800px; object-fit: cover; border-radius: 20px; display: block;
}

/* Tabs + panels */
.tg-top-tabs{ display:flex; gap:8px; margin: 8px 0 0; }
.tg-top-tab{
  padding:10px 14px; border:1px solid #EAEAEA; border-bottom:none;
  border-radius:6px 6px 0 0; background:#fff; font:600 14px/20px Inter;
  color:#000000b3;
}
.tg-top-tab.is-active{ outline:1px solid #000; outline-offset:-1px; }
.tg-tab{ border:1px solid #EAEAEA; border-radius:0 8px 8px 8px; background:#fff; padding:20px; }
.tg-tab[hidden]{ display:none !important; } .tg-tab.is-visible{ display:block; }

/* Form widths to match hero */
.tg-form{ max-width:576px; }
.tg-row{ display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.tg-field{ margin-bottom:12px; }
.tg-field>span{ display:block; margin-bottom:6px; font:500 12px/16px Inter; color:#6B7280; }
.tg-field input, .tg-field textarea, .tg-field select{
  width:100%; box-sizing:border-box; padding:12px 14px; border:1px solid #D5D7DA;
  border-radius:8px; background:#fff; font:400 16px/24px Inter; color:#111;
  box-shadow:0 1px 2px rgba(10,13,18,.05);
}
.tg-field textarea{ min-height:144px; resize:vertical; }
.tg-phone .tg-phone-wrap{ display:grid; grid-template-columns: 88px 1fr; gap:8px; }
.tg-consent{ display:flex; gap:10px; align-items:center; color:#535862; font:400 14px/20px Inter; }
.tg-btn{ border:none; border-radius:8px; padding:12px 16px; cursor:pointer; }
.tg-primary{ width:100%; background:#7F56D9; color:#fff; font:600 16px/24px Inter; box-shadow:0 1px 2px rgba(10,13,18,.05); }
.tg-secondary{ background:#F5F7FA; color:#111; }

/* Calendly card shell */
.tg-cal-card{
  max-width:576px; border:1px solid rgba(26,26,26,.10);
  border-radius:16.8px; background:#fff; overflow:visible; padding:0;
}
#cal-slot{ min-height: 860px; }       /* container height */
.calendly-inline-widget{ height: 860px; } /* prevent inner scrollbars */

/* ===== Focus state after slot pick: hide hero + tabs; center single column ===== */
.hide-flow .tg-visual{ display:none; }
.hide-flow .tg-top-tabs{ display:none; }
.hide-flow .tg-schedule{
  grid-template-columns: 576px;   /* stay at Figma width */
  justify-content: center;
  gap: 0;
}

@media (max-width: 980px){
  .tg-schedule{ grid-template-columns:1fr; gap:24px; }
  .tg-visual img, .tg-form, .tg-cal-card{ width:100%; max-width:100%; }
  .calendly-inline-widget{ height: 900px; }
}
/* ---- Tab rail must equal card/hero width ---- */
.tg-top-tabs{
  width:576px;                   /* same as hero & card */
  display:flex; gap:0;           /* no visual gap between segments */
  margin: 8px 0 0;
}
.tg-top-tab{
  flex:1 0 0;
  text-align:center;
  padding:12px 14px;
  font:600 14px/20px Inter;
  color:#111;
  background:#fff;
  border:1px solid #EAEAEA;
  border-bottom:none;            /* Seamless join with the card below */
  border-radius:8px 8px 0 0;
}
.tg-top-tab + .tg-top-tab{ border-left:none; } /* kill double border in the middle */

/* Active state = dark pill (per Figma) but keep the border join clean */
.tg-top-tab.is-active{
  background:#0F1222;            /* your dark header color */
  color:#fff;
  border-color:#0F1222;          /* so the active tab’s edges align with the card outline */
}

/* The card starts immediately under the rail; pull it up 1px to remove seam */
.tg-tab{
  border:1px solid #EAEAEA;
  border-radius:0 8px 8px 8px;
  background:#fff;
  padding:20px;
  margin-top:-1px;               /* stitch to tab rail */
}

/* Calendly card uses same stitching */
#tab-meeting .tg-cal-card{
  max-width:576px;
  border:1px solid rgba(26,26,26,.10);
  border-radius:0 16.8px 16.8px 16.8px; /* flat top under the tabs */
  background:#fff;
  margin-top:-1px;               /* stitch to tab rail */
  overflow:visible; padding:0;
}

/* Height so the widget never adds an inner scrollbar */
#cal-slot{ min-height: 900px; }
.calendly-inline-widget{ height: 900px; }

/* When hero/tabs should disappear after choosing a time */
.hide-flow .tg-visual{ display:none; }
.hide-flow .tg-top-tabs{ display:none; }
.hide-flow .tg-schedule{ grid-template-columns:576px; justify-content:center; gap:0; }

@media (max-width: 980px){
  .tg-top-tabs{ width:100%; }
  #cal-slot, .calendly-inline-widget{ height: 900px; }
}
.tg-pane {
    max-width: 610px;
    /* margin-left: auto; */
}

.tg-tab {
    border: 0 solid #EAEAEA;
    border-radius: 0 8px 8px 8px;
    background: #fff;
    padding: 20px;
    margin-top: 2px;
}
#cal-slot {
    min-height: 550px;
}
/* ===== Schedule focus mode & Calendly sizing (append) ===== */

/* When a user picks a date/time in Calendly we apply body.hide-flow.
   Hide the left hero and the top tab rail, let the right pane center. */
body.hide-flow .tg-visual,
body.hide-flow .tg-top-tabs {
  display: none !important;
}

body.hide-flow .tg-pane {
  max-width: 720px;
  margin: 0 auto;
}

/* Make sure Calendly always renders full width and tall enough */
#cal-slot {
  min-height: 640px;
}
#cal-slot iframe {
  width: 100% !important;
  min-height: 640px !important;
  border: 0;
  display: block;
}

/* Minor guard so the hero stays visible in Meeting tab until a slot is picked */
body.tab-meet .tg-visual {
  display: block;
}
/* ===== FINAL SCHEDULE LAYOUT PATCH (scoped, non-destructive) ===== */

/* hard stop any horizontal scroll coming from embeds */
html, body { overflow-x: hidden; }

/* grid: 576 image column + 560 right pane exactly like the comp */
.sch-scope.tg-schedule {
  max-width: 1280px;
  margin: 72px auto 0;      /* no accidental bottom gaps */
  padding: 0 32px;
  display: grid;
  grid-template-columns: minmax(520px, 576px) 560px;
  gap: 64px;
  align-items: start;
}

/* left hero */
.sch-scope .tg-visual {
  position: relative;
  aspect-ratio: 3/5;
  max-height: 720px;
  border-radius: 28px;
  overflow: hidden;
  background: #0a0f1a;
}
.sch-scope .tg-visual > img {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover; object-position: center;
  display: block;
}

/* right pane stack (stay left-aligned, no auto-centering) */
.sch-scope .tg-pane { max-width: 560px; margin-left: auto; }
.sch-scope .tg-copy h1 {
  margin: 0 0 8px;
  font: 800 40px/1.15 Inter, system-ui;
}
.sch-scope .tg-copy p {
  margin: 0 0 18px; color: #6b7280;
}

/* tab rail: tight, under the heading, full width of the 560px pane */
.sch-scope .tg-top-tabs {
  display: flex;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  overflow: hidden;
  margin: 8px 0 22px;
  background: #fff;
}
.sch-scope .tg-top-tab {
  flex: 1; padding: 10px 16px;
  background: #fff; color: #111;
  font: 700 14px/1 Inter, system-ui;
  cursor: pointer;
}
.sch-scope .tg-top-tab.is-active { background:#0b1220; color:#fff; }

/* form: 480px content width like the mock */
.sch-scope #tab-send .tg-form { display: grid; gap: 16px; max-width: 480px; }
.sch-scope #tab-send .tg-row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.sch-scope #tab-send .tg-field span { display:block; margin:0 0 6px; font:600 13px/1 Inter; }
.sch-scope #tab-send .tg-field input,
.sch-scope #tab-send .tg-field textarea {
  border: 1px solid #e5e7eb; border-radius: 8px; padding: 10px 12px;
}
.sch-scope #tab-send .tg-field textarea { min-height: 120px; resize: vertical; }
.sch-scope .tg-consent { display:flex; gap:10px; align-items:flex-start; color:#6b7280; font:400 13px/1.5 Inter; }
.sch-scope .tg-btn.tg-primary { width: 100%; height: 48px; }

/* Calendly inline widget: reliable size and full width */
#cal-slot { min-height: 640px; }
#cal-slot iframe {
  width: 100% !important;
  min-height: 640px !important;
  display: block; border: 0; border-radius: 16px;
}

/* responsive: stack cleanly, no weird margins */
@media (max-width: 992px) {
  .sch-scope.tg-schedule { grid-template-columns: 1fr; gap: 24px; margin: 40px auto 0; padding: 0 16px; }
  .sch-scope .tg-pane { max-width: 100%; margin: 0; }
  .sch-scope #tab-send .tg-form { max-width: 100%; }
  .sch-scope #tab-send .tg-row { grid-template-columns: 1fr; }
  #cal-slot, #cal-slot iframe { min-height: 560px !important; }
}
/* ===== Full-bleed focus view for Calendly after slot pick ===== */
/* JS already adds: body.hide-flow  (on calendly.date_and_time_selected) */

body.hide-flow .tg-visual,
body.hide-flow .tg-top-tabs {
  display: none !important;             /* hide hero + tabs */
}

body.hide-flow .sch-scope.tg-schedule {
  /* break out of the 1280px grid and go edge-to-edge */
  display: block !important;
  max-width: none !important;
  width: 100vw !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.hide-flow .tg-pane {
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* full-bleed Calendly */
body.hide-flow #cal-slot {
  width: 100vw;
  min-height: 100vh;                    /* fill the viewport */
}

body.hide-flow #cal-slot iframe {
  width: 100vw !important;
  min-height: 100vh !important;
  border: 0;
  border-radius: 0 !important;          /* no rounded corners in focus mode */
  display: block;
}

/* safety: never allow horizontal scrollbars */
html, body { overflow-x: hidden; }
/* ========= Wide Calendly focus layout ========= */
.cal-focus .tg-schedule {
  /* kill the two-column grid while booking */
  display: block !important;
  grid-template-columns: 1fr !important;
}

.cal-focus .tg-visual { display: none !important; }

.cal-focus .tg-pane {
  max-width: 1200px !important;
  width: 100% !important;
  margin: 0 auto !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.cal-focus .tg-cal-card {
  max-width: 1200px !important;
  width: 100% !important;
  margin: 0 auto !important;
  padding: 0 !important;
  box-shadow: none !important;
  border: 0 !important;
}

.cal-focus #cal-slot {
  width: 100% !important;
  min-height: calc(100vh - var(--tg-header, 80px) - var(--tg-footer, 280px)) !important;
  margin: 0 auto !important;
  padding-bottom: 24px !important; /* small buffer above footer */
  box-sizing: border-box !important;
}

.cal-focus #cal-slot > div,
.cal-focus #cal-slot iframe {
  width: 100% !important;
  height: 100% !important;
  display: block !important;
  border: 0 !important;
}