/* ============================================================
   Cadora site v2 ("checkout-first" design, Oct 2026)
   Shared by index, pricing, programs, contact, enterprise and privacy.
   The design comps are desktop-only with inline styles, so the
   mobile layout below overrides them with !important.
   ============================================================ */
body { margin: 0; background: #F5EFE4; }
body.nav-locked { overflow: hidden; }
.cd-page a { color: #B8401A; }
.cd-page a:hover { color: #8E3013; }
.cd-page { min-height: 100vh; display: flex; flex-direction: column; background: #F5EFE4; color: #1C1A16; font-family: 'Hanken Grotesk', sans-serif; overflow-x: clip; }
.cd-page > section, .cd-page > header, .cd-page > footer, .cd-page > div { max-width: 1600px; width: 100%; margin: 0 auto; box-sizing: border-box; }
.cd-page > section[style*="background"], .cd-page > footer, .cd-page > div { max-width: none; }

/* ---- header ---- */
.cd-header { position: sticky; top: 0; z-index: 50; background: #F5EFE4; }
.cd-header .cd-nav a[aria-current="page"] { border-bottom: 2px solid #B8401A; padding-bottom: 4px; }
.cd-page .nav-toggle { display: none; width: 44px; height: 44px; border: 1px solid #1C1A16; border-radius: 999px; background: transparent; color: #1C1A16; align-items: center; justify-content: center; cursor: pointer; font-size: 20px; }
.mobile-nav { display: none; position: fixed; inset: 72px 0 0; z-index: 55; background: #F5EFE4; padding: 24px; flex-direction: column; gap: 4px; font-family: 'Hanken Grotesk', sans-serif; }
.mobile-nav.open { display: flex; }
.mobile-nav a { font-size: 20px; font-weight: 600; color: #1C1A16; padding: 16px 0; border-bottom: 1px solid #DCD2BF; text-decoration: none; }
.mobile-nav a.cd-mbtn { margin-top: 20px; border: 0; border-radius: 999px; background: #B8401A; color: #FFFFFF; text-align: center; }

/* ---- forms (Get the app pop-up, programs enquiry) ---- */
.cd-page input:focus-visible, .cd-page select:focus-visible, .cd-page textarea:focus-visible,
.cd-dialog input:focus-visible, .cd-dialog select:focus-visible, .cd-dialog textarea:focus-visible { outline: 2px solid #B8401A; outline-offset: 1px; }
.cd-form-msg { grid-column: 1 / -1; font-size: 15px; line-height: 1.55; }
.cd-form-msg[hidden] { display: none; }
.cd-form-msg.is-error { color: #B8401A; }
.cd-form-msg.is-sent { padding: 16px 18px; border-radius: 12px; background: #E4EFE3; color: #2F5A2C; }
.cd-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

/* ---- Get the app pop-up ---- */
.cd-dialog:focus { outline: none; }
.cd-dialog { width: 780px; max-width: calc(100vw - 32px); max-height: calc(100vh - 32px); box-sizing: border-box; padding: 0; border: 0; border-radius: 24px; background: #FBF8F2; color: #1C1A16; font-family: 'Hanken Grotesk', sans-serif; box-shadow: 0 40px 100px -30px rgba(0,0,0,0.5); overflow: auto; }
.cd-dialog::backdrop { background: rgba(28,26,22,0.55); backdrop-filter: blur(2px); }
.cd-dialog a { color: #B8401A; }
.cd-dialog button[data-close] { width: 40px; height: 40px; border-radius: 50%; border: 1px solid #CDBFA6; background: transparent; display: grid; place-items: center; color: #1C1A16; font-size: 22px; line-height: 1; flex-shrink: 0; cursor: pointer; padding: 0; }
@keyframes cd-pulse { 0%,100% { opacity: 1 } 50% { opacity: .35 } }
.cd-pulse { animation: cd-pulse 1.8s ease-in-out infinite; }
@media (prefers-reduced-motion: reduce) { .cd-pulse { animation: none; } }

/* ---- legal pages (privacy.html): document layout with a sticky table of contents ---- */
.legal { display: grid; grid-template-columns: 240px minmax(0, 1fr); gap: 64px; align-items: start; }
.legal-meta { display: flex; gap: 16px; flex-wrap: wrap; align-items: center; font-size: 15px; color: #6B6457; }
.legal-meta strong { color: #1C1A16; font-weight: 600; }
.legal-meta .dot { width: 4px; height: 4px; border-radius: 999px; background: #CDBFA6; }
.legal-toc { position: sticky; top: 112px; }
.legal-toc h5 { margin: 0 0 14px; font-family: 'IBM Plex Mono', monospace; font-size: 12px; font-weight: 500; letter-spacing: 0.1em; text-transform: uppercase; color: #6B6457; }
.legal-toc ol { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 2px; }
.cd-page .legal-toc a { display: block; font-size: 14px; line-height: 1.4; color: #4A453C; text-decoration: none; padding: 7px 12px; border-radius: 8px; border-left: 2px solid transparent; }
.cd-page .legal-toc a:hover { color: #1C1A16; background: #EDE5D6; }
.cd-page .legal-toc a.on { color: #B8401A; background: #F6E2D8; border-left-color: #B8401A; font-weight: 600; }
.legal-body { max-width: 760px; }
.cd-page .legal-body h2 { margin: 56px 0 0; font-family: Spectral, serif; font-size: 30px !important; line-height: 1.15; font-weight: 500; letter-spacing: -0.01em; color: #1C1A16; scroll-margin-top: 112px; }
.cd-page .legal-body h2:first-child { margin-top: 0; }
.cd-page .legal-body h3 { margin: 28px 0 0; font-size: 18px !important; font-weight: 700; color: #1C1A16; }
.legal-body p { margin: 14px 0 0; font-size: 17px; line-height: 1.65; color: #4A453C; }
.legal-body ul { margin: 16px 0 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.legal-body li { list-style: none; position: relative; padding-left: 28px; font-size: 16px; line-height: 1.6; color: #4A453C; }
.legal-body li::before { content: '\2014'; position: absolute; left: 0; color: #CDBFA6; }
.legal-body a { font-weight: 600; }
.legal-body strong { color: #1C1A16; font-weight: 600; }
.legal-body table { width: 100%; border-collapse: collapse; margin-top: 18px; }
.legal-body th { text-align: left; font-family: 'IBM Plex Mono', monospace; font-size: 11px; font-weight: 500; letter-spacing: 0.08em; text-transform: uppercase; color: #6B6457; padding: 0 16px 12px 0; border-bottom: 2px solid #1C1A16; }
.legal-body td { font-size: 15px; line-height: 1.55; color: #4A453C; padding: 14px 16px 14px 0; border-bottom: 1px solid #DCD2BF; vertical-align: top; }

/* ============ tablet & mobile ============ */
@media (max-width: 1100px) {
  .cd-page > section, .cd-page > header, .cd-page > footer { padding-left: 32px !important; padding-right: 32px !important; }
  .cd-page > section { flex-direction: column !important; align-items: stretch !important; gap: 48px !important; padding-top: 80px !important; padding-bottom: 80px !important; }
  .cd-page > section[style*="text-align: center"] { align-items: center !important; }
  .cd-page > section > div, .cd-page > section > form { width: auto !important; max-width: 100% !important; flex-shrink: 1 !important; }
  .cd-page > section > div[style*="justify-content: space-between"] { flex-direction: column !important; align-items: flex-start !important; gap: 24px !important; }
  .cd-page h1 { font-size: 52px !important; }
  .cd-page h2 { font-size: 40px !important; width: auto !important; }
  .cd-page h3 { font-size: 36px !important; }
  /* mock-up cards: let them shrink with the screen */
  .cd-page [style*="width: 520px"], .cd-page [style*="width: 540px"], .cd-page [style*="width: 560px"], .cd-page [style*="width: 580px"], .cd-page [style*="width: 600px"], .cd-page [style*="width: 640px"] { width: 100% !important; max-width: 600px; }
  .cd-page [style*="justify-content: center"] > [style*="position: relative; width: 520px"] { height: 460px; }
  .cd-header .cd-nav, .cd-header .cd-cta { display: none !important; }
  .cd-page .nav-toggle { display: inline-flex; }
  .cd-header { height: 72px !important; }
  .cd-page > footer { flex-direction: column !important; gap: 40px !important; }
  .cd-page > footer > div { flex-wrap: wrap; gap: 40px !important; }
  .cd-page .legal { grid-template-columns: 1fr; gap: 32px; }
  .cd-page .legal-toc { position: static; padding-bottom: 20px; border-bottom: 1px solid #DCD2BF; }
  .cd-page .legal-toc ol { flex-direction: row; flex-wrap: wrap; gap: 6px; }
  .cd-page .legal-toc a { border-left: 0; background: #EDE5D6; border-radius: 999px; padding: 6px 12px; font-size: 13px; }
}
@media (max-width: 760px) {
  .cd-page > section, .cd-page > header, .cd-page > footer { padding-left: 20px !important; padding-right: 20px !important; }
  .cd-page > section { padding-top: 64px !important; padding-bottom: 64px !important; }
  .cd-page h1 { font-size: 40px !important; }
  .cd-page h2 { font-size: 32px !important; }
  .cd-page h3 { font-size: 30px !important; }
  .cd-page .legal-body h2 { font-size: 26px !important; }
  .cd-page p[style*="font-size: 27px"] { font-size: 21px !important; }
  /* stack the multi-column grids; the small data grids inside mock-ups keep their columns */
  .cd-page [style*="grid-template-columns: repeat("]:not(.cd-keep):not([style*="repeat(7"]), .cd-page [style*="grid-template-columns: 1fr 1fr"] { grid-template-columns: 1fr !important; }
  .cd-page [style*="grid-column: span 2"] { grid-column: auto !important; }
  .cd-page [style*="padding: 44px"] { padding: 28px !important; }
  .cd-page [style*="flex-wrap: wrap"], .cd-page [style*="display: flex; gap: 12px"] { flex-wrap: wrap !important; }
  .cd-page [style*="flex-shrink: 0"][style*="width: 4"], .cd-page [style*="width: 900px"] { width: 100% !important; }
  .cd-page section [style*="display: flex; gap: 64px"], .cd-page section [style*="display: flex; gap: 96px"] { flex-direction: column !important; align-items: stretch !important; gap: 32px !important; }
  .cd-page [style*="padding: 56px"] { padding: 28px !important; }
  .cd-page [style*="grid-template-columns: 150px 1.4fr"] { grid-template-columns: 1fr !important; }
  .cd-page [style*="grid-template-columns: 150px 1.4fr"] > :nth-child(-n+4) { display: none !important; }
  /* illustrative recipient table: drop the address column on phones */
  .cd-page [style*="grid-template-columns: 1.3fr 1.6fr 1.2fr 1.3fr"] { grid-template-columns: 1.2fr 1fr 1fr !important; }
  .cd-page [style*="grid-template-columns: 1.3fr 1.6fr 1.2fr 1.3fr"] > :nth-child(4n+2) { display: none !important; }
  .cd-page [style*="grid-template-columns: 1.3fr 1.6fr 1.2fr 1.3fr"] > * { padding-left: 12px !important; padding-right: 8px !important; }
  .cd-page .cd-keep { font-size: 13px !important; }
  .cd-page .cd-keep > div { padding: 12px 10px !important; }
  .cd-page .stage { zoom: 0.8; align-self: center; }
  .cd-dialog > div { padding: 28px 22px 24px !important; }
  .cd-dialog h2 { font-size: 30px !important; }
  .cd-dialog [style*="grid-template-columns"] { grid-template-columns: 1fr !important; }
  .cd-dialog [style*="grid-column: span 2"] { grid-column: auto !important; }
}