/* MedMojo homepage and landing page styles. Moved out of index.html on 02-OCT-2026 so the
   prior authorization landing page shares one copy. Loaded by / and /prior-authorization-software. */
:root {
  --navy: #1D2B45; --navy2: #16223A; --mint: #7FD9BE; --sea: #3DB897; --teal: #2AA88C; --deep: #1A8F7A; --accent: #E8A33D;
  --mist: #F4F7F7; --line: #DFE6E8; --ink: #1D2B45; --muted: #56657A;
}
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 100px; }
body { margin: 0; font-family: "DM Sans", system-ui, sans-serif; color: var(--ink); background: #fff; -webkit-font-smoothing: antialiased; }
a { color: inherit; text-decoration: none; }
.wrap { max-width: 1200px; margin: 0 auto; padding: 0 32px; }
h1, h2 { font-family: "Fraunces", Georgia, serif; font-weight: 600; letter-spacing: -.015em; color: var(--navy); }
h2 { font-size: 44px; line-height: 1.1; margin: 0 0 18px; max-width: 760px; }
.eyebrow { font-size: 12.5px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: #0D7E6E; margin: 0 0 18px; }
.sub { font-size: 18px; line-height: 1.6; color: var(--muted); max-width: 620px; margin: 0 0 44px; }
.btn { display: inline-flex; align-items: center; gap: 10px; padding: 15px 21px; border-radius: 12px; font-weight: 700; font-size: 16px; border: 1px solid transparent; cursor: pointer; font-family: inherit; transition: transform .15s, box-shadow .15s; }
.btn:hover { transform: translateY(-1px); }
.btn.grad { color: #fff; background: linear-gradient(135deg, #3DB897, #2AA88C 45%, #17806E); box-shadow: 0 12px 28px -12px rgba(26,143,122,.65); }
.btn.grad:hover { box-shadow: 0 16px 32px -12px rgba(26,143,122,.8); }
.btn.ghost { border: 1.5px solid #2A5A8C; color: var(--navy); background: #fff; box-shadow: 0 8px 18px -12px rgba(42,90,140,.45); }
.btn.ghost:hover { border-color: var(--navy); }
.btn.ghost svg { color: #0D7E6E; }
.btn.light { background: #fff; color: var(--navy); }
.btn.outline-light { border-color: rgba(255,255,255,.35); color: #fff; }
.ctas { display: flex; gap: 12px; flex-wrap: wrap; }
/* FREE MONTH, 01-OCT-2026: the offer in one line under the hero buttons. */
.hero .trial { margin: 14px 0 0; max-width: 540px; font-size: 14.5px; line-height: 1.5; color: var(--muted); }
.hero .trial a { color: #0D7E6E; font-weight: 700; text-decoration: none; white-space: nowrap; }
.hero .trial a:hover { text-decoration: underline; }
.fine { display: flex; gap: 8px 16px; flex-wrap: wrap; margin-top: 22px; font-size: 13.5px; color: var(--muted); }
.fine span { display: inline-flex; gap: 7px; align-items: center; }

/* hero */
/* THE HAZE, 30-SEP-2026: soft mint and blue-teal light behind the hero, like
   frosted glass in a bright office, drawn in CSS so it costs no download.
   ::before is the colored light, blurred; ::after is soft vertical window
   light; both fade out toward the headline so the text stays crisp. */
/* HERO BACKGROUND v2 (mockup): a white room with light, not a green wash. Three layers:
   1) the office photograph, faded to white behind the headline; 2) a small mint glow and a
   cool blue-gray shadow placed behind the dashboard only; 3) the dashboard itself, crisp. */
.hero { position: relative; overflow: hidden; isolation: isolate; background: #FBFDFD url(/img/hero-office.webp) right center / cover no-repeat; }
.hero::before { content: ""; position: absolute; inset: -10% -6% -10% 28%; z-index: -1; pointer-events: none; filter: blur(46px);
  background:
    radial-gradient(38% 46% at 70% 38%, rgba(72,158,182,.52), transparent 72%),
    radial-gradient(34% 42% at 94% 70%, rgba(40,70,120,.30), transparent 74%),
    radial-gradient(30% 34% at 96% 12%, rgba(118,188,204,.44), transparent 72%),
    radial-gradient(22% 28% at 50% 82%, rgba(127,217,190,.16), transparent 72%); }
.hero::after { content: ""; position: absolute; inset: 0; z-index: -2; pointer-events: none;
  background:
    linear-gradient(90deg, rgba(255,255,255,.85) 0%, rgba(255,255,255,.6) 32%, rgba(255,255,255,.15) 55%, rgba(255,255,255,0) 72%),
    linear-gradient(90deg, rgba(100,172,186,0) 42%, rgba(100,172,186,.14) 68%, rgba(76,150,170,.22) 100%),
    linear-gradient(180deg, rgba(255,255,255,0) 72%, #FFFFFF 100%); }
.hero .wrap { display: grid; grid-template-columns: minmax(0,1.12fr) minmax(0,1fr); gap: 36px; align-items: center; padding-top: 132px; padding-bottom: 60px; }
h1 { font-size: 60px; line-height: 1.02; margin: 0 0 24px; }
h1 .g { color: #0D7E6E; }
/* HOMEPAGE HEADLINE, 02-OCT-2026: "Keep your practice independent." is the large statement and
   the slogan "Fight denials, and win." sits under it as the smaller second line (Calvin's
   layout, after the Vanta call). Applies only where the h1 carries the .hk line, so the landing
   page headline is unchanged. */
h1 .hk { display: block; font-size: .64em; line-height: 1.15; margin-top: .8em; letter-spacing: -.01em; }
h1:has(.hk) { font-size: 60px; line-height: 1; margin-bottom: 14px; }
.lede { font-size: 18.5px; line-height: 1.62; color: var(--muted); margin: 0 0 28px; max-width: 580px; }
.lede b { color: var(--navy); font-weight: 500; }
.lede b.pai { color: #0D7E6E; font-weight: 700; }
.shotwrap { perspective: 1600px; position: relative; }
.shot { width: 148%; height: auto; max-width: none; border-radius: 18px; display: block; box-shadow: 0 50px 90px -34px rgba(29,43,69,.55), 0 12px 24px -12px rgba(29,43,69,.25), 0 0 0 1px rgba(29,43,69,.12); transform: rotateY(-14deg) rotateX(5deg) rotateZ(-1deg); transform-origin: left center; -webkit-mask-image: linear-gradient(90deg, #000 88%, transparent); mask-image: linear-gradient(90deg, #000 88%, transparent); transition: transform 1.4s cubic-bezier(.2,.7,.2,1), opacity .9s ease; }
.pre .shot { transform: none; opacity: 0; }
.disc { position: absolute; right: 18px; bottom: 12px; z-index: 2; font-size: 10.5px; letter-spacing: .1em; text-transform: uppercase; color: #8795A6; }
.note { position: absolute; left: 6%; bottom: -46px; display: flex; gap: 8px; align-items: flex-end; font-family: "Caveat", cursive; font-size: 25px; color: #0D7E6E; transform: rotate(-3deg); }

/* proof strip */
.proof { background: var(--mist); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.proof ul { list-style: none; margin: 0 auto; padding: 30px 32px; max-width: 1200px; display: grid; grid-template-columns: repeat(4, 1fr); }
.proof li { padding: 0 26px; border-left: 1px solid var(--line); transition: opacity .7s ease, transform .7s ease; }
.proof li:first-child { border-left: 0; padding-left: 0; }
.pre .proof li { opacity: 0; transform: translateY(10px); }
.proof li:nth-child(2) { transition-delay: .12s; } .proof li:nth-child(3) { transition-delay: .24s; } .proof li:nth-child(4) { transition-delay: .36s; }
.proof b { display: block; font-family: "Fraunces", Georgia, serif; font-weight: 600; font-size: 23px; color: var(--navy); margin-bottom: 4px; font-variant-numeric: lining-nums; }
.proof span { font-size: 14.5px; color: var(--muted); }
.proof b .n { font-size: inherit; color: inherit; }

/* why */
.why { padding: 96px 0 84px; }
.why .wrap { display: grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items: start; }
.why p.body { font-size: 17.5px; line-height: 1.7; color: var(--muted); margin: 0; }
.vera { border: 1px solid var(--line); border-radius: 20px; padding: 30px 32px; background: #fff; box-shadow: 0 24px 50px -36px rgba(29,43,69,.4); }
.vera p.lbl { margin: 0 0 20px; font-size: 12.5px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--muted); }
.vera ul { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 26px 28px; }
.vera b { display: block; font-family: "Fraunces", Georgia, serif; font-size: 40px; color: #0D7E6E; line-height: 1; margin-bottom: 8px; font-variant-numeric: lining-nums; }
.vera span { font-size: 15px; line-height: 1.45; color: var(--ink); }
.vera .close-line { margin: 24px 0 0; padding-top: 18px; border-top: 1px solid var(--line); font-weight: 700; color: var(--navy); }
.vera .src { margin: 8px 0 0; font-size: 12.5px; color: var(--muted); }

/* features */
.features { padding: 90px 0 96px; background: linear-gradient(#fff, var(--mist)); }
.cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.card { border: 1px solid var(--line); border-radius: 18px; padding: 30px 28px; background: #fff; transition: box-shadow .2s, transform .2s; }
.card:hover { transform: translateY(-3px); box-shadow: 0 20px 40px -24px rgba(29,43,69,.35); }
.ic { width: 58px; height: 58px; border-radius: 50%; display: grid; place-items: center; margin-bottom: 22px; }
.card h3 { font-family: "Poppins", sans-serif; font-weight: 600; font-size: 21px; margin: 0 0 12px; color: var(--navy); }
.card p { color: var(--muted); line-height: 1.6; margin: 0 0 20px; font-size: 15.5px; }
.card ul { list-style: none; padding: 0; margin: 0; display: grid; gap: 11px; font-size: 15px; }
.card li { display: flex; gap: 10px; align-items: center; }

/* navy band */
.band { position: relative; overflow: hidden; background: radial-gradient(700px 360px at 95% 0%, rgba(61,184,151,.40), transparent 72%), linear-gradient(135deg, #1D2B45 0%, #16223A 60%, #12303A 100%); color: #E9F1F5; }
.band::before { content: ""; position: absolute; inset: -30%; background: radial-gradient(420px 260px at 30% 40%, rgba(127,217,190,.16), transparent 70%), radial-gradient(520px 300px at 75% 70%, rgba(42,168,140,.14), transparent 70%); animation: drift 22s ease-in-out infinite alternate; pointer-events: none; }
@keyframes drift { 0% { transform: translate(-4%,-3%) scale(1); } 50% { transform: translate(3%,2%) scale(1.06); } 100% { transform: translate(-2%,4%) scale(1); } }
.band .wrap { position: relative; display: grid; grid-template-columns: 1fr 1.15fr; gap: 48px; padding-top: 80px; padding-bottom: 86px; align-items: center; }
.band .eyebrow { color: var(--mint); }
.band h2 { color: #fff; font-size: 42px; }
.band h2 em { font-style: italic; color: var(--mint); }
.band p { color: #C3D0DC; font-size: 17px; line-height: 1.6; max-width: 480px; }
.band .spec { border-left: 1px solid rgba(255,255,255,.15); padding-left: 44px; }
.band .spec p.lbl { font-size: 12.5px; letter-spacing: .16em; font-weight: 700; color: var(--mint); margin: 0 0 26px; }
.band ul { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 30px 10px; }
.band li { display: flex; flex-direction: column; align-items: center; gap: 12px; text-align: center; font-weight: 500; font-size: 15px; color: #fff; }
.band li svg { width: 46px; height: 46px; color: var(--mint); }
.hand { font-family: "Caveat", cursive; font-size: 25px; color: #D6E7EE; margin: 30px 0 0; transform: rotate(-3deg); display: inline-block; }

/* trust */
.trust { padding: 90px 0; }
/* SECURITY SECTION, 02-OCT-2026: headline, shield with three pills, six cards, badge band.
   Used by / and /prior-authorization-software. Icons are our own drawings, not vendor logos. */
.sec { background: linear-gradient(#fff, var(--mist)); }
.sec svg { fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.sec .g { color: #0D7E6E; }
.sec-top { display: grid; grid-template-columns: 1.35fr 1fr; gap: 40px; align-items: center; margin-bottom: 36px; }
.sec h2 { font-size: 46px; line-height: 1.08; max-width: none; }
.sec h2 .g { display: block; }
.sec .sub { margin: 0; max-width: 600px; }
.sec .sub b { color: var(--navy); }
.sec-art { display: flex; align-items: center; gap: 22px; justify-content: flex-end; }
.sec-art .shield { width: 190px; flex: 0 0 190px; filter: drop-shadow(0 22px 30px rgba(13,126,110,.22)); stroke: none; }
.sec-art .shield * { stroke-linecap: round; }
.pills { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.pills li { display: flex; align-items: center; gap: 12px; background: #fff; border: 1px solid #DCEFE8; border-radius: 14px; padding: 12px 16px; box-shadow: 0 10px 24px -18px rgba(29,43,69,.5); white-space: nowrap; }
.pills i, .sec-card i, .badges i { display: grid; place-items: center; color: #0D7E6E; background: #E3F6EF; border-radius: 10px; flex: none; }
.pills i { width: 36px; height: 36px; } .pills svg { width: 20px; height: 20px; }
.pills span, .badges span { display: block; font-size: 13px; color: var(--muted); line-height: 1.35; }
.pills b, .badges b { display: block; color: var(--navy); font-size: 15px; }
.sec-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.sec-card { display: flex; gap: 16px; background: #fff; border: 1px solid var(--line); border-radius: 16px; padding: 22px; box-shadow: 0 14px 30px -24px rgba(29,43,69,.55); }
.sec-card i { width: 48px; height: 48px; border-radius: 12px; } .sec-card svg { width: 26px; height: 26px; }
.sec-card h3 { margin: 2px 0 6px; font-size: 17.5px; color: var(--navy); }
.sec-card p { margin: 0; color: var(--muted); line-height: 1.55; font-size: 15px; }
.sec-band { margin-top: 18px; display: flex; align-items: center; gap: 22px; background: #E9F7F2; border: 1px solid #CFEBE1; border-radius: 18px; padding: 24px 28px; }
.sec-seal svg { width: 58px; height: 58px; stroke: none; display: block; }
.sec-line { margin: 0; font-family: "Fraunces", Georgia, serif; font-weight: 600; font-size: 19.5px; line-height: 1.35; color: var(--navy); flex: 1 1 340px; padding-left: 22px; border-left: 1px solid #BFE0D5; }
.sec-line .g { display: block; }
.sec-right { display: grid; gap: 14px; justify-items: stretch; }
.badges { list-style: none; margin: 0; padding: 0; display: flex; gap: 22px; }
.badges li { display: flex; align-items: center; gap: 10px; }
.badges i { width: 38px; height: 38px; background: #fff; border: 1px solid #CFEBE1; } .badges svg { width: 21px; height: 21px; }
.badges b { font-size: 14.5px; } .badges span { font-size: 11px; letter-spacing: .09em; text-transform: uppercase; }
.badges b { letter-spacing: 0; text-transform: none; }
.sec-right .btn { justify-content: center; padding: 12px 18px; font-size: 15px; }
@media (max-width: 1000px) {
  .sec-top { grid-template-columns: 1fr; gap: 28px; }
  .sec-art { justify-content: flex-start; }
  .sec-grid { grid-template-columns: 1fr 1fr; }
  .sec-band { flex-wrap: wrap; }
}
@media (max-width: 640px) {
  .sec h2 { font-size: 36px; }
  .sec-art .shield { display: none; }
  .pills { width: 100%; } .pills li { white-space: normal; }
  .sec-grid { grid-template-columns: 1fr; }
  .sec-band { padding: 22px 20px; gap: 16px; }
  .sec-line { border-left: 0; padding-left: 0; flex-basis: 100%; font-size: 19px; }
  .sec-seal svg { width: 46px; height: 46px; }
  .badges { flex-direction: column; gap: 12px; }
  .sec-right { width: 100%; }
}

/* partners strip */
.assoc { padding: 72px 0; }
.assoc-box { border-radius: 22px; padding: 44px 48px; background: linear-gradient(135deg, #E9F7F2, #EEF3F9); display: grid; grid-template-columns: 1.4fr 1fr; gap: 30px; align-items: center; }
.assoc-box h2 { font-size: 34px; margin: 0 0 10px; }
.assoc-box p { margin: 0; color: var(--muted); font-size: 16.5px; line-height: 1.6; }
.assoc-box .ctas, .close-box .ctas { flex-direction: column; align-items: stretch; width: max-content; max-width: 100%; margin-left: auto; }
.assoc-box .ctas .btn, .close-box .ctas .btn { justify-content: center; }

/* demo + form */
.demo { padding: 90px 0; background: var(--mist); border-top: 1px solid var(--line); }
/* START OR DEMO CHOOSER, 01-OCT-2026: the section opens on two equal cards, green to start the
   free month and navy to book a demo. The form and the calendar stay closed until one is picked;
   /#start and /#book links from anywhere on the site open the matching one directly. Without
   JavaScript both panels simply show. */
.choose { display: grid; grid-template-columns: 1fr 1fr; gap: 26px; align-items: stretch; }
.choice { display: flex; flex-direction: column; background: #fff; border-radius: 20px; padding: 30px 30px 28px; transition: opacity .2s, box-shadow .2s; }
.choice.go { border: 2px solid #A8E3CF; box-shadow: 0 30px 60px -40px rgba(26,143,122,.55), 0 0 0 6px rgba(127,217,190,.14); }
.choice.see { border: 2px solid var(--navy); box-shadow: 0 30px 60px -40px rgba(29,43,69,.5), 0 0 0 6px rgba(42,90,140,.13); }
.choice p.eyebrow { margin: 0 0 10px; font-size: 12.5px; line-height: 1.4; color: #0D7E6E; }
.choice.see p.eyebrow { color: var(--navy); }
.choice h3 { font-family: "Fraunces", Georgia, serif; font-weight: 600; font-size: 25px; line-height: 1.2; margin: 0 0 8px; color: var(--navy); }
.choice p { margin: 0; color: var(--muted); font-size: 15.5px; line-height: 1.55; }
.choice ul { list-style: none; margin: 18px 0 24px; padding: 0; display: grid; gap: 10px; font-size: 15.5px; color: var(--ink); }
.choice li { display: flex; gap: 10px; align-items: center; }
.choice .btn { margin-top: auto; justify-content: center; }
.btn.navy { color: #fff; background: linear-gradient(135deg, #2B4066, var(--navy)); box-shadow: 0 12px 28px -12px rgba(29,43,69,.7); }
.btn.navy:hover { box-shadow: 0 16px 32px -12px rgba(29,43,69,.85); }
.demo.picked-start .choice.see, .demo.picked-book .choice.go { opacity: .6; }
.demo.picked-start .choice.see:hover, .demo.picked-book .choice.go:hover { opacity: 1; }
.chosen { max-width: 820px; margin: 30px auto 0; }
.chosen .panel + .panel { margin-top: 26px; }
.js-choose .chosen .panel:not(.open) { display: none; }
.chosen .panel.cal { border: 2px solid var(--navy); box-shadow: 0 30px 60px -40px rgba(29,43,69,.5), 0 0 0 6px rgba(42,90,140,.13); }
.demo-grid { display: grid; grid-template-columns: 1.05fr 1fr; gap: 28px; align-items: start; }
/* FREE MONTH, 01-OCT-2026: starting the free month is the primary action, so the form gets
   the mint frame and goes first; booking a demo is the quieter second choice. */
.chosen .panel.form-card { border: 2px solid #A8E3CF; background: #fff; box-shadow: 0 30px 60px -40px rgba(26,143,122,.55), 0 0 0 6px rgba(127,217,190,.14); }
.anchor { position: relative; top: -110px; display: block; height: 0; }
#start, #book { scroll-margin-top: 96px; }
.cal-head { display: flex; align-items: center; gap: 10px; padding: 16px 22px; border-bottom: 1px solid var(--line); font-weight: 700; color: var(--navy); font-size: 15.5px; }
.cal-head small { margin-left: auto; font-weight: 500; color: var(--muted); font-size: 13.5px; }
.expect { display: flex; flex-wrap: wrap; gap: 12px 24px; margin: 0 0 26px; font-size: 15px; color: var(--ink); }
.expect span { display: inline-flex; gap: 8px; align-items: center; }
.panel { background: #fff; border: 1px solid var(--line); border-radius: 20px; overflow: hidden; box-shadow: 0 24px 50px -36px rgba(29,43,69,.4); }
.cal-widget { min-width: 320px; min-height: 640px; }
.cal-widget iframe { display: block; width: 100%; min-height: 640px; border: 0; }
.form-card { padding: 28px 26px; background: #FBFDFD; box-shadow: none; }
.form-card h3 { font-family: "Fraunces", Georgia, serif; font-size: 22px; margin: 0 0 8px; color: var(--navy); }
.form-card .form-card-sub { margin: 0 0 22px; color: var(--muted); line-height: 1.55; font-size: 15px; }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.form-group { display: flex; flex-direction: column; gap: 6px; margin-bottom: 14px; }
.form-group label { font-size: 13px; font-weight: 700; color: var(--navy); }
.form-group .opt { font-weight: 400; color: var(--muted); }
.form-group textarea { font: inherit; font-size: 15px; padding: 11px 12px; border: 1px solid #CBD6DA; border-radius: 10px; background: #fff; color: var(--ink); width: 100%; resize: vertical; }
.form-group textarea:focus { outline: 2px solid rgba(42,168,140,.35); border-color: var(--teal); }
.form-group input, .form-group select { font: inherit; font-size: 15px; padding: 11px 12px; border: 1px solid #CBD6DA; border-radius: 10px; background: #fff; color: var(--ink); width: 100%; }
.form-group input:focus, .form-group select:focus { outline: 2px solid rgba(42,168,140,.35); border-color: var(--teal); }
.btn-submit { width: 100%; justify-content: center; margin-top: 6px; }
.form-disclaimer { margin: 16px 0 0; font-size: 13px; color: var(--muted); line-height: 1.5; }
.form-disclaimer a { color: #0D7E6E; font-weight: 700; }
.form-error { display: none; margin: 12px 0 0; padding: 10px 12px; border-radius: 10px; background: #FDECEC; color: #9B1C1C; font-size: 14px; }
.success-state { display: none; padding: 40px 28px; text-align: center; }
.success-icon { width: 54px; height: 54px; border-radius: 50%; margin: 0 auto 14px; display: grid; place-items: center; background: #E3F6EF; color: #0D7E6E; font-size: 26px; font-weight: 700; }
.success-state h3 { font-family: "Fraunces", Georgia, serif; font-size: 24px; margin: 0 0 8px; color: var(--navy); }
.success-state p { color: var(--muted); line-height: 1.55; margin: 0; }

/* blog */
.posts { padding: 90px 0; }
.posts-head { display: flex; justify-content: space-between; align-items: end; gap: 20px; margin-bottom: 34px; }
.posts-head h2 { margin: 0; }
.posts-head a { font-weight: 700; color: #0D7E6E; display: inline-flex; gap: 8px; align-items: center; white-space: nowrap; }
.post-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.post { display: flex; flex-direction: column; gap: 14px; border: 1px solid var(--line); border-radius: 18px; padding: 26px; transition: box-shadow .2s, transform .2s; }
.post:hover { transform: translateY(-3px); box-shadow: 0 20px 40px -24px rgba(29,43,69,.35); }
.post-tag { align-self: flex-start; font-size: 12px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: #0A6E60; /* 11-OCT-2026 a11y: was #0D7E6E, 4.42:1 on the tint */ background: #E3F6EF; padding: 5px 10px; border-radius: 999px; }
.post h3 { margin: 0; font-family: "Fraunces", Georgia, serif; font-size: 21px; line-height: 1.3; color: var(--navy); flex: 1; }
.post-more { display: inline-flex; gap: 8px; align-items: center; font-weight: 700; font-size: 14.5px; color: #0D7E6E; }

/* closing */
.close { padding: 20px 0 96px; }
.close-box { position: relative; overflow: hidden; border-radius: 24px; padding: 56px; background: linear-gradient(135deg, #1D2B45, #16223A 60%, #12303A); display: grid; grid-template-columns: 1.2fr 1fr; gap: 30px; align-items: center; }
.close-box h2 { color: #fff; margin: 0 0 12px; font-size: 40px; }
.close-box h2 .g { color: #7FD9BE; white-space: nowrap; }
.close-box p { color: #C3D0DC; margin: 0; font-size: 17px; line-height: 1.6; }

footer { border-top: 1px solid var(--line); padding: 44px 0 36px; }
.foot { display: grid; grid-template-columns: 1.3fr 1fr 1fr 1fr; gap: 30px; }
.foot img { height: 30px; width: auto; display: block; margin-bottom: 14px; }
.foot p { margin: 0; color: var(--muted); font-size: 14.5px; line-height: 1.6; max-width: 280px; }
.foot h4 { margin: 4px 0 14px; font-size: 12.5px; letter-spacing: .14em; text-transform: uppercase; color: var(--navy); }
.foot ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; font-size: 14.5px; color: var(--muted); }
.foot a:hover { color: #0D7E6E; }
.legal { margin-top: 34px; padding-top: 20px; border-top: 1px solid var(--line); font-size: 13px; color: var(--muted); }

.reveal { opacity: 0; transform: translateY(16px); transition: opacity .6s ease, transform .6s ease; }
.reveal.in { opacity: 1; transform: none; }

@media (max-width: 1000px) {
  .wrap { padding: 0 16px; }
  .hero .wrap { padding-top: 104px; }
  .hero .wrap, .why .wrap, .band .wrap, .demo-grid, .choose, .assoc-box, .close-box { grid-template-columns: 1fr; }
  h1 { font-size: 42px; } h1:has(.hk) { font-size: 42px; } h2, .band h2, .close-box h2 { font-size: 32px; }
  .shot { width: 100%; height: auto; transform: none; -webkit-mask-image: none; mask-image: none; } .pre .shot { transform: none; }
  .cal-head small { display: none; }
  .note { display: none; } .disc { right: 12px; bottom: 8px; font-size: 9.5px; }
  .proof ul { grid-template-columns: 1fr 1fr; gap: 22px 0; padding: 26px 16px; }
  .proof li:nth-child(3) { border-left: 0; padding-left: 0; }
  .cards, .post-grid { grid-template-columns: 1fr; }
  .band .spec { border-left: 0; padding-left: 0; } .band ul { grid-template-columns: repeat(2, 1fr); }
  .assoc-box, .close-box { padding: 32px 22px; } .assoc-box .ctas, .close-box .ctas { margin-left: 0; }
  .form-row { grid-template-columns: 1fr; }
  .posts-head { flex-direction: column; align-items: start; }
  .foot { grid-template-columns: 1fr 1fr; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .band::before { animation: none; }
  .shot, .proof li, .reveal { transition: none; }
  .reveal { opacity: 1; transform: none; }
}

/* MY CALENDAR SECTION, 08-OCT-2026 (R20). Sits between "How it works" and "Why". The picture is
   drawn here in CSS so it is an illustration, never the portal screen (R10). No red: red means money. */
.calsec { padding: 92px 0 96px; background: linear-gradient(var(--mist), #fff); }
.calsec .wrap { display: grid; grid-template-columns: minmax(0,.95fr) minmax(0,1.05fr); gap: 56px; align-items: center; }
.calsec h2 .g { color: #0D7E6E; }
.calsec .sub { margin-bottom: 30px; }
.newtag { display: inline-block; padding: 3px 9px; margin-right: 8px; border-radius: 999px; background: #0D7E6E; color: #fff; letter-spacing: .12em; }
.cal-pts { list-style: none; margin: 0; padding: 0; display: grid; gap: 20px; }
.cal-pts li { display: flex; gap: 16px; align-items: flex-start; }
.cal-pts i { flex: none; width: 46px; height: 46px; border-radius: 50%; display: grid; place-items: center; }
.cal-pts b { display: block; font-family: "Poppins", sans-serif; font-weight: 600; font-size: 17px; color: var(--navy); margin: 2px 0 4px; }
.cal-pts span { color: var(--muted); font-size: 15.5px; line-height: 1.55; }
.cal-art { position: relative; padding-bottom: 70px; }
.cal-art::before { content: ""; position: absolute; inset: 6% -4% -6% 8%; z-index: 0; filter: blur(40px); pointer-events: none;
  background: radial-gradient(50% 50% at 60% 40%, rgba(72,158,182,.32), transparent 72%), radial-gradient(40% 40% at 30% 80%, rgba(127,217,190,.30), transparent 72%); }
.ca-card { position: relative; z-index: 1; background: #fff; border: 1px solid var(--line); border-radius: 20px; padding: 22px 22px 24px; box-shadow: 0 30px 60px -30px rgba(29,43,69,.40); }
.ca-head { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 16px; }
.ca-head b { font-family: "Fraunces", Georgia, serif; font-size: 22px; color: var(--navy); }
.ca-key { display: flex; align-items: center; gap: 6px 8px; flex-wrap: wrap; font-size: 12.5px; color: var(--muted); }
.ca-key em { width: 10px; height: 10px; border-radius: 3px; display: inline-block; }
.ca-key em + * { margin-right: 8px; }
.k-exp { background: #E9A23B; } .k-fu { background: #4A7FBF; margin-left: 10px; }
.ca-grid { display: grid; grid-template-columns: repeat(5, minmax(0,1fr)); gap: 8px; }
.ca-dow { font-size: 11.5px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: #8795A6; padding: 0 4px 2px; }
.ca-day { position: relative; min-height: 96px; border-radius: 12px; background: #F6F9FA; padding: 8px 7px; }
.ca-day u { text-decoration: none; display: inline-grid; place-items: center; min-width: 24px; height: 24px; border-radius: 50%; font-size: 13px; font-weight: 700; color: var(--navy); margin-bottom: 6px; }
.ca-day.today u { background: var(--navy); color: #fff; }
.ca-day .e { margin: 0 0 5px; padding: 5px 7px; border-radius: 8px; font-size: 12.5px; font-weight: 600; line-height: 1.2; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; border-left: 3px solid; }
.e.soon { background: #FDF1DC; color: #8A560D; border-color: #E9A23B; }
.e.fu { background: #E6EEF7; color: #24507E; border-color: #4A7FBF; }
.e.on { box-shadow: 0 0 0 2px #E9A23B; }
.ca-day.hot { z-index: 3; }
.ca-pop { position: absolute; left: 50%; top: calc(100% - 10px); transform: translateX(-38%); width: 220px; background: var(--navy); color: #fff; border-radius: 14px; padding: 14px 16px; box-shadow: 0 20px 40px -16px rgba(22,34,58,.6); }
.ca-pop::before { content: ""; position: absolute; top: -6px; left: 38%; width: 12px; height: 12px; background: var(--navy); transform: rotate(45deg); }
.ca-pop small { display: block; font-size: 11.5px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: #F2C177; margin-bottom: 6px; }
.ca-pop b { display: block; font-size: 16px; }
.ca-pop span { display: block; font-size: 13px; color: #C3D0DC; margin: 2px 0 10px; }
.ca-pop a { font-size: 13.5px; font-weight: 700; color: var(--mint); }
.disc2 { position: absolute; right: 4px; bottom: 38px; z-index: 1; font-size: 10.5px; letter-spacing: .1em; text-transform: uppercase; color: #8795A6; }
@media (max-width: 1000px) {
  .calsec .wrap { grid-template-columns: 1fr; gap: 40px; }
  .calsec h2 { font-size: 32px; }
}
@media (max-width: 640px) {
  .calsec { padding: 64px 0 68px; }
  .ca-card { padding: 16px 12px 18px; }
  .ca-grid { gap: 5px; }
  .ca-day { min-height: 84px; padding: 6px 4px; }
  .ca-day .e { font-size: 10.5px; padding: 4px 4px; border-left-width: 2px; }
  .ca-dow { font-size: 10px; letter-spacing: .04em; padding: 0 2px; }
  .fi { display: none; }
  .cal-art { padding-bottom: 130px; }
  .disc2 { bottom: 0; }
  .ca-pop { width: 200px; transform: translateX(-30%); }
  .ca-pop::before { left: 30%; }
}

/* AI-DRAFTED APPEALS SECTION, 08-OCT-2026 (R20). Before My Calendar, mirrored (picture left).
   The letter is drawn here in CSS so it is an illustration, never the portal screen (R10). */
.apsec { padding: 92px 0 96px; background: linear-gradient(var(--mist), #fff); }
.apsec .wrap { display: grid; grid-template-columns: minmax(0,1.05fr) minmax(0,.95fr); gap: 56px; align-items: center; }
.apsec h2 .g { color: #0D7E6E; }
.apsec .sub { margin-bottom: 30px; }
.calsec { background: #fff; }
.ap-art { position: relative; padding-bottom: 34px; }
.ap-art::before { content: ""; position: absolute; inset: 4% 6% -2% -4%; z-index: 0; filter: blur(40px); pointer-events: none;
  background: radial-gradient(50% 50% at 40% 40%, rgba(127,217,190,.34), transparent 72%), radial-gradient(40% 40% at 75% 80%, rgba(72,158,182,.26), transparent 72%); }
.lt-card { position: relative; z-index: 1; background: #fff; border: 1px solid var(--line); border-radius: 20px; padding: 24px 24px 18px; box-shadow: 0 30px 60px -30px rgba(29,43,69,.40); }
.lt-head { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; padding-bottom: 14px; margin-bottom: 8px; border-bottom: 1px solid var(--line); }
.lt-head b { font-family: "Fraunces", Georgia, serif; font-size: 20px; color: var(--navy); }
.lt-head small { font-size: 13px; color: var(--muted); }
.lt-tag { font-size: 11px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: #0D7E6E; background: #E3F6EF; border-radius: 999px; padding: 3px 9px; }
.lt-l { position: relative; display: flex; gap: 12px; align-items: flex-start; justify-content: space-between; margin: 0; padding: 10px 10px; border-radius: 10px; font-size: 14.5px; line-height: 1.5; color: var(--ink); }
.lt-l > span:first-child { flex: 1; }
.lt-l.on { background: #F1FAF6; box-shadow: inset 3px 0 0 #3DB897; }
.lt-l.gone > span:first-child { color: #8795A6; text-decoration: line-through; }
.lt-src { flex: none; font-style: normal; font-size: 11.5px; font-weight: 700; border-radius: 999px; padding: 3px 9px; white-space: nowrap; margin-top: 1px; }
.lt-src.payer { background: #E6EBF3; color: #1D2B45; }
.lt-src.prac { background: #E3F6EF; color: #0B6B5E; }
.lt-src.rm { background: #FDF1DC; color: #8A560D; white-space: normal; max-width: 150px; text-align: center; }
.lt-l.on { flex-wrap: wrap; }
.lt-pop { flex-basis: 100%; display: block; margin-top: 2px; background: var(--navy); color: #C3D0DC; border-radius: 12px; padding: 11px 14px; font-size: 13px; line-height: 1.45; }
.lt-pop small { display: inline; font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--mint); margin-right: 8px; }
.lt-pop b { display: inline; color: #fff; font-size: 13.5px; margin-right: 6px; }
.lt-foot { display: flex; align-items: center; gap: 8px; margin-top: 12px; padding-top: 14px; border-top: 1px solid var(--line); font-size: 13.5px; font-weight: 600; color: #0D7E6E; }
.disc3 { position: absolute; left: 4px; bottom: 6px; z-index: 1; font-size: 10.5px; letter-spacing: .1em; text-transform: uppercase; color: #8795A6; }
@media (max-width: 1000px) {
  .apsec .wrap { grid-template-columns: 1fr; gap: 40px; }
  .apsec .ap-art { order: 2; }
  .apsec h2 { font-size: 32px; }
}
@media (max-width: 640px) {
  .apsec { padding: 64px 0 68px; }
  .lt-card { padding: 18px 14px 14px; }
  .lt-l { flex-direction: column; gap: 6px; font-size: 13.5px; }
}

/* PRE-FLIGHT SECTION, 08-OCT-2026 (R20). After "How it works", before the appeal letter: the
   lifecycle order (before a request goes out, then a denial, then after approval). Copy left, picture
   right, so the three feature sections alternate. Drawn in CSS: an illustration, never the portal
   screen (R10). Gaps are amber, never red: red means money. Never shows a chance of approval. */
.pfsec { padding: 92px 0 96px; background: linear-gradient(var(--mist), #fff); }
.pfsec .wrap { display: grid; grid-template-columns: minmax(0,.95fr) minmax(0,1.05fr); gap: 56px; align-items: center; }
.pfsec h2 .g { color: #0D7E6E; }
.pfsec .sub { margin-bottom: 30px; }
.pf-art { position: relative; padding-bottom: 34px; }
.pf-art::before { content: ""; position: absolute; inset: 6% -4% -4% 8%; z-index: 0; filter: blur(40px); pointer-events: none;
  background: radial-gradient(50% 50% at 60% 40%, rgba(127,217,190,.34), transparent 72%), radial-gradient(40% 40% at 30% 85%, rgba(233,162,59,.18), transparent 72%); }
.pf-card { position: relative; z-index: 1; background: #fff; border: 1px solid var(--line); border-radius: 20px; padding: 22px 22px 16px; box-shadow: 0 30px 60px -30px rgba(29,43,69,.40); }
.pf-head { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; padding-bottom: 14px; border-bottom: 1px solid var(--line); }
.pf-head b { font-family: "Fraunces", Georgia, serif; font-size: 20px; color: var(--navy); }
.pf-head small { font-size: 13px; color: var(--muted); }
.pf-score { display: flex; align-items: center; gap: 16px; padding: 16px 4px; flex-wrap: wrap; }
.pf-ring { flex: none; }
.pf-num b { display: block; font-family: "Fraunces", Georgia, serif; font-size: 26px; color: var(--navy); line-height: 1.1; }
.pf-num span { font-size: 13.5px; color: var(--muted); }
.pf-band { margin-left: auto; font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: #8A560D; background: #FDF1DC; border-radius: 999px; padding: 5px 12px; }
.pf-row { display: flex; gap: 12px; align-items: flex-start; padding: 10px 10px; border-radius: 10px; }
.pf-row em { flex: none; width: 104px; font-style: normal; font-size: 11.5px; font-weight: 700; text-align: center; border-radius: 999px; padding: 3px 8px; margin-top: 1px; }
.pf-row b { display: block; font-size: 14.5px; color: var(--navy); line-height: 1.35; }
.pf-row span { display: block; font-size: 13.5px; color: var(--muted); line-height: 1.45; margin-top: 2px; }
.pf-row.met em { background: #E3F6EF; color: #0B6B5E; }
.pf-row.miss em { background: #FDF1DC; color: #8A560D; }
.pf-row.miss.on { background: #FFF8EC; box-shadow: inset 3px 0 0 #E9A23B; }
.pf-row.miss a { color: #0D7E6E; font-weight: 700; white-space: nowrap; }
.pf-row.na em { background: #EEF1F4; color: #56657A; }
.pf-row.na b { color: #56657A; }
.pf-src { margin: 8px 10px 0; font-size: 12px; color: #8795A6; }
.disc4 { position: absolute; right: 4px; bottom: 6px; z-index: 1; font-size: 10.5px; letter-spacing: .1em; text-transform: uppercase; color: #8795A6; }
.apsec { background: linear-gradient(#fff, var(--mist)); }
.calsec { background: linear-gradient(var(--mist), #fff); }  /* the three feature sections fade into each other with no seam */
@media (max-width: 1000px) {
  .pfsec .wrap { grid-template-columns: 1fr; gap: 40px; }
  .pfsec h2 { font-size: 32px; }
}
@media (max-width: 640px) {
  .pfsec { padding: 64px 0 68px; }
  .pf-card { padding: 18px 12px 14px; }
  .pf-row { flex-direction: column; gap: 6px; }
  .pf-row em { width: auto; }
  .pf-band { margin-left: 0; }
}

/* OR BETWEEN THE HERO BUTTONS, 08-OCT-2026 (Calvin): the same small "OR" the one-page overview uses. */
.ctas .or-sep { align-self: center; font-size: 12px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: #9FB0C2; padding: 0 2px; }
@media (max-width: 640px) {
  .ctas:has(.or-sep) { flex-direction: column; align-items: stretch; gap: 8px; }
  .ctas:has(.or-sep) .btn { justify-content: center; }
  .ctas .or-sep { text-align: center; }
}

/* APPEAL DEADLINES, 08-OCT-2026 (R20, T-17 part 1). Art left, copy right, after My Calendar. */
.dlsec { padding: 92px 0 96px; background: linear-gradient(var(--mist), #fff); }
.dlsec .wrap { display: grid; grid-template-columns: minmax(0,1.05fr) minmax(0,.95fr); gap: 56px; align-items: center; }
.dlsec h2 .g { color: #0D7E6E; }
.dlsec .sub { margin-bottom: 30px; }
.dl-art { position: relative; padding-bottom: 34px; }
.dlc { position: relative; z-index: 1; background: #fff; border: 1.5px solid #E9A23B; border-radius: 20px; overflow: hidden; box-shadow: 0 30px 60px -30px rgba(29,43,69,.40); }
.dlc-top { display: grid; grid-template-columns: 1fr 1fr; }
.dlc-count { padding: 22px 22px 20px; background: #FFF6E6; border-right: 1px solid #F1D9B0; }
.dlc-next { padding: 22px 22px 20px; display: flex; flex-direction: column; gap: 6px; }
.dlc-k { display: flex; justify-content: space-between; align-items: center; gap: 8px; font-size: 11px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: #8795A6; }
.dlc-count .dlc-k { color: #8A560D; }
.dlc-k em { font-style: normal; font-size: 10.5px; background: #FDE7C2; color: #8A560D; border-radius: 6px; padding: 3px 8px; letter-spacing: .08em; }
.dlc-big { font-family: "Fraunces", Georgia, serif; font-weight: 600; font-size: 64px; line-height: 1; color: #8A560D; margin: 14px 0 8px; }
.dlc-big small { font-family: "DM Sans", sans-serif; font-size: 20px; font-weight: 600; }
.dlc-due { font-size: 13.5px; color: var(--muted); }
.dlc-next b { font-family: "Poppins", sans-serif; font-weight: 600; font-size: 17px; color: var(--navy); margin-top: 6px; }
.dlc-next span { font-size: 13.5px; color: var(--muted); line-height: 1.5; }
.dlc-next a { align-self: flex-start; margin-top: 8px; background: #0D7E6E; color: #fff; font-weight: 700; font-size: 13.5px; border-radius: 10px; padding: 9px 14px; }
.dlc-src { padding: 12px 22px; border-top: 1px solid var(--line); font-size: 13px; color: var(--muted); }
.dlc-src em { font-style: normal; font-size: 10.5px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; background: #E6EEF7; color: #2A5A8C; border-radius: 6px; padding: 3px 8px; margin-right: 6px; }
.dlc-q { padding: 12px 22px; background: #F6F9FA; border-top: 1px solid var(--line); font-size: 14px; font-style: italic; color: var(--ink); }
.dlc .lt-foot { margin: 0; padding: 12px 22px 14px; }
.disc5 { position: absolute; left: 4px; bottom: 6px; z-index: 1; font-size: 10.5px; letter-spacing: .1em; text-transform: uppercase; color: #8795A6; }
@media (max-width: 900px) {
  .dlsec .wrap { grid-template-columns: 1fr; gap: 40px; }
  .dlsec .dl-art { order: 2; }
  .dlsec h2 { font-size: 32px; }
}
@media (max-width: 560px) {
  .dlsec { padding: 64px 0 68px; }
  .dlc-top { grid-template-columns: 1fr; }
  .dlc-count { border-right: 0; border-bottom: 1px solid #F1D9B0; }
  .dlc-big { font-size: 52px; }
}

/* WISeR band, 11-OCT-2026 (Calvin chose Option B of MEDMOJO_HOME_WISER_MOCKUP_V1). Links to the /wiser guides. */
.wz { background: linear-gradient(135deg, #1D2B45, #16223A); color: #DCE6F2; }
.wz .in { max-width: 1200px; margin: 0 auto; padding: 38px 32px; display: grid; grid-template-columns: 1.5fr 1fr; gap: 36px; align-items: center; }
.wz .tag { display: inline-block; font-size: 12px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--mint); margin-bottom: 10px; }
.wz h2 { color: #fff; font-size: 30px; line-height: 1.2; margin: 0 0 10px; }
.wz p { margin: 0; font-size: 16.5px; line-height: 1.6; color: #C9D6E6; }
.wz .go { display: flex; flex-direction: column; gap: 12px; align-items: flex-start; }
.wz .go .btn { background: linear-gradient(135deg, #3DB897, #2AA88C); color: #fff; }
.wz .go .more { font-size: 14.5px; color: #C9D6E6; }
.wz .go .more a { color: var(--mint); }
@media (max-width: 820px) { .wz .in { grid-template-columns: 1fr; gap: 20px; padding: 30px 20px; } .wz h2 { font-size: 24px; } }

/* AMBER ACCENT, 11-OCT-2026 (Calvin): #E8A33D with navy text, marketing site only, used sparingly:
   "New" or "Updated" pills and one hand-drawn accent per page at most. Never a button color. Not in the portal,
   where amber already means "expiring" or "needs attention". */
.pill-amber { display: inline-block; vertical-align: 2px; margin-right: 10px; background: var(--accent); color: var(--navy); font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; padding: 4px 9px; border-radius: 999px; line-height: 1.2; }
.amb-ul { position: relative; white-space: nowrap; }
.amb-ul svg { position: absolute; left: -2%; bottom: -.3em; width: 104%; height: .4em; overflow: visible; }

/* THE CASE WORKSPACE AND THE REQUEST LETTER, 12-OCT-2026 (#workspace). Art left, copy right. */
.newtag.amber { background: var(--accent); color: var(--navy); }
.wssec { padding: 92px 0 96px; background: linear-gradient(#fff, var(--mist)); }
.wssec .wrap { display: grid; grid-template-columns: minmax(0,1.05fr) minmax(0,.95fr); gap: 56px; align-items: center; }
.wssec h2 .g { color: #0D7E6E; }
.wssec .sub { margin-bottom: 30px; }
.ws-art { position: relative; padding-bottom: 34px; }
.ws-art::before { content: ""; position: absolute; inset: 6% 8% -4% -4%; z-index: 0; filter: blur(40px); pointer-events: none;
  background: radial-gradient(closest-side, rgba(42,168,140,.22), transparent), radial-gradient(closest-side at 80% 90%, rgba(232,163,61,.18), transparent); }
.ws-card { position: relative; z-index: 1; background: #fff; border: 1px solid var(--line); border-radius: 20px; padding: 20px 20px 14px; box-shadow: 0 30px 60px -30px rgba(29,43,69,.40); }
.ws-who { display: flex; align-items: baseline; gap: 10px; padding-bottom: 12px; border-bottom: 1px solid var(--line); }
.ws-who b { font-family: "Fraunces", Georgia, serif; font-size: 20px; color: var(--navy); }
.ws-who small { font-size: 13px; color: var(--muted); }
.ws-rail { display: flex; align-items: center; margin: 14px 0; padding: 10px 12px; border-radius: 14px; background: linear-gradient(100deg,#E9F5F3,#EAF1FB); border: 1px solid #D4E6E8; }
.ws-rail .st { display: flex; flex-direction: column; align-items: center; gap: 5px; font-size: 11.5px; font-weight: 600; color: #6F86A0; flex: none; }
.ws-rail .st i { position: relative; width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; font-style: normal; font-size: 12.5px; font-weight: 700; border: 1.5px solid #B9CADD; background: rgba(255,255,255,.7); color: #6F86A0; }
.ws-rail .st.done { color: var(--navy); }
.ws-rail .st.done i { border: 2px solid #0D7E6E; color: #0D7E6E; background: #fff; }
.ws-rail .st.done u { position: absolute; right: -4px; bottom: -3px; width: 13px; height: 13px; border-radius: 50%; background: #00A86B; box-shadow: 0 0 0 2px #EAF4F4; }
.ws-rail .st.done u::after { content: ""; position: absolute; left: 4px; top: 2px; width: 3px; height: 6px; border: solid #fff; border-width: 0 2px 2px 0; transform: rotate(45deg); }
.ws-rail .st.now { color: var(--navy); font-weight: 700; }
.ws-rail .st.now i { border: 0; background: #00A86B; color: #fff; box-shadow: 0 0 0 4px rgba(0,168,107,.18); }
.ws-rail em { flex: 1; height: 1.5px; background: #B9CADD; margin: 0 4px 18px; }
.ws-rail em.lit { background: rgba(13,126,110,.5); }
.ws-next { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border-radius: 12px; border: 1.5px solid rgba(13,126,110,.26); background: rgba(13,126,110,.06); }
.ws-next small { display: block; font-size: 10.5px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: #0D7E6E; }
.ws-next b { font-size: 15px; color: var(--navy); }
.ws-btn { margin-left: auto; white-space: nowrap; font-size: 12.5px; font-weight: 700; color: #fff; background: linear-gradient(135deg,#17806E,#0B6E60); border-radius: 9px; padding: 8px 12px; }
.ws-note { margin-top: 12px; padding: 10px 12px; border-radius: 10px; background: #FFF8EC; box-shadow: inset 3px 0 0 #E9A23B; }
.ws-note b { display: block; font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: #8A560D; }
.ws-note span { display: block; font-size: 13.5px; color: var(--navy); line-height: 1.45; margin-top: 3px; }
.ws-letter { margin-top: 12px; padding: 14px 16px 12px; border: 1px solid var(--line); border-radius: 10px; background: #FBFCFD; }
.ws-letter b { display: block; font-family: "Fraunces", Georgia, serif; font-size: 15px; color: var(--navy); margin-bottom: 10px; }
.ws-letter i { display: block; height: 7px; border-radius: 4px; background: #E6ECF2; margin: 7px 0; }
.ws-letter .l1 { width: 92%; } .ws-letter .l2 { width: 100%; } .ws-letter .l3 { width: 84%; } .ws-letter .l4 { width: 96%; } .ws-letter .l5 { width: 58%; }
@media (max-width: 900px) {
  .wssec .wrap { grid-template-columns: 1fr; gap: 40px; }
  .wssec .ws-art { order: 2; }
  .wssec h2 { font-size: 32px; }
}
@media (max-width: 560px) {
  .wssec { padding: 64px 0 68px; }
  .ws-card { padding: 16px 12px 12px; }
  .ws-rail { padding: 8px 6px; }
  .ws-rail .st { font-size: 10px; }
  .ws-next { flex-wrap: wrap; }
  .ws-btn { margin-left: 0; }
}

/* Agents section, 15-OCT-2026 */
.agents{padding:84px 0 40px;background:#fff}
.agents .wrap{max-width:1136px;margin:0 auto;padding:0 16px}
.agents h2{font-family:Fraunces,serif;font-weight:600;font-size:42px;line-height:1.12;color:var(--navy);margin:8px 0 12px}
.agents .sub{color:var(--muted);font-size:18px;max-width:720px;margin:0 0 36px}
.agrid{display:grid;grid-template-columns:repeat(5,1fr);gap:16px}
.ag{border:1px solid var(--line);border-radius:16px;padding:20px 18px;background:#fff;box-shadow:0 6px 20px rgba(29,43,69,.06);display:flex;flex-direction:column;gap:10px}
.ag .ic{width:40px;height:40px;border-radius:12px;background:#E6F5F1;display:grid;place-items:center;color:var(--deep);font-weight:700}
.ag h3{margin:0;font-size:17px;color:var(--navy)}
.ag p{margin:0;font-size:14.5px;line-height:1.5;color:var(--muted);flex:1}
.ag .st{align-self:flex-start;font-size:11.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;border-radius:99px;padding:4px 10px}
.st.live{background:#E6F5F1;color:var(--deep)}
.st.ea{background:#FDF1DD;color:#9A5F0E}
.agents .you{margin-top:22px;border-radius:16px;background:var(--navy);color:#fff;padding:22px 26px;display:flex;gap:18px;align-items:center}
.agents .you b{color:var(--mint)}
@media(max-width:900px){.agrid{grid-template-columns:1fr 1fr}.agents h2{font-size:32px}}
