:root{--accent:#FF4D8F;--accent-teal:#0FDAC3;--bg:#fff;--text:#0b0b0c;--muted:#6b7280;--card:#15171a0d}
html[data-theme="dark"]{--bg:#0b0b0c;--text:#f2f2f2;--muted:#b3b3b3;--card:#15171a}
body{background:var(--bg);color:var(--text)}
.wp-site-blocks{max-width:1200px;margin:0 auto;padding:0 20px}

/* header */
.f9x-header{position:sticky;top:0;z-index:100;background:var(--bg);border-bottom:1px solid rgba(0,0,0,.08)}
.f9x-header-row{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:10px 0}
.f9x-brand-nav{display:flex;align-items:center;gap:14px}.custom-logo{height:36px;width:auto;border-radius:6px}.f9x-title{font-weight:800;font-size:22px}
.f9x-nav ul{list-style:none;margin:0;padding:0;display:flex;gap:16px}.f9x-nav a{text-decoration:none;color:var(--text)}.f9x-nav a:hover{color:var(--accent)}
.f9x-actions{display:flex;align-items:center;gap:10px}.search-form{display:flex;gap:8px}.search-field{background:var(--card);border:1px solid rgba(0,0,0,.12);border-radius:8px;padding:.55rem .8rem}
.search-submit{border:1px solid rgba(0,0,0,.5);background:#2f3437;color:#fff;border-radius:8px;padding:.55rem .8rem;cursor:pointer}
.f9x-toggle{border:1px solid var(--muted);background:transparent;color:var(--text);border-radius:8px;padding:.45rem .6rem;cursor:pointer}

/* --- Stronger Mobile header layout fix --- */
@media (max-width: 900px){
  .f9x-header-row{flex-wrap:wrap !important; gap:10px !important}
  .f9x-brand-nav{flex:1 1 100% !important; display:flex !important; align-items:center !important; justify-content:space-between !important}
  .f9x-actions{order:2 !important; width:100% !important; display:flex !important; align-items:center !important; gap:8px !important}
  .f9x-actions .search-form{flex:1 1 auto !important; display:flex !important; gap:8px !important}
  .f9x-actions .search-field{width:100% !important}
  .f9x-toggle{flex:0 0 auto !important; padding:.55rem .7rem !important; border-radius:10px !important; display:inline-flex !important}
  .f9x-nav{order:3 !important; width:100% !important; overflow-x:auto !important; -webkit-overflow-scrolling:touch !important}
  .f9x-nav ul{gap:14px !important; white-space:nowrap !important; padding-bottom:4px !important}
}

/* layout */
.f9x-columns{display:grid;grid-template-columns:2fr 1fr;gap:24px}
.f9x-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:24px}
@media (max-width:1024px){.f9x-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:768px){.f9x-columns{grid-template-columns:1fr}.f9x-grid{grid-template-columns:1fr}}

/* cards */
.post-card{margin-bottom:16px}
.post-card .post-thumb img{width:100%;height:auto;border-radius:12px}
.post-card .post-excerpt{margin-top:6px}

/* side-four minis */
.f9x-side-four{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.f9x-side-four li{list-style:none;margin:0;padding:0;display:flex}
.f9x-side-four .post-card.mini{background:var(--bg);border:1px solid rgba(0,0,0,.10);border-radius:12px;padding:10px;box-shadow:0 1px 2px rgba(0,0,0,.05);position:relative;overflow:hidden;display:flex;flex-direction:column;height:100%}
.f9x-side-four .post-card.mini::before{content:"";position:absolute;left:0;top:0;width:100%;height:3px;background:#FF4D8F}
.f9x-side-four li:nth-child(even) .post-card.mini::before{background:#0FDAC3}
.f9x-side-four .post-card.mini .post-thumb img{border-radius:10px;aspect-ratio:16/9;object-fit:cover;width:100%;height:auto}
.f9x-side-four .post-card.mini .post-title{font-size:16px;line-height:1.25;margin:4px 0 6px}
.f9x-side-four .post-card.mini .mini-meta{font-size:12px;color:var(--muted)}

/* Section headers (unchanged from A19.2) */
.f9x-section-head{display:flex;align-items:baseline;justify-content:space-between;margin-top:38px;margin-bottom:12px}
.f9x-section-title{margin:0;font-weight:1000;letter-spacing:1px;font-size:clamp(26px,3.9vw,36px)}
.f9x-section-title-link{display:inline-block;padding:.32rem .74rem;border-radius:10px;text-decoration:none;color:var(--text);text-transform:uppercase;transition:background .18s ease, color .18s ease, box-shadow .18s ease}
.f9x-section-title-link:hover{background:color-mix(in oklab, var(--accent-teal) 18%, transparent);box-shadow:0 1px 0 rgba(0,0,0,.06) inset}
.f9x-section-more{text-decoration:none;color:var(--text);opacity:.85}
.f9x-section-more:hover{color:var(--accent)}
.f9x-divider{border:none;border-top:2px solid var(--accent);margin:20px 0 22px}

/* category chips */
.cats a,.wp-block-post-terms[term="category"] a{display:inline-block;background:#fff;color:var(--accent-teal);border:1px solid var(--accent-teal);padding:.18rem .5rem;border-radius:999px;font-size:12px;text-decoration:none;margin-right:6px}
html[data-theme="dark"] .cats a,html[data-theme="dark"] .wp-block-post-terms[term="category"] a{background:#000}
.cats a:hover,.wp-block-post-terms[term="category"] a:hover{background:var(--accent-teal)!important;color:#fff!important;border-color:var(--accent-teal)!important;box-shadow:none}

/* titles */
.post-title a,.single-title{color:var(--text);text-decoration:none}
.post-title a:hover,.single-title:hover{color:var(--accent)}
.post-card .post-title a:visited,.post-title a:visited{color:var(--accent-teal)}

/* single */
.single-hero img{width:100%;height:auto;border-radius:12px}
.single-title{font-size:clamp(26px,4.5vw,40px);margin:.2em 0}
.single-content{margin-top:16px}
.f9x-sep{border:none;border-top:1px solid rgba(0,0,0,.12);margin:24px 0}

/* footer */
.f9x-footer{margin-top:40px}.f9x-foot-row{display:flex;justify-content:space-between;align-items:center}

/* dark tweak */
html[data-theme="dark"] .f9x-side-four .post-card.mini{border-color:rgba(255,255,255,.12);box-shadow:none}


/* ===== A20 Readability: Merriweather for single posts + wider desktop width ===== */
.single .single-content{
  font-family: 'Merriweather', Georgia, 'Times New Roman', serif;
}

/* Desktop-only tweaks */
@media (min-width: 1024px){
  .single{ max-width: 820px; }
  .single .single-hero{ max-width: 820px; }
}


/* ===== A20 r2: Center single layout + airy sans for readability ===== */
@media (min-width: 1024px){
  .single{
    max-width: 840px; /* a bit wider */
    width: 100%;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 20px;
    padding-right: 20px;
  }
  .single .single-hero{
    max-width: 840px;
    margin-left: auto !important;
    margin-right: auto !important;
  }
  .single .single-content{
    font-family: 'Source Sans 3', 'Noto Sans', system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
    font-size: 19px;
    line-height: 1.7;
    letter-spacing: 0.005em;
    word-spacing: 0.02em;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
  }
  .single .single-content p{ margin: 0 0 1.15em; }
  .single .single-content li{ margin: 0.4em 0; }
  .single .single-content h2{ font-size: 1.55em; margin-top: 1.45em; }
  .single .single-content h3{ font-size: 1.3em;  margin-top: 1.25em; }
}


/* ===== A20 r3: wider column + rounded inline images + slight leading tweak ===== */
@media (min-width: 1024px){
  .single{ max-width: 880px; }
  .single .single-hero{ max-width: 880px; }
  .single .single-content{
    line-height: 1.72; /* gentle lift */
  }
}
/* Inline images inside post content */
.single .single-content img{
  border-radius: 12px;
}
/* Ensure WP block images respect rounding when wrapped */
.single .single-content figure.wp-block-image img{
  border-radius: 12px;
}


/* ===== A20 r4: pink links, 920px width, more gap before hero ===== */
.single .single-content a{
  color: #FF4D8F;
  text-decoration: underline;
  text-underline-offset: 2px;
}
.single .single-content a:hover{
  text-decoration-thickness: 2px;
}

/* Desktop layout adjustments */
@media (min-width: 1024px){
  .single{ max-width: 920px; }
  .single .single-hero{
    max-width: 920px;
    margin-top: 26px; /* bigger gap from byline */
  }
}


/* ===== A20 r5: tighten hero gap, chip spacing, archive sentinel ===== */
/* Smaller gap between byline and hero image */
@media (min-width: 1024px){
  .single .single-hero{ margin-top: 16px; } /* was 26px */
}
/* Ensure category chips don't collide with header border on top */
.single .single-meta{ padding-top: 10px; }
.single .single-meta .cats{ margin-bottom: 8px; }
.archive .archive-title{ margin-top: 14px; }
.archive .cats{ margin-top: 8px; margin-bottom: 10px; }

/* Visually hidden utility (SEO-friendly pagination fallback stays in DOM) */
.f9x-visually-hidden{position:absolute!important;clip:rect(1px,1px,1px,1px)!important;padding:0!important;border:0!important;height:1px!important;width:1px!important;overflow:hidden!important;white-space:nowrap!important}


/* === A20 r6: uniform thumbnail sizing + rounded corners + themed buttons === */

/* Card/thumb containers: force consistent 16:9 and rounded corners everywhere */
.post-card .post-thumb,
.f9x-grid .post-thumb,
.f9x-mini .post-thumb,
.wp-block-post-featured-image a,
.wp-block-post-featured-image {
  display:block;
  position:relative;
  overflow:hidden;
  border-radius:14px;
  aspect-ratio:16/9;
}

/* Images fill container, cover, and inherit rounding */
.post-card .post-thumb img,
.f9x-grid .post-thumb img,
.f9x-mini .post-thumb img,
.wp-block-post-featured-image img {
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  border-radius:14px;
}

/* Front page section mini cards (the 3 under each section) use the same rule set */
.f9x-section .f9x-grid .post-thumb { aspect-ratio:16/9; }

/* Themed buttons */
.button,
.f9x-btn,
#f9x-nextpage-btn,
.f9x-pagination a,
.f9x-pagination span.current {
  display:inline-block;
  padding:.6rem 1rem;
  border-radius:999px;
  text-decoration:none;
  font-weight:600;
  border:1px solid var(--accent);
  background:color-mix(in oklab, var(--accent) 92%, transparent);
  color:#fff;
  transition:transform .06s ease, box-shadow .2s ease, background .2s ease, color .2s ease;
}

.button:hover,
.f9x-btn:hover,
#f9x-nextpage-btn:hover,
.f9x-pagination a:hover {
  transform:translateY(-1px);
  box-shadow:0 6px 16px rgba(0,0,0,.14);
}

/* Non-current page links match theme; current page darker */
.f9x-pagination a {
  background:transparent;
  color:var(--text);
  border-color:var(--accent);
}
.f9x-pagination a:hover {
  background:color-mix(in oklab, var(--accent) 18%, transparent);
  color:var(--text);
}
.f9x-pagination span.current {
  background:var(--accent);
  color:#fff;
}

/* Dark theme tweaks */
html[data-theme="dark"] .f9x-pagination a {
  color:#f2f2f2;
  border-color:var(--accent);
}
html[data-theme="dark"] .f9x-pagination a:hover {
  background:color-mix(in oklab, var(--accent) 24%, transparent);
  color:#fff;
}

/* Ensure grid items don't collapse due to fixed aspect ratio */
.f9x-grid .f9x-grid-item .card,
.f9x-grid .card { display:block; }


/* Add gap between header and hero */
.hero-section {
    margin-top: 15px !important;
}

/* Add gap between category buttons and images */
.archive .post-thumbnail {
    margin-bottom: 8px !important;
}

/* Ensure category pagination buttons appear and styled */
.pagination {
    display: flex;
    justify-content: center;
    gap: 10px;
    margin: 20px 0;
}
.pagination .page-numbers {
    padding: 8px 14px;
    border-radius: 4px;
    background-color: var(--accent-color, #156FA7);
    color: #fff;
    text-decoration: none;
}
.pagination .page-numbers:hover {
    opacity: 0.85;
}

/* Slightly reduce compression artifacts by using better quality thumbnails */
img {
    image-rendering: auto;
}


/* === A20 r7: spacing + chips gap === */

/* Small gap between sticky header bottom and hero area */
.f9x-home .f9x-columns{ margin-top: 12px; }

/* Ensure the first big hero card never collides with the header */
.f9x-home .f9x-col-2 article.post-card:first-child{ margin-top: 8px; }

/* Gap between image and category chips on cards */
.post-thumb + .cats{ margin-top: 8px; }

/* Extra safety: gap between image and title if chips not present */
.post-thumb + .post-title{ margin-top: 10px; }

/* Make sure archive header has breathing room as well */
.archive .archive-header{ margin-top: 10px; }

/* === Fix pack r10: spacing & pager === */

/* Small breathing room below sticky header on archive/home */
.archive .archive-header{ margin-top: 14px; }
.f9x-home .f9x-columns{ margin-top: 12px; }

/* Ensure a clean gap under images (affects hero and cards) */
.post-card .post-thumb{ margin-bottom: 10px; }
.post-card .post-meta{ margin-top: 0; } /* prevent double spacing */

/* Pager layout */
.f9x-archive-pager{ display:flex; gap:10px; justify-content:center; align-items:center; margin: 24px 0 40px; }
#f9x-prevpage-btn, #f9x-nextpage-btn { white-space: nowrap; }

/* r12: archive meta & pager polish */
.mini-meta{ font-size:14px; color: var(--muted); }
.mini-meta .post-author{ font-weight:600; }
.f9x-archive-pager{ display:flex; gap:10px; justify-content:center; align-items:center; }

/* r13: clickable author link in mini-meta */
.mini-meta .post-author{ font-weight:600; text-decoration:none; color:inherit; }
.mini-meta .post-author:hover{ color:var(--accent); }


/* r13h: ensure byline author link matches theme colors */
.byline .post-author{ font-weight:600; text-decoration:none; color:inherit; }
.byline .post-author:hover{ color:var(--accent); }


/* === Top-left header menu: lighter, Engadget-like tone (safe minimal tweak) === */
.f9x-header .f9x-nav a{
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, ui-sans-serif, system-ui, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
  font-size: 15.5px;
  font-weight: 500;
  letter-spacing: .15px;
  color: #4a4a4f; /* lighter, not heavy */
  text-decoration: none;
}
.f9x-header .f9x-nav a:hover{
  text-decoration: underline;
  text-underline-offset: 3px;
}
html[data-theme="dark"] .f9x-header .f9x-nav a{ color: #e5e5ea; }
.f9x-header .f9x-nav ul{ gap: 16px; align-items: center; }


/* Footer font matches header nav */
.site-footer, .site-footer a, .site-footer p, .f9x-footer-wrap, .f9x-footer-nav, .f9x-footer-menu li a {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, ui-sans-serif, system-ui, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
  font-size: 15.5px;
  font-weight: 500;
}


/* Footer font color matches header nav */
.site-footer, .site-footer a, .site-footer p, .f9x-footer-wrap, .f9x-footer-nav, .f9x-footer-menu li a {
  color: #4a4a4f;
}
html[data-theme="dark"] .site-footer, 
html[data-theme="dark"] .site-footer a, 
html[data-theme="dark"] .site-footer p, 
html[data-theme="dark"] .f9x-footer-wrap, 
html[data-theme="dark"] .f9x-footer-nav, 
html[data-theme="dark"] .f9x-footer-menu li a {
  color: #e5e5ea;
}


/* Ensure footer sticks to bottom when content is short */
body {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}
main.wp-site-blocks {
  flex: 1;
}


/* Button-style pagination for HOME More */
.f9x-pagination--buttons{display:flex;gap:12px;justify-content:center;margin:24px 0 0}
.f9x-btn{display:inline-block;padding:.6rem 1rem;border:1px solid var(--muted-2, #4b4b55);border-radius:10px;text-decoration:none}
.f9x-btn:hover{filter:brightness(1.2)}

/* FIX: About Us → Our Team dark-mode bubbles/cards */
html[data-theme="dark"] .wp-block-group.has-background,
html[data-theme="dark"] .wp-block-group.is-style-rounded,
html[data-theme="dark"] .wp-block-columns .wp-block-group,
html[data-theme="dark"] .our-team .wp-block-group,
html[data-theme="dark"] .our-team li,
html[data-theme="dark"] .team li,
html[data-theme="dark"] [class*="team"] .wp-block-group,
html[data-theme="dark"] [style*="background-color:#fff"],
html[data-theme="dark"] [style*="background-color: #fff"],
html[data-theme="dark"] [style*="background-color:rgb(255, 255, 255)"],
html[data-theme="dark"] [style*="background-color: rgb(255, 255, 255)"] {
  background-color: #1a1b1e !important;
  border-color: rgba(255,255,255,.10) !important;
  color: var(--text) !important;
}
html[data-theme="dark"] .wp-block-group.has-background h3,
html[data-theme="dark"] .wp-block-group.has-background p,
html[data-theme="dark"] .wp-block-group.has-background small,
html[data-theme="dark"] .wp-block-group.has-background strong {
  color: var(--text) !important;
  opacity: 0.92;
}
html[data-theme="dark"] .wp-block-group.has-background {
  box-shadow: 0 1px 0 rgba(255,255,255,.04), 0 6px 18px rgba(0,0,0,.45) !important;
  border-radius: 12px;
}
html[data-theme="dark"] .our-team ul,
html[data-theme="dark"] [class*="team"] ul { list-style: none; padding-left: 0; }
html[data-theme="dark"] .our-team li,
html[data-theme="dark"] [class*="team"] li {
  background-color: #1a1b1e !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  border-radius: 12px;
  padding: 16px;
}


/* === Mobile Header Layout for Focus9X === */
@media (max-width: 768px){
  .f9x-header-row{position:relative; align-items:center; justify-content:center; gap:10px}
  .f9x-brand-nav{width:100%; position:relative; display:flex; align-items:center; justify-content:center}
  .f9x-logo{margin:0 auto; display:block; text-align:center}
  .f9x-burger{position:absolute; right:0; top:50%; transform:translateY(-50%); width:44px; height:44px; display:inline-flex; align-items:center; justify-content:center; border:1px solid var(--muted); border-radius:10px; background:transparent; cursor:pointer}
  .f9x-burger-bars{display:block; width:22px; height:2px; background:var(--text); position:relative}
  .f9x-burger-bars::before, .f9x-burger-bars::after{content:''; position:absolute; left:0; width:22px; height:2px; background:var(--text)}
  .f9x-burger-bars::before{top:-6px} .f9x-burger-bars::after{top:6px}
  .f9x-nav{display:none; width:100%; margin-top:8px; border-top:1px solid rgba(0,0,0,.08); padding-top:8px}
  .f9x-nav.is-open{display:block}
  .f9x-nav ul{flex-direction:column; gap:6px}
  .f9x-actions{width:100%; display:flex; align-items:center; gap:8px; margin-top:8px}
  .f9x-actions .search-form{flex:1 1 auto; display:flex; gap:8px}
  .f9x-actions .search-field{width:100%}
}

.f9x-logo img{max-height:36px;height:auto}

@media (min-width: 769px){ .f9x-burger{display:none} }


/* === Mobile header 3-up layout with overlayed center logo === */
@media (max-width: 768px){
  .f9x-header-row{position:relative; display:flex; align-items:center; justify-content:space-between; gap:10px}
  .f9x-brand-nav{flex:1 1 auto; display:flex; align-items:center; gap:12px}
  .f9x-logo{flex:0 0 auto}
  .f9x-center-logo{position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); z-index:2; pointer-events:auto}
  .f9x-center-logo img{max-height:36px; height:auto; width:auto}
  .f9x-burger{flex:0 0 auto; position:absolute; right:0; top:50%; transform:translateY(-50%); z-index:3; width:44px; height:44px; display:inline-flex; align-items:center; justify-content:center; border:1px solid var(--muted); border-radius:10px; background:transparent; cursor:pointer}
  .f9x-burger-bars{display:block; width:22px; height:2px; background:var(--text); position:relative}
  .f9x-burger-bars::before, .f9x-burger-bars::after{content:''; position:absolute; left:0; width:22px; height:2px; background:var(--text)}
  .f9x-burger-bars::before{top:-6px} .f9x-burger-bars::after{top:6px}
  .f9x-nav{display:none; width:100%; margin-top:8px; border-top:1px solid rgba(0,0,0,.08); padding-top:8px}
  .f9x-nav.is-open{display:block}
  .f9x-nav ul{flex-direction:column; gap:6px}
  .f9x-actions{width:100%; display:flex; align-items:center; gap:8px; margin-top:8px}
  .f9x-actions .search-form{flex:1 1 auto; display:flex; gap:8px}
  .f9x-actions .search-field{width:100%}
}
@media (min-width: 769px){
  .f9x-center-logo{display:none}
  .f9x-burger{display:none}
}


/* === Enforce left logo position & clear space for burger on mobile === */
@media (max-width: 768px){
  .f9x-brand-nav{justify-content:flex-start !important; padding-right:56px !important}
  .f9x-logo{margin:0 !important}
  .f9x-logo a, .f9x-logo{display:inline-flex; align-items:center}
  .f9x-burger{right:10px}
}


/* === Mobile Nav Reveal === */
@media (max-width: 768px){
  #primary-menu{display:none}
  #primary-menu.is-open{display:block}
}

/* === Center logo dark/light handling === */
.f9x-center-logo img{max-height:36px;height:auto;transition:filter .2s ease}
html[data-theme="dark"] .f9x-center-logo img{
  filter:invert(1) hue-rotate(180deg);
}


/* === Mobile menu visibility + stacking === */
@media (max-width: 768px){
  .f9x-nav{position:relative; z-index:5; background:var(--bg); border:1px solid rgba(0,0,0,.08); border-radius:10px; padding:8px 10px}
  .f9x-nav ul{display:flex; flex-direction:column; gap:8px}
  .f9x-nav a{padding:6px 4px; display:block}
}


/* === Mobile primary menu dropdown / drawer === */
@media (max-width: 768px){
  #primary-menu{display:none}
  #primary-menu.is-open{display:block}
  #primary-menu ul{list-style:none;margin:8px 0 0;padding:10px;border-top:1px solid rgba(0,0,0,.1);display:flex;flex-direction:column;gap:8px;background:var(--bg);border-radius:10px}
  #primary-menu a{display:block;padding:8px 6px;text-decoration:none;color:var(--text)}
  /* optional slide-in drawer if you prefer: add .drawer mode */
  .f9x-nav-drawer{position:fixed; top:0; right:0; bottom:0; width:78vw; max-width:360px; background:var(--bg); box-shadow:0 8px 30px rgba(0,0,0,.25); transform:translateX(100%); transition:transform .28s ease; padding:16px; z-index:1000; display:block}
  .f9x-nav-drawer.is-open{transform:translateX(0)}
}


/* === Mobile slide-in drawer menu === */
@media (max-width: 768px){
  .f9x-nav-drawer{position:fixed; top:0; right:0; bottom:0; width:80vw; max-width:340px; background:var(--bg); box-shadow:-3px 0 16px rgba(0,0,0,.3); transform:translateX(100%); transition:transform .3s ease; padding:20px; z-index:9999; overflow-y:auto; display:block}
  .f9x-nav-drawer.is-open{transform:translateX(0)}
  .f9x-nav-drawer ul{list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:14px}
  .f9x-nav-drawer a{display:block; font-size:18px; font-weight:600; text-decoration:none; color:var(--text); padding:6px 0}
  .f9x-nav-drawer a:hover{color:var(--accent)}
  body.f9x-nav-open::after{content:''; position:fixed; top:0; left:0; right:0; bottom:0; background:rgba(0,0,0,.4); z-index:9998}
}


/* === Mobile right-side drawer menu === */
@media (max-width: 768px){
  .f9x-nav{display:block}
  #primary-menu{display:block}
  .f9x-nav-drawer{position:fixed; top:0; right:0; bottom:0; width:82vw; max-width:380px; background:var(--bg); box-shadow:0 12px 40px rgba(0,0,0,.35); transform:translateX(100%); transition:transform .28s ease; padding:18px; z-index:1002; overflow:auto; -webkit-overflow-scrolling:touch; border-left:1px solid rgba(0,0,0,.08)}
  .f9x-nav-drawer.is-open{transform:translateX(0)}
  .f9x-drawer-close{position:sticky; top:0; margin-left:auto; display:inline-flex; align-items:center; justify-content:center; width:36px; height:36px; border:1px solid var(--muted); border-radius:10px; background:transparent; font-size:24px; line-height:1; cursor:pointer}
  #primary-menu ul{list-style:none; margin:12px 0 0; padding:0; display:flex; flex-direction:column; gap:14px}
  #primary-menu a{display:block; padding:10px 4px; text-decoration:none; color:var(--text); font-weight:600}
  #primary-menu li + li{border-top:1px solid rgba(0,0,0,.08); padding-top:8px}
  .f9x-overlay{position:fixed; inset:0; background:rgba(0,0,0,.35); z-index:1001; opacity:0; transition:opacity .2s ease}
  .f9x-overlay.is-open{opacity:1}
  .f9x-center-logo{z-index:5}
}
@media (min-width: 769px){
  .f9x-nav-drawer{display:none}
  .f9x-overlay{display:none}
}


/* === Drawer refinements === */
@media (max-width: 768px){
  .f9x-nav-drawer{
    width: 78vw;
    max-width: 360px;
    background: #ffffff;
    color: #0b0b0c;
    z-index: 1003;
  }
  .f9x-overlay{pointer-events:none}
  .f9x-overlay.is-open{pointer-events:auto}
  #primary-menu a{pointer-events:auto}
  #primary-menu li{position:relative}
  #primary-menu li > a::after{
    content: '+'; position:absolute; right:6px; top:50%; transform:translateY(-50%);
    font-weight:800; opacity:.6
  }
  .f9x-drawer-header{display:flex; align-items:center; gap:10px; margin:4px 0 12px}
  .f9x-drawer-search{flex:1 1 auto; display:flex; gap:8px}
  .f9x-drawer-search .search-field{flex:1 1 auto; border:1px solid rgba(0,0,0,.2); border-radius:10px; padding:.6rem .75rem; background:#f7f7f8; color:#0b0b0c}
  .f9x-drawer-search .search-submit{border:1px solid rgba(0,0,0,.35); background:#2f3437; color:#fff; border-radius:10px; padding:.6rem .85rem}
  .f9x-toggle-inline{border:1px solid rgba(0,0,0,.2); border-radius:10px; padding:.5rem .65rem; background:transparent; color:#0b0b0c}
}
html[data-theme="dark"] .f9x-nav-drawer{ background:#15171a; color:#f2f2f2; border-left:1px solid rgba(255,255,255,.12);}


/* === Clickability & visual polish for drawer === */
@media (max-width: 768px){
  .f9x-nav-drawer{
    z-index: 1100;
    background:var(--bg);
    color:var(--text);
    box-shadow:0 16px 48px rgba(0,0,0,.35);
    border-left:1px solid rgba(0,0,0,.08);
    border-top-left-radius:14px; border-bottom-left-radius:14px;
  }
  .f9x-overlay{z-index:1090; background:rgba(0,0,0,.45)}
  #primary-menu ul{gap:10px}
  #primary-menu li{position:relative}
  #primary-menu a{display:block; padding:12px 28px 12px 6px; font-weight:700}
  #primary-menu li > a::after{
    content:'+'; position:absolute; right:10px; top:50%; transform:translateY(-50%);
    font-weight:900; opacity:.55; pointer-events:none;
  }
}


/* === Footer theming === */
.site-footer{background:var(--bg); color:var(--text); border-top:1px solid rgba(0,0,0,.08)}
.site-footer a{color:var(--text); text-decoration:none}
html[data-theme="dark"] .site-footer{border-top:1px solid rgba(255,255,255,.12)}

html[data-theme="dark"] #primary-menu a{color:#f2f2f2}
html[data-theme="dark"] #primary-menu li + li{border-top:1px solid rgba(255,255,255,.12)}


/* === Contact Page Split Layout === */
.contact-card {
  width: 100%;
  margin: 20px auto;
  padding: 30px;
  border: 2px solid var(--accent-light);
  border-radius: 12px;
  background: var(--bg);
  max-width: 1000px;
  box-sizing: border-box;
}
html[data-theme="dark"] .contact-card {
  border-color: var(--accent-dark);
  background: var(--bg);
}
.contact-title {
  text-align: left;
  font-size: 2.2rem;
  margin-bottom: 10px;
  font-weight: 700;
}
.contact-subtitle-left {
  text-align: left;
  font-size: 1rem;
  margin-bottom: 25px;
  color: var(--muted);
  line-height: 1.5;
}
.contact-split-form .form-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 18px;
}
.contact-split-form .form-label {
  flex: 1;
  font-size: 1rem;
  font-weight: 600;
  padding-right: 15px;
}
.contact-split-form .form-field {
  flex: 2;
  width: 100%;
}
.contact-split-form input[type=text],
.contact-split-form input[type=email],
.contact-split-form textarea {
  font-size: 1rem;
  width: 100%;
  padding: 6px 8px;
  border: none;
  border-bottom: 1px solid rgba(0,0,0,.3);
  background: transparent;
  color: var(--text);
  line-height: 1.3;
  box-sizing: border-box;
}
html[data-theme="dark"] .contact-split-form input[type=text],
html[data-theme="dark"] .contact-split-form input[type=email],
html[data-theme="dark"] .contact-split-form textarea {
  border-bottom-color: rgba(255,255,255,.4);
}
.contact-split-form input:focus,
.contact-split-form textarea:focus { outline: none; }
.contact-split-form .form-submit {
  text-align: center;
  margin-top: 20px;
}
.contact-split-form input[type=submit] {
  padding: 12px 170px;
  border-radius: 8px;
  border: none;
  background: var(--accent-light);
  color: #fff;
  font-weight: 700;
  font-size: 1.05rem;
  cursor: pointer;
}
html[data-theme="dark"] .contact-split-form input[type=submit] {
  background: var(--accent-dark);
  color: #fff;
}
/* Responsive stacking */
@media (max-width: 768px) {
  .contact-split-form .form-row {
    flex-direction: column;
    align-items: flex-start;
  }
  .contact-split-form .form-label {
    margin-bottom: 6px;
  }
}
:root { --accent-light:#E94E77; --accent-dark:#00C6AE; }


/* === Footer Subscribe Form === */
.footer-subscribe {
  margin-top: 15px;
}
.subscribe-form {
  display: flex;
  gap: 10px;
}
.subscribe-form input[type=email] {
  padding: 8px;
  border: 1px solid #ccc;
  border-radius: 6px;
  flex: 1;
}
.subscribe-form button {
  padding: 8px 20px;
  border-radius: 6px;
  border: none;
  background: var(--accent-light);
  color: #fff;
  font-weight: 600;
  cursor: pointer;
}
html[data-theme="dark"] .subscribe-form button {
  background: var(--accent-dark);
}
.subscribe-success {
  margin-top: 10px;
  color: #22bb33;
  font-weight: 600;
}
.subscribe-error {
  margin-top: 10px;
  color: #bb2124;
  font-weight: 600;
}
@media (max-width: 600px) {
  .subscribe-form {
    flex-direction: column;
  }
  .subscribe-form button {
    width: 100%;
  }
}

/* Subscribe form fix */
.footer-subscribe {
  padding: 1rem;
  text-align: center;
}

.subscribe-form {
  display: flex;
  flex-direction: row;
  justify-content: center;
  flex-wrap: wrap;
  gap: 10px;
}

.subscribe-form input[type="email"] {
  padding: 8px;
  border: 1px solid #ccc;
  border-radius: 6px;
  flex: 1 1 250px;
  max-width: 300px;
}

.subscribe-form button {
  padding: 8px 20px;
  border-radius: 6px;
  border: none;
  background: var(--accent-dark);
  color: #fff;
  font-weight: 600;
  cursor: pointer;
  flex-shrink: 0;
}