/* ============================================================
   gcustudent.com — homepage comp v1
   Family palette: GCU violet #522398 + gold #FFC629, identical
   across gcututors / gcuassignments / gcupreceptor.

   THIRD ARCHITECTURE IN THE NETWORK, deliberately unlike both
   siblings. capellastudent is an instrument panel (bar chart,
   floating cards, centred column). waldenstudent is an annotated
   document (quoted policy in serif, hanging margin, ruled).
   THIS ONE IS A TIMETABLE — a matrix of days against
   deliverables, solid violet chrome, tabular figures, blocked
   rather than carded or ruled. No shared class vocabulary with
   either sibling.
   ============================================================ */

:root {
  --field:    #FAF8FC;
  --plane:    #FFFFFF;
  --lilac:    #F3EFFA;
  --lilac-2:  #E7DEF5;

  --carbon:   #1E1630;
  --slate:    #4A3F62;
  --dim:      #6B6083;
  --wisp:     #6C6285;

  --edge:     #E4DCF0;
  --edge-2:   #CFC3E4;

  --violet:      #522398;
  --violet-lift: #6A3CB5;
  --violet-dark: #3B1770;
  --violet-mist: #EFE9F9;

  --gold:      #FFC629;
  --gold-dark: #8A6100;
  --gold-mist: #FFF6DD;

  --jakarta: "Plus Jakarta Sans", "Segoe UI", Arial, sans-serif;
  --public:  "Public Sans", "Segoe UI", Arial, sans-serif;

  --pad: clamp(1.15rem, 4.5vw, 3.5rem);
}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }

body {
  margin: 0;
  background: var(--field);
  color: var(--carbon);
  font-family: var(--public);
  font-size: 17px;
  line-height: 1.62;
  font-variant-numeric: tabular-nums;
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3 { font-family: var(--jakarta); margin: 0; line-height: 1.1; letter-spacing: -.03em; font-weight: 800; text-wrap: balance; }
p { margin: 0; }
a { color: inherit; }
:focus-visible { outline: 3px solid var(--gold); outline-offset: 2px; }

.frame { max-width: 1200px; margin: 0 auto; padding-inline: var(--pad); }

.go {
  display: inline-flex; align-items: center; justify-content: center;
  font-family: var(--jakarta); font-weight: 700; font-size: 1rem;
  padding: .9rem 1.6rem; min-height: 50px;
  background: var(--gold); color: var(--carbon); border: 0; border-radius: 8px;
  cursor: pointer; text-decoration: none; transition: background .15s ease, transform .15s ease;
}
.go:hover { background: #FFD35C; transform: translateY(-1px); }
.go-violet { background: var(--violet); color: #fff; }
.go-violet:hover { background: var(--violet-lift); }
.go-hollow { background: transparent; color: var(--carbon); box-shadow: inset 0 0 0 2px var(--edge-2); }
.go-hollow:hover { background: var(--lilac); transform: none; }

/* ============================================================
   CHROME — a solid violet bar, not a blurred floating one
   ============================================================ */

.chrome { background: var(--violet); color: #fff; }
.chrome .frame { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; padding-block: .9rem; }

.badge { display: flex; align-items: center; gap: .6rem; text-decoration: none; color: #fff; }
.badge svg { width: 30px; height: 30px; flex: none; display: block; }
.badge .arc { transition: transform .45s cubic-bezier(.22,1,.36,1); transform-origin: 16px 20px; }
.badge:hover .arc { transform: translateY(-2px) scale(1.05); }
.badge b { font-family: var(--jakarta); font-weight: 800; font-size: 1.14rem; letter-spacing: -.038em; }

.jump { display: flex; gap: 1.6rem; }
.jump a { font-size: .93rem; color: rgba(255,255,255,.82); text-decoration: none; padding-bottom: 2px; border-bottom: 2px solid transparent; }
.jump a:hover { color: #fff; border-bottom-color: var(--gold); }
@media (max-width: 1040px) { .jump { display: none; } }

.honest { background: var(--violet-dark); color: rgba(255,255,255,.82); font-size: .84rem; }
.honest .frame { padding-block: .5rem; }
.honest b { color: #fff; font-weight: 600; }

/* ============================================================
   OPENING
   ============================================================ */

.open .frame { padding-block: clamp(2.5rem, 5.5vw, 4.25rem) clamp(1.75rem, 3.5vw, 2.5rem); }
.open h1 { font-size: clamp(2.2rem, 5.2vw, 3.7rem); max-width: 19ch; }
.open h1 u { text-decoration: none; color: var(--violet); }
.open .said { margin-top: 1.35rem; font-size: 1.1rem; color: var(--dim); max-width: 52ch; }

/* ============================================================
   THE TIMETABLE — the signature device
   ============================================================ */

.timetable { margin-top: clamp(2rem, 4vw, 3rem); background: var(--plane); border: 2px solid var(--carbon); border-radius: 4px; overflow: hidden; }

.tt-bar { display: flex; flex-wrap: wrap; gap: 1rem 2rem; align-items: center; justify-content: space-between; padding: 1.25rem clamp(1.1rem, 3vw, 1.75rem); border-bottom: 2px solid var(--carbon); background: var(--lilac); }
.tt-bar h2 { font-size: 1.2rem; }
.dials { display: flex; gap: .5rem; }
.dials button {
  font-family: var(--public); font-size: .93rem; font-weight: 500; color: var(--slate);
  background: var(--plane); border: 1.5px solid var(--edge-2); border-radius: 6px;
  padding: .55rem 1rem; min-height: 44px; cursor: pointer; transition: all .15s ease;
}
.dials button:hover { border-color: var(--violet); color: var(--violet); }
.dials button[aria-pressed="true"] { background: var(--violet); border-color: var(--violet); color: #fff; font-weight: 600; }

.grid-scroll { overflow-x: auto; }
.grid { width: 100%; min-width: 42rem; border-collapse: collapse; }
.grid th, .grid td { border-right: 1px solid var(--edge); border-bottom: 1px solid var(--edge); padding: 0; }
.grid thead th { background: var(--plane); font-family: var(--jakarta); font-weight: 700; font-size: .85rem; color: var(--dim); padding: .75rem .5rem; text-align: center; border-bottom: 2px solid var(--carbon); }
.grid thead th:first-child { text-align: left; padding-left: clamp(1.1rem, 3vw, 1.75rem); width: 12.5rem; }
.grid tbody th { text-align: left; font-family: var(--public); font-weight: 500; font-size: .93rem; color: var(--carbon); padding: .9rem clamp(1.1rem, 3vw, 1.75rem); background: var(--plane); }
.grid tbody th small { display: block; font-size: .8rem; color: var(--wisp); }
.grid td { height: 3.4rem; position: relative; }
.grid td[data-fill] { background: var(--violet-mist); }
.grid td[data-fill="strong"] { background: var(--violet); }
.grid td[data-fill="gold"] { background: var(--gold-mist); }
.grid td span {
  position: absolute; inset: .45rem .35rem; border-radius: 4px;
  display: grid; place-items: center; font-family: var(--jakarta); font-weight: 700; font-size: .78rem;
}
.grid td[data-fill="strong"] span { color: #fff; }
.grid td[data-fill="gold"] span { color: var(--gold-dark); }
.grid td[data-fill="soft"] span { color: var(--violet); }

.tt-out { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 2px solid var(--carbon); }
@media (max-width: 700px) { .tt-out { grid-template-columns: 1fr; } }
.tt-out div { padding: 1.25rem clamp(1.1rem, 3vw, 1.75rem); border-right: 1px solid var(--edge); }
.tt-out div:last-child { border-right: 0; }
.tt-out b { display: block; font-family: var(--jakarta); font-weight: 800; font-size: clamp(1.7rem, 3.4vw, 2.3rem); letter-spacing: -.04em; line-height: 1; }
.tt-out b.warn { color: var(--violet); }
.tt-out span { display: block; margin-top: .3rem; font-size: .88rem; color: var(--dim); }

.tt-foot { padding: 1.1rem clamp(1.1rem, 3vw, 1.75rem); background: var(--lilac); border-top: 1px solid var(--edge); font-size: .84rem; color: var(--dim); line-height: 1.55; }

/* ============================================================
   BLOCKS — a two-up slab layout, no floating cards
   ============================================================ */

.slab { border-top: 2px solid var(--carbon); }
.slab .frame { padding-block: clamp(3rem, 6vw, 4.75rem); }
.slab-violet { background: var(--violet); color: #fff; border-top-color: var(--violet); }
.slab-lilac { background: var(--lilac); }

.slab h2 { font-size: clamp(1.85rem, 4vw, 2.7rem); max-width: 22ch; }
.slab .lede { margin-top: 1.1rem; font-size: 1.06rem; color: var(--dim); max-width: 58ch; }
.slab-violet .lede { color: rgba(255,255,255,.84); }

.twoup { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(1.75rem, 4vw, 3.5rem); margin-top: clamp(2rem, 4vw, 3rem); align-items: start; }
@media (max-width: 880px) { .twoup { grid-template-columns: 1fr; } }

.quoted { border-left: 4px solid var(--gold); padding-left: 1.5rem; }
.quoted blockquote { margin: 0; font-family: var(--jakarta); font-weight: 600; font-size: clamp(1.15rem, 2.4vw, 1.45rem); line-height: 1.4; letter-spacing: -.02em; }
.quoted cite { display: block; margin-top: .9rem; font-style: normal; font-size: .88rem; color: rgba(255,255,255,.62); }

.plainly { display: grid; gap: 1.15rem; }
.plainly h3 { font-family: var(--jakarta); font-weight: 700; font-size: 1.1rem; letter-spacing: -.02em; }
.plainly p { font-size: .97rem; color: rgba(255,255,255,.8); line-height: 1.58; margin-top: .3rem; }

/* price strip */
.strip-nums { display: grid; grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr)); margin-top: clamp(2rem, 4vw, 3rem); border: 2px solid var(--carbon); border-radius: 4px; background: var(--plane); }
.strip-nums div { padding: 1.5rem 1.4rem; border-right: 1px solid var(--edge); }
.strip-nums div:last-child { border-right: 0; }
.strip-nums b { display: block; font-family: var(--jakarta); font-weight: 800; font-size: clamp(1.75rem, 3.4vw, 2.35rem); letter-spacing: -.04em; line-height: 1; }
.strip-nums b.pop { color: var(--violet); }
.strip-nums span { display: block; margin-top: .35rem; font-size: .88rem; color: var(--dim); }
.caveat { margin-top: 1.35rem; font-size: .86rem; color: var(--wisp); line-height: 1.55; max-width: 74ch; }

/* ============================================================
   THE SORTER — the fit instrument, as a stacked worksheet
   ============================================================ */

.sorter .frame { padding-block: clamp(3rem, 6vw, 4.75rem); }
.sheet { margin-top: clamp(2rem, 4vw, 3rem); background: var(--plane); border: 2px solid var(--carbon); border-radius: 4px; }
.sheet-top { display: flex; flex-wrap: wrap; gap: .75rem 1.5rem; align-items: center; justify-content: space-between; padding: 1.1rem clamp(1.1rem, 3vw, 1.75rem); border-bottom: 2px solid var(--carbon); }
.sheet-top strong { font-family: var(--jakarta); font-weight: 800; font-size: 1.08rem; letter-spacing: -.028em; }
.pips { display: flex; gap: .3rem; }
.pips i { width: 1.8rem; height: 6px; border-radius: 2px; background: var(--edge-2); }
.pips i[data-lit="1"] { background: var(--violet); }

.sheet-body { padding: clamp(1.5rem, 3.5vw, 2.25rem) clamp(1.1rem, 3vw, 1.75rem); }
.qn { font-size: .93rem; color: var(--wisp); }
.qbig { font-family: var(--jakarta); font-weight: 800; font-size: clamp(1.4rem, 3vw, 2rem); letter-spacing: -.036em; margin: .5rem 0 1.4rem; max-width: 24ch; }

.picks { display: grid; gap: .5rem; max-width: 44rem; }
.picks button {
  display: grid; grid-template-columns: 2.4rem 1fr; align-items: center; text-align: left; width: 100%;
  font-family: var(--public); font-size: 1rem; color: var(--carbon);
  background: var(--plane); border: 1.5px solid var(--edge); border-radius: 8px;
  padding: .9rem 1rem; min-height: 58px; cursor: pointer;
  transition: border-color .15s ease, background .15s ease;
}
.picks button:hover { border-color: var(--violet); background: var(--violet-mist); }
.picks button u { text-decoration: none; font-family: var(--jakarta); font-weight: 800; font-size: .82rem; color: var(--violet); }

.rewind { margin-top: 1.35rem; background: none; border: 0; padding: 0; cursor: pointer; font-family: var(--public); font-size: .93rem; color: var(--wisp); }
.rewind:hover { color: var(--carbon); }
.rewind[hidden] { display: none; }

.outcome { display: none; }
.outcome[data-live="1"] { display: block; }
.outcome-band { display: inline-block; font-family: var(--jakarta); font-weight: 800; font-size: .88rem; padding: .4rem .8rem; border-radius: 6px; }
.outcome-band.fit { background: var(--violet); color: #fff; }
.outcome-band.unfit { background: var(--gold); color: var(--carbon); }
.outcome-band.part { background: var(--lilac-2); color: var(--slate); }
.outcome h3 { font-size: clamp(1.35rem, 2.8vw, 1.85rem); margin-top: 1.2rem; max-width: 25ch; }
.outcome-say { margin-top: 1rem; font-size: 1.03rem; color: var(--slate); max-width: 54ch; line-height: 1.6; }
.pointers { margin: 1.75rem 0 0; padding: 0; list-style: none; display: grid; gap: 0; max-width: 54rem; border-top: 1px solid var(--edge); }
.pointers li { padding: 1.05rem 0; border-bottom: 1px solid var(--edge); display: grid; grid-template-columns: minmax(0, 13rem) minmax(0, 1fr); gap: clamp(.75rem, 2.5vw, 2rem); }
@media (max-width: 720px) { .pointers li { grid-template-columns: 1fr; gap: .25rem; } }
.pointers b { font-family: var(--jakarta); font-weight: 700; font-size: .97rem; letter-spacing: -.02em; }
.pointers span { font-size: .95rem; color: var(--dim); line-height: 1.55; }
.outcome-go { margin-top: 1.75rem; display: flex; flex-wrap: wrap; gap: .7rem; }

/* ============================================================
   PAIRINGS
   ============================================================ */

.pairs .frame { padding-block: clamp(3rem, 6vw, 4.75rem); }
.pairlist { margin-top: clamp(2rem, 4vw, 3rem); border-top: 2px solid var(--carbon); }
.pairlist a { display: grid; grid-template-columns: minmax(0, 13rem) minmax(0, 1fr) auto; gap: clamp(1rem, 3vw, 2.5rem); align-items: baseline; padding: 1.35rem 0; border-bottom: 1px solid var(--edge-2); text-decoration: none; transition: background .15s ease, padding .15s ease; }
.pairlist a:hover { background: var(--violet-mist); padding-inline: .75rem; }
.pairlist strong { font-family: var(--jakarta); font-weight: 800; font-size: 1.16rem; letter-spacing: -.03em; }
.pairlist span { font-size: .97rem; color: var(--dim); }
.pairlist em { font-style: normal; color: var(--violet); font-weight: 700; }
@media (max-width: 800px) { .pairlist a { grid-template-columns: 1fr auto; } .pairlist span { grid-column: 1 / -1; } }

/* ============================================================
   CLOSE
   ============================================================ */

.close { background: var(--violet); color: #fff; }
.close .frame { padding-block: clamp(3rem, 6vw, 4.75rem); }
.close-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 22rem); gap: clamp(2rem, 5vw, 4.5rem); align-items: start; }
@media (max-width: 900px) { .close-grid { grid-template-columns: 1fr; } }
.close h2 { font-size: clamp(1.9rem, 4.2vw, 2.9rem); max-width: 18ch; }
.close .said { margin-top: 1.15rem; font-size: 1.08rem; color: rgba(255,255,255,.86); max-width: 42ch; }
.close ul { margin: 2rem 0 0; padding: 0; list-style: none; display: grid; gap: 1rem; max-width: 44ch; }
.close li { display: grid; grid-template-columns: 1.6rem 1fr; gap: .8rem; }
.close li::before { content: "\2192"; color: var(--gold); font-weight: 700; }
.close li b { display: block; font-family: var(--jakarta); font-weight: 700; font-size: .98rem; }
.close li span { display: block; margin-top: .2rem; font-size: .95rem; color: rgba(255,255,255,.8); line-height: 1.55; }

.slip { background: var(--plane); color: var(--carbon); border-radius: 4px; padding: clamp(1.5rem, 3.5vw, 2rem); display: grid; gap: .9rem; }
.slip h3 { font-size: 1.35rem; }
.line { display: grid; gap: .3rem; }
.line label { font-size: .9rem; font-weight: 500; color: var(--slate); }
.line input, .line select { font-family: var(--public); font-size: 16px; color: var(--carbon); background: var(--field); border: 1.5px solid var(--edge-2); border-radius: 6px; padding: .8rem .9rem; width: 100%; }
.line input::placeholder { color: var(--wisp); }
.slip small { font-size: .82rem; color: var(--dim); line-height: 1.5; }
.trap { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

/* ============================================================
   BASE
   ============================================================ */

.base-top { display: flex; flex-wrap: wrap; gap: 1.25rem 2rem; justify-content: space-between; align-items: center; }
.base-jump { display: flex; flex-wrap: wrap; gap: .5rem 1.6rem; }
.base-jump a { font-size: .93rem; color: rgba(255,255,255,.7); text-decoration: none; }
.base-jump a:hover { color: var(--gold); }


/* ============================================================
   ARTICLE — inner-page prose, same timetable language:
   ruled and blocked, never carded
   ============================================================ */

.piece { max-width: 46rem; }
.piece > * + * { margin-top: 1.15rem; }
.piece h2 { font-size: clamp(1.5rem, 3vw, 2.05rem); margin-top: 2.75rem; }
.piece h3 { font-family: var(--jakarta); font-weight: 700; font-size: 1.16rem; letter-spacing: -.024em; margin-top: 2rem; }
.piece p { font-size: 1.04rem; color: var(--slate); }
.piece p strong { color: var(--carbon); font-weight: 600; }
.piece ul { margin: 0; padding: 0; list-style: none; display: grid; gap: .7rem; }
.piece ul li { display: grid; grid-template-columns: 1.1rem 1fr; gap: .75rem; font-size: 1.02rem; color: var(--slate); }
.piece ul li::before { content: "\2014"; color: var(--violet); font-weight: 700; }
.piece a:not(.go) { color: var(--violet); text-underline-offset: 3px; }

.lead-in { font-size: clamp(1.12rem, 2.2vw, 1.3rem); color: var(--dim); max-width: 52ch; }

.callout { border-left: 4px solid var(--gold); background: var(--gold-mist); padding: 1.35rem 1.5rem; }
.callout b { display: block; font-family: var(--jakarta); font-weight: 800; font-size: 1.02rem; letter-spacing: -.02em; }
.callout p { margin-top: .4rem; font-size: .99rem; color: var(--slate); }

.factrow { display: grid; grid-template-columns: minmax(0, 11rem) minmax(0, 1fr); gap: clamp(.75rem, 2.5vw, 2rem); padding: 1.15rem 0; border-bottom: 1px solid var(--edge); }
@media (max-width: 640px) { .factrow { grid-template-columns: 1fr; gap: .25rem; } }
.factrow b { font-family: var(--jakarta); font-weight: 800; font-size: 1.08rem; letter-spacing: -.028em; }
.factrow span { font-size: .99rem; color: var(--slate); }
.factlist { border-top: 2px solid var(--carbon); }

.pagehead { border-bottom: 2px solid var(--carbon); }
.pagehead .frame { padding-block: clamp(2.25rem, 5vw, 3.5rem); }
.pagehead h1 { font-size: clamp(2rem, 4.6vw, 3.2rem); max-width: 20ch; }
.pagehead .lead-in { margin-top: 1.2rem; }


/* ============================================================
   HERO SPLIT — the enquiry form sits in the hero, not the tail
   ============================================================ */

.hero-split { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); gap: clamp(2rem, 5vw, 4.5rem); align-items: start; }
@media (max-width: 940px) { .hero-split { grid-template-columns: 1fr; } }

.creds { margin-top: 2rem; display: grid; gap: .85rem; }
.creds div { display: grid; grid-template-columns: 1.4rem 1fr; gap: .85rem; font-size: 1rem; color: var(--slate); }
.creds div::before { content: "\2192"; color: var(--violet); font-weight: 700; }
.creds b { color: var(--carbon); font-weight: 600; }

.enquire { background: var(--plane); border: 2px solid var(--carbon); border-radius: 4px; overflow: hidden; }
.enquire-cap { background: var(--violet); color: #fff; padding: 1.1rem clamp(1.1rem, 3vw, 1.6rem); }
.enquire-cap strong { display: block; font-family: var(--jakarta); font-weight: 800; font-size: 1.18rem; letter-spacing: -.032em; }
.enquire-cap span { display: block; margin-top: .2rem; font-size: .9rem; color: rgba(255,255,255,.84); }
.enquire-body { padding: clamp(1.25rem, 3vw, 1.6rem); display: grid; gap: .85rem; }
.enquire-body small { font-size: .82rem; color: var(--dim); line-height: 1.5; }

/* ============================================================
   WEEK BAND — the timetable gets its own section, with the
   argument set alongside it so the space is not left empty
   ============================================================ */

.weekband { border-top: 2px solid var(--carbon); background: var(--lilac); }
.weekband .frame { padding-block: clamp(3rem, 6vw, 4.75rem); }
.weekband h2 { font-size: clamp(1.85rem, 4vw, 2.7rem); max-width: 20ch; }
.weekband > .frame > .lede { margin-top: 1.1rem; font-size: 1.06rem; color: var(--dim); max-width: 58ch; }

.week-layout { margin-top: clamp(2rem, 4vw, 3rem); display: grid; grid-template-columns: minmax(0, 17rem) minmax(0, 1fr); gap: clamp(1.5rem, 4vw, 3rem); align-items: start; }
@media (max-width: 1020px) { .week-layout { grid-template-columns: 1fr; } }

.week-notes { display: grid; gap: 1.5rem; }
.week-notes div { border-left: 3px solid var(--violet); padding-left: 1.1rem; }
.week-notes b { display: block; font-family: var(--jakarta); font-weight: 700; font-size: 1.02rem; letter-spacing: -.022em; }
.week-notes p { margin-top: .35rem; font-size: .94rem; color: var(--slate); line-height: 1.55; }
.week-notes .hot { border-left-color: var(--gold); }
.week-notes .hot b { color: var(--gold-dark); }
.weekband .timetable { margin-top: 0; }

/* ============================================================
   FOOTER — solid dark, with a real sitemap
   ============================================================ */

.base { background: #16101F; color: rgba(255,255,255,.7); }
.base .frame { padding-block: clamp(2.75rem, 5.5vw, 4rem) clamp(2rem, 4vw, 2.75rem); display: grid; gap: clamp(2rem, 4vw, 2.75rem); }

.base-lead { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr); gap: clamp(2rem, 5vw, 4rem); align-items: start; }
@media (max-width: 880px) { .base-lead { grid-template-columns: 1fr; } }
.base-lead .years { font-family: var(--jakarta); font-weight: 700; font-size: clamp(1.1rem, 2.2vw, 1.45rem); letter-spacing: -.028em; color: #fff; max-width: 30ch; line-height: 1.3; }
.base-lead .years b { color: var(--gold); font-weight: 800; }
.base-lead .years + p { margin-top: .9rem; font-size: .93rem; color: rgba(255,255,255,.6); max-width: 40ch; line-height: 1.6; }

.sitemap { display: grid; grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr)); gap: 1.75rem 2rem; }
.sitemap h3 { font-family: var(--jakarta); font-weight: 800; font-size: .92rem; letter-spacing: -.01em; color: #fff; }
.sitemap ul { margin: .85rem 0 0; padding: 0; list-style: none; display: grid; gap: .55rem; }
.sitemap a { font-size: .92rem; color: rgba(255,255,255,.66); text-decoration: none; }
.sitemap a:hover { color: var(--gold); }

.fineprint { font-size: .84rem; line-height: 1.6; max-width: 82ch; color: rgba(255,255,255,.55); padding-top: 1.5rem; border-top: 1px solid rgba(255,255,255,.14); }
.fineprint b { color: rgba(255,255,255,.85); font-weight: 600; }
.stamp { display: flex; flex-wrap: wrap; gap: .5rem 2rem; justify-content: space-between; font-size: .84rem; color: rgba(255,255,255,.45); }

/* ============================================================
   TOP BAR — utility row above the main nav
   ============================================================ */

.honest .frame { display: flex; flex-wrap: wrap; gap: .4rem 1.5rem; align-items: center; justify-content: space-between; }
.honest nav { display: flex; gap: 1.25rem; }
.honest nav a { color: rgba(255,255,255,.82); text-decoration: none; }
.honest nav a:hover { color: var(--gold); }


/* ============================================================
   BENCH, VOICES, POSTS — furniture for the interior pages
   ============================================================ */

.bench { margin-top: clamp(2rem, 4vw, 3rem); display: grid; grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr)); gap: 1px; background: var(--edge); border: 1px solid var(--edge); }
.bench article { background: var(--plane); padding: 1.6rem 1.5rem; display: grid; gap: .45rem; align-content: start; }
.bench h3 { font-size: 1.12rem; }
.bench .role { font-family: var(--jakarta); font-weight: 700; font-size: .88rem; color: var(--violet); }
.bench p { font-size: .93rem; color: var(--slate); line-height: 1.55; }

.filterbar { margin-top: clamp(1.75rem, 3.5vw, 2.5rem); display: flex; flex-wrap: wrap; gap: .5rem; }
.filterbar button { font-family: var(--public); font-size: .9rem; color: var(--slate); background: var(--plane); border: 1.5px solid var(--edge-2); border-radius: 999px; padding: .5rem 1rem; min-height: 44px; cursor: pointer; transition: all .15s ease; }
.filterbar button:hover { border-color: var(--violet); color: var(--violet); }
.filterbar button[aria-pressed="true"] { background: var(--violet); border-color: var(--violet); color: #fff; font-weight: 600; }

.voices { margin-top: 1.75rem; display: grid; grid-template-columns: repeat(auto-fit, minmax(19rem, 1fr)); gap: 1rem; }
.voice { background: var(--plane); border: 1px solid var(--edge); border-left: 4px solid var(--gold); padding: 1.5rem 1.5rem; display: grid; gap: .6rem; align-content: start; }
.voice[hidden] { display: none; }
.voice .stars { color: var(--gold-dark); font-size: .95rem; letter-spacing: .12em; }
.voice blockquote { margin: 0; font-size: .98rem; color: var(--carbon); line-height: 1.6; }
.voice footer { font-size: .88rem; color: var(--dim); }
.voice footer b { font-family: var(--jakarta); font-weight: 700; color: var(--carbon); display: block; font-size: .96rem; }
.voice-count { margin-top: 1rem; font-size: .9rem; color: var(--dim); }

.postlist { margin-top: clamp(2rem, 4vw, 3rem); border-top: 2px solid var(--carbon); }
.postlist a { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 1.5rem; align-items: baseline; padding: 1.35rem 0; border-bottom: 1px solid var(--edge); text-decoration: none; transition: padding .16s ease, background .16s ease; }
.postlist a:hover { background: var(--violet-mist); padding-inline: .75rem; }
.postlist strong { font-family: var(--jakarta); font-weight: 700; font-size: 1.14rem; letter-spacing: -.026em; display: block; }
.postlist span { display: block; margin-top: .3rem; font-size: .95rem; color: var(--slate); }
.postlist em { font-style: normal; font-size: .88rem; color: var(--violet); white-space: nowrap; }
@media (max-width: 640px) { .postlist a { grid-template-columns: 1fr; } .postlist em { display: none; } }

.byline { display: flex; flex-wrap: wrap; gap: .4rem .75rem; align-items: baseline; margin-top: 1.25rem; font-size: .92rem; color: var(--dim); }
.byline b { font-family: var(--jakarta); font-weight: 700; color: var(--carbon); }
.byline span::before { content: "\00b7"; margin-right: .75rem; color: var(--edge-2); }

.answer { border-left: 4px solid var(--violet); background: var(--violet-mist); padding: 1.35rem 1.5rem; font-size: 1.06rem; line-height: 1.6; color: var(--carbon); }
.answer b { font-family: var(--jakarta); font-weight: 800; }

.qa { margin-top: 2.5rem; border-top: 2px solid var(--carbon); }
.qa details { border-bottom: 1px solid var(--edge); }
.qa summary { cursor: pointer; padding: 1.1rem 0; font-family: var(--jakarta); font-weight: 700; font-size: 1.05rem; letter-spacing: -.02em; list-style: none; display: flex; justify-content: space-between; gap: 1rem; }
.qa summary::-webkit-details-marker { display: none; }
.qa summary::after { content: "+"; color: var(--violet); font-weight: 800; }
.qa details[open] summary::after { content: "\2212"; }
.qa p { padding-bottom: 1.15rem; font-size: .99rem; color: var(--slate); line-height: 1.6; max-width: 62ch; }

.glossary { margin-top: clamp(2rem, 4vw, 3rem); border-top: 2px solid var(--carbon); }
.glossary div { display: grid; grid-template-columns: minmax(0, 12rem) minmax(0, 1fr); gap: clamp(.75rem, 2.5vw, 2rem); padding: 1.2rem 0; border-bottom: 1px solid var(--edge); }
@media (max-width: 680px) { .glossary div { grid-template-columns: 1fr; gap: .3rem; } }
.glossary b { font-family: var(--jakarta); font-weight: 800; font-size: 1.05rem; letter-spacing: -.026em; color: var(--violet); }
.glossary span { font-size: .99rem; color: var(--slate); line-height: 1.6; }


/* ============================================================
   CONTACT WIDGETS
   Doctrine: direct-text channels bottom-LEFT, live chat
   bottom-RIGHT. They never stack. Chat launcher carries the
   rotating adviser's face, not a speech bubble.
   ============================================================ */

.textrail { position: fixed; left: 1rem; bottom: 1rem; z-index: 80; display: grid; gap: .6rem; }
.textrail a {
  display: flex; align-items: center; gap: .6rem; text-decoration: none;
  width: 3.4rem; height: 3.4rem; border-radius: 999px; overflow: hidden;
  box-shadow: 0 6px 20px -6px rgba(21,16,31,.45);
  font-family: var(--jakarta); font-weight: 700; font-size: .92rem; color: #fff;
  padding-left: 1.05rem; white-space: nowrap;
  transition: width .22s cubic-bezier(.22,1,.36,1), background .15s ease;
}
.textrail a svg { width: 1.35rem; height: 1.35rem; flex: none; }
.textrail a span { opacity: 0; transition: opacity .16s ease; }
.textrail a:hover { width: 11.5rem; }
.textrail a:hover span { opacity: 1; }
.wa { background: #25D366; color: var(--carbon); }   /* dark ink: white on this green is 1.98:1 */
.wa:hover { background: #1FBA57; }
.sms { background: var(--violet); }
.sms:hover { background: var(--violet-lift); }
@media (max-width: 640px) { .textrail a:hover { width: 3.4rem; } .textrail a span { display: none; } }

.chatdock { position: fixed; right: 1rem; bottom: 1rem; z-index: 80; display: flex; flex-direction: column; align-items: flex-end; gap: .7rem; }

.chatlaunch {
  display: flex; align-items: center; gap: .7rem; cursor: pointer;
  background: var(--plane); border: 0; border-radius: 999px; padding: .45rem 1.1rem .45rem .45rem;
  box-shadow: 0 8px 26px -8px rgba(21,16,31,.5); min-height: 3.9rem;
  font-family: var(--jakarta); font-weight: 700; font-size: .93rem; color: var(--carbon);
  transition: transform .18s ease;
}
.chatlaunch:hover { transform: translateY(-2px); }
.chatlaunch img, .chatlaunch svg { width: 3rem; height: 3rem; border-radius: 999px; flex: none; }
.chatlaunch i { font-style: normal; display: block; font-family: var(--public); font-weight: 400; font-size: .8rem; color: var(--dim); }
.chatlaunch .dot { width: .55rem; height: .55rem; border-radius: 999px; background: #25D366; flex: none; }
@media (max-width: 640px) { .chatlaunch span.label { display: none; } .chatlaunch { padding-right: .45rem; } }

.chatpanel {
  width: min(23rem, calc(100vw - 2rem)); height: clamp(460px, 72vh, 580px);
  background: var(--plane); border-radius: 14px; overflow: hidden;
  box-shadow: 0 24px 60px -18px rgba(21,16,31,.55);
  display: none; flex-direction: column;
}
.chatpanel[data-open="1"] { display: flex; }
.chathead { background: var(--violet); color: #fff; padding: .95rem 1.1rem; display: flex; align-items: center; gap: .75rem; }
.chathead svg { width: 2.6rem; height: 2.6rem; border-radius: 999px; flex: none; }
.chathead b { font-family: var(--jakarta); font-weight: 800; font-size: 1rem; display: block; }
.chathead span { font-size: .8rem; color: rgba(255,255,255,.82); }
.chathead button { margin-left: auto; background: none; border: 0; color: #fff; font-size: 1.4rem; line-height: 1; cursor: pointer; padding: .2rem .3rem; }

.chatlog { flex: 1; overflow-y: auto; padding: 1.1rem; display: grid; gap: .7rem; align-content: start; background: var(--field); }
.msg { max-width: 85%; padding: .7rem .9rem; border-radius: 12px; font-size: .93rem; line-height: 1.5; }
.msg.them { background: var(--plane); border: 1px solid var(--edge); justify-self: start; }
.msg.me { background: var(--violet); color: #fff; justify-self: end; }

.chatform { border-top: 1px solid var(--edge); padding: .7rem; display: grid; gap: .5rem; background: var(--plane); }
.chatform input, .chatform textarea { font-family: var(--public); font-size: 16px; border: 1px solid var(--edge-2); border-radius: 8px; padding: .6rem .7rem; width: 100%; color: var(--carbon); background: var(--field); }
.chatform textarea { resize: none; min-height: 2.6rem; }
.chatform button { min-height: 44px; }
.chatnote { padding: 0 .7rem .7rem; font-size: .76rem; color: var(--dim); }

@media (max-width: 640px) {
  .chatpanel[data-open="1"] { position: fixed; inset: 0; width: 100vw; height: 100dvh; border-radius: 0; z-index: 95; }
  body.chat-open .textrail, body.chat-open .chatlaunch { display: none; }
}

/* ============================================================
   POPUP — a centre modal, never a corner toast. Honest copy,
   no countdowns and no decrementing scarcity.
   ============================================================ */

.veil { position: fixed; inset: 0; background: rgba(21,16,31,.62); z-index: 90; display: none; align-items: center; justify-content: center; padding: 1rem; }
.veil[data-open="1"] { display: flex; }
.modal { background: var(--plane); border-radius: 12px; width: min(30rem, 100%); max-height: 92vh; overflow-y: auto; box-shadow: 0 30px 70px -20px rgba(0,0,0,.55); }
.modal-cap { background: var(--violet); color: #fff; padding: 1.3rem 1.5rem; position: relative; }
.modal-cap b { display: block; font-family: var(--jakarta); font-weight: 800; font-size: 1.3rem; letter-spacing: -.03em; }
.modal-cap p { margin-top: .35rem; font-size: .93rem; color: rgba(255,255,255,.85); }
.modal-cap button { position: absolute; top: .7rem; right: .8rem; background: none; border: 0; color: #fff; font-size: 1.5rem; line-height: 1; cursor: pointer; padding: .2rem .4rem; }
.modal-body { padding: 1.5rem; display: grid; gap: .85rem; }
.modal-body small { font-size: .8rem; color: var(--dim); line-height: 1.5; }

/* ============================================================
   E-E-A-T — byline links, adviser anchors, editorial note
   ============================================================ */

.byline a { color: var(--violet); text-decoration: underline; text-underline-offset: 3px; }
.bench article { scroll-margin-top: 5rem; }
.bench .yrs { font-size: .86rem; color: var(--dim); }
.standards { margin-top: clamp(2rem, 4vw, 3rem); border: 2px solid var(--carbon); border-radius: 4px; background: var(--plane); padding: clamp(1.5rem, 3.5vw, 2.25rem); }
.standards h2 { font-size: clamp(1.35rem, 2.6vw, 1.7rem); }
.standards ul { margin: 1.1rem 0 0; padding: 0; list-style: none; display: grid; gap: .75rem; }
.standards li { display: grid; grid-template-columns: 1.2rem 1fr; gap: .8rem; font-size: .97rem; color: var(--slate); line-height: 1.55; }
.standards li::before { content: "\2713"; color: var(--violet); font-weight: 800; }

@media (prefers-reduced-motion: reduce) { * { transition: none !important; } }

/* ============================================================
   VERTICAL RHYTHM REPAIR

   `.piece ul { margin: 0 }` (0,1,1) outranked `.piece > * + *`
   (0,1,0), so a list opened flush against the heading above it:
   measured 0px, where a paragraph in the same place got 18px.
   ============================================================ */

.piece > * + ul,
.piece > * + ol { margin-top: 1.15rem; }
.piece > h2 + ul,
.piece > h2 + ol,
.piece > h3 + ul,
.piece > h3 + ol { margin-top: .95rem; }
.piece > :first-child { margin-top: 0; }