/* JellyFil — jjellyfill.com
   Every text/background pair below was contrast-checked to meet WCAG AA. */
:root{
  --primary:#14303D;        /* deep petrol — 13.82:1 on white */
  --primary-dark:#0F2833;
  --primary-mid:#1D4557;    /* 10.29:1 */
  --primary-tint:#E6EDF1;
  --accent:#B5502E;         /* terracotta — 5.06:1 with white text */
  --accent-dark:#9E4322;    /* 6.40:1 — small accent text */
  --accent-soft:#E08A6A;    /* ONLY on dark backgrounds */
  --accent-tint:#FBEEE8;
  --text:#3E4A52;           /* body — 9.11:1 on white */
  --text-soft:#4A5560;      /* secondary — 7.61:1 */
  --bg:#FFFFFF;
  --bg-alt:#FAF7F3;
  --bg-alt2:#F2F5F7;
  --border:#E2DDD6;
  --border-cool:#DCE3E8;
  --radius:20px;
  --bs-body-font-family:'Inter',system-ui,-apple-system,'Segoe UI',sans-serif;
  --bs-body-color:var(--text);
  --bs-body-bg:var(--bg);
  --bs-link-color:var(--accent-dark);
  --bs-link-hover-color:var(--primary);
  --bs-border-color:var(--border-cool);
}
html{scroll-behavior:smooth;}
body{font-size:19px;line-height:1.72;color:var(--text);background:var(--bg);-webkit-font-smoothing:antialiased;padding-bottom:134px;overflow-x:hidden;}
@media (max-width:575px){body{padding-bottom:150px;}}
h1,h2,h3,h4,h5,h6{font-family:'Figtree',system-ui,sans-serif;font-weight:800;color:var(--primary);letter-spacing:-.022em;line-height:1.18;}
h1{font-size:clamp(34px,4.4vw,55px);margin-bottom:.5em;}
h2{font-size:clamp(27px,3.1vw,40px);margin-bottom:.6em;}
h3{font-size:clamp(20px,2vw,26px);margin-bottom:.5em;}
h4{font-size:20px;}
p{margin-bottom:1.15rem;}
img{max-width:100%;height:auto;}
a{color:var(--bs-link-color);text-decoration:none;}
a:hover{text-decoration:underline;color:var(--primary);}
a:focus-visible,button:focus-visible,.btn:focus-visible,.accordion-button:focus-visible{outline:3px solid var(--accent);outline-offset:3px;}
.lede{font-size:21px;line-height:1.66;color:var(--primary-mid);}
.eyebrow{display:inline-block;font-family:'Figtree',sans-serif;font-size:14px;font-weight:800;letter-spacing:.15em;text-transform:uppercase;color:var(--accent-dark);margin-bottom:14px;}
/* header */
.topbar{background:var(--primary-dark);color:#D5E0E7;font-size:16px;padding:10px 0;text-align:center;}
.topbar strong{color:#fff;}
.navbar{background:rgba(255,255,255,.97);backdrop-filter:blur(8px);border-bottom:1px solid var(--border);padding:13px 0;}
.navbar-brand{font-family:'Figtree',sans-serif;font-weight:800;font-size:27px;color:var(--primary)!important;display:flex;align-items:center;gap:10px;white-space:nowrap;}
.brand-mark{width:38px;height:38px;border-radius:12px;background:var(--primary);display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;}
.brand-mark svg{width:21px;height:21px;}
.navbar .nav-link{color:var(--primary-mid)!important;font-weight:500;font-size:16px;padding:.5rem .55rem!important;white-space:nowrap;}
.navbar .nav-link:hover,.navbar .nav-link[aria-current="page"]{color:var(--accent-dark)!important;}
@media (min-width:992px) and (max-width:1350px){.navbar .nav-link{padding:.5rem .34rem!important;font-size:14.8px;}}
/* buttons */
.btn{font-family:'Figtree',sans-serif;font-weight:700;border-radius:12px;padding:14px 28px;font-size:17px;border:0;transition:.18s;}
.btn-accent{background:var(--accent);color:#fff!important;}
.btn-accent:hover{background:var(--accent-dark);color:#fff!important;text-decoration:none;}
.btn-primary-jf{background:var(--primary);color:#fff!important;}
.btn-primary-jf:hover{background:var(--primary-dark);color:#fff!important;text-decoration:none;}
.btn-outline-jf{background:transparent;color:var(--primary)!important;box-shadow:inset 0 0 0 2px var(--border-cool);}
.btn-outline-jf:hover{box-shadow:inset 0 0 0 2px var(--primary);color:var(--primary)!important;text-decoration:none;}
.btn-on-dark{background:#fff;color:var(--primary)!important;}
.btn-on-dark:hover{background:var(--primary-tint);color:var(--primary)!important;text-decoration:none;}
.btn-lg{padding:17px 36px;font-size:18.5px;}
/* sections */
section{padding:80px 0;}
@media (max-width:767px){section{padding:54px 0;}}
@media (max-width:767px){.row.g-5,.row.g-4{--bs-gutter-x:1.5rem;}}
.sec-warm{background:var(--bg-alt);}
.sec-cool{background:var(--bg-alt2);}
.sec-dark{background:var(--primary);}
.sec-dark h1,.sec-dark h2,.sec-dark h3,.sec-dark h4{color:#FFFFFF;}
.sec-dark p,.sec-dark li,.sec-dark .lede{color:#CFDCE3;}
.sec-dark .eyebrow{color:var(--accent-soft);}
.sec-dark a{color:var(--accent-soft);} .sec-dark a:hover{color:#fff;}
.sec-dark strong{color:#fff;}
.hero{background:linear-gradient(163deg,#FDF4EE 0%,var(--bg-alt) 48%,#EEF3F6 100%);padding:64px 0 80px;}
.hero-art{position:relative;text-align:center;}
.hero-art::before{content:"";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:76%;padding-bottom:76%;border-radius:50%;background:radial-gradient(circle,rgba(181,80,46,.16) 0%,rgba(181,80,46,0) 68%);}
.hero-art img{position:relative;z-index:2;max-width:390px;width:100%;height:auto;object-fit:contain;}
/* cards */
.card-jf{background:#fff;border:1px solid var(--border-cool);border-radius:var(--radius);padding:32px;height:100%;transition:.18s;}
.card-jf:hover{border-color:var(--accent);box-shadow:0 12px 34px rgba(20,48,61,.08);}
.card-jf h3{font-size:21px;}
.sec-dark .card-jf{background:#1D4557;border-color:#2C5870;}
.sec-dark .card-jf h3{color:#fff;} .sec-dark .card-jf p{color:#CBD9E1;}
.ic{width:54px;height:54px;border-radius:15px;background:var(--accent-tint);display:flex;align-items:center;justify-content:center;margin-bottom:18px;}
.ic svg{width:26px;height:26px;stroke:var(--accent-dark);fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;}
.sec-dark .ic{background:rgba(224,138,106,.17);} .sec-dark .ic svg{stroke:var(--accent-soft);}
.pillrow{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px;}
.pill{display:inline-flex;align-items:center;gap:8px;font-size:16px;font-weight:600;color:var(--primary);background:#fff;border:1px solid var(--border);padding:9px 17px;border-radius:60px;}
.pill::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--accent);}
.statgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:13px;margin-top:30px;}
.statbox{background:#fff;border:1px solid var(--border);border-radius:15px;padding:20px 14px;text-align:center;}
.statbox .n{font-family:'Figtree',sans-serif;font-size:26px;font-weight:800;color:var(--accent-dark);line-height:1;}
.statbox .l{font-size:15px;color:var(--text-soft);margin-top:8px;line-height:1.42;}
@media (max-width:575px){.statgrid{grid-template-columns:1fr 1fr;}}
/* benefit 50/50 */
.bimg{background:var(--bg-alt);border:1px solid var(--border);border-radius:var(--radius);padding:30px;text-align:center;}
.bimg.cool{background:var(--bg-alt2);border-color:var(--border-cool);}
.bimg img{max-width:100%;height:auto;object-fit:contain;max-height:400px;border-radius:12px;}
@media (max-width:575px){.bimg{padding:18px;}.bimg img{max-width:100%!important;}}
/* trust badges — used once per page only */
.badges{display:grid;grid-template-columns:repeat(4,1fr);gap:28px;max-width:840px;margin:0 auto;}
.badges img{max-width:104px;width:100%;height:auto;margin:0 auto;display:block;}
.badges .cap{text-align:center;font-size:16px;font-weight:700;color:var(--primary);margin-top:12px;font-family:'Figtree',sans-serif;}
@media (max-width:600px){.badges{grid-template-columns:1fr 1fr;gap:30px;}}
/* spec panel */
.spec{background:#fff;border:1px solid var(--border-cool);border-radius:var(--radius);overflow:hidden;}
.spec .head{background:var(--primary);color:#fff;padding:16px 26px;font-family:'Figtree',sans-serif;font-weight:800;font-size:19px;}
.spec .r{display:grid;grid-template-columns:1fr auto;gap:16px;padding:14px 26px;border-bottom:1px solid var(--border-cool);font-size:17.5px;color:var(--text);}
.spec .r:last-child{border-bottom:none;}
.spec .r b{color:var(--primary);font-weight:700;white-space:nowrap;}
.spec .r.hl{background:var(--primary-tint);}
/* pricing — deliberately distinct from the card grid used elsewhere */
.plans{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;align-items:stretch;}
@media (max-width:991px){.plans{grid-template-columns:1fr;max-width:520px;margin:0 auto;}}
.plan{position:relative;background:#fff;border:1px solid var(--border-cool);border-radius:24px;overflow:hidden;display:flex;flex-direction:column;transition:.18s;}
.plan:hover{border-color:var(--accent);box-shadow:0 14px 40px rgba(20,48,61,.10);}
.plan .cap{background:var(--bg-alt2);padding:22px 24px 0;text-align:center;}
.plan .qty{font-family:'Figtree',sans-serif;font-size:25px;font-weight:800;color:var(--primary);}
.plan .sup{font-size:15.5px;color:var(--text-soft);margin-top:4px;}
.plan .shot{background:var(--bg-alt2);padding:12px 24px 20px;text-align:center;}
.plan .shot img{max-height:170px;width:auto;max-width:100%;object-fit:contain;margin:0 auto;display:block;}
.plan .body{padding:26px 24px 28px;display:flex;flex-direction:column;flex:1;}
.plan .ppb{font-family:'Figtree',sans-serif;font-size:52px;font-weight:800;color:var(--primary);line-height:1;text-align:center;}
.plan .ppb span{font-size:18px;font-weight:600;color:var(--text-soft);display:block;margin-top:6px;}
.plan .tot{text-align:center;font-size:17px;color:var(--text-soft);margin-top:12px;padding-top:12px;border-top:1px dashed var(--border-cool);}
.plan .tot b{color:var(--primary);font-size:20px;}
.plan .was{text-decoration:line-through;color:var(--text-soft);margin-left:6px;font-size:17px;}
.plan ul{list-style:none;padding:0;margin:18px 0 22px;}
.plan li{font-size:18px;padding:7px 0 7px 28px;position:relative;color:var(--text);}
.plan li::before{content:"";position:absolute;left:0;top:14px;width:14px;height:8px;border-left:2.5px solid var(--accent);border-bottom:2.5px solid var(--accent);transform:rotate(-45deg);}
.plan .btn{margin-top:auto;}
.plan.feature{border:2px solid var(--primary);}
.plan.feature .cap,.plan.feature .shot{background:var(--primary);}
.plan.feature .qty{color:#fff;} .plan.feature .sup{color:#BDD0DA;}
.plan .flag{position:absolute;top:0;right:0;background:var(--accent);color:#fff;font-family:'Figtree',sans-serif;font-weight:800;font-size:13.5px;letter-spacing:.06em;text-transform:uppercase;padding:8px 18px;border-bottom-left-radius:14px;}
/* faq */
.faq-item{background:#fff;border:1px solid var(--border-cool);border-radius:16px;margin-bottom:13px;overflow:hidden;}
.faq-item .accordion-button{font-family:'Figtree',sans-serif;font-weight:700;font-size:18.5px;color:var(--primary);background:#fff;padding:21px 26px;box-shadow:none;}
.faq-item .accordion-button:not(.collapsed){background:var(--primary-tint);color:var(--primary);}
.faq-item .accordion-body{padding:4px 26px 24px;font-size:18px;color:var(--text);}
/* notes */
.note{background:var(--accent-tint);border:1px solid #EDCDBE;border-left:5px solid var(--accent);border-radius:16px;padding:26px 30px;margin:28px 0;}
.note h3{font-size:20px;color:#7E3419;margin-bottom:12px;}
.note p,.note li{font-size:18px;color:#5A3527;line-height:1.68;}
.note ul{margin:10px 0 0 18px;} .note li{margin-bottom:8px;}
.note strong{color:#4A2A1E;}
.info{background:var(--primary-tint);border:1px solid #C6D6DF;border-left:5px solid var(--primary);border-radius:16px;padding:26px 30px;margin:28px 0;}
.info h3{font-size:20px;color:var(--primary-dark);margin-bottom:12px;}
.info p,.info li{font-size:18px;color:#2B4351;line-height:1.68;}
.info ul{margin:10px 0 0 18px;} .info li{margin-bottom:8px;}
.ownernote{border:2px dashed var(--accent);background:#FDF6F2;border-radius:16px;padding:26px 30px;margin-top:28px;}
.ownernote h3{font-size:20px;color:#7E3419;margin-bottom:12px;}
.ownernote p,.ownernote li{font-size:18px;color:#5A3527;line-height:1.68;}
.ownernote ul{margin:10px 0 0 18px;} .ownernote li{margin-bottom:8px;}
.rev-card{background:#fff;border:1px solid var(--border-cool);border-radius:var(--radius);padding:28px;height:100%;}
.rev-card .ph{display:inline-block;font-size:13.5px;font-weight:800;letter-spacing:.07em;text-transform:uppercase;color:#7E3419;background:var(--accent-tint);border:1px dashed #E0B6A2;padding:6px 13px;border-radius:40px;margin-bottom:15px;}
.rev-card blockquote{font-size:18px;font-style:italic;color:var(--primary-mid);margin:0 0 15px;line-height:1.6;}
.rev-card .who{font-size:17px;color:var(--text-soft);border-top:1px solid var(--border-cool);padding-top:13px;}
/* comparison table */
.cmp{width:100%;border-collapse:collapse;font-size:17.5px;border:1px solid var(--border-cool);border-radius:14px;overflow:hidden;}
.cmp th{background:var(--primary);color:#fff;font-family:'Figtree',sans-serif;font-size:16px;text-align:left;padding:15px 17px;}
.cmp td{padding:14px 17px;border-bottom:1px solid var(--border-cool);color:var(--text);background:#fff;font-size:18px;}
.cmp td:first-child{color:var(--primary);font-weight:700;}
.cmp tr:last-child td{border-bottom:none;}
@media (max-width:820px){.cmp,.cmp tbody,.cmp tr,.cmp td{display:block;width:100%;}.cmp thead{display:none;}.cmp tr{border-bottom:2px solid var(--border-cool);}.cmp td{border:0;padding:6px 17px;}.cmp td::before{content:attr(data-l);display:block;font-size:13.5px;text-transform:uppercase;letter-spacing:.06em;color:var(--primary);font-weight:800;}}
.step{display:grid;grid-template-columns:62px 1fr;gap:24px;padding:28px 0;border-bottom:1px solid var(--border-cool);}
.step:last-child{border-bottom:none;}
.step .n{font-family:'Figtree',sans-serif;font-size:16px;font-weight:800;color:#fff;background:var(--primary);width:54px;height:54px;border-radius:15px;display:flex;align-items:center;justify-content:center;}
@media (max-width:575px){.step{grid-template-columns:1fr;gap:12px;}}
.prose{font-size:19px;color:var(--text);}
.prose h2{margin-top:1.7em;} .prose h3{margin-top:1.4em;color:var(--primary-mid);}
.prose ul,.prose ol{margin-bottom:1.2rem;} .prose li{margin-bottom:.6rem;color:var(--text);}
.prose strong{color:var(--primary);}
code{color:#7E2F5A;background:#F4F1F3;padding:2px 6px;border-radius:5px;font-size:.9em;}
.crumbs{font-size:17px;color:var(--text-soft);padding:18px 0 0;}
.crumbs a{color:var(--accent-dark);}
.src{background:var(--bg-alt);border:1px solid var(--border);border-radius:16px;padding:24px 28px;margin-top:30px;}
.src h4{font-size:18.5px;margin-bottom:12px;}
.src ul{margin:0;padding-left:20px;} .src li{font-size:18px;margin-bottom:8px;}
.disc{background:var(--bg-alt);border-radius:16px;padding:24px 28px;margin-top:22px;font-size:18px;color:var(--text-soft);}
.post-card{background:#fff;border:1px solid var(--border-cool);border-radius:var(--radius);padding:28px;height:100%;transition:.18s;}
.post-card:hover{border-color:var(--accent);box-shadow:0 12px 32px rgba(20,48,61,.08);}
.post-card .tag{font-size:13.5px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--accent-dark);}
.post-card h3{font-size:21px;margin:10px 0;}
/* closing CTA — deliberately its own treatment */
.closer{background:var(--primary);border-radius:28px;padding:52px 46px;position:relative;overflow:hidden;}
.closer::after{content:"";position:absolute;right:-90px;top:-90px;width:320px;height:320px;border-radius:50%;background:radial-gradient(circle,rgba(224,138,106,.20) 0%,rgba(224,138,106,0) 70%);}
.closer h2,.closer h3{color:#fff;} .closer p{color:#CFDCE3;}
.closer .eyebrow{color:var(--accent-soft);}
@media (max-width:575px){.closer{padding:34px 24px;border-radius:20px;}}
/* footer */
footer{background:var(--primary-dark);color:#AFC0CA;padding:64px 0 28px;}
footer h4{color:#fff;font-size:18.5px;margin-bottom:16px;font-family:'Figtree',sans-serif;}
footer p{color:#AFC0CA;}
footer a{color:#C2D0D9;} footer a:hover{color:#fff;}
footer ul{list-style:none;padding:0;margin:0;} footer li{margin-bottom:9px;font-size:18px;}
.foot-legal{border-top:1px solid #274050;margin-top:36px;padding-top:28px;font-size:18px;color:#A3B4BF;}
.foot-legal strong{color:#E3EAEF;}
/* fixed CTA */
.cta-bar{position:fixed;bottom:0;left:0;right:0;z-index:9999;background:var(--primary-dark);border-top:3px solid var(--accent);box-shadow:0 -6px 26px rgba(0,0,0,.26);}
.cta-bar .inner{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:15px 0;}
.cta-bar .lbl{font-family:'Figtree',sans-serif;font-weight:800;font-size:19px;color:#fff;line-height:1.26;}
.cta-bar .sub{font-size:15.5px;color:var(--accent-soft);font-weight:600;}
.cta-bar .btn{padding:13px 28px;font-size:16.5px;}
@media (max-width:575px){
  .cta-bar .inner{padding:11px 0;gap:10px;}
  .cta-bar .lbl{font-size:15px;} .cta-bar .sub{font-size:13px;}
  .cta-bar .btn{padding:11px 15px;font-size:14.5px;}
}