/*
Theme Name: Waxing for Men
Theme URI: https://waxingformen.co.uk
Author: Mojoo Limited
Author URI: https://mojoo.co.uk
Description: Sharp, fast, made-to-measure theme for Waxing for Men Wolverhampton. Fonts stored in the theme (no outside font service), Call and WhatsApp everywhere, booking request form, and layouts for treatments and price lists.
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 7.4
License: GPLv2 or later
Text Domain: wfm
*/

/* Fonts: Archivo and JetBrains Mono, both SIL Open Font Licence, stored in /fonts */
@font-face{font-family:"Archivo";src:url(fonts/archivo.woff2) format("woff2");font-weight:100 900;font-stretch:62% 125%;font-display:swap}
@font-face{font-family:"JB Mono";src:url(fonts/jetbrains-mono.woff2) format("woff2");font-weight:100 800;font-display:swap}

:root{
  --ink:#0c0d0e;
  --coal:#131517;
  --steel:#1d2023;
  --edge:#2b2f33;
  --fog:#8d939a;
  --bone:#ecebe6;
  --paper:#f4f3ee;
  --rule:#d4d1c8;
  --hot:#ff5a1f;
  --hot-2:#e64808;
  --wa:#1fa855;
  --text:#16181a;
  --muted:#5d6166;
  --sans:"Archivo",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --mono:"JB Mono",ui-monospace,Menlo,Consolas,monospace;
  --wrap:1240px;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
html,body{overflow-x:clip}
body{margin:0;background:var(--paper);color:var(--text);font-family:var(--sans);font-size:17px;line-height:1.6;font-stretch:100%;-webkit-font-smoothing:antialiased}
img,svg,video{max-width:100%;height:auto;display:block}
a{color:inherit}
p{margin:0 0 1em}
h1,h2,h3,h4{font-family:var(--sans);font-stretch:68%;font-weight:850;text-transform:uppercase;line-height:.9;letter-spacing:-.005em;margin:0 0 .4em}
h1{font-size:clamp(56px,9vw,132px)}
h2{font-size:clamp(42px,6vw,84px)}
h3{font-size:30px;line-height:.95}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 28px}
.skip{position:absolute;left:-9999px}
.skip:focus{left:12px;top:12px;z-index:999;background:var(--hot);color:var(--ink);padding:10px 14px}
:focus-visible{outline:2px solid var(--hot);outline-offset:3px}
.mono,.eyebrow{font-family:var(--mono);font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;display:inline-block}
.eyebrow{color:var(--hot-2);margin-bottom:18px}
.eyebrow::before{content:"[ ";opacity:.6}.eyebrow::after{content:" ]";opacity:.6}
.lead{font-size:20px;color:var(--muted);max-width:640px}
.center{text-align:center}
.hot{color:var(--hot)}

/* ---------- buttons (all square-cut) */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;font-family:var(--sans);font-weight:750;font-stretch:88%;font-size:15px;letter-spacing:.06em;text-transform:uppercase;text-decoration:none;padding:15px 22px;border:2px solid transparent;cursor:pointer;line-height:1.1;transition:transform .15s,background .15s,color .15s,border-color .15s;clip-path:polygon(0 0,calc(100% - 12px) 0,100% 12px,100% 100%,0 100%)}
.btn svg{width:18px;height:18px;flex:none}
.btn:hover{transform:translateY(-2px)}
.btn-primary{background:var(--hot);color:var(--ink)}
.btn-primary:hover{background:#fff}
.btn-wa{background:var(--wa);color:#fff}
.btn-wa:hover{background:#178a45}
.btn-dark{background:var(--ink);color:#fff}
.btn-dark:hover{background:var(--steel)}
.btn-ghost{border-color:currentColor;color:inherit;background:transparent}
.btn-ghost:hover{background:var(--ink);color:#fff;border-color:var(--ink)}
.btn-row{display:flex;flex-wrap:wrap;gap:12px}

/* ---------- header */
.site-header{position:sticky;top:0;z-index:50;background:rgba(12,13,14,.94);backdrop-filter:blur(10px);color:#fff;border-bottom:1px solid var(--edge)}
.admin-bar .site-header{top:32px}
.hdr{display:flex;align-items:center;gap:28px;height:76px}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;margin-right:auto}
.brand-mark{width:40px;height:40px}
.brand-name{font-stretch:68%;font-weight:850;font-size:25px;text-transform:uppercase;line-height:.9;letter-spacing:.01em;display:flex;flex-direction:column}
.brand-name small{font-family:var(--mono);font-size:10px;font-weight:600;letter-spacing:.3em;color:var(--hot);margin-top:5px}
.nav ul{list-style:none;margin:0;padding:0;display:flex;gap:4px}
.nav a{font-family:var(--mono);font-size:13px;font-weight:600;text-transform:uppercase;letter-spacing:.08em;text-decoration:none;padding:10px 12px;display:block;color:#d9dadb;position:relative}
.nav a::after{content:"";position:absolute;left:12px;right:12px;bottom:4px;height:2px;background:var(--hot);transform:scaleX(0);transform-origin:left;transition:transform .2s}
.nav a:hover,.nav .current-menu-item a,.nav .current_page_item a{color:#fff}
.nav a:hover::after,.nav .current-menu-item a::after,.nav .current_page_item a::after{transform:scaleX(1)}
.nav-cta{display:none}
.hdr-cta{display:flex;align-items:center;gap:10px}
.hdr-cta .btn{padding:12px 18px}
.hdr-wa{width:46px;height:46px;display:grid;place-items:center;border:1px solid var(--edge);color:#3ddc84}
.hdr-wa svg{width:20px;height:20px}
.hdr-wa:hover{border-color:#3ddc84}
.menu-toggle{display:none;background:none;border:1px solid var(--edge);width:46px;height:46px;cursor:pointer;position:relative}
.menu-toggle span{position:absolute;left:12px;right:12px;height:2px;background:#fff;transition:transform .2s,top .2s}
.menu-toggle span:first-child{top:17px}.menu-toggle span:last-child{top:26px}
.menu-toggle[aria-expanded="true"] span:first-child{top:21px;transform:rotate(45deg)}
.menu-toggle[aria-expanded="true"] span:last-child{top:21px;transform:rotate(-45deg)}

/* ---------- hero */
.hero{background:var(--ink);color:#fff;position:relative;overflow:hidden;border-bottom:1px solid var(--edge)}
.hero::before{content:"";position:absolute;inset:0;background-image:linear-gradient(var(--coal) 1px,transparent 1px),linear-gradient(90deg,var(--coal) 1px,transparent 1px);background-size:64px 64px;opacity:.9;pointer-events:none}
.hero-grid{position:relative;display:grid;grid-template-columns:1.35fr 1fr;gap:56px;align-items:end;padding-top:84px;padding-bottom:84px}
.hero .mono{color:var(--fog)}
.hero .mono b{color:var(--hot);font-weight:600}
.hero h1{margin:26px 0 30px;font-size:clamp(68px,10.5vw,158px);line-height:.84;font-stretch:62%}
.hero h1 .ln{display:block;position:relative;width:max-content}
.hero h1 .outline{color:transparent;-webkit-text-stroke:2px var(--hot)}
.hero .lead{color:#b9bcc0}
.hero .btn-row{margin-top:30px}
.hero-facts{display:flex;flex-wrap:wrap;gap:0;margin:34px 0 0;padding:0;list-style:none;border-top:1px solid var(--edge)}
.hero-facts li{font-family:var(--mono);font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:#c9cbce;padding:14px 18px 0 0;margin-right:18px}
.hero-facts li::before{content:"+ ";color:var(--hot)}

/* wax strip that peels off the first line */
.strip{position:absolute;left:-2%;top:6%;width:104%;height:88%;background:
  repeating-linear-gradient(90deg,rgba(0,0,0,.06) 0 2px,transparent 2px 7px),
  linear-gradient(180deg,#ffd7a8,#f7c48b 55%,#efb06e);
  box-shadow:0 10px 30px rgba(0,0,0,.45);transform-origin:100% 50%;animation:peel 1.5s cubic-bezier(.7,0,.2,1) .7s forwards;pointer-events:none}
.strip::after{content:"PULL";position:absolute;right:10px;top:50%;transform:translateY(-50%) rotate(90deg);font-family:var(--mono);font-size:12px;letter-spacing:.3em;color:rgba(80,40,10,.55);font-stretch:100%;font-weight:700;-webkit-text-stroke:0}
@keyframes peel{
  0%{transform:none}
  25%{transform:rotate(-3deg) translateX(1%)}
  100%{transform:translate(70%,-160%) rotate(-24deg);opacity:0}
}

/* spec sheet */
.spec{background:var(--coal);border:1px solid var(--edge);position:relative}
.spec-hd{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid var(--edge)}
.spec-hd .mono{color:#fff}
.spec-hd .mono+.mono{color:var(--fog)}
.dial{display:flex;align-items:center;gap:20px;padding:22px 20px;border-bottom:1px solid var(--edge)}
.dial svg{width:92px;height:92px;flex:none}
.dial .ring{stroke-dasharray:264;stroke-dashoffset:264;animation:sweep 2.2s ease-out .9s forwards}
@keyframes sweep{to{stroke-dashoffset:52}}
.dial .hand{transform-origin:50px 50px;animation:tick 2.2s ease-out .9s forwards}
@keyframes tick{to{transform:rotate(288deg)}}
.dial p{margin:0;color:#c9cbce;font-size:15px;line-height:1.45}
.dial b{display:block;font-stretch:68%;font-weight:850;font-size:30px;text-transform:uppercase;color:#fff;line-height:1;margin-bottom:6px}
.spec table{width:100%;border-collapse:collapse}
.spec td{padding:13px 20px;border-bottom:1px solid var(--edge);font-size:15px;color:#e4e5e6}
.spec tr:last-child td{border-bottom:0}
.spec td.t{font-family:var(--mono);font-size:12px;color:var(--fog);white-space:nowrap}
.spec td.p{font-stretch:68%;font-weight:850;font-size:26px;color:var(--hot);text-align:right;white-space:nowrap}
.spec-ft{padding:14px 20px;border-top:1px solid var(--edge);font-family:var(--mono);font-size:11px;letter-spacing:.08em;color:var(--fog);text-transform:uppercase}
.spec-ft a{color:#fff}

/* ---------- ticker */
.ticker{background:var(--hot);color:var(--ink);overflow:hidden;border-bottom:1px solid var(--ink)}
.ticker-track{display:flex;width:max-content;animation:run 38s linear infinite}
.ticker span{font-stretch:62%;font-weight:850;text-transform:uppercase;font-size:30px;line-height:1;padding:16px 0;white-space:nowrap;display:flex;align-items:center}
.ticker span::after{content:"";width:12px;height:12px;background:var(--ink);margin:0 26px;transform:rotate(45deg)}
@keyframes run{to{transform:translateX(-50%)}}

/* ---------- sections */
.section{padding:110px 0}
.section-dark{background:var(--ink);color:#fff}
.section-dark .lead{color:#b9bcc0}
.section-dark .eyebrow{color:var(--hot)}
.section-bone{background:var(--bone)}
.section-head{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:end;margin-bottom:56px}
.section-head h2{margin:0}
.section-head .lead{margin:0}
.section-head.stack{display:block}
.section-head.stack .lead{margin-top:18px}

/* treatment tiles: hairline grid */
.tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--rule);border:1px solid var(--rule)}
.tile{background:var(--paper);padding:34px 30px 30px;text-decoration:none;display:flex;flex-direction:column;min-height:300px;position:relative;transition:background .2s,color .2s}
.tile .no{font-family:var(--mono);font-size:12px;color:var(--muted);letter-spacing:.1em;display:flex;justify-content:space-between}
.tile .no svg{width:26px;height:26px;color:var(--hot-2)}
.tile h3{font-size:40px;margin:38px 0 12px}
.tile p{color:var(--muted);font-size:16px;margin:0 0 20px}
.tile .from{margin-top:auto;display:flex;justify-content:space-between;align-items:end;border-top:1px solid var(--rule);padding-top:16px}
.tile .from span{font-family:var(--mono);font-size:12px;letter-spacing:.1em;text-transform:uppercase}
.tile .from b{font-stretch:68%;font-weight:850;font-size:34px;line-height:1}
.tile:hover{background:var(--ink);color:#fff}
.tile:hover p,.tile:hover .no{color:#b9bcc0}
.tile:hover .from{border-color:var(--edge)}
.tile:hover .from b{color:var(--hot)}

/* wax method: two panels */
.method{display:grid;grid-template-columns:1fr 1fr;border:1px solid var(--edge)}
.method>div{padding:44px 40px}
.method>div+div{border-left:1px solid var(--edge)}
.method .tag{font-family:var(--mono);font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--fog)}
.method h3{font-size:56px;margin:14px 0 6px}
.method .sub{font-family:var(--mono);color:var(--hot);font-size:13px;text-transform:uppercase;letter-spacing:.1em;margin-bottom:20px;display:block}
.method p{color:#c9cbce}
.method ul{list-style:none;padding:0;margin:22px 0 0;border-top:1px solid var(--edge)}
.method li{padding:12px 0;border-bottom:1px solid var(--edge);color:#e4e5e6;font-size:15px;display:flex;gap:12px}
.method li::before{content:"\2192";color:var(--hot)}
.note-bar{margin-top:1px;border:1px solid var(--edge);border-top:0;padding:20px 40px;display:flex;gap:16px;align-items:center;color:#c9cbce;font-size:15px}
.note-bar svg{width:24px;height:24px;color:var(--hot);flex:none}

/* who comes to us */
.who{display:grid;grid-template-columns:1fr 1.2fr;gap:70px;align-items:start}
.who-list{list-style:none;margin:0;padding:0;border-top:2px solid var(--ink)}
.who-list li{display:grid;grid-template-columns:56px 1fr auto;gap:12px;align-items:baseline;padding:18px 0;border-bottom:1px solid var(--rule)}
.who-list .n{font-family:var(--mono);font-size:12px;color:var(--muted)}
.who-list b{font-stretch:68%;font-weight:850;font-size:30px;text-transform:uppercase;line-height:1}
.who-list span:last-child{color:var(--muted);font-size:15px;text-align:right}
.quote-box{background:var(--ink);color:#fff;padding:40px;margin-top:34px;position:relative}
.quote-box::before{content:"";position:absolute;left:0;top:0;width:6px;height:100%;background:var(--hot)}
.quote-box p{font-size:19px;margin:0}

/* steps */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--rule);border:1px solid var(--rule);counter-reset:s}
.step{background:var(--paper);padding:34px 30px}
.step .n{font-stretch:62%;font-weight:850;font-size:84px;line-height:.8;color:transparent;-webkit-text-stroke:1.5px var(--ink);display:block;margin-bottom:22px}
.step h3{font-size:30px}
.step p{color:var(--muted);margin:0}

/* big call-to-action */
.cta{background:var(--hot);color:var(--ink);padding:90px 0;position:relative;overflow:hidden}
.cta::after{content:"";position:absolute;right:-80px;top:-60px;width:420px;height:420px;border:60px solid rgba(12,13,14,.08);transform:rotate(18deg)}
.cta-in{position:relative;z-index:1;display:grid;grid-template-columns:1.4fr 1fr;gap:40px;align-items:end}
.cta h2{font-size:clamp(52px,8vw,120px);margin:0}
.cta p{font-size:19px;font-weight:500}
.cta .mono{margin-bottom:16px}
.cta .btn-primary{background:var(--ink);color:#fff}
.cta .btn-primary:hover{background:#fff;color:var(--ink)}

/* ---------- inner pages */
.page-hero{background:var(--ink);color:#fff;padding:76px 0 64px;border-bottom:1px solid var(--edge);position:relative;overflow:hidden}
.page-hero::before{content:"";position:absolute;inset:0;background-image:linear-gradient(var(--coal) 1px,transparent 1px),linear-gradient(90deg,var(--coal) 1px,transparent 1px);background-size:64px 64px}
.page-hero .wrap{position:relative}
.page-hero .mono{color:var(--hot)}
.page-hero h1{margin:18px 0 18px;font-stretch:62%}
.page-hero .lead{color:#b9bcc0;margin:0}

/* treatment blocks */
.tblock{display:grid;grid-template-columns:330px 1fr;gap:60px;padding:70px 0;border-bottom:1px solid var(--rule);scroll-margin-top:100px}
.tblock:last-child{border-bottom:0}
.tblock-side{position:sticky;top:120px;align-self:start}
.tblock-side .no{font-family:var(--mono);font-size:12px;color:var(--hot-2);letter-spacing:.12em}
.tblock-side h2{font-size:58px;margin:12px 0 14px}
.tblock-side p{color:var(--muted)}
.tlist{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--rule);border:1px solid var(--rule)}
.titem{background:var(--paper);padding:26px 24px}
.titem h3{font-size:26px;margin:0 0 8px}
.titem p{margin:0;color:var(--muted);font-size:15px}
.titem .meta{display:flex;justify-content:space-between;margin-top:16px;font-family:var(--mono);font-size:12px;color:var(--muted)}
.titem .meta b{color:var(--text);font-family:var(--sans);font-stretch:68%;font-weight:850;font-size:24px;line-height:1}

/* price list */
.price-nav{display:flex;flex-wrap:wrap;gap:0;border:1px solid var(--rule);margin-bottom:60px;background:var(--paper);position:sticky;top:76px;z-index:5}
.admin-bar .price-nav{top:108px}
.price-nav a{font-family:var(--mono);font-size:12px;letter-spacing:.1em;text-transform:uppercase;text-decoration:none;padding:14px 18px;border-right:1px solid var(--rule)}
.price-nav a:hover{background:var(--ink);color:#fff}
.pgroup{margin-bottom:70px;scroll-margin-top:150px}
.pgroup-hd{display:flex;justify-content:space-between;align-items:end;border-bottom:3px solid var(--ink);padding-bottom:12px;margin-bottom:0}
.pgroup-hd h2{font-size:56px;margin:0}
.pgroup-hd .mono{color:var(--muted)}
.prow{display:grid;grid-template-columns:1fr 130px 100px;gap:20px;align-items:center;padding:18px 0;border-bottom:1px solid var(--rule)}
.prow:hover{background:linear-gradient(90deg,transparent,rgba(255,90,31,.08))}
.prow .nm{font-weight:650;font-size:18px}
.prow .nm small{display:block;font-weight:400;color:var(--muted);font-size:14px;margin-top:2px}
.prow .tm{font-family:var(--mono);font-size:13px;color:var(--muted)}
.prow .pr{font-stretch:68%;font-weight:850;font-size:32px;text-align:right;line-height:1}
.pgroup.bundles .pgroup-hd{border-color:var(--hot)}
.pgroup.bundles .pr{color:var(--hot-2)}
.small-print{font-family:var(--mono);font-size:12px;color:var(--muted);letter-spacing:.04em;text-transform:uppercase;border:1px dashed var(--rule);padding:18px 20px}

/* about */
.about-grid{display:grid;grid-template-columns:1.25fr 1fr;gap:70px;align-items:start}
.prose{max-width:780px}
.prose h2{font-size:44px;margin:1.3em 0 .5em}
.prose h2:first-child{margin-top:0}
.prose a{color:var(--hot-2)}
.prose ul{padding-left:20px}
.fact-stack{border:1px solid var(--rule);background:var(--paper)}
.fact{padding:24px 26px;border-bottom:1px solid var(--rule);display:flex;gap:18px}
.fact:last-child{border-bottom:0}
.fact svg{width:26px;height:26px;color:var(--hot-2);flex:none;margin-top:3px}
.fact b{display:block;font-stretch:68%;font-weight:850;font-size:24px;text-transform:uppercase;line-height:1;margin-bottom:6px}
.fact p{margin:0;color:var(--muted);font-size:15px}
.big-stat{background:var(--ink);color:#fff;padding:30px 26px;display:flex;align-items:end;gap:16px}
.big-stat b{font-stretch:62%;font-weight:850;font-size:110px;line-height:.78;color:var(--hot)}
.big-stat span{font-family:var(--mono);font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:#c9cbce}

/* contact */
.contact-grid{display:grid;grid-template-columns:1fr 1.15fr;gap:60px;align-items:start}
.c-cards{border:1px solid var(--rule)}
.c-card{display:flex;gap:18px;align-items:center;padding:24px 26px;border-bottom:1px solid var(--rule);text-decoration:none;background:var(--paper);transition:background .15s,color .15s}
.c-card:last-child{border-bottom:0}
a.c-card:hover{background:var(--ink);color:#fff}
.c-card .ic{width:50px;height:50px;display:grid;place-items:center;background:var(--ink);color:var(--hot);flex:none}
a.c-card:hover .ic{background:var(--hot);color:var(--ink)}
.c-card .ic svg{width:22px;height:22px}
.c-card .ic.wa{color:#3ddc84}
.c-card .mono{color:var(--muted);font-size:11px}
.c-card b{display:block;font-stretch:72%;font-weight:850;font-size:26px;line-height:1.05;text-transform:uppercase;word-break:break-word}
.c-card b.em{font-size:18px;text-transform:none;font-stretch:90%}
.c-card p{margin:4px 0 0;color:var(--muted);font-size:14px}
.form-box{background:var(--ink);color:#fff;padding:40px;position:relative}
.form-box::before{content:"";position:absolute;top:0;left:0;right:0;height:6px;background:var(--hot)}
.form-box h2{font-size:48px;margin:0 0 10px}
.form-box>p{color:#b9bcc0}
.wfm-form{margin-top:24px}
.wfm-form .row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.wfm-form .f{margin-bottom:18px}
.wfm-form label{display:block;font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:#c9cbce;margin-bottom:8px}
.wfm-form input[type=text],.wfm-form input[type=tel],.wfm-form input[type=email],.wfm-form select,.wfm-form textarea{width:100%;font:inherit;font-size:16px;color:#fff;background:var(--coal);border:1px solid var(--edge);border-radius:0;padding:14px 14px;appearance:none}
.wfm-form select{background-image:linear-gradient(45deg,transparent 50%,#fff 50%),linear-gradient(135deg,#fff 50%,transparent 50%);background-position:calc(100% - 20px) 50%,calc(100% - 15px) 50%;background-size:5px 5px;background-repeat:no-repeat}
.wfm-form input:focus,.wfm-form select:focus,.wfm-form textarea:focus{outline:none;border-color:var(--hot);box-shadow:0 0 0 1px var(--hot)}
.wfm-form ::placeholder{color:#6e7378}
.wfm-form .consent{display:flex;gap:12px;align-items:flex-start;font-family:var(--sans);font-size:14px;letter-spacing:0;text-transform:none;color:#c9cbce}
.wfm-form .consent input{margin-top:3px;accent-color:var(--hot);width:18px;height:18px;flex:none}
.wfm-form .consent a{color:#fff}
.wfm-form .btn{width:100%;margin-top:6px}
.wfm-form .hp{position:absolute;left:-9999px}
.wfm-err{background:#3a1208;border:1px solid var(--hot);color:#ffd2c0;padding:14px 16px;margin-bottom:18px;font-size:15px}
.wfm-ok{background:#0f2a19;border:1px solid var(--wa);color:#c8f5d6;padding:22px;font-size:17px;margin-top:24px}

/* ---------- footer */
.site-footer{background:var(--ink);color:#c9cbce;padding:80px 0 120px;font-size:15px;overflow:hidden}
.ft-big{font-stretch:62%;font-weight:850;text-transform:uppercase;font-size:clamp(40px,9.4vw,128px);line-height:.85;color:var(--steel);letter-spacing:-.01em;margin-bottom:60px;white-space:nowrap}
.ft-big span{color:var(--hot);margin:0 .18em}
.ft-grid{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:40px;border-top:1px solid var(--edge);padding-top:40px}
.ft-grid .mono{color:#fff;margin-bottom:16px}
.ft-grid ul{list-style:none;margin:0;padding:0}
.ft-grid li{margin-bottom:9px}
.ft-grid a{text-decoration:none}
.ft-grid a:hover{color:var(--hot)}
.ft-bottom{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;border-top:1px solid var(--edge);margin-top:50px;padding-top:24px;font-family:var(--mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--fog)}
.ft-bottom a{color:#fff;text-decoration:none}

/* sticky bar on phones */
.mbar{display:none}

/* blog list leftovers */
.post-list article{border-bottom:1px solid var(--rule);padding:30px 0}
.card-link{display:inline-flex;align-items:center;gap:8px;font-weight:700;text-decoration:none;color:var(--hot-2)}
.card-link svg{width:18px;height:18px;flex:none}

/* ---------- responsive */
@media (max-width:1100px){
  .hdr-cta .btn span{display:none}
  .hero-grid{grid-template-columns:1fr;align-items:start}
  .spec{max-width:560px}
}
@media (max-width:960px){
  .menu-toggle{display:block}
  .site-header{backdrop-filter:none;-webkit-backdrop-filter:none;background:var(--ink)}
  .hdr-cta{display:none}
  .nav{position:fixed;inset:76px 0 0 0;background:var(--ink);padding:24px 28px 40px;clip-path:inset(0 0 0 100%);visibility:hidden;transition:clip-path .3s,visibility .3s;overflow:auto;border-top:1px solid var(--edge)}
  .admin-bar .nav{top:122px}
  .nav.open{clip-path:inset(0);visibility:visible}
  .nav ul{flex-direction:column;gap:0}
  .nav li{border-bottom:1px solid var(--edge)}
  .nav a{font-family:var(--sans);font-stretch:62%;font-weight:850;font-size:46px;letter-spacing:0;padding:16px 0;color:#fff}
  .nav a::after{display:none}
  .nav .current-menu-item a,.nav .current_page_item a{color:var(--hot)}
  .nav-cta{display:grid;gap:12px;margin-top:30px}
  .nav .nav-cta .btn{font-family:var(--sans);font-stretch:88%;font-size:15px;letter-spacing:.06em;padding:16px 22px;display:flex}
  .nav .nav-cta .btn-primary{color:var(--ink)}
  body.nav-open .mbar{display:none}
  body.nav-open{overflow:hidden}
  .section{padding:80px 0}
  .section-head{grid-template-columns:1fr;gap:18px}
  .tiles{grid-template-columns:1fr 1fr}
  .method{grid-template-columns:1fr}
  .method>div+div{border-left:0;border-top:1px solid var(--edge)}
  .who,.about-grid,.contact-grid,.cta-in{grid-template-columns:1fr;gap:40px}
  .steps{grid-template-columns:1fr}
  .tblock{grid-template-columns:1fr;gap:28px;padding:50px 0}
  .tblock-side{position:static}
  .ft-grid{grid-template-columns:1fr 1fr}
  .ft-grid>div:first-child{grid-column:1/-1}
}
@media (max-width:782px){.admin-bar .site-header{top:46px}.admin-bar .nav{top:122px}}
@media (max-width:640px){
  body{font-size:16px}
  .wrap{padding:0 18px}
  .hdr{height:68px}
  .nav{inset:68px 0 0 0}
  .brand-name{font-size:22px}
  .hero-grid{padding-top:56px;padding-bottom:56px;gap:40px}
  .hero h1{font-size:clamp(58px,19vw,96px)}
  .hero .btn-row .btn{flex:1 1 100%}
  .tiles,.tlist{grid-template-columns:1fr}
  .tile{min-height:0}
  .tile h3{margin-top:22px}
  .method>div{padding:32px 22px}
  .note-bar{padding:18px 22px}
  .method h3{font-size:46px}
  .who-list li{grid-template-columns:40px 1fr}
  .who-list span:last-child{grid-column:2;text-align:left}
  .prow{grid-template-columns:1fr auto;gap:4px 14px}
  .prow .tm{grid-row:2;grid-column:1}
  .prow .pr{grid-row:1/3;grid-column:2;font-size:28px}
  .price-nav{position:static}
  .pgroup-hd h2{font-size:42px}
  .pgroup-hd .mono{display:none}
  .form-box{padding:30px 20px}
  .wfm-form .row{grid-template-columns:1fr;gap:0}
  .ft-grid{grid-template-columns:1fr}
  .ticker span{font-size:24px}
  .big-stat b{font-size:84px}
  .mbar{display:grid;grid-template-columns:1fr 1fr;gap:1px;position:fixed;left:0;right:0;bottom:0;z-index:60;background:var(--ink);padding:0;border-top:1px solid var(--edge)}
  .mbar .btn{clip-path:none;padding:18px 10px}
  .site-footer{padding-bottom:110px}
}
@media (prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important;scroll-behavior:auto!important}
  .strip{display:none}
  .dial .ring{stroke-dashoffset:52}
  .dial .hand{transform:rotate(288deg)}
}