/* DealerSales Navy — WordPress additions to the design's styles.css/theme.css.
   Everything the static design didn't need: the real logo, WordPress content,
   old page-builder pages, the blog, pop-up forms and form messages. */

/* Skip link */
.dsn-skip{position:absolute;left:12px;top:-60px;z-index:100;padding:10px 16px;border-radius:10px;background:var(--primary);color:#fff;font-weight:500}
.dsn-skip:focus{top:12px}

/* Logo: the real navy/white marks instead of the design's unstyled inline logo */
.dsn-logo{display:block;width:150px;height:auto}
.site-footer .dsn-logo-foot{width:150px}
.nav-links a[aria-current="page"]{color:var(--primary);font-weight:500}

/* Heroes on pages outside the design */
.dsn-page-hero{padding:56px 0 64px}
.dsn-page-hero .h1{font-size:clamp(34px,4.2vw,52px);max-width:22ch}
.dsn-post-hero .h1{max-width:28ch}
.dsn-post-meta{margin-top:14px;font-size:15px;color:var(--hero-muted)}
.dsn-content{padding:64px 0 96px}

/* WordPress content */
.dsn-prose{font-size:17px;line-height:1.7;color:var(--ink)}
.dsn-prose > * + *{margin-top:1.1em}
.dsn-prose h2{font-size:30px;line-height:1.2;letter-spacing:-.02em;margin:1.8em 0 .5em}
.dsn-prose h3{font-size:22px;line-height:1.3;margin:1.5em 0 .4em}
.dsn-prose h4{font-size:18px;margin:1.3em 0 .3em}
.dsn-prose p,.dsn-prose li{color:#243247}
.dsn-prose ul,.dsn-prose ol{padding-left:1.3em}
.dsn-prose li + li{margin-top:.35em}
.dsn-prose a:not(.btn):not(.vc_btn3){color:var(--link);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
.dsn-prose img{height:auto;border-radius:14px}
.dsn-prose blockquote{margin:1.5em 0;padding:4px 0 4px 20px;border-left:3px solid var(--highlight);color:var(--muted)}
.dsn-prose table{width:100%;border-collapse:collapse;font-size:15px}
.dsn-prose th,.dsn-prose td{padding:10px 12px;border-bottom:1px solid var(--line);text-align:left}
.dsn-article{max-width:780px}
.dsn-post-image{width:100%;height:auto;border-radius:18px;margin-bottom:2em}

/* Old page-builder pages: keep their layout, take the design's type and buttons */
.dsn-legacy .vc_row[data-vc-full-width]{left:auto!important;width:auto!important;padding-left:0!important;padding-right:0!important}
.dsn-legacy .vc_row{margin-left:0;margin-right:0}
.dsn-legacy h1,.dsn-legacy h2,.dsn-legacy h3{font-family:inherit;letter-spacing:-.02em}
.dsn-legacy h1{font-size:clamp(32px,4vw,48px);line-height:1.1}
.dsn-legacy .vc_btn3,.dsn-legacy .themeBtn a,.dsn-legacy .theme-btn a{display:inline-flex!important;align-items:center;justify-content:center;min-height:48px;padding:12px 24px!important;border:0!important;border-radius:999px!important;background:var(--btn)!important;color:#fff!important;font-size:15px!important;font-weight:500!important;text-decoration:none!important;box-shadow:none!important}
.dsn-legacy .vc_btn3:hover,.dsn-legacy .themeBtn a:hover{background:var(--btn-hover)!important}
/* Old page banners become the design's navy hero band */
.dsn-legacy .service-seo-banner-section,.dsn-legacy .other-pageBanner-section{margin:0 0 56px!important;padding:64px clamp(24px,5vw,64px)!important;border-radius:28px;overflow:hidden;background:var(--hero-bg)!important;background-image:none!important;color:#fff}
.dsn-legacy .service-seo-banner-section *,.dsn-legacy .other-pageBanner-section *{color:#fff}
.dsn-legacy .service-seo-banner-section p,.dsn-legacy .other-pageBanner-section p,.dsn-legacy .service-seo-banner-section li,.dsn-legacy .other-pageBanner-section li{color:var(--hero-muted)!important}
.dsn-legacy .service-seo-banner-section .vc_btn3,.dsn-legacy .service-seo-banner-section .themeBtn a,
.dsn-legacy .other-pageBanner-section .vc_btn3,.dsn-legacy .other-pageBanner-section .themeBtn a{background:var(--hero-btn)!important;color:#fff!important}
.dsn-legacy .service-seo-banner-section img{border-radius:18px}
.dsn-content:has(.dsn-legacy > .vc_section:first-child.service-seo-banner-section),
.dsn-content:has(.dsn-legacy > .vc_section:first-child.other-pageBanner-section){padding-top:32px}
/* The old theme hid spare buttons with Bootstrap utilities */
.dsn .d-none{display:none!important}
@media (min-width:768px){.dsn .d-md-block{display:block!important}.dsn .d-md-flex{display:flex!important}.dsn .d-md-none{display:none!important}}
@media (min-width:992px){.dsn .d-lg-block{display:block!important}.dsn .d-lg-flex{display:flex!important}.dsn .d-lg-none{display:none!important}}
.dsn-legacy li:has(> ul:only-child){list-style:none}

/* DealerDrive: the API reviewer section kept from the WordPress page */
.dsn-api{padding-top:0}
.dsn-api .vc_row{background:none!important;padding:0!important}

/* Onboarding and other application pages: a plain canvas */
.dsn-app-sec{padding:8px 0 24px}
.dsn-app .site-footer{margin-top:0}

/* Blog cards */
.dsn-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:28px}
.dsn-card{display:flex;flex-direction:column;border-radius:22px;background:#fff;box-shadow:0 0 0 1px var(--line);overflow:hidden;transition:box-shadow .2s,transform .2s}
.dsn-card:hover{box-shadow:0 0 0 1px var(--line-strong),0 18px 40px rgba(0,36,66,.08);transform:translateY(-2px)}
.dsn-card-media{display:block;background:var(--soft)}
.dsn-card-media img{width:100%;height:auto;border-radius:0}  /* thumbnails carry text: never crop them */
.dsn-card-body{display:flex;flex-direction:column;gap:10px;padding:24px 26px 28px}
.dsn-card-body h2{margin:0;font-size:21px;line-height:1.3;letter-spacing:-.01em}
.dsn-card-body p{margin:0;color:var(--muted);font-size:15px;line-height:1.6}
.dsn-card-body .eyebrow{font-size:11px}
.dsn-more{margin-top:auto;padding-top:6px;color:var(--link);font-weight:500;font-size:15px}
.dsn-pagination{margin-top:48px}
.dsn-pagination .nav-links{display:flex!important;position:static;gap:8px;justify-content:center;margin:0;background:none;box-shadow:none}
.dsn-pagination .page-numbers{display:inline-flex;align-items:center;justify-content:center;min-width:42px;height:42px;padding:0 14px;border-radius:999px;box-shadow:0 0 0 1px var(--line)}
.dsn-pagination .page-numbers.current{background:var(--primary);color:#fff;box-shadow:none}

/* Pop-up forms for old page-builder buttons */
.dsn-modal{width:min(560px,calc(100% - 32px));max-height:calc(100dvh - 48px);padding:0;border:0;border-radius:22px;background:#fff;color:var(--ink);box-shadow:0 30px 80px rgba(0,26,49,.35)}
.dsn-modal::backdrop{background:rgba(0,26,49,.55);backdrop-filter:blur(3px)}
.dsn-modal-inner{display:flex;flex-direction:column;max-height:inherit}
.dsn-modal-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding:24px 28px 0}
.dsn-modal-head h2{margin:0;font-size:22px;letter-spacing:-.01em}
.dsn-modal-close{flex:0 0 auto;width:36px;height:36px;border:0;border-radius:50%;background:var(--soft);font-size:22px;line-height:1;cursor:pointer}
.dsn-modal-body{overflow-y:auto;padding:18px 28px 28px}

/* Contact Form 7 inside pop-ups and old pages: the design's field style */
.wpcf7-form p{margin:0 0 14px}
.wpcf7-form label{display:block;font-size:13px;font-weight:500}
.wpcf7-form input:not([type=submit]):not([type=checkbox]):not([type=radio]),.wpcf7-form select,.wpcf7-form textarea{width:100%;height:50px;padding:0 16px;border-radius:12px;border:1px solid var(--line-strong);background:#fff;font-size:16px}
.wpcf7-form textarea{height:110px;padding:12px 16px}
.wpcf7-form input[type=submit]{min-height:50px;padding:12px 26px;border:0;border-radius:999px;background:var(--hero-btn);color:#fff;font-weight:500;font-size:16px;cursor:pointer}
.wpcf7-not-valid-tip{font-size:13px;color:var(--bad);margin-top:4px}
.wpcf7-response-output{border-radius:12px;padding:12px 14px!important;margin:12px 0 0!important;font-size:14px}

/* Messages on the designed forms */
.form [aria-invalid="true"]{border-color:var(--bad)!important;box-shadow:0 0 0 3px var(--bad-soft)}
.dsn-field-error{font-size:13px;color:var(--bad)}
.dsn-form-error{margin:12px 0 0;padding:12px 14px;border-radius:12px;background:var(--bad-soft);color:var(--bad);font-size:14px}
.dsn-form-error a{text-decoration:underline}
.form.is-sending button[type=submit]{opacity:.7;cursor:progress}

/* reCAPTCHA: the notice beside each form replaces the floating badge */
.grecaptcha-badge{visibility:hidden!important}
.dsn-recaptcha-note{margin:12px 0 0;font-size:12px;line-height:1.5;color:var(--muted)}
.dsn-recaptcha-note a{text-decoration:underline}

@media (max-width:760px){
	.dsn-page-hero{padding:40px 0 44px}
	.dsn-content{padding:40px 0 64px}
	.dsn-prose{font-size:16px}
	.dsn-prose h2{font-size:24px}
	.dsn-modal-head,.dsn-modal-body{padding-left:20px;padding-right:20px}
}

/* Phones: the design's two-column sections stack, but a wide mock inside held the
   single column at 436px and cut the text off. Let the column shrink; wide mocks scroll. */
@media (max-width:900px){
	.container.split{grid-template-columns:minmax(0,1fr)!important}
	.container.split>*{min-width:0}
	.matrix.mock{overflow-x:auto;-webkit-overflow-scrolling:touch}
}
@media (max-width:480px){
	.sc-row{grid-template-columns:minmax(0,140px) minmax(60px,1fr) 30px!important}
}
/* Onboarding: the wizard sets its own width (up to 1320px); the design's 1200px
   container squeezed its form to 808px, wrapping answers and stretching steps. */
.dsn-app-sec .container{max-width:1400px;padding-left:16px;padding-right:16px}

/* ===========================================================================
   Case studies. The design's pages use these components, but its styles.css
   shipped without them (also .tile on home, platform, DealerDrive, AI growth,
   and .geo on AI growth). Written here in the design's own tokens.
   ======================================================================== */

/* Case-study tiles */
.tile-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(310px,1fr));gap:24px}
.tile{display:flex;flex-direction:column;border-radius:24px;background:#fff;box-shadow:0 0 0 1px var(--line);overflow:hidden;color:var(--ink);transition:transform .2s,box-shadow .2s}
.tile:hover{transform:translateY(-3px);box-shadow:0 0 0 1px var(--line-strong),0 22px 44px rgba(0,36,66,.1)}
.tile-img{display:block;aspect-ratio:5/3;background:var(--primary);overflow:hidden}
.tile-img img{width:100%;height:100%;object-fit:cover}
.tile-b{display:flex;flex-direction:column;gap:12px;flex:1;padding:22px 24px 24px}
.tile-meta{display:flex;justify-content:space-between;align-items:center;gap:10px;font-size:12px}
.tile-kind{font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--eyebrow)}
.tile-mk{display:inline-flex;align-items:center;gap:5px;color:var(--muted);text-align:right}
.tile-mk svg{width:14px;height:14px;flex-shrink:0}
.tile-t{margin:0;font-size:19px;line-height:1.35;letter-spacing:-.01em;font-weight:500;color:var(--ink)}
.tile-chips{display:flex;flex-wrap:wrap;gap:6px}
.tile-chip{padding:4px 10px;border-radius:999px;background:var(--primary-soft);color:var(--primary);font-size:12.5px;font-weight:500}
.tile-go{display:inline-flex;align-items:center;gap:6px;margin-top:auto;padding-top:4px;color:var(--link);font-size:15px;font-weight:500}
.tile-go svg{width:16px;height:16px;transition:transform .2s}
.tile:hover .tile-go svg{transform:translateX(3px)}

/* A case study */
.cs-page{padding-top:40px}
.cs-crumbs{color:var(--muted)}
.cs-crumbs a{color:var(--primary)}
.cs{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:40px 56px;align-items:start;margin-top:8px}
.cs-chips{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:22px}
.cs-chip{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:999px;background:#fff;box-shadow:inset 0 0 0 1px var(--line);font-size:13px;color:var(--ink)}
.cs-chip svg{width:14px;height:14px;flex-shrink:0}
.cs-chip.p{background:var(--primary);color:#fff;box-shadow:none}
.cs-t{margin:0;font-size:clamp(30px,3.4vw,44px);line-height:1.12;letter-spacing:-.025em;font-weight:500;color:var(--ink)}
.cs-s{margin:18px 0 0;font-size:18px;line-height:1.6;color:var(--muted)}
.cs-hero{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px 18px;margin-top:28px;padding:24px 28px;border-radius:22px;background:var(--primary);color:#fff}
.cs-hero b{font-size:clamp(44px,5.4vw,68px);line-height:1;letter-spacing:-.03em;font-weight:600;color:var(--highlight-on-dark)}
.cs-hero span{flex:1 1 200px;font-size:16px;line-height:1.45;color:rgba(255,255,255,.84)}
.cs-before{margin-top:14px;padding:16px 20px;border-radius:16px;background:var(--soft);border-left:3px solid var(--line-strong)}
.cs-before b{font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.cs-before p{margin:6px 0 0;font-size:15px;line-height:1.55;color:var(--ink)}
.cs-r{position:sticky;top:96px;padding:26px 28px;border-radius:24px;background:#fff;box-shadow:0 0 0 1px var(--line),0 24px 60px rgba(0,36,66,.08)}
.cs-rh{display:flex;justify-content:space-between;gap:12px;padding-bottom:14px;border-bottom:1px solid var(--line);font-size:12.5px;color:var(--muted)}
.cs-rh span{display:inline-flex;align-items:center;gap:6px}
.cs-rh svg{width:14px;height:14px}
.cs-m{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:8px 14px;padding:16px 0;border-bottom:1px solid var(--line)}
.cs-ml{grid-column:1/-1;font-size:13.5px;line-height:1.4;color:var(--muted)}
.cs-bars{grid-column:1/-1;display:flex;flex-direction:column;gap:5px}
.cs-bars i{display:block;min-width:6px;height:8px;border-radius:99px;background:var(--line-strong)}
.cs-bars i.a{background:var(--highlight)}
.cs-v{display:inline-flex;flex-wrap:wrap;align-items:center;gap:8px;font-size:15px}
.cs-v s{color:var(--muted)}
.cs-v b{font-size:24px;line-height:1.1;letter-spacing:-.02em;color:var(--ink)}
.cs-v svg{width:14px;height:14px;color:var(--muted)}
.cs-ch{justify-self:end;padding:4px 10px;border-radius:999px;background:var(--ok-soft);color:var(--ok);font-size:12.5px;font-weight:600;white-space:nowrap}
.cs-x{margin:16px 0 0;font-size:14px;line-height:1.55;color:var(--ink)}
.cs-src{display:flex;gap:8px;margin:14px 0 0;font-size:12.5px;line-height:1.5;color:var(--muted)}
.cs-src svg{flex-shrink:0;width:14px;height:14px;margin-top:2px}
.cs-steps,.cs-proof{grid-column:1/-1;padding-top:32px;border-top:1px solid var(--line)}
.cs-steps{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);gap:20px 48px;align-items:start}
.cs-steps h2{grid-column:1/-1;margin:0}
.cs-steps ol{margin:0;padding:0;list-style:none;counter-reset:cs}
.cs-steps li{counter-increment:cs;position:relative;padding:12px 0 12px 44px;border-bottom:1px solid var(--line);font-size:16px;line-height:1.55;color:var(--ink)}
.cs-steps li::before{content:counter(cs);position:absolute;left:0;top:11px;display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--primary-soft);color:var(--primary);font-size:13px;font-weight:600}
.cs-you{padding:24px 26px;border-radius:20px;background:var(--primary);color:#fff}
.cs-you b{display:block;font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--eyebrow-on-dark)}
.cs-you p{margin:10px 0 0;line-height:1.6;color:rgba(255,255,255,.86)}
.cs-proof h2{margin:0}
.cs-pnote{margin:8px 0 28px;color:var(--muted)}

/* Proof panels: the number and its explanation beside the report screenshot */
.pf{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);align-items:center;gap:32px;margin:0 0 24px;padding:28px;border-radius:24px;background:var(--soft)}
.pf.rev .pf-t{order:2}
.pf-n{font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--eyebrow)}
.pf-t h3{margin:10px 0 0;font-size:22px;line-height:1.25;letter-spacing:-.01em}
.pf-big{display:block;margin:10px 0 0;font-size:44px;line-height:1;letter-spacing:-.03em;color:var(--primary)}
.pf-t p{margin:12px 0 0;font-size:15px;line-height:1.6;color:var(--muted)}
.pf-img{display:block;overflow:hidden;border-radius:16px;background:#fff;box-shadow:0 0 0 1px var(--line),0 16px 40px rgba(0,36,66,.08)}
.pf-img img{width:100%;height:auto}
/* Until a screenshot is supplied the panel is text only: number left, explanation right */
.pf.pf-noimg{grid-template-columns:1fr;padding:24px 28px}
.pf-noimg .pf-t{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);column-gap:40px;align-items:center}
.pf-noimg .pf-n,.pf-noimg .pf-t h3,.pf-noimg .pf-big{grid-column:1}
.pf-noimg .pf-t p{grid-column:2;grid-row:1/span 3;margin:0}

/* AI growth: what GEO is */
.geo{max-width:920px;margin:0 auto}
.geo-def{margin:20px 0 0;font-size:19px;line-height:1.6;color:var(--ink)}
.geo-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:28px}
.geo-grid>div{padding:24px;border-radius:20px;background:var(--soft);box-shadow:inset 0 0 0 1px var(--line)}
.geo-grid>div:last-child{background:var(--primary);color:#fff;box-shadow:none}
.geo-grid b{display:block;margin-top:14px;font-size:20px}
.geo-grid p{margin:8px 0 0;line-height:1.6;color:var(--muted)}
.geo-grid>div:last-child p{color:rgba(255,255,255,.84)}
.geo-i{display:grid;place-items:center;width:40px;height:40px;border-radius:12px;background:var(--primary-soft);color:var(--primary)}
.geo-grid>div:last-child .geo-i{background:rgba(255,255,255,.12);color:var(--highlight-on-dark)}
.geo-i svg{width:20px;height:20px}
.geo-ol{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:16px 0 0;padding:0;list-style:none;counter-reset:geo}
.geo-ol li{counter-increment:geo;position:relative;padding:18px 20px 18px 60px;border-radius:18px;box-shadow:inset 0 0 0 1px var(--line);line-height:1.55;color:var(--muted)}
.geo-ol li b{color:var(--ink)}
.geo-ol li::before{content:counter(geo);position:absolute;left:18px;top:17px;display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--primary);color:#fff;font-size:13px;font-weight:600}

@media (max-width:900px){
	.cs{grid-template-columns:1fr;gap:28px}
	.cs-r{position:static}
	.cs-steps{grid-template-columns:1fr}
	.pf{grid-template-columns:1fr;gap:20px;padding:20px}
	.pf.rev .pf-t{order:0}
	.pf-noimg .pf-t{grid-template-columns:1fr}
	.pf-noimg .pf-t p{grid-column:1;grid-row:auto;margin-top:12px}
	.geo-grid,.geo-ol{grid-template-columns:1fr}
}

/* Pricing: no prices. Each card leads with its call to action, right under the
   one-liner, then lists what is included. The free audit card follows suit. */
.plan>*{order:3}
.plan>.tag,.plan>.h3{order:0}
.plan>.muted{order:1}
.plan>.price,.plan>.plan-cta,.plan>.btn{order:2}
.plan>.btn{margin-top:4px}
.plan-cta{margin:8px 0 6px}
.plan-cta .btn{width:100%}
.plan>.btn{width:100%}
.plan-note{margin:10px 0 0;font-size:12.5px;line-height:1.4;color:var(--muted);text-align:center}
.plan-cta .btn-primary{background:var(--btn);border-color:transparent;color:#fff}
.plan-cta .btn-primary:hover{background:var(--btn-hover)}