/* =========================================================================
   PrinterDojo — MODERN v2 design layer (loaded after enhancements.css).
   Editorial-premium refresh: Sora headings, glassmorphism header, animated
   hero, refined gradients, modern cards/buttons, tighter rhythm.
   ========================================================================= */

:root{
  --font-heading: 'Sora', 'Inter', system-ui, sans-serif;
  --font-body: 'Inter', system-ui, sans-serif;
  /* Modern teal->cyan brand ramp + gradients */
  --grad-brand: linear-gradient(115deg, #0F766E 0%, #14B8A6 55%, #06B6D4 100%);
  --grad-brand-soft: linear-gradient(115deg, color-mix(in srgb,#0F766E 14%,#fff), color-mix(in srgb,#06B6D4 14%,#fff));
  --grad-ink: radial-gradient(120% 120% at 15% 0%, #103a3a 0%, #0b1520 55%, #070c12 100%);
  --ring: color-mix(in srgb, #14B8A6 45%, transparent);
  --shadow-md: 0 12px 34px -12px rgba(15,32,39,.28);
  --shadow-lg: 0 30px 60px -22px rgba(15,32,39,.35);
  --radius-lg: 18px; --radius-xl: 24px;
  --header-h: 74px;
}
body{ -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; }
h1,h2,h3,.hero__title,.section__title,.single__title,.page-article__title,.archive-hero__title{
  font-family:var(--font-heading); letter-spacing:-.02em; font-weight:700;
}

/* ---------------- HEADER: glassmorphism, premium ---------------- */
.site-header{
  position:sticky; top:0; z-index:100; background:rgba(255,255,255,.66);
  backdrop-filter:blur(18px) saturate(1.5); -webkit-backdrop-filter:blur(18px) saturate(1.5);
  border-bottom:1px solid rgba(17,24,32,.06);
  transition:background .3s ease, box-shadow .3s ease, border-color .3s ease;
}
.site-header--scrolled{ background:rgba(255,255,255,.86); box-shadow:0 10px 30px -18px rgba(15,32,39,.4); border-bottom-color:rgba(17,24,32,.09); }
.site-header__inner{ min-height:var(--header-h); display:flex; align-items:center; gap:1.25rem; }
.brand{ margin-right:auto; }
.brand__logo,.brand__text{ font-family:var(--font-heading); font-weight:800; letter-spacing:-.03em; font-size:1.4rem; color:var(--neutral-900); text-decoration:none; display:inline-flex; align-items:center; gap:.5rem; }
.brand__mark{ width:30px; height:30px; border-radius:9px; background:var(--grad-brand); box-shadow:0 6px 16px -6px var(--ring); display:inline-block; }
.custom-logo-link img,.brand img{ max-height:40px; width:auto; }

.primary-nav__list{ display:flex; align-items:center; gap:.15rem; list-style:none; margin:0; padding:0; }
.primary-nav__list .menu-item{ margin:0; }
.primary-nav__list a{
  display:inline-flex; align-items:center; padding:.5rem .8rem; border-radius:10px;
  font-family:var(--font-heading); font-weight:600; font-size:.95rem; color:var(--neutral-700);
  text-decoration:none; position:relative; transition:color .2s ease, background .2s ease;
}
.primary-nav__list a:hover{ color:var(--primary-700); background:color-mix(in srgb,#14B8A6 10%,transparent); }
.primary-nav__list .current-menu-item>a,.primary-nav__list .current_page_item>a,.primary-nav__list .current-menu-parent>a{ color:var(--primary-700); }
.primary-nav__list .current-menu-item>a::after,.primary-nav__list .current_page_item>a::after{
  content:""; position:absolute; left:.8rem; right:.8rem; bottom:.28rem; height:2px; border-radius:2px; background:var(--grad-brand);
}
.header-actions{ display:flex; align-items:center; gap:.4rem; }
.nav-search{
  width:42px; height:42px; border-radius:12px; display:grid; place-items:center; cursor:pointer;
  color:var(--neutral-700); background:color-mix(in srgb,#0f172a 5%,transparent); border:1px solid rgba(17,24,32,.08);
  transition:all .2s ease;
}
.nav-search:hover{ color:#fff; background:var(--grad-brand); border-color:transparent; transform:translateY(-1px); }
.header-search{ border-top:1px solid rgba(17,24,32,.06); background:rgba(255,255,255,.9); backdrop-filter:blur(16px); padding:1rem 0; animation:pd-slidedown .28s ease; }
@keyframes pd-slidedown{ from{opacity:0; transform:translateY(-8px);} to{opacity:1; transform:none;} }
.header-search .search-form,.header-search form{ display:flex; gap:.5rem; max-width:640px; margin-inline:auto; }
.header-search input[type=search]{ flex:1; padding:.85rem 1.1rem; border:1.5px solid var(--border-strong); border-radius:12px; font-size:1rem; }
.header-search input[type=search]:focus{ outline:none; border-color:var(--brand-primary); box-shadow:0 0 0 4px var(--ring); }

/* nav-toggle animate to X */
.nav-toggle{ width:44px; height:44px; border-radius:12px; display:none; place-items:center; gap:5px; flex-direction:column; cursor:pointer; background:color-mix(in srgb,#0f172a 5%,transparent); border:1px solid rgba(17,24,32,.08); }
.nav-toggle__bar{ width:20px; height:2px; border-radius:2px; background:var(--neutral-800); transition:transform .3s ease, opacity .2s ease; }
.nav-toggle[aria-expanded="true"] .nav-toggle__bar:nth-child(1){ transform:translateY(7px) rotate(45deg); }
.nav-toggle[aria-expanded="true"] .nav-toggle__bar:nth-child(2){ opacity:0; }
.nav-toggle[aria-expanded="true"] .nav-toggle__bar:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }

@media (max-width:1024px){ .primary-nav__list{ gap:0; } .primary-nav__list a{ padding:.5rem .6rem; font-size:.9rem; } }
@media (max-width:900px){
  .primary-nav{ display:none; }
  .nav-toggle{ display:flex; }
}

/* ---------------- MOBILE DRAWER: premium slide-in ----------------
   NOTE: theme.css also defines .mobile-drawer as a 360px right panel with
   background:var(--bg) + transform:translateX(100%). We reset those leaked
   props so THIS full-screen overlay model (transparent scrim + white panel)
   is the single source of truth. */
.mobile-drawer{ position:fixed; inset:0; width:auto; z-index:1000; visibility:hidden; pointer-events:none;
  background:transparent; transform:none; box-shadow:none; padding:0; }
.mobile-drawer--open{ visibility:visible; pointer-events:auto; }
.mobile-drawer__backdrop{ position:absolute; inset:0; background:rgba(7,12,18,.5); backdrop-filter:blur(4px); opacity:0; transition:opacity .3s ease; }
.mobile-drawer--open .mobile-drawer__backdrop{ opacity:1; }
.mobile-drawer__panel{
  position:absolute; top:0; right:0; height:100%; width:min(86vw,360px); background:#fff;
  box-shadow:-20px 0 60px -20px rgba(7,12,18,.5); padding:1.25rem 1.25rem 2rem; overflow-y:auto;
  transform:translateX(100%); transition:transform .34s cubic-bezier(.4,0,.2,1); display:flex; flex-direction:column; gap:.5rem;
}
.mobile-drawer--open .mobile-drawer__panel{ transform:none; }
.mobile-drawer__close{ align-self:flex-end; width:40px; height:40px; border-radius:12px; border:1px solid var(--border); background:var(--bg-alt); font-size:1.5rem; line-height:1; cursor:pointer; color:var(--neutral-700); }
.mobile-drawer__list{ list-style:none; margin:.5rem 0 0; padding:0; display:grid; gap:.15rem; }
.mobile-drawer__list a{ display:flex; align-items:center; gap:.6rem; padding:.95rem 1rem; border-radius:12px; font-family:var(--font-heading); font-weight:600; font-size:1.05rem; color:var(--neutral-800); text-decoration:none; transition:background .2s ease, color .2s ease; }
.mobile-drawer__list a:hover,.mobile-drawer__list .current-menu-item>a{ background:var(--grad-brand-soft); color:var(--primary-800); }
.mobile-drawer__search{ margin-top:1rem; }
.mobile-drawer__search input[type=search]{ width:100%; padding:.85rem 1rem; border:1.5px solid var(--border-strong); border-radius:12px; }

/* ---------------- BUTTONS ---------------- */
.btn{ font-family:var(--font-heading); font-weight:600; border-radius:var(--radius-pill); transition:transform .2s ease, box-shadow .2s ease, filter .2s ease; }
.btn--primary{ background:var(--grad-brand); color:#fff; border:0; box-shadow:0 12px 26px -12px var(--ring); }
.btn--primary:hover{ transform:translateY(-2px); filter:brightness(1.06); box-shadow:0 18px 34px -14px var(--ring); color:#fff; }
.btn--ghost{ backdrop-filter:blur(6px); }

/* ---------------- SECTION HEADINGS ---------------- */
.section__eyebrow{ display:inline-flex; align-items:center; gap:.5rem; font-family:var(--font-heading); font-weight:700; font-size:.78rem; letter-spacing:.14em; text-transform:uppercase; color:var(--primary-700); }
.section__eyebrow::before{ width:1.6rem; height:2px; background:var(--grad-brand); border-radius:2px; }
.section__title{ font-size:clamp(1.7rem,1.2rem+1.8vw,2.5rem); }

/* ---------------- HERO: floating blobs + gradient accent ---------------- */
.hero{ position:relative; overflow:hidden; }
.hero__blob{ position:absolute; border-radius:50%; filter:blur(60px); opacity:.5; z-index:-2; mix-blend-mode:screen; animation:pd-float 16s ease-in-out infinite; }
.hero__blob--1{ width:420px; height:420px; background:#14B8A6; top:-120px; left:-80px; }
.hero__blob--2{ width:360px; height:360px; background:#06B6D4; bottom:-140px; right:8%; animation-delay:-5s; }
.hero__blob--3{ width:300px; height:300px; background:#F59E0B; top:20%; right:-100px; opacity:.35; animation-delay:-9s; }
@keyframes pd-float{ 0%,100%{ transform:translate(0,0) scale(1);} 33%{ transform:translate(30px,-24px) scale(1.08);} 66%{ transform:translate(-20px,18px) scale(.95);} }
.hero__title-accent{ background:linear-gradient(100deg,#5eead4,#22d3ee 60%,#fbbf24); -webkit-background-clip:text; background-clip:text; color:transparent; }
.hero__eyebrow{ background:rgba(255,255,255,.14); border:1px solid rgba(255,255,255,.28); backdrop-filter:blur(8px); border-radius:var(--radius-pill); padding:.45rem .95rem; font-family:var(--font-heading); }
.hero__badges{ list-style:none; display:flex; flex-wrap:wrap; gap:.35rem 1.1rem; padding:0; margin-top:1.4rem; }

/* ---------------- CARDS: modern hover ---------------- */
.post-card,.category-card,.featured-block__main,.pd-contact-card,.value-prop{ border-radius:var(--radius-lg); }
.post-card{ overflow:hidden; transition:transform .28s ease, box-shadow .28s ease; }
.post-card:hover{ transform:translateY(-6px); box-shadow:var(--shadow-lg); }
.post-card__media img,.category-card__media img{ transition:transform .5s cubic-bezier(.2,.6,.2,1); }
.post-card:hover .post-card__media img{ transform:scale(1.06); }
.post-card__badge,.cat-badge,.category-card__count{ font-family:var(--font-heading); font-weight:700; }

/* Scroll-reveal (JS toggles .is-visible) */
.reveal{ opacity:0; transform:translateY(18px); transition:opacity .6s cubic-bezier(.2,.6,.2,1), transform .6s cubic-bezier(.2,.6,.2,1); }
.reveal.is-visible{ opacity:1; transform:none; }
@media (prefers-reduced-motion:reduce){
  .reveal{ opacity:1 !important; transform:none !important; }
  .hero__blob{ animation:none; }
  *{ scroll-behavior:auto !important; }
}

/* ---------------- CATEGORIES HUB ---------------- */
.pd-cathub-page .wrap--narrow{ max-width:var(--container); }
.pd-cathub-page .entry-content{ max-width:none; }
.pd-cathub-page .entry-content > *{ max-width:100%; margin-inline:0; }
.pd-cathub{ display:grid; grid-template-columns:repeat(auto-fill,minmax(320px,1fr)); gap:1.25rem; margin-top:1.5rem; }
.pd-cathub__card{ display:flex; flex-direction:column; border-radius:var(--radius-lg); overflow:hidden; background:var(--bg-elevated); border:1px solid var(--border); box-shadow:var(--shadow-xs); text-decoration:none; transition:transform .28s ease, box-shadow .28s ease, border-color .28s ease; }
.pd-cathub__card:hover{ transform:translateY(-6px); box-shadow:var(--shadow-lg); border-color:var(--primary-300); }
.pd-cathub__media{ aspect-ratio:16/9; overflow:hidden; display:block; }
.pd-cathub__media img{ width:100%; height:100%; object-fit:cover; transition:transform .5s ease; }
.pd-cathub__card:hover .pd-cathub__media img{ transform:scale(1.06); }
.pd-cathub__body{ padding:1.25rem; display:grid; gap:.5rem; }
.pd-cathub__top{ display:flex; align-items:center; justify-content:space-between; gap:.75rem; }
.pd-cathub__name{ font-family:var(--font-heading); font-weight:700; font-size:1.25rem; color:var(--neutral-900); }
.pd-cathub__count{ font-size:.76rem; font-weight:700; color:var(--primary-700); background:var(--primary-50); padding:.25rem .6rem; border-radius:var(--radius-pill); white-space:nowrap; }
.pd-cathub__desc{ color:var(--text-soft); font-size:.92rem; line-height:1.55; }
.pd-cathub__cta{ display:inline-flex; align-items:center; gap:.35rem; margin-top:.25rem; font-family:var(--font-heading); font-weight:700; font-size:.9rem; color:var(--primary-700); }
.pd-cathub__cta svg{ transition:transform .2s ease; }
.pd-cathub__card:hover .pd-cathub__cta svg{ transform:translateX(3px); }
@media (max-width:560px){ .pd-cathub{ grid-template-columns:1fr; } }