/* BloomCraft — bright botanical register.
   White ground, dark-green ink, lime gradients, pastel wash chips.
   Mirrors packages/design-tokens `bright register` so the site and the app
   stay one design language. */

:root{
  --white:#FFFFFF;
  --mist:#F4F6F4;
  --ground:#FBFDFA;
  --line:#E2EAE3;
  --ink:#12291C;
  --ink-soft:#556B5D;

  --lime:#A3E635;
  --lime-deep:#65A30D;
  --grass:#84CC16;
  --green:#0B7A44;

  --wash-mint:#E7F7EC;   --ink-mint:#166534;
  --wash-lemon:#FDF6DC;  --ink-lemon:#8A6A00;
  --wash-blush:#FDECEC;  --ink-blush:#B03A2E;
  --wash-sky:#E8F2FD;    --ink-sky:#17607F;
  --wash-lime:#EEFBD6;

  --shadow:0 6px 22px rgba(18,41,28,.07);
  --radius:20px;
}

*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  font-family:"Plus Jakarta Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  background:var(--white);color:var(--ink);line-height:1.65;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block}
a{color:var(--green);text-decoration:none}
a:hover{text-decoration:underline}
.wrap{max-width:1080px;margin:0 auto;padding:0 24px}
.narrow{max-width:780px}

/* ---- nav ---- */
nav{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.92);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.nav-in{display:flex;align-items:center;gap:14px;height:66px}
.brand{display:flex;align-items:center;gap:10px;font-weight:800;font-size:1.15rem;color:var(--ink);letter-spacing:-.02em}
.brand:hover{text-decoration:none}
.brand img{width:34px;height:34px;border-radius:10px}
.nav-links{margin-left:auto;display:flex;gap:24px;align-items:center;font-size:.93rem;font-weight:600}
.nav-links a{color:var(--ink-soft)}
.nav-links a:hover{color:var(--green);text-decoration:none}
@media(max-width:760px){.nav-links a:not(.btn){display:none}}

/* ---- buttons ---- */
.btn{
  display:inline-block;background:linear-gradient(135deg,var(--lime),var(--lime-deep));
  color:var(--ink);font-weight:800;padding:12px 22px;border-radius:999px;border:none;
  cursor:pointer;font-size:.95rem;font-family:inherit;
  box-shadow:0 4px 14px rgba(101,163,13,.28);transition:transform .15s,box-shadow .15s;
}
.btn:hover{transform:translateY(-1px);box-shadow:0 8px 22px rgba(101,163,13,.34);text-decoration:none;color:var(--ink)}
.btn.ghost{background:var(--mist);color:var(--ink);box-shadow:none}
.btn.sm{padding:9px 16px;font-size:.85rem}

/* ---- hero ---- */
.hero{padding:64px 0 44px;display:grid;grid-template-columns:1.05fr .95fr;gap:48px;align-items:center}
@media(max-width:880px){.hero{grid-template-columns:1fr;padding-top:44px}}
.eyebrow{
  display:inline-flex;align-items:center;gap:8px;background:var(--wash-lime);
  color:var(--ink-mint);font-size:.78rem;font-weight:800;letter-spacing:.07em;
  text-transform:uppercase;padding:7px 15px;border-radius:999px;margin-bottom:18px;
}
h1{font-size:clamp(2.2rem,5vw,3.3rem);line-height:1.12;letter-spacing:-.03em;font-weight:800}
h1 em{font-style:normal;color:var(--lime-deep)}
.lede{margin-top:18px;font-size:1.1rem;color:var(--ink-soft);max-width:34em}
.hero-ctas{margin-top:26px;display:flex;gap:12px;flex-wrap:wrap}
.hero-note{font-size:.86rem;color:var(--ink-soft);margin-top:16px}
.hero-note strong{color:var(--ink)}

/* ---- sections ---- */
section{padding:64px 0}
.sec-label{color:var(--lime-deep);font-size:.78rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase}
h2{font-size:clamp(1.6rem,3.3vw,2.3rem);letter-spacing:-.02em;line-height:1.18;margin-top:10px;font-weight:800}
h3{font-size:1.1rem;font-weight:800;letter-spacing:-.01em}
.sec-lede{color:var(--ink-soft);margin-top:12px;max-width:42em;font-size:1.03rem}

.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:36px}
.grid2{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;margin-top:36px}
@media(max-width:860px){.grid3,.grid2{grid-template-columns:1fr}}

.card{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);padding:26px;transition:transform .2s,box-shadow .2s}
.card:hover{transform:translateY(-3px);box-shadow:var(--shadow)}
.card .ico{width:46px;height:46px;border-radius:14px;background:var(--wash-mint);display:flex;align-items:center;justify-content:center;font-size:1.35rem;margin-bottom:14px}
.card p{color:var(--ink-soft);font-size:.94rem;margin-top:8px}

/* ---- chips ---- */
.chips{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}
.chip{display:inline-flex;align-items:center;gap:7px;border-radius:999px;padding:8px 15px;font-size:.85rem;font-weight:700}
.chip.mint{background:var(--wash-mint);color:var(--ink-mint)}
.chip.lemon{background:var(--wash-lemon);color:var(--ink-lemon)}
.chip.blush{background:var(--wash-blush);color:var(--ink-blush)}
.chip.sky{background:var(--wash-sky);color:var(--ink-sky)}

/* ---- phone mock ---- */
.phone{width:280px;margin:0 auto;background:var(--white);border-radius:42px;padding:12px;border:1px solid var(--line);box-shadow:0 28px 56px rgba(18,41,28,.14)}
.screen{background:var(--white);border-radius:32px;overflow:hidden;border:1px solid var(--line)}
.s-pad{padding:16px}
.s-greet{color:var(--lime-deep);font-size:.7rem;font-weight:800}
.s-title{font-weight:800;font-size:1.02rem;letter-spacing:-.02em;margin-top:2px}
.s-chips{display:flex;gap:6px;margin:12px 0}
.s-chip{flex:1;border-radius:999px;padding:9px 4px;text-align:center;font-size:.68rem;font-weight:800}
.s-cta{border-radius:16px;padding:14px;margin-bottom:8px;display:flex;align-items:center;justify-content:space-between}
.s-cta b{font-size:.92rem}
.s-cta span{display:block;font-size:.66rem;opacity:.75;font-weight:600}
.s-card{border:1px solid var(--line);border-radius:16px;padding:12px;margin-top:8px}
.s-row{display:flex;justify-content:space-between;align-items:center}
.s-plant{font-size:.8rem;font-weight:800}
.s-loc{font-size:.63rem;color:var(--ink-soft)}
.s-water{background:var(--grass);color:#fff;font-size:.64rem;font-weight:800;padding:6px 13px;border-radius:999px}

/* ---- directory ---- */
.dir-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:18px;margin-top:32px}
.plant-card{border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;background:var(--white);transition:transform .2s,box-shadow .2s}
.plant-card:hover{transform:translateY(-3px);box-shadow:var(--shadow);text-decoration:none}
.plant-art{height:130px;background:var(--wash-lime);display:flex;align-items:center;justify-content:center;font-size:2.6rem}
.plant-body{padding:16px}
.plant-name{font-weight:800;font-size:1rem;color:var(--ink)}
.plant-latin{font-size:.8rem;color:var(--ink-soft);font-style:italic;margin-top:1px}
.plant-meta{display:flex;gap:6px;margin-top:10px;flex-wrap:wrap}
.tag{font-size:.68rem;font-weight:700;padding:4px 9px;border-radius:999px}

table.care{width:100%;border-collapse:collapse;margin-top:20px}
table.care td{padding:12px 0;border-bottom:1px solid var(--line);font-size:.95rem;vertical-align:top}
table.care td:first-child{color:var(--ink-soft);width:34%;font-weight:600}

/* ---- shop listing ---- */
.shop{border:1px solid var(--line);border-radius:var(--radius);padding:20px;background:var(--white)}
.shop-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}
.shop-name{font-weight:800;font-size:1.05rem}
.shop-meta{font-size:.88rem;color:var(--ink-soft);margin-top:2px}
.badge-unclaimed{background:var(--wash-lemon);color:var(--ink-lemon);font-size:.68rem;font-weight:800;padding:4px 10px;border-radius:999px;white-space:nowrap}
.shop-gap{font-size:.85rem;color:var(--ink-soft);margin-top:10px;font-style:italic}

/* ---- bands ---- */
.band{background:var(--wash-lime);border-radius:26px;padding:52px 44px;display:grid;grid-template-columns:1.15fr .85fr;gap:36px;align-items:center}
@media(max-width:860px){.band{grid-template-columns:1fr;padding:36px 26px}}
.checks{list-style:none;margin-top:20px;display:grid;gap:11px}
.checks li{display:flex;gap:11px;align-items:flex-start;font-size:.98rem}
.checks .tick{color:var(--lime-deep);font-weight:900}
.vault{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.76rem;color:var(--ink-soft);background:var(--white);border:1px solid var(--line);border-radius:16px;padding:20px;overflow-x:auto}
.vault b{color:var(--ink-mint);font-weight:700}

.cta-band{background:linear-gradient(135deg,var(--lime),var(--lime-deep));border-radius:26px;padding:52px 44px;text-align:center}
@media(max-width:720px){.cta-band{padding:36px 22px}}
.cta-band h2{color:var(--ink)}
.cta-band p{color:var(--ink);opacity:.8;margin-top:10px}
.wl-form{margin:26px auto 0;display:flex;gap:10px;max-width:440px;flex-wrap:wrap;justify-content:center}
.wl-form input{flex:1;min-width:220px;padding:14px 18px;border-radius:999px;border:1px solid rgba(18,41,28,.15);font-size:1rem;font-family:inherit}
.wl-form .btn{background:var(--ink);color:#fff;box-shadow:none}
.wl-form .btn:hover{color:#fff}
.fine{font-size:.8rem;color:var(--ink-soft);margin-top:14px}
.cta-band .fine{color:var(--ink);opacity:.75}

/* ---- pricing ---- */
.price-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:34px;max-width:760px}
@media(max-width:720px){.price-grid{grid-template-columns:1fr}}
.price{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);padding:30px;position:relative}
.price.hot{border:2px solid var(--lime-deep)}
.price .tag-hot{position:absolute;top:-13px;left:26px;background:var(--lime-deep);color:#fff;font-size:.68rem;font-weight:800;letter-spacing:.06em;padding:5px 13px;border-radius:999px;text-transform:uppercase}
.amt{font-size:2.2rem;font-weight:800;letter-spacing:-.03em;margin-top:8px}
.amt span{font-size:.88rem;color:var(--ink-soft);font-weight:600}
.price ul{list-style:none;margin-top:16px;display:grid;gap:9px;font-size:.92rem;color:var(--ink-soft)}
.price li::before{content:"✓  ";color:var(--lime-deep);font-weight:800}

details{background:var(--white);border:1px solid var(--line);border-radius:16px;padding:18px 22px;margin-top:11px}
summary{font-weight:700;cursor:pointer}
details p{color:var(--ink-soft);margin-top:9px;font-size:.94rem}

footer{border-top:1px solid var(--line);padding:38px 0;margin-top:36px;font-size:.88rem;color:var(--ink-soft)}
.foot{display:flex;gap:26px;flex-wrap:wrap;align-items:center}
.foot-links{margin-left:auto;display:flex;gap:20px;flex-wrap:wrap}

.crumb{font-size:.85rem;color:var(--ink-soft);padding-top:26px}
.page-head{padding:26px 0 6px}

/* ---- legal pages ---- */
.wrap.narrow h1{font-size:2rem;letter-spacing:-.02em;margin-top:34px;margin-bottom:6px}
.wrap.narrow .meta{color:var(--ink-soft);font-size:.9rem;margin-bottom:32px}
.wrap.narrow h2{font-size:1.22rem;margin:34px 0 8px}
.wrap.narrow h3{font-size:1rem;margin:20px 0 5px}
.wrap.narrow p,.wrap.narrow li{color:var(--ink-soft);font-size:.97rem}
.wrap.narrow ul{padding-left:22px;margin:10px 0}
.wrap.narrow strong{color:var(--ink)}
.callout{background:var(--wash-lime);border-radius:16px;padding:18px 22px;margin:18px 0}
.callout p{color:var(--ink)}
