/* Fractur — black, white and a brand-coloured blueprint grid. Base: tokens, type, grid, controls, motion. */
@font-face{font-family:'Fractur Euphemia';src:local('Euphemia UCAS'),local('EuphemiaUCAS'),local('Euphemia');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Fractur Euphemia';src:local('Euphemia UCAS Bold'),local('EuphemiaUCAS-Bold');font-weight:700;font-style:normal;font-display:swap}

:root{
  /* Surfaces are black and white; brand navy, slate and teal live in the grid and accents. */
  --brand-navy:#101c2b;
  --navy:#0a0a0b;
  --navy-deep:#000000;
  --navy-2:#131416;
  --navy-3:#1c1e21;
  --slate:#536779;
  --slate-light:#9db0c0;
  --teal:#536779;
  --teal-glow:#8fa2b3;
  --mist:#edf2f5;
  --paper:#ffffff;
  --wash:#fafafa;
  --ink:var(--navy);
  --muted:#5a636d;
  --line:rgba(0,0,0,.1);
  --line-strong:rgba(0,0,0,.2);
  --line-dark:rgba(255,255,255,.12);
  --line-dark-strong:rgba(255,255,255,.26);
  --muted-dark:#a1a9b1;
  --grid:rgba(83,103,121,.17);
  --grid-strong:rgba(83,103,121,.6);
  --cols:12;

  --font:'Fractur Euphemia','Euphemia UCAS','Euphemia','Inter',system-ui,sans-serif;
  --mono:var(--font);

  --gutter:clamp(20px,5vw,80px);
  --max:1520px;
  --header-h:84px;
  --section-y:clamp(96px,13vw,200px);

  --fs-display:clamp(50px,8.6vw,156px);
  --fs-h1:clamp(46px,7vw,120px);
  --fs-h2:clamp(36px,4.8vw,80px);
  --fs-h3:clamp(22px,2vw,30px);
  --fs-lead:clamp(18px,1.45vw,22px);
  --fs-body:16px;
  --fs-small:13px;

  --ease-out:cubic-bezier(.16,1,.3,1);
  --ease-io:cubic-bezier(.76,0,.24,1);
  --ease-soft:cubic-bezier(.33,1,.68,1);
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-behavior:smooth;background:var(--navy-deep)}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
html.scroll-locked{overflow:hidden}
body{margin:0;font-family:var(--font);font-size:var(--fs-body);line-height:1.7;color:var(--ink);background:var(--paper);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility;overflow-x:clip}
img,video,svg,canvas{display:block;max-width:100%}
img{height:auto}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit;color:inherit}
button{background:none;border:0;padding:0;cursor:pointer}
h1,h2,h3,h4,p,ol,ul,dl,dd,figure,blockquote{margin:0}
ol,ul{padding:0;list-style:none}
h1,h2,h3,h4{font-weight:400;letter-spacing:-.035em;line-height:1.06;text-wrap:balance}
h3,h4{font-weight:700;letter-spacing:-.025em}
p{text-wrap:pretty}
/* Upright type only: emphasis is carried by colour, never italics. */
em,i,cite{font-style:normal}
::selection{background:var(--teal);color:#fff}
:focus-visible{outline:2px solid var(--teal);outline-offset:4px}
.on-dark :focus-visible,.site-footer :focus-visible,.site-menu :focus-visible,.site-header :focus-visible,.hero :focus-visible{outline-color:var(--teal-glow)}
[hidden]{display:none!important}
[id]{scroll-margin-top:calc(var(--header-h) + 24px)}
[tabindex="-1"]:focus{outline:none}

/* Blueprint grid — framed 12-column rails in brand colour behind every chapter,
   with crosshair markers where the rails meet each chapter's top rule. */
main>section,.site-footer{position:relative;isolation:isolate;border-top:1px solid var(--grid)}
main>section:first-child{border-top:0}
main>section::before,.site-footer::after{content:"";position:absolute;inset:0 calc(max(0px,(100% - var(--max))/2) + var(--gutter));z-index:-1;pointer-events:none;background-image:repeating-linear-gradient(to right,var(--grid) 0 1px,transparent 1px calc(100%/var(--cols)));border-right:1px solid var(--grid)}
main>section:not(:first-child)::after{content:"";position:absolute;left:calc(max(0px,(100% - var(--max))/2) + var(--gutter) - 6px);right:calc(max(0px,(100% - var(--max))/2) + var(--gutter) - 7px);top:-7px;height:13px;z-index:2;pointer-events:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='13'%3E%3Cpath d='M6.5 0v13M0 6.5h13' stroke='%23536779' stroke-width='1.2'/%3E%3C/svg%3E"),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='13'%3E%3Cpath d='M6.5 0v13M0 6.5h13' stroke='%23536779' stroke-width='1.2'/%3E%3C/svg%3E"),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='13'%3E%3Cpath d='M6.5 0v13M0 6.5h13' stroke='%23536779' stroke-width='1.2'/%3E%3C/svg%3E"),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='13'%3E%3Cpath d='M6.5 0v13M0 6.5h13' stroke='%23536779' stroke-width='1.2'/%3E%3C/svg%3E"),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='13'%3E%3Cpath d='M6.5 0v13M0 6.5h13' stroke='%23536779' stroke-width='1.2'/%3E%3C/svg%3E");background-repeat:no-repeat;background-size:13px 13px;background-position:0 0,25% 0,50% 0,75% 0,100% 0}
.on-dark,.hero,.site-footer,.site-menu,.on-deep{--grid:rgba(143,162,179,.17);--grid-strong:rgba(143,162,179,.6)}
.grid-label{position:absolute;top:14px;right:calc(max(0px,(100% - var(--max))/2) + var(--gutter) + 12px);z-index:2;font-size:10.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--teal)}
.on-dark .grid-label,.hero .grid-label{color:var(--teal-glow)}
@media(max-width:760px){:root{--cols:4}.grid-label{display:none}}

.skip-link{position:fixed;left:16px;top:16px;z-index:1000;padding:12px 18px;background:var(--paper);color:var(--navy);transform:translateY(-200%);transition:transform .3s var(--ease-out)}
.skip-link:focus{transform:none}
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* Layout */
.wrap{width:100%;max-width:var(--max);margin-inline:auto;padding-inline:var(--gutter)}
.section{position:relative;padding-block:var(--section-y)}
.section--tight{padding-block:clamp(72px,9vw,140px)}
.on-dark{background:var(--navy);color:var(--mist);--ink:var(--mist);--muted:var(--muted-dark);--line:var(--line-dark);--line-strong:var(--line-dark-strong)}
.on-deep{background:var(--navy-deep)}
.on-wash{background:var(--wash)}
.grid-12{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:clamp(16px,2vw,32px)}
.rule{height:1px;background:var(--line);border:0;margin:0}

/* Type */
.display{font-size:var(--fs-display);line-height:.98;letter-spacing:-.05em}
.h1{font-size:var(--fs-h1);line-height:1;letter-spacing:-.048em}
.h2{font-size:var(--fs-h2);line-height:1.04;letter-spacing:-.042em}
.h3{font-size:var(--fs-h3);line-height:1.2;letter-spacing:-.025em}
.lead{font-size:var(--fs-lead);line-height:1.65;color:var(--muted);max-width:36em}
.muted{color:var(--muted)}
.display em,.h1 em,.h2 em,.h3 em{color:var(--slate)}
.on-dark .display em,.on-dark .h1 em,.on-dark .h2 em,.on-dark .h3 em,.hero em{color:var(--slate-light)}
.eyebrow{display:inline-flex;align-items:center;gap:12px;font-size:12px;font-weight:700;line-height:1.4;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.eyebrow::before{content:"//";color:var(--teal);letter-spacing:0}
.on-dark .eyebrow::before,.hero .eyebrow::before,.site-footer .eyebrow::before,.site-menu .eyebrow::before{color:var(--teal-glow)}
.eyebrow .dot{width:6px;height:6px;border-radius:50%;background:var(--teal);box-shadow:0 0 0 0 rgba(143,162,179,.55);animation:pulse 2.6s var(--ease-soft) infinite}
.on-dark .eyebrow .dot,.hero .eyebrow .dot{background:var(--teal-glow)}
.index-num{font-size:12px;font-weight:700;letter-spacing:.08em;color:var(--teal)}
.on-dark .index-num,.hero .index-num{color:var(--teal-glow)}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(143,162,179,.5)}70%{box-shadow:0 0 0 10px rgba(143,162,179,0)}100%{box-shadow:0 0 0 0 rgba(143,162,179,0)}}

/* Section heads */
.section-head{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:clamp(16px,2vw,32px);row-gap:28px;align-items:end;margin-bottom:clamp(56px,7vw,112px)}
.section-head .eyebrow{grid-column:1/-1}
.section-head h2{grid-column:1/span 8}
.section-head p{grid-column:9/span 4;color:var(--muted);font-size:17px;line-height:1.75}
@media(max-width:900px){.section-head h2,.section-head p{grid-column:1/-1}}

/* Buttons */
.btn{--btn-bg:var(--navy);--btn-fg:#fff;--btn-fill:var(--teal);position:relative;isolation:isolate;display:inline-flex;align-items:center;justify-content:space-between;gap:28px;min-height:56px;padding:0 26px;font-size:14px;letter-spacing:.01em;line-height:1;background:var(--btn-bg);color:var(--btn-fg);overflow:hidden;white-space:nowrap;transition:color .5s var(--ease-out)}
.btn::before{content:"";position:absolute;inset:0;z-index:-1;background:var(--btn-fill);transform:translateY(101%);transition:transform .6s var(--ease-out)}
.btn:hover::before,.btn:focus-visible::before{transform:none}
.btn-arrow{display:inline-block;font-size:18px;transition:transform .5s var(--ease-out)}
.btn:hover .btn-arrow,.btn:focus-visible .btn-arrow{transform:translate(3px,-3px)}
.btn--light{--btn-bg:var(--mist);--btn-fg:var(--navy);--btn-fill:#fff}
.btn--ghost{--btn-bg:transparent;--btn-fg:currentColor;--btn-fill:rgba(237,242,245,.1);box-shadow:inset 0 0 0 1px var(--line-dark-strong)}
.btn--ghost-dark{--btn-bg:transparent;--btn-fg:var(--navy);--btn-fill:var(--wash);box-shadow:inset 0 0 0 1px var(--line-strong)}
.btn--sm{min-height:44px;padding:0 18px;gap:18px;font-size:13px}
.btn--lg{min-height:68px;padding:0 34px;gap:48px;font-size:15px}
.btn-row{display:flex;flex-wrap:wrap;gap:14px}

.link-arrow{display:inline-flex;align-items:center;gap:12px;min-height:44px;font-size:14px;position:relative;padding-bottom:2px}
.link-arrow::after{content:"";position:absolute;left:0;right:30px;bottom:8px;height:1px;background:currentColor;transform-origin:right;transform:scaleX(.0001);transition:transform .6s var(--ease-out)}
.link-arrow:hover::after,.link-arrow:focus-visible::after{transform-origin:left;transform:none}
.link-arrow .btn-arrow{font-size:16px}
.link-arrow:hover .btn-arrow{transform:translate(3px,-3px)}

/* Media */
.media{position:relative;overflow:hidden;background:var(--navy-2)}
.media>img,.media>video{width:100%;height:100%;object-fit:cover}
.grain{pointer-events:none;position:absolute;inset:-50%;z-index:3;opacity:.09;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 .6 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");animation:grain 1.2s steps(6) infinite}
@keyframes grain{0%{transform:translate(0,0)}20%{transform:translate(-4%,3%)}40%{transform:translate(3%,-5%)}60%{transform:translate(-5%,-2%)}80%{transform:translate(4%,5%)}100%{transform:translate(0,0)}}
/* Particle artwork is supplied on white; this treatment places it on dark chapters. */
.particles-on-dark{filter:invert(1) hue-rotate(180deg) brightness(1.05) contrast(1.1);mix-blend-mode:screen}

/* The supplied particle film is violet; grade it into the navy/slate palette. */
.film-graded{filter:grayscale(1) contrast(1.2) brightness(1.05)}
.film-tint{position:absolute;inset:0;background:#4f7d9a;mix-blend-mode:color;opacity:.7;pointer-events:none}

/* Reveal states — content stays visible unless the motion script is running. */
.line{display:block;overflow:hidden;padding-bottom:.1em;margin-bottom:-.1em}
.line>span{display:block}
html.motion-ready [data-lines] .line>span{transform:translateY(108%);transition:transform 1.25s var(--ease-out);transition-delay:calc(var(--i,0)*90ms + var(--d,0ms))}
html.motion-ready [data-lines].is-in .line>span{transform:none}
html.motion-ready [data-reveal]{opacity:0;transform:translateY(32px);transition:opacity 1.1s var(--ease-out),transform 1.1s var(--ease-out);transition-delay:calc(var(--i,0)*80ms + var(--d,0ms))}
html.motion-ready [data-reveal].is-in{opacity:1;transform:none}
html.motion-ready [data-reveal="fade"]{transform:none}
html.motion-ready [data-reveal="image"]{opacity:1;transform:none;clip-path:inset(100% 0 0 0);transition:clip-path 1.4s var(--ease-io)}
html.motion-ready [data-reveal="image"] img,html.motion-ready [data-reveal="image"] video{transform:scale(1.22);transition:transform 2s var(--ease-out)}
html.motion-ready [data-reveal="image"].is-in{clip-path:inset(0 0 0 0)}
html.motion-ready [data-reveal="image"].is-in img,html.motion-ready [data-reveal="image"].is-in video{transform:scale(1)}
html.motion-ready [data-reveal="rule"]{opacity:1;transform:scaleX(0);transform-origin:left;transition:transform 1.6s var(--ease-io)}
html.motion-ready [data-reveal="rule"].is-in{transform:none}
[data-scrub-words] .word{opacity:var(--o,1);transition:opacity .25s linear}

@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;transition-delay:0ms!important}
  .grain{display:none}
}
/* Large titles stay regular weight; bold is reserved for small titles and labels. */
.benefit-row h3,.principle h3,.accordion summary,.image-card h3,.profile-copy h3,.roles h3,.ledger h3,.footer-cta-title,.menu-links a{font-weight:400}
.eyebrow .dot{display:none}