/* ==========================================================================
   Mainway Hire
   Yard colours: navy, hazard yellow, hard shadows, condensed caps. Neutrals are
   warm greys, never blue greys (Ciaran, 21 Sep 2026: "I really don't appreciate
   this baby-grayish-bluish tone"). Text on dark surfaces runs near white.
   The FAQ block is the WCAG.ie "faqx" pattern carried across; the hire cards
   follow the Aesthetic Medicine product grid.
   ========================================================================== */

:root{
	--navy:#07162b;
	--navy-2:#0d2542;
	--navy-line:#2b4865;
	--yellow:#f7c948;
	--yellow-bright:#ffda5e;
	--paper:#f5f4f1;          /* warm, not blue */
	--paper-2:#ebe9e4;
	--white:#fff;
	--ink:#12202f;
	--muted:#303b47;          /* body text on light: 10:1 on paper */
	--muted-soft:#5a6470;     /* small meta only */
	--on-navy:#eaf1f8;        /* body text on navy */
	--on-navy-soft:#c8d6e4;
	--line:#d9d6cf;
	--mono:"Roboto Mono",ui-monospace,monospace;
	--head:"Barlow Condensed",system-ui,sans-serif;
	--body:"Barlow",system-ui,-apple-system,sans-serif;
	--wrap:1180px;
	--gutter:24px;
	--ease:cubic-bezier(.4,0,.2,1);
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{animation:none!important;transition:none!important}}

body{margin:0;background:var(--paper);color:var(--ink);font:500 17px/1.6 var(--body);-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
button,input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:3px solid var(--navy);outline-offset:3px}
.mw-top :focus-visible,.mw-blueprint :focus-visible,.mw-dark :focus-visible,.mw-faqx__ask :focus-visible,
.mw-wiz__head :focus-visible,.mw-sticky :focus-visible,.mw-total :focus-visible{outline-color:var(--yellow)}

.mw-wrap{width:min(var(--wrap),calc(100% - (var(--gutter) * 2)));margin-inline:auto}
.mw-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.mw-skip{position:absolute;left:-9999px;top:0;background:var(--yellow);color:var(--navy);padding:12px 18px;font-weight:700;z-index:100}
.mw-skip:focus{left:0}
/* spam trap: a field people never see or reach; bots fill it in */
.mw-hp{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden}

/* ---------------------------------------------------------------- type --- */

.mw-kicker{margin:0 0 12px;color:#5f4a00;font:700 .76rem/1.4 var(--mono);letter-spacing:.14em;text-transform:uppercase}
.mw-kicker--light{color:var(--yellow)}
.mw-h2{margin:0 0 18px;font:900 clamp(2rem,3.8vw,3.1rem)/1.02 var(--head);text-transform:uppercase;letter-spacing:-.01em}
.mw-h2--light{color:var(--white)}
.mw-h3{margin:0 0 10px;font:800 clamp(1.35rem,2.1vw,1.8rem)/1.08 var(--head);text-transform:uppercase}
.mw-lead{max-width:64ch;color:var(--muted);font-size:1.1rem;font-weight:500}
.mw-note{color:var(--muted);font-size:1rem;font-weight:500;max-width:70ch}

.mw-blueprint{
	background-color:var(--navy);
	background-image:
		linear-gradient(rgba(145,195,237,.1) 1px,transparent 1px),
		linear-gradient(90deg,rgba(145,195,237,.1) 1px,transparent 1px),
		linear-gradient(rgba(145,195,237,.045) 1px,transparent 1px),
		linear-gradient(90deg,rgba(145,195,237,.045) 1px,transparent 1px);
	background-size:80px 80px,80px 80px,16px 16px,16px 16px;
	color:var(--white);
}
.mw-hazard{height:8px;margin:0;background:repeating-linear-gradient(135deg,var(--yellow) 0 16px,#111 16px 32px)}

/* -------------------------------------------------------------- buttons --- */

.mw-btn{
	display:inline-flex;align-items:center;justify-content:center;gap:10px;
	min-height:52px;padding:0 24px;border:2px solid transparent;
	font:800 1.05rem var(--head);letter-spacing:.04em;text-transform:uppercase;
	text-decoration:none;cursor:pointer;background:none;
	transition:transform .12s var(--ease),box-shadow .12s var(--ease),background-color .12s var(--ease);
}
.mw-btn--primary{background:var(--yellow);color:var(--navy);box-shadow:5px 5px 0 #000}
.mw-btn--primary:hover{background:var(--yellow-bright);transform:translate(-1px,-1px);box-shadow:7px 7px 0 #000}
.mw-btn--outline{border-color:var(--yellow);color:var(--yellow)}
.mw-btn--outline:hover{background:rgba(247,201,72,.14)}
.mw-btn--ghost{border-color:#8d949d;color:var(--ink)}
.mw-btn--ghost:hover{background:var(--paper-2)}
.mw-btn--quiet{border-color:var(--navy);color:var(--navy);transition:none}
.mw-btn--quiet:hover{background:var(--navy);color:var(--yellow)}
.mw-btn--big{min-height:62px;padding:0 32px;font-size:1.25rem}
.mw-btn[disabled]{opacity:.6;cursor:progress}

/* --------------------------------------------------------------- header --- */

.mw-top{position:sticky;top:0;z-index:20;background:#061224;color:var(--white)}
.mw-top__inner{display:flex;align-items:center;gap:22px;min-height:78px}
.mw-brand{display:flex;align-items:center;gap:12px;text-decoration:none;margin-right:auto}
.mw-brand__mark{display:grid;place-items:center;width:44px;height:44px;flex:none;border:2px solid var(--yellow);color:var(--yellow);font:900 1.15rem var(--head);transform:skew(-6deg)}
.mw-brand__name{font:800 1.4rem var(--head);text-transform:uppercase}
.mw-nav__list{display:flex;gap:26px;margin:0;padding:0;list-style:none}
.mw-nav__list a{text-decoration:none;font:700 .95rem var(--head);letter-spacing:.06em;text-transform:uppercase;padding:6px 0;border-bottom:2px solid transparent}
.mw-nav__list a:hover,.mw-nav__list .current-menu-item a{border-bottom-color:var(--yellow);color:var(--yellow)}
.mw-top__actions{display:flex;align-items:center;gap:12px}
.mw-top__call,.mw-top__cta{min-height:46px;padding:0 18px;font-size:.98rem}
.mw-top__call{border-color:#fff;color:#fff}
.mw-top__cta{box-shadow:4px 4px 0 #000}

/* menu button and phone menu (shown below the desktop menu's width) */
.mw-burger{display:none;place-items:center;width:46px;height:46px;flex:none;border:2px solid #fff;background:none;color:#fff;cursor:pointer}
.mw-burger__bars,.mw-burger__bars::before,.mw-burger__bars::after{display:block;width:20px;height:2px;background:currentColor;transition:transform .2s var(--ease),background-color .2s var(--ease)}
.mw-burger__bars{position:relative}
.mw-burger__bars::before,.mw-burger__bars::after{content:"";position:absolute;left:0}
.mw-burger__bars::before{top:-6px}
.mw-burger__bars::after{top:6px}
.mw-burger[aria-expanded="true"] .mw-burger__bars{background:transparent}
.mw-burger[aria-expanded="true"] .mw-burger__bars::before{top:0;transform:rotate(45deg)}
.mw-burger[aria-expanded="true"] .mw-burger__bars::after{top:0;transform:rotate(-45deg)}
/* the menu drawer: slides in from the left over a dimmed page */
.mw-drawer{margin:0;padding:0;border:0;inset:0 auto 0 0;width:min(380px,88vw);max-width:none;height:100%;max-height:none;background:var(--navy);color:var(--white);overflow-y:auto}
.mw-drawer::backdrop{background:rgba(3,12,24,.72)}
.mw-drawer[open]{animation:mw-drawer-in .22s var(--ease)}
@keyframes mw-drawer-in{from{transform:translateX(-100%)}to{transform:none}}
html:has(.mw-drawer[open]),html:has(.mw-wiz--modal[open]){overflow:hidden}
.mw-drawer :focus-visible{outline-color:var(--yellow)}
.mw-drawer__in{min-height:100%;padding-bottom:26px}
.mw-drawer__head{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:14px 20px;background:#061224}
.mw-drawer__t{display:flex;align-items:center;gap:12px;margin:0;font:800 1.2rem var(--head);text-transform:uppercase;color:var(--white)}
.mw-drawer__t .mw-brand__mark{width:38px;height:38px;font-size:1rem}
.mw-drawer__close{width:44px;height:44px;flex:none;border:2px solid #fff;background:none;color:#fff;font-size:1.6rem;line-height:1;cursor:pointer}
.mw-drawer__sec{padding:22px 20px 6px}
.mw-drawer__sec+.mw-drawer__sec{border-top:1px solid var(--navy-line);margin-top:10px}
.mw-drawer__k{margin:0 0 8px;font:700 .72rem var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--yellow)}
.mw-drawer__pages{margin:0;padding:0;list-style:none}
.mw-drawer__pages a{display:block;padding:11px 0;border-bottom:1px solid var(--navy-line);font:800 1.45rem var(--head);letter-spacing:.02em;text-transform:uppercase;color:#fff;text-decoration:none}
.mw-drawer__pages li:last-child a{border-bottom:0}
.mw-drawer__pages .current-menu-item a{color:var(--yellow)}
.mw-drawer__prices{margin:0;padding:0;list-style:none}
.mw-drawer__prices li{display:flex;align-items:baseline;justify-content:space-between;gap:14px;padding:12px 0;border-bottom:1px solid var(--navy-line)}
.mw-drawer__item{font-weight:700;color:#fff}
.mw-drawer__item small{display:block;margin-top:2px;font-weight:500;font-size:.84rem;color:var(--on-navy-soft)}
.mw-drawer__from{font:800 1.4rem var(--head);color:var(--yellow);white-space:nowrap}
.mw-drawer__note{margin:12px 0 0;font-size:.92rem;color:var(--on-navy)}
.mw-drawer .mw-btn{width:100%;margin-top:16px}
.mw-drawer__phone{display:inline-block;margin:2px 0 8px;font:800 2.1rem/1 var(--head);color:var(--yellow);text-decoration:none}
.mw-drawer__mail{font-weight:700;color:#fff}
.mw-drawer p{margin:0 0 6px;color:var(--on-navy)}
.mw-drawer__hours{font-size:.92rem}
.mw-drawer__areas{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0 0;padding:0;list-style:none}
.mw-drawer__areas li{border:1.5px solid var(--yellow);padding:6px 10px;font:700 .76rem var(--body);letter-spacing:.05em;text-transform:uppercase;color:#fff}
@media (prefers-reduced-motion:reduce){.mw-drawer[open]{animation:none}}

/* ----------------------------------------------------------------- hero --- */

.mw-hero{padding:76px 0 0;border-bottom:1px solid var(--navy-line)}
.mw-hero__grid{display:grid;grid-template-columns:1.1fr .9fr;gap:56px;align-items:center}
.mw-hero__title{margin:0 0 20px;font:900 clamp(2.4rem,4.6vw,3.9rem)/.98 var(--head);text-transform:uppercase;letter-spacing:-.02em}
.mw-hero__where{display:block;margin-top:14px;color:var(--yellow);font:600 clamp(1.05rem,1.5vw,1.3rem)/1.35 var(--body);letter-spacing:.01em;text-transform:none}
.mw-hero__lead{max-width:54ch;color:var(--on-navy);font-size:1.18rem}
.mw-hero__lead p{margin:0 0 14px}
.mw-hero__actions{display:flex;flex-wrap:wrap;gap:16px;margin-top:30px}
.mw-hero__card{position:relative}
.mw-hero__card img{width:100%;aspect-ratio:4/3;object-fit:cover;border:1px solid var(--navy-line)}
.mw-tag{position:absolute;right:-14px;bottom:-24px;background:var(--yellow);color:var(--navy);padding:18px 24px;box-shadow:8px 8px 0 #000}
.mw-tag__label{margin:0;font:700 .7rem var(--mono);letter-spacing:.12em;text-transform:uppercase}
.mw-tag__figure{margin:4px 0 2px;font:800 clamp(2.6rem,4vw,3.4rem)/.9 var(--head);letter-spacing:0}
.mw-tag__unit{margin:0;font:700 .78rem var(--mono);text-transform:uppercase}
.mw-hero__honest{
	margin:54px auto 0;padding:18px 0 22px 22px;
	border-top:1px solid var(--navy-line);border-left:4px solid var(--yellow);
	color:var(--on-navy);font-size:1rem;
}

/* ---------------------------------------------------------------- steps --- */

.mw-steps{padding:80px 0;background:var(--white)}
.mw-steps__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin:36px 0 0;padding:0;list-style:none}
.mw-steps__grid li{background:var(--paper);border:1px solid var(--line);border-top:5px solid var(--navy);padding:26px 24px 28px}
.mw-steps__no{display:inline-grid;place-items:center;width:40px;height:40px;margin-bottom:14px;background:var(--navy);color:var(--yellow);font:700 .9rem var(--mono)}
.mw-steps__grid h3{margin:0 0 10px;font:800 1.42rem var(--head);text-transform:uppercase;color:var(--ink)}
.mw-steps__grid p{margin:0;color:var(--muted)}

/* ------------------------------------------------------- the hire cards --- */

.mw-items{padding:80px 0;background:var(--paper)}
.mw-items__head{display:flex;justify-content:space-between;align-items:end;gap:28px;flex-wrap:wrap;margin-bottom:34px}
.mw-items__head p.mw-lead{margin:0}
.mw-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:26px}
.mw-prod{display:flex;flex-direction:column;background:var(--white);border:1px solid var(--line)}
.mw-prod__tile{position:relative;background:var(--paper-2)}
.mw-prod__tile img{width:100%;aspect-ratio:4/3;object-fit:cover}
.mw-prod__size{position:absolute;top:14px;right:14px;margin:0;background:rgba(7,22,43,.92);color:var(--yellow);padding:6px 10px;font:600 .7rem var(--mono);letter-spacing:.06em}
.mw-prod__body{display:flex;flex-direction:column;flex:1;padding:26px 26px 0}
.mw-prod__body p{color:var(--muted);margin:0 0 20px}
.mw-prod__rates{display:grid;grid-template-columns:repeat(auto-fit,minmax(92px,1fr));gap:1px;margin:0 0 22px;background:var(--line);border:1px solid var(--line)}
.mw-prod__rate{background:var(--white);padding:12px 14px}
.mw-prod__rate dt{color:var(--muted-soft);font:700 .68rem var(--mono);letter-spacing:.08em;text-transform:uppercase}
.mw-prod__rate dd{margin:6px 0 0;font:800 1.55rem/1 var(--head);letter-spacing:.01em;color:var(--ink)}
/* the short hire (round 14): its own first row across the card, joined onto the
   priced periods underneath, so their cells lay out exactly as before */
.mw-prod__rates--short{margin-bottom:0;border-bottom:0}
.mw-prod__rate .mw-prod__note{margin-top:8px;font:500 .88rem/1.4 var(--body);letter-spacing:0;color:var(--muted)}
/* the strip under each card: navy with the header's hazard edge, the price in
   yellow, so it reads as the part to act on (Ciaran, 21 Sep 2026: "these sections
   underneath just don't stand out") */
.mw-prod__foot{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px 18px;margin-top:auto;padding:22px 26px 24px;background:var(--navy);color:var(--white);border-style:solid;border-width:6px 0 0;border-image:repeating-linear-gradient(135deg,#111 0 14px,var(--yellow) 14px 28px) 6}
.mw-prod__foot :focus-visible{outline-color:var(--yellow)}
.mw-prod__meta{margin:0;color:var(--on-navy);font-size:.92rem;max-width:none}
.mw-prod__from{margin:0 0 4px;font:700 1.2rem/1.2 var(--body);color:var(--white);white-space:nowrap}
.mw-prod__from span{color:var(--yellow);font-weight:800;font-size:1.32rem}
.mw-prod .mw-btn{min-height:50px;font-size:1.02rem}

/* ----------------------------------------------------------------- uses --- */
/* White band between the navy card strips and the navy trust band: open columns
   with rules between them, not boxes, so it reads differently from both. */

.mw-uses{padding:84px 0;background:var(--white)}
.mw-uses__grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin:0;padding:0;list-style:none;border-top:1px solid var(--line)}
.mw-use{padding:30px 26px 4px 0;margin-right:26px;border-right:1px solid var(--line)}
.mw-use:last-child{border-right:0;margin-right:0}
.mw-use__ic{display:grid;place-items:center;width:58px;height:58px;margin-bottom:18px;background:var(--yellow);color:var(--navy)}
.mw-use__ic svg{width:32px;height:32px}
.mw-use h3{margin:0 0 8px;font:800 1.5rem/1.1 var(--head);text-transform:uppercase;color:var(--ink)}
.mw-use p{margin:0;color:var(--muted)}
.mw-use .mw-use__kit{margin-top:14px;font:700 .76rem var(--mono);letter-spacing:.12em;text-transform:uppercase;color:#5f4a00}

/* ---------------------------------------------- why hire, not buy (r12) --- */
/* Warm paper band between the white "uses" section and the navy trust band, so
   the argument reads as its own chapter and no two dark blocks touch. Cards are
   white on paper, the same card idiom as "how hiring works" inverted for the
   surface. Nothing here is navy: the trust band underneath is.  */

.mw-why{padding:84px 0;background:var(--paper);border-top:1px solid var(--line)}
.mw-why__open{max-width:80ch;margin:0 0 20px;color:var(--ink);font-size:1.18rem;line-height:1.62;font-weight:500}
.mw-why__body{max-width:74ch;margin:0 0 24px;color:var(--muted);font-size:1.06rem}

.mw-why__list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:24px;row-gap:24px;margin:0 0 30px;padding:0;list-style:none}
.mw-why__pt{background:var(--white);border:1px solid var(--line);border-top:5px solid var(--navy);padding:24px 24px 26px}
.mw-why__pt strong{display:block;margin-bottom:8px;font:800 1.26rem/1.15 var(--head);text-transform:uppercase;color:var(--ink)}
.mw-why__pt span{display:block;color:var(--muted)}

.mw-why__turn{margin:0 0 40px;padding:22px 26px;background:var(--white);border:1px solid var(--line);border-left:7px solid var(--yellow)}
.mw-why__turn p{margin:0;color:var(--muted)}
.mw-why__turn strong{color:var(--ink)}
.mw-why__pay{margin-top:14px!important}

/* the comparison: a real table, headed both ways */
.mw-vs{margin:0 0 40px}
.mw-vs__t{width:100%;border-collapse:collapse;background:var(--white);border:1px solid var(--line)}
.mw-vs__cap{caption-side:top;text-align:left;margin:0 0 14px;font:800 clamp(1.35rem,2.1vw,1.8rem)/1.08 var(--head);text-transform:uppercase;color:var(--ink)}
.mw-vs__t thead tr{background:var(--navy)}
.mw-vs__t thead th{padding:14px 18px;text-align:left;font:700 .92rem/1.3 var(--body);letter-spacing:.08em;text-transform:uppercase;color:var(--white)}
.mw-vs__t thead th.mw-vs__yes{color:var(--yellow)}
.mw-vs__t tbody th{width:26%;padding:15px 18px;text-align:left;vertical-align:top;font:700 1.02rem/1.4 var(--body);color:var(--ink);background:var(--paper);border-right:1px solid var(--line)}
.mw-vs__t tbody td{padding:15px 18px;vertical-align:top;color:var(--muted);border-right:1px solid var(--line)}
.mw-vs__t tbody td:last-child{border-right:0}
.mw-vs__t tbody tr+tr th,.mw-vs__t tbody tr+tr td{border-top:1px solid var(--line)}
/* the per row column label: only used when the table stacks on phones, and
   display:none keeps it out of the accessible name at every other width */
.mw-vs__k{display:none}

.mw-why__cta{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px 28px;
	padding:26px 28px;background:var(--white);
	border-style:solid;border-width:6px 0 0;
	border-image:repeating-linear-gradient(135deg,#111 0 14px,var(--yellow) 14px 28px) 6;
	box-shadow:0 0 0 1px var(--line)}
.mw-why__cta p{margin:0;max-width:62ch;color:var(--ink);font-size:1.06rem;font-weight:500}
.mw-why__act{display:flex;flex-wrap:wrap;gap:12px}

/* the home page teaser (round 14): the same light band, the house head and one
   plain link to the Why hire page, never the yellow price button */
.mw-why--teaser .mw-sechead{margin-bottom:28px}
.mw-why__more{margin:0}

/* ---------------------------------------------------------------- trust --- */

.mw-trust{background:var(--navy);border-block:8px solid transparent;
	border-image:repeating-linear-gradient(135deg,#111 0 16px,var(--yellow) 16px 32px) 8}
.mw-trust__grid{display:grid;grid-template-columns:repeat(4,1fr)}
.mw-trust__grid div{padding:32px 24px;border-right:1px solid rgba(255,255,255,.16)}
.mw-trust__grid div:last-child{border-right:0}
.mw-trust strong{display:block;margin-bottom:8px;font:700 1.08rem/1.3 var(--body);letter-spacing:.05em;text-transform:uppercase;color:var(--yellow)}
.mw-trust span{display:block;font-size:1.02rem;font-weight:500;line-height:1.55;color:var(--on-navy)}

/* ------------------------------------------------------------ the FAQs --- */
/* Carried across from the WCAG.ie staging site (document audit page), shape for
   shape: a three column head, topic pills with a dot, a navy ask card under them,
   answers as soft cards that lift to white with an edge when opened. Mainway
   colours: navy for lines and text, yellow only ever as a fill on light surfaces. */

.mw-faq{padding:84px 0;background:var(--white);border-top:1px solid var(--line)}

/* heading across two columns, the supporting line in the third, tops in line
   (Ciaran's standing rule on WCAG.ie, 7 Aug 2026) */
.mw-sechead{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:24px;row-gap:12px;align-items:start;margin:0 0 40px}
.mw-sechead>.mw-kicker{grid-column:1/3;grid-row:1;margin:0}
.mw-sechead .mw-h2{grid-column:1/3;grid-row:2;margin:0;font-size:clamp(2.2rem,4.4vw,3.6rem);line-height:1}
.mw-sechead__side{grid-column:3;grid-row:2;margin:0;padding-left:22px;color:var(--muted);font-size:1.12rem;line-height:1.62}
/* two column head for the narrow column beside the hire page's price panel */
.mw-sechead--two{grid-template-columns:repeat(2,minmax(0,1fr));margin-bottom:28px}
.mw-sechead--two .mw-h2{grid-column:1;grid-row:1}
.mw-sechead--two .mw-sechead__side{grid-column:2;grid-row:1}
.mw-h2 b{font-weight:inherit;padding:0 .06em;
	background:linear-gradient(transparent 60%,var(--yellow) 60%,var(--yellow) 94%,transparent 94%);
	-webkit-box-decoration-break:clone;box-decoration-break:clone}

.mw-faqx{display:grid;grid-template-columns:minmax(0,330px) minmax(0,1fr);gap:32px;align-items:stretch}
.mw-faqx__side{display:grid;gap:22px;align-content:start}
.mw-faqx__tabs{display:grid;gap:10px}
.mw-faqx__tab{
	appearance:none;-webkit-appearance:none;display:flex;align-items:center;gap:11px;text-align:left;cursor:pointer;
	padding:15px 24px;border:1px solid var(--line);border-radius:50px;background:var(--white);
	font:500 1.03rem/1.3 var(--body);color:var(--muted);
	transition:color .18s var(--ease),border-color .18s var(--ease),box-shadow .18s var(--ease);
}
.mw-faqx__tab::before{content:"";flex:none;width:8px;height:8px;border-radius:50%;background:#cfcabf;transition:background .18s var(--ease)}
.mw-faqx__tab:hover{color:var(--navy);border-color:#bdb7aa}
.mw-faqx__tab:hover::before{background:#a8a194}
.mw-faqx__tab.is-on{color:var(--navy);font-weight:600;border-color:var(--navy);box-shadow:0 12px 30px -18px rgba(7,22,43,.34)}
.mw-faqx__tab.is-on::before{background:var(--yellow);box-shadow:0 0 0 2px var(--navy)}
.mw-faqx__short{display:none}

.mw-faqx__ask{background:var(--navy);color:var(--white);border-radius:18px;padding:28px 26px}
.mw-faqx__ask h3{margin:0;font:700 1.4rem/1.2 var(--body);color:var(--white)}
.mw-faqx__ask p{margin:12px 0 20px;color:var(--on-navy);font-size:.96rem}
.mw-faqx__ask .mw-pill{width:100%}
.mw-faqx__ask .mw-pill+.mw-pill{margin-top:10px}
.mw-faqx__ask .mw-faqx__ask-note{margin:14px 0 0;color:var(--on-navy-soft);font-size:.84rem}

.mw-pill{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:50px;padding:0 22px;border-radius:50px;border:2px solid transparent;font:700 1rem var(--body);text-decoration:none;cursor:pointer;transition:background-color .15s var(--ease)}
.mw-pill--yellow{background:var(--yellow);color:var(--navy)}
.mw-pill--yellow:hover{background:var(--yellow-bright)}
.mw-pill--ghost{border-color:rgba(255,255,255,.75);color:var(--white)}
.mw-pill--ghost:hover{background:rgba(255,255,255,.1)}

.mw-faqx__panels{min-width:0;display:flex;flex-direction:column}
/* the open panel fills the row, and its cards share out any spare height, so the
   last card ends level with the ask card on the left */
.mw-faqx__panel{flex:1 1 auto;display:flex;flex-direction:column;justify-content:space-between;gap:14px}
.mw-faqx__panel[hidden]{display:none}
.mw-faqx__i{background:var(--paper);border:1px solid transparent;border-radius:18px;transition:background .18s var(--ease),border-color .18s var(--ease),box-shadow .18s var(--ease)}
.mw-faqx__i:hover{border-color:var(--line)}
.mw-faqx__i>summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:20px;padding:26px 28px}
.mw-faqx__i>summary::-webkit-details-marker{display:none}
.mw-faqx__i>summary:focus-visible{outline:3px solid var(--navy);outline-offset:2px;border-radius:18px}
.mw-faqx__q{flex:1 1 auto;min-width:0;margin:0;font:600 1.19rem/1.35 var(--body);color:var(--navy)}
.mw-faqx__i>summary:hover .mw-faqx__q{color:#5f4a00}
.mw-faqx__ic{flex:0 0 36px;width:36px;height:36px;border-radius:50%;background:var(--white);border:1px solid var(--line);color:var(--navy);display:grid;place-items:center;transition:background .18s var(--ease),border-color .18s var(--ease)}
.mw-faqx__ic::before{content:"";width:9px;height:9px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:translateY(-2px) rotate(45deg);transition:transform .18s var(--ease)}
.mw-faqx__i[open]{background:var(--white);border-color:var(--navy);box-shadow:0 18px 40px -26px rgba(7,22,43,.4)}
.mw-faqx__i[open] .mw-faqx__ic{background:var(--yellow);border-color:var(--yellow)}
.mw-faqx__i[open] .mw-faqx__ic::before{transform:translateY(2px) rotate(-135deg)}
.mw-faqx__a{padding:0 74px 26px 26px;display:grid;gap:14px}
.mw-faqx__a p{margin:0;color:var(--muted);font-size:1.03rem}

/* -------------------------------------------------------- inner pages --- */

.mw-pagehead{padding:66px 0 62px}
.mw-pagehead__title{margin:0 0 16px;font:900 clamp(2.2rem,4.2vw,3.5rem)/1 var(--head);text-transform:uppercase}
.mw-pagehead__lead{max-width:60ch;color:var(--on-navy);font-size:1.12rem}
.mw-pagehead__lead p{margin:0 0 12px}

/* hire page: rates on the left, the wizard sitting beside them */
.mw-hire{padding:70px 0 80px;background:var(--white)}
.mw-hire__grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,400px);gap:44px;align-items:start}
.mw-hire__main>section{margin-bottom:52px}
.mw-hire__main>section:last-child{margin-bottom:0}
.mw-hire__aside{position:sticky;top:104px}
.mw-hire__aside-note{margin:14px 0 0;color:var(--muted-soft);font-size:.88rem;text-align:center}

.mw-extras{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);border:1px solid var(--line);margin:22px 0 16px}
.mw-extras__cell{background:var(--white);padding:22px}
.mw-extras__cell p{margin:0}
.mw-extras__cell .mw-figure{margin:2px 0 6px;color:var(--navy);font:800 2.3rem/1 var(--head);letter-spacing:0}
.mw-extras__cell p:last-child{color:var(--muted);font-size:.92rem}

.mw-example{background:var(--navy);color:var(--white);padding:30px}
.mw-example h3{margin:0 0 6px;font:800 1.5rem var(--head);text-transform:uppercase;color:var(--white)}
.mw-example__lead{color:var(--on-navy);margin:0 0 18px}

.mw-lines{margin:0;padding:0;list-style:none;border-top:1px solid var(--line)}
.mw-lines li{display:flex;justify-content:space-between;gap:20px;padding:13px 0;border-bottom:1px solid var(--line)}
.mw-lines li span:last-child{font:700 1.05rem var(--body);font-variant-numeric:tabular-nums;white-space:nowrap}
.mw-lines--dark{border-top-color:var(--navy-line)}
.mw-lines--dark li{border-bottom-color:var(--navy-line);color:var(--on-navy)}
.mw-lines--dark li span:last-child{color:var(--white)}
.mw-lines__total{font:800 1.2rem var(--head);text-transform:uppercase}
.mw-lines__total span:last-child{color:var(--yellow)!important;font-size:1.3rem!important}

/* -------------------------------------------------------------- contact --- */
/* Two cards the same height (Ciaran, 21 Sep 2026: "the left section of the form needs
   to be the same size ... look all put together"). Both end on a yellow button, level. */

.mw-contact{padding:74px 0 84px;background:var(--paper)}
.mw-contact__grid{display:grid;grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);gap:28px;align-items:stretch}
.mw-contact__side{display:flex;flex-direction:column;background:var(--navy);color:var(--white);padding:34px 34px 34px;border-style:solid;border-width:6px 0 0;border-image:repeating-linear-gradient(135deg,#111 0 14px,var(--yellow) 14px 28px) 6}
.mw-contact__label{margin:0 0 8px;font:700 .76rem var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--yellow)}
.mw-contact__phone{display:inline-block;margin:0 0 10px;font:800 clamp(2.3rem,3.4vw,3rem)/1 var(--head);color:var(--yellow);text-decoration:none}
.mw-contact__phone:hover{color:var(--yellow-bright)}
.mw-contact__email{display:inline-block;margin:0 0 10px;font:700 1.28rem var(--body);color:var(--white);text-decoration:none;border-bottom:2px solid var(--yellow)}
.mw-contact__side p{margin:0;color:var(--on-navy)}
.mw-contact__sep{height:1px;background:var(--navy-line);margin:26px 0}
.mw-contact__areas{display:flex;flex-wrap:wrap;gap:8px;margin:2px 0 14px;padding:0;list-style:none}
.mw-contact__areas li{border:1.5px solid var(--yellow);color:var(--white);padding:7px 12px;font:700 .82rem var(--body);letter-spacing:.05em;text-transform:uppercase}
.mw-contact__side .mw-contact__near{font-size:.95rem}
.mw-contact__cta{margin-top:auto;padding-top:26px;border-top:1px solid var(--navy-line)}
.mw-contact__cta h2{margin:0 0 6px;font:800 1.6rem var(--head);text-transform:uppercase;color:var(--white)}
.mw-contact__cta p{margin:0 0 20px!important}
.mw-contact__cta .mw-btn{width:100%}

.mw-contact__card{display:flex;flex-direction:column;background:var(--white);border:1px solid var(--line);box-shadow:10px 10px 0 rgba(7,22,43,.07)}
.mw-contact__head{background:var(--navy);color:var(--white);padding:24px 32px 22px;border-bottom:6px solid var(--yellow)}
.mw-contact__head .mw-kicker{margin:0 0 4px}
.mw-contact__head h2{margin:0;font:900 2.1rem/1 var(--head);text-transform:uppercase;color:var(--white)}
.mw-contact__form{flex:1;display:grid;grid-template-columns:1fr 1fr;gap:18px 20px;align-content:start;padding:26px 32px 34px}
.mw-contact__intro{grid-column:1/-1;margin:0 0 2px;color:var(--muted)}
.mw-field{margin:0}
.mw-field--wide{grid-column:1/-1}
.mw-field label{display:block;margin-bottom:7px;font:700 .8rem var(--body);letter-spacing:.06em;text-transform:uppercase;color:var(--ink)}
.mw-field input,.mw-field textarea{width:100%;min-height:54px;padding:14px 16px;border:1.5px solid #bdb8ad;background:var(--paper);color:var(--ink);transition:border-color .15s var(--ease),background-color .15s var(--ease)}
.mw-field textarea{min-height:124px;resize:vertical}
.mw-field input:hover,.mw-field textarea:hover{border-color:#8d949d}
.mw-field input:focus,.mw-field textarea:focus{border-color:var(--navy);background:var(--white)}
.mw-field ::placeholder{color:#6b7480}
.mw-contact__small{grid-column:1/-1;margin:2px 0 0;color:var(--muted-soft);font-size:.9rem}
.mw-contact__submit{grid-column:1/-1;margin-top:auto;align-self:end}
.mw-contact__submit .mw-btn{width:100%}
.mw-form__result{grid-column:1/-1;margin:0;font-weight:700;color:var(--navy)}
.mw-form__result:empty{display:none}

/* the wizard's details step matches the contact form's fields */
.mw-form label{display:block;margin-bottom:7px;font:700 .8rem var(--body);letter-spacing:.06em;text-transform:uppercase;color:var(--ink)}
.mw-form__wide{grid-column:1/-1}
.mw-form input,.mw-form textarea{width:100%;min-height:52px;padding:13px 15px;border:1.5px solid #bdb8ad;background:var(--paper);color:var(--ink);transition:border-color .15s var(--ease),background-color .15s var(--ease)}
.mw-form input:hover,.mw-form textarea:hover{border-color:#8d949d}
.mw-form input:focus,.mw-form textarea:focus{border-color:var(--navy);background:var(--white)}
.mw-form textarea{min-height:auto}

.mw-next{padding:72px 0;background:var(--paper)}
.mw-next__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:30px}
/* four link cards on the 404 page (round 14): four across on a wide screen, then two by
   two and one a row from the responsive rules below, so no card is ever left alone on a
   row. The Contact page's three cells use the plain grid above and do not change. */
.mw-next__grid--four{grid-template-columns:repeat(4,1fr)}
.mw-next__cell{background:var(--white);border:1px solid var(--line);border-top:5px solid var(--yellow);padding:24px}
.mw-next__cell strong{display:block;margin-bottom:8px;font:800 1.25rem var(--head);text-transform:uppercase}
.mw-next__cell p{margin:0;color:var(--muted);font-size:.95rem}
.mw-next__cell--link{display:block;text-decoration:none;color:inherit;transition:border-color .15s var(--ease)}
.mw-next__cell--link:hover{border-color:var(--navy)}
.mw-areas{display:flex;flex-wrap:wrap;gap:10px;margin:26px 0 0;padding:0;list-style:none}
.mw-areas li{background:var(--white);border:1px solid var(--line);padding:9px 16px;font:700 .86rem var(--mono);text-transform:uppercase;letter-spacing:.04em}

/* ------------------------------------------------------------ text pages --- */

.mw-text{padding:64px 0 84px;background:var(--white)}
.mw-text__grid{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:56px;align-items:start}
.mw-prose{max-width:70ch;color:var(--ink)}
.mw-prose>*:first-child{margin-top:0}
.mw-prose h2{margin:1.8em 0 .5em;font:800 1.75rem/1.1 var(--head);text-transform:uppercase;color:var(--navy)}
.mw-prose h3{margin:1.5em 0 .4em;font:700 1.15rem/1.3 var(--body);color:var(--navy)}
.mw-prose p,.mw-prose li{color:var(--muted)}
.mw-prose p{margin:0 0 1em}
.mw-prose ul,.mw-prose ol{margin:0 0 1.2em;padding-left:1.3em}
.mw-prose li{margin-bottom:.4em}
.mw-prose a{color:var(--navy);font-weight:600;text-decoration-color:var(--yellow);text-decoration-thickness:2px;text-underline-offset:3px}
.mw-prose strong{color:var(--ink)}
.mw-prose blockquote{margin:1.4em 0;padding:14px 20px;border-left:5px solid var(--yellow);background:var(--paper)}
.mw-text__card{position:sticky;top:104px;display:grid;justify-items:start;gap:4px;padding:28px 26px;background:var(--navy);color:var(--white);border-style:solid;border-width:6px 0 0;border-image:repeating-linear-gradient(135deg,#111 0 14px,var(--yellow) 14px 28px) 6}
.mw-text__card p{margin:0;color:var(--on-navy)}
.mw-text__card :focus-visible{outline-color:var(--yellow)}
.mw-text__card .mw-btn{width:100%;margin-top:16px}

/* -------------------------------------------------------------- footers --- */
/* Five designs, A to E, one in use at a time (Settings > Hire pricing). */

.mw-kicker--ink{color:var(--navy)}
.mw-btn--navy{background:var(--navy);color:var(--yellow);box-shadow:5px 5px 0 #000}
.mw-btn--navy:hover{transform:translate(-1px,-1px);box-shadow:7px 7px 0 #000}
.mw-fbar{background:#050f1f;color:var(--on-navy-soft);font-size:.86rem}
.mw-fbar__in{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:14px 28px;padding:20px 0}
.mw-fbar p{margin:0}
.mw-fbar__links{display:flex;gap:20px;margin:0;padding:0;list-style:none}
.mw-fbar a{color:var(--on-navy);text-underline-offset:3px}
.mw-fbar :focus-visible{outline-color:var(--yellow)}
.mw-fd__card :focus-visible,.mw-fc__quick :focus-visible,.mw-fb__cta :focus-visible{outline-color:var(--navy)}

/* A: the drawing title block */
.mw-fa{padding:72px 0 0;color:var(--on-navy)}
.mw-fa__grid{display:grid;grid-template-columns:1.1fr .9fr;gap:48px;align-items:center}
.mw-fa__drawing{margin:0;color:#8fb6da}
.mw-fa__drawing svg{width:100%;height:auto;display:block}
.mw-fa__dim{color:var(--yellow)}
.mw-fa__dimt{fill:var(--yellow);font:700 15px var(--mono)}
.mw-fa__drawing figcaption{margin-top:12px;font:600 .78rem var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--on-navy-soft)}
.mw-fa__tb{width:100%;border-collapse:collapse;border:2px solid #8fb6da;background:rgba(5,15,31,.7)}
.mw-fa__tb th,.mw-fa__tb td{border:1px solid rgba(143,182,218,.5);padding:12px 14px;text-align:left;vertical-align:top}
.mw-fa__tb th{width:112px;font:700 .7rem var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--yellow)}
.mw-fa__tb td{font:600 1rem var(--body);color:var(--white)}
.mw-fa__tb a{color:var(--white);text-decoration-color:var(--yellow);text-underline-offset:3px}
.mw-fa__sheet{float:right;font:600 .72rem var(--mono);color:var(--on-navy-soft);text-transform:uppercase}
.mw-fa__cta{display:flex;flex-wrap:wrap;gap:14px;margin-top:22px}
.mw-fa__nav{display:flex;flex-wrap:wrap;gap:26px;padding:30px 0 26px;margin-top:48px;border-top:1px solid var(--navy-line)}
.mw-fa__nav a,.mw-fd__nav a,.mw-fe__cols nav a{color:var(--white);font:700 .95rem var(--head);letter-spacing:.06em;text-transform:uppercase;text-decoration:none}
.mw-fa__nav a:hover,.mw-fd__nav a:hover,.mw-fe__cols nav a:hover{color:var(--yellow)}

/* B: yellow call to action band, then columns */
.mw-fb__cta{background:var(--yellow);border-style:solid;border-width:8px 0 0;border-image:repeating-linear-gradient(135deg,#111 0 16px,var(--yellow) 16px 32px) 8}
.mw-fb__cta-in{display:grid;grid-template-columns:1.3fr .7fr;gap:40px;align-items:center;padding:54px 0}
.mw-fb__shout{max-width:15ch;margin:0 0 12px;font:900 clamp(2.2rem,4.4vw,3.6rem)/.96 var(--head);text-transform:uppercase;color:var(--navy)}
.mw-fb__sub{margin:0;color:#2e2610;font-size:1.08rem;max-width:52ch}
.mw-fb__act{display:grid;gap:18px;justify-items:start}
.mw-fb__phone{color:var(--navy);text-decoration:none;font:700 1.7rem var(--body)}
.mw-fb__phone span{display:block;font:700 .72rem var(--mono);letter-spacing:.12em;text-transform:uppercase;color:#3a3111}
.mw-fb__body{background:var(--navy);color:var(--on-navy);padding:60px 0 46px}
.mw-fb__cols{display:grid;grid-template-columns:1.3fr 1fr 1fr 1.1fr;gap:40px}
.mw-fb__cols h3,.mw-fc__cols h3{margin:0 0 14px;font:800 1.05rem var(--head);letter-spacing:.08em;text-transform:uppercase;color:var(--yellow)}
.mw-fb__brandcol p{margin:16px 0 0;color:var(--on-navy);max-width:34ch}
.mw-fb__kit,.mw-fb__list{margin:0;padding:0;list-style:none;display:grid;gap:10px}
.mw-fb__kit li{display:flex;justify-content:space-between;gap:12px;border-bottom:1px dashed var(--navy-line);padding-bottom:9px}
.mw-fb__kit a,.mw-fb__list a{color:var(--white);text-decoration:none}
.mw-fb__kit a:hover,.mw-fb__list a:hover{color:var(--yellow)}
.mw-fb__kit span{font:700 .92rem var(--body);color:var(--on-navy-soft);white-space:nowrap}
.mw-fb__h3gap{margin-top:30px!important}
.mw-fb__areas li{position:relative;padding-left:18px}
.mw-fb__areas li::before{content:"";position:absolute;left:0;top:.55em;width:8px;height:8px;background:var(--yellow)}
.mw-fb__big{margin:0 0 10px;font:700 1.08rem var(--body)}
.mw-fb__big a{color:var(--white);text-decoration:none;border-bottom:2px solid var(--yellow)}
.mw-fb__hours{margin:14px 0 0;color:var(--on-navy-soft);font-size:.92rem}

/* C: price it in the footer */
.mw-fc{background:var(--navy);color:var(--on-navy);padding:58px 0 0;overflow:hidden}
.mw-fc__quick{display:grid;grid-template-columns:1.4fr .7fr 1fr 1.2fr auto;gap:16px;align-items:end;background:var(--white);color:var(--ink);padding:22px 24px;box-shadow:8px 8px 0 var(--yellow)}
.mw-fc__quick-t{grid-column:1/-1;margin:0;font:800 1.3rem var(--head);text-transform:uppercase;color:var(--navy)}
.mw-fc__f{margin:0}
.mw-fc__f label{display:block;margin-bottom:6px;font:700 .72rem var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--muted-soft)}
.mw-fc__f select,.mw-fc__f input{width:100%;min-height:50px;padding:0 12px;border:2px solid #8d949d;background:var(--white);font-weight:600}
.mw-fc__out{margin:0;display:grid;align-content:end;min-height:50px}
.mw-fc__out span{font:800 2rem/1.05 var(--head);color:var(--navy)}
.mw-fc__out small{color:var(--muted-soft);font-size:.78rem}
.mw-fc__cols{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:40px;padding:56px 0 18px}
.mw-fc__cols ul{margin:0;padding:0;list-style:none;display:grid;gap:10px}
.mw-fc__cols a{color:var(--white);text-decoration:none}
.mw-fc__cols a:hover{color:var(--yellow)}
.mw-fc__brandcol p{margin:14px 0 0;max-width:36ch}
.mw-fc__mute{color:var(--on-navy-soft);font-size:.92rem}
.mw-fc__word{margin:0;font:900 clamp(4rem,14.5vw,13.5rem)/.8 var(--head);text-transform:uppercase;letter-spacing:-.01em;white-space:nowrap;text-align:center;color:transparent;-webkit-text-stroke:2px rgba(247,201,72,.6);position:relative;z-index:0;margin-bottom:-.17em}
.mw-fc .mw-fbar{position:relative;z-index:1}

/* D: ring the yard, or send us the job */
.mw-fd{padding:64px 0 0;color:var(--on-navy)}
.mw-fd__grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:26px;align-items:stretch}
.mw-fd__card{background:var(--white);color:var(--ink);padding:34px}
.mw-fd__card--yellow{display:flex;flex-direction:column;background:var(--yellow);color:var(--navy);box-shadow:8px 8px 0 #000}
.mw-fd__card--yellow .mw-fd__go{margin-top:auto;padding-top:26px}
.mw-fd__phone{display:block;margin:4px 0 12px;font:800 clamp(2.4rem,4vw,3.3rem)/1 var(--head);color:var(--navy);text-decoration:none}
.mw-fd__card--yellow p{margin:0 0 6px}
.mw-fd__card--yellow a{color:var(--navy)}
.mw-fd__hours{font-weight:600}
.mw-fd__areas{display:flex;flex-wrap:wrap;gap:8px;margin:22px 0 0;padding:0;list-style:none}
.mw-fd__areas li{background:var(--navy);color:var(--yellow);padding:7px 12px;font:700 .78rem var(--mono);text-transform:uppercase;letter-spacing:.04em}
.mw-fd__t{margin:0 0 6px;font:900 2rem var(--head);text-transform:uppercase;color:var(--navy)}
.mw-fd__lead{margin:0 0 18px;color:var(--muted)}
.mw-fd__form{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.mw-fd__form p{margin:0}
.mw-fd__wide{grid-column:1/-1}
.mw-fd__form label{display:block;margin-bottom:6px;font-weight:700}
.mw-fd__form input,.mw-fd__form textarea{width:100%;min-height:48px;padding:11px 12px;border:2px solid #8d949d;background:var(--white)}
.mw-fd__row{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.mw-fd__out{font-weight:700;color:var(--navy)}
.mw-fd__nav{display:flex;flex-wrap:wrap;align-items:center;gap:26px;padding:38px 0 30px}
.mw-fd__nav .mw-brand{margin-right:auto;color:var(--white)}

/* E: photo band and the numbers */
.mw-fe__band{position:relative;overflow:hidden;background:var(--navy);color:var(--white);padding:86px 0}
.mw-fe__bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.4}
.mw-fe__band::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(7,22,43,.95) 0%,rgba(7,22,43,.82) 55%,rgba(7,22,43,.6) 100%)}
.mw-fe__in{position:relative;z-index:1}
.mw-fe__top{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));align-items:end;margin-bottom:34px}
.mw-fe__head{grid-column:1/4}
.mw-fe__t{margin:0;font:900 clamp(2.2rem,4.4vw,3.6rem)/.96 var(--head);text-transform:uppercase;max-width:18ch}
.mw-fe__facts{display:grid;grid-template-columns:repeat(4,1fr);margin:0;border-top:1px solid rgba(255,255,255,.3)}
.mw-fe__facts div{display:flex;flex-direction:column;padding:22px 20px 0 0;margin-right:20px;border-right:1px solid rgba(255,255,255,.2)}
.mw-fe__facts div:last-child{border-right:0;margin-right:0}
.mw-fe__facts dt{font:700 .72rem var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--on-navy-soft)}
.mw-fe__facts dd{margin:auto 0 0;padding-top:8px;font:800 clamp(2.6rem,4.4vw,3.6rem)/1 var(--head);letter-spacing:0;color:var(--yellow)}
.mw-fe__facts .mw-fe__small{font-size:clamp(1.6rem,2.4vw,2.1rem);line-height:1.1}
.mw-fe__act{grid-column:4;display:grid;gap:14px}
.mw-fe__act .mw-btn{width:100%;padding:0 18px}
.mw-fe__body{background:var(--navy);color:var(--on-navy);padding:32px 0;border-top:1px solid var(--navy-line)}
.mw-fe__cols{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px 40px}
.mw-fe__cols nav{display:flex;gap:24px;flex-wrap:wrap}
.mw-fe__cols .mw-brand{color:var(--white)}
.mw-fe__contact{margin:0;display:grid;gap:4px;text-align:right}
.mw-fe__contact a{color:var(--white);font:700 1.02rem var(--body)}
.mw-fe__contact span{color:var(--on-navy-soft);font-size:.88rem}

/* the samples page bars */
.mw-sample{background:var(--white);border-top:6px solid var(--yellow);border-bottom:1px solid var(--line)}
.mw-sample__in{display:flex;flex-wrap:wrap;align-items:center;gap:6px 22px;padding:18px 0}
.mw-sample__t{margin:0;font:900 1.5rem var(--head);text-transform:uppercase;color:var(--navy)}
.mw-sample__k{display:inline-grid;place-items:center;width:38px;height:38px;margin-right:8px;background:var(--navy);color:var(--yellow)}
.mw-sample__d{margin:0;flex:1 1 320px;color:var(--muted)}
.mw-sample__go{font-weight:700;color:var(--navy)}

.mw-sticky{display:none}

/* ---------------------------------------------------------- the wizard --- */

.mw-wiz{background:var(--white);border:0;padding:0;color:var(--ink)}
.mw-wiz--panel{border:1px solid var(--line);box-shadow:10px 10px 0 rgba(7,22,43,.09)}
.mw-wiz--modal{width:min(620px,calc(100% - 24px));max-height:92vh;box-shadow:0 30px 90px rgba(3,12,24,.55)}
.mw-wiz--modal::backdrop{background:rgba(3,12,24,.78)}
.mw-wiz__head{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;padding:22px 26px;background:var(--navy);color:var(--white);border-bottom:7px solid var(--yellow)}
.mw-wiz__step{margin:0 0 4px;color:var(--yellow);font:700 .72rem var(--mono);letter-spacing:.12em;text-transform:uppercase}
.mw-wiz__title{margin:0;font:900 1.75rem var(--head);text-transform:uppercase;color:var(--white)}
.mw-wiz__close{width:42px;height:42px;flex:none;border:1px solid #7890a7;background:none;color:var(--white);font-size:1.4rem;cursor:pointer}
.mw-wiz__close:hover{background:rgba(255,255,255,.1)}
.mw-wiz__body{padding:24px 26px;overflow-y:auto}
.mw-wiz--modal .mw-wiz__body{max-height:58vh}
.mw-wiz__foot{display:flex;justify-content:space-between;gap:14px;padding:18px 26px;border-top:1px solid var(--line);background:var(--paper)}
.mw-wiz__foot .mw-btn{flex:1}
.mw-wiz--panel .mw-wiz__foot .mw-btn{font-size:.95rem;padding:0 12px}
.mw-wiz__live{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}

.mw-pick{display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap;padding:16px 0;border-bottom:1px solid var(--line)}
.mw-pick__id{display:flex;align-items:center;gap:14px}
.mw-pick__id img{width:74px;height:56px;object-fit:cover;border:1px solid var(--line)}
.mw-pick__id strong{display:block;font:800 1.12rem var(--head);text-transform:uppercase}
.mw-pick__id small{color:var(--muted-soft);font:600 .76rem var(--mono)}
/* the up/down count. width:max-content because it is a grid: inside a plain
   block (the hire period step) it would otherwise stretch to the container and
   leave an empty bordered box beside the buttons. 44px tall so it is a real
   touch target on a phone, and the same control on both steps. */
.mw-step{display:grid;grid-template-columns:46px 72px 46px;width:max-content;border:1px solid #8d949d}
.mw-step__btn{min-height:44px;border:0;background:var(--paper-2);font:700 1.3rem var(--body);cursor:pointer}
.mw-step__btn:hover{background:var(--yellow)}
.mw-step input{min-height:44px;border:0;text-align:center;font:700 1.15rem var(--body);width:100%;min-width:0}
.mw-quick{display:flex;gap:6px;margin-top:8px;justify-content:flex-end}
.mw-quick__btn{min-height:34px;padding:0 11px;border:1px solid #a8a296;background:var(--white);font:700 .92rem var(--body);cursor:pointer}
.mw-quick__btn:hover{background:var(--navy);color:var(--yellow);border-color:var(--navy)}

.mw-periods{border:0;padding:0;margin:0 0 22px}
.mw-periods legend{padding:0;font:800 1.1rem var(--head);text-transform:uppercase}
/* the up/down count on the hire period step, same control as step 1 (round 12) */
.mw-periods__qty{margin:10px 0 0}
.mw-periods__opts{display:grid;gap:10px;margin-top:10px}
.mw-period{display:flex;align-items:center;gap:12px;padding:14px;border:2px solid var(--line);cursor:pointer}
.mw-period:has(input:checked){border-color:var(--navy);background:var(--paper)}
.mw-period__label{font-weight:700}
.mw-period__price{margin-left:auto;font:700 1.02rem var(--body)}
/* the short hire's per day line, under its name (round 14); its price stays on one
   line like the other rows, the name and the per day line wrap instead */
.mw-period__note{display:block;margin-top:2px;font-weight:500;font-size:.86rem;line-height:1.4;color:var(--muted)}
.mw-period--short .mw-period__price{white-space:nowrap}
/* picking the days (round 13). One more row in the same bordered box as the
   priced periods above it, so it reads as another choice and not a bolt on,
   and the shortcuts keep working exactly as they did. */
.mw-period--days{cursor:default;flex-wrap:wrap;row-gap:10px}
.mw-period--days .mw-step{margin-left:auto}
.mw-period--days.is-on{border-color:var(--navy);background:var(--paper)}
/* the period a part period is charged at. The dashed edge is a reminder only:
   the same thing is said in words in .mw-periods__says right underneath. */
.mw-period.is-rate{border-color:var(--navy);border-style:dashed;background:var(--paper)}
.mw-periods__says{margin:10px 0 0;font-weight:700;color:var(--ink)}
.mw-periods__says:empty{display:none}
.mw-periods__long{margin:6px 0 0;color:var(--muted);font-size:.92rem}
.mw-periods__long a{color:var(--navy);font-weight:700}

.mw-total{background:var(--navy);color:var(--white);padding:22px;margin-bottom:18px}
.mw-total__label{margin:0;color:var(--on-navy-soft);font:700 .72rem var(--mono);letter-spacing:.12em;text-transform:uppercase}
.mw-total__figure{margin:6px 0 4px;color:var(--yellow);font:800 clamp(2.6rem,5.6vw,3.3rem)/1 var(--head);letter-spacing:0}
.mw-total__vat{margin:0;color:var(--on-navy);font-size:.85rem}
.mw-wiz .mw-lines li{padding:11px 0}
.mw-form{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.mw-form p{margin:0}
.mw-error{margin:14px 0 0;padding:12px;background:#fdeaea;border-left:4px solid #9c211c;color:#7a1713;font-weight:600}
.mw-done__ref{font:700 1.2rem var(--body)}

/* ------------------------------------------------------------ responsive --- */

@media (max-width:1040px){
	.mw-hero__grid,.mw-contact__grid,.mw-hire__grid,.mw-text__grid{grid-template-columns:1fr;gap:34px}
	.mw-text__card{position:static}
	.mw-hire__aside{position:static}
	.mw-steps__grid,.mw-next__grid{grid-template-columns:1fr 1fr}
	.mw-trust__grid{grid-template-columns:1fr 1fr}
	.mw-trust__grid div:nth-child(2){border-right:0}
	.mw-nav,.mw-top__call{display:none}
	.mw-burger{display:grid}
	.mw-tag{right:auto;left:0;bottom:-20px}
}
@media (max-width:700px){
	:root{--gutter:16px}
	.mw-top__inner{min-height:64px}
	.mw-brand__name{font-size:1.1rem}
	.mw-top__cta{display:none}
	.mw-burger{width:46px;height:46px}
	.mw-hero__actions .mw-btn--outline{display:none}
	.mw-hero{padding-top:44px}
	.mw-hero__actions .mw-btn{width:100%}
	.mw-steps__grid,.mw-extras,.mw-next__grid,.mw-trust__grid{grid-template-columns:1fr}
	.mw-trust__grid div{border-right:0;border-bottom:1px solid rgba(255,255,255,.16)}
	.mw-contact__form,.mw-form{grid-template-columns:1fr}
	.mw-contact__form{padding:22px 20px 26px}
	.mw-contact__side{padding:28px 22px}
	.mw-contact__head{padding:20px}
	.mw-wiz--modal{width:100%;max-width:100%;max-height:100%;height:100%;margin:0}
	.mw-wiz--modal[open]{display:flex;flex-direction:column}
	.mw-wiz--modal .mw-wiz__body{max-height:none;flex:1}
	.mw-pick{align-items:flex-start}
	.mw-pick__count{width:100%}
	.mw-step{grid-template-columns:1fr 1fr 1fr;width:100%}
	.mw-quick{justify-content:flex-start}
	body{padding-bottom:76px}
	.mw-sticky{display:flex;gap:10px;position:fixed;left:0;right:0;bottom:0;z-index:30;padding:10px 12px;background:#061224;border-top:3px solid var(--yellow)}
	.mw-sticky .mw-btn{flex:1;min-height:52px;padding:0 12px;font-size:1rem;color:var(--white);border-color:#fff}
	.mw-sticky .mw-btn--primary{color:var(--navy);border-color:transparent}
}

/* FAQ on narrow screens: the rail becomes a scrolling row of pills above the
   answers, and the ask card drops underneath them as the closing CTA (WCAG.ie). */
@media (max-width:940px){
	.mw-sechead{grid-template-columns:minmax(0,1fr)}
	.mw-sechead__br{display:none}
	.mw-sechead>.mw-kicker,.mw-sechead .mw-h2{grid-column:1}
	.mw-sechead__side{grid-column:1;grid-row:3;padding-left:0}
	.mw-sechead--two .mw-h2,.mw-sechead--two .mw-sechead__side{grid-column:1;grid-row:auto}
	.mw-faqx{grid-template-columns:minmax(0,1fr);gap:22px}
	.mw-faqx__side{display:contents}
	.mw-faqx__tabs{display:grid;gap:8px;order:1}
	.mw-faqx__tab{padding:13px 20px}
	.mw-faqx__panels{order:2}
	.mw-faqx__ask{order:3}
	.mw-faqx__a{padding-right:26px}
}
@media (max-width:1040px){
	.mw-fa__grid,.mw-fb__cta-in,.mw-fd__grid{grid-template-columns:1fr}
	.mw-fb__cols{grid-template-columns:1fr 1fr}
	.mw-fc__quick{grid-template-columns:1fr 1fr}
	.mw-fc__quick .mw-btn{grid-column:1/-1}
	.mw-fe__facts{grid-template-columns:1fr 1fr;row-gap:22px}
	.mw-fe__facts div:nth-child(2){border-right:0;margin-right:0}
	.mw-fe__top{grid-template-columns:1fr;row-gap:24px}
	.mw-uses__grid{grid-template-columns:1fr 1fr;row-gap:10px}
	.mw-use:nth-child(2){border-right:0;margin-right:0}
	.mw-fe__head,.mw-fe__act{grid-column:1}
	.mw-fe__act{display:flex;flex-wrap:wrap}
	.mw-fe__act .mw-btn{width:auto}
}
@media (max-width:700px){
	.mw-fb__cols,.mw-fc__cols,.mw-fd__form,.mw-fc__quick{grid-template-columns:1fr}
	.mw-fe__facts{grid-template-columns:1fr}
	.mw-fe__facts div{border-right:0;margin-right:0}
	.mw-prod__foot .mw-btn{width:100%}
	.mw-uses__grid{grid-template-columns:1fr}
	.mw-use{border-right:0;margin-right:0;padding:24px 0;border-bottom:1px solid var(--line)}
	.mw-use:last-child{border-bottom:0}
	.mw-fe__act .mw-btn{width:100%}
	.mw-fe__contact{text-align:left}
	.mw-fd__card{padding:24px}
	.mw-fc__word{-webkit-text-stroke-width:1px}
}

/* Phones, round 7 (Ciaran, 21 Sep 2026: "loads of padding for no reason", "the footer is
   way too long"). Sections breathe at 52px, not 84px; the footer's two buttons are
   already in the sticky bar, so the footer drops them and packs its numbers 2 by 2. */
@media (max-width:700px){
	.mw-steps,.mw-items,.mw-uses,.mw-faq,.mw-hire,.mw-contact,.mw-next,.mw-prices,.mw-text{padding:52px 0}
	.mw-pagehead{padding:44px 0 40px}
	.mw-sechead{margin-bottom:24px;row-gap:10px}
	.mw-sechead .mw-h2{font-size:2.1rem}
	.mw-sechead__side{font-size:1.02rem}
	.mw-hero__honest{margin-top:40px}
	.mw-steps__grid{margin-top:22px;gap:14px}
	.mw-steps__grid li{padding:20px 18px 22px}

	.mw-trust__grid div{padding:18px 0}
	.mw-trust__grid div:last-child{border-bottom:0}
	.mw-trust strong{margin-bottom:4px;font-size:1rem}
	.mw-trust span{font-size:.95rem}

	.mw-use{padding:18px 0}
	.mw-use__ic{width:46px;height:46px;margin-bottom:12px}
	.mw-use__ic svg{width:26px;height:26px}
	.mw-use h3{font-size:1.3rem}

	.mw-faqx{gap:16px}
	.mw-faqx__panel{gap:10px}
	.mw-faqx__i{border-radius:14px}
	.mw-faqx__i>summary{padding:16px 16px 16px 18px;gap:14px}
	.mw-faqx__q{font-size:1.04rem}
	.mw-faqx__ic{flex-basis:32px;width:32px;height:32px}
	.mw-faqx__a{padding:0 18px 18px}
	.mw-faqx__ask{padding:22px 20px;border-radius:14px}

	.mw-fe__band{padding:40px 0 34px}
	.mw-fe__top{margin-bottom:22px}
	.mw-fe__t{font-size:2rem}
	.mw-fe__act{display:none}
	.mw-fe__facts{grid-template-columns:1fr 1fr;row-gap:0}
	.mw-fe__facts div{padding:14px 10px 12px 0}
	.mw-fe__facts dt{font-size:.66rem}
	.mw-fe__facts dd{font-size:2.1rem;padding-top:4px}
	.mw-fe__facts .mw-fe__small{font-size:1.2rem}
	.mw-fe__body{padding:22px 0}
	.mw-fe__cols{gap:12px 24px}
	.mw-fe__contact{gap:2px}
	.mw-fbar__in{padding:14px 0;gap:8px 20px;font-size:.8rem}
}

/* FAQ on phones (Ciaran, 22 Sep 2026: "FAQs look bad on phone"). The topics are one compact
   three way switch with short names, and the questions sit in a single list with dividers
   instead of a stack of grey blocks. The highlighted words in a heading stay on one line. */
@media (max-width:700px){
	.mw-h2 b{white-space:nowrap}
	.mw-faqx__tabs{grid-template-columns:repeat(3,minmax(0,1fr));gap:0;padding:0;border:2px solid var(--navy);border-radius:12px;overflow:hidden;background:var(--white)}
	.mw-faqx__tab{justify-content:center;gap:0;padding:12px 6px;border:0;border-radius:0;background:var(--white);box-shadow:none;font:700 .98rem var(--body);color:var(--navy);text-align:center}
	.mw-faqx__tab+.mw-faqx__tab{border-left:2px solid var(--navy)}
	.mw-faqx__tab::before{display:none}
	.mw-faqx__tab:hover{border-color:var(--navy)}
	.mw-faqx__tab.is-on{background:var(--navy);color:var(--yellow);box-shadow:none;font-weight:700}
	/* the full name stays in the accessible name; only the short one is shown */
	.mw-faqx__full{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
	.mw-faqx__short{display:inline}
	.mw-faqx__tab{position:relative}
	.mw-faqx__panel{gap:0;background:var(--white);border:1px solid var(--line);border-radius:14px;overflow:hidden}
	.mw-faqx__i,.mw-faqx__i:hover{border:0;border-radius:0;background:var(--white)}
	.mw-faqx__i+.mw-faqx__i{border-top:1px solid var(--line)}
	.mw-faqx__i[open]{border-color:var(--line);background:var(--paper);box-shadow:inset 4px 0 0 var(--yellow)}
	.mw-faqx__i>summary{padding:16px 14px 16px 16px}
	.mw-faqx__i>summary:focus-visible{border-radius:0;outline-offset:-3px}
	.mw-faqx__q{font-size:1rem}
	.mw-faqx__ic{flex-basis:30px;width:30px;height:30px}
	.mw-faqx__ic::before{width:8px;height:8px}
	.mw-faqx__a{padding:0 16px 16px}
	.mw-faqx__a p{font-size:.98rem}
}

/* Round 12: "why hire, not buy". The four points go single file, and the
   comparison table stops being a table and becomes one card a row, because a
   sideways scrolling comparison was rejected in round 7. Sections breathe at
   52px on phones, same as every other band. */
@media (max-width:700px){
	.mw-why{padding:52px 0}
	.mw-why__open{margin-bottom:16px;font-size:1.06rem}
	.mw-why__body{font-size:1.02rem}
	.mw-why__list{grid-template-columns:minmax(0,1fr);row-gap:14px;margin-bottom:24px}
	.mw-why__pt{padding:18px 18px 20px}
	.mw-why__pt strong{font-size:1.18rem}
	.mw-why__turn{margin-bottom:28px;padding:18px 18px;border-left-width:6px}
	.mw-vs{margin-bottom:28px}
	.mw-vs__cap{display:block;font-size:1.3rem;margin-bottom:12px}
	.mw-vs__t,.mw-vs__t tbody,.mw-vs__t tr,.mw-vs__t th,.mw-vs__t td{display:block;width:auto}
	.mw-vs__t{border:0;background:none}
	.mw-vs__t thead{display:none}
	.mw-vs__t tbody tr{margin-bottom:12px;background:var(--white);border:1px solid var(--line)}
	.mw-vs__t tbody tr:last-child{margin-bottom:0}
	.mw-vs__t tbody th{width:auto;padding:12px 16px;background:var(--paper-2);border-right:0;border-bottom:1px solid var(--line)}
	.mw-vs__t tbody td{padding:12px 16px;border-right:0}
	.mw-vs__t tbody tr+tr th,.mw-vs__t tbody tr+tr td{border-top:0}
	.mw-vs__t tbody td+td{border-top:1px solid var(--line)}
	.mw-vs__k{display:block;margin-bottom:3px;font:700 .68rem var(--mono);letter-spacing:.1em;text-transform:uppercase;color:#5f4a00}
	.mw-why__cta{padding:22px 20px;gap:16px}
	.mw-why__cta p{font-size:1.02rem}
	.mw-why__act{width:100%}
	.mw-why__act .mw-btn{width:100%}
	.mw-why__more .mw-btn{width:100%}
}