/* CMX Flex — classic theme layout and interaction styles. */

.cmx-main { display:block; min-height:40vh; }

/* Accessibility */
.screen-reader-text { border:0; clip:rect(1px,1px,1px,1px); clip-path:inset(50%); height:1px; width:1px; margin:-1px; padding:0; overflow:hidden; position:absolute!important; word-wrap:normal!important; }
.cmx-skip-link { position:absolute; left:-9999px; top:0; z-index:100000; padding:12px 18px; background:var(--color-primary); color:#fff; text-decoration:none; }
.cmx-skip-link:focus { left:0; }
.cmx-main:focus { outline:none; }

/* Top bar */
.cmx-topbar { background:color-mix(in srgb,var(--color-primary) 92%,#000); color:#fff; font-size:13px; }
.cmx-topbar__inner { min-height:38px; display:flex; align-items:center; justify-content:space-between; gap:20px; }
.cmx-topbar__left,.cmx-topbar__right { min-width:0; }

/* Header */
.cmx-header { position:sticky; top:0; z-index:50; background:color-mix(in srgb,var(--color-surface) 94%,transparent); backdrop-filter:blur(12px); border-bottom:1px solid var(--color-border); }
.cmx-header__inner { display:flex; align-items:center; justify-content:space-between; gap:24px; }
.cmx-header__brand { flex:none; min-width:0; }
.cmx-brand { display:inline-flex; align-items:center; text-decoration:none; }
.cmx-brand--text { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:36vw; }
.cmx-nav { display:flex; align-items:center; gap:26px; }
.cmx-nav__list { display:flex; align-items:center; gap:26px; list-style:none; margin:0; padding:0; }
.cmx-nav__list li { position:relative; }
.cmx-nav__list a { display:block; color:var(--color-text); font-family:var(--font-display); font-weight:600; text-decoration:none; }
.cmx-nav__list a:hover,.cmx-nav__list .current-menu-item>a,.cmx-nav__list .current_page_item>a { color:var(--color-accent); }
.cmx-nav__list .sub-menu { position:absolute; top:100%; left:0; min-width:220px; padding:10px; margin:0; list-style:none; background:var(--color-surface); border:1px solid var(--color-border); border-radius:10px; box-shadow:var(--shadow-lg); opacity:0; visibility:hidden; transform:translateY(6px); transition:opacity .15s ease,transform .15s ease; }
.cmx-nav__list li:hover>.sub-menu,.cmx-nav__list li:focus-within>.sub-menu { opacity:1; visibility:visible; transform:none; }
.cmx-nav__list .sub-menu a { padding:9px 10px; }
.cmx-nav__actions { display:flex; align-items:center; gap:10px; }
.cmx-header__toggle { display:none; width:44px; height:44px; align-items:center; justify-content:center; padding:0; border:1px solid var(--color-border); background:var(--color-surface); color:var(--color-primary); cursor:pointer; }

/* Hero */
.cmx-pagehero { display:flex; align-items:center; padding-block:48px; background:var(--cmx-hero-bg,var(--color-primary)); color:var(--cmx-hero-text,#fff); overflow:hidden; }
.cmx-pagehero__title { margin:10px 0 0; color:inherit; font-size:var(--text-h1); }
.cmx-pagehero__intro { max-width:48rem; margin:16px 0 0; color:inherit; opacity:.86; font-size:var(--text-lead); line-height:1.6; }
.cmx-pagehero .cmx-eyebrow { color:inherit; }

.cmx-front-hero { background:var(--cmx-hero-bg,var(--color-primary)); color:var(--cmx-hero-text,#fff); padding-block:clamp(56px,8vw,110px); }
.cmx-front-hero__inner { display:grid; grid-template-columns:1fr; gap:48px; align-items:center; }
.cmx-front-hero__inner.has-media { grid-template-columns:minmax(0,1.1fr) minmax(280px,.9fr); }
.cmx-front-hero__content { max-width:760px; }
.cmx-front-hero--center .cmx-front-hero__content { margin-inline:auto; text-align:center; }
.cmx-front-hero--center .cmx-eyebrow,.cmx-front-hero--center .cmx-front-hero__actions { justify-content:center; }
.cmx-front-hero__title { margin:14px 0 0; color:inherit; font-size:var(--text-display); }
.cmx-front-hero__text { margin:20px 0 0; color:inherit; opacity:.86; font-size:var(--text-lead); line-height:1.65; }
.cmx-front-hero__actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:28px; }
.cmx-front-hero__media { border-radius:var(--cmx-card-radius,12px); overflow:hidden; box-shadow:var(--shadow-xl); }
.cmx-front-hero__media img { width:100%; height:auto; }

/* Content width profiles */
.cmx-content-shell { width:100%; }
.cmx-content--normal .cmx-content-shell { max-width:var(--container-prose); margin-inline:auto; }
.cmx-content--narrow .cmx-content-shell { max-width:min(640px,var(--container-prose)); margin-inline:auto; }
.cmx-content--wide .cmx-content-shell { max-width:1100px; margin-inline:auto; }
.cmx-content--full .cmx-content-shell { max-width:none; }
.cmx-content-shell> * + * { margin-top:1.1em; }
.cmx-content-shell h2 { margin-top:1.55em; }
.cmx-content-shell h3 { margin-top:1.4em; }
.cmx-content-shell a:not(.cmx-btn) { text-decoration:underline; text-underline-offset:3px; }
.cmx-content-shell ul,.cmx-content-shell ol { padding-left:1.35em; }
.cmx-layout-canvas .cmx-section>.cmx-container { max-width:none; padding:0; }
.cmx-layout-canvas .cmx-section { padding:0; }

/* Blog / archive */
.cmx-blog { display:grid; grid-template-columns:minmax(0,1fr) 300px; gap:44px; align-items:start; }
.cmx-no-sidebar .cmx-blog { grid-template-columns:minmax(0,1fr); }
.cmx-blog__main { min-width:0; }
.cmx-blog__aside { display:flex; flex-direction:column; gap:20px; position:sticky; top:96px; }
.cmx-blog__aside .widget-title { margin-bottom:12px; }
.cmx-blog__aside ul { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:8px; }
.cmx-blog__aside a { text-decoration:none; }
.cmx-archive-grid { display:grid; grid-template-columns:repeat(var(--cmx-archive-cols,2),minmax(0,1fr)); gap:20px; }
.cmx-post__thumb { display:block; margin:-8px -8px 16px; overflow:hidden; border-radius:calc(var(--cmx-card-radius,12px) - 3px); }
.cmx-post__thumb img { display:block; width:100%; object-fit:cover; }
.cmx-post-meta { margin:2px 0 9px; }
.cmx-post-tags { margin-top:28px; }
.cmx-post-tags a { display:inline-flex; padding:3px 8px; border:1px solid var(--color-border); border-radius:999px; margin:0 5px 5px 0; text-decoration:none; font-size:12px; }
.cmx-single__hero { margin:0 0 28px; border-radius:var(--cmx-card-radius,12px); overflow:hidden; }
.cmx-single__hero img { width:100%; height:auto; }
.cmx-postnav { display:flex; justify-content:space-between; gap:20px; flex-wrap:wrap; margin-top:40px; padding-top:24px; border-top:1px solid var(--color-border); }
.cmx-postnav a { font-family:var(--font-display); font-weight:600; text-decoration:none; }
.cmx-postnav__next { margin-left:auto; text-align:right; }

/* Search & pagination */
.cmx-searchform__row { display:flex; gap:8px; }
.cmx-searchform__row .cmx-input { flex:1; }
.cmx-search-hero-form { max-width:520px; }
.cmx-pagination { margin-top:32px; }
.cmx-pagination .nav-links { display:flex; flex-wrap:wrap; gap:6px; }
.cmx-pagination .page-numbers { display:inline-flex; align-items:center; justify-content:center; min-width:40px; height:40px; padding:0 10px; border:1px solid var(--color-border); border-radius:var(--cmx-form-radius,8px); text-decoration:none; }
.cmx-pagination .page-numbers.current { background:var(--color-primary); color:#fff; border-color:var(--color-primary); }

/* Footer */
.cmx-footer { overflow:hidden; }
.cmx-footer__inner { display:grid; grid-template-columns:repeat(var(--cmx-footer-cols,3),minmax(0,1fr)); gap:34px; }
.cmx-footer__col { min-width:0; }
.cmx-footer__col h4 { margin:0 0 14px; color:inherit; font-family:var(--font-display); font-size:13px; letter-spacing:.08em; text-transform:uppercase; }
.cmx-footer__text { line-height:1.65; }
.cmx-footer__text p + p { margin-top:10px; }
.cmx-footer__menu { display:flex; flex-direction:column; gap:9px; list-style:none; margin:0; padding:0; }
.cmx-footer__menu li { margin:0; padding:0; }
.cmx-footer__menu a { text-decoration:none; }
.cmx-footer__image { width:auto; max-width:100%; height:auto; }
.cmx-footer__inner[style*="center"] .cmx-footer__image { margin-inline:auto; }
.cmx-footer__separator { display:flex; align-items:center; justify-content:center; padding:8px 20px 18px; color:var(--cmx-footer-text); text-align:center; }
.cmx-footer__bar { border-top:1px solid color-mix(in srgb,var(--cmx-footer-text) 18%,transparent); }
.cmx-footer__bar-inner { min-height:58px; display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; font-size:12.5px; color:var(--cmx-footer-text); opacity:.78; }

/* Comments */
.cmx-comments { margin-top:48px; padding-top:32px; border-top:1px solid var(--color-border); }
.cmx-comments__title { margin-bottom:20px; font-size:var(--text-h3); }
.cmx-comments__list { list-style:none; margin:0 0 32px; padding:0; }
.cmx-comments__list ol.children { list-style:none; margin:16px 0 0 24px; padding:0; }
.cmx-comments__list .comment-body { padding:16px 0; border-top:1px solid var(--color-border); }
.cmx-comments__list .comment-author { display:flex; align-items:center; gap:10px; font-family:var(--font-display); font-weight:700; }
.cmx-comments__list .comment-author img { border-radius:50%; }
.cmx-comments__list .comment-meta { margin:4px 0 8px; font-size:13px; color:var(--color-text-muted); }
.cmx-comments__reply-title { margin-bottom:16px; }
.cmx-comments__form label { display:block; margin-bottom:6px; font-weight:600; }
.cmx-comments__form input[type="text"],.cmx-comments__form input[type="email"],.cmx-comments__form input[type="url"],.cmx-comments__form textarea { width:100%; padding:10px 13px; border:1px solid var(--color-border); background:var(--color-surface); color:var(--color-text); }

/* Tables and common form elements */
.cmx-content-shell table { width:100%; border-collapse:separate; border-spacing:0; overflow:hidden; border:1px solid var(--color-border); border-radius:var(--cmx-table-radius,8px); }
.cmx-content-shell th,.cmx-content-shell td { padding:11px 13px; border-bottom:1px solid var(--color-border); text-align:left; }
.cmx-content-shell tr:last-child td { border-bottom:0; }
input,textarea,select { font:inherit; }

/* Floating posts modal */
.cmx-floating-posts { position:fixed; bottom:24px; z-index:80; display:inline-flex; align-items:center; justify-content:center; min-height:46px; padding:10px 18px; border:0; border-radius:999px; background:var(--cmx-floating-bg,var(--color-accent)); color:var(--cmx-floating-text,#fff); box-shadow:var(--shadow-lg); font-family:var(--font-display); font-weight:700; text-decoration:none; cursor:pointer; }
.cmx-floating-posts--right { right:24px; }
.cmx-floating-posts--left { left:24px; }
.cmx-modal-open { overflow:hidden; }
.cmx-posts-modal[hidden] { display:none!important; }
.cmx-posts-modal { position:fixed; inset:0; z-index:9999; display:grid; place-items:center; padding:24px; }
.cmx-posts-modal__backdrop { position:absolute; inset:0; background:rgba(15,23,42,.66); }
.cmx-posts-modal__dialog { position:relative; width:min(1120px,100%); max-height:min(88vh,900px); overflow:auto; background:var(--color-surface); color:var(--color-text); border-radius:18px; box-shadow:0 28px 80px rgba(0,0,0,.28); padding:24px; }
.cmx-posts-modal__head { display:flex; align-items:center; justify-content:space-between; gap:16px; position:sticky; top:-24px; z-index:2; margin:-24px -24px 18px; padding:20px 24px 16px; background:var(--color-surface); border-bottom:1px solid var(--color-border); }
.cmx-posts-modal__close { width:42px; height:42px; display:inline-flex; align-items:center; justify-content:center; border:1px solid var(--color-border); border-radius:50%; background:var(--color-surface); color:var(--color-text); cursor:pointer; }
.cmx-posts-modal__filters { display:grid; grid-template-columns:repeat(var(--cmx-filter-cols,4),minmax(0,1fr)); gap:8px; margin-bottom:18px; }
.cmx-posts-modal__filter { display:flex; align-items:center; gap:8px; padding:10px 12px; border:1px solid var(--color-border); border-radius:10px; cursor:pointer; }
.cmx-posts-modal__filter:has(input:checked) { border-color:var(--color-primary); background:color-mix(in srgb,var(--color-primary) 7%,var(--color-surface)); }
.cmx-posts-modal__status { min-height:22px; color:var(--color-text-muted); font-size:14px; }
.cmx-posts-modal__grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; }
.cmx-posts-modal__date { margin-bottom:8px; }
.cmx-posts-modal__pagination { display:flex; flex-wrap:wrap; justify-content:center; gap:7px; margin-top:22px; }
.cmx-posts-modal__page { min-width:38px; height:38px; border:1px solid var(--color-border); border-radius:8px; background:var(--color-surface); color:var(--color-text); cursor:pointer; }
.cmx-posts-modal__page.is-current { background:var(--color-primary); color:#fff; border-color:var(--color-primary); }

/* WordPress alignments */
.alignwide { max-width:1100px; margin-left:auto; margin-right:auto; }
.alignfull { width:100vw; max-width:100vw; margin-left:calc(50% - 50vw); margin-right:calc(50% - 50vw); }
.wp-caption,.gallery-caption { max-width:100%; }
.sticky { position:relative; }
.bypostauthor { position:relative; }

.cmx-404-card { max-width:600px; }
.cmx-404-search { margin-bottom:18px; }

@media (max-width:980px) {
  .cmx-header__toggle { display:inline-flex; }
  .cmx-nav { position:absolute; top:100%; left:0; right:0; display:none; flex-direction:column; align-items:stretch; gap:0; background:var(--color-surface); border-bottom:1px solid var(--color-border); box-shadow:var(--shadow-lg); padding:12px 0; }
  .cmx-nav.is-open { display:flex; }
  .cmx-nav__list { flex-direction:column; align-items:stretch; gap:0; }
  .cmx-nav__list .sub-menu { position:static; opacity:1; visibility:visible; transform:none; box-shadow:none; border:0; padding:0 0 0 16px; }
  .cmx-nav__actions { padding:12px 20px; }
  .cmx-front-hero__inner.has-media { grid-template-columns:1fr; }
  .cmx-blog { grid-template-columns:1fr; }
  .cmx-blog__aside { position:static; }
}

@media (max-width:700px) {
  .cmx-topbar__inner { align-items:flex-start; flex-direction:column; gap:4px; padding-block:8px; }
  .cmx-footer__inner { grid-template-columns:1fr!important; }
  .cmx-footer__bar-inner { flex-direction:column; align-items:center; justify-content:center; text-align:center; padding-block:14px; }
  .cmx-posts-modal { padding:10px; }
  .cmx-posts-modal__dialog { padding:18px; border-radius:14px; }
  .cmx-posts-modal__head { top:-18px; margin:-18px -18px 14px; padding:16px 18px 12px; }
  .cmx-posts-modal__grid,.cmx-archive-grid { grid-template-columns:1fr; }
  .cmx-floating-posts { bottom:16px; }
  .cmx-floating-posts--right { right:16px; }
  .cmx-floating-posts--left { left:16px; }
}
