/*
Theme Name: DigitalContent Plus
Theme URI: https://digitalcontentplus.com
Author: Christina Majaski
Author URI: https://christinamajaski.com
Description: Marketing theme for DigitalContentPlus — local websites, SEO, GEO (Generative Engine Optimization) and AI for small & local businesses. Comes with a portfolio of the ByTheMath network (owned & operated) and a Shopify/ecommerce sample (North Side Style & Fashion).
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.6
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: digitalcontentplus
*/

/* ===================================================================
   TOKENS
=================================================================== */
:root{
  --ink:#0d1220;
  --navy:#0a0f1f;
  --navy-2:#141a33;
  --indigo:#5b4be6;
  --indigo-dark:#4736c9;
  --violet:#8b5cf6;
  --cyan:#22d3ee;
  --coral:#ff6b5e;
  --amber:#ffb347;
  --bg:#ffffff;
  --soft:#f5f6fb;
  --soft-2:#eef0f8;
  --card:#ffffff;
  --border:#e7e9f2;
  --line:#f0f1f7;
  --text:#20283a;
  --muted:#5b6576;
  --faint:#8a93a6;
  --radius:16px;
  --radius-sm:11px;
  --shadow:0 18px 50px -22px rgba(20,26,51,.28);
  --shadow-sm:0 8px 26px -14px rgba(20,26,51,.22);
  --wrap:1160px;
}

/* ===================================================================
   BASE
=================================================================== */
*{box-sizing:border-box;}
html{scroll-behavior:smooth;scroll-padding-top:88px;}
body{
  margin:0;background:var(--bg);color:var(--text);
  font-family:'Figtree',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  font-size:16.5px;line-height:1.65;-webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4,.dcp-wordmark{font-family:'Sora','Figtree',system-ui,sans-serif;color:var(--ink);line-height:1.12;letter-spacing:-.02em;}
a{color:var(--indigo);text-decoration:none;}
a:hover{color:var(--indigo-dark);}
img{max-width:100%;height:auto;display:block;}
p{margin:0 0 16px;}
.dcp-wrap{max-width:var(--wrap);margin:0 auto;padding:0 26px;}
.dcp-eyebrow{display:inline-flex;align-items:center;gap:8px;font-family:'Sora',sans-serif;font-size:12px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;color:var(--indigo);margin-bottom:14px;}
.dcp-eyebrow.on-dark{color:var(--cyan);}
.dcp-section{padding:86px 0;}
.dcp-section.tight{padding:64px 0;}
.dcp-section-head{max-width:680px;margin-bottom:44px;}
.dcp-section-head.center{margin-left:auto;margin-right:auto;text-align:center;}
.dcp-section-head h1,.dcp-section-head h2{font-size:clamp(28px,3.6vw,40px);font-weight:800;margin:0 0 14px;}
.dcp-section-head p{font-size:17.5px;color:var(--muted);margin:0;}
.dcp-soft{background:var(--soft);}

/* ===================================================================
   BUTTONS
=================================================================== */
.dcp-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:9px;
  font-family:'Sora',sans-serif;font-size:15px;font-weight:700;
  padding:14px 26px;border-radius:12px;border:0;cursor:pointer;
  background:linear-gradient(120deg,var(--indigo),var(--violet));color:#fff;
  box-shadow:0 12px 28px -12px rgba(91,75,230,.7);transition:transform .16s,box-shadow .16s,filter .16s;
}
.dcp-btn:hover{color:#fff;transform:translateY(-2px);box-shadow:0 18px 36px -14px rgba(91,75,230,.8);filter:saturate(1.08);}
.dcp-btn.ghost{background:transparent;color:var(--ink);border:1.6px solid var(--border);box-shadow:none;}
.dcp-btn.ghost:hover{border-color:var(--indigo);color:var(--indigo);transform:translateY(-2px);}
.dcp-btn.on-dark{background:#fff;color:var(--ink);box-shadow:0 12px 30px -14px rgba(0,0,0,.5);}
.dcp-btn.on-dark:hover{color:var(--indigo-dark);}
.dcp-btn.ghost.on-dark{background:transparent;color:#fff;border-color:rgba(255,255,255,.32);}
.dcp-btn.ghost.on-dark:hover{border-color:var(--cyan);color:var(--cyan);}
.dcp-btn.coral{background:linear-gradient(120deg,var(--coral),var(--amber));box-shadow:0 12px 28px -12px rgba(255,107,94,.7);}

/* ===================================================================
   HEADER / NAV
=================================================================== */
.dcp-header{position:sticky;top:0;z-index:60;background:rgba(255,255,255,.86);backdrop-filter:saturate(1.4) blur(12px);border-bottom:1px solid var(--line);}
.dcp-header-inner{display:flex;align-items:center;gap:22px;height:72px;}
.dcp-wordmark{display:flex;align-items:center;gap:9px;font-size:20px;font-weight:800;color:var(--ink);letter-spacing:-.03em;}
.dcp-wordmark .plus{display:inline-grid;place-items:center;width:26px;height:26px;border-radius:8px;background:linear-gradient(135deg,var(--indigo),var(--violet));color:#fff;font-size:19px;line-height:1;}
.dcp-nav{margin-left:auto;display:flex;align-items:center;gap:26px;}
.dcp-nav ul{list-style:none;display:flex;gap:26px;margin:0;padding:0;}
.dcp-nav a{font-size:14.5px;font-weight:600;color:var(--text);}
.dcp-nav a:hover{color:var(--indigo);}
.dcp-header .dcp-btn{padding:11px 20px;}
.dcp-burger{display:none;margin-left:auto;background:none;border:1.5px solid var(--border);border-radius:9px;width:42px;height:38px;cursor:pointer;color:var(--ink);align-items:center;justify-content:center;}
.dcp-burger svg{width:20px;height:20px;}

/* ===================================================================
   HERO
=================================================================== */
.dcp-hero{position:relative;overflow:hidden;background:radial-gradient(1100px 520px at 80% -10%,rgba(139,92,246,.32),transparent 60%),radial-gradient(900px 500px at 5% 10%,rgba(34,211,238,.16),transparent 55%),linear-gradient(160deg,#0b1022,#141a33 60%,#1a1140);color:#fff;}
.dcp-hero-inner{padding:96px 0 104px;max-width:820px;}
.dcp-hero h1{color:#fff;font-size:clamp(34px,5.2vw,60px);font-weight:800;margin:0 0 20px;}
.dcp-hero h1 .grad{background:linear-gradient(100deg,var(--cyan),var(--violet));-webkit-background-clip:text;background-clip:text;color:transparent;}
.dcp-hero p.lead{font-size:clamp(17px,2vw,20.5px);color:rgba(255,255,255,.82);max-width:660px;margin:0 0 30px;}
.dcp-hero-cta{display:flex;flex-wrap:wrap;gap:14px;margin-bottom:34px;}
.dcp-chips{display:flex;flex-wrap:wrap;gap:10px;}
.dcp-chip{display:inline-flex;align-items:center;gap:7px;font-size:13px;font-weight:600;color:rgba(255,255,255,.9);background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.16);padding:7px 13px;border-radius:999px;}
.dcp-chip svg{width:14px;height:14px;color:var(--cyan);}

/* ===================================================================
   LOGO / PUBLICATION STRIP
=================================================================== */
.dcp-logos{border-bottom:1px solid var(--line);background:#fff;}
.dcp-logos .dcp-wrap{padding-top:30px;padding-bottom:30px;}
.dcp-logos p{text-align:center;font-family:'Sora',sans-serif;font-size:12px;letter-spacing:.13em;text-transform:uppercase;color:var(--faint);font-weight:700;margin:0 0 16px;}
.dcp-logo-row{display:flex;flex-wrap:wrap;justify-content:center;gap:14px 30px;}
.dcp-logo-row span{font-family:'Sora',sans-serif;font-weight:700;font-size:16px;color:#96a0b4;letter-spacing:-.01em;transition:color .18s;}
.dcp-logo-row span:hover{color:var(--ink);}

/* ===================================================================
   GEO FEATURE
=================================================================== */
.dcp-geo{background:linear-gradient(165deg,#0b1022,#171d38);color:#fff;position:relative;overflow:hidden;}
.dcp-geo::before{content:"";position:absolute;inset:0;background:radial-gradient(700px 400px at 90% 20%,rgba(34,211,238,.18),transparent 60%);pointer-events:none;}
.dcp-geo .dcp-wrap{position:relative;display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:center;}
.dcp-geo h2{color:#fff;font-size:clamp(27px,3.4vw,38px);font-weight:800;margin:0 0 16px;}
.dcp-geo h2 .grad{background:linear-gradient(100deg,var(--cyan),var(--violet));-webkit-background-clip:text;background-clip:text;color:transparent;}
.dcp-geo p{color:rgba(255,255,255,.8);font-size:17px;}
.dcp-geo-card{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.13);border-radius:var(--radius);padding:26px;}
.dcp-geo-card .q{font-family:'Sora',sans-serif;font-weight:700;color:#fff;font-size:15.5px;margin-bottom:14px;display:flex;gap:10px;align-items:flex-start;}
.dcp-geo-card .q .dot{flex:none;margin-top:5px;width:9px;height:9px;border-radius:50%;background:var(--cyan);box-shadow:0 0 0 4px rgba(34,211,238,.18);}
.dcp-geo-answer{background:rgba(139,92,246,.14);border:1px solid rgba(139,92,246,.34);border-radius:12px;padding:15px 16px;font-size:14.5px;color:rgba(255,255,255,.92);line-height:1.55;}
.dcp-geo-answer b{color:#fff;}
.dcp-geo-cite{margin-top:12px;font-size:12.5px;color:var(--cyan);font-weight:600;}

/* ===================================================================
   SERVICES GRID
=================================================================== */
.dcp-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;}
.dcp-card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:28px 26px;transition:transform .18s,box-shadow .18s,border-color .18s;}
.dcp-card:hover{transform:translateY(-4px);box-shadow:var(--shadow);border-color:#dcdff0;}
.dcp-ico{width:48px;height:48px;border-radius:12px;display:grid;place-items:center;margin-bottom:18px;background:linear-gradient(135deg,rgba(91,75,230,.13),rgba(139,92,246,.13));color:var(--indigo);}
.dcp-ico svg{width:24px;height:24px;}
.dcp-card h3{font-size:19px;font-weight:700;margin:0 0 9px;}
.dcp-card p{font-size:15px;color:var(--muted);margin:0;}
.dcp-card .tag{display:inline-block;margin-top:14px;font-size:11.5px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--violet);}

/* ===================================================================
   WORK / PORTFOLIO
=================================================================== */
.dcp-work-group-label{font-family:'Sora',sans-serif;font-size:12.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--faint);margin:0 0 18px;display:flex;align-items:center;gap:12px;}
.dcp-work-group-label::after{content:"";flex:1;height:1px;background:var(--border);}
.dcp-work-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-bottom:44px;}
.dcp-work-grid.two{grid-template-columns:repeat(2,1fr);margin-bottom:0;}
.dcp-work{display:flex;flex-direction:column;background:var(--card);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;transition:transform .18s,box-shadow .18s;}
.dcp-work:hover{transform:translateY(-4px);box-shadow:var(--shadow);}
.dcp-work-top{padding:22px 24px 0;}
.dcp-work-kicker{display:inline-flex;align-items:center;gap:7px;font-size:11.5px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--indigo);background:var(--soft);border:1px solid var(--border);border-radius:999px;padding:5px 11px;margin-bottom:14px;}
.dcp-work h3{font-size:20px;font-weight:800;margin:0 0 4px;}
.dcp-work .url{font-size:13px;color:var(--faint);font-weight:600;margin-bottom:12px;}
.dcp-work p{font-size:14.5px;color:var(--muted);padding:0 24px;margin:0 0 18px;}
.dcp-work-foot{margin-top:auto;padding:16px 24px;border-top:1px solid var(--line);display:flex;flex-wrap:wrap;gap:8px;}
.dcp-pill{font-size:11.5px;font-weight:600;color:var(--text);background:var(--soft-2);border-radius:6px;padding:4px 9px;}
.dcp-work.shop{border-color:#f2d9c9;}
.dcp-work.shop .dcp-work-kicker{color:#c2410c;background:#fff5ee;border-color:#f6ddc9;}

/* ===================================================================
   PROCESS
=================================================================== */
.dcp-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;}
.dcp-step{position:relative;padding:26px 22px;border:1px solid var(--border);border-radius:var(--radius);background:#fff;}
.dcp-step .n{font-family:'Sora',sans-serif;font-weight:800;font-size:15px;width:34px;height:34px;border-radius:9px;display:grid;place-items:center;background:linear-gradient(135deg,var(--indigo),var(--violet));color:#fff;margin-bottom:16px;}
.dcp-step h3{font-size:17px;font-weight:700;margin:0 0 7px;}
.dcp-step p{font-size:14px;color:var(--muted);margin:0;}

/* ===================================================================
   PACKAGES
=================================================================== */
.dcp-pkgs{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;align-items:stretch;}
.dcp-pkg{display:flex;flex-direction:column;background:#fff;border:1px solid var(--border);border-radius:var(--radius);padding:30px 26px;}
.dcp-pkg.featured{border:2px solid var(--indigo);box-shadow:var(--shadow);position:relative;}
.dcp-pkg.featured .badge{position:absolute;top:-13px;left:26px;background:linear-gradient(120deg,var(--indigo),var(--violet));color:#fff;font-family:'Sora',sans-serif;font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:5px 12px;border-radius:999px;}
.dcp-pkg h3{font-size:19px;font-weight:800;margin:0 0 6px;}
.dcp-pkg .price{font-family:'Sora',sans-serif;font-size:30px;font-weight:800;color:var(--ink);margin:6px 0 4px;}
.dcp-pkg .price small{font-size:14px;font-weight:600;color:var(--faint);}
.dcp-pkg .sub{font-size:14px;color:var(--muted);margin:0 0 18px;}
.dcp-pkg ul{list-style:none;margin:0 0 24px;padding:0;}
.dcp-pkg li{position:relative;padding-left:26px;font-size:14.5px;color:var(--text);margin-bottom:11px;}
.dcp-pkg li::before{content:"";position:absolute;left:0;top:6px;width:16px;height:16px;border-radius:50%;background:rgba(91,75,230,.12);}
.dcp-pkg li::after{content:"";position:absolute;left:5px;top:10px;width:5px;height:8px;border-right:2px solid var(--indigo);border-bottom:2px solid var(--indigo);transform:rotate(40deg);}
.dcp-pkg .dcp-btn{margin-top:auto;width:100%;}

/* ===================================================================
   STATS
=================================================================== */
.dcp-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;text-align:center;}
.dcp-stat .num{font-family:'Sora',sans-serif;font-size:clamp(30px,4vw,44px);font-weight:800;background:linear-gradient(120deg,var(--indigo),var(--violet));-webkit-background-clip:text;background-clip:text;color:transparent;}
.dcp-stat .lbl{font-size:14px;color:var(--muted);margin-top:4px;}

/* ===================================================================
   ABOUT
=================================================================== */
.dcp-about .dcp-wrap{display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:center;}
.dcp-about h2{font-size:clamp(26px,3.2vw,36px);font-weight:800;margin:0 0 16px;}
.dcp-about p{font-size:16.5px;color:var(--muted);}
.dcp-about .sig{font-family:'Sora',sans-serif;font-weight:700;color:var(--ink);margin-top:8px;}
.dcp-about-card{background:linear-gradient(160deg,#0b1022,#1a1140);border-radius:var(--radius);padding:34px;color:#fff;}
.dcp-about-card h3{color:#fff;font-size:20px;margin:0 0 6px;}
.dcp-about-card .role{color:var(--cyan);font-weight:600;font-size:14px;margin-bottom:18px;}
.dcp-about-card ul{list-style:none;margin:0;padding:0;}
.dcp-about-card li{font-size:14.5px;color:rgba(255,255,255,.82);padding:9px 0;border-top:1px solid rgba(255,255,255,.1);display:flex;gap:10px;}
.dcp-about-card li:first-child{border-top:0;}
.dcp-about-card li b{color:#fff;}

/* ===================================================================
   CONTACT
=================================================================== */
.dcp-contact{background:linear-gradient(165deg,#0b1022,#141a33 55%,#1a1140);color:#fff;}
.dcp-contact .dcp-wrap{display:grid;grid-template-columns:.9fr 1.1fr;gap:56px;}
.dcp-contact h2{color:#fff;font-size:clamp(28px,3.6vw,40px);font-weight:800;margin:0 0 16px;}
.dcp-contact p{color:rgba(255,255,255,.8);font-size:17px;}
.dcp-contact .email{display:inline-flex;align-items:center;gap:9px;font-family:'Sora',sans-serif;font-weight:700;color:#fff;font-size:17px;margin:10px 0 22px;}
.dcp-contact .socials{display:flex;gap:12px;}
.dcp-contact .socials a{width:40px;height:40px;border-radius:10px;display:grid;place-items:center;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);color:#fff;}
.dcp-contact .socials a:hover{background:var(--indigo);border-color:var(--indigo);color:#fff;}
.dcp-form{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.14);border-radius:var(--radius);padding:28px;}
.dcp-form label{display:block;font-size:13px;font-weight:600;color:rgba(255,255,255,.85);margin:0 0 6px;}
.dcp-field{margin-bottom:16px;}
.dcp-form input,.dcp-form select,.dcp-form textarea{
  width:100%;background:rgba(255,255,255,.95);border:1px solid rgba(255,255,255,.2);border-radius:10px;
  padding:12px 14px;font-family:inherit;font-size:15px;color:var(--ink);
}
.dcp-form textarea{min-height:110px;resize:vertical;}
.dcp-form .row{display:grid;grid-template-columns:1fr 1fr;gap:14px;}
.dcp-form .dcp-btn{width:100%;margin-top:6px;}
.dcp-form .fineprint{font-size:12px;color:rgba(255,255,255,.55);margin:12px 0 0;text-align:center;}

/* ===================================================================
   FOOTER
=================================================================== */
.dcp-footer{background:#070a15;color:rgba(255,255,255,.62);padding:56px 0 30px;}
.dcp-footer .dcp-wrap{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:36px;}
.dcp-footer .dcp-wordmark{color:#fff;margin-bottom:12px;}
.dcp-footer p{font-size:14px;max-width:300px;}
.dcp-footer h4{font-family:'Sora',sans-serif;font-size:13px;letter-spacing:.06em;text-transform:uppercase;color:#fff;margin:0 0 14px;}
.dcp-footer ul{list-style:none;margin:0;padding:0;}
.dcp-footer li{margin-bottom:9px;}
.dcp-footer a{color:rgba(255,255,255,.62);font-size:14px;}
.dcp-footer a:hover{color:#fff;}
.dcp-footer-bottom{border-top:1px solid rgba(255,255,255,.09);margin-top:40px;padding-top:22px;font-size:13px;color:rgba(255,255,255,.42);display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;}

/* ===================================================================
   RESPONSIVE
=================================================================== */
@media(max-width:940px){
  .dcp-grid,.dcp-work-grid,.dcp-work-grid.two,.dcp-steps,.dcp-pkgs{grid-template-columns:1fr 1fr;}
  .dcp-stats{grid-template-columns:1fr 1fr;}
  .dcp-geo .dcp-wrap,.dcp-about .dcp-wrap,.dcp-contact .dcp-wrap{grid-template-columns:1fr;gap:34px;}
  .dcp-footer .dcp-wrap{grid-template-columns:1fr 1fr;}
}
@media(max-width:680px){
  .dcp-nav{display:none;}
  .dcp-nav.open{display:flex;flex-direction:column;position:absolute;top:72px;left:0;right:0;background:#fff;border-bottom:1px solid var(--border);padding:18px 26px;gap:16px;align-items:flex-start;box-shadow:var(--shadow-sm);}
  .dcp-nav.open ul{flex-direction:column;gap:14px;}
  .dcp-burger{display:flex;}
  .dcp-header .dcp-nav.open .dcp-btn{padding:12px 22px;}
  .dcp-grid,.dcp-work-grid,.dcp-work-grid.two,.dcp-steps,.dcp-pkgs,.dcp-stats,.dcp-footer .dcp-wrap,.dcp-form .row{grid-template-columns:1fr;}
  .dcp-section{padding:60px 0;}
  .dcp-hero-inner{padding:70px 0 76px;}
}

/* Page width (2026-10-11): every page uses the full .dcp-wrap (1160px, as on the home page, header and footer);
   the inline 820px/760px caps on inner pages were removed. Long-form article text keeps a readable measure,
   left-aligned with the site column. */
.dcp-article{max-width:760px;}
.dcp-post-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:22px;}
.dcp-post-grid .dcp-card{margin-bottom:0!important;}
/* WordPress "alignfull" blocks inside page content stretched to 100vw and pushed the page wider than the window. */
.dcp-page-content .alignfull{margin-left:0!important;margin-right:0!important;width:auto!important;max-width:100%!important;}
/* Inner pages' content markup carries its own .wrap (1180px + 32px padding) inside .dcp-wrap: drop the doubled padding
   so their edges line up with the header and the home page. */
.dcp-page-content .wrap{max-width:none;padding-left:0;padding-right:0;}
/* Header: the full menu (logo + 5 links + button) needs ~800px, so tablets (681-880px) get the menu button too;
   at 768px the menu used to push the page 24px wider than the screen. Same rules as the 680px block. */
@media(max-width:880px){
  .dcp-nav{display:none;}
  .dcp-nav.open{display:flex;flex-direction:column;position:absolute;top:72px;left:0;right:0;background:#fff;border-bottom:1px solid var(--border);padding:18px 26px;gap:16px;align-items:flex-start;box-shadow:var(--shadow-sm);}
  .dcp-nav.open ul{flex-direction:column;gap:14px;}
  .dcp-burger{display:flex;}
  .dcp-header .dcp-nav.open .dcp-btn{padding:12px 22px;}
}