/* Andrew A. Merola, MD — unified design system (generated; edit generator/build_site.py) */
* { margin: 0; padding: 0; box-sizing: border-box; }
html { scroll-behavior: smooth; }
:root {
  --green: #0E6B63;        /* brand: nav, buttons, accents */
  --green-dark: #084D47;   /* dark bands: WC callout, CTA ribbon */
  --green-mid: #2F7565;    /* mid band: procedures section */
  --green-tint: #EEF4F2;   /* page heroes, callouts */
  --ink: #0D1B24;
  --body: #46525A;
  --line: #E3E8E6;
  --bg-soft: #F7F9F8;
}
body { background: #fff; color: var(--ink); font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; line-height: 1.6; font-size: 16px; overflow-x: hidden; min-height: 100vh; display: flex; flex-direction: column; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
a { text-decoration: none; color: var(--green); }
main { flex: 1; }
img { max-width: 100%; }

/* ---- landing (homepage hero) ----
   Full-viewport, single-screen hero. Everything scales with clamp() so the
   panel never outgrows the viewport and nothing drops in/out on resize.
   --header-h is measured from .page-header (brand-link 15px padding x2 + line). */
/* .hero-screen wraps header + hero and owns the full viewport, so the hero fills
   whatever is left after the real header height. No hardcoded header constant to
   drift out of sync (a 50px guess against a 52px header left a 2px sliver of the
   next section showing, which is what made things appear to drop in/out on resize). */
.hero-screen { min-height: 100vh; min-height: 100svh; display: flex; flex-direction: column; }
.hero-screen > .landing { flex: 1 1 auto; }
.landing { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr); gap: clamp(32px, 4vw, 72px); align-items: center; max-width: 1440px; margin: 0 auto; padding: clamp(32px, 4.5vh, 72px) clamp(20px, 3vw, 40px); }
.landing-copy { max-width: 760px; display: flex; flex-direction: column; }
.hero-proof { font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: 1.5px; color: var(--green); margin-bottom: clamp(14px, 2vh, 22px); }
.lockup h1 { font-size: clamp(34px, 4.4vw, 68px); font-weight: 700; letter-spacing: -1.5px; margin-bottom: clamp(10px, 1.4vh, 14px); color: var(--ink); line-height: 1.06; text-wrap: balance; }
.lockup .subline { font-size: clamp(13px, 1.1vw, 17px); font-weight: 600; text-transform: uppercase; letter-spacing: 3px; color: var(--green); margin-bottom: clamp(18px, 3vh, 32px); }
.positioning { font-size: clamp(15px, 1.15vw, 19px); line-height: 1.7; margin-bottom: clamp(20px, 3.2vh, 36px); color: var(--body); max-width: 660px; }
.cta-group { display: flex; gap: 18px; flex-wrap: wrap; }
.cta-group .btn { padding: clamp(13px, 1.6vh, 16px) clamp(22px, 2vw, 30px); font-size: 15px; }
/* credential line: folded into the copy column so it can never orphan itself
   at the bottom of the grid the way the old full-width .hero-trust bar did */
.hero-trust { display: flex; flex-wrap: wrap; gap: 10px 26px; margin-top: clamp(22px, 3.5vh, 40px); padding-top: clamp(18px, 2.6vh, 28px); border-top: 1px solid var(--line); }
.hero-trust div { font-size: 12.5px; font-weight: 600; color: var(--body); display: flex; align-items: center; gap: 8px; }
.hero-trust div::before { content: ""; width: 5px; height: 5px; border-radius: 50%; background: var(--green); flex: none; }

/* ---- hero recognition grid (replaces the old portrait) ---- */
/* align-self: stretch makes the panel match the copy column's height exactly, so it
   reads as a deliberate slab instead of a short box floating in the right gutter */
.hero-awards { border: 1px solid var(--line); background: #fff; display: flex; flex-direction: column; align-self: stretch; max-height: 640px; margin: auto 0; }
.hero-awards-label { flex: none; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 1.5px; color: #5C6770; padding: clamp(14px, 2vh, 18px) 20px; border-bottom: 1px solid var(--line); background: var(--bg-soft); }
.hero-awards-grid { flex: 1 1 auto; display: grid; grid-template-columns: repeat(3, 1fr); grid-template-rows: repeat(3, minmax(0, 1fr)); gap: 1px; background: var(--line); }
.hero-awards-grid figure { background: #fff; display: flex; align-items: center; justify-content: center; padding: clamp(12px, 2vh, 22px) clamp(10px, 1.4vw, 20px); min-height: clamp(74px, 10vh, 128px); }
/* capping BOTH axes normalizes optical weight: wide wordmarks (AAOS 944x282) get
   width-limited, square marks (Castle Connolly 320x320) get height-limited, so no
   single logo dominates the grid the way AAOS did when only height was capped */
.hero-awards-grid img { max-height: clamp(30px, 4.6vh, 48px); max-width: min(82%, 132px); width: auto; object-fit: contain; filter: grayscale(100%) opacity(0.72); transition: filter 0.2s; }
.hero-awards-grid figure:hover img { filter: grayscale(0%) opacity(1); }
/* square/compact marks carry less ink per pixel, so give them a little more room */
.hero-awards-grid img[src*="castle-connolly"], .hero-awards-grid img[src*="abos"],
.hero-awards-grid img[src*="weill-cornell"], .hero-awards-grid img[src*="patients-choice"] { max-height: clamp(38px, 6vh, 66px); max-width: min(82%, 96px); }

/* ---- buttons ---- */
.btn { display: inline-block; padding: 13px 26px; border-radius: 2px; font-size: 14px; font-weight: 600; letter-spacing: 0.2px; cursor: pointer; border: 1px solid transparent; transition: background-color 0.2s, color 0.2s; white-space: nowrap; }
.btn-solid { background: var(--green); color: #fff; }
.btn-solid:hover { background: var(--green-dark); }
.btn-outline { background: transparent; color: var(--green); border-color: var(--green); }
.btn-outline:hover { background: var(--green); color: #fff; }
.btn-white { background: #fff; color: var(--green-dark); }
.btn-white:hover { background: #E4EEEB; }
.btn-white-outline { background: transparent; color: #fff; border-color: rgba(255,255,255,0.75); }
.btn-white-outline:hover { background: rgba(255,255,255,0.12); }

/* ---- home bottom nav ---- */

/* ---- home about: photo and text box equal height, flush ---- */
.about-section { max-width: 1200px; margin: 0 auto; padding: 96px 24px; }
.about-grid { display: grid; grid-template-columns: 1.05fr 0.95fr; border: 1px solid var(--line); }
.about-text { background: var(--bg-soft); display: flex; align-items: center; padding: 64px; }
.about-eyebrow, .eyebrow { font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: 1.5px; color: var(--green); margin-bottom: 20px; }
.about-text h2 { font-size: 34px; font-weight: 600; line-height: 1.25; margin-bottom: 28px; }
.about-text p { font-size: 15px; line-height: 1.7; color: var(--body); margin-bottom: 16px; }
.about-cta { margin-top: 28px; padding-top: 28px; border-top: 1px solid var(--line); }
.arrow-link { color: var(--green); font-weight: 600; font-size: 14px; }
.arrow-link:hover { color: var(--green-dark); }
.about-photo { position: relative; min-height: 420px; background: #E9EEEC; }
.about-photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center top; }

/* ---- generic sections ---- */
section.band { padding: 96px 24px; }
.band-inner { max-width: 1200px; margin: 0 auto; }
.band h2 { font-size: 40px; font-weight: 600; margin-bottom: 16px; }
.band .band-sub { font-size: 16px; color: var(--body); max-width: 640px; margin-bottom: 48px; }
.band-soft { background: var(--bg-soft); }

/* ---- cards ---- */
.cards-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.cards-grid.cols-1 { grid-template-columns: 1fr; max-width: 560px; }
.cards-grid.cols-2 { grid-template-columns: repeat(2, 1fr); }
.cards-grid.cols-3 { grid-template-columns: repeat(3, 1fr); }
.article.procedure-library { max-width: 1200px; }
.procedure-library .article-section { padding: 56px 0; }
.procedure-index-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.procedure-index-grid .card { min-height: 100%; }
.procedure-index-grid.cols-1 { max-width: 560px; }
.procedure-group-note { color: var(--body); max-width: 760px; margin: -4px 0 24px; }
a.card, div.card { background: #fff; padding: 32px; border: 1px solid var(--line); border-radius: 2px; display: flex; flex-direction: column; transition: border-color 0.2s, box-shadow 0.2s; }
.card h3 { font-size: 18px; font-weight: 600; color: var(--green); margin-bottom: 12px; }
.card p { font-size: 15px; line-height: 1.7; color: var(--body); }
.card .card-arrow { margin-top: 20px; padding-top: 16px; border-top: 1px solid var(--line); color: var(--green); font-weight: 600; font-size: 14px; transition: transform 0.2s; }
a.card:hover { border-color: var(--green); }
a.card:hover .card-arrow { color: var(--green-dark); }

/* ---- procedures mid-green band ---- */
.band-procedures { background: var(--green-mid); }
.band-procedures h2 { color: #fff; }
.band-procedures .band-sub { color: rgba(255,255,255,0.92); }
.band-procedures a.card { border-color: rgba(255,255,255,0.25); }
.band-procedures a.card:hover { border-color: #fff; }

/* ---- workers' comp callout box ---- */
.wc-callout { background: var(--green-dark); color: #fff; padding: 56px; border-radius: 2px; }
.wc-callout h2 { color: #fff; font-size: 32px; margin-bottom: 16px; }
.wc-callout p { color: rgba(255,255,255,0.92); font-size: 15px; line-height: 1.7; max-width: 760px; margin-bottom: 28px; }

/* ---- testimonials ---- */
.quote-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.quote-card { background: #fff; border: 1px solid var(--line); border-radius: 2px; padding: 32px; display: flex; flex-direction: column; }
.quote-card blockquote { font-size: 15px; line-height: 1.75; color: var(--ink); flex: 1; }
.quote-card cite { display: block; margin-top: 20px; padding-top: 16px; border-top: 1px solid var(--line); font-style: normal; font-size: 13px; font-weight: 600; color: var(--green); }
.quote-note { font-size: 12px; color: #5C6770; margin-top: 24px; }

/* ---- CTA ribbon ---- */
.cta-ribbon { background: var(--green-dark); color: #fff; padding: 72px 24px; text-align: center; }
.cta-ribbon h2 { font-size: 34px; font-weight: 600; margin-bottom: 12px; color: #fff; }
.cta-ribbon p { font-size: 15px; color: rgba(255,255,255,0.9); margin-bottom: 32px; }
.cta-ribbon-buttons { display: flex; gap: 20px; justify-content: center; flex-wrap: wrap; }

/* ---- inner page chrome ---- */
.page-header { background: var(--green); position: relative; }
.header-content { max-width: 1200px; margin: 0 auto; padding: 0 24px; display: flex; align-items: center; justify-content: space-between; }
.brand-link { color: #fff; font-size: 14px; font-weight: 600; white-space: nowrap; padding: 15px 0; }
.nav-desktop { display: flex; }
.nav-desktop a { color: #fff; padding: 15px 16px; font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: 1px; border-right: 1px solid rgba(255,255,255,0.2); transition: background-color 0.2s; }
.nav-desktop a:first-child { border-left: 1px solid rgba(255,255,255,0.2); }
.nav-desktop a:hover { background: var(--green-dark); }
.hamburger { display: none; background: none; border: none; color: #fff; font-size: 20px; cursor: pointer; padding: 12px 4px; }
.hamburger:focus-visible { outline: 2px solid #fff; outline-offset: 3px; }
.nav-mobile { display: none; position: absolute; top: 100%; left: 0; right: 0; background: var(--green); flex-direction: column; z-index: 50; }
.nav-mobile.is-open { display: flex; }
.nav-mobile a { color: #fff; padding: 13px 24px; font-size: 13px; font-weight: 600; text-transform: uppercase; letter-spacing: 1px; border-bottom: 1px solid rgba(255,255,255,0.12); }
.breadcrumb { font-size: 12px; color: #5C6770; padding: 14px 24px; max-width: 1200px; margin: 0 auto; width: 100%; }
.breadcrumb a { color: var(--green); text-decoration: underline; text-underline-offset: 2px; }

/* ---- page hero ---- */
.page-hero { background: var(--green-tint); border-bottom: 1px solid var(--line); padding: 72px 24px; }
.page-hero-inner { max-width: 1200px; margin: 0 auto; }
.page-hero h1 { font-size: 40px; font-weight: 600; line-height: 1.2; margin-bottom: 20px; max-width: 820px; }
.page-hero .lede { font-size: 17px; line-height: 1.75; color: var(--body); max-width: 780px; }

/* ---- article content ---- */
.article { max-width: 820px; margin: 0 auto; padding: 24px; width: 100%; }
.article-section { padding: 40px 0; border-bottom: 1px solid var(--line); }
.article-section:last-child { border-bottom: none; }
.article h2 { font-size: 27px; font-weight: 600; margin-bottom: 20px; }
.article h3 { font-size: 17px; font-weight: 600; color: var(--green); margin: 20px 0 10px; }
.article p { font-size: 15.5px; line-height: 1.8; color: var(--body); margin-bottom: 16px; }
.article p:last-child { margin-bottom: 0; }
.article ul { margin: 0 0 16px 20px; }
.article li { font-size: 15.5px; line-height: 1.8; color: var(--body); margin-bottom: 8px; }
.article a { font-weight: 600; }
.article p a:not(.btn), .article li a:not(.btn), .approach-inner p a:not(.btn), .contact-info-card p a {
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 0.18em;
}
.article a:hover, .article a:focus-visible,
.approach-inner p a:hover, .approach-inner p a:focus-visible,
.contact-info-card p a:hover, .contact-info-card p a:focus-visible {
  color: var(--green-dark);
  text-decoration-thickness: 2px;
}
.two-col { display: grid; grid-template-columns: 1fr 1fr; gap: 32px; }
.callout { background: var(--green-tint); border-left: 3px solid var(--green); padding: 20px 24px; margin: 24px 0 8px; }
.callout p { color: var(--ink); font-weight: 500; margin: 0; }

/* ---- stat strip ---- */
.stat-strip { border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); background: #fff; }
.stat-strip-inner { max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; padding: 52px 24px; }
.stat-num { font-size: 42px; font-weight: 700; color: var(--green); letter-spacing: -1px; line-height: 1.1; }
.stat-label { font-size: 13px; color: var(--body); margin-top: 8px; line-height: 1.5; }

/* ---- urgent red-flags box ---- */
.alert-box { border: 1px solid #E7CDC5; border-left: 4px solid #A33E2C; background: #FBF3F1; padding: 26px 30px; border-radius: 2px; }
.alert-box h3 { color: #A33E2C; margin: 0 0 12px; font-size: 17px; }
.alert-box ul { margin: 0 0 0 20px; }
.alert-box li { color: #4A3C38; }
.alert-box p { margin: 12px 0 0; font-size: 14px; }

/* ---- why patients choose ---- */
.why-choose { background: var(--bg-soft); border: 1px solid var(--line); border-radius: 2px; padding: 30px 34px; }
.why-choose ul { margin: 0 0 0 20px; }
.why-choose li { margin-bottom: 10px; }
.why-choose li::marker { color: var(--green); }

/* ---- pull quote ---- */
.pull-quote { border-left: 3px solid var(--green); padding: 6px 0 6px 30px; margin: 8px 0; }
.pull-quote blockquote { font-size: 18px; line-height: 1.75; color: var(--ink); }
.pull-quote cite { display: block; margin-top: 14px; font-style: normal; font-size: 13px; font-weight: 600; color: var(--green); }

/* ---- additional reading ---- */
.reading-list { list-style: none; margin: 0; }
.reading-list li { border: 1px solid var(--line); border-radius: 2px; padding: 18px 24px; margin-bottom: 12px; }
.reading-source { display: block; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 1px; color: var(--green); margin-bottom: 4px; }
.reading-list a { font-size: 16px; font-weight: 600; color: var(--ink); }
.reading-list a:hover { color: var(--green-dark); }
.reading-list p { font-size: 14px; margin: 6px 0 0; }

/* ---- consultation questions ---- */
.q-list { margin: 0 0 0 20px; }
.q-list li { margin-bottom: 12px; font-weight: 500; color: var(--ink); }
.q-list li::marker { color: var(--green); font-weight: 700; }

/* ---- sub-page badge band ---- */
.badge-band { border-top: 1px solid var(--line); background: var(--bg-soft); padding: 36px 24px; }
.badge-band-inner { max-width: 1100px; margin: 0 auto; display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 20px 44px; }
.badge-band-label { width: 100%; text-align: center; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 1.5px; color: #5C6770; margin-bottom: 6px; }
.badge-band img { height: 34px; max-width: 110px; object-fit: contain; filter: grayscale(100%) opacity(0.65); }

/* ---- approach band on subpages ---- */
.approach-band { background: var(--green-tint); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); padding: 56px 24px; }
.approach-inner { max-width: 820px; margin: 0 auto; }
.approach-inner h2 { font-size: 24px; font-weight: 600; margin-bottom: 16px; }
.approach-inner p { font-size: 15.5px; line-height: 1.8; color: var(--body); margin-bottom: 14px; }
.approach-inner p:last-child { margin-bottom: 0; }

/* ---- timeline ---- */
.timeline { border-left: 2px solid var(--green); margin: 8px 0 24px; }
.tl-item { position: relative; padding: 0 0 28px 28px; }
.tl-item:last-child { padding-bottom: 4px; }
.tl-item::before { content: ""; position: absolute; left: -7px; top: 6px; width: 12px; height: 12px; border-radius: 50%; background: #fff; border: 3px solid var(--green); }
.tl-item h3 { margin-top: 0; color: var(--ink); }

/* ---- FAQ ---- */
.faq-item { border-top: 1px solid var(--line); padding: 22px 0; }
.faq-item:last-child { border-bottom: 1px solid var(--line); }
.faq-item h3 { font-size: 16px; font-weight: 600; color: var(--ink); margin: 0 0 8px; }
.faq-item p { margin: 0; }

/* ---- references ---- */
.refs ol { margin: 0 0 0 20px; }
.refs li { font-size: 13.5px; line-height: 1.7; color: var(--body); margin-bottom: 8px; }
.refs a { font-weight: 500; word-break: break-all; }
.review-line { font-size: 13px; color: #5C6770; margin-top: 24px; padding-top: 20px; border-top: 1px solid var(--line); }

/* ---- contact form ---- */
.contact-grid { display: grid; grid-template-columns: 1fr 1.2fr; gap: 48px; align-items: start; }
.contact-info-card { border: 1px solid var(--line); border-radius: 2px; padding: 36px; background: var(--bg-soft); }
.contact-info-card h2 { font-size: 13px; font-weight: 700; text-transform: uppercase; letter-spacing: 1px; color: var(--green); margin: 24px 0 6px; }
.contact-info-card h2:first-child { margin-top: 0; }
.contact-info-card p { font-size: 15px; color: var(--body); }
.contact-info-card a { font-weight: 600; }
.form-group { margin-bottom: 20px; }
.form-group label { display: block; font-size: 13px; font-weight: 600; margin-bottom: 6px; color: var(--ink); }
.form-group input, .form-group textarea, .form-group select { width: 100%; padding: 12px 14px; border: 1px solid #C9D2CF; border-radius: 2px; font-size: 15px; font-family: inherit; color: var(--ink); background: #fff; }
.form-group textarea { min-height: 140px; resize: vertical; }
.form-group input:focus, .form-group textarea:focus, .form-group select:focus { outline: 2px solid var(--green); outline-offset: -1px; border-color: var(--green); }
.form-note { font-size: 12.5px; color: #5C6770; margin: -8px 0 20px; }
.form-buttons { display: flex; gap: 16px; flex-wrap: wrap; }

/* ---- office cards ---- */
.office-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; margin-top: 8px; }
.office-card { border: 1px solid var(--line); border-radius: 2px; padding: 28px; background: #fff; }
.office-card h3 { color: var(--ink); margin: 0 0 8px; font-size: 16px; }
.office-card p { margin: 0; font-size: 15px; }

/* ---- footer ---- */
footer { background: var(--ink); color: #fff; padding: 64px 24px 0; margin-top: 96px; }
.cta-ribbon + footer, .contact-page footer { margin-top: 0; }
.footer-content { max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: 1.3fr 1fr 1fr 1fr; gap: 40px; padding-bottom: 48px; }
.footer-heading { font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: 1px; margin-bottom: 16px; color: #7FBDB3; }
.footer-col p, .footer-col a { display: block; font-size: 14px; line-height: 1.9; color: #C4CBCF; }
.footer-col a:hover { color: #fff; }
.footer-brand { font-size: 16px; font-weight: 600; color: #fff; margin-bottom: 10px; }
.footer-bottom { border-top: 1px solid rgba(255,255,255,0.12); padding: 20px 0; max-width: 1200px; margin: 0 auto; }
.footer-bottom p { font-size: 12.5px; color: #8A949B; line-height: 1.7; }
.footer-legal { display: flex; gap: 18px; margin-top: 8px; }
.footer-legal a { color: #C4CBCF; font-size: 12.5px; }
.footer-legal a:hover, .footer-legal a:focus-visible { color: #fff; }

/* ---- contact form status ---- */
.form-status { display: none; padding: 16px 20px; border-radius: 2px; margin-bottom: 24px; font-size: 15px; line-height: 1.6; }
.form-status-ok { display: block; background: var(--green-tint); border: 1px solid var(--green); color: var(--ink); }
.form-status-err { display: block; background: #FDF2F2; border: 1px solid #B42318; color: #7A271A; }

/* ---- motion safety ----
   Global guard. Replaces the narrower .marquee-track rule removed with the
   "Recognized By" crawl; hero logo/card/button transitions still need to honor
   prefers-reduced-motion, so this covers every animated property site-wide. */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
  html { scroll-behavior: auto; }
}

/* ---- responsive ---- */
@media (max-width: 1100px) {
  .procedure-index-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 960px) {
  .landing { grid-template-columns: 1fr; padding: 44px 24px; gap: 32px; min-height: 0; }
  .hero-awards-grid figure { min-height: 82px; }
  .about-grid { grid-template-columns: 1fr; }
  .about-photo { order: -1; min-height: 340px; }
  .about-text { padding: 40px; }
  .cards-grid, .cards-grid.cols-2, .cards-grid.cols-3, .quote-grid { grid-template-columns: 1fr; }
  .procedure-index-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .contact-grid, .two-col, .office-grid { grid-template-columns: 1fr; }
  .footer-content { grid-template-columns: 1fr 1fr; }
  .nav-desktop { display: none; }
  .hamburger { display: block; }
}
@media (max-width: 600px) {
  /* phones: release the viewport lock so a tall stacked hero scrolls naturally */
  .hero-screen { min-height: 0; }
}
@media (max-width: 768px) {
  .landing { min-height: 0; padding: 36px 20px 48px; }
  .hero-trust { gap: 8px 18px; }
  .hero-awards-grid figure { min-height: 72px; padding: 14px 10px; }
  .hero-awards-grid img { max-height: 30px; }
  .lockup h1 { font-size: 34px; letter-spacing: -0.5px; }
  .lockup .subline { font-size: 12px; letter-spacing: 1.5px; margin-bottom: 28px; }
  .positioning { font-size: 15px; }
  .cta-group { flex-direction: column; gap: 12px; width: 100%; }
  .cta-group .btn { width: 100%; text-align: center; }
  .procedure-index-grid { grid-template-columns: 1fr; }
  .procedure-library .article-section { padding: 40px 0; }
  section.band { padding: 64px 20px; }
  .band h2 { font-size: 30px; }
  .about-section { padding: 64px 20px; }
  .about-text h2 { font-size: 26px; }
  .wc-callout { padding: 36px 28px; }
  .wc-callout h2 { font-size: 26px; }
  .page-hero { padding: 48px 20px; }
  .page-hero h1 { font-size: 30px; }
  .cta-ribbon h2 { font-size: 26px; }
  .footer-content { grid-template-columns: 1fr; }
  .stat-strip-inner { grid-template-columns: repeat(2, 1fr); padding: 36px 20px; gap: 28px 20px; }
  .stat-num { font-size: 32px; }
  .badge-band-inner { gap: 16px 28px; }
  .badge-band img { height: 28px; }
}