/* FWER — fwer.com.au */

/* Fonts are self-hosted (Latin subset), so the page makes no requests to Google. Licence: /assets/fonts/LICENSE.txt */
@font-face{font-family:'Inter';font-style:normal;font-weight:400 700;font-display:swap;src:url(/assets/fonts/inter-latin.woff2) format('woff2')}
@font-face{font-family:'Inter Tight';font-style:normal;font-weight:700 900;font-display:swap;src:url(/assets/fonts/inter-tight-latin.woff2) format('woff2')}
@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:500 600;font-display:swap;src:url(/assets/fonts/jetbrains-mono-latin.woff2) format('woff2')}

/* Brand highlight colour. Change it here and it changes everywhere. */
:root{--hl:#E2FF3B}

body{margin:0;background:#ffffff;font-family:'Inter',system-ui,sans-serif;color:#0A0A0A;font-size:17px;line-height:1.6}
a{color:#0A0A0A}a:hover{color:#444444}
.wrap{max-width:1240px;margin:0 auto;padding:0 32px;box-sizing:border-box}
.disp{font-family:'Inter Tight','Inter',sans-serif;font-weight:900;letter-spacing:-0.035em;line-height:0.95;text-transform:uppercase;margin:0}
.lbl{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:13px;font-weight:600;letter-spacing:0.12em;text-transform:uppercase;margin:0}
/* Highlighter block. The colour band starts a little below the top of the line, so on wrapped
   headings it never touches the text on the line above. */
.hl{background:linear-gradient(var(--hl),var(--hl)) 0 76%/100% calc(100% - 0.17em) no-repeat;padding:0 0.12em;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.roll>.hl{background:var(--hl)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:54px;padding:0 30px;border-radius:999px;background:#0A0A0A;color:#ffffff;font-weight:700;font-size:17px;text-decoration:none;box-sizing:border-box;transition:background .15s ease}
.btn:hover{background:#2B2B2B;color:#ffffff}
.btn.hlb{background:var(--hl);color:#0A0A0A}
.btn.hlb:hover{background:#ffffff;color:#0A0A0A}
.sec{padding-top:clamp(96px,11vw,160px);padding-bottom:clamp(96px,11vw,160px)}
.rule{border-top:1px solid #E4E4DF}
.card{background:#ffffff;border:1px solid #DCDCD6;box-sizing:border-box}
.dots{background-color:#F4F4F1;background-image:radial-gradient(rgba(10,10,10,0.18) 1.2px,transparent 1.4px);background-size:20px 20px}
.panel{border:1px solid #DCDCD6;box-sizing:border-box}
.roll{display:inline-grid;vertical-align:baseline;justify-items:stretch}
.roll>span{grid-area:1/1;opacity:0;transform:translateY(35%);transition:opacity .45s ease,transform .45s ease;white-space:nowrap;text-align:center;box-sizing:border-box;letter-spacing:0.01em;word-spacing:0.12em;line-height:1.1;font-weight:800;padding:0.1em 0.3em}
@keyframes roll{0%{opacity:0;transform:translateY(35%)}3%,17%{opacity:1;transform:none}20%,100%{opacity:0;transform:translateY(-35%)}}
.node{display:flex;align-items:center;gap:14px;padding:14px 18px;background:#ffffff;border:2px solid #0A0A0A;box-shadow:5px 5px 0 #0A0A0A;font-weight:600;font-size:16px;line-height:1.3;animation:on 8s infinite;cursor:default;transition:background .15s ease,transform .15s ease,box-shadow .15s ease}
.node .n{font-family:'JetBrains Mono',monospace;font-size:12px;font-weight:600;border:1.5px solid #0A0A0A;border-radius:999px;padding:3px 8px;flex:none;background:#ffffff}
@keyframes on{0%,11%{background:var(--hl)}13%,100%{background:#ffffff}}
.panel:hover .node,.panel:hover .wire::after{animation:none}
.panel .node:hover{background:var(--hl);transform:translate(-2px,-2px);box-shadow:7px 7px 0 #0A0A0A}
.wire{position:relative;width:2px;height:30px;margin-left:34px;background:#0A0A0A}
.wire::after{content:'';position:absolute;left:-4px;top:0;width:10px;height:10px;border-radius:50%;background:#0A0A0A;opacity:0;animation:pulse 8s infinite;animation-delay:inherit}
@keyframes pulse{0%{top:0;opacity:1}10%{top:20px;opacity:1}11%,100%{top:20px;opacity:0}}
.flow{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:10px 0}
.fnode{display:inline-flex;align-items:center;gap:10px;padding:10px 16px;background:#ffffff;border:2px solid #0A0A0A;box-shadow:4px 4px 0 #0A0A0A;font-weight:600;font-size:15px;white-space:nowrap}
.fstack{display:grid;justify-items:center;margin-top:0;max-width:100%}
.frow{grid-area:1/1;display:flex;flex-wrap:nowrap;align-items:center;opacity:0;transform:translateY(35%);transition:opacity .45s ease,transform .45s ease}
.roll>span.show,.frow.show{opacity:1;transform:none}
.roll>span.out,.frow.out{opacity:0;transform:translateY(-35%)}
.frow.show .fnode{animation:litseq .3s ease forwards}
.frow.show .a{animation-delay:.6s}.frow.show .b{animation-delay:1.4s}.frow.show .c{animation-delay:2.2s}
@keyframes litseq{from{background:#ffffff}to{background:var(--hl)}}
@media (max-width: 560px){.fnode{font-size:13px;padding:8px 10px;gap:6px}.fnode .n{display:none}.frow .fwire{width:14px}}
.fnode .n{font-family:'JetBrains Mono',monospace;font-size:11px;font-weight:600;border:1.5px solid #0A0A0A;border-radius:999px;padding:2px 7px}
.fwire{width:40px;height:2px;background:#0A0A0A}
.grid5{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:20px}
.grid4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
.grid3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px}
@media (max-width: 1000px){.grid5,.grid4{grid-template-columns:repeat(2,minmax(0,1fr))}.grid3{grid-template-columns:minmax(0,1fr)}}
@media (max-width: 560px){.grid5,.grid4{grid-template-columns:minmax(0,1fr)}}
.stepn{display:inline-flex;align-items:center;justify-content:center;width:64px;height:64px;box-sizing:border-box;background:var(--hl);border:2px solid #0A0A0A;font-family:'Inter Tight',sans-serif;font-weight:900;font-size:26px;letter-spacing:-0.02em;line-height:1;color:#0A0A0A}
.split{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,460px),1fr));gap:64px;align-items:start}
.tile{display:flex;flex-direction:column;gap:14px;padding:26px;border:1px solid #333333;color:#ffffff;text-decoration:none;transition:border-color .15s ease,background .15s ease}
.tile:hover{border-color:var(--hl);background:#141414;color:#ffffff}
.tile .go{margin-top:auto;font-family:'JetBrains Mono',monospace;font-size:12px;font-weight:600;letter-spacing:0.12em;text-transform:uppercase;color:var(--hl)}
.trust{display:flex;flex-wrap:wrap;justify-content:center;gap:12px 40px}
.trust span{display:inline-flex;align-items:center;gap:10px;font-weight:600;font-size:15px}
.trust i{display:inline-block;width:10px;height:10px;background:var(--hl);border:2px solid #0A0A0A}
.tools{display:flex;flex-wrap:wrap;justify-content:center;gap:10px 28px;font-family:'Inter Tight',sans-serif;font-weight:800;font-size:20px;letter-spacing:-0.01em;color:#555555}
.nav a.lk{text-decoration:none;font-weight:600;font-size:15px}
.nav a.lk:hover{text-decoration:underline}
/* Nav: visible at the top of the page, slides away when scrolling down, comes back when scrolling up (main.js toggles .up / .solid) */
.bar{position:sticky;top:0;z-index:50;background:#ffffff;transition:transform .28s ease,box-shadow .2s ease;will-change:transform}
.bar.solid{box-shadow:0 1px 0 #DCDCD6}
.bar.up{transform:translateY(-100%);box-shadow:none}
section[id]{scroll-margin-top:120px}
header.nav a{text-transform:uppercase;letter-spacing:0.04em}
details{border-top:1px solid #DCDCD6}
details:last-of-type{border-bottom:1px solid #DCDCD6}
summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:24px;padding:26px 0;font-family:'Inter Tight',sans-serif;font-weight:800;font-size:clamp(20px,2.2vw,26px);letter-spacing:-0.02em}
summary::-webkit-details-marker{display:none}
summary .pm{flex:none;width:40px;height:40px;border-radius:50%;border:2px solid #0A0A0A;display:flex;align-items:center;justify-content:center;font-size:22px;font-weight:700;box-sizing:border-box}
details[open] summary .pm{background:var(--hl)}
.mbar{display:none}
.fgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,200px),1fr));gap:40px}
.fbrand{display:flex;flex-direction:column;gap:12px;grid-column:span 2;min-width:0}
@media (max-width: 560px){.fgrid{grid-template-columns:minmax(0,1fr)}.fbrand{grid-column:auto}}
.fcol{font-size:14px}
.fcol a{color:#D6D6D6;text-decoration:none}
.fcol a:hover{color:#ffffff;text-decoration:underline}
@media (max-width: 700px){
/* The bar sits 60px up so it clears the "Powered by Netlify" badge, which Netlify pins to the bottom-right corner on the free plan.
   If the badge ever goes, set this back to 12px (and the cookie banner below back to 84px). */
.mbar{display:flex;position:fixed;left:12px;right:12px;bottom:60px;z-index:60}
.mbar a{flex:1}
/* Compact header on phones: one row of links, and no second Book button (the bar at the bottom of the screen has it) */
header.nav{padding-top:12px!important;padding-bottom:12px!important;gap:8px 32px!important}
header.nav>a{font-size:40px!important}
header.nav nav{gap:8px 16px!important}
header.nav a.lk{font-size:12.5px}
header.nav .btn{display:none}
.fwire{width:20px}
}
@media (prefers-reduced-motion: reduce){
.roll>span,.frow{transition:none}
.node,.fnode{animation:none}
.frow.show .fnode{background:var(--hl)}
.wire::after{animation:none}
.bar{transition:none}
}

/* Booking form (the white card in the Book section). Behaviour is in /assets/js/booking.js */
.bk{background:#ffffff;color:#0A0A0A;padding:28px;box-sizing:border-box;display:flex;flex-direction:column;gap:20px;box-shadow:8px 8px 0 var(--hl);min-width:0}
.bk *{box-sizing:border-box}
.bk [hidden]{display:none!important}
.bk-mono{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:11px;font-weight:500;line-height:1.4;letter-spacing:0.14em;text-transform:uppercase}
.bk-note{margin:0 0 10px;color:#444444}
.bk-note a,.bk-err a{color:#0A0A0A}
.bk-steps{display:flex;gap:6px}
.bk-chip{flex:1 1 0;min-width:0;display:flex;align-items:center;justify-content:center;gap:8px;padding:8px 6px;background:#ffffff;border:2px solid #0A0A0A;font-weight:600;font-size:13px;line-height:1.2;white-space:nowrap}
.bk-chip b{display:grid;place-items:center;width:22px;height:22px;flex:none;border:1.5px solid #0A0A0A;border-radius:50%;font:500 10px 'JetBrains Mono',ui-monospace,monospace}
.bk-chip.on{background:var(--hl)}
.bk-days{display:flex;gap:6px;overflow-x:auto;padding:2px 2px 8px;margin:0 -2px;scroll-snap-type:x proximity}
.bk-day{flex:0 0 auto;min-width:50px;scroll-snap-align:start;padding:6px 8px;background:#ffffff;border:2px solid #0A0A0A;border-radius:0;cursor:pointer;color:#0A0A0A;text-align:center;line-height:1.1}
.bk-day span{display:block;font-size:10px}
.bk-day .n{font-family:'Inter Tight',sans-serif;font-weight:900;font-size:18px;line-height:1.2;letter-spacing:-0.02em}
.bk-day:hover{background:#F4F4F1}
.bk-day[aria-pressed=true]{background:#0A0A0A;color:#ffffff}
.bk-times{display:grid;grid-template-columns:repeat(auto-fill,minmax(82px,1fr));gap:6px}
.bk-time{min-height:42px;padding:0;background:#ffffff;border:2px solid #0A0A0A;border-radius:999px;font:600 14px 'Inter',system-ui,sans-serif;color:#0A0A0A;cursor:pointer}
.bk-time:hover,.bk-time:focus-visible{background:var(--hl)}
.bk button:focus-visible,.bk input:focus-visible,.bk textarea:focus-visible{outline:3px solid #0A0A0A;outline-offset:2px}
.bk-sum{background:#F4F4F1;border:2px solid #0A0A0A;padding:10px 12px}
.bk-when{font-family:'Inter Tight',sans-serif;font-weight:900;font-size:20px;line-height:1.2;letter-spacing:-0.025em}
.bk label{display:block;margin:16px 0 6px}
.bk-opt{color:#444444;text-transform:none;letter-spacing:0}
.bk input,.bk textarea{display:block;width:100%;margin:0;padding:12px;border:2px solid #0A0A0A;border-radius:0;font:16px/1.4 'Inter',system-ui,sans-serif;background:#ffffff;color:#0A0A0A;-webkit-appearance:none;appearance:none}
.bk textarea{min-height:84px;resize:vertical}
.bk-hp{position:absolute;left:-9999px;height:0;overflow:hidden}
.bk-go{width:100%;margin-top:20px;border:0;cursor:pointer;font-family:inherit}
.bk-go:disabled{opacity:.6;cursor:wait}
.bk-back{background:none;border:0;padding:0;font:inherit;font-size:15px;text-decoration:underline;text-underline-offset:3px;cursor:pointer;color:#444444}
.bk-err{color:#B00020;font-weight:600;margin:12px 0 0}
.mbar.off{display:none}
@media (max-width: 560px){
.bk{padding:20px 18px}
.bk-chip{font-size:11.5px;padding:8px 2px}
.bk-chip b{display:none}
}

/* Cookie banner */
#ckBanner{position:fixed;left:16px;right:16px;bottom:16px;max-width:560px;z-index:2147483000;background:#fff;color:#0A0A0A;border:2px solid #0A0A0A;box-shadow:6px 6px 0 #E2FF3B;padding:20px;font:16px/1.5 'Inter',system-ui,sans-serif;display:none}
#ckBanner p{margin:0 0 14px}
#ckBanner .ckrow{display:flex;gap:12px;flex-wrap:wrap}
#ckBanner button{flex:1 1 140px;min-height:46px;padding:0 20px;font:700 16px 'Inter',system-ui,sans-serif;border:2px solid #0A0A0A;background:#fff;color:#0A0A0A;cursor:pointer}
#ckBanner button:hover,#ckBanner button:focus-visible{background:#E2FF3B}
@media(max-width:700px){#ckBanner{bottom:126px}}