@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,300;0,9..144,500;0,9..144,700;1,9..144,300&family=Poppins:wght@400;500;600&display=swap');

@font-face { font-family: 'Inter'; src: url('../fonts/Inter-4/web/InterDisplay-Thin.woff2') format('woff2'); font-weight: 100; font-style: normal; font-display: swap; }
@font-face { font-family: 'Inter'; src: url('../fonts/Inter-4/web/InterDisplay-ThinItalic.woff2') format('woff2'); font-weight: 100; font-style: italic; font-display: swap; }
@font-face { font-family: 'Inter'; src: url('../fonts/Inter-4/web/InterDisplay-ExtraLight.woff2') format('woff2'); font-weight: 200; font-style: normal; font-display: swap; }
@font-face { font-family: 'Inter'; src: url('../fonts/Inter-4/web/InterDisplay-ExtraLightItalic.woff2') format('woff2'); font-weight: 200; font-style: italic; font-display: swap; }
@font-face { font-family: 'Inter'; src: url('../fonts/Inter-4/web/InterDisplay-Light.woff2') format('woff2'); font-weight: 300; font-style: normal; font-display: swap; }
@font-face { font-family: 'Inter'; src: url('../fonts/Inter-4/web/InterDisplay-LightItalic.woff2') format('woff2'); font-weight: 300; font-style: italic; font-display: swap; }
@font-face { font-family: 'Inter'; src: url('../fonts/Inter-4/web/InterDisplay-Regular.woff2') format('woff2'); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: 'Inter'; src: url('../fonts/Inter-4/web/InterDisplay-Italic.woff2') format('woff2'); font-weight: 400; font-style: italic; font-display: swap; }
@font-face { font-family: 'Inter'; src: url('../fonts/Inter-4/web/InterDisplay-Medium.woff2') format('woff2'); font-weight: 500; font-style: normal; font-display: swap; }
@font-face { font-family: 'Inter'; src: url('../fonts/Inter-4/web/InterDisplay-MediumItalic.woff2') format('woff2'); font-weight: 500; font-style: italic; font-display: swap; }
@font-face { font-family: 'Inter'; src: url('../fonts/Inter-4/web/InterDisplay-SemiBold.woff2') format('woff2'); font-weight: 600; font-style: normal; font-display: swap; }
@font-face { font-family: 'Inter'; src: url('../fonts/Inter-4/web/InterDisplay-SemiBoldItalic.woff2') format('woff2'); font-weight: 600; font-style: italic; font-display: swap; }
@font-face { font-family: 'Inter'; src: url('../fonts/Inter-4/web/InterDisplay-Bold.woff2') format('woff2'); font-weight: 700; font-style: normal; font-display: swap; }
@font-face { font-family: 'Inter'; src: url('../fonts/Inter-4/web/InterDisplay-BoldItalic.woff2') format('woff2'); font-weight: 700; font-style: italic; font-display: swap; }
@font-face { font-family: 'Inter'; src: url('../fonts/Inter-4/web/InterDisplay-ExtraBold.woff2') format('woff2'); font-weight: 800; font-style: normal; font-display: swap; }
@font-face { font-family: 'Inter'; src: url('../fonts/Inter-4/web/InterDisplay-ExtraBoldItalic.woff2') format('woff2'); font-weight: 800; font-style: italic; font-display: swap; }
@font-face { font-family: 'Inter'; src: url('../fonts/Inter-4/web/InterDisplay-Black.woff2') format('woff2'); font-weight: 900; font-style: normal; font-display: swap; }
@font-face { font-family: 'Inter'; src: url('../fonts/Inter-4/web/InterDisplay-BlackItalic.woff2') format('woff2'); font-weight: 900; font-style: italic; font-display: swap; }
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{--text:#031225;--text2:#03122599;--text3:#03122570;--bg:#fff;--bg2:#F9F6EE;--border:#03122599;--border2:#03122588;
    --g:#008F7D;
    --salmon:#EB6C5F;
    --salmon11:#EB6C5F11;
    --salmon22:#EB6C5F22;
    --salmon44:#EB6C5F44;
    --salmon66:#EB6C5F66;
    --deepred:#D92B1A;
    --deepred11:#D92B1A11;
    --deepred22:#D92B1A22;
    --deepred44:#D92B1A44;
    --deepred66:#D92B1A66;
    --purple:#9B6DC9;
    --purple11:#9B6DC911;
    --purple22:#9B6DC922;
    --purple44:#9B6DC944;
    --purple66:#9B6DC966;
    --blue:#83BACE;
    --blue11:#83BACE11;
    --blue22:#83BACE22;
    --blue44:#83BACE44;
    --blue66:#83BACE66;
    --gold:#E8BF2F;
    --gold11:#E8BF2F11;
    --gold22:#E8BF2F22;
    --gold44:#E8BF2F44;
    --gold66:#E8BF2F66;
    --teal:#5EB5AA;
    --teal11:#5EB5AA11;
    --teal22:#5EB5AA22;
    --teal44:#5EB5AA44;
    --teal66:#5EB5AA66;
    --darkteal:#004C42;
    --deepnavy:#082D5D;
    --deepnavy11:#082D5D11;
    --deepnavy22:#082D5D22;
    --deepnavy44:#082D5D44;
    --deepnavy66:#082D5D66;
    --navy:#0C448C;
    --navy11:#0C448C11;
    --navy22:#0C448C22;
    --navy44:#0C448C44;
    --navy66:#0C448C66;
    --glow:#B1C11F;
    --glow11:#B1C11F11;
    --glow22:#B1C11F22;
    --glow44:#B1C11F44;
    --glow66:#B1C11F66;
}
body{
  font-family:'Inter',sans-serif;
    font-size: 17px;
  line-height: 1.65;
  letter-spacing: 0.01em;
  color:var(--text);background:var(--bg);}
.root{max-width:1330px;margin:0 auto;padding:0 24px 4rem}
.site-nav{display:flex;align-items:center;justify-content:space-between;padding:18px 0;}
.nav-wordmark{font-family:'Fraunces',serif;font-size:20px;font-weight:700;letter-spacing:-.02em;text-decoration:none;color:var(--g)}
.nav-links{display:flex;gap:18px;align-items:center}
.nav-links a{font-size:14px;color:var(--text2);text-decoration:none}
.nav-dl{display:flex;gap:8px}
.nav-dl a{font-size:13px;font-weight:500;padding:7px 14px;border-radius:6px;text-decoration:none;border:.5px solid var(--border2);color:var(--text2)}
.nav-dl a.primary{background:var(--g);color:#fff;border-color:var(--g)}
.nav-center{display:flex;gap:6px}
.nav-product{font-size:13px;font-weight:500;padding:5px 11px;border-radius:20px;color:var(--text);text-decoration:none;border:.5px solid transparent}
.nav-product:hover{background:var(--bg2)}
.bc{display:flex;flex-wrap:wrap;align-items:center;gap:6px;font-size:13px;color:var(--text3);padding:16px 0 0;margin-bottom:28px}
.bc a{color:var(--text2);text-decoration:none}.bc span{opacity:.4}.bc-current{opacity:1;color:var(--text2)}
.eyebrow{font-size:12px;font-weight:500;letter-spacing:.1em;text-transform:uppercase;color:var(--g);display:block;margin-bottom:12px}
h1{font-family:'Fraunces',serif;font-size:44px;font-weight:700;line-height:1.06;letter-spacing:-.022em;margin:0 0 16px}
h1 em{font-style:italic;font-weight:300;color:var(--salmon)}
h2{font-family:'Fraunces',serif;font-size:26px;font-weight:700;line-height:1.2;margin:32px 0 12px}
h2 em{font-style:italic;font-weight:300;color:var(--salmon)}
h2:first-child{margin-top:0}
h3{font-family:'Fraunces',serif;font-size:18px;font-weight:700;margin:24px 0 8px}
.intro{font-size:17px;line-height:1.75;color:var(--text2);max-width:540px;margin:0 0 24px}
p,.body-text{font-size:16px;line-height:1.8;color:var(--text2);margin:0 0 16px}
p a{color:var(--g)}
a{color:var(--g)}
.hero{padding:52px 0 44px;border:none;margin-bottom:0px;text-align:center}
.hero .intro{margin-left:auto;margin-right:auto}
.kicker{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:500;letter-spacing:.06em;text-transform:uppercase;color:var(--g);margin-bottom:20px}
.kicker-dot{width:6px;height:6px;border-radius:50%;background:var(--g)}
.hero-actions{display:flex;gap:10px;justify-content:center;align-items:center;margin-bottom:12px}
.btn{font-size:15px;font-weight:500;padding:12px 24px;border-radius:8px;text-decoration:none;display:inline-block;border:.5px solid var(--border2);color:var(--text)}
.btn-primary{background:var(--g);color:#fff;border-color:var(--g)}
.btn-ghost{border:none;color:var(--text2);padding:12px 4px}
.btn-salmon{background:var(--salmon22);color:var(--salmon);border:none}
.btn-salmon-solid{background:var(--salmon);color:var(--bg);border:none}
.fine-print{font-size:13px;color:var(--text3)}
.strip{border-top:.5px solid var(--border);border-bottom:.5px solid var(--border);padding:18px 0;display:grid;grid-template-columns:repeat(4,1fr);margin-bottom:44px}
.strip-item{padding:0 20px;border-right:.5px solid var(--border);text-align:center}
.strip-item:last-child{border-right:none}
.strip-num{font-family:'Fraunces',serif;font-size:22px;font-weight:700;line-height:1;margin-bottom:4px}
.strip-label{font-size:13px;color:var(--text3);line-height:1.3}
.section-label{font-size:12px;font-weight:500;letter-spacing:.1em;text-transform:uppercase;color:var(--text3);margin:32px 0 14px;display:block}
.card-label{font-size:12px;font-weight:500;letter-spacing:.1em;text-transform:uppercase;color:var(--text3);font-family:'Inter',sans-serif;}
.card{border:.5px solid var(--salmon);border-radius:12px;padding:22px;display:block;text-decoration:none;transition:border-color .15s;background:var(--salmon11);border-color: var(--salmon) !important;}
.card-cream{border-radius:12px;padding:22px;display:block;text-decoration:none;transition:border-color .15s;background:var(--bg2);border-color: var(--bg2) !important;}
.card-a{border:.5px solid var(--text2) !important}
.card:hover{border-color:var(--border2)}
.card-grid-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-bottom:36px}
.card-grid-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-bottom:36px}
.card-title{font-family:'Fraunces',serif;font-size:17px;font-weight:700;margin-bottom:6px;color:var(--text)}
.card-body{font-size:15px;line-height:1.65;color:var(--text2)}
.card-ghost{background:transparent !important;}
.card-min{background:transparent !important;border:.5px solid var(--border) !important;}
.card.folkic{border-color:var(--g) !important;background:var(--teal22) !important;}
.feature-row{display:grid;grid-template-columns:40px 1fr;gap:14px;padding:20px 0;border-bottom:.5px solid var(--border);align-items:start}
.feature-row:last-child{border-bottom:none}
.feature-icon{width:36px;height:36px;border-radius:10px;background:var(--gd);display:flex;align-items:center;justify-content:center}
.feature-name{font-size:16px;font-weight:500;color:var(--text);margin-bottom:5px}
.feature-desc{font-size:15px;color:var(--text2);line-height:1.65}
.step-row{display:grid;grid-template-columns:32px 1fr;gap:14px;padding:0 0}
.step-num{font-family:'Fraunces',serif;font-size:18px;font-weight:500;color:var(--bg);line-height:1;background: var(--salmon);border-radius: 50%;display: flex;align-items: center;justify-content: center;}
.step-title{font-size:16px;font-weight:500;margin-bottom:6px;}
.step-desc{font-size:15px;color:var(--text2);line-height:1.65;margin-bottom: 64px;}
.faq-item{border-bottom:.5px solid var(--border);padding:16px 0}
.faq-q{font-size:15px;font-weight:500;color:var(--text);margin-bottom:8px}
.faq-a{font-size:15px;color:var(--text2);line-height:1.7}
.faq-a a{color:var(--text2)}
.faq-last{border-bottom:none;padding-bottom:0;margin-bottom:0}
.chip-strip{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:18px}
.chip{font-size:14px;font-weight:500;padding:7px 14px;border-radius:20px;border:.5px solid var(--border2);color:var(--text2);background:var(--bg)}
.chip.active{border-color:var(--teal66);color:var(--g);background:var(--gd)}
.fanotype-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-bottom:32px}
.ft-card{border:.5px solid var(--border);border-radius:10px;padding:16px;text-decoration:none;display:block}
.ft-card:hover{border-color:var(--teal44)}
.ft-dot{width:8px;height:8px;border-radius:50%;margin-bottom:10px}
.ft-name{font-family:'Fraunces',serif;font-size:15px;font-weight:600;margin-bottom:4px}
.ft-desc{font-size:13px;color:var(--text3);line-height:1.45}
.economy-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:28px}
.economy-card{background:var(--bg2);border-radius:10px;padding:16px}
.economy-name{font-size:13px;font-weight:500;letter-spacing:.06em;text-transform:uppercase;margin-bottom:6px}
.economy-desc{font-size:13px;color:var(--text2);line-height:1.55}
.masslore-bridge{display:grid;grid-template-columns:3fr 2fr;gap:12px;margin-bottom:36px;align-items:start}
.masslore-main{border:.5px solid var(--gold44);border-radius:12px;padding:22px}
.masslore-kicker{font-size:12px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:var(--salmon);margin-bottom:8px}
.masslore-title{font-family:'Fraunces',serif;font-size:20px;font-weight:700;margin:16px 0 8px 0;line-height:1.2;color:var(--text)}
.masslore-body{font-size:14px;color:var(--text2);line-height:1.6;margin-bottom:16px}
.masslore-link{font-size:14px;font-weight:500;color:var(--salmon);text-decoration:none}
.price-mini{border:.5px solid var(--border);border-radius:12px;padding:18px}
.price-mini-title{font-family:'Fraunces',serif;font-size:16px;font-weight:700;margin-bottom:12px}
.price-row{display:flex;align-items:center;justify-content:space-between;padding:8px 0;border-bottom:.5px solid var(--border)}
.price-row:last-child{border-bottom:none}
.price-tier-name{font-size:14px;font-weight:500}
.price-tier-price{font-size:13px;color:var(--text3)}
.price-tier-price.free{color:var(--g);font-weight:500}
.price-tiers{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:24px 0 12px}
.price-tier{border:.5px solid var(--border);border-radius:12px;padding:18px;display:flex;flex-direction:column}
.price-tier.featured{border:2px solid var(--salmon66)}
.tier-badge{font-size:10.6px;font-weight:500;letter-spacing:.06em;text-transform:uppercase;padding:3px 8px;border-radius:20px;margin-bottom:10px;display:inline-block;align-self:flex-start;background:var(--bg2);color:var(--text3)}
.tier-badge.best{background:var(--salmon22);color:var(--salmon);border:.5px solid var(--salmon66)}
.tier-name{font-family:'Fraunces',serif;font-size:20px;font-weight:700;margin-bottom:4px}
.tier-sub{font-size:12px;font-style:italic;color:var(--text3);margin-bottom:12px}
.tier-price{font-family:'Fraunces',serif;font-size:26px;font-weight:700;margin-bottom:2px}
.tier-per{font-size:13px;color:var(--text3);margin-bottom:14px}
.tier-was{font-size:12px;color:var(--text3);text-decoration:line-through;margin-left:5px}
.tier-cta{font-size:14px;font-weight:500;padding:8px 0;border-radius:7px;text-align:center;display:block;text-decoration:none;margin-bottom:14px;border:.5px solid var(--border2);color:var(--text)}
.tier-cta.featured{background:var(--salmon);color:#fff;border-color:var(--salmon)}
.tier-divider{border:none;border-top:.5px solid var(--bg);margin:12px 0 24px}
.tier-feat{font-size:13px;color:var(--text2);line-height:1.5;margin-bottom:6px;display:flex;align-items:flex-start;gap:6px}
.tier-dot{width:4px;height:4px;border-radius:50%;background:var(--text3);margin-top:6px;flex-shrink:0}
.tier-dot.g{background:var(--g)}.tier-dot.p{background:var(--salmon)}.tier-dot.a{background:var(--salmon)}
.tier-alloc{margin-top:10px;font-size:12px;color:var(--text3)}
.tier-alloc .k{color:var(--salmon);font-weight:500}
.tier-alloc .c{color:var(--salmon);font-weight:500}
.lumo-banner{border:.5px solid var(--teal44);border-radius:10px;padding:14px 18px;margin-bottom:32px;display:flex;align-items:center;gap:14px}
.lumo-dot{width:8px;height:8px;border-radius:50%;background:var(--g);flex-shrink:0}
.lumo-text{font-size:15px;color:var(--text2);line-height:1.55;flex:1}
.lumo-text strong{font-weight:500;color:var(--text)}
.lumo-link{font-size:14px;font-weight:500;color:var(--g);text-decoration:none;flex-shrink:0}
.focus-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-bottom:32px}
.focus-card{border:.5px solid var(--border);border-radius:10px;padding:16px}
.focus-title{font-family:'Fraunces',serif;font-size:15px;font-weight:600;margin-bottom:10px}
.focus-row{display:flex;justify-content:space-between;gap:8px;font-size:13px;padding:5px 0;border-bottom:.5px solid var(--border)}
.focus-row:last-child{border-bottom:none;padding-bottom:0}
.focus-label{color:var(--text3)}
.focus-val{font-weight:500;text-align:right}
.meta-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-bottom:24px}
.meta-grid.econ-4{grid-template-columns:repeat(4,minmax(0,1fr));margin-bottom: 10px;}
.meta-grid.econ-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.meta-cell{background:var(--bg2);border-radius:8px;padding:12px 14px}
.meta-label{font-size:12px;font-weight:500;letter-spacing:.06em;text-transform:uppercase;color:var(--text3);margin-bottom:4px}
.meta-value{font-size:15px;font-weight:500}
hr{border:none;border-top:.5px solid var(--border);margin:32px 0}
.site-footer{border-top:.5px solid var(--border);padding-top:24px;margin-top:44px;display:flex;align-items:center;justify-content:space-between}
.footer-brand{font-size:13px;color:var(--text3)}
.footer-brand a{color:var(--g);text-decoration:none}
.footer-links{display:flex;gap:16px}
.footer-links a{font-size:13px;color:var(--text3);text-decoration:none}

/* Header image: swap to smaller bg, adjust size/position */
.header-image{position:relative;left:50%;transform:translateX(-50%);width:100vw;height:610px;background-image:url('../img/FolkicCrowd.svg');background-repeat:no-repeat;background-position:center bottom;background-size:1550px auto;overflow:hidden;}
.header-line{position: relative;left: 50%;transform: translateX(-50%);width: 100vw;height: 1px;background: var(--salmon);margin: 0 auto;}
.download-page{display: grid; gap: 44px; grid-template-columns: 1fr 1.4fr;}
.download-div{display: block;text-align: left;}
.download-div-2{display: none;}
.download-image{width:600px;}


/* ─── RESPONSIVE ─────────────────────────────────────────────────────────── */
@media (max-width: 1240px) {
    .card-grid-3 { grid-template-columns: 1fr 1fr}
}
@media (max-width: 940px) {
      .price-tiers { grid-template-columns: 1fr 1fr }
    .download-image{width:500px; margin:60px 0 0 -50px;}
}
@media (max-width: 740px) {
  .root { padding: 0 24px 3rem }

  /* Nav: hide text links, keep wordmark + one CTA */
  .nav-center { display: none }
  .nav-links { display: none }
  .nav-dl a:first-child { display: none }
  .site-nav { padding: 14px 0 }

  /* Typography */
  h1 { font-size: 32px }
  h2 { font-size: 22px }
  .intro { font-size:16px }
  .hero { padding: 36px 0 28px }

  /* Grids */
  .card-grid-2 { grid-template-columns: 1fr }
  .card-grid-3 { grid-template-columns: 1fr }
  .fanotype-grid { grid-template-columns: 1fr 1fr }
  .economy-grid { grid-template-columns: 1fr 1fr }
  .masslore-bridge { grid-template-columns: 1fr }
  .focus-grid { grid-template-columns: 1fr }
  .meta-grid { grid-template-columns: 1fr 1fr }
  .tier-price{font-size:23px;}

  /* Strip: 2 per row */
  .strip { grid-template-columns: 1fr 1fr }
  .strip-item:nth-child(3) { border-top: none }
  .strip-item:nth-child(4) { border-top: .5px solid var(--border); border-right: none }

  .footer-links{display:grid;gap:0px;grid-template-columns:75px 1fr !important;}

  .download-div{display: none}
  .download-div-2{display: block;text-align: center;width: 100%;margin-left: 0;margin-right: 0;}
  .download-page{display: grid; gap: 24px; grid-template-columns: 1fr;}
  .download-image{width:95%;margin-left: 0;margin-top: 20px;}

}

@media (max-width: 520px) {
  h1 { font-size: 26px }
  .price-tiers { grid-template-columns: 1fr }
  .fanotype-grid { grid-template-columns: 1fr }
  .economy-grid { grid-template-columns: 1fr }
  .meta-grid { grid-template-columns: 1fr !important}
  .download-div-2{display: block;text-align: center;overflow: hidden;width: calc(100% + 48px);margin-left: -24px;margin-right: -24px;}
  .download-image{width:150%;margin-left: -25%;}
  .header-image{position:relative;left:50%;transform:translateX(-50%);width:100vw;height:375px;background-image:url('../img/FolkicCrowd.svg');background-repeat:no-repeat;background-position:center bottom;background-size:950px auto;overflow:hidden;}
  .head-1 {background-position:50% bottom;}
}