/* ==========================================================================
   Editorial skin for the shared tdp- component pages (city/country, services,
   head-term, integrations, tools, comparison). 2026-09-24.
   Everything is scoped to body.ed: a page opts in by adding "ed" to $body_class,
   so pages that have not been reviewed are untouched. Markup is NOT changed, so
   headings, copy, links and schema stay byte-identical (SEO-safe by design).
   Design rules: BRAND-GUIDELINES.md §5.1. Handoff: Website/SITE-REVAMP-2026-09.md.
   ========================================================================== */
:root{--primary:#DC2626} /* site-wide: 6 pages (calculators, vs-pages) used var(--primary) but nothing defined it, so the calculator button was white-on-transparent (1.03:1). Found by contrast-audit 2026-09-24 */
body.ed{--ed-ink:#0F172A;--ed-text:#334155;--ed-mute:#64748B;--ed-line:#E2E8F0;--ed-red:#DC2626;--ed-red-dark:#B91C1C;--ed-alt:#FCFBFA;--ed-pad:clamp(16px,4vw,56px);--ed-max:1440px}
body.ed main{background:#fff}

/* ---- sections and containers ---- */
body.ed main>section{padding-top:clamp(56px,7vw,104px)!important;padding-bottom:clamp(56px,7vw,104px)!important;padding-left:var(--ed-pad)!important;padding-right:var(--ed-pad)!important;border-top:1px solid var(--ed-line);background:#fff}
body.ed main>section:nth-of-type(even){background:var(--ed-alt)}
body.ed .tdp-container{max-width:var(--ed-max);margin:0 auto}
body.ed .tdp-container-sm{max-width:var(--ed-max)}

/* ---- hero: left aligned, big and calm ---- */
body.ed .tdp-hero{background:#fff!important;text-align:left;padding-top:clamp(40px,6vw,96px)!important;padding-bottom:clamp(48px,6vw,88px)!important;border-top:0}
body.ed .tdp-hero .hero-glow{display:none}
body.ed .tdp-hero-inner{max-width:var(--ed-max);margin:0 auto;align-items:flex-start}
body.ed .tdp-hero .breadcrumb{justify-content:flex-start;font-size:.85rem;color:var(--ed-mute);margin-bottom:22px}
body.ed .tdp-hero .breadcrumb a{color:var(--ed-mute)}
body.ed .tdp-badge{background:none;border:0;box-shadow:none;padding:0;margin:0 0 18px;font:600 .8rem/1.4 'Inter',sans-serif;letter-spacing:.14em;text-transform:uppercase;color:var(--ed-red)}
body.ed .tdp-badge-dot{display:none}
body.ed .tdp-hero-title{font-size:clamp(2.6rem,1.5rem + 4.6vw,6rem);line-height:1;letter-spacing:-.045em;max-width:17ch;margin:0 0 28px;color:var(--ed-ink)}
body.ed .tdp-hero-title .text-gradient,body.ed .text-gradient{background:none!important;-webkit-text-fill-color:currentColor!important;color:var(--ed-ink)!important}
body.ed .tdp-hero-sub{font-size:clamp(1.05rem,1rem + .35vw,1.3rem);line-height:1.6;color:var(--ed-text);max-width:62ch;margin:0 0 32px}
body.ed .tdp-hero-actions{justify-content:flex-start;margin-bottom:26px}
body.ed .tdp-proof{justify-content:flex-start;font-size:.9rem;color:var(--ed-mute);background:none;border:0;padding:0}
body.ed .tdp-proof-stars{color:#D97706}

/* ---- buttons ---- */
body.ed .tdp-btn-primary{background:var(--ed-red);color:#fff!important;font:600 .98rem/1 'Inter',sans-serif;padding:15px 26px;border-radius:999px;box-shadow:none}
body.ed .tdp-btn-primary:hover{background:var(--ed-red-dark);transform:none;box-shadow:none}
body.ed .tdp-btn-secondary{background:transparent;color:var(--ed-ink)!important;font:600 .98rem/1 'Inter',sans-serif;padding:14px 24px;border:1px solid var(--ed-ink);border-radius:999px}
body.ed .tdp-btn-secondary:hover{background:var(--ed-ink);color:#fff!important;border-color:var(--ed-ink)}

/* ---- section header: label left, statement right ---- */
body.ed .tdp-section-header{text-align:left;max-width:none;margin:0 0 clamp(36px,4.5vw,64px)}
@media(min-width:1024px){
  body.ed .tdp-section-header{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);column-gap:40px;align-items:start}
  body.ed .tdp-section-header>*{grid-column:2}
  body.ed .tdp-section-header>.tdp-section-tag{grid-column:1;grid-row:1 / span 3}
}
body.ed .tdp-section-tag{font:600 .8rem/1.4 'Inter',sans-serif;letter-spacing:.14em;text-transform:uppercase;color:var(--ed-red);margin:6px 0 14px}
body.ed .tdp-section-header h2,body.ed main>section>.tdp-container>h2,body.ed .tdp-faq-title,body.ed .tdp-related-title{font-size:clamp(1.9rem,1.2rem + 2.2vw,3.2rem);line-height:1.08;letter-spacing:-.035em;color:var(--ed-ink);margin:0 0 16px;text-align:left;max-width:22ch}
body.ed .tdp-section-header p{font-size:clamp(1rem,.96rem + .25vw,1.12rem);line-height:1.7;color:var(--ed-text);max-width:62ch;margin:0;text-align:left}

/* ---- cards become editorial rows ---- */
body.ed .tdp-grid{gap:0 clamp(24px,3vw,44px)}
body.ed .tdp-card,body.ed .tdp-who-card,body.ed .tdp-related-card{background:none!important;border:0;border-top:1px solid var(--ed-line);border-radius:0;box-shadow:none!important;padding:26px 0 30px;transform:none!important}
body.ed .tdp-card:hover,body.ed .tdp-who-card:hover,body.ed .tdp-related-card:hover{border-color:var(--ed-ink)}
body.ed .tdp-who-card-featured{border-top:2px solid var(--ed-red)}
body.ed .tdp-card-icon{width:auto;height:auto;background:none;border-radius:0;color:var(--ed-red);margin:0 0 14px;justify-content:flex-start}
body.ed .tdp-card-icon svg{width:24px;height:24px}
body.ed .tdp-card h3,body.ed .tdp-who-card h3{font-size:clamp(1.15rem,1.05rem + .4vw,1.4rem);line-height:1.25;letter-spacing:-.02em;color:var(--ed-ink);margin:0 0 10px}
body.ed .tdp-card p,body.ed .tdp-who-card p{font-size:.98rem;line-height:1.65;color:var(--ed-text)}
body.ed .tdp-who-label{color:var(--ed-mute)}

/* ---- steps become numbered rows ---- */
body.ed .tdp-steps{display:block;max-width:none}
body.ed .tdp-step{display:grid;grid-template-columns:72px minmax(0,1fr);gap:0 20px;padding:26px 0;border-top:1px solid var(--ed-line);background:none;box-shadow:none;border-radius:0}
body.ed .tdp-step:last-child{border-bottom:1px solid var(--ed-line)}
body.ed .tdp-step-num{width:auto;height:auto;background:none;border-radius:0;color:var(--ed-red);font:400 clamp(1.6rem,1.3rem + 1vw,2.4rem)/1 'Outfit',sans-serif;letter-spacing:-.04em;box-shadow:none}
body.ed .tdp-step-body h3{font-size:clamp(1.15rem,1.05rem + .4vw,1.4rem);margin:0 0 8px;color:var(--ed-ink)}
body.ed .tdp-step-body p{color:var(--ed-text);line-height:1.7;max-width:70ch}

/* ---- split sections ---- */
body.ed .tdp-split{gap:clamp(32px,5vw,80px);align-items:center}
body.ed .tdp-split-content h2{font-size:clamp(1.9rem,1.2rem + 2.2vw,3.2rem);line-height:1.08;letter-spacing:-.035em}
body.ed .tdp-split-content p{color:var(--ed-text);line-height:1.75;font-size:1.04rem}
body.ed .tdp-split-visual img,body.ed .tdp-img,body.ed .tdp-banner-img{border-radius:clamp(16px,2vw,28px)!important;box-shadow:0 40px 80px -60px rgba(15,23,42,.45)!important}

/* ---- stats ---- */
body.ed .tdp-stat-pills{justify-content:flex-start;gap:12px 28px}
body.ed .tdp-stat-pill{background:none;border:0;border-left:2px solid var(--ed-red);border-radius:0;padding:2px 0 2px 12px;box-shadow:none;color:var(--ed-text)}

/* ---- FAQ ---- */
body.ed .tdp-faq-list{border-top:1px solid var(--ed-line);max-width:none}
body.ed .tdp-faq-item{background:none!important;border:0;border-bottom:1px solid var(--ed-line);border-radius:0;box-shadow:none;margin:0}
body.ed .tdp-faq-q{padding:22px 0;font-size:1.05rem;font-weight:500;color:var(--ed-ink)}
body.ed .tdp-faq-a{padding:0 0 22px;color:var(--ed-text);line-height:1.7;max-width:74ch}
@media(min-width:1024px){body.ed .tdp-faq .tdp-container{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);column-gap:40px}body.ed .tdp-faq .tdp-container>*{grid-column:2}body.ed .tdp-faq .tdp-faq-title{grid-column:1;grid-row:1 / span 2;font-size:clamp(1.5rem,1.1rem + 1.2vw,2.2rem)}}

/* ---- related links ---- */
body.ed .tdp-related-grid{gap:0 clamp(24px,3vw,44px)}
body.ed .tdp-related-tag{color:var(--ed-red);font-weight:600;letter-spacing:.12em;text-transform:uppercase;font-size:.75rem}
body.ed .tdp-related-name{color:var(--ed-ink);font-family:'Outfit',sans-serif;font-size:1.2rem;letter-spacing:-.02em}
body.ed .tdp-related-desc{color:var(--ed-text)}

/* ---- tables (comparison pages) ---- */
body.ed table{border-collapse:collapse;width:100%}
body.ed .tdp-datatable table th,body.ed .tdp-datatable table td,body.ed main table th,body.ed main table td{border:0;border-bottom:1px solid var(--ed-line);padding:14px 16px;text-align:left;color:var(--ed-text);background:none}
body.ed main table thead th{font:600 .78rem/1.4 'Inter',sans-serif;letter-spacing:.12em;text-transform:uppercase;color:var(--ed-mute)}

/* ---- closing CTA: bright gradient mesh, static and calm ---- */
body.ed .tdp-cta{text-align:left;background:
  radial-gradient(60vw 40vw at 5% 0%,rgba(254,202,202,.85),transparent 60%),
  radial-gradient(50vw 40vw at 100% 10%,rgba(254,215,170,.8),transparent 60%),
  radial-gradient(45vw 35vw at 55% 110%,rgba(233,213,255,.8),transparent 60%),#FFF8F6!important;padding-top:clamp(80px,10vw,150px)!important;padding-bottom:clamp(80px,10vw,150px)!important}
body.ed .tdp-cta .tdp-container{max-width:var(--ed-max)}
body.ed .tdp-cta h2{font-size:clamp(2.6rem,1.6rem + 4.6vw,6rem);line-height:.98;letter-spacing:-.045em;max-width:15ch;margin:0 0 22px;text-align:left}
body.ed .tdp-cta p{margin:0 0 34px;max-width:52ch;text-align:left;color:var(--ed-text);font-size:clamp(1.05rem,1rem + .35vw,1.3rem)}
body.ed .tdp-cta .tdp-hero-actions{justify-content:flex-start}

/* ---- small text never below AA ---- */
body.ed .tdp-proof-sep,body.ed .tdp-who-label,body.ed .breadcrumb .sep{color:var(--ed-mute)}

/* ---- fixes found on the pilot pages ---- */
body.ed .tdp-step-num{opacity:1}
body.ed .tdp-who-label{background:none;color:var(--ed-red);padding:0;font:600 .78rem/1.4 'Inter',sans-serif;letter-spacing:.14em;margin:0 0 10px}
body.ed .tdp-stat-stack{position:static!important;flex-direction:row!important;flex-wrap:wrap;gap:10px 24px!important;margin-top:18px}
body.ed .tdp-stat-stack .tdp-stat-pill{box-shadow:none!important;background:none!important}

/* ---- hero visual: add <figure class="ed-hero-media"> inside .tdp-hero after .tdp-hero-inner ---- */
@media(min-width:1024px){
  body.ed .tdp-hero:has(.ed-hero-media){display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);column-gap:clamp(32px,4vw,72px);align-items:center;max-width:calc(var(--ed-max) + 2*var(--ed-pad));margin:0 auto}
  body.ed .tdp-hero:has(.ed-hero-media) .tdp-hero-inner{margin:0;max-width:none}
  body.ed .tdp-hero:has(.ed-hero-media) .tdp-hero-title{font-size:clamp(2.6rem,1.4rem + 3.6vw,5.2rem)}
}
body.ed .ed-hero-media{margin:36px 0 0;position:relative}
@media(min-width:1024px){body.ed .ed-hero-media{margin:0}}
body.ed .ed-hero-media>img{display:block;width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;border-radius:clamp(18px,2vw,30px);box-shadow:0 40px 80px -60px rgba(15,23,42,.5)}
body.ed .ed-hero-media figcaption{position:absolute;left:18px;bottom:16px;background:#fff;color:var(--ed-ink);border-radius:999px;padding:7px 14px;font-size:.85rem;font-weight:500;box-shadow:0 10px 24px -14px rgba(15,23,42,.4)}

/* ---- trio of real client screens (hero or split visual) ---- */
body.ed .ed-trio{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(8px,1vw,14px);margin:0}
body.ed .ed-trio img{display:block;width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;border-radius:clamp(12px,1.4vw,20px);background:#EDE9E4}
body.ed .ed-trio img:nth-child(2){transform:translateY(-18px)}
body.ed .ed-trio figcaption{grid-column:1/-1;margin-top:10px;font-size:.88rem;color:var(--ed-mute)}
body.ed .tdp-split-visual .ed-trio{margin-bottom:22px}
body.ed .ed-hero-media .ed-trio figcaption{position:static;background:none;box-shadow:none;padding:0;border-radius:0;color:var(--ed-mute);font-weight:400}

/* ---- wall of client work (shared/ed-visuals.php ed_wall()): full-bleed drifting band ---- */
body.ed main>section.ed-wall{padding:clamp(40px,5vw,72px) 0!important;overflow:hidden;background:var(--ed-alt);display:grid;gap:clamp(12px,1.4vw,20px)}
body.ed .ed-wall-row{overflow:hidden}
body.ed .ed-wall-track{display:flex;gap:clamp(12px,1.4vw,20px);width:max-content;animation:ed-drift 70s linear infinite}
body.ed .ed-wall-row.rev .ed-wall-track{animation-direction:reverse;animation-duration:80s}
body.ed .ed-wall:hover .ed-wall-track{animation-play-state:paused}
body.ed .ed-wall figure{margin:0;flex:0 0 auto;width:clamp(140px,15vw,230px);aspect-ratio:4/5;border-radius:clamp(12px,1.4vw,20px);overflow:hidden;background:#EDE9E4}
body.ed .ed-wall img{width:100%;height:100%;object-fit:cover;display:block}
@keyframes ed-drift{from{transform:translate3d(0,0,0)}to{transform:translate3d(calc(-50% - clamp(6px,.7vw,10px)),0,0)}}
@media(prefers-reduced-motion:reduce){body.ed .ed-wall-track{animation:none}}
body.ed .ed-hero-media--wide>img{aspect-ratio:4/3}
