
:root{
  --ink:#0d1820;
  --muted:#5e6970;
  --paper:#ffffff;
  --wash:#f5f7f7;
  --line:#dfe5e7;
  --house:#2295a7;
  --handy:#ad6d3f;
  --plant:#557b42;
  --radius:22px;
  --shadow:0 14px 40px rgba(13,24,32,.09);
  --max:1180px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink);background:var(--paper);line-height:1.6}
img{max-width:100%;display:block}
a{color:inherit}
.container{width:min(var(--max),calc(100% - 36px));margin:auto}
.topbar{background:var(--ink);color:white;text-align:center;padding:8px 16px;font-size:.92rem;letter-spacing:.02em}
header{position:sticky;top:0;z-index:20;background:rgba(255,255,255,.96);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.nav{min-height:74px;display:flex;align-items:center;justify-content:space-between;gap:20px}
.wordmark{text-decoration:none;font-weight:900;letter-spacing:.08em;font-size:1.12rem}
.wordmark span{font-weight:500;letter-spacing:.03em}
.navlinks{display:flex;align-items:center;gap:22px;font-size:.95rem}
.navlinks a{text-decoration:none}
.navlinks a:hover{opacity:.65}
.menu-btn{display:none;background:none;border:0;font-size:1.5rem}
.hero{padding:70px 0 58px;background:linear-gradient(180deg,#fff 0%,#f7f9f9 100%)}
.hero-grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(360px,.95fr);gap:54px;align-items:center}
.hero-copy{min-width:0}
.master-brand{display:flex;justify-content:center;align-items:center}
.master-brand img{width:min(100%,560px);border-radius:28px;box-shadow:0 22px 58px rgba(13,24,32,.12);border:1px solid var(--line)}

.eyebrow{text-transform:uppercase;letter-spacing:.18em;font-size:.8rem;font-weight:800}
h1,h2,h3{line-height:1.08;margin:0 0 18px}
h1{font-size:clamp(2.8rem,7vw,6.8rem);letter-spacing:-.055em}
h2{font-size:clamp(2rem,4vw,3.7rem);letter-spacing:-.04em}
h3{font-size:1.35rem}
.lead{font-size:clamp(1.1rem,2vw,1.35rem);max-width:760px;color:var(--muted)}
.hero-actions,.actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}
.btn{display:inline-flex;align-items:center;justify-content:center;text-decoration:none;border-radius:999px;padding:13px 20px;font-weight:800;border:1px solid var(--ink);transition:.2s ease}
.btn.primary{background:var(--ink);color:white}
.btn.secondary{background:white}
.btn:hover{transform:translateY(-1px);box-shadow:0 8px 22px rgba(13,24,32,.1)}
section{padding:76px 0}
.section-intro{max-width:760px;margin-bottom:34px}
.brand-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.brand-card{border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;background:white;box-shadow:var(--shadow);text-decoration:none;transition:.25s ease}
.brand-card:hover{transform:translateY(-5px)}
.brand-card img{aspect-ratio:1/1.02;object-fit:cover;background:#fff}
.brand-card .body{padding:24px}
.brand-card.house:hover{border-color:var(--house)}
.brand-card.handy:hover{border-color:var(--handy)}
.brand-card.plant:hover{border-color:var(--plant)}
.brand-card p{color:var(--muted);margin:0}
.badge{display:inline-block;padding:6px 10px;border-radius:999px;font-size:.78rem;font-weight:800;margin-bottom:12px;background:var(--wash)}
.split{display:grid;grid-template-columns:1.15fr .85fr;gap:46px;align-items:center}
.panel{background:var(--wash);border-radius:var(--radius);padding:34px}
.checks{display:grid;grid-template-columns:repeat(2,1fr);gap:12px 20px;padding:0;margin:24px 0 0;list-style:none}
.checks li:before{content:"✓";font-weight:900;margin-right:8px}
.price-grid,.service-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.card{border:1px solid var(--line);border-radius:var(--radius);padding:28px;background:white}
.card strong.price{font-size:2.2rem;display:block;margin:8px 0 4px}
.card p{color:var(--muted)}
.accent-house{color:var(--house)} .accent-handy{color:var(--handy)} .accent-plant{color:var(--plant)}
.brand-hero{padding:64px 0 54px}
.brand-hero.house{background:linear-gradient(135deg,#edf9fb,#fff)}
.brand-hero.handy{background:linear-gradient(135deg,#fbf4ef,#fff)}
.brand-hero.plant{background:linear-gradient(135deg,#f1f7ee,#fff)}
.brand-hero .wrap{display:grid;grid-template-columns:1fr 340px;gap:48px;align-items:center}
.brand-hero img{border-radius:26px;box-shadow:var(--shadow)}
.notice{border-left:5px solid var(--ink);padding:18px 22px;background:var(--wash);border-radius:0 14px 14px 0}
.lgbt{background:var(--ink);color:white}
.lgbt p{color:#d8dfe2;max-width:830px}
.lgbt .pride-line{height:5px;border-radius:99px;margin:24px 0 28px;background:linear-gradient(90deg,#e40303 0 16.6%,#ff8c00 16.6% 33.2%,#ffed00 33.2% 49.8%,#008026 49.8% 66.4%,#004dff 66.4% 83%,#750787 83% 100%)}
footer{padding:44px 0;background:#081118;color:white}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:30px}
footer a{color:#dce2e4;text-decoration:none}
footer p{color:#aeb9bd}
.small{font-size:.9rem;color:var(--muted)}
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.contact-card{border:1px solid var(--line);padding:28px;border-radius:var(--radius)}
.kicker{font-size:clamp(1.4rem,3vw,2rem);font-weight:800;max-width:800px}
@media(max-width:850px){
  .navlinks{display:none;position:absolute;left:0;right:0;top:74px;background:white;padding:20px 24px;border-bottom:1px solid var(--line);flex-direction:column;align-items:flex-start}
  .navlinks.open{display:flex}
  .menu-btn{display:block}
  .brand-grid,.price-grid,.service-grid,.split,.brand-hero .wrap,.contact-grid,.footer-grid,.hero-grid{grid-template-columns:1fr}
  .master-brand{order:-1}
  .master-brand img{max-width:480px;width:100%}
  .brand-hero img{max-width:300px}
  .checks{grid-template-columns:1fr}
  .hero{padding-top:58px}
}

/* Pricing cards */
.pricing-section{background:#fff}
.pricing-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:30px}
.price-card{border:1px solid var(--line);border-radius:20px;padding:28px;background:#fff;box-shadow:0 10px 30px rgba(0,0,0,.04)}
.price-card.featured{transform:translateY(-6px);box-shadow:0 16px 36px rgba(0,0,0,.08)}
.price-card .price{font-size:2.7rem;font-weight:800;letter-spacing:-.04em;margin:10px 0 14px}
@media(max-width:800px){.pricing-grid{grid-template-columns:1fr}.price-card.featured{transform:none}}
.header-brand{display:flex;align-items:center;gap:10px;text-decoration:none;font-weight:700;letter-spacing:.035em;font-size:.9rem;white-space:nowrap}
.header-brand img{width:46px;height:46px;object-fit:cover;border-radius:50%;border:1px solid var(--line)}
.header-brand strong{font-weight:900;letter-spacing:.07em}
@media(max-width:520px){.header-brand span{display:none}.header-brand img{width:44px;height:44px}}

/* v8 preview: compact Pride motif in top banner; no header logo image */
.topbar::before {
  content: "";
  display: inline-block;
  width: 28px;
  height: 5px;
  margin-right: 9px;
  vertical-align: middle;
  border-radius: 999px;
  background: linear-gradient(90deg,#e40303 0 16.6%,#ff8c00 16.6% 33.2%,#ffed00 33.2% 49.8%,#008026 49.8% 66.4%,#004dff 66.4% 83%,#750787 83% 100%);
}

/* v9: Collective logo as a restrained hero brand mark on the landing page */
.collective-hero-logo {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 34px 20px 8px;
}
.collective-hero-logo img {
  display: block;
  width: min(340px, 72vw);
  height: auto;
  max-height: 260px;
  object-fit: contain;
}
@media (max-width: 640px) {
  .collective-hero-logo { padding-top: 24px; }
  .collective-hero-logo img { width: min(260px, 72vw); max-height: 210px; }
}

/* v10: much smaller Collective hero logo */
.collective-hero-logo {
  padding: 16px 20px 2px;
}
.collective-hero-logo img {
  width: 44px !important;
  max-width: 44px !important;
  max-height: 44px !important;
  height: auto !important;
}
@media (max-width: 640px) {
  .collective-hero-logo { padding-top: 12px; }
  .collective-hero-logo img {
    width: 40px !important;
    max-width: 40px !important;
    max-height: 40px !important;
  }
}

/* v12 definitive landing-page Collective logo sizing */
html body main .collective-hero-logo img {
  width: 44px !important;
  max-width: 44px !important;
  height: auto !important;
  max-height: 44px !important;
}

/* v13 hero redesign -------------------------------------------------------
   Collective logo: centred, prominent but not dominant.
   Decorative backgrounds are pure CSS/SVG-style shapes: no stock imagery. */

.collective-themed-hero{
  position:relative;
  overflow:hidden;
  padding-top:24px;
  background:
    radial-gradient(circle at 8% 28%, rgba(34,149,167,.12) 0 9%, transparent 9.4%),
    radial-gradient(circle at 93% 22%, rgba(85,123,66,.14) 0 10%, transparent 10.4%),
    radial-gradient(circle at 88% 80%, rgba(173,109,63,.10) 0 8%, transparent 8.4%),
    linear-gradient(135deg,#fbfdfd 0%,#ffffff 48%,#fafcf9 100%);
}
.collective-themed-hero::before,
.collective-themed-hero::after{
  content:"";
  position:absolute;
  pointer-events:none;
  opacity:.16;
  width:300px;
  height:420px;
  background-repeat:no-repeat;
  background-size:contain;
  z-index:0;
}
.collective-themed-hero::before{
  left:-85px; bottom:-105px;
  transform:rotate(-12deg);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 260 420'%3E%3Cg fill='none' stroke='%23557b42' stroke-width='6' stroke-linecap='round'%3E%3Cpath d='M132 410C128 305 126 193 143 45'/%3E%3Cpath d='M139 95C88 70 52 78 28 113c45 17 81 8 111-18Z'/%3E%3Cpath d='M134 158c50-31 88-27 112 5-40 27-78 26-112-5Z'/%3E%3Cpath d='M129 226c-47-29-83-23-108 13 41 23 77 19 108-13Z'/%3E%3Cpath d='M128 292c45-24 80-15 100 22-41 17-74 10-100-22Z'/%3E%3C/g%3E%3C/svg%3E");
}
.collective-themed-hero::after{
  right:-60px; top:55px;
  width:245px;height:300px;
  transform:rotate(8deg);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 260 300'%3E%3Cg fill='none' stroke='%23ad6d3f' stroke-width='7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M49 251 155 145'/%3E%3Cpath d='M137 57c22-22 54-25 78-10l-43 43 23 23 43-43c15 25 11 57-10 78-23 23-58 25-83 7L66 234 49 251 28 230l17-17 79-79c-18-25-15-60 13-77Z'/%3E%3C/g%3E%3Cg fill='%232295a7' opacity='.7'%3E%3Ccircle cx='52' cy='70' r='8'/%3E%3Ccircle cx='79' cy='42' r='5'/%3E%3Ccircle cx='37' cy='110' r='4'/%3E%3C/g%3E%3C/svg%3E");
}
.collective-themed-hero > *{position:relative;z-index:1}
.collective-logo-stage{
  display:flex;
  justify-content:center;
  align-items:center;
  margin:0 auto 12px;
}
.collective-logo-stage img{
  width:150px !important;
  max-width:150px !important;
  max-height:none !important;
  height:auto !important;
  display:block;
  object-fit:contain;
}
.collective-themed-hero .hero-grid{grid-template-columns:1fr}
.collective-themed-hero .hero-copy{
  max-width:1040px;
  margin:0 auto;
  text-align:center;
}
.collective-themed-hero .hero-actions{justify-content:center}

/* Brand-specific decorative hero backgrounds */
.themed-brand-hero{position:relative;overflow:hidden}
.themed-brand-hero::before,.themed-brand-hero::after{
  content:"";position:absolute;pointer-events:none;z-index:0;opacity:.15;
  background-repeat:no-repeat;background-size:contain;
}
.themed-brand-hero .container{position:relative;z-index:1}

/* Housekeeping: bubbles + sparkle/clean motif */
.brand-hero.house.themed-brand-hero{
  background:
    radial-gradient(circle at 6% 25%,rgba(34,149,167,.10) 0 7%,transparent 7.4%),
    radial-gradient(circle at 89% 78%,rgba(34,149,167,.08) 0 10%,transparent 10.4%),
    linear-gradient(135deg,#edf9fb,#fff 64%);
}
.brand-hero.house.themed-brand-hero::before{
  width:250px;height:250px;left:-35px;bottom:-55px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 250 250'%3E%3Cg fill='none' stroke='%232295a7' stroke-width='5'%3E%3Ccircle cx='65' cy='165' r='48'/%3E%3Ccircle cx='145' cy='110' r='31'/%3E%3Ccircle cx='193' cy='176' r='21'/%3E%3Ccircle cx='98' cy='62' r='16'/%3E%3C/g%3E%3Cpath fill='%232295a7' d='M181 31l7 18 18 7-18 7-7 18-7-18-18-7 18-7 7-18Z'/%3E%3C/svg%3E");
}

/* Handyman: tool-outline motif */
.brand-hero.handy.themed-brand-hero{
  background:
    radial-gradient(circle at 5% 82%,rgba(173,109,63,.10) 0 8%,transparent 8.4%),
    linear-gradient(135deg,#fbf4ef,#fff 64%);
}
.brand-hero.handy.themed-brand-hero::before{
  width:270px;height:270px;left:-45px;bottom:-65px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 280 280'%3E%3Cg fill='none' stroke='%23ad6d3f' stroke-width='7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M45 231 156 120'/%3E%3Cpath d='M142 49c24-19 58-18 81 3l-45 34 18 25 48-30c9 29-2 61-27 78-25 17-58 14-80-5L68 223 45 231Z'/%3E%3Cpath d='m191 190 43 43'/%3E%3C/g%3E%3C/svg%3E");
}

/* Plantcare: foliage motif */
.brand-hero.plant.themed-brand-hero{
  background:
    radial-gradient(circle at 8% 24%,rgba(85,123,66,.12) 0 9%,transparent 9.4%),
    linear-gradient(135deg,#f1f7ee,#fff 64%);
}
.brand-hero.plant.themed-brand-hero::before{
  width:290px;height:360px;left:-70px;bottom:-110px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 260 360'%3E%3Cg fill='none' stroke='%23557b42' stroke-width='6' stroke-linecap='round'%3E%3Cpath d='M126 350c-4-88 0-183 20-306'/%3E%3Cpath d='M141 85C92 55 53 62 26 96c42 25 80 21 115-11Z'/%3E%3Cpath d='M134 154c49-27 88-19 108 18-43 19-79 13-108-18Z'/%3E%3Cpath d='M127 224c-47-29-84-20-106 17 42 20 78 14 106-17Z'/%3E%3C/g%3E%3C/svg%3E");
}

@media(max-width:850px){
  .collective-logo-stage img{width:125px !important;max-width:125px !important}
  .collective-themed-hero::before{left:-155px;opacity:.10}
  .collective-themed-hero::after{right:-135px;opacity:.10}
}
@media(max-width:520px){
  .collective-logo-stage img{width:108px !important;max-width:108px !important}
  .collective-themed-hero{padding-top:18px}
}

/* v16 — clean image-free hero treatment */
.collective-themed-hero::before,.collective-themed-hero::after,
.themed-brand-hero::before,.themed-brand-hero::after{
  content:none !important;
  display:none !important;
  background-image:none !important;
}
.collective-themed-hero{
  background:#ffffff !important;
}
.brand-hero.house.themed-brand-hero{
  background:linear-gradient(135deg,#f4fbfc 0%,#ffffff 72%) !important;
}
.brand-hero.handy.themed-brand-hero{
  background:linear-gradient(135deg,#fbf6f2 0%,#ffffff 72%) !important;
}
.brand-hero.plant.themed-brand-hero{
  background:linear-gradient(135deg,#f4f8f1 0%,#ffffff 72%) !important;
}
.collective-logo-stage{
  display:flex !important;
  justify-content:center !important;
  align-items:center !important;
  width:100% !important;
  margin:0 auto 14px !important;
}
.collective-logo-stage img{
  width:150px !important;
  max-width:150px !important;
  height:auto !important;
  max-height:none !important;
  display:block !important;
  margin:0 auto !important;
}
@media(max-width:700px){
  .collective-logo-stage img{width:125px !important;max-width:125px !important}
}


/* Collective membership & cross-service discovery */
.collective-membership{border-bottom:1px solid var(--line,#e7e7e7);background:#fff;font-size:.82rem}
.collective-membership .container{min-height:38px;display:flex;align-items:center;justify-content:space-between;gap:18px}
.collective-membership a{text-decoration:none;color:inherit}
.collective-membership strong{font-weight:800}
.collective-services{display:flex;align-items:center;gap:9px;color:var(--muted,#666)}
.collective-services a:hover,.footer-collective-line a:hover{text-decoration:underline}
.collective-discovery{background:var(--wash,#f7f7f7);border-top:1px solid var(--line,#e7e7e7)}
.collective-service-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin-top:28px}
.collective-service-card{display:grid;grid-template-columns:112px 1fr;gap:20px;align-items:center;padding:22px;border:1px solid var(--line,#e4e4e4);border-radius:18px;background:#fff;color:inherit;text-decoration:none;transition:transform .18s ease,box-shadow .18s ease}
.collective-service-card:hover{transform:translateY(-2px);box-shadow:0 10px 30px rgba(0,0,0,.07)}
.collective-service-card img{width:112px;height:112px;object-fit:contain;border-radius:50%}
.collective-service-card h3{margin:8px 0 6px}
.collective-service-card p{margin:0 0 10px}
.text-link{font-weight:800}
.collective-home-link{margin-top:24px;text-align:center}
.footer-brand-name{font-weight:900;letter-spacing:.04em}
.footer-collective-line{margin:.4rem 0}
.footer-collective-line a{color:inherit;text-decoration:none}
@media(max-width:760px){.collective-membership .container{padding-top:9px;padding-bottom:9px;flex-direction:column;justify-content:center;gap:4px;text-align:center}.collective-services{font-size:.78rem}.collective-service-grid{grid-template-columns:1fr}.collective-service-card{grid-template-columns:82px 1fr;padding:18px}.collective-service-card img{width:82px;height:82px}}
@media(max-width:420px){.collective-services{gap:5px;font-size:.72rem}.collective-service-card{grid-template-columns:64px 1fr;gap:14px}.collective-service-card img{width:64px;height:64px}}
