/* Bloom public pages (features, integrations, pricing, guides).
   Built on the app's own tokens (index.html :root) so these pages read as
   part of Bloom. Buttons use the deep pink → lavender pair rather than the
   app's pastel gradient so white text keeps WCAG AA contrast. */

@font-face{font-family:'Poppins';font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/poppins-latin-400-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Poppins';font-style:normal;font-weight:600;font-display:swap;src:url(/fonts/poppins-latin-600-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Poppins';font-style:normal;font-weight:700;font-display:swap;src:url(/fonts/poppins-latin-700-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Quicksand';font-style:normal;font-weight:700;font-display:swap;src:url(/fonts/quicksand-latin-700-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}

:root{
  color-scheme:light;
  --pink:#ff7eb6; --pink-deep:#b52f6c; --lav:#7a4fd0;
  --bg1:#fff4fa; --bg2:#f3ecff; --bg3:#ffeef3;
  --card:#ffffff; --line:#f1dcea; --ink:#4a3a52; --ink-strong:#2f2236; --ink-soft:#6b5878;
  --ok:#1a7d52; --ok-fill:#e3f5ec; --warn:#8a5200; --warn-fill:#fff1dc; --lav-fill:#efe6ff; --soft-fill:#fbeef5; --no:#7a6a84; --no-fill:#f1ecf4;
  --grad:linear-gradient(135deg,#ff8fbf 0%,#c690ff 100%);
  --btn:linear-gradient(135deg,#b52f6c 0%,#7a4fd0 100%);
  --shadow:0 10px 30px rgba(214,140,189,.18);
  --radius-card:22px; --radius-btn:999px;
  --measure:68ch;
}
@media (prefers-color-scheme: dark){
  :root{
    color-scheme:dark;
    --pink:#ff7eb6; --pink-deep:#ff8fc2; --lav:#cfb0ff;
    --bg1:#1c1420; --bg2:#1a1626; --bg3:#201521;
    --card:#2a2030; --line:#3d3045; --ink:#eadff0; --ink-strong:#fbf4fd; --ink-soft:#c3b0cc;
    --ok:#5fe0a6; --ok-fill:#1f3a2e; --warn:#ffc15e; --warn-fill:#3a2c17; --lav-fill:#3a2d52; --soft-fill:#3a2d42; --no:#b9a8c4; --no-fill:#332a3a;
    --btn:linear-gradient(135deg,#c2306f 0%,#7a4fd0 100%);
    --shadow:0 10px 30px rgba(0,0,0,.35);
  }
}

*{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;}
body{margin:0;font-family:'Poppins',system-ui,-apple-system,'Segoe UI',sans-serif;color:var(--ink);font-size:16px;line-height:1.7;
  background:linear-gradient(160deg,var(--bg1),var(--bg2) 55%,var(--bg3));background-color:var(--bg1);min-height:100vh;-webkit-font-smoothing:antialiased;overflow-wrap:break-word;}
img{max-width:100%;height:auto;}
a{color:var(--pink-deep);text-underline-offset:3px;}
a:hover{color:var(--lav);}
:focus-visible{outline:3px solid var(--lav);outline-offset:3px;border-radius:6px;}
.wrap{max-width:1080px;margin:0 auto;padding-inline:20px;}
.skip{position:absolute;left:-9999px;top:8px;background:var(--card);padding:8px 14px;border-radius:10px;z-index:10;}
.skip:focus{left:12px;}

/* Header */
.site-header{position:sticky;top:0;z-index:5;background:color-mix(in srgb,var(--bg1) 88%,transparent);backdrop-filter:saturate(1.4) blur(10px);-webkit-backdrop-filter:saturate(1.4) blur(10px);border-bottom:1px solid var(--line);}
.bar{display:flex;align-items:center;gap:18px;min-height:64px;}
.brand{display:inline-flex;align-items:center;gap:9px;text-decoration:none;}
.brand img{border-radius:9px;display:block;}
.brand span{font-family:'Quicksand',sans-serif;font-weight:700;font-size:22px;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;}
.nav-main{display:flex;gap:4px;margin-left:12px;}
.nav-main a{color:var(--ink);text-decoration:none;font-weight:600;font-size:15px;padding:8px 12px;border-radius:12px;}
.nav-main a:hover,.nav-main a[aria-current="page"]{background:var(--soft-fill);color:var(--pink-deep);}
.bar-actions{margin-left:auto;display:flex;align-items:center;gap:10px;}
.signin{color:var(--ink);font-weight:600;font-size:15px;text-decoration:none;padding:8px 10px;}
.nav-mobile{display:none;}
@media (max-width:820px){
  .nav-main,.signin{display:none;}
  .nav-mobile{display:block;position:relative;}
  .nav-mobile summary{list-style:none;cursor:pointer;width:44px;height:44px;display:grid;place-content:center;gap:5px;border-radius:12px;}
  .nav-mobile summary::-webkit-details-marker{display:none;}
  .nav-mobile summary span{display:block;width:22px;height:2px;background:var(--ink);border-radius:2px;}
  .nav-mobile nav{position:absolute;right:0;top:52px;background:var(--card);border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow);padding:8px;display:grid;min-width:210px;}
  .nav-mobile nav a{padding:12px 14px;border-radius:12px;color:var(--ink);text-decoration:none;font-weight:600;}
  .nav-mobile nav a:hover{background:var(--soft-fill);}
}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:12px 24px;border-radius:var(--radius-btn);background:var(--btn);color:#fff;font-weight:600;font-size:16px;text-decoration:none;box-shadow:0 6px 16px rgba(181,47,108,.28);transition:transform .15s,filter .15s;}
.btn:hover{color:#fff;transform:translateY(-1px);filter:brightness(1.06);}
.btn-sm{min-height:40px;padding:8px 18px;font-size:15px;white-space:nowrap;}
@media (max-width:400px){.bar{gap:10px;}.brand span{font-size:19px;}.brand img{width:30px;height:30px;}.btn-sm{padding:8px 14px;font-size:14px;}}
.btn-ghost{background:var(--card);color:var(--pink-deep);border:1.5px solid var(--pink);box-shadow:none;}
.btn-ghost:hover{color:var(--pink-deep);}
.btn-light{background:#fff;color:#8e2458;box-shadow:none;}
.btn-light:hover{color:#8e2458;}
@media (prefers-reduced-motion: reduce){.btn{transition:none;}.btn:hover{transform:none;}}

/* Breadcrumbs + hero */
.crumbs ol{list-style:none;display:flex;flex-wrap:wrap;gap:6px;padding:0;margin:22px 0 0;font-size:14px;color:var(--ink-soft);}
.crumbs li+li::before{content:"›";margin-right:6px;color:var(--ink-soft);}
.crumbs a{color:var(--ink-soft);}
.hero{padding-block:34px 18px;max-width:780px;}
.eyebrow{margin:0 0 10px;font-size:13px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--lav);}
h1,h2,h3{color:var(--ink-strong);line-height:1.2;text-wrap:balance;}
h1{font-size:clamp(32px,5.4vw,50px);font-weight:700;letter-spacing:-.02em;margin:0;}
.lede{font-size:clamp(17px,2.2vw,20px);color:var(--ink);margin:16px 0 24px;max-width:var(--measure);}
.cta-row{display:flex;flex-wrap:wrap;gap:12px;}
.fine{font-size:14px;color:var(--ink-soft);margin:12px 0 0;}

/* Content blocks */
.block{padding-block:30px;border-top:1px solid var(--line);}
.block h2{font-size:clamp(24px,3.4vw,32px);margin:0 0 14px;letter-spacing:-.01em;}
.block h3{font-size:19px;margin:22px 0 8px;}
.block p,.block li{max-width:var(--measure);}
.block ul,.block ol{padding-left:22px;}
.block li{margin:6px 0;}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:16px;margin:18px 0 6px;}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius-card);padding:20px 22px;box-shadow:var(--shadow);}
.card h3{margin:0 0 6px;font-size:18px;}
.card p{margin:0;font-size:15px;}
.card .more{display:inline-block;margin-top:10px;font-weight:600;font-size:15px;}
.steps{counter-reset:step;list-style:none;padding:0!important;display:grid;gap:14px;margin:18px 0;}
.steps li{counter-increment:step;position:relative;padding:16px 18px 16px 64px;background:var(--card);border:1px solid var(--line);border-radius:18px;max-width:none;}
.steps li::before{content:counter(step);position:absolute;left:18px;top:16px;width:32px;height:32px;border-radius:50%;background:var(--btn);color:#fff;font-weight:700;display:grid;place-content:center;font-size:15px;}
.steps strong{display:block;color:var(--ink-strong);}
.callout{background:var(--lav-fill);border-radius:18px;padding:16px 20px;margin:18px 0;max-width:var(--measure);}
.callout p{margin:0;}
.notice{background:var(--warn-fill);border:1px solid color-mix(in srgb,var(--warn) 35%,transparent);max-width:860px;margin:4px 0 22px;}
.checklist{list-style:none;padding:0!important;}
.checklist li{padding-left:30px;position:relative;}
.checklist li::before{content:"✓";position:absolute;left:4px;color:var(--ok);font-weight:700;}
.nolist{list-style:none;padding:0!important;}
.nolist li{padding-left:30px;position:relative;}
.nolist li::before{content:"✕";position:absolute;left:5px;color:var(--no);font-weight:700;}
.facts{display:grid;grid-template-columns:minmax(140px,220px) 1fr;gap:10px 18px;margin:16px 0;max-width:820px;}
.facts dt{font-weight:600;color:var(--ink-strong);}
.facts dd{margin:0;}
@media (max-width:560px){.facts{grid-template-columns:1fr;gap:2px;}.facts dd{margin-bottom:10px;}}

/* Tables */
.table-wrap{overflow-x:auto;margin:18px 0;border:1px solid var(--line);border-radius:18px;background:var(--card);}
table.matrix{border-collapse:collapse;width:100%;min-width:560px;font-size:15px;}
.matrix th,.matrix td{text-align:left;padding:12px 16px;border-bottom:1px solid var(--line);vertical-align:top;}
.matrix thead th{font-size:13px;text-transform:uppercase;letter-spacing:.05em;color:var(--ink-soft);background:var(--soft-fill);}
.matrix tbody tr:last-child td,.matrix tbody tr:last-child th{border-bottom:0;}
.matrix tbody th{font-weight:600;color:var(--ink-strong);}
.pill{display:inline-block;font-size:13px;font-weight:600;padding:3px 10px;border-radius:999px;white-space:nowrap;}
.pill-auto{background:var(--ok-fill);color:var(--ok);}
.pill-paid{background:var(--lav-fill);color:var(--lav);}
.pill-inbox{background:var(--warn-fill);color:var(--warn);}
.pill-kit{background:var(--soft-fill);color:var(--pink-deep);}
.pill-no{background:var(--no-fill);color:var(--no);}

/* Pricing */
.plans{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px;margin:18px 0;}
.plan{background:var(--card);border:1px solid var(--line);border-radius:var(--radius-card);padding:22px;box-shadow:var(--shadow);display:flex;flex-direction:column;}
.plan h3{margin:0;font-size:20px;}
.plan .price{font-size:34px;font-weight:700;color:var(--ink-strong);margin:8px 0 0;line-height:1.1;font-variant-numeric:tabular-nums;}
.plan .price small{font-size:15px;font-weight:600;color:var(--ink-soft);}
.plan .alt{font-size:14px;color:var(--ink-soft);margin:4px 0 12px;}
.plan ul{margin:6px 0 0;}
.plan-featured{border:2px solid var(--pink);}

/* FAQ */
.faq{background:var(--card);border:1px solid var(--line);border-radius:18px;margin:10px 0;max-width:860px;}
.faq summary{cursor:pointer;list-style:none;padding:14px 48px 14px 20px;position:relative;}
.faq summary::-webkit-details-marker{display:none;}
.faq summary::after{content:"+";position:absolute;right:20px;top:50%;transform:translateY(-50%);font-size:24px;color:var(--pink-deep);font-weight:400;}
.faq[open] summary::after{content:"–";}
.faq summary h3{display:inline;font-size:17px;margin:0;font-weight:600;}
.faq-a{padding:0 20px 14px;}
.faq-a p{margin:0 0 8px;}

/* Related + CTA band */
.rel-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:14px;}
.rel-card{display:block;background:var(--card);border:1px solid var(--line);border-radius:18px;padding:16px 18px;text-decoration:none;color:var(--ink);transition:transform .15s;}
.rel-card:hover{transform:translateY(-2px);color:var(--ink);}
.rel-card strong{display:block;color:var(--ink-strong);margin-bottom:4px;}
.rel-card span{font-size:14px;color:var(--ink-soft);}
.cta-band{margin:34px 0 56px;padding:34px 28px;border-radius:28px;background:var(--btn);color:#fff;text-align:center;}
.cta-band h2{color:#fff;margin:0 0 10px;font-size:clamp(24px,3.6vw,34px);}
.cta-band p{margin:0 auto 20px;max-width:60ch;color:#fff;}

/* Article */
.article-meta{font-size:14px;color:var(--ink-soft);margin:10px 0 0;}

/* Footer */
.site-footer{border-top:1px solid var(--line);background:color-mix(in srgb,var(--card) 55%,transparent);padding-block:36px 28px;font-size:15px;}
.foot-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:22px;}
.foot-h{font-size:13px;text-transform:uppercase;letter-spacing:.07em;color:var(--ink-soft);margin:0 0 8px;}
.site-footer ul{list-style:none;padding:0;margin:0;}
.site-footer li{margin:6px 0;}
.site-footer a{color:var(--ink);text-decoration:none;}
.site-footer a:hover{color:var(--pink-deep);text-decoration:underline;}
.foot-note{margin:26px 0 0;color:var(--ink-soft);font-size:14px;display:flex;flex-wrap:wrap;align-items:center;gap:8px;}
.brand-foot span{font-size:18px;}