/* JSOFY R16 | Allfeat editorial restraint × Bevel light readability.
   Fonts: Be Vietnam Pro via Google Fonts (display=swap); system fallback always available.
   Scope: jsofy.com homepage only. No animation/keyframe rewrites. */
body.page-home{
  --r16-ink:#222326;--r16-soft-ink:#536071;--r16-light:#fbfcff;
  --r16-sky:#ebf0f8;--r16-charcoal:#151515;--r16-cream:#fffbeb;
  --r16-coral:#ec625a;--r16-iris:#7887ff;
  font-family:'Be Vietnam Pro',system-ui,-apple-system,'Segoe UI',Arial,sans-serif;
  color:var(--r16-ink);
  font-synthesis:none;
}
.page-home h1,.page-home h2,.page-home h3,.page-home p,.page-home a,.page-home button{font-family:inherit}
.page-home h1,.page-home h2,.page-home h3{word-break:keep-all;overflow-wrap:normal;hyphens:none;text-wrap:balance}
.page-home p{line-height:1.68}
.page-home .nav{box-shadow:0 10px 38px #1c304310;border-color:#dde4ed;background:#ffffffed}
.page-home .nav-links a{font-size:.86rem;font-weight:600;color:#475467}
.page-home .nav-right .btn{font-size:.8rem;font-weight:700}
.page-home .page-hero{background:radial-gradient(ellipse at 78% 40%,#e5ecfb 0,transparent 52%),linear-gradient(130deg,#fbfcff 20%,#f2f5fc 85%)}
.page-home .hero-copy>p{font-size:clamp(16px,1.25vw,19px);line-height:1.8;max-width:610px;color:#516078}
.page-home .hero-copy .eyebrow{font-weight:700;font-size:12px;letter-spacing:.13em;color:#53627e}
.page-home .hero-overline{font-size:12px;letter-spacing:.015em;font-weight:600;color:#64748b}
.page-home .hero-caption{font-size:10px;letter-spacing:.12em}
.page-home .hero-chroma{font-weight:800;letter-spacing:-.055em;line-height:1.075}
.page-home .hero-chroma-word{padding-top:.095em;padding-bottom:.09em}
.page-home .hero-chroma-glyph{font-family:'Be Vietnam Pro',system-ui,sans-serif}
.page-home .section{padding-block:clamp(86px,9vw,136px)}
.page-home .section-top h2,.page-home .split h2{font-size:clamp(39px,4.45vw,66px);letter-spacing:-.052em;font-weight:700;line-height:1.14}
.page-home .section-top h2{max-width:900px}
.page-home .section-top .sublead{color:#607084;font-size:clamp(16px,1.28vw,19px);line-height:1.75}
.page-home .card.feature{position:relative;border-radius:17px;border-color:#e3e8f0;box-shadow:none;padding:30px;min-height:270px;transition:transform .25s ease,border-color .25s ease}
.page-home .card.feature:hover{transform:translateY(-3px);border-color:#bbc9de;box-shadow:0 12px 35px #1d33420a}
.page-home .card.feature .num{margin-bottom:14px;font-weight:700;color:#6b7b92;letter-spacing:.12em}
.page-home .r16-product-icon{height:31px;width:31px;color:#566fb0;display:block;margin-bottom:24px}
.page-home .card.feature h3{font-size:clamp(21px,1.55vw,25px);letter-spacing:-.03em;font-weight:700}
.page-home .card.feature p{font-size:15px;line-height:1.68;color:#566477}
.page-home .card.feature a{font-size:14px;font-weight:700;letter-spacing:0}
.page-home .split p{font-size:clamp(16px,1.25vw,18px);line-height:1.8;color:#637083;max-width:560px}
.page-home .split a{font-size:14px}
.page-home .section-ivory{background:#f4f5f8}
.page-home .showcase img{border-radius:17px}
.page-home .footer{background:#161c27}
.page-home .footer h4{font-size:12px;letter-spacing:.12em;font-weight:700}
.page-home .footer-grid p,.page-home .footer-grid a{font-size:14px;line-height:1.75}
/* Dark chapters: legible editorial scale rather than all-caps posters. */
.page-home .jsc-story{
 --jsc-dark:#111115;--jsc-paper:#fffbeb;--jsc-ink:#151515;
 --jsc-red:#ec625a;--jsc-blue:#7887ff;
 font-family:'Be Vietnam Pro',system-ui,'Segoe UI',Arial,sans-serif;
}
.page-home .jsc-stage{background:radial-gradient(ellipse at 50% 44%,#202024 0%,#121215 63%,#0e0e12 100%)}
.page-home .jsc-story .jsc-scene h2{
 font-family:'Be Vietnam Pro',system-ui,'Segoe UI',sans-serif;
 font-weight:800;letter-spacing:-.055em;line-height:1.10;
 font-size:clamp(46px,5.25vw,82px);max-width:660px;
 text-transform:none;overflow-wrap:normal;word-break:keep-all;
 margin:15px 0 19px;
}
.page-home .jsc-story .jsc-scene h2 em{font-style:normal;display:inline-block;color:var(--jsc-paper);-webkit-text-stroke:0}
.page-home .jsc-story .jsc-scene--opening h2{font-size:clamp(55px,7.3vw,108px);max-width:1050px;line-height:1.04;margin:14px auto 25px}
.page-home .jsc-story .jsc-scene--opening h2 .jsc-outline{display:block;color:transparent;-webkit-text-stroke:1.6px var(--jsc-paper)}
.page-home .jsc-story .jsc-scene--final h2{max-width:1000px;font-size:clamp(45px,5.45vw,84px)}
.page-home .jsc-story .jsc-overline,.page-home .jsc-story .jsc-tag{
 font-family:ui-monospace,SFMono-Regular,Consolas,monospace;
 font-size:12px;line-height:1.4;letter-spacing:.11em;font-weight:700;color:#e98a80
}
.page-home .jsc-story .jsc-corner{font-size:11px;letter-spacing:.12em}
.page-home .jsc-story .jsc-hint{font-size:11px;letter-spacing:.12em}
.page-home .jsc-story .jsc-lead,.page-home .jsc-story .jsc-scene-copy>p,.page-home .jsc-story .jsc-final-copy>p{
 color:#d8d2c9;font:400 clamp(16px,1.17vw,18px)/1.76 'Be Vietnam Pro',system-ui,sans-serif;
 letter-spacing:0;max-width:530px;text-wrap:pretty
}
.page-home .jsc-story .jsc-lead{max-width:740px;margin-inline:auto;font-size:clamp(16px,1.32vw,20px)}
.page-home .jsc-story .jsc-scene-link{font-family:'Be Vietnam Pro',system-ui,sans-serif;font-weight:700;font-size:14px;letter-spacing:0;padding-bottom:8px}
.page-home .jsc-story .jsc-primary,.page-home .jsc-story .jsc-plain{font-family:'Be Vietnam Pro',system-ui,sans-serif;font-weight:700;font-size:14px}
.page-home .jsc-story .jsc-scene-meter{font-size:11px;letter-spacing:.09em}
.page-home .jsc-story .jsc-panel-header{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:.07em}
.page-home .jsc-story .jsc-terminal-title{font-family:'Be Vietnam Pro',system-ui,sans-serif;font-weight:750}
.page-home .jsc-story .jsc-web-word{font-family:'Be Vietnam Pro',system-ui,sans-serif;font-weight:800;line-height:1.04}
.page-home .jsc-story .jsc-home-center strong{font-family:'Be Vietnam Pro',system-ui,sans-serif}
.page-home .jsc-story .jsc-home-center small{font-family:'Be Vietnam Pro',system-ui,sans-serif}
/* Better pacing for content-heavy chapters, no changes to sticky timeline durations. */
.page-home .jsc-story .jsc-scene-copy{max-width:635px}
.page-home .jsc-story .jsc-story-panel{border-radius:12px;box-shadow:0 35px 70px #0007}
@media(max-width:980px){
 .page-home .jsc-story .jsc-scene h2{font-size:clamp(39px,6.0vw,64px);line-height:1.11}
 .page-home .jsc-story .jsc-scene--opening h2{font-size:clamp(46px,7.6vw,78px)}
 .page-home .jsc-story .jsc-scene-copy>p{font-size:15px;line-height:1.6}
}
@media(max-width:760px){
 .page-home .page-hero .hero-chroma{font-size:clamp(46px,11.6vw,70px);line-height:1.10}
 .page-home .hero-copy>p{font-size:16px;line-height:1.68}
 .page-home .section{padding-block:76px}
 .page-home .section-top h2,.page-home .split h2{font-size:clamp(35px,9vw,47px);line-height:1.16}
 .page-home .card.feature{min-height:unset;padding:26px}
 .page-home .jsc-story .jsc-scene{padding-left:20px;padding-right:20px}
 .page-home .jsc-story .jsc-scene-copy{align-self:end;max-width:100%}
 .page-home .jsc-story .jsc-scene h2{font-size:clamp(31px,8.0vw,43px);letter-spacing:-.045em;line-height:1.14;margin:9px 0 9px}
 .page-home .jsc-story .jsc-scene--opening h2{font-size:clamp(42px,9vw,61px);line-height:1.09;margin:12px 0 18px}
 .page-home .jsc-story .jsc-scene--final h2{font-size:clamp(36px,8.1vw,49px)}
 .page-home .jsc-story .jsc-tag,.page-home .jsc-story .jsc-overline{font-size:10px;line-height:1.35;letter-spacing:.045em}
 .page-home .jsc-story .jsc-scene-copy>p,.page-home .jsc-story .jsc-final-copy>p{font-size:13.4px;line-height:1.49;max-width:100%}
 .page-home .jsc-story .jsc-lead{font-size:14px;line-height:1.6;max-width:90vw}
 .page-home .jsc-story .jsc-scene-link{font-size:12px;margin-top:10px}
 .page-home .jsc-story .jsc-story-panel{max-height:40svh}
 .page-home .jsc-story .jsc-scene-meter{font-size:10px}
 .page-home .jsc-story .jsc-primary,.page-home .jsc-story .jsc-plain{font-size:12px}
}
@media(max-width:390px){
 .page-home .jsc-story .jsc-scene h2{font-size:clamp(30px,7.6vw,34px)}
 .page-home .jsc-story .jsc-scene-copy>p,.page-home .jsc-story .jsc-final-copy>p{font-size:12.6px;line-height:1.47}
 .page-home .jsc-story .jsc-story-panel{max-height:38svh}
}
@media(prefers-reduced-motion:reduce){
 .page-home .jsc-story .jsc-scene h2{transform:none}
}