/* MAKO Global one-pager.
   Every size comes from the designer's two artboards (_src/*.ai):
     phone   = "v-mobile", 1179 pt wide = 393 CSS px at 3x. These are the base rules.
     desktop = "v-desktop", 1920 px wide. Inside @media (min-width: 900px).
   The phone layout is set in rem with 1rem = 16px at 393 px, so it keeps the artboard's proportions
   from about 344 to 442 px; outside that the root size stops at 14 / 18 px and the text just wraps.
   Fonts: Oxanium Bold for every heading (only that weight is used). Body text is Arial as in the
   design; Arimo has Arial's metrics and is only downloaded where Arial is missing (Android, Linux). */

@font-face { font-family: Oxanium; font-weight: 700; font-style: normal; font-display: swap; src: url(../fonts/oxanium-700.woff2) format('woff2'); }
@font-face { font-family: Arimo; font-weight: 400; font-style: normal; font-display: swap; src: url(../fonts/arimo-400.woff2) format('woff2'); }
@font-face { font-family: Arimo; font-weight: 700; font-style: normal; font-display: swap; src: url(../fonts/arimo-700.woff2) format('woff2'); }

:root {
  --head: Oxanium, 'Arial Narrow', Arial, sans-serif;
  --body: Arial, Arimo, 'Liberation Sans', Helvetica, sans-serif;
  --navy: #19296b;
  --band: #e6e7e8;      /* grey bands */
  --line: #caccce;      /* rules, slashes, chevrons */
  --num: #cacccd;       /* big grey numbers and section titles */
  --label: #bcbec0;     /* "Main Partners" */
  --ink: #231f20;       /* body text */
  --muted: #58595b;     /* small print in the About section */
  --soft: #939598;      /* mail address, copyright */
  --photo: #d1dff0;     /* behind the photos */
  --hairline: .0833rem; /* the phone file draws 4 pt = 1.33 px lines */
  color-scheme: light;
}

*, *::before, *::after { box-sizing: border-box; }

html {
  font-size: clamp(87.5%, 4.0712vw, 112.5%);
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  background: #fff;
  scroll-padding-top: 3.125rem;
}
@media (prefers-reduced-motion: no-preference) { html { scroll-behavior: smooth; } }

body {
  margin: 0;
  background: #fff;
  color: var(--ink);
  font: 400 .875rem/1.2 var(--body);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-synthesis: none;
  overflow-x: clip;
}

img, svg { display: block; }
img { max-width: 100%; height: auto; }
h1, h2, h3, h4, p, ul, address { margin: 0; padding: 0; font-style: normal; }
ul { list-style: none; }
h1, h2, h3, h4 { font-family: var(--head); font-weight: 700; color: var(--navy); line-height: 1.2; }
strong { font-weight: 700; }
a { color: inherit; text-decoration: none; }
a:focus-visible, button:focus-visible { outline: 2px solid currentColor; outline-offset: 3px; border-radius: 2px; }
button { font: inherit; color: inherit; background: none; border: 0; padding: 0; margin: 0; cursor: pointer; }
br.d { display: none; }
.nw { white-space: nowrap; }

/* ------------------------------------------------------------ header (phone)
   Over the hero: the logo centred, the burger top right. Once the hero has scrolled away
   (js adds html.stuck) it becomes the 50 px navy bar of the "Meniu" layer. */

.top { position: absolute; inset: 0 0 auto; z-index: 20; height: 0; color: #fff; }
.brand { position: absolute; top: 3.1125rem; left: 50%; width: 5.1625rem; transform: translateX(-50%); }
.brand img { width: 100%; }
.burger, .close {
  position: absolute; top: .1875rem; right: .1875rem;
  width: 2.75rem; height: 2.75rem; display: grid; place-items: center; color: #fff;
}
.burger svg, .close svg { width: 1.0375rem; height: 1.0375rem; overflow: visible; fill: none; stroke: currentColor; stroke-width: 1.4; }

.stuck .top { position: fixed; height: 3.125rem; background: var(--navy); animation: drop .25s ease-out; }
.stuck .brand { top: .73rem; left: 1.04rem; width: 3.44rem; transform: none; }
@keyframes drop { from { transform: translateY(-100%); } }
@media (prefers-reduced-motion: reduce) { .stuck .top { animation: none; } }

/* The menu is a popover: it opens and closes (Esc, tap outside) without any script. */
#menu:popover-open {
  position: fixed; inset: 0 0 auto; width: 100%; max-width: none; height: auto; max-height: 100dvh; overflow: auto;
  margin: 0; border: 0; padding: 0 0 .5rem; background: var(--navy); color: #fff;
  font: 700 .875rem/2.05rem var(--body);
}
#menu::backdrop { background: rgba(25, 41, 107, .25); }
.menu-head { position: relative; height: 3.125rem; }
.menu-head img { position: absolute; top: .73rem; left: 1.04rem; width: 3.44rem; }
#menu .services { width: fit-content; margin: .625rem auto 0; padding-left: 1.2rem; }
#menu .services a, .top .services a { position: relative; display: inline-block; }
.services a::before {
  content: ''; position: absolute; left: -.825rem; top: 50%; width: .52rem; height: .52rem; margin-top: -.21rem;
  background: linear-gradient(to bottom right, transparent calc(50% - .07rem), var(--line) calc(50% - .07rem), var(--line) calc(50% + .07rem), transparent calc(50% + .07rem));
}
#menu .more { display: flex; justify-content: center; gap: 3.625rem; margin-top: .55rem; }
.more a { color: var(--line); }
#menu a:hover { color: var(--line); }
#menu .more a:hover { color: #fff; }

/* ------------------------------------------------------------ hero (phone)
   Square. The photo starts 22% down, under a light band that fades out between 24% and 36%;
   then the whole square is multiplied with navy at 65%, exactly as in the file. */

.hero {
  position: relative; isolation: isolate; overflow: hidden;
  min-height: min(100vw, 40rem);   /* not aspect-ratio + max-height: that shrinks the width too */
  background: #c8cad7; color: #fff; text-align: center;
  padding: 7.39rem 1rem 1rem;
}
.hero-img { position: absolute; z-index: -3; top: 22.43%; left: 50%; height: 91.15%; width: auto; max-width: none; transform: translateX(-48.43%); }
.hero::before { content: ''; position: absolute; z-index: -2; inset: 0; background: linear-gradient(#c8cad7 24.3%, rgba(200, 202, 215, 0) 36.3%); }
.hero::after { content: ''; position: absolute; z-index: -1; inset: 0; background: var(--navy); opacity: .65; mix-blend-mode: multiply; }
.sentinel { position: absolute; top: 9rem; left: 0; width: 1px; height: 1px; }
.hero h1 { color: #fff; font-size: 1.3542rem; line-height: 1.625rem; text-transform: uppercase; }
.down { display: block; width: fit-content; margin: .6rem auto 0; padding: .25rem .5rem; color: #fff; }
.down svg { width: 2.5rem; height: auto; fill: none; stroke: currentColor; stroke-width: 2.4; }

/* ------------------------------------------------------------ partners strip */

/* on the phone layout the strip scales with the screen (vw), like the artboard, not with the text */
.partners {
  display: flex; align-items: center; margin-top: .625rem; height: 8.48vw;
  padding: 0 3.6vw 0 2.05vw; background: var(--band);
}
.partners h2 { flex: none; color: var(--label); font-size: max(2.545vw, 8px); line-height: 1; margin-right: 2.4vw; }
.partners ul { flex: 1; display: flex; align-items: center; justify-content: space-between; }
.partners img { width: calc(var(--w) * .3333 / 393 * 100vw); }
.partners .bc { --w: 154; }
.partners .bco { --w: 144; }
.partners .aa { --w: 132.5; }
.partners .sd { --w: 250; }

/* ------------------------------------------------------------ numbered divider + service bands */

.num {
  display: grid; place-items: center; height: 4.1667rem;
  color: var(--num); font: 700 1.5625rem/1 var(--head);
  background:
    url(../img/badge.svg) center / 2.125rem no-repeat,
    linear-gradient(var(--line), var(--line)) left center / calc(50% - 2.0833rem) var(--hairline) no-repeat,
    linear-gradient(var(--line), var(--line)) right center / calc(50% - 2.0833rem) var(--hairline) no-repeat;
}
.num { padding-top: .1rem; }

.pic { background: var(--photo); overflow: hidden; }
.pic img { width: 100%; height: 100%; object-fit: cover; }
.service .pic { aspect-ratio: 1179 / 500; }
#complex .pic img { object-position: 50% 38.3%; }
#infrastructure .pic img { object-position: 50% 57.7%; }
#property .pic img { object-position: 50% 0; }
#consulting .pic img { object-position: 50% 34.3%; }

.service .text {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  min-height: 20.8333rem; padding: .9rem 1.5rem; background: var(--band); text-align: center;
}
.service .icon { width: 9.375rem; }
.service h2 { margin-top: 1.0625rem; font-size: 1.3542rem; line-height: 1.625rem; }
.service .text p { max-width: 21.4rem; font-size: .875rem; line-height: 1.05rem; text-wrap: balance; }
.service h2 + p { margin-top: .95rem; }
.service p + p { margin-top: 1.05rem; }
/* the phone artboard's text frames */
#complex .text p { max-width: 18.6rem; }
#property .text p { max-width: 21rem; }
#consulting .text p { max-width: 20.4rem; }

/* ------------------------------------------------------------ About */

.rule {
  display: flex; align-items: center; gap: .875rem;
  color: var(--num); font-size: 1.4167rem; line-height: 1; text-align: center;
}
.rule::before, .rule::after { content: ''; flex: 1; height: var(--hairline); margin-bottom: .26em; background: var(--line); }
.about .rule { margin-top: 1.41rem; }

.block { padding: 0 1rem; text-align: center; }
.block h3 { font-size: 1.3542rem; line-height: 1.625rem; text-transform: uppercase; }
.block .lead { max-width: 22rem; margin: .55rem auto 0; color: var(--navy); font: 700 .875rem/1.05rem var(--head); }
.block .small { max-width: 21rem; margin: .675rem auto 0; font-size: .875rem; line-height: 1.05rem; }
.intro { margin-top: 1.16rem; }
.intro .lead { margin-top: .77rem; }

.projects {
  display: grid; gap: var(--hairline); margin: 2.775rem 1.875rem 0;
  background: var(--line); border: var(--hairline) solid var(--line);
}
.cell { background: #fff; padding: 1.0625rem 1.25rem 1.0625rem 2.856rem; }
.cell.pic { padding: 0; aspect-ratio: 2; }
.cell h4 { position: relative; font-size: 1.3542rem; line-height: 1.625rem; }
.cell h4::before {
  content: ''; position: absolute; left: -.775rem; top: .45rem; width: .4rem; height: .75rem;
  background: url(../img/chevron-right.svg) center / contain no-repeat;
}
.cell .sub { margin-top: .6rem; color: var(--navy); font: 700 .875rem/1.05rem var(--head); }
.cell .small { margin-top: .75rem; font-size: .875rem; line-height: 1.05rem; }
.cell .sub + .small { margin-top: .75rem; }
/* LaDiM: in both files its text starts under the chevron, not under the title */
.hang .sub, .hang .small { margin-left: -.79rem; }

.block.grey { background: var(--band); }
.pm { margin-top: 2.0833rem; padding-block: 1.86rem 1.93rem; }

/* MAKO Aviation Complex */
.complex { padding-block: 1.86rem 2.02rem; }
.tenants { display: grid; grid-template-columns: repeat(4, 1fr); align-items: center; justify-items: center; row-gap: 2.8vw; margin: .89rem auto 0; }
.tenants img { width: calc(var(--w) * .435 / 393 * 100vw); }
.t-first { --w: 93.5; } .t-aerial { --w: 163; } .t-ns { --w: 198; } .t-frassi { --w: 161; }
.t-hans { --w: 138; } .t-heli { --w: 165; } .t-sky { --w: 199; } .t-alpha { --w: 181; }

/* MAKO Aviation Consulting */
.plain li { display: block; }
.consult { padding-block: 1.75rem 2.2rem; }
.consult .plain { max-width: 22.5rem; }

/* Young Eagles + Prior Aviation Boards: headings between rules */
.lines { padding: 0; }
.lines h3 { padding: 1rem 1rem .92rem; border-bottom: var(--hairline) solid var(--line); }
.lines h3:first-child { padding-top: 1.06rem; }

/* Team */
.team { margin-top: 2.15rem; }
.team h3 { color: var(--num); font-size: 1.4167rem; line-height: 1.2; text-transform: none; }
.team ul { display: grid; gap: 2.66rem; width: fit-content; margin: 1.3rem auto 0; text-align: left; }
.team li { display: grid; grid-template-columns: 4.1667rem 14.2rem; column-gap: .925rem; align-items: start; }
.team li img { grid-row: span 2; width: 4.1667rem; }
.team h4 { font-size: .875rem; line-height: 1.05rem; padding-bottom: .38rem; background: linear-gradient(var(--line), var(--line)) left bottom / 4.1667rem var(--hairline) no-repeat; }
.team p { margin-top: .4rem; color: #000; font-size: .75rem; line-height: .9rem; }

/* ------------------------------------------------------------ Contact */

footer { position: relative; margin-top: 3rem; padding-bottom: 2.5rem; overflow: hidden; }
footer::before, footer::after { content: ''; position: absolute; bottom: 0; height: 4.375rem; }
footer::before { left: 0; width: 6.52rem; background: var(--navy); clip-path: polygon(0 100%, 67.1% 0, 100% 0, 32.9% 100%); }
footer::after { right: 0; width: 3.625rem; background: var(--band); clip-path: polygon(0 100%, 100% 17.1%, 100% 67.5%, 59.2% 100%); }
.card { position: relative; z-index: 1; display: grid; grid-template-columns: 6.03rem 1fr; column-gap: 2.2rem; align-items: start; margin-top: 1.82rem; padding: 0 1rem 0 1.4rem; }
.card .logo { width: 6.03rem; margin-top: .14rem; }
.card .pin { display: none; }
.card address, .card .mail { color: var(--navy); font: 700 .875rem/1.05rem var(--head); }
.card .mail { margin-top: .25rem; color: var(--soft); }
.card a:hover { text-decoration: underline; text-underline-offset: .15em; }
.card .copy { margin-top: 1.28rem; color: var(--soft); font-size: .5833rem; line-height: 1.2; }

/* ============================================================ desktop artboard (1920 wide) */

@media (min-width: 900px) {
  html { font-size: 100%; scroll-padding-top: 7rem; }
  body { font-size: 1.25rem; line-height: 1.5rem; }
  br.d { display: inline; }
  br.m { display: none; }
  :root { --hairline: 2px; --wrap: 81rem; --gut: 2rem; }

  /* header: absolute 17 px down over the hero; the fixed bar is 100 px */
  .top { top: 1.0625rem; height: 6.25rem; }
  .bar { display: flex; align-items: center; height: 100%; max-width: calc(var(--wrap) + 2 * var(--gut)); margin: 0 auto; padding: 0 var(--gut); }
  .brand, .stuck .brand { position: static; width: 6.4375rem; transform: none; }
  .burger { top: 50%; right: max(1rem, calc(50% - var(--wrap) / 2 - .5rem)); margin-top: -1.375rem; }
  .stuck .top { top: 0; height: 6.25rem; }

  /* hero: 750 px at 1920, cover, with the navy multiply */
  .hero { min-height: 0; height: clamp(35rem, 39.0625vw, 46.875rem); padding: 10.14rem 2rem 0; background: #5c65a0; }
  .hero-img { top: 0; left: 0; width: 100%; height: 100%; transform: none; object-fit: cover; object-position: 50% 6%; }
  .hero::before { content: none; }
  .hero h1 { font-size: 2.5rem; line-height: 3rem; }
  .down { margin-top: 1.54rem; }
  .down svg { width: 4.5rem; stroke-width: 2; }
  .sentinel { top: 7.5rem; }

  .partners { margin-top: 1.25rem; height: 6.25rem; padding: 0 max(var(--gut), calc(50% - var(--wrap) / 2)); }
  .partners h2 { font-size: 1.5625rem; margin-right: 4.3rem; }
  .partners ul { flex: 0 1 67.6rem; }
  .partners img { width: calc(var(--w) / 16 * 1rem); }

  .num { height: 12.5rem; font-size: 4.6875rem; padding-top: .25rem;
    background-size: 6.375rem, calc(50% - 6.25rem) 2px, calc(50% - 6.25rem) 2px; }

  .band {
    display: grid; background: var(--band);
    grid-template-columns: minmax(var(--gut), 1fr) minmax(0, calc(var(--wrap) / 2)) minmax(0, calc(var(--wrap) / 2)) minmax(var(--gut), 1fr);
  }
  .service .pic { grid-column: 2; aspect-ratio: 648 / 500; }
  #complex .pic img { object-position: 85.4% 50%; }
  #infrastructure .pic img { object-position: 50% 100%; }
  #property .pic img { object-fit: contain; object-position: 50% 50%; }
  #consulting .pic img { object-position: 94% 50%; }
  .service .text { grid-column: 3; align-items: flex-start; min-height: 0; padding: 2rem 0 2rem 1.875rem; background: none; text-align: left; }
  .service .icon { width: clamp(10rem, 18.2vw, 15.75rem); }
  .service h2 { margin-top: 2rem; font-size: clamp(1.75rem, 2.9vw, 2.5rem); line-height: 1.2; }
  .service .text p { max-width: 39rem; font-size: clamp(1rem, 1.46vw, 1.25rem); line-height: 1.2; text-wrap: wrap; }
  /* the text frames of the artboard, so lines break where the designer's do */
  #complex .text p { max-width: 36.5rem; }
  #complex .text p + p { margin-top: 0; }
  #infrastructure .text p { max-width: 33.5rem; }
  #property .text p { max-width: 38.25rem; }
  #consulting .text p { max-width: 31rem; }
  .service h2 + p { margin-top: 1.45rem; }
  .service p + p { margin-top: 1.5rem; }

  .rule { gap: 2.7rem; font-size: 4.25rem; }
  .about .rule { margin-top: 4.68rem; }
  .block { padding: 0 var(--gut); }
  .block h3 { font-size: 2.5rem; line-height: 3rem; }
  .block .lead { max-width: 55rem; margin-top: 1.12rem; font-size: 1.5625rem; line-height: 1.875rem; }
  .block .small { max-width: 50rem; margin-top: 1.68rem; color: var(--muted); font-size: 1.125rem; line-height: 1.35rem; }
  .intro { margin-top: 3.86rem; }
  .intro .lead { max-width: 54rem; margin-top: 1.12rem; }
  .pm .lead { max-width: 47.5rem; }
  .pm .small { max-width: 37rem; }
  .complex .lead { max-width: 60rem; }

  .projects {
    grid-template-columns: 1fr 1fr; grid-template-rows: auto auto minmax(18.75rem, auto) minmax(9.375rem, auto) minmax(9.375rem, auto) minmax(6.25rem, auto);
    max-width: 67.875rem; margin: 3.34rem auto 0;
  }
  .cell { display: flex; flex-direction: column; justify-content: center; padding: 1rem 1.25rem 1rem 4.65rem; }
  .fuel .small { max-width: 25.7rem; }
  .hang .sub, .hang .small { margin-left: -1.29rem; }
  .cell.pic { aspect-ratio: 543 / 300; }
  .cell.tall { grid-row: span 2; }
  .cell h4 { font-size: 2.5rem; line-height: 3rem; }
  .cell h4::before { left: -1.3rem; top: .8125rem; width: .75rem; height: 1.375rem; }
  .cell .sub { margin-top: .79rem; font-size: 1.5625rem; line-height: 1.875rem; }
  .cell .small { margin-top: 1rem; color: var(--muted); font-size: 1.125rem; line-height: 1.35rem; }
  .cell .sub + .small { margin-top: 1.13rem; }

  .pm { margin-top: 5.7rem; padding-block: 2.78rem 2.22rem; }
  .complex { padding-block: 5.3rem 5.9rem; }
  .tenants { grid-template-columns: repeat(4, minmax(0, 14.3rem)); row-gap: 1.6rem; max-width: 100%; width: fit-content; margin-top: 2.2rem; }
  .tenants img { width: calc(var(--w) / 16 * 1rem); }
  .consult { padding-block: 2.6rem 2.46rem; }
  .consult .plain { max-width: 48rem; }

  .lines { max-width: 67.875rem; margin: 4.84rem auto 0; padding: 0; }
  .lines h3 { padding: 1.6rem 0 1.6rem; }
  .lines h3:first-child { padding-top: 0; }

  .team { margin-top: 4.26rem; }
  .team h3 { font-size: 2.375rem; }
  .team ul { grid-template-columns: repeat(2, minmax(0, auto)); column-gap: min(5.34rem, 4vw); row-gap: 3.75rem; max-width: calc(100% - 2 * var(--gut)); margin-top: 2.56rem; }
  .team li { grid-template-columns: 6.25rem minmax(0, 21.25rem); column-gap: min(2.54rem, 2.5vw); }
  .team li img { width: 6.25rem; }
  .team h4 { font-size: 1.5625rem; line-height: 1.875rem; padding-bottom: .3rem; background-size: 6.25rem 2px; }
  .team p { margin-top: .4rem; font-size: 1.125rem; line-height: 1.35rem; }

  footer { margin-top: 5.85rem; padding-bottom: 1.6rem; }
  footer::before, footer::after { height: 13.125rem; width: 19.56rem; }
  footer::before { left: calc(50% - 45.53rem); clip-path: polygon(0 100%, 67.1% 0, 100% 0, 32.9% 100%); }
  footer::after { right: calc(50% - 45.53rem); clip-path: polygon(0 100%, 67.1% 0, 100% 0, 32.9% 100%); }
  .card { grid-template-columns: 1fr auto 1fr; column-gap: 0; margin-top: 4.2rem; padding: 0; }
  .card .logo { justify-self: end; width: 15.5rem; margin: 0 5rem 0 0; }
  .card .pin { display: block; width: 3.06rem; margin-top: .7rem; }
  .card .addr { margin-left: 4.35rem; }
  .card address, .card .mail { font-size: 1.5625rem; line-height: 1.875rem; }
  .card .mail { margin-top: .7rem; }
  .card .copy { margin-top: 2.44rem; font-size: .75rem; }
}

/* ------------------------------------------------------------ 900-1099: desktop layout, menu behind the burger */

@media (min-width: 900px) and (max-width: 1099.98px) {
  .burger svg, .close svg { width: 1.375rem; height: 1.375rem; stroke-width: 1.6; }
  #menu:popover-open { padding-bottom: 1.75rem; font-size: 1.0625rem; line-height: 2.6rem; }
  .menu-head { display: flex; align-items: center; height: 6.25rem; max-width: calc(var(--wrap) + 2 * var(--gut)); margin: 0 auto; padding: 0 var(--gut); }
  .menu-head img { position: static; width: 6.4375rem; }
  .close { top: 50%; right: max(1rem, calc(50% - var(--wrap) / 2 - .5rem)); margin-top: -1.375rem; }
  #menu .services { margin-top: .25rem; }
  .services a::before { left: -.975rem; width: .625rem; height: .625rem; margin-top: -.35rem; }
  #menu .more { margin-top: .75rem; }
}

/* ------------------------------------------------------------ full navigation from 1100 px */

@media (min-width: 1100px) {
  .bar { max-width: calc(62.5rem + 2 * var(--gut)); }
  .burger, .menu-head { display: none; }
  /* the popover is an ordinary inline nav here */
  #menu, #menu:popover-open {
    display: flex; align-items: center; position: static; inset: auto; width: auto; height: auto; max-height: none;
    overflow: visible; margin: 0 0 0 3.375rem; padding: 0; border: 0; background: none; color: #fff;
    font: 700 1.0625rem/2.075rem var(--body);
  }
  #menu .services { display: grid; grid-template-columns: auto auto; column-gap: 1.6rem; justify-items: center; width: auto; margin: 0; padding: 0; }
  .services a::before { left: -.975rem; width: .625rem; height: .625rem; margin-top: -.35rem; }
  #menu .more { gap: 2.05rem; margin: 0 0 .25rem 4.5rem; }
  #menu .more a { display: inline-block; padding-block: .5rem; margin-block: -.5rem; }
  #menu .services li { padding-left: .95rem; }
}

/* very old browsers without popover: no burger, the links simply sit in the page */
@supports not selector(:popover-open) {
  .burger, .menu-head { display: none; }
}

/* ------------------------------------------------------------ 404 */
.nf main { display: grid; justify-items: center; gap: 1.5rem; min-height: 100vh; min-height: 100dvh; align-content: center; padding: 2rem; text-align: center; }
.nf main > a img { width: 10rem; }
.nf h1 { font-size: 1.5rem; }
.nf p a { color: var(--navy); text-decoration: underline; text-underline-offset: .15em; }
