/* lp-theme.css — designanddevelopment.in. design-match-qa 2026-10-27.
   Maps every CMS landing-page template (premium-page / g1221-page / nx-page / new5 / pending / b2 / q816 / ux1221)
   onto the site's own tokens. Dark is the site default (html.dark set by #lpt-theme, same key as the app:
   localStorage dd-learnhub-theme); light mode follows the site's light palette. */
:root{--lt-bg:#fff;--lt-alt:#f7f7fa;--lt-card:#fff;--lt-ink:#272235;--lt-text:#575563;--lt-muted:#6d6a7a;--lt-border:#e7e5ef;--lt-field:#fff;--lt-field-b:#d9d6e4;--lt-accent:#7258dc;--lt-link:#6247d0;--lt-btn:linear-gradient(115deg,#7258dc,#9a61dc);--lt-btn-c:#fff;--lt-btn-sh:0 3px 0 rgba(98,71,208,.25);--lt-chip:#f3f1fa}
html.dark{--lt-bg:#050520;--lt-alt:#0b0a26;--lt-card:#1a1833;--lt-ink:#d6daf0;--lt-text:#a7accd;--lt-muted:#8d92b5;--lt-border:#24203d;--lt-field:#100e28;--lt-field-b:#36305a;--lt-accent:#9382ff;--lt-link:#b9adff;--lt-btn:linear-gradient(114deg,#b26ef7,#ff71bf 46.5%,#ffbd7a);--lt-btn-c:#1a0b24;--lt-btn-sh:0 3px 0 rgba(130,78,165,.4);--lt-chip:rgba(16,16,40,.69)}
html body{background:var(--lt-bg)!important}
/* site header: the template hard-codes the dark bar; give light mode the site's light bar */
html:not(.dark) body .lh-header{background:rgba(255,255,255,.95)!important;border-bottom:1px solid var(--lt-border)}
html body main:not(#_){--p-accent:var(--lt-accent)!important;--p-ink:var(--lt-ink)!important;--p-surface:var(--lt-alt)!important;--p-bg:var(--lt-bg)!important;--p-muted:var(--lt-text)!important;--n-bg:var(--lt-bg)!important;--n-accent:var(--lt-accent)!important;--n-ink:var(--lt-ink)!important;--n-muted:var(--lt-text)!important;--nx-ink:var(--lt-ink)!important;--nx-paper:var(--lt-bg)!important;--nx-accent:var(--lt-accent)!important;--nx-soft:var(--lt-alt)!important;--ux-accent:var(--lt-accent)!important;--ux-ink:var(--lt-ink)!important;--ux-surface:var(--lt-bg)!important;--lpfx-accent:var(--lt-accent)!important;
  background:var(--lt-bg)!important;color:var(--lt-text)!important;font-family:"DM Sans",Arial,sans-serif!important}
html body main:not(#_) :is(h1,h2,h3,h4,h5,h6,p,li,a,span,em,strong,b,label,input,select,textarea,button,td,th,small,figcaption,summary,dt,dd,blockquote,legend,div,section,article){font-family:"DM Sans",Arial,sans-serif!important}
html body main:not(#_) :is(h1,h2,h3,h4,h5,h6,strong,b,th,summary,dt,legend){color:var(--lt-ink)!important}
html body main:not(#_) :is(h1,h2){font-weight:700!important}
html body main:not(#_) :is(p,li,td,figcaption,small,dd,blockquote,label){color:var(--lt-text)!important}
html body main:not(#_) span:where(:not([class*=btn]):not([class*=button]):not([class*=kicker]):not([class*=eyebrow])){color:inherit}
html body main:not(#_) :is([class*=kicker],[class*=eyebrow],.tag,.pm-step span,.lpfx-stepno,.lpfx-rotator){color:var(--lt-link)!important}
html body main:not(#_) :is([class*=deck],[class*=lede],[class*=subtitle],[class*=intro]:not(section):not(div:has(h1,h2)),[class*=description],[class*=summary]:not(summary)){color:var(--lt-text)!important}
/* surfaces: everything flat on the page background, then the site's card + alt-section treatment */
html body main:not(#_) :is(section,div,article,aside,nav,figure,table,thead,tbody,tr,th,td,details,form,blockquote,ul,ol,li,dl,fieldset){background-color:transparent!important}
html body main:not(#_) :is(.pm-hero,.pm-tint,.pm-final,.pm-jump,.nx-ai-seo-proof,.q816:nth-of-type(even),th){background-color:var(--lt-alt)!important}
html body main:not(#_) :is(article,[class*=card]:not([class*=cards]),.pm-form,.pm-why,.pm-table-wrap,details,blockquote,.q816-card,.new5-enquiry,.pending-form,.existing-form-box,[class*=-form]:not(form)){background-color:var(--lt-card)!important;border-color:var(--lt-border)!important;box-shadow:none!important}
html body main:not(#_) :is(article,[class*=card]:not([class*=cards]),.pm-form,.q816-card,details){border-radius:10px}
html body main:not(#_) *{border-color:var(--lt-border)}
html body main:not(#_) :is(.pm-why,.pm-step,.lpfx-process){border-color:var(--lt-accent)!important}
html body main:not(#_) .pm-why{background-color:transparent!important}
html body main:not(#_) span:is([class*=tag],[class*=chip],[class*=badge],[class*=pill]){background-color:var(--lt-alt)!important;color:var(--lt-ink)!important;border-color:var(--lt-border)!important}
/* links + buttons */
html body main:not(#_) a:where(:not([class*=btn]):not([class*=button]):not([class*=cta]):not([class*=primary])){color:var(--lt-link)}
html body main:not(#_) :is(nav,[class*=crumb],[class*=route]) a,html body main:not(#_) a[class*=route]{color:var(--lt-text)!important}
html body main:not(#_) :is(p,li,td,dd,.pm-related) a:not([class*=btn]):not([class*=button]):not([class*=cta]){color:var(--lt-link)!important}
html body main:not(#_) :is(.pm-text-link,.ghost,.pm-jump a){color:var(--lt-ink)!important}
html body main:not(#_) :is(.pm-button,.btn--primary,.btn:not(.ghost),button[type=submit],a[class*=primary],a[class$=-btn],a.avq-btn,a[class*=button]:not([class*=link]),.new5-cta,.pending-button,.nx-ai-seo-proof__cta,a[class*=cta]:not([class*=link]),.lh-button){background:var(--lt-btn)!important;color:var(--lt-btn-c)!important;border:1px solid transparent!important;border-radius:8px!important;font-weight:700!important;box-shadow:var(--lt-btn-sh)!important}
html body main:not(#_) :is(.pm-button,.btn--primary,.btn,button[type=submit],.new5-cta,.pending-button,a[class*=cta]) *{color:inherit!important}
/* lead form fields */
html body main:not(#_) :is(input:not([type=checkbox]):not([type=radio]):not([type=hidden]):not([type=submit]),select,textarea){background:var(--lt-field)!important;color:var(--lt-ink)!important;border:1px solid var(--lt-field-b)!important;border-radius:6px!important}
html body main:not(#_) :is(input,textarea)::placeholder{color:var(--lt-muted)!important}
html body main:not(#_) :is(.fld__err,.req){color:#ff8f8f!important}
html:not(.dark) body main:not(#_) :is(.fld__err,.req){color:#b02f27!important}
html.dark body main:not(#_) select option{background:#100e28;color:#d6daf0}
/* illustrations drawn for a light page: keep them readable on dark */
html.dark body main:not(#_) :is(.pm-art,.hero-art,.lp-photo,figure) :is(svg,img){border-radius:10px}
html.dark body main:not(#_) .nx-ai-seo-card--visual{background-color:#100e28!important}
/* mobile sticky enquiry bar (outside main) */
html body :is(#lpmb,.mbar,.lp-sticky):not(#_){background:var(--lt-card)!important;color:var(--lt-ink)!important;border-color:var(--lt-border)!important;font-family:"DM Sans",Arial,sans-serif!important}
html body :is(#lpmb,.mbar,.lp-sticky):not(#_) :is(a,button){background:var(--lt-btn)!important;color:var(--lt-btn-c)!important;border-radius:8px!important;font-family:inherit!important}

/* same rules in a cascade layer declared before the page's own @layer theme, so they also beat layered !important */
@layer lpt{
/* lp-theme.css — designanddevelopment.in. design-match-qa 2026-10-27.
   Maps every CMS landing-page template (premium-page / g1221-page / nx-page / new5 / pending / b2 / q816 / ux1221)
   onto the site's own tokens. Dark is the site default (html.dark set by #lpt-theme, same key as the app:
   localStorage dd-learnhub-theme); light mode follows the site's light palette. */
:root{--lt-bg:#fff;--lt-alt:#f7f7fa;--lt-card:#fff;--lt-ink:#272235;--lt-text:#575563;--lt-muted:#6d6a7a;--lt-border:#e7e5ef;--lt-field:#fff;--lt-field-b:#d9d6e4;--lt-accent:#7258dc;--lt-link:#6247d0;--lt-btn:linear-gradient(115deg,#7258dc,#9a61dc);--lt-btn-c:#fff;--lt-btn-sh:0 3px 0 rgba(98,71,208,.25);--lt-chip:#f3f1fa}
html.dark{--lt-bg:#050520;--lt-alt:#0b0a26;--lt-card:#1a1833;--lt-ink:#d6daf0;--lt-text:#a7accd;--lt-muted:#8d92b5;--lt-border:#24203d;--lt-field:#100e28;--lt-field-b:#36305a;--lt-accent:#9382ff;--lt-link:#b9adff;--lt-btn:linear-gradient(114deg,#b26ef7,#ff71bf 46.5%,#ffbd7a);--lt-btn-c:#1a0b24;--lt-btn-sh:0 3px 0 rgba(130,78,165,.4);--lt-chip:rgba(16,16,40,.69)}
html body{background:var(--lt-bg)!important}
/* site header: the template hard-codes the dark bar; give light mode the site's light bar */
html:not(.dark) body .lh-header{background:rgba(255,255,255,.95)!important;border-bottom:1px solid var(--lt-border)}
html body main:not(#_){--p-accent:var(--lt-accent)!important;--p-ink:var(--lt-ink)!important;--p-surface:var(--lt-alt)!important;--p-bg:var(--lt-bg)!important;--p-muted:var(--lt-text)!important;--n-bg:var(--lt-bg)!important;--n-accent:var(--lt-accent)!important;--n-ink:var(--lt-ink)!important;--n-muted:var(--lt-text)!important;--nx-ink:var(--lt-ink)!important;--nx-paper:var(--lt-bg)!important;--nx-accent:var(--lt-accent)!important;--nx-soft:var(--lt-alt)!important;--ux-accent:var(--lt-accent)!important;--ux-ink:var(--lt-ink)!important;--ux-surface:var(--lt-bg)!important;--lpfx-accent:var(--lt-accent)!important;
  background:var(--lt-bg)!important;color:var(--lt-text)!important;font-family:"DM Sans",Arial,sans-serif!important}
html body main:not(#_) :is(h1,h2,h3,h4,h5,h6,p,li,a,span,em,strong,b,label,input,select,textarea,button,td,th,small,figcaption,summary,dt,dd,blockquote,legend,div,section,article){font-family:"DM Sans",Arial,sans-serif!important}
html body main:not(#_) :is(h1,h2,h3,h4,h5,h6,strong,b,th,summary,dt,legend){color:var(--lt-ink)!important}
html body main:not(#_) :is(h1,h2){font-weight:700!important}
html body main:not(#_) :is(p,li,td,figcaption,small,dd,blockquote,label){color:var(--lt-text)!important}
html body main:not(#_) span:where(:not([class*=btn]):not([class*=button]):not([class*=kicker]):not([class*=eyebrow])){color:inherit}
html body main:not(#_) :is([class*=kicker],[class*=eyebrow],.tag,.pm-step span,.lpfx-stepno,.lpfx-rotator){color:var(--lt-link)!important}
html body main:not(#_) :is([class*=deck],[class*=lede],[class*=subtitle],[class*=intro]:not(section):not(div:has(h1,h2)),[class*=description],[class*=summary]:not(summary)){color:var(--lt-text)!important}
/* surfaces: everything flat on the page background, then the site's card + alt-section treatment */
html body main:not(#_) :is(section,div,article,aside,nav,figure,table,thead,tbody,tr,th,td,details,form,blockquote,ul,ol,li,dl,fieldset){background-color:transparent!important}
html body main:not(#_) :is(.pm-hero,.pm-tint,.pm-final,.pm-jump,.nx-ai-seo-proof,.q816:nth-of-type(even),th){background-color:var(--lt-alt)!important}
html body main:not(#_) :is(article,[class*=card]:not([class*=cards]),.pm-form,.pm-why,.pm-table-wrap,details,blockquote,.q816-card,.new5-enquiry,.pending-form,.existing-form-box,[class*=-form]:not(form)){background-color:var(--lt-card)!important;border-color:var(--lt-border)!important;box-shadow:none!important}
html body main:not(#_) :is(article,[class*=card]:not([class*=cards]),.pm-form,.q816-card,details){border-radius:10px}
html body main:not(#_) *{border-color:var(--lt-border)}
html body main:not(#_) :is(.pm-why,.pm-step,.lpfx-process){border-color:var(--lt-accent)!important}
html body main:not(#_) .pm-why{background-color:transparent!important}
html body main:not(#_) span:is([class*=tag],[class*=chip],[class*=badge],[class*=pill]){background-color:var(--lt-alt)!important;color:var(--lt-ink)!important;border-color:var(--lt-border)!important}
/* links + buttons */
html body main:not(#_) a:where(:not([class*=btn]):not([class*=button]):not([class*=cta]):not([class*=primary])){color:var(--lt-link)}
html body main:not(#_) :is(nav,[class*=crumb],[class*=route]) a,html body main:not(#_) a[class*=route]{color:var(--lt-text)!important}
html body main:not(#_) :is(p,li,td,dd,.pm-related) a:not([class*=btn]):not([class*=button]):not([class*=cta]){color:var(--lt-link)!important}
html body main:not(#_) :is(.pm-text-link,.ghost,.pm-jump a){color:var(--lt-ink)!important}
html body main:not(#_) :is(.pm-button,.btn--primary,.btn:not(.ghost),button[type=submit],a[class*=primary],a[class$=-btn],a.avq-btn,a[class*=button]:not([class*=link]),.new5-cta,.pending-button,.nx-ai-seo-proof__cta,a[class*=cta]:not([class*=link]),.lh-button){background:var(--lt-btn)!important;color:var(--lt-btn-c)!important;border:1px solid transparent!important;border-radius:8px!important;font-weight:700!important;box-shadow:var(--lt-btn-sh)!important}
html body main:not(#_) :is(.pm-button,.btn--primary,.btn,button[type=submit],.new5-cta,.pending-button,a[class*=cta]) *{color:inherit!important}
/* lead form fields */
html body main:not(#_) :is(input:not([type=checkbox]):not([type=radio]):not([type=hidden]):not([type=submit]),select,textarea){background:var(--lt-field)!important;color:var(--lt-ink)!important;border:1px solid var(--lt-field-b)!important;border-radius:6px!important}
html body main:not(#_) :is(input,textarea)::placeholder{color:var(--lt-muted)!important}
html body main:not(#_) :is(.fld__err,.req){color:#ff8f8f!important}
html:not(.dark) body main:not(#_) :is(.fld__err,.req){color:#b02f27!important}
html.dark body main:not(#_) select option{background:#100e28;color:#d6daf0}
/* illustrations drawn for a light page: keep them readable on dark */
html.dark body main:not(#_) :is(.pm-art,.hero-art,.lp-photo,figure) :is(svg,img){border-radius:10px}
html.dark body main:not(#_) .nx-ai-seo-card--visual{background-color:#100e28!important}
/* mobile sticky enquiry bar (outside main) */
html body :is(#lpmb,.mbar,.lp-sticky):not(#_){background:var(--lt-card)!important;color:var(--lt-ink)!important;border-color:var(--lt-border)!important;font-family:"DM Sans",Arial,sans-serif!important}
html body :is(#lpmb,.mbar,.lp-sticky):not(#_) :is(a,button){background:var(--lt-btn)!important;color:var(--lt-btn-c)!important;border-radius:8px!important;font-family:inherit!important}

}