/* Shared by every page: fonts, accessibility helpers, cookie notice, open-now badge. */

@font-face{font-family:'Fraunces';font-style:normal;font-weight:300 700;font-display:swap;
  src:url(../fonts/fraunces.woff2) format('woff2')}
@font-face{font-family:'Fraunces';font-style:italic;font-weight:300 700;font-display:swap;
  src:url(../fonts/fraunces-italic.woff2) format('woff2')}
@font-face{font-family:'Space Grotesk';font-style:normal;font-weight:300 700;font-display:swap;
  src:url(../fonts/space-grotesk.woff2) format('woff2')}

/* Without this, any element given display:flex/grid ignores the hidden attribute. */
[hidden]{display:none!important}

.skip{position:absolute;left:-9999px;top:0;z-index:100;background:#ffc400;color:#1c0e05;
  padding:12px 20px;border-radius:0 0 10px 0;font-weight:700}
.skip:focus{left:0}
:focus-visible{outline:2px solid #ffc400;outline-offset:3px}

/* Cookie notice: Accept and Decline are deliberately identical in size, colour and position. */
.cookie{position:fixed;left:16px;right:16px;bottom:16px;z-index:90;max-width:540px;
  background:rgba(22,10,3,.97);border:1px solid rgba(255,196,0,.4);border-radius:16px;
  padding:18px 20px;display:flex;gap:16px;align-items:center;flex-wrap:wrap;
  box-shadow:0 18px 50px rgba(0,0,0,.5);color:#fff3da;font-family:'Space Grotesk',sans-serif;
  line-height:1.55;text-shadow:none}
.cookie p{font-size:13.5px;flex:1 1 240px;margin:0;font-weight:400}
.cookie a{color:#ffc400;text-decoration:underline}
.cookie-btns{display:flex;gap:10px;flex:0 0 auto}
.cookie button{font:inherit;font-size:13.5px;font-weight:700;padding:11px 20px;min-height:44px;
  border-radius:999px;cursor:pointer;background:#fff3da;color:#1c0e05;border:1.5px solid #fff3da;text-shadow:none}
.cookie button:hover{background:#ffc400;border-color:#ffc400}
@media(max-width:767px){.cookie{left:12px;right:12px;padding:16px;bottom:calc(84px + env(safe-area-inset-bottom,0px))}}
@media(max-height:420px){.cookie{bottom:12px}}

/* Link-styled button used for "Cookie settings" */
.linkbtn{font:inherit;background:none;border:0;padding:0;color:inherit;text-decoration:underline;cursor:pointer;text-shadow:inherit}
.linkbtn:hover{color:#ffc400}
@media(pointer:coarse){.linkbtn{min-height:44px;display:inline-flex;align-items:center}}

/* Live open / closed badge (written by site.js) */
.open-now{margin-top:16px;font-weight:600;font-size:14.5px;display:flex;align-items:center;gap:9px}
.open-now::before{content:"";width:9px;height:9px;border-radius:50%;flex:0 0 auto}
.open-now.is-open{color:#8ff0b4}.open-now.is-open::before{background:#39d17a;box-shadow:0 0 10px #39d17a}
.open-now.is-closed{color:#ffc2a0}.open-now.is-closed::before{background:#ff7a45}

/* Review line under the first heading */
.hero-trust{font-size:14px;opacity:.92;margin-top:18px}
.hero-trust b{color:#ffc400}
.hero-trust a{color:#fff3da}
@media(min-width:768px){.hero-trust{grid-column:1}}

/* Temporary notice (closures, bank-holiday hours). Sits above everything and
   pushes the page down by its own height (--notice-h, set by site.js). */
.site-notice{position:fixed;top:0;left:0;right:0;z-index:95;background:#ffc400;color:#1c0e05;
  font:600 14px/1.4 'Space Grotesk',sans-serif;text-align:center;padding:9px 16px;text-shadow:none}
html.has-notice body{padding-top:var(--notice-h,0px)}
html.has-notice #nav,html.has-notice nav[aria-label="Main"]{top:var(--notice-h,0px)}
html.has-notice section{scroll-margin-top:calc(72px + var(--notice-h,0px))}

/* Inline icons inside buttons and the dock */
.ico{width:1.2em;height:1.2em;flex:0 0 auto;display:inline-block;vertical-align:-.2em}

/* Phone dock: two actions only, floating above the page */
.callbar{display:none;position:fixed;z-index:60;left:12px;right:12px;
  bottom:calc(10px + env(safe-area-inset-bottom,0px));padding:6px;gap:6px;border-radius:24px;
  background:rgba(26,12,4,.84);-webkit-backdrop-filter:blur(16px) saturate(1.3);backdrop-filter:blur(16px) saturate(1.3);
  border:1px solid rgba(255,196,0,.22);box-shadow:0 18px 44px rgba(0,0,0,.5);
  font-family:'Space Grotesk',sans-serif}
.callbar a{flex:1 1 0;min-width:0;min-height:54px;display:flex;align-items:center;gap:10px;
  padding:8px 14px;border-radius:18px;text-decoration:none;color:#fff3da;
  transition:transform .15s}
.callbar a:active{transform:scale(.97)}
.callbar .ico{width:22px;height:22px}
.callbar .t{display:flex;flex-direction:column;min-width:0;line-height:1.15}
.callbar .t b{font-size:15px;font-weight:700;letter-spacing:.01em;white-space:nowrap}
.callbar .t small{font-size:11.5px;opacity:.78;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.callbar .dock-msg{background:linear-gradient(105deg,#ffc400,#ff9d00);color:#1c0e05;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.45)}
.callbar .dock-msg small{opacity:.72}
.callbar .dock-map{background:rgba(255,243,218,.07);border:1px solid rgba(255,243,218,.16)}
.callbar .dock-map .ico{color:#ffc400}
@media(max-width:767px){.callbar{display:flex}}
@media(max-width:360px){.callbar a{gap:7px;padding:8px 10px;justify-content:center}.callbar .t b{font-size:14px}.callbar .t small{display:none}}
@media(max-height:420px){.callbar{display:none!important}}

/* Review seal: the recommend score as a ring, linking to the Facebook reviews */
.seal{display:inline-flex;align-items:center;gap:14px;padding:8px 22px 8px 8px;border-radius:999px;
  background:rgba(255,243,218,.06);border:1px solid rgba(255,196,0,.3);color:#fff3da;text-decoration:none;
  font-family:'Space Grotesk',sans-serif;max-width:100%;transition:border-color .2s,background .2s}
.seal:hover{border-color:#ffc400;background:rgba(255,196,0,.1)}
.seal-ring{position:relative;width:58px;height:58px;flex:0 0 auto;display:grid;place-items:center}
.seal-ring svg{position:absolute;inset:0;width:100%;height:100%;transform:rotate(-90deg)}
.seal-ring circle{fill:none;stroke-width:3.5}
.seal-ring .trk{stroke:rgba(255,196,0,.18)}
.seal-ring .arc{stroke:#ffc400;stroke-linecap:round;stroke-dasharray:100 100;stroke-dashoffset:calc(100 - var(--pct,100))}
.seal-pct{font-family:'Fraunces',serif;font-weight:600;font-size:14px;color:#ffc400;letter-spacing:-.02em}
.seal-t{display:flex;flex-direction:column;min-width:0;line-height:1.25}
.seal-h{font-family:'Fraunces',serif;font-size:18px;font-weight:500}
.seal-s{font-size:13px;opacity:.8}
.seal-s u{white-space:nowrap;text-decoration-color:rgba(255,196,0,.7);text-underline-offset:3px;margin-left:4px;color:#ffc400}
.seal.lg{padding:12px 30px 12px 12px;gap:18px}
.seal.lg .seal-ring{width:84px;height:84px}
.seal.lg .seal-pct{font-size:20px}
.seal.lg .seal-h{font-size:clamp(20px,2.4vw,24px)}
.seal.lg .seal-s{font-size:14px}
.call .ico{margin-right:7px}
.g-review{color:#fff3da;font-size:14px;opacity:.85;text-underline-offset:3px}
.g-review:hover{color:#ffc400;opacity:1}
@media(pointer:coarse){.call .ico{margin-right:7px}
.g-review{display:inline-flex;align-items:center;min-height:44px}}
@media(prefers-reduced-motion:no-preference){
  .seal-ring .arc{animation:seal-draw 1.4s .6s cubic-bezier(.3,.7,.2,1) both}
  @keyframes seal-draw{from{stroke-dashoffset:100}}
  .rv .seal-ring .arc{animation:none}
  .rv.in .seal-ring .arc{animation:seal-draw 1.4s .2s cubic-bezier(.3,.7,.2,1) both}
}
@media(max-width:480px){.seal.lg{padding:10px 20px 10px 10px;gap:14px}.seal.lg .seal-ring{width:70px;height:70px}.seal.lg .seal-pct{font-size:17px}}

/* Trustpilot review box. Before consent it is a plain link styled like this; after
   consent Trustpilot's script swaps in its own widget at the same size. */
.tp-box{width:100%;max-width:340px}
.trustpilot-widget{min-height:52px}
.tp-link{text-shadow:none;display:flex;align-items:center;justify-content:center;gap:8px;min-height:52px;padding:0 20px;border-radius:12px;
  background:#fff;color:#191919;text-decoration:none;font-family:'Space Grotesk',sans-serif;font-size:15px;font-weight:500;
  box-shadow:0 8px 24px rgba(0,0,0,.25)}
.tp-link b{font-weight:700}
.tp-star{color:#00b67a;font-size:20px;line-height:1}
.tp-link:hover{box-shadow:0 0 0 2px #00b67a,0 8px 24px rgba(0,0,0,.25)}
