/* Ekline Claims website 5.0.0: white, in the Ekline Health brand kit. Loaded after site.css.
   White gallery pages with the 3D scenes framed in Ink panels, hairline cards, pill buttons, one Signal accent, and a dark
   Ink footer as the bookend. The developer docs keep the dark theme (body.theme-dark). */
body:not(.theme-dark) {
  --bg: #FFFFFF; --bg-2: #F5F6FA; --surface: #FFFFFF; --surface-2: #F5F6FA; --line: #E3E5EE;
  --text: #161B3D; --muted: #4F5574; --dim: #7A7F9C;
  --accent: #D9472A; --signal: #F25C3B; --ok: #1E7A55; --warn: #9A5B00; --bad: #B42318;
  --glass: rgba(255, 255, 255, .86); --blur: saturate(180%) blur(14px);
  color-scheme: light; background: #fff; color: var(--text);
}
body:not(.theme-dark)::before { background: #fff; }
body:not(.theme-dark)::after { display: none; }
body:not(.theme-dark) a:hover { color: var(--text); }
body:not(.theme-dark) h1 { letter-spacing: -.045em; font-size: clamp(42px, 6.4vw, 84px); line-height: .98; }
body:not(.theme-dark) h2 { letter-spacing: -.035em; }
body:not(.theme-dark) .accent, body:not(.theme-dark) .hero h1 em { color: var(--signal); }
body:not(.theme-dark) .eyebrow { color: var(--accent); }
body:not(.theme-dark) .eyebrow::before { background: var(--signal); }

/* Nav: white glass with a hairline */
body:not(.theme-dark) .nav { background: rgba(255, 255, 255, .86); border-bottom: 1px solid var(--line); }
body:not(.theme-dark) .nav nav a.l { color: var(--muted); }
body:not(.theme-dark) .nav nav a.l:hover, body:not(.theme-dark) .nav nav a.l.on { color: var(--text); background: #F1F2F7; }
body:not(.theme-dark) .nav .menu { border-color: var(--line); color: var(--text); }
body:not(.theme-dark) .lockup b { color: var(--text); }
body:not(.theme-dark) .lockup i { color: var(--signal); }

/* Buttons: pills. Primary is Ink; the Signal pill is kept for "Book a demo". */
body:not(.theme-dark) .btn { border-radius: 999px; padding: 13px 24px; }
body:not(.theme-dark) .btn.sm { padding: 9px 16px; }
body:not(.theme-dark) .btn.primary { background: var(--signal); color: #161B3D; box-shadow: none; }
body:not(.theme-dark) .btn.primary:hover { background: #E04E2E; color: #161B3D; box-shadow: 0 10px 26px rgba(242, 92, 59, .28); }
body:not(.theme-dark) .btn.ghost { background: #fff; border-color: #C9CDDD; color: var(--text); }
body:not(.theme-dark) .btn.ghost:hover { border-color: var(--text); }
body:not(.theme-dark) .btn.dark { background: #161B3D; color: #fff; }

/* Hero: the 3D scene sits in an Ink frame, like a product render in a gallery */
body:not(.theme-dark) .hero { min-height: 0; padding: 72px 0 90px; }
body:not(.theme-dark) .stage { border-radius: 32px; background: radial-gradient(120% 90% at 70% 10%, #232A5C 0%, #161B3D 45%, #0F1330 100%); box-shadow: 0 40px 90px rgba(22, 27, 61, .28); overflow: hidden; }
body:not(.theme-dark) .stage .fallback { background: radial-gradient(circle at 50% 40%, rgba(242, 92, 59, .3), transparent 60%); }
body:not(.theme-dark) .hud { background: rgba(255, 255, 255, .92); color: #161B3D; border: 1px solid rgba(255, 255, 255, .6); box-shadow: 0 18px 40px rgba(0, 0, 0, .25); }
body:not(.theme-dark) .hud .muted { color: #5B6180; }
body:not(.theme-dark) .hud.a { left: 5%; } body:not(.theme-dark) .hud.b { right: 5%; }
body:not(.theme-dark) .ticks { color: var(--muted); }
body:not(.theme-dark) .ticks li::before { color: var(--signal); }
body:not(.theme-dark) .marquee { background: #F5F6FA; border-color: var(--line); color: #8A8FA8; }

/* Sections alternate white and mist bands */
body:not(.theme-dark) .sec.mist, body:not(.theme-dark) .sec:nth-of-type(even):not(.plain) { background: #F5F6FA; }
body:not(.theme-dark) .stats { background: var(--line); border-color: var(--line); }
body:not(.theme-dark) .stats > div { background: #fff; }
body:not(.theme-dark) .stats b { color: var(--text); }
body:not(.theme-dark) .card { background: #fff; border: 1px solid var(--line); box-shadow: 0 1px 2px rgba(22, 27, 61, .04); }
body:not(.theme-dark) .card::before { background: radial-gradient(500px circle at var(--mx, 50%) var(--my, 50%), rgba(242, 92, 59, .07), transparent 40%); }
body:not(.theme-dark) .card:hover { border-color: #C9CDDD; box-shadow: 0 24px 50px rgba(22, 27, 61, .1); }
body:not(.theme-dark) .card .ico { background: #FEEDE8; border-color: #FBD3C8; color: var(--accent); }
body:not(.theme-dark) .card p { color: var(--muted); }
body:not(.theme-dark) .num { color: var(--accent); }

/* The product window stays dark: it is the app on a screen */
body:not(.theme-dark) .window { background: #fff; border: 1px solid var(--line); box-shadow: 0 40px 90px rgba(22, 27, 61, .18); }
body:not(.theme-dark) .window .bar { border-color: var(--line); background: #F5F6FA; }
body:not(.theme-dark) .window .bar span { background: #D5D8E5; }
body:not(.theme-dark) .verdict { background: #FEF3F2; border-color: #FECDCA; }
body:not(.theme-dark) .row { border-color: var(--line); color: var(--muted); }
body:not(.theme-dark) .step .visual { background: #F5F6FA; border-color: var(--line); }
body:not(.theme-dark) .step .n { -webkit-text-stroke-color: var(--signal); }

/* Pricing */
body:not(.theme-dark) .price.hl { border-color: var(--text); box-shadow: 0 0 0 1px var(--text), 0 30px 70px rgba(22, 27, 61, .14); }
body:not(.theme-dark) .tag { background: #FEEDE8; color: var(--accent); }
body:not(.theme-dark) .price ul li::before { color: var(--signal); }
body:not(.theme-dark) table.packs td.b { color: var(--accent); }

/* Forms */
body:not(.theme-dark) input, body:not(.theme-dark) select, body:not(.theme-dark) textarea { background: #fff; border-color: #C9CDDD; color: var(--text); border-radius: 12px; }
body:not(.theme-dark) ::placeholder { color: #9AA0BC; }
body:not(.theme-dark) input:focus, body:not(.theme-dark) select:focus, body:not(.theme-dark) textarea:focus { border-color: var(--text); box-shadow: 0 0 0 3px rgba(22, 27, 61, .1); }
body:not(.theme-dark) .flash { background: #E9F7F0; border-color: #B5E3CC; color: #1E7A55; }

/* CTA band: Ink, the one dark moment before the footer */
body:not(.theme-dark) .band { background: radial-gradient(90% 120% at 100% 0%, rgba(242, 92, 59, .28), transparent 55%), #161B3D; border: 0; color: #fff; }
body:not(.theme-dark) .band .lead { color: #C9CDE4; }
body:not(.theme-dark) .band .eyebrow { color: #FF8A6E; }
body:not(.theme-dark) .band .accent { color: #FF8A6E; }
body:not(.theme-dark) .band .btn.ghost { background: transparent; color: #fff; border-color: rgba(255, 255, 255, .35); }

/* Footer: Ink */
body:not(.theme-dark) footer { background: #0F1330; border-top: 0; color: #A9AECB; margin-top: 90px; }
body:not(.theme-dark) footer h4, body:not(.theme-dark) footer .lockup b, body:not(.theme-dark) .powered .wm, body:not(.theme-dark) footer .powered strong { color: #fff; }
body:not(.theme-dark) footer a { color: #A9AECB; }
body:not(.theme-dark) footer a:hover { color: #fff; }
body:not(.theme-dark) footer .legal { border-color: rgba(255, 255, 255, .1); color: #7E84A8; }

@media (max-width: 720px) {
  body:not(.theme-dark) .nav nav { background: #fff; border-bottom: 1px solid var(--line); box-shadow: 0 20px 40px rgba(22, 27, 61, .12); }
  body:not(.theme-dark) .hero { padding: 24px 0 60px; }
  body:not(.theme-dark) .stage { border-radius: 24px; }
}

/* Blog and FAQ (5.0.0) */
.posts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; }
.post-card { display: flex; flex-direction: column; gap: 10px; padding: 0; overflow: hidden; }
.post-card .cover { aspect-ratio: 16 / 9; background: radial-gradient(120% 120% at 80% 0%, #2B3370, #161B3D 60%); display: grid; place-items: center; color: #fff; font: 800 22px 'Bricolage Grotesque', sans-serif; letter-spacing: -.02em; padding: 22px; text-align: left; }
.post-card .cover span { color: #FF8A6E; }
.post-card .in { padding: 0 24px 24px; display: grid; gap: 8px; }
.post-card h3 { font-size: 21px; }
.post-meta { font-size: 13.5px; color: var(--dim); }
.article { max-width: 720px; margin: 0 auto; }
.article h1 { font-size: clamp(34px, 4.6vw, 56px) !important; margin: 14px 0 16px; }
.article .body { font-size: 18px; line-height: 1.75; color: var(--text); }
.article .body p { margin: 0 0 20px; }
.article .body h2 { font-size: 28px; margin: 36px 0 12px; }
.article .body ul { padding-left: 22px; margin: 0 0 20px; }
.article .body li { margin-bottom: 6px; }
.faq-cats { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 28px; }
.faq-cats a { padding: 8px 14px; border-radius: 999px; border: 1px solid var(--line); color: var(--muted); font-weight: 600; font-size: 14.5px; }
.faq-cats a:hover { border-color: var(--text); color: var(--text); }
.faq-group { margin-bottom: 40px; scroll-margin-top: 90px; }
.faq-group h2 { font-size: 26px !important; margin-bottom: 12px; }
.faq-item { border-bottom: 1px solid var(--line); }
.faq-item summary { cursor: pointer; list-style: none; display: flex; justify-content: space-between; gap: 16px; padding: 18px 0; font-weight: 600; font-size: 17px; }
.faq-item summary::after { content: '+'; font-size: 22px; line-height: 1; color: var(--signal); transition: transform .2s; }
.faq-item[open] summary::after { transform: rotate(45deg); }
.faq-item p { padding: 0 0 20px; color: var(--muted); max-width: 760px; }
@media (max-width: 980px) { .posts { grid-template-columns: 1fr 1fr; } }
@media (max-width: 720px) { .posts { grid-template-columns: 1fr; } }

.hero > .wrap { width: 100%; }
.post-card .cover { position: relative; display: block; overflow: hidden; }
.post-card .cover .cv-tag { position: absolute; left: 22px; bottom: 18px; font: 800 26px 'Bricolage Grotesque', sans-serif; letter-spacing: -.03em; color: #fff; }
.post-card .cover .cv-pages { position: absolute; right: -10px; top: 18px; width: 46%; height: 120%; perspective: 500px; }
.post-card .cover .cv-pages i { position: absolute; inset: 0; background: #fff; border-radius: 6px; transform: rotateY(-28deg) rotateZ(6deg); box-shadow: -8px 10px 24px rgba(0, 0, 0, .3);
  background-image: repeating-linear-gradient(180deg, transparent 0 16px, #DADDEA 16px 20px); background-size: 70% 100%; background-repeat: no-repeat; background-position: 14px 22px; }
.post-card .cover .cv-pages i:nth-child(2) { transform: translateX(-26px) translateY(10px) rotateY(-28deg) rotateZ(6deg); opacity: .9; }
.post-card .cover .cv-pages i:nth-child(3) { transform: translateX(-52px) translateY(20px) rotateY(-28deg) rotateZ(6deg); box-shadow: inset 3px 0 0 #F25C3B, -8px 10px 24px rgba(0, 0, 0, .3); }
.post-card:hover .cover .cv-pages i:nth-child(3) { transform: translateX(-60px) translateY(14px) rotateY(-20deg) rotateZ(4deg); transition: transform .4s; }

/* 5.4.0: everything on white. The 3D scenes sit straight on the page (no Ink frame) on a soft Signal and periwinkle
   wash; the home hero runs the scene from the left edge of the screen to the right. */
body:not(.theme-dark) .stage { background: radial-gradient(closest-side at 50% 50%, rgba(242, 92, 59, .10), rgba(86, 98, 201, .04) 60%, transparent 100%); box-shadow: none; border-radius: 0; }
body:not(.theme-dark) .sec.mist, body:not(.theme-dark) .sec:nth-of-type(even):not(.plain) { background: #fff; }
body:not(.theme-dark) .marquee { background: #fff; }
body:not(.theme-dark) .stage .fallback { background: radial-gradient(circle at 50% 40%, rgba(242, 92, 59, .14), transparent 60%); }
body:not(.theme-dark) .hud { background: rgba(255, 255, 255, .94); border: 1px solid var(--line); box-shadow: 0 18px 40px rgba(22, 27, 61, .12); }
body:not(.theme-dark) .hero { background: radial-gradient(70% 60% at 50% 0%, #FFF4F0 0%, #fff 70%); }
.hero.full { display: block; min-height: 0; padding: 70px 0 0; }
.hero.full .hero-copy { text-align: center; max-width: 980px; margin: 0 auto; }
.hero.full .hero-copy .lead { max-width: 760px; margin-left: auto; margin-right: auto; }
.hero.full .cta, .hero.full .ticks { justify-content: center; }
.hero.full .eyebrow { justify-content: center; }
.hero.full .stage.wide { width: 100%; height: min(600px, 64vh); min-height: 380px; margin-top: 18px; border-radius: 0; background: radial-gradient(42% 70% at 50% 50%, rgba(242, 92, 59, .1), transparent 70%), linear-gradient(180deg, #fff 0%, #F7F8FC 100%); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.stage.wide .hud.a { left: 6%; top: 16%; } .stage.wide .hud.b { right: 6%; bottom: 16%; } .stage.wide .hud.c { left: 50%; bottom: 8%; transform: translateX(-50%); }
.hud.c { position: absolute; z-index: 2; }
@media (max-width: 720px) { .hero.full { padding-top: 30px; } .hero.full .stage.wide { height: 380px; } .stage.wide .hud.c { display: none; } }
/* Pricing: billing period toggle */
.cycle-toggle { display: flex; width: max-content; max-width: 100%; margin: 0 auto 30px; padding: 5px; gap: 4px; border-radius: 999px; background: #F1F2F7; border: 1px solid var(--line); flex-wrap: wrap; justify-content: center; }
.cycle-toggle button { border: 0; background: none; color: var(--muted); font: 600 15px 'DM Sans', sans-serif; padding: 10px 18px; border-radius: 999px; cursor: pointer; display: inline-flex; align-items: center; gap: 8px; }
.cycle-toggle button.on { background: #fff; color: var(--text); box-shadow: 0 2px 8px rgba(22, 27, 61, .1); }
.cycle-toggle .save { font-size: 12.5px; color: var(--ok); }
.cycle-toggle .best { font-size: 12.5px; padding: 3px 9px; border-radius: 999px; background: #FEEDE8; color: var(--accent); }
.price .bill { margin: -6px 0 10px; font-size: 13.5px; color: var(--muted); }
.price .saving { color: var(--ok); font-weight: 600; }

/* 5.7.0: plain website. No colour washes, glows, floating cards, tilt or count-ups: white paper, Ink type, one
   accent colour, and pictures that show the real thing. */
body:not(.theme-dark)::after { display: none; }
body:not(.theme-dark) .hero, body:not(.theme-dark) .hero.full { background: #fff; }
body:not(.theme-dark) .stage, body:not(.theme-dark) .stage .fallback, .hero.full .stage.wide { background: none; box-shadow: none; }
.hero.full .stage.wide.file { height: min(470px, 56vh); min-height: 340px; margin-top: 34px; border: 0; background: linear-gradient(180deg, #fff 0%, #F6F7FA 100%); }
body:not(.theme-dark) .hud { animation: none; box-shadow: 0 1px 2px rgba(22, 27, 61, .06); border: 1px solid var(--line); background: #fff; backdrop-filter: none; -webkit-backdrop-filter: none; }
.stage.wide.file .hud.a { left: 4%; top: 8%; } .stage.wide.file .hud.b { right: 4%; top: 8%; bottom: auto; }
.stage-cap { text-align: center; margin-top: 10px; }
body:not(.theme-dark) .card::before { display: none; }
body:not(.theme-dark) .band { background: #161B3D; }
.steps { list-style: none; counter-reset: st; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 0; border-top: 1px solid var(--line); }
.steps li { counter-increment: st; padding: 18px 18px 6px 0; color: var(--muted); font-size: 15px; line-height: 1.5; }
.steps li::before { content: counter(st); display: block; font: 700 14px/1 'DM Sans', sans-serif; color: var(--signal); margin-bottom: 12px; }
.steps li b { display: block; color: var(--text); font-size: 16.5px; margin-bottom: 6px; }
.window.sheet { border-radius: 6px; box-shadow: 0 1px 2px rgba(22, 27, 61, .06), 0 12px 30px rgba(22, 27, 61, .08); }
.window.sheet .sheet-head { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; padding: 16px 20px 0; flex-wrap: wrap; }
@media (max-width: 900px) { .steps { grid-template-columns: 1fr; } .steps li { border-bottom: 1px solid var(--line); padding: 14px 0; } }
@media (max-width: 720px) { .hero.full .stage.wide.file { height: 260px; min-height: 0; margin-top: 24px; } .stage.wide.file .hud { display: none; } .stage.wide.file .hud.b { display: none; } }