/* ==========================================================================
   cc-system.css — the connorcedro.com homepage design system, as one file.
   Source of truth: index.html (Sept 2026 deploy). Parts 1-3 are the homepage's
   own <style> blocks copied verbatim; Part 4 turns the homepage's inline-styled
   patterns into classes with the exact same values.

   LINK ORDER (required — this reproduces the homepage cascade exactly):
     1. Google Fonts (Figtree URL from DESIGN-PROTOCOL.md)
     2. /css/style.css
     3. /css/cc-system.css        <- this file
     4. /css/shared-chrome.css
   ========================================================================== */

/* PART 1 — index.html <style> block 1 (verbatim) */
.hamburger{display:none;flex-direction:column;gap:5px;cursor:pointer;padding:4px;background:none;border:none}
.hamburger span{display:block;width:24px;height:2px;background:#000;border-radius:2px;transition:all .3s}
.hamburger.open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.hamburger.open span:nth-child(2){opacity:0}
.hamburger.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.mobile-menu{display:none;position:fixed;inset:0;background:linear-gradient(165deg,#0b0b0d 0%,#181a1f 100%);z-index:999;flex-direction:column;align-items:center;justify-content:center;gap:2px;padding:88px 32px 40px}
.mobile-menu.open{display:flex;animation:mobMenuFade .32s ease}
@keyframes mobMenuFade{
  from{opacity:0}
  to{opacity:1}
}
.mobile-menu a{font-size:22px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;text-decoration:none;color:#fff;width:100%;max-width:300px;text-align:center;padding:15px 0;transition:color .2s ease,letter-spacing .2s ease}
.mobile-menu a:not(.mob-cta)+a:not(.mob-cta){border-top:1px solid rgba(255,255,255,.08)}
.mobile-menu a:not(.mob-cta):hover,.mobile-menu a:not(.mob-cta):active{color:#56b4e6;letter-spacing:.2em}
.mobile-menu .mob-cta{margin-top:30px;font-size:13px;font-weight:700;letter-spacing:.16em;color:#fff;background:#2f8fc4;border-radius:999px;padding:18px 46px;width:auto;box-shadow:0 8px 24px rgba(47,143,196,.4);transition:transform .2s ease,background .2s ease}
.mobile-menu .mob-cta:hover,.mobile-menu .mob-cta:active{background:#2680b4;transform:translateY(-2px);letter-spacing:.16em;color:#fff}
.mobile-menu-close{position:absolute;top:18px;right:18px;background:none;border:none;cursor:pointer;padding:10px}
.mobile-menu-close span{display:block;width:26px;height:2px;background:#fff;border-radius:2px}
.mobile-menu-close span:first-child{transform:rotate(45deg) translateY(1px)}
.mobile-menu-close span:last-child{transform:rotate(-45deg) translateY(-1px)}
@media(max-width:900px){
  .nav-links{display:none !important}
  .hamburger{display:flex !important}
}
.hp-hero{background:#f7f7f5;display:flex;flex-direction:column;justify-content:center;padding:0;position:relative;overflow:hidden;border-bottom:1px solid #e8e6e0}
.hp-hero-inner{max-width:980px;margin:0 auto;width:100%;padding:76px 48px 64px;position:relative;z-index:2;text-align:center}
.hp-eyebrow{font-size:10px;font-weight:700;letter-spacing:0.32em;text-transform:uppercase;color:#666;margin-bottom:28px;opacity:0;animation:fadeUp 0.8s 0.1s forwards}
.hp-title{font-size:clamp(40px,5.8vw,76px);font-weight:800;line-height:1.08;color:#0a0a0a;margin-bottom:0;max-width:880px;margin-left:auto;margin-right:auto;opacity:0;animation:fadeUp 0.8s 0.25s forwards;letter-spacing:-0.02em}
.hp-title-hl{position:relative;display:inline-block;z-index:1}
.hp-title-hl::after{content:"";position:absolute;left:-2px;right:-2px;bottom:0.06em;height:0.32em;background:#0a0a0a;z-index:-1;border-radius:1px}
.hp-title-hl{color:#fff}
.hp-sub-headline{font-size:clamp(28px,4vw,52px);font-weight:400;color:#888;font-style:italic;line-height:1.15;letter-spacing:-0.015em;margin-top:6px;max-width:880px;margin-left:auto;margin-right:auto;opacity:0;animation:fadeUp 0.8s 0.4s forwards}
@media(min-width:1000px){
  .hp-title{white-space:nowrap;max-width:none}
  .hp-sub-headline{white-space:nowrap;max-width:none}
  .hp-hero-sub{max-width:680px}
}
.hp-form-label{font-size:13px;color:#666;margin-bottom:14px;letter-spacing:0;font-weight:400;opacity:0;animation:fadeUp 0.8s 0.55s forwards}
.hp-form-row{display:flex;gap:0;border:1.5px solid #d4d2cc;background:#fff;max-width:560px;margin:0 auto;transition:border-color 0.2s;opacity:0;animation:fadeUp 0.8s 0.65s forwards}
.hp-form-row:focus-within{border-color:#0a0a0a}
.hp-form-input{flex:1;padding:18px 20px;font-size:15px;font-family:'Figtree',sans-serif;background:transparent;border:none;color:#0a0a0a;outline:none;min-width:0}
.hp-form-input::placeholder{color:#999}
.hp-form-btn{padding:18px 28px;font-size:11px;font-weight:700;letter-spacing:0.18em;text-transform:uppercase;font-family:'Figtree',sans-serif;background:#2f8fc4;color:#fff;border:none;cursor:pointer;white-space:nowrap;transition:opacity 0.2s;flex-shrink:0}
.hp-form-btn:hover{opacity:0.85}
.hp-microcopy{display:flex;align-items:center;justify-content:center;gap:8px;font-size:13px;color:#666;margin-top:18px;opacity:0;animation:fadeUp 0.8s 0.75s forwards}
.hp-microcopy svg{flex-shrink:0}
.hp-search-coverage{margin-top:18px;display:flex;flex-direction:column;align-items:center;gap:6px;opacity:0;animation:fadeUp 0.8s 0.85s forwards}
@media(max-width:900px){
  .hp-eyebrow{animation-duration:0.5s;animation-delay:0.05s}
  .hp-title{animation-duration:0.5s;animation-delay:0.12s}
  .hp-sub-headline{animation-duration:0.5s;animation-delay:0.2s}
  .hp-form-label{animation-duration:0.5s;animation-delay:0.28s}
  .hp-form-row{animation-duration:0.5s;animation-delay:0.35s}
  .hp-microcopy{animation-duration:0.5s;animation-delay:0.42s}
  .hp-search-coverage{animation-duration:0.5s;animation-delay:0.5s}
}
@media(prefers-reduced-motion:reduce){
  .hp-eyebrow,.hp-title,.hp-sub-headline,.hp-form-label,.hp-form-row,.hp-microcopy,.hp-search-coverage{animation:none !important;opacity:1 !important}
}
.hp-search-pill{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:700;letter-spacing:0.14em;text-transform:uppercase;color:#0a0a0a;background:#fff;border:1.5px solid #0a0a0a;padding:7px 14px;border-radius:999px}
.hp-search-pill::before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:#71C8F5;animation:pulse 2s infinite}
.hp-search-detail{font-size:11px;color:#888;letter-spacing:0.02em}
@keyframes pulse{
  0%,100%{opacity:1}
  50%{opacity:0.4}
}
#auditMsg{font-size:11px;color:#666;margin-top:8px;min-height:16px;letter-spacing:0.04em;text-align:center;max-width:560px;margin-left:auto;margin-right:auto}
@keyframes fadeUp{
  from{opacity:0;transform:translateY(24px)}
  to{opacity:1;transform:translateY(0)}
}
.accolade-strip{background:#fff;border-bottom:1px solid #e8e8e8;padding:44px 24px 48px}
.accolade-head{text-align:center;margin-bottom:32px}
.accolade-eyebrow{font-size:10px;font-weight:700;letter-spacing:0.24em;text-transform:uppercase;color:#999;margin-bottom:8px}
.accolade-title{font-size:clamp(15px,1.8vw,19px);font-weight:800;letter-spacing:-0.01em;color:#0a0a0a}
.accolade-row{display:flex;justify-content:center;align-items:center;gap:28px;flex-wrap:wrap;max-width:1200px;margin:0 auto}
.accolade-badge{height:150px;width:auto;display:block;border-radius:4px}
@media(max-width:980px){
  .accolade-row{gap:20px}
  .accolade-badge{height:120px}
}
@media(max-width:680px){
  .accolade-badge{height:96px}
  .accolade-row{display:grid;grid-template-columns:repeat(3,auto);justify-content:center;justify-items:center;align-items:center;gap:14px 12px}
}
.hp-section{padding:100px 48px}
.hp-section-inner{max-width:1200px;margin:0 auto}
.hp-label{font-size:10px;font-weight:700;letter-spacing:0.3em;text-transform:uppercase;color:#888;margin-bottom:14px}
.hp-rule-sm{width:32px;height:1.5px;background:#333;margin-bottom:20px}
.hp-rule-sm.dark{background:#000}
.hp-h2{font-size:clamp(32px,5vw,64px);font-weight:900;line-height:1.0;text-transform:uppercase;margin-bottom:0}
.hp-h2 em{font-style:italic;color:#999}
.hp-h2.on-dark{color:#fff}
.hp-h2.on-dark em{color:#444}
.about-strip{background:#f4f4f2;padding:80px 48px}
.about-inner{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center}
.about-photo{width:100%;aspect-ratio:3/4;background:#000;overflow:hidden}
.about-photo img{width:100%;height:100%;object-fit:cover;opacity:0.85}
.about-text-block{display:flex;flex-direction:column;gap:24px}
.about-p{font-size:17px;line-height:1.8;color:#444}
.about-p strong{color:#000;font-weight:700}
.about-letter{position:relative;padding:8px 0 8px 28px;border-left:2px solid #0a0a0a;display:flex;flex-direction:column;gap:16px;font-family:Georgia,serif;font-size:17px;line-height:1.7;color:#333;letter-spacing:-0.005em}
.about-letter p{margin:0}
.about-letter p:first-child{font-weight:700;color:#0a0a0a;font-family:'Figtree',sans-serif;font-size:18px;letter-spacing:0;margin-bottom:4px}
.ab-ind-search{position:relative;margin-top:40px;max-width:420px}
.ab-ind-search input{width:100%;font-family:'Figtree',sans-serif;font-size:14px;color:#0a0a0a;background:#fff;border:1px solid #e2e2dc;padding:15px 16px 15px 44px;outline:none;transition:border-color 0.2s,box-shadow 0.2s}
.ab-ind-search input::placeholder{color:#aaa}
.ab-ind-search input:focus{border-color:#0a0a0a;box-shadow:0 2px 12px rgba(0,0,0,0.06)}
.ab-ind-search svg{position:absolute;left:16px;top:50%;transform:translateY(-50%);color:#bbb;pointer-events:none}
.ab-ind-count{font-family:'JetBrains Mono',monospace,'Figtree',sans-serif;font-size:10px;font-weight:600;letter-spacing:0.14em;text-transform:uppercase;color:#999;margin-top:14px}
.ab-ind-blurb{display:block;font-size:12px;line-height:1.45;color:#777;font-weight:400;margin-top:4px;text-transform:none;letter-spacing:0}
.ab-industries{display:grid;grid-template-columns:repeat(4,1fr);gap:2px;margin-top:24px;background:#e8e8e8;border:1px solid #e8e8e8}
.ab-ind-card{background:#fff;padding:20px 18px;display:flex;align-items:center;gap:12px;text-decoration:none;transition:background 0.15s,color 0.15s}
.ab-ind-card:hover{background:#0a0a0a}
.ab-ind-icon{color:#0a0a0a;flex-shrink:0;display:flex;transition:color 0.15s}
.ab-ind-card:hover .ab-ind-icon{color:#71C8F5}
.ab-ind-name{font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:0.04em;color:#0a0a0a;line-height:1.25;transition:color 0.15s}
.ab-ind-card:hover .ab-ind-name{color:#fff}
.ab-ind-card[hidden]{display:none}
.ab-ind-empty{padding:40px 0;font-size:14px;color:#888;font-family:Georgia,serif;font-style:italic}
@media(max-width:900px){
  .ab-industries{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:520px){
  .ab-industries{grid-template-columns:1fr}
}
.cases-section{background:#0a0a0a;padding:100px 48px}
.cases-grid{display:grid;grid-template-columns:1fr 1fr;gap:2px;margin-top:60px}
.case-card{background:#000;border:1px solid #111;padding:48px 40px;display:flex;flex-direction:column;text-decoration:none;transition:border-color 0.2s;height:100%}
.case-thumb{margin:-48px -40px 32px -40px;overflow:hidden;border-bottom:1px solid #111;flex-shrink:0}
.case-thumb img{width:100%;height:280px;object-fit:cover;object-position:top;display:block;transition:transform 0.4s ease}
.case-card:hover .case-thumb img{transform:scale(1.03)}
.case-card:hover{border-color:#333}
.case-client{font-size:9px;font-weight:700;letter-spacing:0.25em;text-transform:uppercase;color:#999;margin-bottom:20px;min-height:22px}
.case-headline{font-size:clamp(20px,2.5vw,28px);font-weight:900;text-transform:uppercase;color:#fff;line-height:1.1;margin-bottom:20px;min-height:2.2em}
.case-metrics{display:grid;grid-template-columns:1fr 1fr;gap:22px 24px;margin-bottom:24px;margin-top:auto}
.case-metric-val{font-size:28px;font-weight:900;color:#fff;line-height:1}
.case-metric-label{font-size:10px;font-weight:700;letter-spacing:0.15em;text-transform:uppercase;color:#999;margin-top:4px}
.case-arrow{font-size:10px;font-weight:700;letter-spacing:0.18em;text-transform:uppercase;color:#999;transition:color 0.2s}
.case-card:hover .case-arrow{color:#fff}
.case-card-small{background:#000;border:1px solid #111;padding:36px 32px;display:block;text-decoration:none;transition:border-color 0.2s}
.case-card-small:hover{border-color:#333}
.cases-more{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;margin-top:2px}
.services-section-hp{background:#fff;padding:100px 48px}
.services-list{margin-top:60px;display:flex;flex-direction:column;gap:0}
.service-row{padding:56px 0;border-bottom:1px solid #e8e8e8;transition:background 0.35s ease}
.service-row:first-child{border-top:1px solid #e8e8e8}
.service-row:hover{background:#fafaf8}
.svc-head{display:flex;align-items:baseline;gap:28px;margin-bottom:24px}
.svc-num{font-family:Georgia,serif;font-style:italic;font-weight:300;font-size:clamp(48px,5.5vw,72px);line-height:1;color:#71C8F5;letter-spacing:-0.02em;flex-shrink:0;min-width:1.2ch}
.svc-name{font-family:'Figtree',sans-serif;font-size:clamp(22px,2.6vw,32px);font-weight:900;text-transform:uppercase;line-height:1.05;letter-spacing:-0.015em;color:#0a0a0a;flex:1}
.svc-body{display:grid;grid-template-columns:1.4fr 1fr;gap:64px;padding-left:calc(clamp(48px,5.5vw,72px)+28px)}
.svc-desc{font-size:15px;line-height:1.7;color:#444;margin:0}
.svc-side{display:flex;flex-direction:column;gap:18px;align-items:flex-start}
.svc-meta{font-family:'JetBrains Mono',monospace,'Figtree',sans-serif;font-size:10px;font-weight:500;letter-spacing:0.08em;text-transform:uppercase;color:#888;line-height:1.7}
.svc-meta span{display:inline-block;margin-right:10px}
.svc-meta span:not(:last-child)::after{content:"·";margin-left:10px;color:#ccc}
.svc-link{display:inline-flex;align-items:center;gap:10px;font-family:'Figtree',sans-serif;font-size:11px;font-weight:700;letter-spacing:0.18em;text-transform:uppercase;text-decoration:none;color:#0a0a0a;border-bottom:1.5px solid #0a0a0a;padding:0 0 4px;transition:color 0.2s,border-color 0.2s,gap 0.2s}
.svc-link:hover{color:#71C8F5;border-color:#71C8F5;gap:14px}
.svc-link .arrow{transition:transform 0.2s}
.svc-link:hover .arrow{transform:translateX(3px)}
.reviews-gbp-link{display:inline-flex;align-items:center;gap:10px;font-family:'Figtree',sans-serif;font-size:12px;font-weight:700;letter-spacing:0.14em;text-transform:uppercase;text-decoration:none;color:#0a0a0a;background:#fff;border:1px solid #e2e2dc;padding:15px 28px;box-shadow:0 2px 10px rgba(0,0,0,0.06);transition:box-shadow 0.2s,transform 0.2s,border-color 0.2s}
.reviews-gbp-link:hover{background:#fff;color:#0a0a0a;border-color:#d4d2cc;box-shadow:0 6px 18px rgba(0,0,0,0.1);transform:translateY(-1px)}
.reviews-gbp-link:hover .h-trust-stars{color:#f5a623 !important}
.reviews-gbp-link .arrow{transition:transform 0.2s}
.reviews-gbp-link:hover .arrow{transform:translateX(3px)}
@media(max-width:1100px){
  .service-row{padding:40px 0}
  .svc-body{grid-template-columns:1fr;gap:24px;padding-left:0}
}
.hp-faq-section{background:#fff;padding:100px 48px;border-top:1px solid #ececec}
.hp-faq-inner{max-width:880px;margin:0 auto}
.hp-faq-list{margin-top:8px}
.hp-faq-item{border-bottom:1px solid #e0e0e0}
.hp-faq-item summary{list-style:none;cursor:pointer;padding:28px 56px 28px 0;position:relative;font-size:17px;font-weight:700;color:#000;line-height:1.4;transition:color 0.2s;letter-spacing:-0.005em}
.hp-faq-item summary::-webkit-details-marker{display:none}
.hp-faq-item summary:hover{color:#444}
.hp-faq-item summary::after{content:"+";position:absolute;right:12px;top:50%;transform:translateY(-50%);font-size:28px;font-weight:300;color:#000;line-height:1;transition:color 0.2s,transform 0.2s}
.hp-faq-item[open] summary::after{content:"−";color:#888}
.hp-faq-a{padding:0 56px 28px 0;font-size:15px;line-height:1.75;color:#444}
.hp-faq-a p{margin:0}
.hp-faq-cta{margin-top:48px;font-size:15px;color:#666;text-align:center;line-height:1.6}
.hp-faq-cta a{color:#000;font-weight:700;text-decoration:underline;text-underline-offset:3px;transition:opacity 0.2s}
.hp-faq-cta a:hover{opacity:0.6}
@media(max-width:900px){
  .hp-hero-inner{padding:68px 24px 52px}
  .hp-section{padding:64px 24px}
  .about-strip{padding:60px 24px}
  .about-inner{grid-template-columns:1fr;gap:40px}
  .about-photo{aspect-ratio:4/5}
  .cases-section{padding:64px 24px}
  .hp-tools-grid{grid-template-columns:1fr !important}
  .cases-grid{grid-template-columns:1fr}
  .cases-more{grid-template-columns:1fr}
  .case-card{padding:28px 24px}
  .case-thumb{margin:-28px -24px 24px -24px}
  .case-thumb img{height:200px}
  .case-card-small{padding:24px 20px}
  .services-section-hp{padding:64px 24px}
  .svc-head{gap:18px}
  .svc-name{font-size:20px}
  .hp-faq-section{padding:64px 24px}
  .hp-faq-item summary{font-size:15px;padding:22px 44px 22px 0}
  .hp-faq-item summary::after{font-size:24px;right:6px}
  .hp-faq-a{padding:0 44px 22px 0;font-size:14px}
  .hp-form-row{flex-direction:column;border:none;background:transparent;gap:10px}
  .hp-form-input{border:1.5px solid #d4d2cc;background:#fff;padding:16px 18px;font-size:16px}
  .hp-form-input:focus{border-color:#0a0a0a}
  .hp-form-btn{padding:16px 28px;font-size:11px}
  .hp-eyebrow{font-size:9px;letter-spacing:0.28em}
  .hp-form-label{font-size:12px}
  .hp-microcopy{font-size:12px}
  .hp-search-pill{font-size:10px;padding:6px 12px;letter-spacing:0.12em}
  .hp-search-detail{font-size:10px}
}

/* PART 2 — index.html <style> block 2 (token overrides, verbatim) */
.hp-section{padding:var(--section-pad-y) var(--section-pad-x)}
.hp-h2{font-size:var(--h2-size);line-height:var(--h2-leading)}
.hp-eyebrow{letter-spacing:var(--eyebrow-track);color:var(--eyebrow-color)}
.hp-label{letter-spacing:var(--eyebrow-track);color:var(--eyebrow-color)}
@media(max-width:900px){
  .hp-section{padding:var(--section-pad-y-sm) var(--section-pad-x-sm)}
}

/* PART 3 — index.html <style> block 3 (mobile hero + small fixes, verbatim) */
@media (max-width:600px){
  .hp-hero:not(.hp-hero--compact) .hp-hero-inner{padding:60px 20px 52px}
  .hp-hero:not(.hp-hero--compact) .hp-title{font-size:clamp(46px,13vw,62px);line-height:1.04;letter-spacing:-0.02em;max-width:none}
  .hp-hero:not(.hp-hero--compact) .hp-sub-headline{font-size:clamp(30px,8.6vw,44px);line-height:1.12;margin-top:12px;max-width:none}
  .reviews-gbp-link{white-space:nowrap;font-size:10px;letter-spacing:0.06em;padding:14px 18px;gap:8px}
  .case-metrics{gap:18px 16px}
  .case-metric-val{font-size:25px}
}
@media (max-width:360px){
  .reviews-gbp-link{font-size:9px;letter-spacing:0.03em;padding:13px 14px}
}

/* ==========================================================================
   PART 4 — homepage inline patterns as reusable classes (values identical
   to the inline styles in index.html)
   ========================================================================== */

/* Section wrappers. Every section must set its own background: body is #000. */
.cc-section{padding:var(--section-pad-y) var(--section-pad-x)}
.cc-section--white{background:#fff}
.cc-section--cream{background:#f4f4f2}
.cc-section--dark{background:#0a0a0a;border-top:1px solid #1a1a1a}
@media(max-width:900px){.cc-section{padding:64px 24px}}

/* Section heading on a dark background (use with style.css .section-* classes) */
.cc-section--dark .section-eyebrow{color:#888}
.cc-section--dark .section-rule{background:#fff}
.cc-section--dark .section-title{color:#fff}

/* Lede paragraph under a section heading */
.cc-lede{font-size:17px;line-height:1.7;color:#555;max-width:640px;margin:20px 0 0}

/* Google reviews trust badge (hero) */
.trust-badge-wrap{margin-bottom:22px}
.trust-badge{display:inline-flex;align-items:center;gap:10px;background:#fff;border:1px solid #dadce0;border-radius:999px;padding:8px 16px 8px 13px;box-shadow:0 1px 2px rgba(60,64,67,.1),0 1px 3px rgba(60,64,67,.06);font-family:'Figtree',Arial,sans-serif;text-decoration:none;cursor:pointer;transition:box-shadow .2s ease,transform .2s ease}
.trust-badge:hover{box-shadow:0 4px 14px rgba(60,64,67,.18);transform:translateY(-1px)}
.trust-badge-label{font-size:13.5px;font-weight:700;letter-spacing:-.01em;line-height:1;white-space:nowrap}
.trust-badge-label .g-blue{color:#4285F4}
.trust-badge-label .g-red{color:#EA4335}
.trust-badge-label .g-yellow{color:#FBBC05}
.trust-badge-label .g-green{color:#34A853}
.trust-badge-label .g-gray{color:#5f6368;font-weight:600}
.trust-badge-divider{width:1px;height:16px;background:#dadce0;flex-shrink:0}
.trust-badge-stars{display:inline-flex;align-items:center;gap:2px;flex-shrink:0}
.trust-badge-score{font-size:13.5px;font-weight:800;color:#3c4043;line-height:1;letter-spacing:-.01em}

/* Hero audit block + "you'll receive" checks */
.hp-audit{margin-top:48px;max-width:560px;margin-left:auto;margin-right:auto}
.hp-cta-checks{display:flex;flex-wrap:wrap;justify-content:center;gap:10px 24px;margin-top:18px}
.hp-check{display:inline-flex;align-items:center;gap:7px;font-size:13px;font-weight:600;color:#333;font-family:'Figtree',sans-serif}

/* Ghost button on dark ("See All Client Results") */
.cc-center-cta{text-align:center;margin-top:48px}
.btn-ghost-dark{display:inline-block;font-size:11px;font-weight:700;letter-spacing:0.22em;text-transform:uppercase;text-decoration:none;color:#fff;border:1px solid #333;padding:18px 36px;transition:border-color 0.2s,background 0.2s}
.btn-ghost-dark:hover{border-color:#fff;background:#111}

/* Dark card grid ("Free Tools" section) */
.cc-dark-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:2px;background:#1a1a1a;border:1px solid #1a1a1a;margin-top:60px}
.cc-dark-card{display:block;background:#111;padding:40px 36px;text-decoration:none;color:inherit;transition:background 0.2s;position:relative}
.cc-dark-card:hover{background:#1a1a1a}
.cc-dark-card-top{display:flex;align-items:start;justify-content:space-between;margin-bottom:24px}
.cc-tag{font-size:10px;font-weight:700;letter-spacing:0.22em;text-transform:uppercase;color:#71C8F5}
.cc-dark-card-arrow{font-size:18px;color:#fff;line-height:1}
.cc-dark-card h3{font-size:22px;font-weight:900;color:#fff;text-transform:uppercase;letter-spacing:-0.01em;line-height:1.1;margin:0 0 8px}
.cc-tagline{font-size:13px;color:#888;font-style:italic;font-family:Georgia,serif;margin-bottom:18px}
.cc-dark-card p{font-size:14px;color:#aaa;line-height:1.6;margin:0}
.cc-dark-note{text-align:center;font-size:14px;color:#aaa;line-height:1.7;margin:48px 0 0}
.cc-dark-note a{color:#fff;font-weight:600;text-decoration:underline}
@media(max-width:900px){.cc-dark-grid{grid-template-columns:1fr}}

/* Inline text link inside Georgia/body copy (About letter style) */
.cc-text-link{color:inherit;text-decoration:underline;text-decoration-color:#999;text-underline-offset:3px}

/* FAQ heading spacing (homepage uses an inline margin-bottom:48px) */
.hp-h2--faq{margin-bottom:48px}

/* Small buttons (About strip size) */
.btn-sm{padding:14px 28px !important;font-size:10px !important}
.cc-btn-row{display:flex;gap:16px;flex-wrap:wrap;margin-top:8px}

/* ==========================================================================
   PART 5 — derived patterns (not on the homepage; built only from homepage
   values, for page types the homepage doesn't have)
   ========================================================================== */

/* Hero paragraph under the H1: use .hp-hero-sub (already defined in style.css). */

/* Keep FAQ questions as H3 headings inside the homepage accordion */
.hp-faq-item summary h3{font:inherit;color:inherit;letter-spacing:inherit;margin:0;display:inline}

/* Long-form reading column (use with shared-chrome.css .post-body-inner typography) */
.cc-prose{max-width:var(--content-narrow);margin:0 auto}

/* ---- Industry pages (derived; used by the /seo-for-* migration) ---- */

/* Visually hidden but readable by screen readers (keeps form labels) */
.cc-sr{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* Hero: long H1s wrap instead of running off the edge */
.hp-hero--wrap .hp-title{white-space:normal!important;max-width:980px!important}

/* Hero audit form with two fields (website + email) */
.hp-audit--wide{max-width:760px}
.hp-form-title{display:block;font-size:15px;font-weight:800;color:#0a0a0a;letter-spacing:-0.005em;margin-bottom:4px}
.hp-form-row.hp-form-row--2{display:grid;grid-template-columns:1fr 1fr auto;max-width:760px}
@media(min-width:901px){.hp-form-row--2 .hp-form-input:first-of-type{border-right:1px solid #e2e2dc}}
@media(max-width:900px){.hp-form-row.hp-form-row--2{grid-template-columns:1fr;gap:10px}}
.hf-ok{display:none;max-width:560px;margin:18px auto 0;padding:18px 22px;background:#fff;border:1px solid #e2e2dc;font-size:14px;line-height:1.6;color:#444;text-align:center}
.hf-ok b{display:block;font-size:15px;color:#0a0a0a;margin-bottom:4px}
.hf-ok a{color:#0a0a0a;font-weight:700;text-underline-offset:3px}

/* Section spacing helpers */
.cc-section--white + .cc-section--white,
.cc-section--cream + .cc-section--cream{border-top:1px solid #ececec}
.section-inner > .section-title:last-child{margin-bottom:0}

/* Light hairline card grid (same construction as the homepage industry grid) */
.cc-grid{display:grid;gap:2px;background:#e8e8e8;border:1px solid #e8e8e8;margin-top:60px}
.cc-grid--3{grid-template-columns:repeat(3,1fr)}
.cc-grid--2{grid-template-columns:repeat(2,1fr)}
@media(max-width:900px){.cc-grid--3,.cc-grid--2{grid-template-columns:1fr}}
.cc-card{background:#fff;padding:36px 32px;display:flex;flex-direction:column;transition:background 0.2s}
.cc-card:hover{background:#fafaf8}
.cc-card-k{display:block;font-size:10px;font-weight:700;letter-spacing:0.22em;text-transform:uppercase;color:#999;margin-bottom:18px}
.cc-card-num{display:block;font-family:Georgia,serif;font-style:italic;font-weight:300;font-size:44px;line-height:1;color:#71C8F5;letter-spacing:-0.02em;margin-bottom:18px}
.cc-card h3{font-size:18px;font-weight:900;text-transform:uppercase;line-height:1.15;letter-spacing:-0.005em;color:#0a0a0a;margin:0 0 10px}
.cc-card p{font-size:14.5px;line-height:1.65;color:#444;margin:0}
.cc-card .svc-link{align-self:flex-start;margin-top:auto;padding-top:0}
.cc-card p + .svc-link{margin-top:22px}
.cc-card ul{list-style:none;margin:4px 0 0;padding:0}
.cc-card li{font-size:15px;line-height:1.5;color:#444;padding:11px 0;border-bottom:1px solid #ececec}
.cc-card li:last-child{border-bottom:0}
@media(max-width:900px){.cc-card{padding:28px 24px}}

/* Pricing cards (featured plan is a dark card) */
.cc-plan h3{font-size:11px;font-weight:700;letter-spacing:0.2em;text-transform:uppercase;color:#555;margin:0}
.cc-plan-pop{display:block;font-size:10px;font-weight:700;letter-spacing:0.22em;text-transform:uppercase;color:#71C8F5;margin-bottom:10px}
.cc-price{font-size:clamp(36px,4vw,52px);font-weight:900;line-height:1;letter-spacing:-0.02em;color:#0a0a0a;margin:14px 0 8px}
.cc-price small{font-size:13px;font-weight:400;letter-spacing:0;color:#666;margin-left:4px}
.cc-fit{font-size:13px;line-height:1.5;color:#666;margin-bottom:14px}
.cc-plan ul{flex:1;margin-bottom:28px}
.cc-plan li{font-size:14px}
.cc-plan .btn-blue,.cc-plan .btn-outline{display:block;text-align:center}
.cc-plan--pop,.cc-plan--pop:hover{background:#0a0a0a}
.cc-plan--pop h3{color:#aaa}
.cc-plan--pop .cc-price{color:#fff}
.cc-plan--pop .cc-price small,.cc-plan--pop .cc-fit{color:#999}
.cc-plan--pop li{color:#bbb;border-color:#1a1a1a}

/* Long-form block inside a section (typography from .post-body-inner) */
.section-inner > .cc-prose{margin:48px 0 0;max-width:820px}
.cc-prose.post-body-inner h3:first-child{margin-top:0}

/* "Related industries" inline link list */
.cc-related{margin-top:32px;font-size:14px;line-height:2;color:#666}
.cc-related a{color:#000;font-weight:700;text-decoration:underline;text-underline-offset:3px;margin-right:14px;transition:opacity 0.2s}
.cc-related a:hover{opacity:.6}

/* Closing call to action on a dark section */
.cc-final{text-align:center}
.cc-final .section-title{margin-bottom:18px}
.cc-final p{font-size:15px;line-height:1.7;color:#aaa;max-width:520px;margin:0 auto 32px}

/* Link lists at the bottom of older pages */
.cc-linkhub .section-title{font-size:clamp(22px,2.4vw,30px);margin-bottom:0}
.cc-linkhub ul{list-style:none;column-gap:48px;margin-top:18px;padding-top:18px;border-top:1px solid #dcdcd6;max-width:820px}
.cc-linkhub li{break-inside:avoid;padding:3px 0}
.cc-linkhub li a{font-size:15px;color:#333;text-decoration:none;border-bottom:1px solid transparent;transition:border-color 0.2s,color 0.2s}
.cc-linkhub li a:hover{color:#000;border-bottom-color:#000}
.cc-linkhub + .cc-linkhub{border-top:0;padding-top:0}
@media(max-width:600px){.cc-linkhub ul{columns:1!important}}

/* Case card with a description instead of metrics (Sixwatch) */
.case-desc{font-size:14px;line-height:1.6;color:#aaa;margin:auto 0 24px}

/* ---- Article, Tampa and blog heroes (derived) ---- */
/* A second line inside the H1 reads like .hp-sub-headline */
.hp-title em{font-style:italic;color:#888}
.hp-title em:last-child{display:inline-block;font-weight:400;font-size:.684em;letter-spacing:-0.015em;line-height:1.15;margin-top:6px}
.hp-back{display:inline-block;margin-bottom:22px;font-size:10px;font-weight:700;letter-spacing:0.18em;text-transform:uppercase;color:#888;text-decoration:none;transition:color 0.2s}
.hp-back:hover{color:#0a0a0a}
.hp-updated{margin-top:14px;font-size:10px;font-weight:700;letter-spacing:0.24em;text-transform:uppercase;color:#999}
.hf-ok > div:first-child{font-size:15px;font-weight:700;color:#0a0a0a;margin-bottom:6px}
.cc-section > .cc-post{padding:0;margin:0 auto;max-width:760px}
.cc-moved{margin:0 0 40px}
.section-inner > p + .cc-prose{margin-top:24px}
.cc-table-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;max-width:100%}
.hp-hero--wrap .hp-sub-headline{white-space:normal!important;max-width:980px!important}

/* ---- Guide pages (derived) ---- */
.section-inner > .cc-prose.cc-article{margin-top:0;max-width:760px}
.cc-callout{background:#f7f7f5;border-left:3px solid #000;padding:22px 26px 20px;margin:0 0 8px}
.cc-prose .cc-callout .cc-callout-title{font-size:10px;font-weight:700;letter-spacing:0.3em;text-transform:uppercase;color:#888;margin:0 0 12px;line-height:1.4}
.cc-prose .cc-callout ul{margin:0}
.cc-prose ol{margin:0 0 24px 22px;display:flex;flex-direction:column;gap:10px}
.cc-prose ol li{font-size:16px;line-height:1.7;color:#333;padding-left:4px}
.cc-table{width:100%;min-width:560px;border-collapse:collapse;font-size:14px;line-height:1.5;margin:8px 0 28px}
.cc-table th,.cc-table td{padding:13px 16px;text-align:left;vertical-align:top;border-bottom:1px solid #e8e8e8}
.cc-table thead th{background:#000;color:#fff;font-size:11px;font-weight:700;letter-spacing:0.12em;text-transform:uppercase}
.cc-table tbody th{font-weight:700;color:#000;background:#f4f4f2}
.cc-table td{color:#333}
.cc-prose pre{background:#0a0a0a;color:#e8e8e8;padding:18px 22px;margin:0 0 24px;overflow-x:auto;font-size:14px;line-height:1.6}
.cc-prose code{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:0.92em}
.cc-prose p code,.cc-prose li code{background:#f4f4f2;padding:1px 5px}
a.cc-card{text-decoration:none;color:inherit}
a.cc-card .svc-link{margin-top:auto;padding-top:18px}
.hp-updated a.cc-text-link{color:#555}