/* ============================================================
   JellyFil - Regent Navy theme
   Order: reset / tokens / base / layout / components / sections / utilities / responsive
   ============================================================ */

/* --- reset --- */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
img,svg{display:block;max-width:100%}
button,input,textarea,select{font:inherit;color:inherit}
a{color:inherit;text-decoration:none}
ul{list-style:none}

/* --- tokens --- */
:root{
   --navy:#0d2a55;
   --navy-deep:#0a1f3f;
   --navy-soft:#14366a;
   --gold:#c39a3e;
   --gold-bright:#d8b454;
   --gold-deep:#9a7728;
   --ink:#16243a;
   --slate:#536179;
   --line:#e2e6ee;
   --ice:#f4f6fb;
   --ice-2:#eaeef6;
   --paper:#ffffff;
   --cream:#fbfaf5;
   --ok:#2f7d5b;
   --warn:#b5522a;
   --shadow:0 14px 38px rgba(13,42,85,.10);
   --shadow-sm:0 6px 18px rgba(13,42,85,.08);
   --radius:14px;
   --radius-sm:9px;
   --maxw:1140px;
   --hd:'Vollkorn',Georgia,'Times New Roman',serif;
   --bd:'Catamaran',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
}

/* --- base --- */
body{
   font-family:var(--bd);
   color:var(--ink);
   background:var(--paper);
   line-height:1.68;
   font-size:17px;
   font-weight:420;
   -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4{font-family:var(--hd);line-height:1.16;color:var(--navy);font-weight:700;letter-spacing:-.01em}
h1{font-size:clamp(2rem,4.6vw,3.05rem)}
h2{font-size:clamp(1.55rem,3.2vw,2.3rem)}
h3{font-size:1.28rem}
p{margin:0 0 1rem}
strong{font-weight:700;color:var(--ink)}
a:focus-visible,button:focus-visible{outline:3px solid var(--gold);outline-offset:2px;border-radius:4px}

/* --- layout primitives --- */
.jf-wrap{width:100%;max-width:var(--maxw);margin-inline:auto;padding-inline:22px}
.jf-stack>*+*{margin-top:1.05rem}
.jf-row{display:flex;gap:1rem;flex-wrap:wrap}
.jf-grid{display:grid;gap:1.4rem}
.jf-skip{position:absolute;left:-999px;top:0;background:var(--navy);color:#fff;padding:10px 16px;z-index:200}
.jf-skip:focus{left:10px;top:10px}

/* --- chrome: ribbon --- */
.jf-ribbon{background:var(--navy-deep);color:#e9eefb;text-align:center;font-size:.8rem;letter-spacing:.04em;padding:7px 14px}
.jf-ribbon b{color:var(--gold-bright);font-weight:700}

/* --- chrome: header --- */
.jf-head{position:sticky;top:0;z-index:100;background:rgba(255,255,255,.96);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.jf-head-in{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:13px 22px;max-width:var(--maxw);margin-inline:auto}
.jf-brand{display:flex;align-items:center;gap:11px;font-family:var(--hd);font-weight:700;font-size:1.32rem;color:var(--navy);letter-spacing:-.01em}
.jf-mark{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(150deg,var(--navy),var(--navy-soft));color:var(--gold-bright);font-family:var(--hd);font-weight:700;font-size:1.18rem;border:1.5px solid var(--gold)}
.jf-brand small{display:block;font-family:var(--bd);font-weight:600;font-size:.6rem;letter-spacing:.16em;color:var(--gold-deep);text-transform:uppercase;margin-top:1px}
.jf-nav{display:flex;align-items:center;gap:5px}
.jf-nav a{padding:8px 11px;font-size:.92rem;font-weight:600;color:var(--slate);border-radius:7px}
.jf-nav a:hover{color:var(--navy);background:var(--ice)}
.jf-nav a.is-current{color:var(--navy)}
.jf-cta-sm{background:linear-gradient(160deg,var(--gold-bright),var(--gold-deep));color:#23180a !important;padding:10px 17px !important;border-radius:9px;font-weight:800 !important;box-shadow:var(--shadow-sm)}
.jf-cta-sm:hover{background:var(--navy) !important;color:#fff !important}
.jf-burger{display:none;flex-direction:column;gap:5px;background:none;border:0;padding:9px;cursor:pointer}
.jf-burger span{width:23px;height:2.5px;background:var(--navy);border-radius:2px}

/* --- breadcrumb --- */
.jf-crumb{background:var(--ice);border-bottom:1px solid var(--line);font-size:.84rem;color:var(--slate)}
.jf-crumb .jf-wrap{padding-block:9px}
.jf-crumb a{color:var(--navy);font-weight:600}
.jf-crumb a:hover{text-decoration:underline}
.jf-crumb span{margin-inline:7px;color:var(--gold-deep)}

/* --- buttons --- */
.jf-btn{display:inline-flex;align-items:center;justify-content:center;gap:.5em;font-weight:800;border:0;cursor:pointer;border-radius:10px;padding:15px 28px;font-size:1.02rem;transition:transform .12s,box-shadow .12s,background .12s;text-align:center}
.jf-btn-gold{background:linear-gradient(160deg,var(--gold-bright),var(--gold-deep));color:#23180a;box-shadow:var(--shadow-sm)}
.jf-btn-gold:hover{transform:translateY(-2px);box-shadow:0 16px 30px rgba(154,119,40,.34)}
.jf-btn-navy{background:linear-gradient(160deg,var(--navy-soft),var(--navy-deep));color:#fff}
.jf-btn-navy:hover{transform:translateY(-2px)}
.jf-btn-ghost{background:#fff;color:var(--navy);border:2px solid var(--navy)}
.jf-btn-ghost:hover{background:var(--navy);color:#fff}
.jf-btn-block{display:flex;width:100%}

/* --- generic section --- */
.jf-sec{padding:64px 0}
.jf-sec-tint{background:var(--ice)}
.jf-sec-navy{background:linear-gradient(160deg,var(--navy),var(--navy-deep));color:#dde6f6}
.jf-sec-navy h2,.jf-sec-navy h3{color:#fff}
.jf-sec-cream{background:var(--cream)}
.jf-eyebrow{font-family:var(--bd);font-weight:800;letter-spacing:.15em;text-transform:uppercase;font-size:.76rem;color:var(--gold-deep);margin-bottom:.55rem}
.jf-sec-navy .jf-eyebrow{color:var(--gold-bright)}
.jf-lead{font-size:1.12rem;color:var(--slate)}
.jf-sec-navy .jf-lead{color:#c2cfe6}
.jf-center{text-align:center}
.jf-measure{max-width:720px}
.jf-measure-c{max-width:720px;margin-inline:auto}

/* --- hero --- */
.jf-hero{background:
   radial-gradient(1200px 420px at 78% -8%,rgba(195,154,62,.12),transparent 60%),
   linear-gradient(180deg,#fff, var(--ice));
   border-bottom:1px solid var(--line)}
.jf-hero-grid{display:grid;grid-template-columns:1.06fr .94fr;gap:2.6rem;align-items:center;padding:58px 0}
.jf-badges{display:flex;flex-wrap:wrap;gap:9px;margin-bottom:18px}
.jf-chip{display:inline-flex;align-items:center;gap:6px;background:#fff;border:1px solid var(--line);color:var(--navy);font-size:.74rem;font-weight:700;padding:6px 11px;border-radius:30px;box-shadow:var(--shadow-sm)}
.jf-chip b{color:var(--gold-deep)}
.jf-hero h1{margin-bottom:.7rem}
.jf-hero h1 em{font-style:normal;color:var(--gold-deep)}
.jf-hero-sub{font-size:1.16rem;color:var(--slate);margin-bottom:1.3rem}
.jf-tagline{font-family:var(--hd);font-style:italic;color:var(--navy);font-size:1.05rem;margin-top:.4rem}
.jf-hero-cta{display:flex;gap:.8rem;flex-wrap:wrap;margin:1.4rem 0 1rem}
.jf-microtrust{font-size:.85rem;color:var(--slate)}
.jf-microtrust b{color:var(--navy)}
.jf-hero-art{position:relative;text-align:center}
.jf-hero-art img{margin-inline:auto;filter:drop-shadow(0 26px 40px rgba(13,42,85,.30))}
.jf-hero-disc{position:absolute;inset:6% 12% auto;height:64%;border-radius:50%;background:radial-gradient(circle,rgba(195,154,62,.18),transparent 65%);z-index:0}
.jf-hero-art img{position:relative;z-index:1}

/* portal sentence */
.jf-portal{background:var(--navy-deep);color:#dfe7f7;border-left:4px solid var(--gold);border-radius:0 12px 12px 0;padding:16px 20px;font-size:.98rem}
.jf-portal b{color:var(--gold-bright)}

/* --- TL;DR --- */
.jf-tldr{background:#fff;border:1px solid var(--line);border-top:4px solid var(--gold);border-radius:var(--radius);padding:22px 24px;box-shadow:var(--shadow-sm)}
.jf-tldr h2{font-size:1.12rem;text-transform:uppercase;letter-spacing:.08em;color:var(--gold-deep);margin-bottom:.5rem;font-family:var(--bd);font-weight:800}
.jf-tldr p{margin-bottom:0;font-size:1.05rem}

/* --- Key Facts table --- */
.jf-facts{background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow-sm)}
.jf-facts caption{background:var(--navy);color:#fff;font-family:var(--hd);font-weight:700;font-size:1.16rem;padding:14px 18px;text-align:left;letter-spacing:.01em}
.jf-facts table{width:100%;border-collapse:collapse}
.jf-facts th,.jf-facts td{text-align:left;padding:12px 18px;border-top:1px solid var(--line);font-size:.96rem;vertical-align:top}
.jf-facts th{width:40%;color:var(--gold-deep);font-weight:800}
.jf-facts tr:nth-child(even){background:var(--ice)}

/* --- cards / grids --- */
.jf-cards-3{grid-template-columns:repeat(3,1fr)}
.jf-cards-2{grid-template-columns:repeat(2,1fr)}
.jf-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:24px;box-shadow:var(--shadow-sm)}
.jf-card h3{margin-bottom:.4rem}
.jf-num{font-family:var(--hd);font-size:.9rem;font-weight:700;color:var(--gold-deep);letter-spacing:.1em}

/* pillars */
.jf-pillar{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:24px;box-shadow:var(--shadow-sm)}
.jf-pillar-h{display:flex;align-items:center;gap:11px;margin-bottom:.6rem}
.jf-ico{width:42px;height:42px;border-radius:11px;display:grid;place-items:center;background:var(--ice);border:1px solid var(--line);color:var(--navy);flex:none}
.jf-ico svg{width:22px;height:22px}
.jf-ing{border-top:1px dashed var(--line);padding:11px 0;display:flex;justify-content:space-between;gap:1rem}
.jf-ing:first-of-type{border-top:0}
.jf-ing b{color:var(--navy)}
.jf-ing .jf-dose{color:var(--gold-deep);font-weight:800;white-space:nowrap;font-variant-numeric:tabular-nums}

/* --- verification table --- */
.jf-verify{background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow-sm)}
.jf-verify dl{display:grid;grid-template-columns:1fr 1fr;gap:0}
.jf-verify div{padding:14px 18px;border-top:1px solid var(--line)}
.jf-verify div:nth-child(-n+2){border-top:0}
.jf-verify dt{font-size:.72rem;text-transform:uppercase;letter-spacing:.08em;color:var(--slate);font-weight:700;margin-bottom:3px}
.jf-verify dd{font-weight:700;color:var(--navy);font-size:.98rem}
.jf-badge-ok{display:inline-block;background:rgba(47,125,91,.12);color:var(--ok);font-size:.72rem;font-weight:800;padding:2px 9px;border-radius:20px;margin-left:4px}

/* --- pricing --- */
.jf-prices{display:grid;grid-template-columns:repeat(3,1fr);gap:1.4rem;align-items:start}
.jf-price{background:#fff;border:1px solid var(--line);border-radius:18px;padding:26px 22px;text-align:center;box-shadow:var(--shadow-sm);position:relative;display:flex;flex-direction:column}
.jf-price.is-feature{border:2px solid var(--gold);box-shadow:var(--shadow);transform:translateY(-8px)}
.jf-tag{position:absolute;top:-13px;left:50%;transform:translateX(-50%);background:linear-gradient(160deg,var(--gold-bright),var(--gold-deep));color:#23180a;font-size:.72rem;font-weight:800;letter-spacing:.06em;padding:5px 15px;border-radius:20px;text-transform:uppercase;white-space:nowrap}
.jf-price h3{font-size:1.45rem;margin-bottom:2px}
.jf-supply{color:var(--slate);font-size:.86rem;margin-bottom:14px}
.jf-packshot{height:128px;display:flex;align-items:flex-end;justify-content:center;gap:-10px;margin-bottom:12px}
.jf-packshot img{height:100%;width:auto;filter:drop-shadow(0 10px 16px rgba(13,42,85,.24))}
.jf-packshot img+img{margin-left:-26px}
.jf-was{color:var(--slate);text-decoration:line-through;font-size:.92rem}
.jf-now{font-family:var(--hd)}
.jf-now b{font-size:2.7rem;color:var(--navy)}
.jf-perb{font-size:.82rem;color:var(--slate);display:block;margin-top:-4px}
.jf-save{display:inline-block;background:var(--ice);color:var(--gold-deep);font-weight:800;font-size:.82rem;padding:5px 12px;border-radius:20px;margin:10px 0}
.jf-total{font-size:.92rem;color:var(--ink);margin-bottom:4px}
.jf-total b{color:var(--navy)}
.jf-ship-note{font-size:.78rem;color:var(--slate);margin:6px 0 14px}
.jf-price .jf-btn{margin-top:auto}
.jf-paylist{font-size:.74rem;color:var(--slate);margin-top:12px;letter-spacing:.02em}

/* --- testimonials --- */
.jf-quote{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:22px;box-shadow:var(--shadow-sm)}
.jf-stars{color:var(--gold);letter-spacing:2px;font-size:.95rem;margin-bottom:8px}
.jf-quote p{font-size:.98rem}
.jf-who{display:flex;align-items:center;gap:11px;margin-top:14px;border-top:1px solid var(--line);padding-top:13px}
.jf-av{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:var(--navy);color:var(--gold-bright);font-weight:800;font-size:.92rem;flex:none}
.jf-who b{display:block;font-size:.92rem;color:var(--navy)}
.jf-who small{color:var(--slate);font-size:.78rem}
.jf-vbadge{font-size:.66rem;font-weight:800;color:var(--ok);background:rgba(47,125,91,.1);padding:2px 7px;border-radius:12px;text-transform:uppercase;letter-spacing:.04em}

/* --- Q&A --- */
.jf-qa{border:1px solid var(--line);border-radius:var(--radius);background:#fff;padding:20px 22px;box-shadow:var(--shadow-sm)}
.jf-qa h3{color:var(--navy);margin-bottom:.4rem;font-size:1.14rem}
.jf-qa .jf-ans{font-weight:700;color:var(--ink)}

/* --- takeaways --- */
.jf-takeaways{background:linear-gradient(160deg,var(--navy),var(--navy-deep));color:#e6edfb;border-radius:18px;padding:30px 30px;box-shadow:var(--shadow)}
.jf-takeaways h2{color:#fff;margin-bottom:1rem}
.jf-takeaways li{position:relative;padding-left:34px;margin:.7rem 0;font-size:1.02rem}
.jf-takeaways li::before{content:"\2713";position:absolute;left:0;top:0;width:23px;height:23px;border-radius:50%;background:var(--gold);color:var(--navy-deep);font-weight:800;font-size:.8rem;display:grid;place-items:center}

/* --- stats / snapshot --- */
.jf-stat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}
.jf-stat{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:20px;text-align:center;box-shadow:var(--shadow-sm)}
.jf-stat b{display:block;font-family:var(--hd);font-size:2rem;color:var(--navy);line-height:1}
.jf-stat span{font-size:.8rem;color:var(--slate);margin-top:6px;display:block}

/* --- rating bars --- */
.jf-bars{display:grid;gap:11px}
.jf-bar{display:grid;grid-template-columns:160px 1fr 44px;align-items:center;gap:12px;font-size:.9rem}
.jf-bar .jf-track{height:9px;background:var(--ice-2);border-radius:6px;overflow:hidden}
.jf-bar .jf-fill{height:100%;background:linear-gradient(90deg,var(--gold-deep),var(--gold-bright));border-radius:6px}
.jf-bar b{color:var(--navy);text-align:right;font-variant-numeric:tabular-nums}

/* --- generic data table --- */
.jf-table{width:100%;border-collapse:collapse;background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;font-size:.94rem}
.jf-table caption{caption-side:top;text-align:left;font-weight:800;color:var(--navy);margin-bottom:.6rem;font-size:1.05rem}
.jf-table th,.jf-table td{padding:11px 15px;border-top:1px solid var(--line);text-align:left;vertical-align:top}
.jf-table thead th{background:var(--navy);color:#fff;border-top:0;font-size:.86rem;letter-spacing:.02em}
.jf-table tbody tr:nth-child(even){background:var(--ice)}
.jf-table .jf-yes{color:var(--ok);font-weight:800}
.jf-table .jf-no{color:var(--slate)}

/* --- prose --- */
.jf-prose h2{margin:1.7rem 0 .7rem}
.jf-prose h3{margin:1.3rem 0 .5rem;color:var(--navy-soft)}
.jf-prose p,.jf-prose li{color:#2b3850}
.jf-prose ul{margin:0 0 1rem;padding-left:0}
.jf-prose ul li{position:relative;padding-left:26px;margin:.45rem 0}
.jf-prose ul li::before{content:"";position:absolute;left:4px;top:.62em;width:8px;height:8px;background:var(--gold);border-radius:2px;transform:rotate(45deg)}
.jf-prose a{color:var(--navy);font-weight:700;text-decoration:underline;text-decoration-color:var(--gold)}

/* byline */
.jf-byline{display:flex;align-items:center;gap:10px;font-size:.85rem;color:var(--slate);border:1px solid var(--line);background:var(--ice);border-radius:10px;padding:10px 14px;margin:.4rem 0 1rem}
.jf-byline b{color:var(--navy)}

/* glossary */
.jf-gloss dt{font-weight:800;color:var(--navy);margin-top:.9rem}
.jf-gloss dd{color:var(--slate);margin-left:0}

/* updated note */
.jf-updated{font-size:.82rem;color:var(--slate);font-style:italic}

/* --- forms --- */
.jf-field{display:block;margin-bottom:14px}
.jf-field label{display:block;font-weight:700;font-size:.86rem;color:var(--navy);margin-bottom:5px}
.jf-field input,.jf-field textarea,.jf-field select{width:100%;border:1px solid var(--line);border-radius:9px;padding:12px 14px;background:#fff}
.jf-field input:focus,.jf-field textarea:focus{outline:2px solid var(--gold);border-color:var(--gold)}

/* --- FAQ accordion --- */
.jf-acc{background:#fff;border:1px solid var(--line);border-radius:11px;margin-bottom:11px;overflow:hidden}
.jf-acc summary{cursor:pointer;padding:16px 20px;font-weight:700;color:var(--navy);list-style:none;display:flex;justify-content:space-between;gap:1rem;align-items:center}
.jf-acc summary::-webkit-details-marker{display:none}
.jf-acc summary::after{content:"+";color:var(--gold-deep);font-size:1.4rem;font-weight:700;flex:none}
.jf-acc[open] summary::after{content:"\2013"}
.jf-acc-body{padding:0 20px 18px;color:var(--slate)}

/* --- CTA band --- */
.jf-band{background:linear-gradient(160deg,var(--navy),var(--navy-deep));color:#fff;border-radius:20px;padding:42px 36px;text-align:center;box-shadow:var(--shadow)}
.jf-band h2{color:#fff}
.jf-band p{color:#c7d3ea;max-width:620px;margin-inline:auto}
.jf-trustrow{display:flex;flex-wrap:wrap;gap:18px;justify-content:center;margin-top:18px;font-size:.82rem;color:#aebbd6}
.jf-trustrow b{color:var(--gold-bright)}

/* --- footer --- */
.jf-foot{background:var(--navy-deep);color:#a9b7d2;font-size:.9rem;padding:52px 0 26px}
.jf-foot-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:2rem}
.jf-foot h4{color:#fff;font-family:var(--bd);font-size:.82rem;letter-spacing:.12em;text-transform:uppercase;margin-bottom:13px}
.jf-foot a{color:#a9b7d2}
.jf-foot a:hover{color:var(--gold-bright)}
.jf-foot li{margin:7px 0}
.jf-foot-brand{display:flex;align-items:center;gap:10px;font-family:var(--hd);font-weight:700;font-size:1.25rem;color:#fff;margin-bottom:11px}
.jf-foot-brand .jf-mark{width:34px;height:34px;font-size:1rem}
.jf-disc{border-top:1px solid rgba(255,255,255,.12);margin-top:32px;padding-top:22px;font-size:.78rem;color:#8194b4;line-height:1.6}
.jf-disc p{margin-bottom:.7rem}
.jf-foot-meta{font-size:.82rem;color:#8194b4}
.jf-foot-meta b{color:#c5d1e8}

/* --- utilities --- */
.jf-mt0{margin-top:0}.jf-mb0{margin-bottom:0}
.jf-mt2{margin-top:2rem}.jf-mt3{margin-top:3rem}
.jf-mb2{margin-bottom:2rem}
.jf-tc{text-align:center}
.jf-hide{display:none}

/* --- responsive --- */
@media(max-width:960px){
   .jf-hero-grid{grid-template-columns:1fr;gap:1.6rem}
   .jf-hero-art{order:-1}
   .jf-hero-art img{max-height:330px}
   .jf-foot-grid{grid-template-columns:1fr 1fr}
   .jf-stat-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:820px){
   .jf-nav{position:fixed;inset:0 0 0 auto;width:min(80vw,320px);background:#fff;flex-direction:column;align-items:stretch;padding:80px 20px 20px;gap:4px;transform:translateX(100%);transition:transform .25s;box-shadow:-10px 0 40px rgba(13,42,85,.18);z-index:120}
   .jf-nav.is-open{transform:translateX(0)}
   .jf-nav a{padding:13px 12px;border-bottom:1px solid var(--line)}
   .jf-burger{display:flex;z-index:130}
   .jf-cards-3,.jf-cards-2,.jf-prices{grid-template-columns:1fr}
   .jf-price.is-feature{transform:none}
   .jf-verify dl{grid-template-columns:1fr}
   .jf-verify div:nth-child(2){border-top:1px solid var(--line)}
   .jf-bar{grid-template-columns:120px 1fr 40px}
}
@media(max-width:560px){
   .jf-foot-grid{grid-template-columns:1fr}
   .jf-stat-grid{grid-template-columns:1fr 1fr}
   .jf-hero-cta{flex-direction:column}
   .jf-hero-cta .jf-btn{width:100%}
   .jf-band{padding:30px 20px}
}