/* Shared styles for every roadstead.uk page. Page-specific rules live in each page's own <style>. */

@font-face{font-family:"Instrument Sans";src:url(/assets/fonts/instrument-sans-latin.woff2) format("woff2");
  font-weight:400 600;font-style:normal;font-display:swap}
@font-face{font-family:"IBM Plex Mono";src:url(/assets/fonts/ibm-plex-mono-400-latin.woff2) format("woff2");
  font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"IBM Plex Mono";src:url(/assets/fonts/ibm-plex-mono-500-latin.woff2) format("woff2");
  font-weight:500;font-style:normal;font-display:swap}

/* Fallback faces sized to the web fonts' measured width and height, so the swap does not move the layout.
   Numbers measured in Chromium on 26 Sep 2026 (font box at 100px, width over the homepage and privacy text); weight 600 maps to Arial Bold. */
@font-face{font-family:"Instrument Sans Fallback";src:local("Arial"),local("ArialMT");font-weight:400;
  size-adjust:101%;ascent-override:96.04%;descent-override:24.75%;line-gap-override:0%}
@font-face{font-family:"Instrument Sans Fallback";src:local("Arial"),local("ArialMT");font-weight:500;
  size-adjust:102.1%;ascent-override:95.00%;descent-override:24.49%;line-gap-override:0%}
@font-face{font-family:"Instrument Sans Fallback";src:local("Arial Bold"),local("Arial-BoldMT");font-weight:600 700;
  size-adjust:96.74%;ascent-override:100.27%;descent-override:25.84%;line-gap-override:0%}
@font-face{font-family:"IBM Plex Mono Fallback";src:local("Menlo"),local("Menlo-Regular"),local("Courier New");
  font-weight:400 500;size-adjust:99.66%;ascent-override:102.35%;descent-override:27.09%;line-gap-override:0%}

:root{
  color-scheme:light dark;
  --white:#FFFFFF; --paper:#FAFAF9;
  --sea:#406E7A; --sea-deep:#2A4A54; --sea-lift:#5A8C99;
  --sea-fill:#406E7A; --sea-fill-deep:#2A4A54;
  --black:#0D0D0D; --ink:#0D0D0D; --ink-2:#3D4548; --muted:#6E7376;
  --line:#E2DED9; --hair:#EDEAE6;
  --ground:#FFFFFF; --surface:#FFFFFF;
  --t1:#C5D5E8; --t2:#D4E6EB; --t3:#E7D3BF; --t4:#D7CECC; --t5:#D7DEDF;
  --head-bg:#0D0D0D; --head-line:rgba(255,255,255,.10);
  --foot-bg:#0D0D0D; --foot-line:#0D0D0D;
  --disp:"Instrument Sans","Instrument Sans Fallback",-apple-system,"Helvetica Neue",Arial,sans-serif;
  --mono:"IBM Plex Mono","IBM Plex Mono Fallback",ui-monospace,monospace;
  --pad:clamp(1.15rem,4.5vw,3.5rem); --maxw:64rem;
  --r:16px; --rl:20px; --pill:999px;
  --head-h:4.125rem;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --white:#0D0D0D; --paper:#121312;
  --sea:#7FB3C0; --sea-deep:#A9D2DC;
  --ink:#F2F3F2; --ink-2:#BFC7C9; --muted:#8B9295;
  --line:#242724; --hair:#1B1E1C;
  --ground:#0D0D0D; --surface:#161817;
  --t1:#1B2A38; --t2:#152A31; --t3:#2E241B; --t4:#2A2422; --t5:#20262A;
  --head-line:rgba(255,255,255,.14);
  --foot-bg:#141615; --foot-line:#2C302E;
}}
:root[data-theme="dark"]{
  --white:#0D0D0D; --paper:#121312;
  --sea:#7FB3C0; --sea-deep:#A9D2DC;
  --ink:#F2F3F2; --ink-2:#BFC7C9; --muted:#8B9295;
  --line:#242724; --hair:#1B1E1C;
  --ground:#0D0D0D; --surface:#161817;
  --t1:#1B2A38; --t2:#152A31; --t3:#2E241B; --t4:#2A2422; --t5:#20262A;
  --head-line:rgba(255,255,255,.14);
  --foot-bg:#141615; --foot-line:#2C302E;
}
@media(min-width:64rem){:root{--head-h:4.75rem}}

*{box-sizing:border-box}
[hidden]{display:none!important}
body{margin:0;background:var(--ground);color:var(--ink);font-family:var(--disp);
  font-size:1.0625rem;line-height:1.55;-webkit-font-smoothing:antialiased}
h1,h2,h3,h4{margin:0;font-weight:500;text-wrap:balance}
h1{font-size:clamp(2rem,5.5vw,3.25rem);letter-spacing:-.03em;line-height:1.05}
h2{font-size:clamp(1.4rem,3vw,1.85rem);letter-spacing:-.02em;line-height:1.15}
h3{font-size:1.0625rem;font-weight:600;letter-spacing:-.008em;line-height:1.3}
p{margin:0}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
:focus-visible{outline:2px solid var(--sea);outline-offset:3px}
:where([id]){scroll-margin-top:calc(var(--head-h) + .75rem)}
.wrap{max-width:var(--maxw);margin:0 auto;padding-inline:var(--pad)}
.label{font-family:var(--mono);font-size:.75rem;letter-spacing:.14em;
  text-transform:uppercase;color:var(--muted)}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;font-family:var(--disp);
  font-size:.9375rem;font-weight:500;padding:.72rem 1.4rem;border-radius:var(--pill);
  border:1px solid transparent;cursor:pointer;transition:background .18s,color .18s,border-color .18s}
.btn-light{background:#fff;color:#0D0D0D;border-color:#fff}
.btn-light:hover{background:rgba(255,255,255,.86)}
.btn-outline{background:transparent;color:#fff;border-color:rgba(255,255,255,.42)}
.btn-outline:hover{border-color:#fff;background:rgba(255,255,255,.10)}
.btn-sea{background:var(--sea-fill);color:#fff;border-color:var(--sea-fill)}
.btn-sea:hover{background:var(--sea-fill-deep);border-color:var(--sea-fill-deep)}
.btn[disabled]{opacity:.55;cursor:default}
.linkbtn{display:inline-flex;align-items:center;gap:.4rem;background:none;border:none;padding:0;
  color:inherit;font:inherit;cursor:pointer;text-decoration:underline;text-underline-offset:3px}

/* skip link */
.skip{position:absolute;left:.75rem;top:-5rem;z-index:100;background:#fff;color:#0D0D0D;
  padding:.75rem 1.1rem;border-radius:var(--pill);font-weight:500;box-shadow:0 4px 16px rgba(0,0,0,.25)}
.skip:focus{top:.75rem}

/* header: solid bar; transparent over the hero on pages rendered with data-overlay */
.site-head{position:sticky;top:0;z-index:40;background:var(--head-bg);color:#fff;
  border-bottom:1px solid var(--head-line);transition:background-color .25s,border-color .25s}
.site-head[data-overlay]{position:fixed;left:0;right:0}
.js .site-head[data-overlay]:not(.is-solid){background:transparent;border-bottom-color:transparent}
.site-head :focus-visible{outline-color:#fff}
.nav-quote{margin-left:auto;min-height:44px;padding:.5rem 1rem;font-size:.875rem;flex-shrink:0}
.nav-quote+.nav-toggle{margin-left:0}
.nav-quote .nq-s{display:none}
@media(max-width:29.99rem){.nav-quote .nq-l{display:none}.nav-quote .nq-s{display:inline}}
.nav{position:relative;display:flex;align-items:center;gap:.65rem;min-height:var(--head-h);
  padding:.5rem var(--pad)}
.nav-mark{font-size:1.15rem;font-weight:600;letter-spacing:-.02em;color:#fff;flex-shrink:0;
  padding-block:.6rem}
.nav-mark i{color:var(--sea-lift);font-style:normal}
.nav-toggle{margin-left:auto;display:inline-flex;align-items:center;justify-content:center;gap:.5rem;
  min-height:44px;min-width:44px;background:transparent;border:1px solid rgba(255,255,255,.42);color:#fff;
  border-radius:var(--pill);padding:0 1rem;font-family:var(--disp);font-size:.875rem;
  font-weight:500;cursor:pointer;flex-shrink:0;line-height:1}
.nav-toggle:hover{border-color:#fff;background:rgba(255,255,255,.10)}
.nav-toggle svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round}
.nav-toggle[aria-expanded="true"] .i-menu,.nav-toggle[aria-expanded="false"] .i-close{display:none}
.nav-links{display:none;position:absolute;top:calc(100% - .25rem);left:var(--pad);right:var(--pad);
  flex-direction:column;align-items:stretch;gap:.15rem;padding:.55rem;border-radius:var(--r);
  background:#0B1418;border:1px solid rgba(255,255,255,.12);box-shadow:0 16px 40px rgba(0,0,0,.45);
  max-height:calc(100svh - var(--head-h) - 1rem);overflow-y:auto}
.nav-links.is-open{display:flex}
.nav-links a:not(.btn),.nav-wa{display:flex;align-items:center;min-height:44px;font-size:.975rem;
  color:rgba(255,255,255,.88);padding:.6rem .85rem;border-radius:10px;
  background:none;border:0;font-family:inherit;text-align:left;cursor:pointer;transition:color .15s,background .15s}
.nav-links a:not(.btn):hover,.nav-wa:hover{color:#fff;background:rgba(255,255,255,.08)}
.nav-links a[aria-current="page"]{color:#fff;text-decoration:underline;text-underline-offset:.35em;
  text-decoration-color:var(--sea-lift)}
.nav-links .btn{margin-top:.35rem;font-size:.875rem;padding:.72rem 1.05rem;min-height:44px}
@media(min-width:64rem){
  .nav{gap:.65rem;padding-block:0}
  .nav-toggle,.nav-quote,.nav-links .nav-wa,.nav-links a.nav-wa{display:none}
  .nav-links,.nav-links.is-open{display:flex;position:static;flex-direction:row;align-items:center;
    flex:1;min-width:0;margin-left:.75rem;padding:0;gap:.72rem;justify-content:flex-end;
    background:transparent;border:0;box-shadow:none;max-height:none;overflow:visible}
  .nav-links a:not(.btn){min-height:0;font-size:.8125rem;color:rgba(255,255,255,.78);
    padding:.6rem 0;border-radius:0;white-space:nowrap}
  .nav-links a:not(.btn):hover{color:#fff;background:transparent}
  .nav-links .btn{margin:0 0 0 .35rem;flex-shrink:0;font-size:.8125rem;padding:.5rem .95rem;min-height:0}
}

/* footer */
.foot{background:var(--foot-bg);color:#F2F3F2;border-top:1px solid var(--foot-line);
  padding-block:clamp(3rem,7vw,4.5rem)}
.foot :focus-visible{outline-color:#fff}
.foot-grid{display:grid;gap:2.25rem}
@media(min-width:40rem){.foot-grid{grid-template-columns:1fr 1fr}}
@media(min-width:52rem){.foot-grid{grid-template-columns:1.5fr 1fr 1fr 1fr}}
.foot-h{font-family:var(--mono);font-size:.75rem;letter-spacing:.14em;text-transform:uppercase;
  color:var(--sea-lift);margin-bottom:.9rem;font-weight:400;line-height:1.55}
.foot .foot-mark{color:#F2F3F2;font-size:1.5rem;line-height:1.3;font-weight:600;letter-spacing:-.02em;margin-bottom:.65rem}
.foot-mark i{color:var(--sea-lift);font-style:normal}
.foot p,.foot li{color:rgba(242,243,242,.66);font-size:.9375rem;line-height:1.7}
.foot ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:.3rem}
.foot li a{text-decoration:underline;text-underline-offset:3px}
.foot li a,.foot li .linkbtn{color:#F2F3F2}
.foot li a:hover,.foot li .linkbtn:hover{text-decoration-color:var(--sea-lift)}
.foot-base{margin-top:2.75rem;padding-top:1.5rem;border-top:1px solid rgba(255,255,255,.12)}
.foot .foot-base p{color:rgba(242,243,242,.50);font-size:.8125rem;line-height:1.7;max-width:39rem}
@media (pointer:coarse),(max-width:63.99rem){.foot li a,.foot li .linkbtn{display:inline-flex;align-items:center;min-height:44px;min-width:44px}}

@media (prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important}
}