/* primetto.co.uk: the company website. No scripts, no cookies, no third parties. */
@font-face { font-family: 'DM Sans'; src: url('/fonts/dm-sans-latin-wght-normal.woff2') format('woff2'); font-weight: 100 1000; font-style: normal; font-display: swap; }
@font-face { font-family: 'Fraunces'; src: url('/fonts/fraunces-latin-wght-normal.woff2') format('woff2'); font-weight: 100 900; font-style: normal; font-display: swap; }
@font-face { font-family: 'Fraunces'; src: url('/fonts/fraunces-latin-wght-italic.woff2') format('woff2'); font-weight: 100 900; font-style: italic; font-display: swap; }

:root {
  --navy: #1E2A33; --navy3: #33434F; --cream: #F6F1E8; --cream2: #EFE7DA; --card: #FFFDF8;
  --line: #E3D9C8; --line2: #D6CAB5; --ink: #1E2A33; --soft: #4A5560; --mute: #6B757D;
  --terra: #B4532A; --terra2: #8F4021; --peach: #E08A5E; --peach-l: #F7E1D3;
}

* { box-sizing: border-box; margin: 0; padding: 0; }
html { -webkit-text-size-adjust: 100%; }
body { background: var(--cream); color: var(--ink); font-family: 'DM Sans', Arial, sans-serif; font-size: 17px; line-height: 1.55; }
a { color: var(--terra2); }
a:focus-visible, .btn:focus-visible { outline: 3px solid var(--peach); outline-offset: 3px; }
.wrap { max-width: 1080px; margin: 0 auto; padding: 0 20px; }
.muted { color: var(--mute); font-size: 15px; }

.top { display: flex; align-items: center; justify-content: space-between; padding-top: 22px; padding-bottom: 22px; }
.logo { display: inline-flex; align-items: center; gap: 10px; font-family: 'Fraunces', Georgia, serif; font-size: 26px; font-weight: 560; letter-spacing: -0.3px; color: var(--ink); text-decoration: none; }
.logo .mark { width: 34px; height: 34px; border-radius: 9px; background: var(--peach); color: var(--navy); display: grid; place-items: center; }
.top-link { font-weight: 600; font-size: 15px; color: var(--ink); text-decoration: none; padding: 8px 14px; border: 1px solid var(--line2); border-radius: 999px; background: var(--card); }
.top-link:hover { border-color: var(--ink); }

.hero { padding-top: 56px; padding-bottom: 72px; max-width: 900px; margin-left: max(0px, calc((100% - 1080px) / 2)); }
.kicker { font-size: 13px; font-weight: 700; letter-spacing: 2.5px; text-transform: uppercase; color: var(--terra); margin-bottom: 18px; }
h1 { font-family: 'Fraunces', Georgia, serif; font-weight: 500; font-size: clamp(40px, 7vw, 76px); line-height: 1.03; letter-spacing: -1px; }
h1 em { display: block; font-style: italic; color: var(--terra); }
.lede { margin-top: 24px; font-size: clamp(18px, 2.2vw, 21px); color: var(--soft); max-width: 720px; }
.actions { margin-top: 32px; display: flex; flex-wrap: wrap; align-items: center; gap: 14px 20px; }
.btn { display: inline-flex; align-items: center; gap: 8px; min-height: 48px; padding: 0 22px; border-radius: 10px; background: var(--terra); color: #fff; font-weight: 650; font-size: 16px; text-decoration: none; }
.btn:hover { background: var(--terra2); }
.btn.ghost { background: var(--card); color: var(--ink); border: 1px solid var(--line2); }
.btn.ghost:hover { border-color: var(--ink); background: var(--card); }

.band { background: var(--navy); color: var(--cream); padding: 64px 0 72px; }
h2 { font-family: 'Fraunces', Georgia, serif; font-weight: 500; font-size: clamp(30px, 4vw, 42px); line-height: 1.1; letter-spacing: -0.5px; }
.grid { list-style: none; margin-top: 32px; display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 16px; }
.card { background: #26343F; border: 1px solid var(--navy3); border-radius: 14px; padding: 22px 22px 24px; }
.card h3 { font-size: 18px; font-weight: 700; margin: 14px 0 6px; color: #fff; }
.card p { color: #C9D3D6; font-size: 15.5px; }
.icon { width: 40px; height: 40px; border-radius: 10px; background: var(--peach); color: var(--navy); display: grid; place-items: center; }
.icon svg { width: 22px; height: 22px; }

.pilot { padding-top: 64px; padding-bottom: 72px; max-width: 760px; margin-left: max(0px, calc((100% - 1080px) / 2)); }
.pilot p { margin: 16px 0 26px; color: var(--soft); font-size: 18px; }

.foot { border-top: 1px solid var(--line); background: var(--cream2); padding: 28px 0 36px; font-size: 14px; color: var(--soft); }
.foot p + p { margin-top: 4px; }

.notfound { padding-top: 56px; padding-bottom: 96px; }
.notfound p { margin: 16px 0 26px; color: var(--soft); }
