/* CareShip website spacing scale (cocarely.space + memberly.space).
   Load it last in <head> so every page shares one rhythm. Change a value here, not on a page.
   Desktop values first; phones (<=640px) get the mobile values below. */
:root{
  --container:1220px;   /* every .wrap */
  --gutter:24px;        /* side gutter inside .wrap */
  --sec-y:88px;         /* top and bottom padding of every section, the hero included */
  --gap-eyebrow:14px;   /* eyebrow chip -> heading */
  --gap-h:14px;         /* heading -> paragraph */
  --gap-head:40px;      /* section header block -> its content */
  --gap-cta:28px;       /* paragraph -> button row */
  --gap-grid:22px;      /* gap between cards in a grid */
  --gap-split:64px;     /* text column <-> visual column */
  --pad-card:24px;      /* padding inside cards */
  --cell-x:48px;        /* side padding of a suite grid cell */
  --btn-h:42px;  --btn-px:18px;      /* standard button */
  --btn-h-lg:52px; --btn-px-lg:28px; /* hero / CTA button */
  --btn-h-sm:38px; --btn-px-sm:16px; /* phone top bar button */
  --foot-top:60px; --foot-bottom:40px;
}
@media (max-width:640px){
  :root{--gutter:16px;--sec-y:56px;--gap-head:28px;--gap-split:28px;--cell-x:16px;--gap-cta:22px}
}

/* container */
.wrap,.hero .wrap{max-width:var(--container);padding-left:var(--gutter);padding-right:var(--gutter)}

/* sections: one vertical rhythm */
body > header.hero,body > header.cd-hero,body > section.feat,body > section.testis,body > section.problem,
body > section.trust,body > section.faq,body > section.cta,body > section.film-sec,body > section.cd-detail{
  padding-top:var(--sec-y);padding-bottom:var(--sec-y);margin-top:0
}
.cd-cell{padding:var(--sec-y) var(--cell-x)}
footer{padding:var(--foot-top) 0 var(--foot-bottom)}

/* heading rhythm */
.eyebrow{margin-bottom:var(--gap-eyebrow)}
.problem-head,.ehr-sec .problem-head,.pl-intro .problem-head{margin-bottom:var(--gap-head)}
.problem-head h2,.feat h2,.cd-cell h2,.cd-detail h2,.cta h2,.cd-hero h1,.hero h1{margin-bottom:var(--gap-h)}
.faq h2{margin-bottom:var(--gap-head)}
.feat-sub,.cd-cell .lead,.cta p{margin-bottom:var(--gap-cta)}
.hero p,.cd-hero .cd-sub{margin-bottom:var(--gap-cta)}
.hero-cta,.cd-ctas,.cta-ctas{margin-top:0}
.cd-hero .cd-pill,.cd-ctas{margin-top:var(--gap-head)}
.hero-badges{margin-top:var(--gap-cta)}

/* grids and cards */
.testi-grid,.problem-grid,.ehr-live,.pl-roles{gap:var(--gap-grid)}
.feat-grid{gap:var(--gap-split)}
.testi,.problem-card,.ehr-tile:not(.soon){padding:var(--pad-card)}
.center-cta{text-align:center;margin-top:var(--gap-cta)}

/* buttons */
.btn{height:var(--btn-h);padding:0 var(--btn-px)}
.hero .btn,.hero-form .btn,.cta .btn,.cta-ctas .btn,.cd-pill{height:var(--btn-h-lg);padding:0 var(--btn-px-lg)}
@media (max-width:820px){.nav-cta > a.btn[href*="calendar.app.google"]{height:var(--btn-h-sm)!important;padding:0 var(--btn-px-sm)!important}}