/* Dukes Tenant Fees — tf2 island pass, 20 August 2026.
   Page-scoped by body class; the shared shell and every other route are untouched.
   Full rewrite: the previous tfx deep-pass layer in this file was orphaned (the
   page never linked it) and the marquee hero it replaced is retired again.
   Palette family: DUKES_DESIGN_AUTHORITY §3 — this page owns the vault-green pairing.
   Colour jobs: vault green = decisive bands (hero, the £0 band, contact bookend),
   the colour of the strong-room where deposits sit protected;
   oxblood = actions and kickers only; gold = the seal and dark-surface accents;
   sage/stone/powder/blush fields = the reading chapters. */

.page--tenant-fees {
  /* ink */
  --tf2-ink: #171a20;
  --tf2-ink-soft: #4f555b;
  /* vault green — dark anchor: hero, £0 band, contact bookend */
  --tf2-vault: #123430;
  --tf2-vault-soft: #1b473f;
  /* premium white — plates only, one token site rule */
  --tf2-cream: #fbf8f2;
  /* warm paper — figures, protection and FAQ islands */
  --tf2-paper: #f2ede4;
  /* reading fields */
  --tf2-field-sage: #e3ede6;
  --tf2-field-stone: #efe5d2;
  --tf2-field-powder: #dfeaec;
  --tf2-field-blush: #f2e2de;
  /* oxblood — actions and kickers. Nothing else. */
  --tf2-oxblood: #7b2430;
  --tf2-oxblood-dark: #5e1924;
  /* gold — the seal and identity accents on dark surfaces */
  --tf2-gold: #c5a66a;
  /* rules */
  --tf2-rule: rgb(23 26 32 / 18%);
  --tf2-rule-dark: rgb(251 248 242 / 22%);
  /* geometry */
  --tf2-shell: min(94vw, 1640px);
  --tf2-shell-hero: min(96vw, 1780px);
  --tf2-shell-notes: min(90vw, 1160px);
  --tf2-radius-island: 30px;
  --tf2-radius-plate: 22px;
  --tf2-radius-small: 14px;
  --tf2-tap: 48px;
  --tf2-ease: cubic-bezier(0.22, 1, 0.36, 1);
  /* the site island ground */
  background: linear-gradient(180deg, #dce8e5 0%, #d9e5e5 30%, #d9e5e5 100%);
  color: var(--tf2-ink);
}

.page--tenant-fees ::selection {
  background: var(--tf2-gold);
  color: var(--tf2-vault);
}

.page--tenant-fees :focus-visible {
  outline: 3px solid #f0bd77;
  outline-offset: 4px;
}

.page--tenant-fees .main {
  overflow: clip;
  padding-bottom: clamp(2.5rem, 5vw, 4.5rem);
}

.page--tenant-fees .main h1,
.page--tenant-fees .main h2,
.page--tenant-fees .main h3 {
  text-wrap: balance;
}

/* ------------------------------------------------------------------ */
/* Breadcrumb — sits on the ground, not in a bar                       */
/* ------------------------------------------------------------------ */

.page--tenant-fees .crumbs {
  margin: 0;
  max-width: none;
  padding: 0.85rem 4vw 0.35rem;
  background: transparent;
  border: 0;
}

.page--tenant-fees .crumbs__list {
  width: var(--tf2-shell-hero);
  margin-inline: auto;
}

.page--tenant-fees .crumbs__link,
.page--tenant-fees .crumbs__current,
.page--tenant-fees .crumbs__item::after {
  color: var(--tf2-ink-soft);
}

.page--tenant-fees .crumbs__link:hover { color: var(--tf2-ink); }

/* ------------------------------------------------------------------ */
/* Shared devices: kicker, buttons, text links, section heads          */
/* ------------------------------------------------------------------ */

.page--tenant-fees .tf2-kicker {
  margin: 0 0 0.65rem;
  font-size: 0.74rem;
  font-weight: 800;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--tf2-oxblood);
}

.page--tenant-fees .tf2-kicker--dark { color: var(--tf2-gold); }

.page--tenant-fees .tf2-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  min-height: var(--tf2-tap);
  padding: 0.85rem 1.7rem;
  border: 0;
  border-radius: 10px;
  background: var(--tf2-oxblood);
  color: var(--tf2-cream);
  font-weight: 800;
  font-size: 0.95rem;
  text-decoration: none;
  cursor: pointer;
  transition: transform 180ms var(--tf2-ease), background-color 180ms var(--tf2-ease);
}

.page--tenant-fees .tf2-button:active { transform: translateY(1px); }

@media (hover: hover) {
  .page--tenant-fees .tf2-button:hover {
    background: var(--tf2-oxblood-dark);
    transform: translateY(-2px);
  }
}

.page--tenant-fees .tf2-text-link {
  display: inline-flex;
  align-items: center;
  min-height: var(--tf2-tap);
  font-weight: 700;
  color: var(--tf2-ink);
  text-decoration: underline;
  text-underline-offset: 0.24em;
  text-decoration-thickness: 1px;
}

.page--tenant-fees .tf2-text-link--dark { color: var(--tf2-cream); }

/* centred section head lockup — nothing floats above a void */
.page--tenant-fees .tf2-head {
  position: relative;
  z-index: 1;
  max-width: 64ch;
  margin: 0 auto clamp(1.4rem, 2.4vw, 2.2rem);
  text-align: center;
}

.page--tenant-fees .tf2-head h2 {
  margin: 0 0 0.55rem;
  font-family: Gloock, Georgia, serif;
  font-weight: 400;
  font-size: clamp(1.9rem, 2.9vw, 2.9rem);
  line-height: 1.12;
  letter-spacing: -0.02em;
}

.page--tenant-fees .tf2-head p:not(.tf2-kicker) {
  margin: 0 auto;
  max-width: 46ch;
  color: var(--tf2-ink-soft);
  line-height: 1.65;
}

.page--tenant-fees .tf2-head--dark h2 { color: var(--tf2-cream); }
.page--tenant-fees .tf2-head--dark p:not(.tf2-kicker) { color: rgb(251 248 242 / 82%); }

/* the GOV.UK official-source chip */
.page--tenant-fees .tf2-official {
  display: inline-flex;
  align-items: center;
  gap: 0.55rem;
  min-height: var(--tf2-tap);
  padding: 0.5rem 1rem;
  border: 1px solid var(--tf2-rule);
  border-radius: 999px;
  background: var(--tf2-cream);
  color: var(--tf2-ink);
  font-size: 0.9rem;
  font-weight: 700;
  text-decoration: none;
  transition: border-color 160ms var(--tf2-ease);
}

.page--tenant-fees .tf2-official::before {
  content: "GOV.UK";
  padding: 0.18rem 0.45rem;
  border-radius: 6px;
  background: #0b0c0c;
  color: #fff;
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.06em;
}

@media (hover: hover) {
  .page--tenant-fees .tf2-official:hover { border-color: var(--tf2-ink); }
}

/* ------------------------------------------------------------------ */
/* Left side-panel navigation — Design Authority §4.5                  */
/* Pill sticky under the measured header seam; LEFT drawer.            */
/* ------------------------------------------------------------------ */

.page--tenant-fees .tf2-nav {
  position: sticky;
  top: var(--tf-nav-seam, 65px);
  z-index: 40;
  height: 0;
  display: flex;
  justify-content: center;
  transition: top 240ms ease;
}

.page--tenant-fees .site-head.head--hidden ~ .main .tf2-nav { top: 0; }

.page--tenant-fees .tf2-nav__pill {
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
  width: max-content;
  min-height: var(--tf2-tap);
  padding: 0.55rem 1.3rem;
  border-radius: 999px;
  list-style: none;
  cursor: pointer;
  background: var(--tf2-vault);
  color: var(--tf2-cream);
  border: 1px solid rgb(251 248 242 / 14%);
  box-shadow: 0 14px 34px -18px rgb(13 29 49 / 55%);
  font-size: 0.88rem;
  transform: translateY(0.75rem);
}

.page--tenant-fees .tf2-nav__pill::-webkit-details-marker { display: none; }

.page--tenant-fees .tf2-nav__pill::after {
  content: "+";
  font-weight: 700;
  color: var(--tf2-gold);
}

.page--tenant-fees .tf2-nav[open] .tf2-nav__pill::after { content: "\2212"; }

.page--tenant-fees .tf2-nav__label {
  color: rgb(251 248 242 / 76%);
  font-weight: 600;
}

.page--tenant-fees .tf2-nav__current {
  color: var(--tf2-gold);
  font-weight: 800;
}

.page--tenant-fees .tf2-nav__panel {
  position: fixed;
  left: 0;
  top: 0;
  bottom: 0;
  width: min(19rem, 86vw);
  overflow-y: auto;
  padding: 1.1rem 1rem 1.4rem;
  background: var(--tf2-cream);
  border-right: 1px solid var(--tf2-rule);
  border-radius: 0 16px 16px 0;
  box-shadow: 0 30px 70px -30px rgb(13 29 49 / 45%);
}

.page--tenant-fees .tf2-nav:not([open]) .tf2-nav__panel { display: none; }

.page--tenant-fees .tf2-nav__scope {
  margin: 0 0 0.85rem;
  padding-bottom: 0.7rem;
  border-bottom: 1px solid var(--tf2-rule);
  font-size: 0.875rem;
  color: var(--tf2-ink-soft);
}

.page--tenant-fees .tf2-nav__group {
  margin: 1rem 0 0.25rem;
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.13em;
  text-transform: uppercase;
  color: var(--tf2-oxblood);
}

.page--tenant-fees .tf2-nav__link {
  display: grid;
  grid-template-columns: 2rem 1fr;
  align-items: center;
  gap: 0.35rem;
  min-height: 40px;
  padding: 0.3rem 0.55rem;
  border-radius: 10px;
  color: var(--tf2-ink);
  text-decoration: none;
  transition: background-color 160ms var(--tf2-ease);
}

.page--tenant-fees .tf2-nav__name {
  font-size: max(0.88rem, 14px);
  line-height: 1.3;
}

.page--tenant-fees .tf2-nav__index {
  font-family: Gloock, Georgia, serif;
  font-size: 0.92rem;
  color: var(--tf2-ink-soft);
}

.page--tenant-fees .tf2-nav__link[aria-current="true"] {
  background: rgb(197 166 106 / 22%);
}

@media (hover: hover) {
  .page--tenant-fees .tf2-nav__link:hover {
    background: var(--tf2-vault);
    color: var(--tf2-cream);
  }
  .page--tenant-fees .tf2-nav__link:hover .tf2-nav__index { color: var(--tf2-gold); }
}

/* ------------------------------------------------------------------ */
/* Islands — every band floats on the ground                           */
/* ------------------------------------------------------------------ */

.page--tenant-fees .tf2-hero,
.page--tenant-fees .tf2-figures,
.page--tenant-fees .tf2-calc,
.page--tenant-fees .tf2-chapter,
.page--tenant-fees .tf2-zero,
.page--tenant-fees .tf2-protect,
.page--tenant-fees .tf2-downloads,
.page--tenant-fees .tf2-sources,
.page--tenant-fees .tf2-next,
.page--tenant-fees .tf2-faq,
.page--tenant-fees .tf2-contact {
  position: relative;
  width: var(--tf2-shell);
  margin: clamp(1.4rem, 2.6vw, 2.4rem) auto 0;
  border-radius: var(--tf2-radius-island);
  box-shadow: 0 30px 70px -50px rgb(13 29 49 / 40%);
}

/* anchor targets clear the sticky pill */
.page--tenant-fees [id] { scroll-margin-top: calc(var(--tf-nav-seam, 65px) + 4.5rem); }

/* the three-layer nest frame — band field → frame → plates.
   Warm paper, not white: cream is rationed to the surfaces that earn it. */
.page--tenant-fees .tf2-frame {
  padding: clamp(20px, 2.6vw, 38px);
  border-radius: var(--tf2-radius-plate);
  background: var(--tf2-paper);
  border: 1px solid var(--tf2-rule);
  box-shadow: 0 30px 70px -50px rgb(13 29 49 / 40%);
}

/* ------------------------------------------------------------------ */
/* Crown placeholder — Design Authority §4.1                           */
/* ------------------------------------------------------------------ */

.page--tenant-fees .tf2-slot {
  position: relative;
  display: block;
  margin: 0;
  aspect-ratio: var(--slot-ar, 3 / 2);
  border-radius: var(--tf2-radius-plate);
  background:
    linear-gradient(160deg, rgb(18 52 48 / 12%) 0%, rgb(18 52 48 / 22%) 100%),
    var(--tf2-paper);
  border: 1px solid var(--tf2-rule);
  overflow: hidden;
}

.page--tenant-fees .tf2-slot__crown {
  position: absolute;
  inset: 0;
  margin: auto;
  width: clamp(90px, 34%, 168px);
  height: auto;
  opacity: 0.13;
}

.page--tenant-fees .tf2-slot__chip {
  position: absolute;
  left: 0.9rem;
  bottom: 0.9rem;
  max-width: calc(100% - 5.4rem);
  padding: 0.45rem 0.8rem;
  border-radius: 999px;
  background: var(--tf2-vault);
  color: var(--tf2-cream);
  font-size: 0.875rem;
  font-weight: 600;
  line-height: 1.35;
}

.page--tenant-fees .tf2-slot__ratio {
  position: absolute;
  right: 0.9rem;
  bottom: 0.9rem;
  padding: 0.45rem 0.7rem;
  border-radius: 999px;
  background: rgb(23 26 32 / 8%);
  color: var(--tf2-ink-soft);
  font-size: 0.875rem;
  font-weight: 800;
}

/* ------------------------------------------------------------------ */
/* Hero — vault-green island, the specimen schedule beside the copy    */
/* ------------------------------------------------------------------ */

.page--tenant-fees .tf2-hero {
  width: var(--tf2-shell-hero);
  margin-top: clamp(0.8rem, 1.6vw, 1.4rem);
  padding: clamp(2.2rem, 4.5vw, 4.2rem) clamp(1.4rem, 3.6vw, 3.6rem) clamp(1.6rem, 2.8vw, 2.4rem);
  border-radius: 30px 30px 84px 30px;
  background:
    radial-gradient(120% 130% at 88% -10%, rgb(27 71 63 / 85%) 0%, rgb(27 71 63 / 0%) 55%),
    var(--tf2-vault);
  color: var(--tf2-cream);
}

.page--tenant-fees .tf2-hero__inner {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(0, 0.92fr);
  gap: clamp(1.8rem, 3.4vw, 3.4rem);
  align-items: start;
}

.page--tenant-fees .tf2-hero__scope {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem 0.7rem;
  margin: 0 0 1.1rem;
  font-size: 0.82rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--tf2-gold);
}

.page--tenant-fees .tf2-hero__scope .tf2-dot { color: rgb(251 248 242 / 45%); }

.page--tenant-fees .tf2-hero h1 {
  margin: 0 0 0.7rem;
  font-family: Gloock, Georgia, serif;
  font-weight: 400;
  font-size: clamp(2.5rem, 3.8vw, 4.2rem);
  line-height: 1.02;
  letter-spacing: -0.025em;
  color: var(--tf2-cream);
}

.page--tenant-fees .tf2-hero__lede {
  margin: 0;
  max-width: 46ch;
  font-size: 1.02rem;
  line-height: 1.68;
  color: rgb(251 248 242 / 88%);
}

.page--tenant-fees .tf2-hero__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 1.1rem;
  margin-top: 1.6rem;
}

.page--tenant-fees .tf2-button--light {
  background: var(--tf2-cream);
  color: var(--tf2-vault);
}

@media (hover: hover) {
  .page--tenant-fees .tf2-button--light:hover {
    background: #fff;
    color: var(--tf2-vault);
  }
}

/* Device 1 — the specimen schedule: the whole law on one document plate */
.page--tenant-fees .tf2-schedule {
  position: relative;
  padding: clamp(1.2rem, 2vw, 1.8rem);
  border-radius: var(--tf2-radius-plate);
  background: var(--tf2-cream);
  color: var(--tf2-ink);
  box-shadow: 0 34px 80px -46px rgb(5 12 21 / 80%);
}

.page--tenant-fees .tf2-schedule__title {
  margin: 0;
  font-family: Gloock, Georgia, serif;
  font-size: 1.3rem;
}

.page--tenant-fees .tf2-schedule__sub {
  margin: 0.2rem 0 0.6rem;
  font-size: 0.82rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--tf2-ink-soft);
}

.page--tenant-fees .tf2-schedule ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.page--tenant-fees .tf2-schedule li {
  display: grid;
  grid-template-columns: minmax(8rem, 0.48fr) 1fr;
  gap: 0.4rem 0.9rem;
  align-items: baseline;
  padding: 0.62rem 0;
  border-bottom: 1px solid var(--tf2-rule);
}

.page--tenant-fees .tf2-schedule li:last-of-type { border-bottom: 0; }

.page--tenant-fees .tf2-schedule__item {
  font-family: Gloock, Georgia, serif;
  font-size: 1rem;
}

.page--tenant-fees .tf2-schedule__limit {
  font-size: 0.9rem;
  color: var(--tf2-ink-soft);
  line-height: 1.45;
}

.page--tenant-fees .tf2-schedule li.tf2-schedule__zero .tf2-schedule__limit {
  font-weight: 800;
  color: var(--tf2-oxblood);
}

.page--tenant-fees .tf2-schedule__note {
  margin: 0.8rem 0 0;
  font-size: 0.875rem;
  color: var(--tf2-ink-soft);
}

/* The seal device was removed on Aarav's verdict (20 Aug): no crown badge on
   the schedule plate. The page's crown moments are the placeholder watermarks
   only. Do not add a seal back. */

/* topic routes across the hero base */
.page--tenant-fees .tf2-hero__routes {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: clamp(0.7rem, 1.2vw, 1rem);
  margin-top: clamp(1.8rem, 3vw, 2.6rem);
  padding-top: clamp(1.1rem, 2vw, 1.6rem);
  border-top: 1px solid var(--tf2-rule-dark);
}

.page--tenant-fees .tf2-hero__routes a {
  display: grid;
  grid-template-columns: 1fr auto;
  grid-template-areas: "kicker arrow" "title arrow";
  align-items: center;
  gap: 0.1rem 0.7rem;
  min-height: var(--tf2-tap);
  padding: 0.85rem 1.05rem;
  border: 1px solid var(--tf2-rule-dark);
  border-radius: var(--tf2-radius-small);
  background: rgb(251 248 242 / 6%);
  color: var(--tf2-cream);
  text-decoration: none;
  transition: background-color 180ms var(--tf2-ease), transform 180ms var(--tf2-ease);
}

.page--tenant-fees .tf2-hero__routes a span:first-child {
  grid-area: kicker;
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--tf2-gold);
}

.page--tenant-fees .tf2-hero__routes strong {
  grid-area: title;
  font-family: Gloock, Georgia, serif;
  font-weight: 400;
  font-size: 1.06rem;
}

.page--tenant-fees .tf2-hero__routes .tf2-arrow {
  grid-area: arrow;
  font-weight: 700;
  color: var(--tf2-gold);
  transition: transform 180ms var(--tf2-ease);
}

@media (hover: hover) {
  .page--tenant-fees .tf2-hero__routes a:hover {
    background: rgb(251 248 242 / 12%);
    transform: translateY(-2px);
  }
  .page--tenant-fees .tf2-hero__routes a:hover .tf2-arrow { transform: translateX(4px); }
}

/* ------------------------------------------------------------------ */
/* Three figures — warm paper island, lions flank the centred head     */
/* ------------------------------------------------------------------ */

.page--tenant-fees .tf2-figures {
  padding: clamp(1.8rem, 3.4vw, 3.2rem) clamp(1.2rem, 3vw, 3rem);
  background: var(--tf2-paper);
  overflow: hidden;
}

.page--tenant-fees .tf2-lion {
  position: absolute;
  z-index: 0;
  top: clamp(1.5rem, 3vw, 3rem);
  width: clamp(9rem, 13vw, 14rem);
  aspect-ratio: 529 / 793;
  background: url("/assets/brand/dukes-lion-watermark-white.png") center / contain no-repeat;
  filter: brightness(0);
  opacity: 0.06;
  pointer-events: none;
}

.page--tenant-fees .tf2-lion--left { left: clamp(0.25rem, 1.5vw, 2rem); }
.page--tenant-fees .tf2-lion--right { right: clamp(0.25rem, 1.5vw, 2rem); transform: scaleX(-1); }

@media (max-width: 74.99em) {
  .page--tenant-fees .tf2-lion { display: none; }
}

.page--tenant-fees .tf2-figures__row {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(0.9rem, 1.6vw, 1.4rem);
}

.page--tenant-fees .tf2-figure {
  display: grid;
  grid-template-rows: auto auto 1fr auto;
  gap: 0.3rem;
  padding: clamp(1.2rem, 2vw, 1.7rem);
  border-radius: var(--tf2-radius-plate);
  border: 1px solid var(--tf2-rule);
  color: var(--tf2-ink);
  text-decoration: none;
  transition: transform 180ms var(--tf2-ease), box-shadow 180ms var(--tf2-ease);
}

/* each figure wears the tint of the chapter it links to — no white row */
.page--tenant-fees .tf2-figure--sage { background: #eaf2ec; }
.page--tenant-fees .tf2-figure--powder { background: #e7eff1; }
.page--tenant-fees .tf2-figure--stone { background: #f3e7cf; }

.page--tenant-fees .tf2-figure__value {
  font-family: Gloock, Georgia, serif;
  font-size: clamp(2.1rem, 3vw, 3.1rem);
  line-height: 1;
  color: var(--tf2-vault);
}

.page--tenant-fees .tf2-figure strong {
  margin-top: 0.35rem;
  font-size: 1.02rem;
  font-weight: 800;
}

.page--tenant-fees .tf2-figure small {
  font-size: 0.9rem;
  line-height: 1.5;
  color: var(--tf2-ink-soft);
}

.page--tenant-fees .tf2-figure__go {
  justify-self: end;
  margin-top: 0.6rem;
  font-size: 0.875rem;
  font-weight: 800;
  color: var(--tf2-oxblood);
}

@media (hover: hover) {
  .page--tenant-fees .tf2-figure:hover {
    transform: translateY(-3px);
    box-shadow: 0 24px 44px -30px rgb(13 29 49 / 45%);
  }
}

/* ------------------------------------------------------------------ */
/* Calculator — powder field, THE three-layer nest depth moment        */
/* ------------------------------------------------------------------ */

.page--tenant-fees .tf2-calc {
  padding: clamp(1.8rem, 3.4vw, 3.2rem) clamp(1.2rem, 3vw, 3rem);
  background: var(--tf2-field-powder);
}

.page--tenant-fees .tf2-calc .tf2-frame {
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
  gap: clamp(1.4rem, 2.6vw, 2.6rem);
  align-items: start;
}

.page--tenant-fees .tf2-calc__copy h2 {
  margin: 0 0 0.55rem;
  font-family: Gloock, Georgia, serif;
  font-weight: 400;
  font-size: clamp(1.7rem, 2.4vw, 2.4rem);
  line-height: 1.12;
}

.page--tenant-fees .tf2-calc__copy > p {
  margin: 0 0 0.8rem;
  max-width: 44ch;
  color: var(--tf2-ink-soft);
  line-height: 1.65;
}

.page--tenant-fees .tf2-calc__hint {
  font-size: 0.875rem;
  font-weight: 700;
}

.page--tenant-fees .tf2-calc__tool { display: grid; gap: 1rem; }

.page--tenant-fees .tf2-calc__form {
  padding: clamp(1rem, 1.8vw, 1.4rem);
  border: 1px solid var(--tf2-rule);
  border-radius: var(--tf2-radius-small);
  background: var(--tf2-field-powder);
}

.page--tenant-fees .tf2-calc__form label {
  display: block;
  margin-bottom: 0.5rem;
  font-size: 0.875rem;
  font-weight: 800;
}

.page--tenant-fees .tf2-calc__field {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: stretch;
  gap: 0.6rem;
}

.page--tenant-fees .tf2-calc__field > span {
  display: grid;
  place-items: center;
  min-width: 2.4rem;
  border-radius: 10px;
  background: var(--tf2-vault);
  color: var(--tf2-cream);
  font-family: Gloock, Georgia, serif;
  font-size: 1.2rem;
}

.page--tenant-fees .tf2-calc__field input {
  min-height: var(--tf2-tap);
  min-width: 0;
  padding: 0.6rem 0.9rem;
  border: 1px solid var(--tf2-rule);
  border-radius: 10px;
  background: var(--tf2-cream);
  color: var(--tf2-ink);
  font-size: 1.05rem;
  font-weight: 700;
}

.page--tenant-fees .tf2-calc__field button {
  min-height: var(--tf2-tap);
  padding: 0.6rem 1.4rem;
  border: 0;
  border-radius: 10px;
  background: var(--tf2-oxblood);
  color: var(--tf2-cream);
  font-weight: 800;
  font-size: 0.95rem;
  cursor: pointer;
  transition: background-color 180ms var(--tf2-ease);
}

@media (hover: hover) {
  .page--tenant-fees .tf2-calc__field button:hover { background: var(--tf2-oxblood-dark); }
}

.page--tenant-fees .tf2-calc__result {
  padding: clamp(1rem, 1.8vw, 1.4rem);
  border: 1px solid var(--tf2-rule);
  border-radius: var(--tf2-radius-small);
  background: var(--tf2-cream); /* the answer plate — one of the few cream moments */
}

.page--tenant-fees .tf2-calc__result-label {
  margin: 0 0 0.6rem;
  font-size: 0.82rem;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--tf2-ink-soft);
}

.page--tenant-fees .tf2-calc__results p {
  display: grid;
  grid-template-columns: minmax(8rem, 0.5fr) 1fr;
  gap: 0.9rem;
  align-items: baseline;
  margin: 0;
  padding: 0.62rem 0;
  border-bottom: 1px solid var(--tf2-rule);
}

.page--tenant-fees .tf2-calc__results p:last-of-type { border-bottom: 0; }

.page--tenant-fees .tf2-calc__results span {
  font-size: 0.9rem;
  color: var(--tf2-ink-soft);
}

.page--tenant-fees .tf2-calc__results strong {
  font-family: Gloock, Georgia, serif;
  font-weight: 400;
  font-size: 1.35rem;
  color: var(--tf2-vault);
}

.page--tenant-fees .tf2-calc__note {
  margin: 0.7rem 0 0;
  font-size: 0.875rem;
  color: var(--tf2-ink-soft);
}

/* ------------------------------------------------------------------ */
/* Reading chapters — sage then stone, media and ledger alternate      */
/* ------------------------------------------------------------------ */

.page--tenant-fees .tf2-chapter {
  padding: clamp(1.8rem, 3.4vw, 3.2rem) clamp(1.2rem, 3vw, 3rem);
  background: var(--tf2-field-sage);
}

.page--tenant-fees .tf2-chapter--stone { background: var(--tf2-field-stone); }

/* Columns stretch so ledger and media end level — no void under the shorter
   side (Aarav, 20 Aug: "too much empty space"). The ledger is a flex column
   and its plates share the surplus height evenly. */
.page--tenant-fees .tf2-chapter__grid {
  display: grid;
  grid-template-columns: minmax(0, 0.94fr) minmax(0, 1.06fr);
  gap: clamp(1.4rem, 2.8vw, 2.8rem);
  align-items: stretch;
}

.page--tenant-fees .tf2-chapter--flip .tf2-chapter__grid > .tf2-chapter__opening { order: 2; }

.page--tenant-fees .tf2-chapter__opening { display: grid; gap: clamp(1.1rem, 2vw, 1.6rem); }

.page--tenant-fees .tf2-chapter__head h2 {
  margin: 0 0 0.55rem;
  font-family: Gloock, Georgia, serif;
  font-weight: 400;
  font-size: clamp(1.8rem, 2.6vw, 2.6rem);
  line-height: 1.12;
}

.page--tenant-fees .tf2-chapter__head > p {
  margin: 0 0 1rem;
  max-width: 46ch;
  color: var(--tf2-ink-soft);
  line-height: 1.65;
}

.page--tenant-fees .tf2-chapter__links {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem;
}

.page--tenant-fees .tf2-chip {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  min-height: var(--tf2-tap);
  padding: 0.5rem 1.05rem;
  border: 1px solid var(--tf2-rule);
  border-radius: 999px;
  background: var(--tf2-cream);
  color: var(--tf2-ink);
  font-size: 0.9rem;
  font-weight: 700;
  text-decoration: none;
  transition: border-color 160ms var(--tf2-ease), transform 160ms var(--tf2-ease);
}

.page--tenant-fees .tf2-chip::after {
  content: "\2192";
  color: var(--tf2-oxblood);
}

@media (hover: hover) {
  .page--tenant-fees .tf2-chip:hover {
    border-color: var(--tf2-ink);
    transform: translateY(-2px);
  }
}

/* the fee ledger — plates, never bare hairline rows */
.page--tenant-fees .tf2-ledger {
  display: flex;
  flex-direction: column;
  gap: 0.7rem;
  height: 100%;
}

.page--tenant-fees .tf2-fee {
  flex: 1 0 auto;
  display: grid;
  align-content: center;
  border: 1px solid var(--tf2-rule);
  border-radius: var(--tf2-radius-small);
  background: #f0f6f1; /* a step lighter than the sage field, not white */
  overflow: hidden;
}

.page--tenant-fees .tf2-chapter--stone .tf2-fee { background: #f7efdf; }

/* the £0 route plate closing the opening ledger — the one dark plate here */
.page--tenant-fees .tf2-zeroline {
  flex: 1 0 auto;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  align-content: center;
  gap: 1rem;
  min-height: var(--tf2-tap);
  padding: 0.9rem 1.1rem;
  border-radius: var(--tf2-radius-small);
  background: var(--tf2-vault);
  color: var(--tf2-cream);
  text-decoration: none;
  transition: background-color 180ms var(--tf2-ease);
}

.page--tenant-fees .tf2-zeroline__tag {
  display: inline-grid;
  place-items: center;
  min-width: 2.7rem;
  padding: 0.28rem 0.5rem;
  border-radius: 999px;
  background: var(--tf2-gold);
  color: var(--tf2-vault);
  font-family: Gloock, Georgia, serif;
  font-size: 0.95rem;
}

.page--tenant-fees .tf2-zeroline__copy { display: grid; gap: 0.1rem; }

.page--tenant-fees .tf2-zeroline strong { font-family: Gloock, Georgia, serif; font-weight: 400; font-size: 1.08rem; }

.page--tenant-fees .tf2-zeroline small {
  font-size: 0.875rem;
  line-height: 1.45;
  color: rgb(251 248 242 / 80%);
}

.page--tenant-fees .tf2-zeroline .tf2-arrow { color: var(--tf2-gold); font-weight: 700; }

@media (hover: hover) {
  .page--tenant-fees .tf2-zeroline:hover { background: var(--tf2-vault-soft); }
}

.page--tenant-fees .tf2-fee__summary {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  grid-template-areas: "name action" "limit action";
  gap: 0.15rem 1rem;
  align-items: center;
  min-height: var(--tf2-tap);
  padding: 0.9rem 1.1rem;
  cursor: pointer;
  list-style: none;
  transition: background-color 160ms var(--tf2-ease);
}

.page--tenant-fees .tf2-fee__summary::-webkit-details-marker { display: none; }

@media (hover: hover) {
  .page--tenant-fees .tf2-fee__summary:hover { background: rgb(23 26 32 / 4%); }
}

.page--tenant-fees .tf2-fee__name {
  grid-area: name;
  font-family: Gloock, Georgia, serif;
  font-size: 1.08rem;
}

.page--tenant-fees .tf2-fee__limit {
  grid-area: limit;
  font-size: 0.875rem;
  font-weight: 700;
  color: var(--tf2-oxblood);
  line-height: 1.4;
}

.page--tenant-fees .tf2-fee__action {
  grid-area: action;
  display: grid;
  place-items: center;
  width: 2rem;
  height: 2rem;
  border: 1px solid var(--tf2-rule);
  border-radius: 50%;
  font-weight: 700;
  color: var(--tf2-ink);
}

.page--tenant-fees .tf2-fee[open] .tf2-fee__action { background: var(--tf2-vault); border-color: var(--tf2-vault); color: var(--tf2-cream); }

.page--tenant-fees .tf2-fee__detail {
  padding: 0 1.1rem 1rem;
}

.page--tenant-fees .tf2-fee__detail p {
  margin: 0 0 0.6rem;
  max-width: 62ch;
  font-size: 0.94rem;
  line-height: 1.6;
  color: var(--tf2-ink-soft);
}

.page--tenant-fees .tf2-fee__detail a {
  font-size: 0.9rem;
  font-weight: 700;
  color: var(--tf2-ink);
  text-underline-offset: 0.22em;
}

.page--tenant-fees .tf2-chapter__official { margin: clamp(1.1rem, 2vw, 1.6rem) 0 0; }

/* ------------------------------------------------------------------ */
/* £0 — the dark tally: what is never a tenant charge                  */
/* ------------------------------------------------------------------ */

.page--tenant-fees .tf2-zero {
  padding: clamp(1.8rem, 3.4vw, 3.2rem) clamp(1.2rem, 3vw, 3rem);
  background:
    radial-gradient(110% 130% at 8% 108%, rgb(27 71 63 / 85%) 0%, rgb(27 71 63 / 0%) 55%),
    var(--tf2-vault);
  color: var(--tf2-cream);
}

.page--tenant-fees .tf2-zero__grid {
  display: grid;
  grid-template-columns: minmax(0, 0.72fr) minmax(0, 1.28fr);
  gap: clamp(1.4rem, 3vw, 3rem);
  align-items: start;
}

.page--tenant-fees .tf2-zero__amount {
  margin: 0 0 0.5rem;
  font-family: Gloock, Georgia, serif;
  font-size: clamp(4.6rem, 8.5vw, 8.5rem);
  line-height: 0.9;
  color: var(--tf2-gold);
}

.page--tenant-fees .tf2-zero__lead h2 {
  margin: 0 0 0.55rem;
  font-family: Gloock, Georgia, serif;
  font-weight: 400;
  font-size: clamp(1.8rem, 2.6vw, 2.6rem);
  line-height: 1.12;
  color: var(--tf2-cream);
}

.page--tenant-fees .tf2-zero__lead > p {
  margin: 0 0 1rem;
  max-width: 42ch;
  color: rgb(251 248 242 / 82%);
  line-height: 1.65;
}

.page--tenant-fees .tf2-zero__note {
  margin: 1rem 0 0;
  font-size: 0.9rem;
  color: rgb(251 248 242 / 78%);
  line-height: 1.6;
}

.page--tenant-fees .tf2-zero__note a { color: var(--tf2-cream); text-underline-offset: 0.22em; }

.page--tenant-fees .tf2-zero__list { display: grid; gap: 0.6rem; }

.page--tenant-fees .tf2-zero__list details {
  border: 1px solid var(--tf2-rule-dark);
  border-radius: var(--tf2-radius-small);
  background: rgb(251 248 242 / 6%);
}

.page--tenant-fees .tf2-zero__list summary {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 0.9rem;
  min-height: var(--tf2-tap);
  padding: 0.75rem 1.05rem;
  cursor: pointer;
  list-style: none;
  font-weight: 700;
}

.page--tenant-fees .tf2-zero__list summary::-webkit-details-marker { display: none; }

.page--tenant-fees .tf2-zero__tag {
  display: inline-grid;
  place-items: center;
  min-width: 2.7rem;
  padding: 0.28rem 0.5rem;
  border-radius: 999px;
  background: var(--tf2-gold);
  color: var(--tf2-vault);
  font-family: Gloock, Georgia, serif;
  font-size: 0.95rem;
}

.page--tenant-fees .tf2-zero__mark {
  font-weight: 700;
  color: rgb(251 248 242 / 85%);
  transition: transform 160ms var(--tf2-ease);
}

.page--tenant-fees .tf2-zero__list details[open] .tf2-zero__mark { transform: rotate(45deg); }

.page--tenant-fees .tf2-zero__list details p {
  margin: 0;
  padding: 0 1.05rem 0.9rem 4.65rem;
  max-width: 62ch;
  font-size: 0.92rem;
  line-height: 1.6;
  color: rgb(251 248 242 / 80%);
}

@media (hover: hover) {
  .page--tenant-fees .tf2-zero__list summary:hover { background: rgb(251 248 242 / 5%); border-radius: var(--tf2-radius-small); }
}

/* ------------------------------------------------------------------ */
/* Protection — paper island, the kept photograph + both certificates  */
/* ------------------------------------------------------------------ */

.page--tenant-fees .tf2-protect {
  padding: clamp(1.8rem, 3.4vw, 3.2rem) clamp(1.2rem, 3vw, 3rem);
  background: var(--tf2-paper);
}

.page--tenant-fees .tf2-protect__grid {
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
  gap: clamp(1.4rem, 2.8vw, 2.8rem);
  align-items: start;
}

.page--tenant-fees .tf2-protect__media {
  margin: 0;
  display: grid;
  gap: 0.55rem;
}

.page--tenant-fees .tf2-protect__media img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: var(--tf2-radius-plate);
  border: 1px solid var(--tf2-rule);
}

/* Desktop: the photograph fills the column so it ends level with the second
   certificate — no dead paper under the caption (the >25%-empty-band trap). */
@media (min-width: 62em) {
  .page--tenant-fees .tf2-protect__grid { align-items: stretch; }
  .page--tenant-fees .tf2-protect__media { grid-template-rows: 1fr auto; min-height: 0; }
  .page--tenant-fees .tf2-protect__media picture { display: block; height: 100%; min-height: 0; }
  .page--tenant-fees .tf2-protect__media img { height: 100%; object-fit: cover; }
}

.page--tenant-fees .tf2-protect__media figcaption {
  font-size: 0.875rem;
  color: var(--tf2-ink-soft);
}

.page--tenant-fees .tf2-protect__certs { display: grid; gap: clamp(0.9rem, 1.6vw, 1.3rem); }

.page--tenant-fees .tf2-cert {
  display: grid;
  grid-template-columns: minmax(0, 0.62fr) minmax(0, 1.38fr);
  gap: clamp(0.9rem, 1.6vw, 1.3rem);
  align-items: center;
  padding: clamp(0.9rem, 1.6vw, 1.3rem);
  border: 1px solid var(--tf2-rule);
  border-radius: var(--tf2-radius-plate);
  background: var(--tf2-cream);
}

.page--tenant-fees .tf2-cert__preview {
  position: relative;
  display: block;
  border-radius: var(--tf2-radius-small);
  overflow: hidden;
  border: 1px solid var(--tf2-rule);
}

.page--tenant-fees .tf2-cert__preview img {
  display: block;
  width: 100%;
  height: auto;
}

.page--tenant-fees .tf2-cert h3 {
  margin: 0;
  font-family: Gloock, Georgia, serif;
  font-weight: 400;
  font-size: 1.35rem;
}

.page--tenant-fees .tf2-cert__meta {
  margin: 0.15rem 0 0.55rem;
  font-size: 0.82rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--tf2-oxblood);
}

.page--tenant-fees .tf2-cert__description {
  margin: 0 0 0.6rem;
  font-size: 0.92rem;
  line-height: 1.6;
  color: var(--tf2-ink-soft);
}

.page--tenant-fees .tf2-cert__copy a {
  font-size: 0.9rem;
  font-weight: 700;
  color: var(--tf2-ink);
  text-underline-offset: 0.22em;
}

/* ------------------------------------------------------------------ */
/* Downloads — blush field, the PDF callout                            */
/* ------------------------------------------------------------------ */

.page--tenant-fees .tf2-downloads {
  padding: clamp(1.8rem, 3.4vw, 3.2rem) clamp(1.2rem, 3vw, 3rem);
  background: var(--tf2-field-blush);
}

.page--tenant-fees .tf2-downloads__grid {
  display: grid;
  grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr);
  gap: clamp(1.4rem, 2.8vw, 2.8rem);
  align-items: center;
}

.page--tenant-fees .tf2-downloads__copy h2 {
  margin: 0 0 0.55rem;
  font-family: Gloock, Georgia, serif;
  font-weight: 400;
  font-size: clamp(1.7rem, 2.4vw, 2.4rem);
  line-height: 1.12;
}

.page--tenant-fees .tf2-downloads__copy > p {
  margin: 0;
  max-width: 42ch;
  color: var(--tf2-ink-soft);
  line-height: 1.65;
}

.page--tenant-fees .tf2-downloads__files { display: grid; gap: 0.9rem; }

.page--tenant-fees .tf2-file {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  grid-template-areas: "kicker arrow" "title arrow" "desc arrow" "meta arrow";
  gap: 0.15rem 1rem;
  align-items: center;
  padding: clamp(1rem, 1.8vw, 1.4rem);
  border: 1px solid var(--tf2-rule);
  border-radius: var(--tf2-radius-plate);
  background: #f9ece8; /* a step lighter than the blush field, not white */
  color: var(--tf2-ink);
  text-decoration: none;
  transition: transform 180ms var(--tf2-ease), box-shadow 180ms var(--tf2-ease);
}

.page--tenant-fees .tf2-file > span:first-child {
  grid-area: kicker;
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--tf2-oxblood);
}

.page--tenant-fees .tf2-file strong {
  grid-area: title;
  font-family: Gloock, Georgia, serif;
  font-weight: 400;
  font-size: 1.3rem;
}

.page--tenant-fees .tf2-file small {
  grid-area: desc;
  font-size: 0.9rem;
  line-height: 1.5;
  color: var(--tf2-ink-soft);
}

.page--tenant-fees .tf2-file__meta {
  grid-area: meta;
  margin-top: 0.35rem;
  font-size: 0.82rem;
  font-weight: 700;
  color: var(--tf2-ink-soft);
}

.page--tenant-fees .tf2-file .tf2-arrow {
  grid-area: arrow;
  font-weight: 700;
  color: var(--tf2-oxblood);
  transition: transform 180ms var(--tf2-ease);
}

@media (hover: hover) {
  .page--tenant-fees .tf2-file:hover {
    transform: translateY(-3px);
    box-shadow: 0 24px 44px -30px rgb(13 29 49 / 45%);
  }
  .page--tenant-fees .tf2-file:hover .tf2-arrow { transform: translateX(4px); }
}

/* ------------------------------------------------------------------ */
/* Official guidance — narrow cream island                             */
/* ------------------------------------------------------------------ */

.page--tenant-fees .tf2-sources {
  width: var(--tf2-shell-notes);
  padding: clamp(1.6rem, 2.8vw, 2.6rem) clamp(1.2rem, 2.6vw, 2.6rem);
  background: var(--tf2-paper);
  border: 1px solid var(--tf2-rule);
}

.page--tenant-fees .tf2-sources h2 {
  margin: 0 0 0.9rem;
  font-family: Gloock, Georgia, serif;
  font-weight: 400;
  font-size: clamp(1.5rem, 2vw, 2rem);
}

.page--tenant-fees .tf2-sources ul {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.7rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.page--tenant-fees .tf2-sources li a {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 0.8rem;
  min-height: var(--tf2-tap);
  padding: 0.75rem 1rem;
  border: 1px solid var(--tf2-rule);
  border-radius: var(--tf2-radius-small);
  background: #ebf1f2; /* powder-light on the paper island */
  color: var(--tf2-ink);
  font-size: 0.94rem;
  font-weight: 700;
  text-decoration: none;
  transition: border-color 160ms var(--tf2-ease);
}

.page--tenant-fees .tf2-sources li a::after {
  content: "\2197";
  color: var(--tf2-oxblood);
}

@media (hover: hover) {
  .page--tenant-fees .tf2-sources li a:hover { border-color: var(--tf2-ink); }
}

.page--tenant-fees .tf2-sources__reviewed {
  margin: 1rem 0 0;
  font-size: 0.875rem;
  color: var(--tf2-ink-soft);
}

/* ------------------------------------------------------------------ */
/* Continue — stone field, three route plates                          */
/* ------------------------------------------------------------------ */

.page--tenant-fees .tf2-next {
  padding: clamp(1.8rem, 3.4vw, 3.2rem) clamp(1.2rem, 3vw, 3rem);
  background: var(--tf2-field-stone);
}

.page--tenant-fees .tf2-next__links {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(0.9rem, 1.6vw, 1.4rem);
}

.page--tenant-fees .tf2-next__links a {
  display: grid;
  grid-template-rows: auto auto 1fr auto;
  gap: 0.3rem;
  padding: clamp(1.2rem, 2vw, 1.7rem);
  border: 1px solid var(--tf2-rule);
  border-radius: var(--tf2-radius-plate);
  background: #f6eedd; /* a step lighter than the stone field, not white */
  color: var(--tf2-ink);
  text-decoration: none;
  transition: transform 180ms var(--tf2-ease), box-shadow 180ms var(--tf2-ease);
}

.page--tenant-fees .tf2-next__links a > span:first-child {
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--tf2-oxblood);
}

.page--tenant-fees .tf2-next__links strong {
  font-family: Gloock, Georgia, serif;
  font-weight: 400;
  font-size: 1.3rem;
  line-height: 1.15;
}

.page--tenant-fees .tf2-next__links small {
  font-size: 0.9rem;
  line-height: 1.55;
  color: var(--tf2-ink-soft);
}

.page--tenant-fees .tf2-next__links .tf2-arrow {
  justify-self: end;
  margin-top: 0.5rem;
  font-weight: 700;
  color: var(--tf2-oxblood);
  transition: transform 180ms var(--tf2-ease);
}

@media (hover: hover) {
  .page--tenant-fees .tf2-next__links a:hover {
    transform: translateY(-3px);
    box-shadow: 0 24px 44px -30px rgb(13 29 49 / 45%);
  }
  .page--tenant-fees .tf2-next__links a:hover .tf2-arrow { transform: translateX(4px); }
}

/* ------------------------------------------------------------------ */
/* FAQ — paper island                                                  */
/* ------------------------------------------------------------------ */

.page--tenant-fees .tf2-faq {
  padding: clamp(1.8rem, 3.4vw, 3.2rem) clamp(1.2rem, 3vw, 3rem);
  background: var(--tf2-paper);
}

.page--tenant-fees .tf2-faq__list {
  max-width: 62rem;
  margin: 0 auto;
  display: grid;
  gap: 0.7rem;
}

.page--tenant-fees .tf2-faq__list details {
  border: 1px solid var(--tf2-rule);
  border-radius: var(--tf2-radius-small);
  background: #ebf1f2; /* powder-light rows on the warm paper island */
}

.page--tenant-fees .tf2-faq__list summary {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 0.9rem;
  min-height: var(--tf2-tap);
  padding: 0.85rem 1.1rem;
  cursor: pointer;
  list-style: none;
  font-family: Gloock, Georgia, serif;
  font-size: 1.06rem;
}

.page--tenant-fees .tf2-faq__list summary::-webkit-details-marker { display: none; }

.page--tenant-fees .tf2-faq__list summary::after {
  content: "+";
  display: grid;
  place-items: center;
  width: 2rem;
  height: 2rem;
  border: 1px solid var(--tf2-rule);
  border-radius: 50%;
  font-family: Manrope, system-ui, sans-serif;
  font-weight: 700;
}

.page--tenant-fees .tf2-faq__list details[open] summary::after {
  content: "\2212";
  background: var(--tf2-vault);
  border-color: var(--tf2-vault);
  color: var(--tf2-cream);
}

.page--tenant-fees .tf2-faq__list details p {
  margin: 0;
  padding: 0 1.1rem 1rem;
  max-width: 66ch;
  font-size: 0.94rem;
  line-height: 1.6;
  color: var(--tf2-ink-soft);
}

/* ------------------------------------------------------------------ */
/* Contact bookend — vault green closes the page                       */
/* ------------------------------------------------------------------ */

.page--tenant-fees .tf2-contact {
  padding: clamp(1.8rem, 3.4vw, 3.2rem) clamp(1.2rem, 3vw, 3rem);
  border-radius: 30px 30px 84px 30px;
  background:
    radial-gradient(120% 130% at 12% -10%, rgb(27 71 63 / 85%) 0%, rgb(27 71 63 / 0%) 55%),
    var(--tf2-vault);
  color: var(--tf2-cream);
}

.page--tenant-fees .tf2-contact__grid {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
  gap: clamp(1.4rem, 2.8vw, 2.8rem);
  align-items: center;
}

.page--tenant-fees .tf2-contact h2 {
  margin: 0 0 0.55rem;
  font-family: Gloock, Georgia, serif;
  font-weight: 400;
  font-size: clamp(1.8rem, 2.6vw, 2.6rem);
  line-height: 1.12;
  color: var(--tf2-cream);
}

.page--tenant-fees .tf2-contact__intro > p {
  margin: 0 0 1.2rem;
  max-width: 44ch;
  color: rgb(251 248 242 / 84%);
  line-height: 1.65;
}

.page--tenant-fees .tf2-contact__routes { display: grid; gap: 0.7rem; }

.page--tenant-fees .tf2-contact__routes a {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  grid-template-areas: "label arrow" "value arrow";
  align-items: center;
  gap: 0.1rem 0.8rem;
  min-height: var(--tf2-tap);
  padding: 0.8rem 1.05rem;
  border: 1px solid var(--tf2-rule-dark);
  border-radius: var(--tf2-radius-small);
  background: rgb(251 248 242 / 7%);
  color: var(--tf2-cream);
  text-decoration: none;
  transition: background-color 180ms var(--tf2-ease);
}

.page--tenant-fees .tf2-contact__routes a > span:first-child {
  grid-area: label;
  font-size: 0.75rem;
  font-weight: 800;
  letter-spacing: 0.11em;
  text-transform: uppercase;
  color: var(--tf2-gold);
}

.page--tenant-fees .tf2-contact__routes strong {
  grid-area: value;
  font-size: 1.05rem;
  font-weight: 800;
}

.page--tenant-fees .tf2-contact__routes .tf2-arrow {
  grid-area: arrow;
  color: var(--tf2-gold);
  font-weight: 700;
}

@media (hover: hover) {
  .page--tenant-fees .tf2-contact__routes a:hover { background: rgb(251 248 242 / 13%); }
}

.page--tenant-fees .tf2-contact .tf2-slot { margin-top: 1.2rem; }

/* ------------------------------------------------------------------ */
/* Print mark                                                          */
/* ------------------------------------------------------------------ */

.page--tenant-fees .printmark { display: none; }

@media print {
  .page--tenant-fees .printmark {
    display: block;
    margin: 2rem auto 0;
    width: var(--tf2-shell-notes);
    font-size: 0.8rem;
    color: var(--tf2-ink-soft);
  }
  .page--tenant-fees .tf2-nav { display: none; }
}

/* ------------------------------------------------------------------ */
/* Responsive                                                          */
/* ------------------------------------------------------------------ */

@media (max-width: 74.99em) {
  .page--tenant-fees .tf2-hero__routes { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 61.99em) {
  .page--tenant-fees .tf2-hero__inner,
  .page--tenant-fees .tf2-calc .tf2-frame,
  .page--tenant-fees .tf2-chapter__grid,
  .page--tenant-fees .tf2-zero__grid,
  .page--tenant-fees .tf2-protect__grid,
  .page--tenant-fees .tf2-downloads__grid,
  .page--tenant-fees .tf2-contact__grid {
    grid-template-columns: 1fr;
  }

  .page--tenant-fees .tf2-chapter--flip .tf2-chapter__grid > .tf2-chapter__opening { order: 0; }

  .page--tenant-fees .tf2-figures__row,
  .page--tenant-fees .tf2-next__links {
    grid-template-columns: 1fr;
  }

  .page--tenant-fees .tf2-sources ul { grid-template-columns: 1fr; }
}

@media (max-width: 47.99em) {
  .page--tenant-fees .tf2-hero { border-radius: 22px 22px 52px 22px; }
  .page--tenant-fees .tf2-contact { border-radius: 22px 22px 52px 22px; }
  .page--tenant-fees .tf2-hero__routes { grid-template-columns: 1fr; }
  .page--tenant-fees .tf2-cert { grid-template-columns: 1fr; }
  .page--tenant-fees .tf2-zero__list details p { padding-left: 1.05rem; }
}

/* ------------------------------------------------------------------ */
/* Motion discipline                                                   */
/* ------------------------------------------------------------------ */

@media (prefers-reduced-motion: reduce) {
  .page--tenant-fees .tf2-button,
  .page--tenant-fees .tf2-chip,
  .page--tenant-fees .tf2-figure,
  .page--tenant-fees .tf2-file,
  .page--tenant-fees .tf2-next__links a,
  .page--tenant-fees .tf2-hero__routes a,
  .page--tenant-fees .tf2-arrow {
    transition: none !important;
    transform: none !important;
  }
}
