/* Deferred styles: everything below the fold + components. Cacheable across
   pages (unlike inlined critical). Loaded non-render-blocking. */

/* Buttons / WP block button -------------------------------------------------*/
.wp-block-button__link,.btn{display:inline-block;background:var(--color-accent);
  color:var(--color-accent-contrast);padding:.7rem 1.4rem;border-radius:var(--radius);
  text-decoration:none;font-weight:600;border:2px solid var(--color-accent)}
.wp-block-button.is-style-ghost .wp-block-button__link{background:transparent;color:var(--color-accent)}
.wp-block-button.is-style-accent-2 .wp-block-button__link{background:var(--color-accent-2);
  color:var(--color-accent-2-contrast);border-color:var(--color-accent-2)}
.wp-block-button__link:hover{filter:brightness(.93)}

/* Density presets: the spacing SCALE is handled live by dynamic-css; these
   refine the fixed control paddings so compact/spacious feel tangibly different. */
.density-compact :is(.wp-block-button__link,.btn,.woocommerce .button){padding:.5rem 1rem}
.density-compact :is(input,select,textarea){padding:.45rem .65rem}
.density-spacious :is(.wp-block-button__link,.btn,.woocommerce .button){padding:.85rem 1.7rem}
.density-spacious :is(input,select,textarea){padding:.8rem 1rem}

/* Block styles --------------------------------------------------------------*/
.wp-block-group.is-style-card{background:var(--color-surface);border:1px solid var(--color-border);
  border-radius:var(--radius);padding:var(--space-md)}
.wp-block-image.is-style-rounded img{border-radius:var(--radius)}

/* Content rhythm + wide alignment ------------------------------------------*/
.entry-content>*+*{margin-block-start:var(--space-md)}
.entry-content :is(h2,h3){margin-block-start:var(--space-lg)}
.entry-content :is(ul,ol){padding-inline-start:1.25rem}
.entry-content blockquote{border-inline-start:3px solid var(--color-accent);
  padding-inline-start:var(--space-md);color:var(--color-muted);font-style:italic}
.entry-content pre{background:var(--color-surface);padding:var(--space-md);
  border-radius:var(--radius);overflow:auto;font-family:var(--font-mono)}
.alignwide{max-width:var(--wide)}
.alignfull{max-width:none;margin-inline:calc(50% - 50vw);width:100vw}

/* Layout grid (content + sidebar) ------------------------------------------*/
.layout{display:grid;gap:var(--space-lg);align-items:start}
.layout.has-sidebar{grid-template-columns:minmax(0,1fr) clamp(15rem,26%,20rem)}
.layout.has-sidebar.sidebar-left{grid-template-columns:clamp(15rem,26%,20rem) minmax(0,1fr)}
.layout__main{min-width:0;padding-block:var(--space-xl)}
.layout__sidebar{position:sticky;top:calc(var(--header-h) + 1rem);min-width:0}
.sidebar-left .layout__main{order:2}.sidebar-left .layout__sidebar{order:1}
/* Reading width when no sidebar on singular content */
.single .layout:not(.has-sidebar) .site-main,
.page .layout:not(.has-sidebar) .site-main{max-width:var(--content);margin-inline:auto}
@media(max-width:48rem){
  .layout.has-sidebar,.layout.has-sidebar.sidebar-left{grid-template-columns:1fr}
  .layout__sidebar{position:static}
  .sidebar-left .layout__main{order:0}.sidebar-left .layout__sidebar{order:1}
}

/* Cards + rows --------------------------------------------------------------*/
.chip{display:inline-block;font-size:.75rem;font-weight:600;text-transform:uppercase;
  letter-spacing:.04em;color:var(--color-accent);text-decoration:none}
.card__meta,.row-item .card__meta{display:flex;gap:var(--space-sm);flex-wrap:wrap;
  color:var(--color-muted);font-size:.8125rem;margin:.25rem 0}
.read-time::before{content:"·";margin-inline-end:var(--space-sm)}
.stretched-link::after{content:"";position:absolute;inset:0}
.card,.row-item{position:relative}
.card__excerpt,.row-item__excerpt{color:var(--color-muted);
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.card__media img,.row-item__media img{width:100%;aspect-ratio:16/9;object-fit:cover;
  border-radius:var(--radius);transition:transform .3s}
.card:hover .card__media img{transform:scale(1.03)}
.card__title{font-size:var(--step-1);margin:.35rem 0}
.card__title a,.row-item__title a{color:var(--color-heading);text-decoration:none}

/* Post grid -----------------------------------------------------------------*/
.post-grid{display:grid;gap:var(--space-lg);
  grid-template-columns:repeat(auto-fill,minmax(min(100%,18rem),1fr))}
.post-grid .card--featured{grid-column:1/-1}
.post-grid .card--featured .card__title{font-size:var(--step-2)}
@media(min-width:48rem){.post-grid .card--featured{display:grid;grid-template-columns:1.4fr 1fr;gap:var(--space-md);align-items:center}}

/* Post list (rows) ----------------------------------------------------------*/
.post-list{display:grid;gap:var(--space-lg)}
.row-item{display:grid;gap:var(--space-md);grid-template-columns:14rem 1fr;align-items:center}
.row-item__media img{aspect-ratio:4/3}
@media(max-width:40rem){.row-item{grid-template-columns:1fr}}

/* Pagination ----------------------------------------------------------------*/
.pagination{margin-top:var(--space-xl)}
.pagination .nav-links{display:flex;gap:var(--space-xs);flex-wrap:wrap;justify-content:center}
.pagination a,.pagination span{padding:.5rem .8rem;border:1px solid var(--color-border);
  border-radius:var(--radius);text-decoration:none}
.pagination .current{background:var(--color-accent);color:var(--color-accent-contrast);border-color:transparent}

/* Forms ---------------------------------------------------------------------*/
input,select,textarea{font:inherit;width:100%;padding:.6rem .8rem;
  border:1px solid var(--color-border);border-radius:var(--radius);background:var(--color-bg)}
.search-form{display:flex;gap:var(--space-xs)}
.search-form .search-submit{width:auto}

/* Pattern: features grid ----------------------------------------------------*/
.feature-grid{display:grid;gap:var(--space-lg);
  grid-template-columns:repeat(auto-fit,minmax(min(100%,16rem),1fr))}

/* Pattern: pricing ----------------------------------------------------------*/
.pricing{display:grid;gap:var(--space-md);
  grid-template-columns:repeat(auto-fit,minmax(min(100%,16rem),1fr))}
.pricing .tier{border:1px solid var(--color-border);border-radius:var(--radius);
  padding:var(--space-lg);display:grid;gap:var(--space-sm);text-align:center}
.pricing .tier.is-featured{border-color:var(--color-accent);border-width:2px}
.pricing .amount{font-size:var(--step-2);font-weight:700}

/* Pattern: FAQ (native details/summary — no JS) -----------------------------*/
.faq details{border-bottom:1px solid var(--color-border);padding:var(--space-sm) 0}
.faq summary{cursor:pointer;font-weight:600;list-style:none;display:flex;
  justify-content:space-between;gap:var(--space-sm)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";color:var(--color-accent)}
.faq details[open] summary::after{content:"−"}
.faq details>*+*{margin-top:var(--space-sm)}

/* Pattern: testimonials -----------------------------------------------------*/
.testimonials{display:grid;gap:var(--space-md);
  grid-template-columns:repeat(auto-fit,minmax(min(100%,18rem),1fr))}
.testimonials figure{background:var(--color-surface);border-radius:var(--radius);
  padding:var(--space-md);margin:0}
.testimonials figcaption{color:var(--color-muted);margin-top:var(--space-sm);font-size:.875rem}

/* Page-pattern helpers ------------------------------------------------------*/
.section-pad{padding-block:var(--space-xl)}
.has-surface,.wp-block-group.has-surface{background:var(--color-surface)}
.stats{gap:var(--space-md)}
.stats .wp-block-column{text-align:center}
.stats h3{color:var(--color-accent);margin-bottom:.1rem}
.contact-grid{gap:var(--space-lg)}

/* Logo strip ----------------------------------------------------------------*/
.logo-strip{gap:var(--space-lg) var(--space-xl);margin-top:var(--space-md)}
.logo-strip__item{margin:0;font-weight:700;font-size:var(--step-1);color:var(--color-muted);
  letter-spacing:.02em;filter:grayscale(1);opacity:.7;transition:opacity .2s}
.logo-strip__item:hover{opacity:1}

/* Team grid -----------------------------------------------------------------*/
.team-grid{margin-top:var(--space-lg)}
.team-member{text-align:center}
.team-member h3{margin:.25rem 0 0}
.team-member p{color:var(--color-muted);margin:0}
.team-avatar{width:6rem;height:6rem;margin-inline:auto;border-radius:50%;
  background:var(--color-surface);
  background-image:radial-gradient(circle at 50% 38%,var(--color-border) 0 1.4rem,transparent 1.5rem),
    radial-gradient(circle at 50% 130%,var(--color-border) 0 3rem,transparent 3.1rem);
  border:1px solid var(--color-border)}

/* Block style: Elevated group -----------------------------------------------*/
.wp-block-group.is-style-elevated{background:var(--color-bg);border:1px solid var(--color-border);
  border-radius:var(--radius);padding:var(--space-md);
  box-shadow:0 12px 32px -20px rgba(0,0,0,.5)}

/* Comments ------------------------------------------------------------------*/
.comments-area{max-width:var(--content);margin-inline:auto;margin-top:var(--space-xl)}
.comments-title{font-size:var(--step-1);margin-bottom:var(--space-md)}
.comment-list{list-style:none;padding:0;display:grid;gap:var(--space-md)}
.comment-list ol{list-style:none;padding-inline-start:var(--space-md)}
.comment-list .comment-body{border:1px solid var(--color-border);border-radius:var(--radius);
  padding:var(--space-md)}
.comment-list .comment-author{display:flex;align-items:center;gap:var(--space-xs);font-weight:600}
.comment-list .comment-meta{font-size:.8125rem;color:var(--color-muted);margin-bottom:var(--space-xs)}
.comment-respond{margin-top:var(--space-lg)}
.comment-form{display:grid;gap:var(--space-sm)}
.comment-form label{font-weight:600}

/* CTA banner ----------------------------------------------------------------*/
.cta-banner{background:var(--color-fg);color:var(--color-bg);border-radius:var(--radius);
  padding:var(--space-xl) var(--space-md);text-align:center;display:grid;gap:var(--space-md)}
.cta-banner .wp-block-button__link{background:var(--color-bg);color:var(--color-fg);border-color:var(--color-bg)}

/* Navigation: mega menus + nested flyouts -----------------------------------*/
@media(min-width:48rem){
  /* Normal nested submenus fly out to the side of their parent. */
  .submenu .submenu{top:-.4rem;inset-inline-start:100%}

  /* Slim multi-column mega panel. Add class `mega` (and optional `mega-cols-N`)
     to a top-level menu item. Sized to its columns — stays compact. */
  .submenu--mega{grid-template-columns:repeat(var(--mega-cols,3),minmax(8rem,12rem));
    gap:var(--space-xs) var(--space-md);padding:var(--space-md);min-width:0;
    max-width:min(48rem,calc(100vw - 2 * var(--space-md)));
    max-height:calc(100vh - var(--header-h) - 1rem);overflow:auto;overscroll-behavior:contain}
  .primary-nav .menu-item-has-children:hover>.submenu--mega,
  .primary-nav .menu-item-has-children:focus-within>.submenu--mega,
  .nav--enhanced .submenu-toggle[aria-expanded="true"]~.submenu--mega{display:grid}

  /* Direct children become column headings; their links sit beneath. */
  .submenu--mega>li>a{font-weight:600;color:var(--color-heading);padding:.15rem 0;
    margin-bottom:.15rem}
  .submenu--mega>li>a:hover{background:none;color:var(--color-accent)}
  .submenu--mega>li>.submenu-toggle{display:none}

  /* Column link lists: always visible, flat, no panel chrome. */
  .submenu--mega .submenu{position:static;display:block;border:0;box-shadow:none;
    padding:0;min-width:0;background:none}
  .submenu--mega .submenu a{padding:.2rem 0;color:var(--color-muted)}
  .submenu--mega .submenu a:hover{background:none;color:var(--color-accent)}
}
@media(max-width:48rem){
  /* Mobile drawer: full-width panel, generous tap targets, accordion submenus.
     A mega panel collapses to a plain stacked list. */
  .primary-nav.is-open{padding-block:var(--space-xs);border-top:1px solid var(--color-border)}
  .primary-nav .menu>.menu-item{border-top:1px solid var(--color-border)}
  .primary-nav .menu>.menu-item:first-child{border-top:0}
  .primary-nav .menu-item-has-children{display:flex;flex-wrap:wrap;align-items:center}
  .primary-nav .menu-item-has-children>a{flex:1 1 auto}
  .primary-nav .menu a{display:block;padding-block:.65rem}
  .primary-nav .submenu-toggle{width:2.75rem;height:2.75rem;justify-content:center;flex:none}
  .primary-nav .submenu{flex-basis:100%;padding-inline-start:var(--space-sm)}
  .submenu--mega,.submenu--mega .submenu{grid-template-columns:none}
  .submenu--mega>li>a{font-weight:600;color:var(--color-heading)}
}

/* Page-title banner ---------------------------------------------------------*/
.page-banner{background:var(--color-surface);border-bottom:1px solid var(--color-border)}
.page-banner__inner{padding-block:var(--space-lg)}
.page-banner__title{font-size:var(--step-2);margin:.15rem 0 0}
.page-banner__sub{color:var(--color-muted);margin:.35rem 0 0;max-width:var(--content)}
.page-banner .breadcrumbs{font-size:.8125rem;color:var(--color-muted)}

/* Per-page content-width overrides (meta box). body. prefix beats reading-width. */
body.seo-w-wide .layout:not(.has-sidebar) .site-main{max-width:var(--wide)}
body.seo-w-full .layout:not(.has-sidebar) .site-main{max-width:none}
body.seo-w-normal .layout:not(.has-sidebar) .site-main{max-width:var(--content)}

/* Author archive header -----------------------------------------------------*/
.author-header{display:flex;gap:var(--space-md);align-items:center}
.author-header .author-avatar{border-radius:50%;flex:none}
.author-bio{color:var(--color-muted);margin:.25rem 0 0;max-width:var(--content)}

/* Attachment ----------------------------------------------------------------*/
.attachment-media{margin:var(--space-md) 0}
.attachment-media figcaption{color:var(--color-muted);font-size:.875rem;margin-top:var(--space-xs)}

/* 404 -----------------------------------------------------------------------*/
.error-404{text-align:center;max-width:var(--content);margin-inline:auto;
  display:grid;gap:var(--space-md);justify-items:center}
.error-404__code{font-size:var(--step-3);font-weight:800;color:var(--color-accent);margin:0;line-height:1}
.error-404 .search-form{width:100%;max-width:24rem}
.error-404__list{list-style:none;padding:0;margin:0;display:grid;gap:.4rem}

/* Pattern: comparison table -------------------------------------------------*/
.compare-table{margin-inline:0}
.compare-table table{width:100%;border-collapse:collapse}
.compare-table :is(th,td){padding:.7rem .8rem;border-bottom:1px solid var(--color-border);text-align:start}
.compare-table thead th{font-size:.875rem}
.compare-table tbody td:not(:first-child){text-align:center}

/* Pattern: timeline ---------------------------------------------------------*/
.timeline{list-style:none;padding:0 0 0 var(--space-md);margin:0;display:grid;gap:var(--space-md);
  border-inline-start:2px solid var(--color-border)}
.timeline>li{position:relative}
.timeline>li::before{content:"";position:absolute;inset-inline-start:calc(-1 * var(--space-md) - 6px);
  top:.4rem;width:11px;height:11px;border-radius:50%;background:var(--color-accent)}
.timeline__time{font-size:.8125rem;color:var(--color-muted);font-weight:600}

/* Pattern: pricing toggle (CSS-only, no JS) ---------------------------------*/
.price-switch{display:grid;gap:var(--space-md);justify-items:center}
.price-switch__control{display:inline-flex;gap:.25rem;background:var(--color-surface);border-radius:999px;padding:.25rem}
.price-switch__control label{padding:.4rem .9rem;border-radius:999px;cursor:pointer;font-weight:600;font-size:.875rem}
.price-switch input{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
.price-switch input:checked+label{background:var(--color-accent);color:var(--color-accent-contrast)}
.price-switch input:focus-visible+label{outline:3px solid var(--color-accent);outline-offset:2px}
.price-switch .price-yearly{display:none}
.price-switch:has(.price-toggle--yearly:checked) .price-yearly{display:inline}
.price-switch:has(.price-toggle--yearly:checked) .price-monthly{display:none}

/* Pattern: media feature (alternating) -------------------------------------*/
.media-feature{display:grid;gap:var(--space-lg);align-items:center;
  grid-template-columns:repeat(auto-fit,minmax(min(100%,18rem),1fr))}
.media-feature.is-reverse>:first-child{order:2}
.media-feature__media{min-height:14rem;background:var(--color-surface);border-radius:var(--radius)}

/* Pattern: inline newsletter ------------------------------------------------*/
.newsletter-inline{background:var(--color-surface);border-radius:var(--radius);padding:var(--space-lg);
  text-align:center;display:grid;gap:var(--space-sm);justify-items:center}
.newsletter-inline form{display:flex;gap:var(--space-xs);width:100%;max-width:28rem;flex-wrap:wrap}
.newsletter-inline input[type=email]{flex:1 1 12rem}

/* Pattern: testimonial slider (scroll-snap) ---------------------------------*/
.testi-slider{display:flex;gap:var(--space-md);overflow-x:auto;scroll-snap-type:x mandatory;
  padding-block:var(--space-xs);scrollbar-width:thin}
.testi-slider>figure{flex:0 0 min(85%,22rem);scroll-snap-align:start;margin:0;
  background:var(--color-surface);border-radius:var(--radius);padding:var(--space-md)}
.testi-slider figcaption{color:var(--color-muted);font-size:.875rem;margin-top:var(--space-sm)}

/* Block styles: checklist / dots / badge / notice / frame -------------------*/
.wp-block-list.is-style-checklist{list-style:none;padding-inline-start:0}
.wp-block-list.is-style-checklist li{padding-inline-start:1.6rem;position:relative}
.wp-block-list.is-style-checklist li::before{content:"✓";position:absolute;inset-inline-start:0;color:var(--color-accent);font-weight:700}
.wp-block-separator.is-style-dots{border:0;height:auto;max-width:none;background:none;text-align:center}
.wp-block-separator.is-style-dots::before{content:"• • •";color:var(--color-border);letter-spacing:.5em}
.is-style-badge{display:inline-block;font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;
  padding:.2rem .6rem;border-radius:999px;background:var(--color-surface);color:var(--color-accent)}
.wp-block-group.is-style-notice{border-inline-start:4px solid var(--color-accent);background:var(--color-surface);
  border-radius:var(--radius);padding:var(--space-md)}
.wp-block-image.is-style-frame img{border:1px solid var(--color-border);padding:.5rem;background:var(--color-bg);border-radius:var(--radius)}

/* Footer --------------------------------------------------------------------*/
.site-footer{border-top:1px solid var(--color-border);margin-top:var(--space-xl);
  padding-block:var(--space-lg);position:relative}
.footer-newsletter{text-align:center;padding-bottom:var(--space-lg);
  margin-bottom:var(--space-lg);border-bottom:1px solid var(--color-border)}
.footer-widgets{display:grid;gap:var(--space-lg);
  grid-template-columns:repeat(var(--footer-cols,4),minmax(0,1fr))}
@media(max-width:48rem){.footer-widgets{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:30rem){.footer-widgets{grid-template-columns:1fr}}
.footer-bottom{display:flex;justify-content:space-between;align-items:center;
  gap:var(--space-md);flex-wrap:wrap;margin-top:var(--space-lg)}
.footer-menu,.social-menu{display:flex;gap:var(--space-md);list-style:none;padding:0;
  margin:0;flex-wrap:wrap}
.footer-menu a,.social-menu a{color:var(--color-muted);text-decoration:none}
.colophon{color:var(--color-muted);font-size:.875rem;margin:0}
.payment-icons{display:flex;gap:var(--space-xs);list-style:none;padding:0;margin:0;flex-wrap:wrap}
.payment-icons__item{font-size:.6875rem;font-weight:600;letter-spacing:.02em;
  padding:.2rem .45rem;border:1px solid var(--color-border);
  border-radius:calc(var(--radius) / 1.5);color:var(--color-muted)}
.back-to-top{position:fixed;bottom:var(--space-md);inset-inline-end:var(--space-md);z-index:40;
  display:inline-flex;align-items:center;justify-content:center;width:2.75rem;height:2.75rem;
  background:var(--color-fg);color:var(--color-bg);border-radius:50%;text-decoration:none;
  box-shadow:0 6px 20px -8px rgba(0,0,0,.5)}
.back-to-top:hover{filter:brightness(1.15)}

/* Header search disclosure --------------------------------------------------*/
.header-search{border-bottom:1px solid var(--color-border);background:var(--color-surface)}
.header-search .wrap{padding-block:var(--space-sm)}
.header-search[hidden]{display:none}

/* Trust bar -----------------------------------------------------------------*/
.trust-bar{background:var(--color-surface);border-block:1px solid var(--color-border);
  font-size:.875rem}
.trust-bar__inner{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;
  gap:var(--space-md) var(--space-lg);padding-block:var(--space-sm);text-align:center}
.trust-bar .widget{display:flex;align-items:center;gap:var(--space-xs);margin:0}
.trust-bar .widget-title{font-size:inherit;margin:0;font-weight:600}
.trust-bar svg{flex:none}
@media(max-width:40rem){.trust-bar__inner{gap:var(--space-sm)}}

/* Language switcher ---------------------------------------------------------*/
.lang-switcher ul{display:flex;gap:var(--space-xs);list-style:none;padding:0;margin:0;font-size:.875rem}
.lang-switcher .is-current a{font-weight:700}

/* Widgets -------------------------------------------------------------------*/
.widget+.widget{margin-top:var(--space-lg)}
.widget-title{font-size:var(--step-1);margin-bottom:var(--space-sm)}

/* CTA widget ----------------------------------------------------------------*/
.cta-widget{padding:var(--space-md);border-radius:var(--radius);display:grid;gap:var(--space-sm);justify-items:start}
.cta-widget--surface{background:var(--color-surface)}
.cta-widget--accent{background:var(--color-accent);color:var(--color-accent-contrast)}
.cta-widget--accent .btn{background:var(--color-bg);color:var(--color-fg);border-color:var(--color-bg)}
.cta-widget__title{font-weight:700;font-size:var(--step-1);margin:0}
.cta-widget__text{margin:0}

/* Post-list widget ----------------------------------------------------------*/
.widget-posts{list-style:none;margin:0;padding:0;display:grid;gap:var(--space-sm)}
.widget-posts__item{display:flex;gap:var(--space-sm);align-items:flex-start}
.widget-posts__media{flex:0 0 4rem}
.widget-posts__media img{width:4rem;height:4rem;object-fit:cover;border-radius:calc(var(--radius) / 1.5)}
.widget-posts__title{font-weight:600;text-decoration:none;color:var(--color-heading);display:block}
.widget-posts__date{display:block;font-size:.8125rem;color:var(--color-muted)}
.widget-posts--cards{grid-template-columns:repeat(auto-fill,minmax(min(100%,12rem),1fr))}
.widget-posts--cards .widget-posts__item{flex-direction:column}
.widget-posts--cards .widget-posts__media{flex:none;width:100%}
.widget-posts--cards .widget-posts__media img{width:100%;height:auto;aspect-ratio:16/9}

/* Content + before-footer widget positions ----------------------------------*/
.content-widgets{margin-block:var(--space-lg)}
.content-widgets--top{margin-top:0}
.before-footer{background:var(--color-surface);border-top:1px solid var(--color-border)}
.before-footer__inner{padding-block:var(--space-lg)}
