/* Typography */
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600&family=Sora:wght@600&display=swap');

@font-face {
  font-family: 'CalvinoItalicVarTrial';
  src:
    url('../fonts/CalvinoItalicVarTrial.woff2') format('woff2'),
    url('../fonts/CalvinoItalicVarTrial.woff') format('woff');
  font-style: italic;
  font-weight: 100 900;
  font-display: swap;
}

/* Hide common theme chrome on auth pages */
body.coffeebrk-auth .site-header,
body.coffeebrk-auth header,
body.coffeebrk-auth .site-footer,
body.coffeebrk-auth footer,
body.coffeebrk-auth .page-title,
body.coffeebrk-auth .entry-title,
body.coffeebrk-auth .elementor-location-header,
body.coffeebrk-auth .elementor-location-footer { display:none !important; }

/* Page base + tokens */
body.coffeebrk-auth {
  /* Palette chosen to closely match provided screenshots (dark espresso + warm cream). */
  --cbk-left-1: #0b0a06;
  --cbk-left-2: #1a140a;
  --cbk-left-3: #2a1f0e;
  --cbk-cream: #f7ecd9;
  --cbk-cream-2: #f3e3c8;
  --cbk-left-gradient:
    radial-gradient(800px 600px at 20% 0%, rgba(168,116,60,0.12), rgba(0,0,0,0) 55%),
    linear-gradient(180deg, var(--cbk-left-2) 0%, var(--cbk-left-1) 55%, var(--cbk-left-3) 100%);

  --cbk-text: #f3eadb;
  --cbk-text-muted: rgba(243,234,219,0.62);
  --cbk-text-dim: rgba(243,234,219,0.42);
  --cbk-ink: #1a1208;
  --cbk-ink-muted: rgba(26,18,8,0.65);

  --cbk-btn: #4f3519;
  --cbk-btn-hover: #61401d;
  --cbk-btn-disabled: rgba(79,53,25,0.45);

  --cbk-input-bg: rgba(0,0,0,0.25);
  --cbk-input-border: rgba(243,234,219,0.16);
  --cbk-focus: rgba(168,116,60,0.28);

  --cbk-radius: 12px;
  --cbk-space-1: 8px;
  --cbk-space-2: 12px;
  --cbk-space-3: 16px;
  --cbk-space-4: 24px;
  --cbk-space-5: 32px;
  --cbk-space-6: 48px;

  background: var(--cbk-left-1) !important;
  color: var(--cbk-text);
  font-family: Poppins, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
}

/* Neutralize common theme containers so the split layout can go edge-to-edge */
body.coffeebrk-auth,
body.coffeebrk-auth #page,
body.coffeebrk-auth .site,
body.coffeebrk-auth .site-content,
body.coffeebrk-auth .content-area,
body.coffeebrk-auth .entry-content,
body.coffeebrk-auth .content,
body.coffeebrk-auth main {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Split layout shell */
.cbk-shell {
  display: grid;
  grid-template-columns: 3fr 2fr;
  min-height: 100vh;
  width: 100%;
}

.cbk-shell__left {
  position: relative;
  background: var(--cbk-left-gradient);
  padding: 56px 72px;
}

.cbk-shell__right {
  background: linear-gradient(180deg, var(--cbk-cream) 0%, var(--cbk-cream-2) 100%);
  padding: 56px 72px;
  color: var(--cbk-ink);
}

.cbk-left {
  height: 100%;
  display: flex;
  flex-direction: column;
}

.cbk-logo {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 24px;
  margin-bottom: 40px;
}

.cbk-logo img {
  height: 48px;
  width: auto;
  display: block;
}

.cbk-left-content {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

@media (min-width: 1025px) {
  .cbk-shell__left {
    padding-left: 120px;
  }
  .cbk-logo {
    width: auto;
    max-width: none;
    margin-left: 0;
    margin-right: 0;
    margin-top: 48px;
    margin-bottom: 48px;
  }
  .cbk-logo img {
    height: 52px;
  }
  .cbk-left-content {
    align-items: flex-start;
  }
}

.cbk-content {
  max-width: 520px;
  width: 100%;
}

.cbk-kicker {
  font-family: Poppins, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  font-weight: 300;
  font-size: 16px;
  line-height: 1;
  color: var(--cbk-text-dim);
  margin-bottom: 10px;
}

/* Titles */
.cbk-title,
.cbk-hello-title {
  font-family: CalvinoItalicVarTrial, Georgia, 'Times New Roman', serif;
  font-weight: 625;
  font-style: italic;
  font-size: 40px;
  line-height: 56px;
  letter-spacing: 0;
  text-align: left;
  color: var(--cbk-text);
  margin: 0 0 var(--cbk-space-3);
}

.cbk-hello-sub {
  text-align: left;
  color: var(--cbk-text-muted);
  max-width: 520px;
  margin: 0 0 var(--cbk-space-5);
  line-height: 1;
  font-family: Poppins, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  font-weight: 300;
  font-size: 16px;
}

/* Forms */
.cbk-form { margin-top: var(--cbk-space-4); }
.cbk-fields { display: flex; flex-direction: column; gap: var(--cbk-space-3); }

.cbk-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.cbk-label {
  font-family: Poppins, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  font-weight: 300;
  font-size: 12px;
  line-height: 1;
  color: var(--cbk-text-dim);
}

/* Inputs */
.cbk-input {
  width: 100%;
  padding: 12px 14px;
  border-radius: var(--cbk-radius);
  background: var(--cbk-input-bg);
  border: 1px solid var(--cbk-input-border);
  color: var(--cbk-text);
  outline: none;
}

.cbk-input::placeholder { color: rgba(243,234,219,0.35); }

.cbk-input:focus {
  border-color: rgba(168,116,60,0.55);
  box-shadow: 0 0 0 3px var(--cbk-focus);
}

/* Buttons */
.cbk-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--cbk-btn) !important;
  color: #fff !important;
  border: none;
  border-radius: var(--cbk-radius);
  padding: 16px 18px;
  cursor: pointer;
  width: 100%;
  margin-top: var(--cbk-space-5);
  text-decoration: none;
  border-bottom: 0;
  text-align: center;
  font-family: Sora, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  font-weight: 600;
  font-size: 20px;
  line-height: 1;
}

.cbk-btn,
.cbk-btn:visited,
.cbk-btn:hover,
.cbk-btn:focus {
  text-decoration: none !important;
  border-bottom: 0 !important;
  color: #fff !important;
}

.cbk-btn:hover,
.cbk-btn:focus,
.cbk-btn:active {
  background: var(--cbk-btn) !important;
  color: #fff !important;
}
.cbk-btn:disabled { background: var(--cbk-btn-disabled) !important; cursor: not-allowed; }

.cbk-help {
  margin-top: var(--cbk-space-3);
  color: var(--cbk-text-dim);
  font-size: 12px;
  line-height: 1;
}

.cbk-link,
.cbk-link:visited,
.cbk-link:hover,
.cbk-link:active,
.cbk-link:focus {
  color: var(--cbk-text) !important;
  text-decoration: none !important;
  border-bottom: 1px solid rgba(243,234,219,0.22);
}
.cbk-link:hover { border-bottom-color: rgba(243,234,219,0.55); }

.cbk-or {
  margin: var(--cbk-space-5) 0 var(--cbk-space-3);
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 12px;
  color: var(--cbk-text-dim);
  font-size: 12px;
}

.cbk-or:before,
.cbk-or:after {
  content: '';
  height: 1px;
  background: rgba(243,234,219,0.18);
}

.cbk-google {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  width: 100%;
  background: rgba(255,255,255,0.96);
  color: #222;
  border-radius: var(--cbk-radius);
  padding: 12px 14px;
  text-align: center;
  border: 1px solid rgba(0,0,0,0.08);
  cursor: pointer;
  font-family: Poppins, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 1;
}

.cbk-google,
.cbk-google:visited,
.cbk-google:hover,
.cbk-google:focus,
.cbk-google:active {
  color: #222 !important;
  text-decoration: none !important;
  border-bottom: 0 !important;
}

.cbk-google:hover,
.cbk-google:focus {
  background: rgba(255,255,255,0.90);
  border-color: rgba(0,0,0,0.16);
}

.cbk-google-icon {
  width: 18px;
  height: 18px;
  display: inline-block;
  background: url('../img/Google%20logo.svg') no-repeat center / contain;
  border-radius: 0;
}

.cbk-center { text-align: center; }

/* Pills (aspire step) */
.cbk-pills { display:flex; flex-wrap:wrap; gap: 12px; justify-content:flex-start; margin-top: var(--cbk-space-4); }
.cbk-pill { display:inline-flex; align-items:center; gap:8px; padding:10px 14px; border:1px solid rgba(243,234,219,0.18); border-radius:999px; color: var(--cbk-text); cursor:pointer; background: rgba(0,0,0,0.18); user-select:none; transition:background .2s,border-color .2s,transform .02s ease; }
.cbk-pill:hover { border-color: rgba(243,234,219,0.35); }
.cbk-pill:active { transform:translateY(1px); }
.cbk-pill.active { background: rgba(79,53,25,0.24); border-color: rgba(168,116,60,0.55); }
.cbk-pill input { position:absolute; opacity:0; pointer-events:none; appearance:none; -webkit-appearance:none; -moz-appearance:none; }
.cbk-pill-label { font-family:Poppins,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif; font-weight:400; font-size:16px; line-height:1; }
.cbk-pill-icon { width:18px; height:18px; display:inline-flex; align-items:center; justify-content:center; }

/* Right panel (static testimonial block) */
.cbk-right {
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--cbk-space-5);
}

.cbk-right-hero {
  width: 100%;
  max-width: 520px;
}

.cbk-right-hero img {
  width: auto;
  max-width: 360px;
  height: auto;
  display: block;
  margin: 0 auto;
}

.cbk-right-person {
  text-align: left;
  margin-top: 10px;
  color: var(--cbk-ink-muted);
}

/* Hide for now (requested) */
.cbk-right-person { display: none; }

.cbk-right-person strong {
  display: block;
  font-weight: 600;
  color: var(--cbk-ink);
}

.cbk-right-title {
  font-family: Poppins, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  font-weight: 600;
  font-size: 36px;
  line-height: 1.1;
  margin: 0;
  text-align: center;
  width: 100%;
  max-width: 520px;
}

.cbk-right-quote {
  font-family: Poppins, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  font-weight: 300;
  font-size: 14px;
  line-height: 1.4;
  color: var(--cbk-ink-muted);
  max-width: 520px;
  text-align: center;
  margin: 0;
  width: 100%;
}

/* Desktop: buttons should be left-aligned, not full-width */
@media (min-width: 1025px) {
  .cbk-btn {
    width: auto;
    min-width: 180px;
    padding-left: 28px;
    padding-right: 28px;
  }
  .cbk-google {
    width: auto;
    min-width: 320px;
    justify-content: flex-start;
  }
}

/* Responsive: stack panels below 1024px */
@media (max-width: 1024px) {
  .cbk-shell { grid-template-columns: 1fr; }
  .cbk-shell__left, .cbk-shell__right { padding: 40px 24px; }
  .cbk-logo { margin-bottom: 40px; }
  .cbk-logo { margin-top: 0; }
  .cbk-logo img { height: 40px; }
  .cbk-left-content { justify-content: flex-start; align-items: flex-start; }
  .cbk-right { justify-content: flex-start; }
}