/* ==========================================================================
   TERMS & CONDITIONS PAGE: white, cream and gold (matches the rest of the site)
   ========================================================================== */
.terms-main {
  position: relative;
  background: linear-gradient(180deg, #FFFFFF 0%, #FAF6EF 40%, #F5EDE0 100%);
  padding: 140px 0 110px;
  overflow: clip;
}
.terms-main::before {
  content: ''; position: absolute; width: 640px; height: 640px; right: -230px; top: -170px; border-radius: 50%;
  background: radial-gradient(circle, rgba(201,155,92,.22), transparent 66%); pointer-events: none;
}
.terms-main::after {
  content: ''; position: absolute; width: 520px; height: 520px; left: -240px; bottom: 120px; border-radius: 50%;
  background: radial-gradient(circle, rgba(201,155,92,.12), transparent 68%); pointer-events: none;
}
.terms-main .container { position: relative; z-index: 2; }

/* Hero */
.terms-hero { text-align: center; max-width: 820px; margin: 0 auto 64px; }
.terms-eyebrow {
  display: inline-flex; align-items: center; gap: 10px;
  font: 600 11px/1 'Inter', sans-serif; letter-spacing: .22em; text-transform: uppercase; color: var(--accent);
  margin-bottom: 18px;
}
.terms-eyebrow::before, .terms-eyebrow::after { content: ''; width: 26px; height: 1px; background: var(--accent); opacity: .6; }
.terms-title {
  font-family: 'Outfit', 'Inter', sans-serif;
  font-size: clamp(40px, 6.2vw, 74px); font-weight: 800; line-height: 1.04; letter-spacing: -.035em;
  color: var(--dark); margin-bottom: 18px;
}
.terms-title em { font-style: italic; color: var(--accent); }
.terms-sub { font-size: 16px; line-height: 1.65; color: var(--grey-1); max-width: 600px; margin: 0 auto 26px; }
.terms-meta { display: flex; justify-content: center; flex-wrap: wrap; gap: 10px; }
.terms-meta span {
  display: inline-flex; align-items: center; gap: 8px;
  font: 600 12px/1 'Inter', sans-serif; color: var(--dark-2);
  background: #fff; border: 1px solid var(--border); border-radius: 999px; padding: 9px 15px;
  box-shadow: 0 4px 14px rgba(23,19,14,.04);
}
.terms-meta i { width: 6px; height: 6px; border-radius: 50%; background: var(--accent); }

/* Layout */
.terms-layout { display: grid; grid-template-columns: 290px minmax(0, 1fr); gap: 40px; align-items: start; }

/* Sticky contents */
.terms-toc {
  position: sticky; top: 104px;
  background: #fff; border: 1px solid var(--border); border-radius: 22px; padding: 22px 16px 16px;
  box-shadow: 0 18px 48px rgba(23,19,14,.06);
}
.terms-toc-label {
  font: 700 11px/1 'Inter', sans-serif; letter-spacing: .16em; text-transform: uppercase; color: var(--grey-2);
  padding: 0 10px 14px;
}
.terms-toc ol { list-style: none; display: flex; flex-direction: column; gap: 2px; }
.terms-toc a {
  display: flex; align-items: center; gap: 12px; padding: 10px 10px; border-radius: 12px;
  font: 500 13.5px/1.35 'Inter', sans-serif; color: var(--grey-1); text-decoration: none;
  transition: background .25s ease, color .25s ease;
}
.terms-toc a b {
  flex: 0 0 auto; display: grid; place-items: center; width: 26px; height: 26px; border-radius: 8px;
  font: 700 11.5px/1 'Outfit', sans-serif; color: var(--dark-2); background: var(--cream);
  transition: background .25s ease, color .25s ease;
}
.terms-toc a:hover { background: var(--bg-mix); color: var(--dark); }
.terms-toc a.is-active { background: var(--dark); color: #FAF8F5; }
.terms-toc a.is-active b { background: var(--accent); color: #17130E; }
.terms-toc-help {
  margin: 14px 4px 0; padding: 14px; border-radius: 14px; background: var(--bg-mix); border: 1px solid var(--border);
  font: 400 12.5px/1.55 'Inter', sans-serif; color: var(--grey-1);
}
.terms-toc-help a { display: inline; padding: 0; color: var(--dark); font-weight: 600; background: none; text-decoration: underline; text-decoration-color: var(--accent); text-underline-offset: 3px; }

/* Sections */
.terms-list { display: flex; flex-direction: column; gap: 22px; min-width: 0; }
.t-card {
  position: relative; scroll-margin-top: 104px;
  background: #fff; border: 1px solid var(--border); border-radius: 26px; padding: 36px 40px 38px;
  box-shadow: 0 14px 40px rgba(23,19,14,.045);
  transition: transform .35s ease, box-shadow .35s ease, border-color .35s ease;
  overflow: hidden;
}
.t-card::before {
  content: ''; position: absolute; left: 0; top: 36px; bottom: 36px; width: 3px; border-radius: 0 3px 3px 0;
  background: linear-gradient(180deg, var(--accent), rgba(201,155,92,0)); opacity: .0; transition: opacity .35s ease;
}
.t-card:hover { transform: translateY(-3px); border-color: rgba(201,155,92,.4); box-shadow: 0 24px 60px rgba(23,19,14,.08); }
.t-card:hover::before { opacity: 1; }
.t-num {
  position: absolute; right: 30px; top: 14px;
  font: 800 92px/1 'Outfit', sans-serif; letter-spacing: -.04em; color: rgba(201,155,92,.13); pointer-events: none; user-select: none;
}
.t-head { display: flex; align-items: center; gap: 16px; margin-bottom: 18px; position: relative; }
.t-ic {
  flex: 0 0 auto; width: 50px; height: 50px; border-radius: 16px; display: grid; place-items: center;
  background: linear-gradient(145deg, #F5EDE0, #EEE2CE); color: #8a6531; border: 1px solid rgba(201,155,92,.3);
}
.t-ic svg { width: 23px; height: 23px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.t-kicker { font: 700 10.5px/1 'Inter', sans-serif; letter-spacing: .18em; text-transform: uppercase; color: var(--accent); margin-bottom: 7px; display: block; }
.t-title { font-family: 'Outfit', 'Inter', sans-serif; font-size: clamp(21px, 2.3vw, 27px); font-weight: 700; letter-spacing: -.02em; line-height: 1.2; color: var(--dark); }
.t-body { font: 400 15.5px/1.78 'Inter', sans-serif; color: rgba(23,19,14,.72); max-width: 70ch; position: relative; }
.t-body + .t-body { margin-top: 12px; }
.t-body strong { color: var(--dark); font-weight: 600; }

/* Key facts chips */
.t-facts { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 22px; }
.t-fact {
  display: inline-flex; align-items: center; gap: 10px; padding: 10px 16px 10px 12px; border-radius: 14px;
  background: var(--bg-mix); border: 1px solid var(--border); font: 600 13px/1.3 'Inter', sans-serif; color: var(--dark-2);
}
.t-fact svg { width: 16px; height: 16px; flex: 0 0 auto; fill: none; stroke: var(--accent); stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }

/* Big stat tiles */
.t-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 14px; margin-top: 24px; }
.t-stat {
  border-radius: 18px; padding: 20px 20px 18px; background: var(--dark); color: #FAF8F5; position: relative; overflow: hidden;
}
.t-stat::after {
  content: ''; position: absolute; width: 120px; height: 120px; right: -40px; top: -50px; border-radius: 50%;
  background: radial-gradient(circle, rgba(201,155,92,.35), transparent 70%);
}
.t-stat-v { display: block; font: 800 38px/1 'Outfit', sans-serif; letter-spacing: -.03em; color: var(--accent); margin-bottom: 8px; position: relative; }
.t-stat-v small { font-size: 15px; font-weight: 600; letter-spacing: 0; margin-left: 5px; color: #F5EDE0; }
.t-stat-l { font: 500 13px/1.45 'Inter', sans-serif; color: rgba(245,239,224,.72); position: relative; }

/* Payment sub-cards */
.t-sub { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin-top: 8px; }
.t-sub-item {
  border-radius: 20px; padding: 22px 20px; background: var(--bg-mix); border: 1px solid var(--border); position: relative;
  transition: border-color .3s ease, background .3s ease;
}
.t-sub-item:hover { background: #fff; border-color: rgba(201,155,92,.45); }
.t-sub-ic { width: 38px; height: 38px; border-radius: 12px; display: grid; place-items: center; background: #fff; border: 1px solid var(--border); color: #8a6531; margin-bottom: 14px; }
.t-sub-ic svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.t-sub-item h3 { font: 700 16px/1.3 'Outfit', sans-serif; color: var(--dark); margin-bottom: 8px; letter-spacing: -.01em; }
.t-sub-item p { font: 400 14px/1.65 'Inter', sans-serif; color: rgba(23,19,14,.68); }
.t-steps { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 14px; }
.t-steps span { font: 600 11px/1 'Inter', sans-serif; padding: 6px 10px; border-radius: 999px; background: #fff; border: 1px solid var(--border); color: var(--dark-2); }

/* Vendor chips */
.t-vendors { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 20px; }
.t-vendors span { font: 600 12.5px/1 'Inter', sans-serif; padding: 9px 14px; border-radius: 999px; background: var(--dark); color: #FAF8F5; }

/* Closing card */
.t-contact {
  margin-top: 6px; border-radius: 26px; padding: 34px 40px; background: var(--dark); color: #FAF8F5; position: relative; overflow: hidden;
  display: flex; align-items: center; justify-content: space-between; gap: 24px; flex-wrap: wrap;
}
.t-contact::before { content: ''; position: absolute; width: 360px; height: 360px; right: -90px; top: -150px; border-radius: 50%; background: radial-gradient(circle, rgba(201,155,92,.32), transparent 68%); }
.t-contact h3 { font: 700 24px/1.2 'Outfit', sans-serif; letter-spacing: -.02em; margin-bottom: 6px; position: relative; }
.t-contact p { font: 400 14.5px/1.6 'Inter', sans-serif; color: rgba(245,239,224,.7); position: relative; }
.t-contact-btns { display: flex; gap: 10px; flex-wrap: wrap; position: relative; }
.t-btn { display: inline-flex; align-items: center; gap: 8px; padding: 13px 22px; border-radius: 999px; font: 600 13.5px/1 'Inter', sans-serif; text-decoration: none; transition: transform .25s ease, background .25s ease; }
.t-btn:hover { transform: translateY(-2px); }
.t-btn-primary { background: var(--accent); color: #17130E; }
.t-btn-ghost { border: 1px solid rgba(245,239,224,.28); color: #FAF8F5; }
.t-btn-ghost:hover { background: rgba(245,239,224,.08); }

@media (max-width: 980px) {
  .terms-layout { grid-template-columns: 1fr; gap: 26px; }
  .terms-toc { position: relative; top: 0; }
  .terms-toc ol { display: grid; grid-template-columns: 1fr 1fr; }
  .terms-toc-help { display: none; }
  .t-sub { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .terms-main { padding: 108px 0 72px; }
  .terms-hero { margin-bottom: 40px; }
  .terms-toc ol { grid-template-columns: 1fr; }
  .t-card { padding: 26px 22px 28px; border-radius: 22px; }
  .t-num { font-size: 64px; right: 18px; top: 10px; }
  .t-ic { width: 44px; height: 44px; border-radius: 14px; }
  .t-body { font-size: 15px; }
  .t-contact { padding: 28px 22px; }
}
