/* Web Mullet — brand foundation + homepage (native Gutenberg build).
   Loaded on the front end AND in the block editor. Values measured from the
   original design-system components. */

/* ---- Fonts ---- */
@font-face{font-family:"Gasoek One";src:url("https://webmullet.nl/wp-content/uploads/web-mullet/assets/fonts/GasoekOne-Regular.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap;}
@font-face{font-family:"Google Sans";src:url("https://webmullet.nl/wp-content/uploads/web-mullet/assets/fonts/GoogleSans-Regular.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap;}
@font-face{font-family:"Google Sans";src:url("https://webmullet.nl/wp-content/uploads/web-mullet/assets/fonts/GoogleSans-Medium.woff2") format("woff2");font-weight:500;font-style:normal;font-display:swap;}
@font-face{font-family:"Google Sans";src:url("https://webmullet.nl/wp-content/uploads/web-mullet/assets/fonts/GoogleSans-Bold.woff2") format("woff2");font-weight:700;font-style:normal;font-display:swap;}

/* ---- Tokens ---- */
:root{
  --wm-lime:#D8FF54;--wm-lime-ink:#1A2400;--wm-black:#0B0B0C;--wm-white:#FFFFFF;
  --wm-grey-900:#17181B;--wm-grey-800:#232428;--wm-grey-600:#4B4E56;--wm-grey-500:#6B6F79;
  --wm-grey-400:#9599A3;--wm-grey-300:#C2C5CC;--wm-grey-200:#E1E3E7;--wm-grey-100:#F4F5F6;--wm-grey-50:#FAFBFB;
  --surface-page:var(--wm-grey-50);--surface-card:var(--wm-white);
  --text-primary:var(--wm-black);--text-secondary:var(--wm-grey-600);--text-muted:var(--wm-grey-400);
  --border-hairline:var(--wm-grey-200);
  --font-display:"Gasoek One","Arial Black",sans-serif;
  --font-sans:"Google Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  --radius-sm:10px;--radius-md:16px;--radius-lg:24px;--radius-pill:999px;--container-max:1200px;--bento-gap:24px;
  --ease-out:cubic-bezier(0.22,1,0.36,1);--dur-fast:120ms;--dur-base:200ms;
}

/* ---- Base typography corrections ---- */
body,.wp-site-blocks{font-family:var(--font-sans)!important;font-weight:400;color:var(--text-primary);}
.entry-content{font-family:var(--font-sans);}
.entry-content p,.entry-content li,.entry-content a{font-weight:400;}
.wm-eyebrow,.wm-pill,.wm-badge,.wm-meta,.wm-stat-label,.wm-feat li,.wm-lead,.wm-note,.wm-navitem,.wm-foot-link,.wm-foot-head{font-family:var(--font-sans)!important;}

/* ---- Brand helpers ---- */
.wm-display{font-family:var(--font-display)!important;font-weight:400!important;line-height:.92!important;letter-spacing:-.02em!important;text-transform:uppercase!important;}
.wm-eyebrow{font-weight:700;font-size:.75rem;letter-spacing:.08em;text-transform:uppercase;color:var(--text-secondary);margin:0;}
.wm-pill{display:inline-flex;align-items:center;gap:8px;background:var(--wm-lime);color:var(--wm-lime-ink)!important;padding:6px 14px;border-radius:var(--radius-pill);font-weight:700;font-size:.75rem;line-height:1.2;letter-spacing:.08em;text-transform:uppercase;width:fit-content;}
.wm-highlight{background:var(--wm-lime);color:var(--wm-lime-ink);padding:.02em .2em;border-radius:14px;-webkit-box-decoration-break:clone;box-decoration-break:clone;}

/* ---- Hide the theme's default chrome on the native home page ---- */
.wm-native .wp-block-post-title,.wm-native .wp-block-post-title{display:none!important;}
.wm-native .wp-block-template-part,.wm-native .wp-block-template-part{display:none!important;}
.wm-native .wp-block-post-content,.wm-native .wp-block-post-content{margin-top:0!important;}
.wm-native .wp-site-blocks,.wm-native .wp-site-blocks{padding-top:0!important;}

/* ---- Sections ---- */
.wm-section{padding-top:56px;padding-bottom:56px;}
.wm-hero{background:var(--wm-grey-50);padding-top:64px;padding-bottom:56px;}
.wm-hero-title{font-size:clamp(3rem,6.2vw,5.5rem);line-height:1.22!important;max-width:980px;margin:22px 0 0;}
.wm-lead{font-size:20px;color:var(--text-secondary);max-width:620px;line-height:1.5;margin-top:36px;}
.wm-shead{font-size:clamp(2rem,4vw,3rem);line-height:1.14!important;margin:10px 0 0;}

/* ---- Buttons (rounded-rect 16px; signature hard-offset hover) ---- */
.wm-btn .wp-block-button__link{border:2px solid transparent;border-radius:16px;padding:14px 28px;font-weight:700;font-family:var(--font-sans);font-size:16px;transition:transform var(--dur-fast) var(--ease-out),box-shadow var(--dur-fast) var(--ease-out);}
.wm-btn .wp-block-button__link:hover{transform:translate(-2px,-2px);}
.wm-btn .wp-block-button__link:active{transform:translate(0,0);box-shadow:none;}
.wm-hero .wm-btn .wp-block-button__link{font-size:18px;padding:16px 30px;}
.wm-btn--primary .wp-block-button__link,.wm-btn--onlime .wp-block-button__link{background:var(--wm-black);color:#fff;border-color:var(--wm-black);}
.wm-btn--primary .wp-block-button__link:hover,.wm-btn--onlime .wp-block-button__link:hover{box-shadow:4px 4px 0 var(--wm-lime);}
.wm-btn--secondary .wp-block-button__link{background:transparent;color:var(--wm-black);border-color:var(--wm-black);}
.wm-btn--secondary .wp-block-button__link:hover{box-shadow:4px 4px 0 var(--wm-black);}
.wm-btn--accent .wp-block-button__link{background:var(--wm-lime);color:var(--wm-lime-ink);border-color:var(--wm-lime);}
.wm-btn--accent .wp-block-button__link:hover{box-shadow:4px 4px 0 var(--wm-black);}
.wm-btn--full .wp-block-button__link{display:block;text-align:center;}

/* ---- Cards + signature hard-offset hover (5px 5px) ---- */
.wm-card{background:var(--surface-card);border:1.5px solid var(--border-hairline);border-radius:var(--radius-lg);padding:32px;height:100%;min-height:200px;transition:transform var(--dur-base) var(--ease-out),box-shadow var(--dur-base) var(--ease-out);}
.wm-card h2,.wm-card h3{font-family:var(--font-sans)!important;font-size:28px;font-weight:700!important;margin:0 0 8px;color:var(--text-primary);}
.wm-card p{color:var(--text-secondary);font-size:17px;margin:0;}
.wm-card:hover{transform:translate(-3px,-3px);box-shadow:5px 5px 0 var(--wm-lime);}
.wm-card--ink{background:var(--wm-black);border:none;}
.wm-card--ink h2,.wm-card--ink h3{color:#fff;}
.wm-card--ink p,.wm-card--ink li{color:var(--wm-grey-300);}
.wm-card--ink:hover{box-shadow:5px 5px 0 var(--wm-lime);}
.wm-card--lime{background:var(--wm-lime);border:none;}
.wm-card--lime h2,.wm-card--lime h3,.wm-card--lime p,.wm-card--lime li{color:var(--wm-lime-ink);}
.wm-card--lime:hover{box-shadow:5px 5px 0 var(--wm-black);}

/* ---- Stats band ---- */
.wm-stats{background:var(--wm-black);color:#fff;}
.wm-stats .wm-num{font-family:var(--font-display);font-size:clamp(2.4rem,4vw,3.25rem);color:var(--wm-lime);line-height:1;margin:0;}
.wm-stats .wm-stat-label{color:var(--wm-grey-400);font-size:15px;margin:8px 0 0;}

/* ---- Pricing ---- */
.wm-plan{display:flex;flex-direction:column;}
.wm-price-amt{font-family:var(--font-display);font-size:48px;line-height:1;margin:0;display:flex;align-items:baseline;flex-wrap:wrap;column-gap:10px;row-gap:4px;}
.wm-price-per{font-family:var(--font-sans);font-size:15px;font-weight:500;line-height:1.4;color:var(--text-muted);}
.wm-feat{list-style:none;margin:18px 0 0;padding:16px 0 0;border-top:1px solid var(--border-hairline);display:flex;flex-direction:column;gap:10px;flex:1 0 auto;}
.wm-card--ink .wm-feat{border-top-color:var(--wm-grey-800);}
.wm-card--lime .wm-feat{border-top-color:rgba(26,36,0,.18);}
.wm-feat li{font-size:15.5px;line-height:1.4;}
.wm-badge{align-self:flex-start;background:var(--wm-black);color:#fff!important;font-size:.75rem;font-weight:700;line-height:1.2;letter-spacing:.08em;text-transform:uppercase;padding:6px 14px;border-radius:999px;margin:0;}
.wm-card--lime .wm-badge{color:#fff!important;}
.wm-note{text-align:center;color:var(--text-muted);font-size:15px;margin-top:20px;}

/* ---- Work tiles + hover ---- */
.wm-worktile{background:var(--surface-card);border:1.5px solid var(--border-hairline);border-radius:var(--radius-lg);overflow:hidden;height:100%;transition:transform var(--dur-base) var(--ease-out),box-shadow var(--dur-base) var(--ease-out);}
.wm-worktile:hover{transform:translate(-3px,-3px);box-shadow:5px 5px 0 var(--wm-lime);}
.wm-thumb{height:210px;display:flex;align-items:flex-end;padding:20px;margin:0;transition:transform var(--dur-base) var(--ease-out);}
.wm-worktile:hover .wm-thumb{transform:scale(1.03);}
.wm-thumb h3{font-family:var(--font-display)!important;color:#fff;font-size:28px;text-transform:uppercase;line-height:.95;margin:0;}
.wm-meta{padding:16px 20px;font-size:14px;color:var(--text-secondary);margin:0;line-height:1.5;}
a.wm-worktile{display:block;color:inherit;text-decoration:none;}
.wm-meta strong{display:block;margin-bottom:6px;color:var(--text-primary);font-weight:700;}
.wm-visit{display:block;margin-top:12px;font-weight:700;color:var(--text-primary);text-decoration:underline;text-decoration-color:var(--wm-lime);text-decoration-thickness:2px;text-underline-offset:3px;}
.wm-worktile:hover .wm-visit{color:var(--wm-lime-ink);background:var(--wm-lime);border-radius:6px;padding:1px 6px;text-decoration:none;}

/* ---- Screenshot-only work tiles ---- */
.wm-worktile--shot .wm-thumb{height:240px;flex-direction:column;align-items:flex-start;justify-content:flex-end;gap:2px;}
.wm-thumb-tag{margin:0;font-family:var(--font-sans)!important;font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:rgba(255,255,255,.85);}
@media(max-width:781px){.wm-worktile--shot .wm-thumb{height:190px;}}

/* ---- AI-recommendation proof (Kera-uniek case) ---- */
.wm-ai-shot{border-radius:16px;overflow:hidden;border:1.5px solid var(--border-hairline);background:var(--wm-black);}
.wm-ai-shot img{display:block;width:100%;height:auto;}
.wm-ai-cap{margin:10px 0 0!important;font-size:13.5px!important;color:var(--text-muted)!important;text-align:center;}
.wm-ai-cap strong{color:var(--text-secondary);}
.wm-card .wm-note{font-size:14px!important;margin-top:20px!important;}

/* ---- CTA ---- */
.wm-cta{background:var(--wm-lime);border-radius:var(--radius-lg);padding:56px 24px;text-align:center;}
.wm-cta h2{font-size:clamp(2.4rem,5vw,3.6rem);color:var(--wm-lime-ink);line-height:.98!important;}
.wm-cta p{color:var(--wm-lime-ink);opacity:.85;max-width:520px;margin:14px auto 0;font-size:18px;}
.wm-cta .wp-block-buttons{justify-content:center;margin-top:28px;}

/* ---- Full-width brand nav (original design) ---- */
.wm-nav{position:sticky;top:0;z-index:100;display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:nowrap;padding:16px max(24px,calc((100% - 1200px) / 2));background:rgba(250,251,251,.82);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1.5px solid var(--border-hairline);}
/* Logo takes the left edge; nav links + language + CTA cluster on the right (CTA = the terminus). */
.wm-logo{margin:0;margin-right:auto;}
.wm-logo img{height:34px;width:auto;display:block;}
.wm-navlinks{display:flex;align-items:center;gap:4px;margin:0;}
.wm-navitem{margin:0;}
.wm-navitem a{display:inline-block;padding:9px 16px;border-radius:999px;font-size:15px;font-weight:500;color:var(--text-primary);text-decoration:none;transition:background .15s var(--ease-out);}
.wm-navitem a:hover{background:var(--wm-grey-100);}
.wm-nav .wp-block-buttons{margin:0;}
.wm-nav .wm-btn--accent .wp-block-button__link{padding:8px 16px;font-size:14px;border-radius:10px;}
.wm-nav .wm-btn--accent .wp-block-button__link:hover{transform:translate(-2px,-2px);box-shadow:3px 3px 0 var(--wm-black);}

/* ---- Brand footer ---- */
.wm-footer{background:var(--wm-black);color:#fff;padding:56px 32px 28px;}
.wm-footer-logo img{height:32px;width:auto;filter:invert(1);display:block;}
.wm-footer p,.wm-footer li,.wm-footer a{color:var(--wm-grey-400);}
.wm-foot-tag{max-width:340px;margin-top:16px!important;font-size:15px;}
.wm-foot-head{font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--wm-grey-500)!important;margin:0 0 14px;}
.wm-foot-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px;}
.wm-foot-link{font-size:15px;color:var(--wm-grey-300)!important;text-decoration:none;transition:color .15s var(--ease-out);}
.wm-foot-link:hover{color:var(--wm-lime)!important;}
.wm-foot-bottom{border-top:1px solid var(--wm-grey-800);margin-top:40px;padding-top:24px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;}
.wm-foot-bottom p{font-size:13px;color:var(--wm-grey-500)!important;margin:0;}

/* ---- Responsive ---- */
@media(max-width:781px){
  .wm-navlinks{display:none;}
  .wm-nav{padding:12px 20px;}
  .wm-section{padding-top:40px;padding-bottom:40px;}
}

/* remove theme's fixed-header offset + inter-section block gaps on the native home page */
.wm-native,.wm-native{padding-top:0!important;}
.wm-native .wp-block-post-content>*,.wm-native .wp-block-post-content>*{margin-block-start:0!important;margin-block-end:0!important;}

/* Dutch homepage: step numbers + case big stat */
.wm-step .wm-bignum{font-family:var(--font-display)!important;font-size:44px;line-height:1;color:var(--wm-black);margin:0 0 8px;}
.wm-casebig{font-family:var(--font-display)!important;font-size:clamp(3rem,7vw,5rem);line-height:.9;color:var(--wm-lime)!important;margin:0;}
.wm-stats p{margin:0;}

/* fix: generic .wm-card p (17px) was overriding special in-card typography — restore original sizes */
.wm-price-amt{font-family:var(--font-display)!important;font-size:48px!important;line-height:1!important;display:flex!important;align-items:baseline!important;flex-wrap:wrap!important;column-gap:10px!important;row-gap:4px!important;}
.wm-price-per{font-family:var(--font-sans)!important;font-size:15px!important;font-weight:500!important;line-height:1.4!important;color:var(--text-muted)!important;}
.wm-card--ink .wm-price-per{color:var(--wm-grey-400)!important;}
.wm-eyebrow{font-size:.75rem!important;}
.wm-badge{font-size:.75rem!important;}

/* hero pill: wrap in a full-width row so the inline pill aligns to the centered content column (not the far-left edge) */
.wm-pill-row{margin:0;line-height:1;}

/* fix: case-study card is meant to be a compact, left-aligned 820px box.
   The block's contentSize:820 only constrained the card's CHILDREN, leaving the
   card BOX full section width so it overflowed to the right. Constrain the box. */
/* card widths set natively via each section contentSize */

/* About: founder row (real person behind Web Mullet) */
.wm-founder{display:flex;align-items:center;gap:14px;margin-top:22px;}
.wm-founder .wm-avatar{margin:0;flex:0 0 auto;}
.wm-founder .wm-avatar img{width:64px;height:64px;border-radius:999px;object-fit:cover;display:block;}
.wm-card .wm-founder-name{margin:0;font-size:15px;line-height:1.4;color:var(--text-secondary);}
.wm-card .wm-founder-name strong{color:var(--text-primary);font-size:16px;}

/* fix: stacked cards in one column must size to content, not each fill 100% (prevents overlap) */
.wp-block-column > .wm-card:not(:only-child){height:auto;}

/* ============ FAQ (native wp:details accordion) ============ */
.wm-faq-item{background:var(--surface-card);border:1.5px solid var(--border-hairline);border-radius:var(--radius-md);margin:0 0 12px;transition:transform var(--dur-base) var(--ease-out),box-shadow var(--dur-base) var(--ease-out),border-color var(--dur-base) var(--ease-out);}
.wm-faq-item:hover{border-color:var(--wm-black);}
.wm-faq-item[open]{border-color:var(--wm-black);transform:translate(-3px,-3px);box-shadow:5px 5px 0 var(--wm-lime);}
.wm-faq-item summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 22px;font-family:var(--font-sans);font-weight:700;font-size:17px;line-height:1.35;color:var(--text-primary);}
.wm-faq-item summary::-webkit-details-marker{display:none;}
.wm-faq-item summary::after{content:"+";flex:0 0 auto;display:grid;place-items:center;width:28px;height:28px;border-radius:9px;background:var(--wm-lime);color:var(--wm-lime-ink);font-weight:500;font-size:19px;line-height:1;transition:transform var(--dur-base) var(--ease-out);}
.wm-faq-item[open] summary::after{transform:rotate(45deg);}
.wm-faq-item p{padding:0 56px 20px 22px;margin:0;color:var(--text-secondary);font-size:16px;line-height:1.55;}
/* smooth open/close where supported (Chrome 131+); instant elsewhere */
@supports (interpolate-size: allow-keywords){
  :root{interpolate-size:allow-keywords;}
  .wm-faq-item::details-content{opacity:0;block-size:0;overflow-y:clip;transition:content-visibility var(--dur-base) allow-discrete,opacity var(--dur-base) var(--ease-out),block-size var(--dur-base) var(--ease-out);}
  .wm-faq-item[open]::details-content{opacity:1;block-size:auto;}
}
/* left column: heading stays in view while scanning the questions */
.wm-faq-more{margin-top:18px;color:var(--text-secondary);font-size:16px;}
.wm-faq-more a{color:var(--text-primary);font-weight:700;text-decoration-thickness:2px;text-underline-offset:4px;text-decoration-color:var(--wm-lime);}
.wm-faq-more a:hover{background:var(--wm-lime);color:var(--wm-lime-ink);text-decoration:none;}
@media(min-width:782px){
  .wm-faq-aside{position:sticky;top:100px;align-self:flex-start;}
}
@media(max-width:781px){
  .wm-faq-item summary{padding:15px 16px;font-size:16px;}
  .wm-faq-item p{padding:0 16px 16px;}
}

/* ============ UI polish pass (modern, on-brand) ============ */
/* anchor jumps land below the sticky nav, and glide there */
html{scroll-behavior:smooth;}
:where([id]){scroll-margin-top:90px;}
/* brand text selection */
::selection{background:var(--wm-lime);color:var(--wm-lime-ink);}
/* visible keyboard focus, lime on dark surfaces */
:where(a,button,summary,input,textarea,select):focus-visible{outline:3px solid var(--wm-black);outline-offset:3px;}
.wm-card--ink :focus-visible,.wm-footer :focus-visible,.wm-card--lime :focus-visible{outline-color:currentColor;}
/* calmer rag on big headlines and body copy */
.wm-hero-title,.wm-shead,.wm-cta h2{text-wrap:balance;}
.wm-lead,.wm-card p{text-wrap:pretty;}
/* hero: faint dot grid, clipped to the section (flat, still brutalist) */
.wm-hero{position:relative;z-index:0;overflow:hidden;}
.wm-hero::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background-image:radial-gradient(circle at 1px 1px,var(--wm-grey-300) 1.2px,transparent 0);background-size:24px 24px;opacity:.5;-webkit-mask-image:radial-gradient(ellipse 75% 95% at 80% 0%,#000 0%,transparent 62%);mask-image:radial-gradient(ellipse 75% 95% at 80% 0%,#000 0%,transparent 62%);}
/* step numbers: lime chip instead of bare digit */
.wm-step .wm-bignum{display:grid;place-items:center;width:54px;height:54px;background:var(--wm-lime);color:var(--wm-lime-ink);border-radius:16px;font-size:26px;margin:0 0 16px;}
/* hero proof line: the one verifiable claim, right under the CTAs */
.wm-hero-proof{margin-top:26px;font-size:15px;line-height:1.5;color:var(--text-secondary);position:relative;padding-left:32px;max-width:620px;}
.wm-hero-proof::before{content:"✓";position:absolute;left:0;top:1px;display:grid;place-items:center;width:22px;height:22px;border-radius:7px;background:var(--wm-lime);color:var(--wm-lime-ink);font-weight:700;font-size:13px;}
.wm-hero-proof a{color:var(--text-primary);font-weight:700;text-decoration-thickness:2px;text-underline-offset:3px;text-decoration-color:var(--wm-lime);transition:background var(--dur-fast) var(--ease-out);}
.wm-hero-proof a:hover{background:var(--wm-lime);color:var(--wm-lime-ink);text-decoration:none;}
/* in-card text links (e.g. the Kera-uniek case link) */
.wm-card p a{color:var(--text-primary);font-weight:700;text-decoration-thickness:2px;text-underline-offset:4px;text-decoration-color:var(--wm-lime);transition:background var(--dur-fast) var(--ease-out);}
.wm-card p a:hover{background:var(--wm-lime);color:var(--wm-lime-ink);text-decoration:none;}
/* scroll-reveal: cards drift up as they enter the viewport (CSS-only, Chrome-line browsers;
   uses the separate `translate` property so it composes with the hover transform) */
@media (prefers-reduced-motion: no-preference){
  @supports (animation-timeline: view()){
    .wm-card,.wm-faq-item,.wm-worktile,.wm-cta{animation:wm-rise .6s var(--ease-out) both;animation-timeline:view();animation-range:entry 5% entry 38%;}
  }
}
@keyframes wm-rise{from{opacity:0;translate:0 24px;}to{opacity:1;translate:0 0;}}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
  .wm-card,.wm-btn .wp-block-button__link,.wm-faq-item,.wm-worktile{transition:none;}
}
/* ============ Section rhythm fix ============ */
/* The theme's generated per-instance .wp-container rules set a 40px block-gap
   AFTER our stylesheet loads, beating brand margins (same lesson as the nav
   flex-wrap). Restore the intended rhythm with !important. */
.wm-section > * + *{margin-block-start:28px!important;}
.wm-section > .wm-shead{margin-block-start:10px!important;}
.wm-section > .wp-block-columns + .wp-block-columns{margin-block-start:24px!important;}
.wm-section > .wm-note{margin-block-start:20px!important;}
.wm-hero > .wm-hero-title{margin-block-start:22px!important;}
.wm-hero > .wm-lead{margin-block-start:36px!important;}
.wm-hero > .wp-block-buttons{margin-block-start:32px!important;}
.wm-hero > .wm-hero-proof{margin-block-start:24px!important;}
.wm-faq-aside > .wm-shead{margin-block-start:10px!important;}
.wm-faq-aside > .wm-faq-more{margin-block-start:18px!important;}
.wm-faq > .wm-faq-item{margin:0!important;}
.wm-faq > .wm-faq-item + .wm-faq-item{margin-block-start:12px!important;}

/* ============ Language switcher (globe + NL/EN): a quiet utility, not a nav destination ============ */
.wm-navitem.wm-lang{margin-left:2px;}
.wm-navitem.wm-lang a{display:inline-flex;align-items:center;padding:8px 12px;border-radius:999px;font-size:13px;font-weight:700;letter-spacing:.03em;color:var(--text-secondary);}
.wm-navitem.wm-lang a:hover{background:var(--wm-grey-100);color:var(--text-primary);}
.wm-lang .wm-globe{display:block;flex:0 0 auto;margin-right:6px;}

/* ============ Cookie consent banner ============ */
.wm-cookie{position:fixed;left:16px;right:16px;bottom:16px;z-index:9999;max-width:600px;margin:0 auto;background:#0B0B0C;color:#fff;border-radius:16px;padding:16px 20px;display:flex;gap:16px;align-items:center;justify-content:space-between;flex-wrap:wrap;box-shadow:0 12px 40px rgba(0,0,0,.35);font-family:var(--font-sans);}
.wm-cookie[hidden]{display:none;}
.wm-cookie-text{margin:0;font-size:14px;line-height:1.45;color:#E1E3E7;flex:1 1 240px;}
.wm-cookie-actions{display:flex;gap:8px;flex:0 0 auto;}
.wm-cookie-btn{border:0;border-radius:999px;padding:10px 18px;font-weight:700;font-size:14px;cursor:pointer;font-family:var(--font-sans);transition:opacity .15s;}
.wm-cookie-btn:hover{opacity:.9;}
.wm-cookie-accept{background:var(--wm-lime);color:var(--wm-lime-ink);}
.wm-cookie-decline{background:transparent;color:#fff;border:1px solid var(--wm-grey-600);}
@media(max-width:520px){.wm-cookie{gap:12px;}.wm-cookie-actions{width:100%;}.wm-cookie-btn{flex:1;}}

/* Hamburger toggle: injected by JS, hidden on desktop. */
.wm-navtoggle{display:none;}

/* ============ Mobile design pass ============ */
@media(max-width:781px){
  /* Nav -> hamburger menu. flex-wrap must beat WP's generated .wp-container{flex-wrap:nowrap}, hence !important. */
  .wm-nav{flex-wrap:wrap!important;row-gap:0;padding:12px 16px;align-items:center;}
  .wm-logo{order:0;flex:0 0 auto;margin-right:auto;}
  .wm-logo img{height:30px;width:auto;}
  /* Cognitive load: keep the mobile bar to logo + menu only. Hide the consult CTA here (it's in the hero + every page). */
  .wm-nav > .wp-block-buttons{display:none!important;}
  .wm-navtoggle{order:2;display:flex;flex-direction:column;justify-content:center;gap:5px;width:44px;height:44px;padding:10px;border:0;background:transparent;cursor:pointer;flex:0 0 auto;}
  .wm-navtoggle span{display:block;width:22px;height:2px;background:var(--wm-black);border-radius:2px;transition:transform .2s ease,opacity .15s ease;}
  .wm-nav-open .wm-navtoggle span:nth-child(1){transform:translateY(7px) rotate(45deg);}
  .wm-nav-open .wm-navtoggle span:nth-child(2){opacity:0;}
  .wm-nav-open .wm-navtoggle span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}
  .wm-navlinks{order:3;flex-basis:100%!important;width:100%;display:none!important;}
  .wm-nav-open .wm-navlinks{display:flex!important;flex-direction:column;gap:0;padding-top:8px;margin-top:10px;border-top:1px solid var(--border-hairline);}
  .wm-navlinks .wm-navitem{margin:0;width:100%;}
  .wm-navlinks .wm-navitem a{display:block;padding:13px 6px;font-size:16px;white-space:nowrap;}

  /* Hero: fluid title, looser line-height so the highlight box never overlaps the line above. */
  .wm-hero{padding-top:36px;padding-bottom:40px;}
  .wm-hero-title{font-size:clamp(2.3rem,9vw,3.2rem)!important;line-height:1.16!important;}
  .wm-highlight{border-radius:8px;padding-top:0;padding-bottom:0;}
  .wm-lead{font-size:17px;margin-top:22px;}
  .wm-shead{font-size:clamp(1.8rem,7vw,2.4rem)!important;}
  .wm-card{padding:24px;}
  .wm-cta{padding:40px 20px;}
  .wm-cta h2{font-size:clamp(2rem,8vw,2.8rem)!important;}

  /* Hero buttons stack full-width for easy tapping. */
  .wm-hero .wp-block-buttons{flex-direction:column!important;align-items:stretch;}
  .wm-hero .wp-block-button,.wm-hero .wp-block-button .wp-block-button__link{width:100%!important;text-align:center;}
  .wm-price-amt{font-size:40px!important;}
  .wm-footer{padding:40px 20px 24px;}
}
@media(max-width:480px){
  .wm-section{padding-left:16px!important;padding-right:16px!important;}
  .wm-hero-title{font-size:clamp(2rem,10.5vw,2.9rem)!important;line-height:1.16!important;}
  .wm-card{padding:20px;}
}

/* ============ Mobile rework (cognitive-load pass, 2026-07-02) ============ */
@media(max-width:781px){
  /* Cards size to content: the 200px min-height only creates empty scroll on mobile. */
  .wm-card{min-height:0;}
  /* Calm screens: no scroll-reveal or lift motion on touch. */
  .wm-card,.wm-faq-item,.wm-worktile,.wm-cta{animation:none!important;}
  .wm-card:hover{transform:none;}
  .wm-faq-item[open]{transform:none;}
  /* Hero decoration scaled to the viewport. */
  .wm-hero::before{background-size:20px 20px;opacity:.4;}
  /* One clear action: primary CTA keeps full weight, secondary demotes to a text link. */
  .wm-hero .wm-btn--secondary .wp-block-button__link{background:transparent;border-color:transparent;padding:10px;text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:4px;text-decoration-color:var(--wm-lime);}
  .wm-hero .wm-btn--secondary .wp-block-button__link:hover{box-shadow:none;transform:none;}
  .wm-hero-proof{font-size:14px;margin-top:20px;}
  /* Step cards: number and title share one line; halves the vertical footprint. */
  .wm-step{display:grid;grid-template-columns:44px 1fr;column-gap:14px;align-items:center;}
  .wm-step .wm-bignum{grid-column:1;width:44px;height:44px;font-size:22px;border-radius:12px;margin:0;}
  .wm-step h3{grid-column:2;margin:0;}
  .wm-step p:not(.wm-bignum){grid-column:1 / -1;margin-top:10px;}
  /* FAQ: heading sits tight above the items; the "ask us" line duplicates the CTA band below it. */
  .wm-faq-more{display:none;}
  .wm-faq-aside .wm-shead{margin-bottom:0;}
  /* Consult CTA lives inside the open menu: bar stays logo + toggle, the action stays reachable. */
  .wm-nav.wm-nav-open > .wp-block-buttons{display:flex!important;order:4;flex-basis:100%;margin-top:6px;padding:4px 0 8px;}
  .wm-nav.wm-nav-open > .wp-block-buttons .wp-block-button{width:100%;}
  .wm-nav.wm-nav-open > .wp-block-buttons .wp-block-button__link{display:block;width:100%;text-align:center;padding:13px 16px;font-size:16px;}
}
@media(max-width:480px){
  .wm-section{padding-top:36px;padding-bottom:36px;}
  .wm-lead{font-size:16.5px;}
  .wm-hero-proof{font-size:13.5px;}
  .wm-price-amt{font-size:36px!important;}
  .wm-cta{padding:36px 18px;}
}
