@import url('https://fonts.bunny.net/css?family=cormorant-garamond:300,400|dm-sans:300,400,500&display=swap');
/* Astra Nord — site styles, v2 (cinematic navy) */

:root {
  --navy: #0D2347;
  --navy-deep: #091A36;
  --navy-ink: #071429;
  --sapphire: #1B3A6B;
  --stone: #F0EBE0;
  --silver: #8A9AB5;
  --steel: #5A6B85;
  --text: rgba(240, 235, 224, 0.82);
  --muted: rgba(240, 235, 224, 0.62);
  --line: rgba(240, 235, 224, 0.16);
  --serif: 'Cormorant Garamond', Georgia, serif;
  --sans: 'DM Sans', Helvetica, Arial, sans-serif;
  --gutter: clamp(20px, 5.5vw, 80px);
  --max: 1360px;
}

* { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
  background: var(--navy-deep);
  color: var(--stone);
  font-family: var(--sans);
  font-weight: 300;
  font-size: 16px;
  line-height: 1.75;
  -webkit-font-smoothing: antialiased;
}
img { display: block; width: 100%; height: 100%; object-fit: cover; }
a { color: inherit; text-decoration: none; }

/* ---------- Type ---------- */
.label {
  font-family: var(--sans);
  font-size: 11.5px;
  font-weight: 400;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: var(--muted);
}
h1, h2, h3 { font-family: var(--serif); font-weight: 300; line-height: 1.02; letter-spacing: -0.01em; color: var(--stone); }
h1 { font-size: clamp(46px, 6.2vw, 96px); }
h2 { font-size: clamp(36px, 4.4vw, 66px); }
h3 { font-size: clamp(28px, 2.8vw, 40px); }
.body { font-size: clamp(15px, 1.15vw, 17px); color: var(--text); max-width: 31em; }
.wrap { max-width: var(--max); margin: 0 auto; padding: 0 var(--gutter); }

/* ---------- Header ---------- */
.site-header {
  position: absolute; top: 0; left: 0; right: 0; z-index: 20;
  display: flex; align-items: center; justify-content: space-between;
  padding: 30px var(--gutter);
}
.site-header.solid { position: relative; background: var(--navy-deep); border-bottom: 1px solid var(--line); }
.brand { display: block; }
.brand img { height: 44px; width: auto; object-fit: contain; }
.nav { display: flex; gap: clamp(22px, 3vw, 46px); }
.nav a { font-size: 11px; font-weight: 400; letter-spacing: 0.26em; text-transform: uppercase; color: var(--text); padding: 6px 0; border-bottom: 1px solid transparent; transition: color .3s, border-color .3s; }
.nav a:hover, .nav a[aria-current="page"] { color: var(--stone); border-color: rgba(240,235,224,0.6); }
.menu-toggle, .menu-btn { display: none; }

/* ---------- Cinematic hero: image right, navy mask from the left ---------- */
.hero { position: relative; min-height: 100vh; display: flex; align-items: stretch; background: var(--navy); overflow: hidden; }
.hero .media { position: absolute; top: 0; bottom: 0; right: 0; left: 26%; }
.hero .media img { object-position: left center; }
.hero .media::after {
  content: ''; position: absolute; inset: 0;
  background:
    linear-gradient(90deg, var(--navy) 0%, rgba(13,35,71,0.86) 14%, rgba(13,35,71,0.45) 32%, rgba(13,35,71,0) 52%),
    linear-gradient(180deg, rgba(9,26,54,0.35) 0%, rgba(9,26,54,0) 22%, rgba(9,26,54,0) 72%, rgba(9,26,54,0.55) 100%);
}
.hero .inner {
  position: relative; z-index: 2; width: 100%; max-width: var(--max); margin: 0 auto;
  padding: 150px var(--gutter) 72px;
  display: flex; flex-direction: column; justify-content: space-between; gap: 64px;
}
.hero .lead { max-width: 640px; margin-top: auto; }
.hero .lead .label { margin-bottom: 28px; }
.hero .lead .body { margin-top: 30px; }
.hero .cols { display: flex; gap: 0; max-width: 680px; }
.hero .col { padding-right: 44px; }
.hero .col + .col { padding-left: 44px; padding-right: 0; border-left: 1px solid rgba(240,235,224,0.32); }
.hero .col .label { color: var(--stone); margin-bottom: 14px; display: block; }
.hero .col p { color: var(--text); font-size: 15px; line-height: 1.7; }
.hero .col a.label { transition: opacity .3s; }
.hero .col a.label:hover { opacity: .7; }

/* ---------- Statement band ---------- */
.statement { background: var(--navy-deep); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.statement p { font-family: var(--serif); font-weight: 300; font-size: clamp(26px, 3vw, 42px); line-height: 1.28; max-width: 24em; padding: clamp(64px, 8vw, 120px) 0; color: var(--stone); }

/* ---------- Sections ---------- */
.pad { padding-top: clamp(72px, 9vw, 130px); padding-bottom: clamp(72px, 9vw, 130px); }
.section-head { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 34px; gap: 20px; }
.arrow-link { display: inline-flex; align-items: center; gap: 14px; color: var(--stone); }
.arrow-link::after { content: '→'; font-size: 15px; letter-spacing: 0; transition: transform .3s; }
.arrow-link:hover::after { transform: translateX(4px); }

/* ---------- Project cards ---------- */
.cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(16px, 2vw, 30px); }
.card .frame { aspect-ratio: 16 / 10; overflow: hidden; background: var(--navy); }
.card .frame img { transition: transform 1.4s ease, opacity .6s; opacity: .92; }
.card:hover .frame img { transform: scale(1.04); opacity: 1; }
.card .name { margin-top: 20px; font-size: 12px; letter-spacing: 0.28em; text-transform: uppercase; font-weight: 400; color: var(--stone); }
.card .meta { font-size: 13px; color: var(--muted); margin-top: 4px; }

/* ---------- Next generation banner ---------- */
.gen { position: relative; overflow: hidden; min-height: clamp(320px, 28vw, 430px); background: var(--navy-ink); display: flex; align-items: center; }
.gen .bg { position: absolute; inset: 0; }
.gen .bg img { object-position: 75% center; }
.gen .bg::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(9,26,54,0.97) 0%, rgba(9,26,54,0.84) 30%, rgba(9,26,54,0.3) 58%, rgba(9,26,54,0) 76%); }
.gen .wrap { position: relative; z-index: 2; width: 100%; padding-top: 60px; padding-bottom: 60px; }
.gen .eyebrow { display: flex; align-items: center; gap: 16px; margin-bottom: 24px; }
.gen .eyebrow::after { content: ''; width: 38px; height: 1px; background: rgba(240,235,224,0.5); }
.gen h2 { font-size: clamp(32px, 3.4vw, 50px); max-width: 12em; }
.gen .body { margin-top: 20px; max-width: 22em; }
.gen .soon { margin-top: 30px; color: var(--stone); }

/* ---------- Enquire strip ---------- */
.cta { position: relative; overflow: hidden; min-height: clamp(240px, 22vw, 320px); display: flex; align-items: center; background: var(--navy-ink); }
.cta .bg { position: absolute; inset: 0; }
.cta .bg::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(9,26,54,0.92) 0%, rgba(9,26,54,0.68) 40%, rgba(9,26,54,0.28) 100%); }
.cta .wrap { position: relative; z-index: 2; width: 100%; padding-top: 44px; padding-bottom: 44px; }
.cta h2 { font-size: clamp(32px, 3.8vw, 54px); }
.btn {
  display: inline-flex; align-items: center; gap: 14px; margin-top: 26px;
  background: transparent; color: var(--stone); border: 1px solid rgba(240,235,224,0.55);
  font-size: 11px; letter-spacing: 0.3em; text-transform: uppercase; font-weight: 400;
  padding: 16px 30px; transition: background .3s, border-color .3s;
}
.btn::after { content: '→'; letter-spacing: 0; font-size: 14px; }
.btn:hover { background: rgba(240,235,224,0.08); border-color: var(--stone); }

/* ---------- Steps ---------- */
.steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(18px, 2.4vw, 36px); }
.step .num { display: flex; gap: 22px; margin-bottom: 18px; color: var(--stone); }
.step .num b { font-weight: 400; color: var(--silver); }
.step .frame { aspect-ratio: 4 / 3; overflow: hidden; }
.step p { margin-top: 20px; color: var(--text); font-size: 15px; max-width: 22em; }

/* ---------- Projects page ---------- */
.page-intro { padding: clamp(80px, 10vw, 140px) 0 clamp(36px, 5vw, 64px); }
.page-intro .label { margin-bottom: 24px; }
.page-intro .body { margin-top: 26px; }
.project { display: grid; grid-template-columns: 1.35fr 1fr; gap: clamp(28px, 4.5vw, 72px); align-items: center; padding: clamp(44px, 5vw, 76px) 0; border-top: 1px solid var(--line); }
.project:nth-of-type(even) .frame { order: 2; }
.project .frame { aspect-ratio: 3 / 2; overflow: hidden; }
.project h3 { font-size: clamp(36px, 4vw, 56px); }
.project .type { margin-top: 12px; }
.project p.desc { margin-top: 22px; color: var(--text); max-width: 28em; }
.specs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 28px; margin-top: 30px; padding-top: 26px; border-top: 1px solid var(--line); }
.specs dt { font-size: 10.5px; letter-spacing: 0.26em; text-transform: uppercase; color: var(--muted); }
.specs dd { font-family: var(--serif); font-weight: 300; font-size: 28px; color: var(--stone); }
.design-credit { margin-top: 26px; }

/* ---------- Contact / legal ---------- */
.legal-wrap { border-top: 1px solid var(--line); }
.legal { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(24px, 4vw, 64px); font-size: 14px; color: var(--muted); line-height: 1.85; }
.legal h4 { font-size: 11px; letter-spacing: .28em; text-transform: uppercase; color: var(--stone); font-weight: 400; margin-bottom: 14px; }

/* ---------- Footer ---------- */
.site-footer { background: var(--navy-ink); border-top: 1px solid var(--line); }
.site-footer .top { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 44px 0 30px; flex-wrap: wrap; }
.site-footer .brand img { height: 38px; }
.site-footer .motto { display: flex; align-items: center; gap: 16px; }
.site-footer .motto::before { content: ''; width: 44px; height: 1px; background: rgba(240,235,224,0.4); }
.site-footer .bottom { display: flex; justify-content: space-between; gap: 16px; padding: 22px 0 36px; border-top: 1px solid var(--line); color: var(--muted); font-size: 10.5px; letter-spacing: .24em; text-transform: uppercase; flex-wrap: wrap; }

/* ---------- Reveal ---------- */
.reveal { opacity: 0; transform: translateY(18px); transition: opacity 1.1s ease, transform 1.1s ease; }
.reveal.in { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) { .reveal { opacity: 1; transform: none; transition: none; } }

/* ---------- Tablet & phone ---------- */
@media (max-width: 900px) {
  .hero { flex-direction: column; min-height: 0; }
  .hero .media { position: relative; left: 0; height: 62vh; min-height: 380px; }
  .hero .media img { object-position: 30% center; }
  .hero .media::after { background: linear-gradient(180deg, rgba(9,26,54,0.55) 0%, rgba(13,35,71,0) 26%, rgba(13,35,71,0) 62%, var(--navy) 100%); }
  .hero .inner { padding: 8px var(--gutter) 64px; gap: 48px; }
  .hero .cols { flex-direction: column; gap: 28px; }
  .hero .col, .hero .col + .col { padding: 0; border-left: 0; }
  .hero .col + .col { padding-top: 28px; border-top: 1px solid var(--line); }
  .cards, .steps, .legal { grid-template-columns: 1fr; }
  .project { grid-template-columns: 1fr; }
  .project:nth-of-type(even) .frame { order: 0; }
  .gen .bg::after, .cta .bg::after { background: rgba(9,26,54,0.78); }

  .site-header .nav {
    position: fixed; inset: 0; background: var(--navy-deep); flex-direction: column; justify-content: center; align-items: center; gap: 30px;
    opacity: 0; pointer-events: none; transition: opacity .3s;
  }
  .site-header .nav a { font-size: 14px; }
  .menu-btn { display: block; position: relative; z-index: 30; width: 28px; height: 18px; cursor: pointer; }
  .menu-btn span, .menu-btn::before, .menu-btn::after { content: ''; position: absolute; left: 0; right: 0; height: 1px; background: var(--stone); transition: transform .3s, opacity .3s; }
  .menu-btn::before { top: 0; } .menu-btn span { top: 8px; } .menu-btn::after { top: 16px; }
  .menu-toggle:checked ~ .nav { opacity: 1; pointer-events: auto; z-index: 25; }
  .menu-toggle:checked + .menu-btn::before { transform: translateY(8px) rotate(45deg); }
  .menu-toggle:checked + .menu-btn::after { transform: translateY(-8px) rotate(-45deg); }
  .menu-toggle:checked + .menu-btn span { opacity: 0; }
  .brand img { height: 36px; }
  .site-footer .nav { display: flex; flex-wrap: wrap; gap: 18px; }
}

/* ---------- Contact page ---------- */
.hero-contact { min-height: 0; height: clamp(520px, 62vw, 760px); }
.hero-contact .media { left: 36%; }
.hero-contact .media::after {
  background:
    linear-gradient(90deg, var(--navy-deep) 0%, rgba(9,26,54,0.75) 12%, rgba(9,26,54,0.2) 34%, rgba(9,26,54,0) 50%),
    linear-gradient(180deg, rgba(9,26,54,0.4) 0%, rgba(9,26,54,0) 22%, rgba(9,26,54,0) 80%, rgba(9,26,54,0.6) 100%);
}
.hero-contact { background: var(--navy-deep); }
.hero-contact .inner { justify-content: space-between; padding-top: 130px; padding-bottom: 56px; }
.hero-contact .lead { margin-top: 0; max-width: 520px; }
.hero-contact .sub { margin-top: 28px; font-size: clamp(18px, 1.6vw, 23px); line-height: 1.5; color: var(--text); max-width: 17em; }
.signoff { display: flex; flex-direction: column; gap: 22px; color: var(--text); font-size: 15px; }
.signoff::before { content: ''; width: 34px; height: 1px; background: rgba(240,235,224,0.45); }

.contact-form { border-top: 1px solid var(--line); background: var(--navy-deep); }
.contact-grid { display: grid; grid-template-columns: 1fr 2.1fr; gap: clamp(32px, 6vw, 96px); }
.contact-grid aside h2 { font-size: clamp(30px, 2.6vw, 38px); line-height: 1.12; }
.contact-grid aside .rule { display: block; width: 34px; height: 1px; background: rgba(240,235,224,0.45); margin: 26px 0; }
.contact-grid aside p { color: var(--text); font-size: 15px; line-height: 1.7; margin-bottom: 16px; }
.contact-grid aside a:hover { color: var(--stone); }
.contact-grid aside .appt { margin-top: 44px; margin-bottom: 10px; color: var(--stone); }

.form { display: flex; flex-direction: column; gap: 22px; }
.form .row { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; }
.form label { display: flex; flex-direction: column; gap: 10px; font-size: 11px; letter-spacing: 0.26em; text-transform: uppercase; color: var(--stone); font-weight: 400; }
.form input, .form select, .form textarea {
  font-family: var(--sans); font-size: 15px; font-weight: 300; letter-spacing: 0; text-transform: none;
  color: var(--stone); background: transparent; border: 1px solid rgba(240,235,224,0.32); border-radius: 0;
  padding: 14px 16px; outline: none; transition: border-color .3s, background .3s; width: 100%;
}
.form input::placeholder, .form textarea::placeholder { color: rgba(240,235,224,0.5); }
.form input:focus, .form select:focus, .form textarea:focus { border-color: rgba(240,235,224,0.75); background: rgba(240,235,224,0.03); }
.form select { appearance: none; -webkit-appearance: none; cursor: pointer;
  background-image: linear-gradient(45deg, transparent 50%, #F0EBE0 50%), linear-gradient(135deg, #F0EBE0 50%, transparent 50%);
  background-position: calc(100% - 22px) 50%, calc(100% - 17px) 50%; background-size: 5px 5px; background-repeat: no-repeat; }
.form select option { background: var(--navy-deep); color: var(--stone); }
.form textarea { resize: vertical; min-height: 140px; }
.send {
  margin-top: 6px; display: flex; align-items: center; justify-content: center; position: relative;
  background: transparent; color: var(--stone); border: 1px solid rgba(240,235,224,0.45); padding: 18px 28px; cursor: pointer;
  font-family: var(--sans); font-size: 11.5px; letter-spacing: 0.3em; text-transform: uppercase; font-weight: 400; transition: background .3s, border-color .3s;
}
.send::after { content: '→'; position: absolute; right: 24px; letter-spacing: 0; font-size: 16px; }
.send:hover { background: rgba(240,235,224,0.07); border-color: var(--stone); }
.form-note { min-height: 1.5em; font-size: 14px; color: var(--text); }

.horizon {
  position: relative; text-align: center; padding: clamp(44px, 5vw, 64px) var(--gutter) clamp(52px, 6vw, 72px);
  background:
    radial-gradient(ellipse 45% 70% at 50% 92%, rgba(232,198,150,0.55), transparent 70%),
    linear-gradient(180deg, #34486A 0%, #6E7E95 46%, #B7A88E 82%, #D9B98A 88%, #1B2A44 89%, #0D2347 100%);
}
.horizon p { font-family: var(--serif); font-weight: 300; font-size: clamp(24px, 2.6vw, 36px); color: #F6F3EC; text-shadow: 0 1px 18px rgba(9,26,54,0.35); }
.horizon .rule { display: block; width: 40px; height: 1px; background: rgba(246,243,236,0.7); margin: 22px auto 0; }

/* ---------- Footer v2 ---------- */
.foot-grid { display: grid; grid-template-columns: 1.6fr 1fr 1.3fr 1fr auto; gap: 32px; padding: 54px 0 40px; align-items: start; }
.foot-brand p { margin-top: 18px; font-size: 14px; color: var(--muted); line-height: 1.7; }
.foot-col { display: flex; flex-direction: column; gap: 6px; font-size: 14px; }
.foot-col .label { color: var(--stone); margin-bottom: 8px; font-size: 10.5px; }
.foot-col a { color: var(--text); transition: color .3s; }
.foot-col a:hover { color: var(--stone); }
.foot-cta .btn { margin-top: 0; }
.site-footer .places { letter-spacing: .3em; }

@media (max-width: 900px) {
  .hero-contact { height: auto; }
  .hero-contact .media { left: 0; height: 56vh; }
  .hero-contact .media::after { background: linear-gradient(180deg, rgba(9,26,54,0.5) 0%, rgba(9,26,54,0) 26%, rgba(9,26,54,0) 60%, var(--navy-deep) 100%); }
  .hero-contact .inner { padding-top: 8px; }
  .contact-grid, .form .row { grid-template-columns: 1fr; }
  .foot-grid { grid-template-columns: 1fr 1fr; }
  .foot-brand { grid-column: 1 / -1; }
  .foot-cta { grid-column: 1 / -1; }
}
.contact-grid aside .appt { font-size: 11px; }

/* ---------- Project pages ---------- */
.hero-project { min-height: 88vh; }
.hero-project .media { left: 18%; }
.hero-project .lead .label a { color: var(--stone); }
.hero-project h1 { font-size: clamp(56px, 8vw, 120px); }
.story-grid { display: grid; grid-template-columns: 1.4fr 1fr; gap: clamp(32px, 7vw, 120px); align-items: start; }
.story { font-family: var(--serif); font-weight: 300; font-size: clamp(22px, 2vw, 28px); line-height: 1.45; color: var(--stone); margin-bottom: 24px; max-width: 30em; }
.story + .story { font-family: var(--sans); font-size: 16px; line-height: 1.8; color: var(--text); }
.project-story .specs { margin-top: 0; padding-top: 0; border-top: 0; grid-template-columns: 1fr; gap: 0; }
.project-story .specs div { display: flex; justify-content: space-between; align-items: baseline; padding: 16px 0; border-bottom: 1px solid var(--line); }
.project-story .specs div:first-child { border-top: 1px solid var(--line); }
.gallery-wrap { padding-bottom: clamp(56px, 7vw, 100px); }
.gallery { column-count: 2; column-gap: clamp(14px, 1.8vw, 26px); }
.gallery figure { break-inside: avoid; margin: 0 0 clamp(14px, 1.8vw, 26px); }
.gallery img { height: auto; transition: opacity .4s; }
.gallery a:hover img { opacity: .88; }
.gallery figcaption { margin-top: 10px; font-size: 10.5px; }
.project-nav { display: flex; justify-content: space-between; align-items: center; gap: 20px; padding-top: 36px; padding-bottom: 36px; border-top: 1px solid var(--line); }
.project-nav a { display: flex; flex-direction: column; gap: 6px; }
.project-nav .pn-next { text-align: right; align-items: flex-end; }
.project-nav .pn-name { font-family: var(--serif); font-size: clamp(24px, 2.4vw, 34px); font-weight: 300; color: var(--stone); }
.project-nav .arrow-link { flex-direction: row; }
.project h3 a:hover { opacity: .8; }
.project a.frame { display: block; }
.project .view { margin-top: 18px; }
.lightbox { position: fixed; inset: 0; z-index: 50; background: rgba(7,20,41,0.96); display: flex; align-items: center; justify-content: center; padding: 4vw; cursor: zoom-out; }
.lightbox img { width: auto; height: auto; max-width: 100%; max-height: 100%; object-fit: contain; }
@media (max-width: 900px) {
  .hero-project .media { left: 0; }
  .story-grid { grid-template-columns: 1fr; }
  .gallery { column-count: 1; }
}


/* ---------- Left-aligned layout: text and mask move left (13 Oct) ---------- */
:root { --gutter: clamp(20px, 6vw, 120px); }
.wrap { max-width: none; }
@media (min-width: 901px) {
  .hero .inner { max-width: none; margin: 0; }
  .hero .lead { max-width: 600px; }
  .hero .media { left: 12%; }
  .hero .media::after {
    background:
      linear-gradient(90deg, var(--navy) 0%, rgba(13,35,71,0.8) 12%, rgba(13,35,71,0.35) 28%, rgba(13,35,71,0) 44%),
      linear-gradient(180deg, rgba(9,26,54,0.35) 0%, rgba(9,26,54,0) 22%, rgba(9,26,54,0) 72%, rgba(9,26,54,0.55) 100%);
  }
  .hero-home .media { left: 22%; }
  .hero-project .media { left: 10%; }
  .hero-contact .media { left: 32%; }
  .hero-contact .media::after {
    background:
      linear-gradient(90deg, var(--navy-deep) 0%, rgba(9,26,54,0.7) 10%, rgba(9,26,54,0.15) 28%, rgba(9,26,54,0) 42%),
      linear-gradient(180deg, rgba(9,26,54,0.4) 0%, rgba(9,26,54,0) 22%, rgba(9,26,54,0) 80%, rgba(9,26,54,0.6) 100%);
  }
  .gen .bg::after { background: linear-gradient(90deg, rgba(9,26,54,0.97) 0%, rgba(9,26,54,0.8) 22%, rgba(9,26,54,0.25) 46%, rgba(9,26,54,0) 64%); }
  .cta .bg::after { background: linear-gradient(90deg, rgba(9,26,54,0.92) 0%, rgba(9,26,54,0.6) 30%, rgba(9,26,54,0.2) 70%); }
}


/* ---------- Project CTA line ---------- */
.cta .cta-line { margin-top: 14px; max-width: 30em; color: var(--text); font-size: clamp(15px, 1.2vw, 18px); }


/* ---------- Bright CTA (Spear) ---------- */
.cta.cta-bright .bg::after { background: linear-gradient(90deg, rgba(9,26,54,0.62) 0%, rgba(9,26,54,0.3) 34%, rgba(9,26,54,0) 62%); }
.cta.cta-bright .bg img { filter: brightness(1.12); }
.cta.cta-bright h2, .cta.cta-bright .cta-line { text-shadow: 0 1px 24px rgba(9,26,54,0.45); }
@media (max-width: 900px) { .cta.cta-bright .bg::after { background: rgba(9,26,54,0.45); } }


/* ---------- Gallery as a journey: one image per row, detail to whole ---------- */
.gallery.gallery-flow { column-count: 1; max-width: 1240px; }
.gallery.gallery-flow figure { margin-bottom: clamp(28px, 4vw, 64px); }
.gallery.gallery-flow figure:nth-child(odd) { margin-right: 14%; }
.gallery.gallery-flow figure:nth-child(even) { margin-left: 14%; }
.gallery.gallery-flow figure:last-child { margin-left: 0; margin-right: 0; }
@media (max-width: 900px) { .gallery.gallery-flow figure:nth-child(n) { margin-left: 0; margin-right: 0; } }


/* ---------- Page intro aligned with the hero text ---------- */
.wrap.page-intro { padding-left: var(--gutter); padding-right: var(--gutter); }


/* ---------- Newsletter (footer) ---------- */
.newsletter { display: grid; grid-template-columns: 1fr 1.1fr; gap: clamp(28px, 5vw, 80px); align-items: end; padding: clamp(48px, 6vw, 80px) 0 clamp(40px, 5vw, 64px); border-bottom: 1px solid var(--line); }
.nl-copy .label { margin-bottom: 16px; }
.nl-copy h3 { font-size: clamp(30px, 3vw, 44px); }
.nl-copy p:last-child { margin-top: 14px; color: var(--text); font-size: 15px; max-width: 28em; }
.nl-row { display: flex; border: 1px solid rgba(240,235,224,0.38); transition: border-color .3s; }
.nl-row:focus-within { border-color: rgba(240,235,224,0.8); }
.nl-row input { flex: 1; min-width: 0; background: transparent; border: 0; outline: none; color: var(--stone); font-family: var(--sans); font-size: 15px; font-weight: 300; padding: 16px 18px; }
.nl-row input::placeholder { color: rgba(240,235,224,0.5); }
.nl-row button { background: transparent; border: 0; border-left: 1px solid rgba(240,235,224,0.38); color: var(--stone); font-family: var(--sans); font-size: 11px; letter-spacing: 0.3em; text-transform: uppercase; padding: 0 26px; cursor: pointer; transition: background .3s; }
.nl-row button:hover { background: rgba(240,235,224,0.08); }
.nl-consent { display: flex; gap: 10px; align-items: flex-start; margin-top: 14px; font-size: 13px; color: var(--muted); line-height: 1.5; cursor: pointer; }
.nl-consent input { margin-top: 3px; accent-color: #8A9AB5; }
.nl-note { min-height: 1.4em; margin-top: 10px; font-size: 13px; color: var(--text); }
@media (max-width: 900px) { .newsletter { grid-template-columns: 1fr; } .nl-row button { padding: 0 18px; } }


/* ---------- Gallery v3: tidy two-column grid, equal frames, full-width finale ---------- */
.gallery.gallery-flow { column-count: initial; display: grid; grid-template-columns: 1fr 1fr; gap: clamp(14px, 1.8vw, 26px); max-width: none; }
.gallery.gallery-flow figure, .gallery.gallery-flow figure:nth-child(n) { margin: 0; }
.gallery.gallery-flow figure a { display: block; aspect-ratio: 3 / 2; overflow: hidden; background: var(--navy); }
.gallery.gallery-flow figure img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s ease, opacity .4s; }
.gallery.gallery-flow figure a:hover img { transform: scale(1.03); }
.gallery.gallery-flow figure:last-child { grid-column: 1 / -1; }
.gallery.gallery-flow figure:last-child a { aspect-ratio: 21 / 9; }
.gallery.gallery-flow figure:nth-last-child(2):nth-child(odd) { grid-column: 1 / -1; }
.gallery.gallery-flow figure:nth-last-child(2):nth-child(odd) a { aspect-ratio: 21 / 9; }
@media (max-width: 900px) {
  .gallery.gallery-flow { grid-template-columns: 1fr; }
  .gallery.gallery-flow figure a, .gallery.gallery-flow figure:last-child a { aspect-ratio: 3 / 2; }
}


/* ---------- Enquire in the menu ---------- */
.site-header .nav a.nav-cta { border: 1px solid rgba(240,235,224,0.55); padding: 9px 18px; margin-left: 4px; color: var(--stone); transition: background .3s, border-color .3s; }
.site-header .nav a.nav-cta:hover { background: rgba(240,235,224,0.08); border-color: var(--stone); }
@media (max-width: 900px) { .site-header .nav a.nav-cta { margin-left: 0; margin-top: 8px; } }

/* ---------- Enquire about a project ---------- */
.project-story .btn.enquire-project { margin-top: 30px; }


/* ---------- Refit: delivered ---------- */
.delivered { border-top: 1px solid var(--line); }
.delivered-note { margin-top: 30px; color: var(--text); font-size: 15px; }
.ph { position: relative; background:
  radial-gradient(ellipse 70% 60% at 50% 100%, rgba(138,154,181,0.22), transparent 70%),
  linear-gradient(180deg, #102a52 0%, #0D2347 60%, #091A36 100%); display: flex; align-items: center; justify-content: center; }
.ph::before { content: ''; position: absolute; inset: 0; background: url('assets/favicon.svg') center / 22% no-repeat; opacity: .08; filter: invert(1); }
.ph-note { position: relative; color: var(--stone); }
.hero .media.ph::after { display: none; }
.card-next .frame { border: 1px solid var(--line); }

/* CTA strip background video */
.cta .bg{position:absolute;inset:0;overflow:hidden}
.cta .bg .bg-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
@media (prefers-reduced-motion: reduce){.cta .bg .bg-video{display:none}}

/* Step captions on one line when there is room */
@media (min-width: 900px){
  .steps .step > p:not(.num){max-width:none;text-wrap:nowrap}
}
@media (min-width: 900px) and (max-width: 1280px){
  .steps .step > p:not(.num){text-wrap:wrap}
}

/* Refit reference pages: specs only */
.story-grid.specs-only{display:block;max-width:720px}

/* FAQ */
.faq .faq-list{margin-top:clamp(28px,4vw,44px);border-top:1px solid rgba(240,235,224,.14);max-width:960px}
.faq .faq-list details{border-bottom:1px solid rgba(240,235,224,.14);padding:22px 0}
.faq .faq-list summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:baseline;gap:24px}
.faq .faq-list summary::-webkit-details-marker{display:none}
.faq .faq-list summary h3{margin:0;font-family:'Cormorant Garamond',Georgia,serif;font-weight:300;font-size:clamp(20px,2.2vw,26px);line-height:1.3;color:#F0EBE0;letter-spacing:0;text-transform:none}
.faq .faq-list summary::after{content:'+';font-family:'DM Sans',sans-serif;font-weight:300;font-size:22px;color:#8A9AB5;flex:none}
.faq .faq-list details[open] summary::after{content:'\2013'}
.faq .faq-list details p{margin:14px 0 0;max-width:62ch;color:var(--text);font-size:15px;line-height:1.75}

/* Uniform Enquire strip height */
.cta{min-height:clamp(280px,24vw,340px)}
@media (min-width: 900px){.cta{height:clamp(300px,24vw,340px)}}

/* Disclaimer page */
.disclaimer-page .legal{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:clamp(28px,4vw,48px)}
.disclaimer-page .legal p{max-width:none}
.disclaimer-page .legal a{text-decoration:underline;text-underline-offset:3px}
.disclaimer-page .disclaimer-date{margin-top:clamp(36px,5vw,60px);opacity:.6}

/* Home headline: always two lines, "One name." / "One responsibility." */
.hero-home h1{white-space:nowrap;font-size:clamp(40px,6vw,92px)}
@media (max-width:900px){.hero-home h1{font-size:min(10.6vw,64px)}}


/* Contact sign-off band: same calm-sea film as the Enquire strips */
.horizon{position:relative;overflow:hidden;background:var(--navy-ink);display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:clamp(280px,24vw,340px)}
@media (min-width:900px){.horizon{height:clamp(300px,24vw,340px)}}
.horizon .horizon-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.horizon::after{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 50% 50%,rgba(9,26,54,.35),rgba(9,26,54,.72))}
.horizon > *:not(video){position:relative;z-index:2}
@media (prefers-reduced-motion: reduce){.horizon .horizon-video{display:none}}


/* Silver accents (trial): labels, hairlines, buttons and dividers in metallic silver */
:root{--silver-1:#D9E0EA;--silver-2:#AEB9C9;--silver-3:#8A9AB5;--silver-line:linear-gradient(90deg,rgba(174,185,201,0),#C9D2E0 20%,#EEF2F7 50%,#C9D2E0 80%,rgba(174,185,201,0))}
.label{color:var(--silver-2)}
.hero .lead .label,.page-intro .label,.section-head .label,.nl-copy .label,.foot-col .label,.step .num,.specs dt{color:var(--silver-1)}
.step .num b{color:var(--silver-2)}
.btn,.send,.nl-row,.site-header .nav a.nav-cta{border-color:rgba(201,210,224,.75)}
.btn::after,.send::after,.arrow-link::after{color:var(--silver-1)}
.btn:hover,.send:hover,.site-header .nav a.nav-cta:hover{background:rgba(201,210,224,.12);border-color:var(--silver-1)}
.nl-row button{border-left-color:rgba(201,210,224,.75);color:var(--silver-1)}
.site-header .nav a:hover,.site-header .nav a[aria-current="page"]{border-bottom-color:var(--silver-1)}
.hero .col + .col{border-left-color:rgba(201,210,224,.55)}
@media (max-width:900px){.hero .col + .col{border-top-color:rgba(201,210,224,.4)}}
.statement,.legal-wrap,.delivered,.contact-form,.project-nav,.newsletter,.site-footer .bottom,.project{border-color:rgba(201,210,224,.28)}
.project-story .specs div,.project-story .specs div:first-child,.faq .faq-list,.faq .faq-list details{border-color:rgba(201,210,224,.28)}
.site-footer{border-top:0;position:relative}
.site-footer::before{content:'';position:absolute;left:0;right:0;top:0;height:1px;background:var(--silver-line);opacity:.8}
.statement{position:relative}
.statement::after{content:'';position:absolute;left:var(--gutter);width:64px;bottom:-1px;height:1px;background:#EEF2F7}
.contact-grid aside .rule,.signoff::before,.horizon .rule{background:var(--silver-1)}
.faq .faq-list summary::after{color:var(--silver-1)}
.specs dd{color:#F4F6FA}
.nl-consent input{accent-color:#C9D2E0}

.nl-consent a.nl-privacy{text-decoration:underline;text-underline-offset:3px;color:inherit}
.privacy-page .legal p + p{margin-top:12px}


/* ===== Seasonal accent, autumn 2026: silver (trial, more accents) =====
   Each season only these tokens change. Everything below reads them. */
:root{
  --accent-hi:#EEF2F7;
  --accent-1:#D9E0EA;
  --accent-2:#AEB9C9;
  --accent-3:#8A9AB5;
  --accent-soft:rgba(201,210,224,.28);
  --accent-line:linear-gradient(90deg,rgba(174,185,201,0),#C9D2E0 20%,#EEF2F7 50%,#C9D2E0 80%,rgba(174,185,201,0));
  --accent-rule:linear-gradient(90deg,#EEF2F7,#AEB9C9);
  --accent-metal:linear-gradient(100deg,#AEB9C9 0%,#F4F6FA 42%,#C9D2E0 58%,#8A9AB5 100%);
  --silver-1:var(--accent-1);--silver-2:var(--accent-2);--silver-3:var(--accent-3);--silver-line:var(--accent-line);--silver-hi:var(--accent-1);
}

/* metallic figures: specs and step numbers */
.specs dd,.step .num b{background:var(--accent-metal);-webkit-background-clip:text;background-clip:text;color:transparent}

/* short silver rule before the hero eyebrow and page intros */
.hero .lead .label,.page-intro > .label{display:flex;align-items:center;gap:16px}
.hero .lead .label::before,.page-intro > .label::before{content:'';flex:none;width:36px;height:1px;background:var(--accent-rule)}

/* section heads sit on a silver hairline */
.section-head{position:relative;padding-bottom:18px}
.section-head::after{content:'';position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--accent-line);opacity:.45}

/* project cards: a silver line draws under the image on hover, name turns silver */
.card .frame{position:relative}
.card .frame::after{content:'';position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--accent-line);transform:scaleX(0);transform-origin:left;transition:transform .9s cubic-bezier(.2,.7,.1,1)}
.card:hover .frame::after{transform:scaleX(1)}
.card .name{transition:color .4s}
.card:hover .name{color:var(--accent-hi)}
.card .meta{color:var(--accent-2)}

/* Enquire strips: a short silver rule above the headline */
.cta .wrap::before{content:'';display:block;width:48px;height:1px;background:var(--accent-rule);margin-bottom:22px}

/* next generation banner */
.gen .eyebrow::after{background:var(--accent-rule)}
.gen .soon{color:var(--accent-1)}

/* header gets a silver hairline once it follows the visitor */
.cine .site-header.scrolled::after{content:'';position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--accent-line);opacity:.35}

/* links and hovers */
.project-nav .pn-name{transition:color .4s}
.project-nav a:hover .pn-name,.foot-col a:hover,.contact-grid aside a:hover,.legal a:hover{color:var(--accent-hi)}
.faq .faq-list summary h3{transition:color .4s}
.faq .faq-list summary:hover h3{color:var(--accent-hi)}
.form input:focus,.form select:focus,.form textarea:focus{border-color:var(--accent-1)}
.cine-cue i{background:linear-gradient(var(--accent-1),transparent)}
.cine-cue span{color:var(--accent-1)}
::selection{background:rgba(201,210,224,.38);color:#fff}

/* Astra Nord star cursor (desktop, mouse only) */
@media (hover:hover) and (pointer:fine){
  html,body{cursor:url('assets/cursor-star.svg') 16 16,auto}
  a,button,summary,label,select,[role=button],.card,[data-lightbox]{cursor:url('assets/cursor-star-link.svg') 20 20,pointer}
  input,textarea{cursor:text}
}

/* Star cursor: a faint silver glow on click (seasonal: follows the accent tokens) */
.star-glow{position:fixed;width:46px;height:46px;margin:-23px 0 0 -23px;border-radius:50%;pointer-events:none;z-index:120;
  background:radial-gradient(circle,rgba(238,242,247,.6) 0%,rgba(201,210,224,.16) 45%,rgba(201,210,224,0) 70%);
  background:radial-gradient(circle,color-mix(in srgb,var(--accent-hi,#EEF2F7) 60%,transparent) 0%,color-mix(in srgb,var(--accent-1,#D9E0EA) 24%,transparent) 45%,transparent 70%);
  box-shadow:0 0 0 1px color-mix(in srgb,var(--accent-1,#D9E0EA) 45%,transparent);
  animation:starglow .6s cubic-bezier(.25,.6,.3,1) forwards}
@keyframes starglow{from{transform:scale(.35);opacity:1}to{transform:scale(1.6);opacity:0}}
@media (prefers-reduced-motion:reduce){.star-glow{display:none}}

/* Mobile hero: image always fades into the navy and keeps the header readable; text sits below the image */
@media (max-width:900px){
  .cine .hero .media::after{opacity:1!important}
  .hero .media{overflow:hidden}
  .hero .inner{padding-top:28px}
}
@media (max-width:600px){
  .section-head .label{font-size:10.5px;letter-spacing:.22em;white-space:nowrap}
}

/* Silver rule before eyebrows: inline, so long eyebrows wrap cleanly on phones */
.hero .lead .label,.page-intro > .label{display:block}
.hero .lead .label::before,.page-intro > .label::before{display:inline-block;vertical-align:middle;margin:-3px 14px 0 0}
@media (max-width:900px){.preview-tag{display:none}}
/* Refit steps as technical text (16 Oct 2026): no images, written for captains */
.steps-intro{margin-bottom:clamp(28px,4vw,48px);max-width:34em}
.steps.steps-text .step{border-top:1px solid rgba(201,210,224,.28);padding-top:24px}
.steps.steps-text .step > p:not(.num){text-wrap:wrap;max-width:24em;margin-top:0;color:var(--stone);font-family:var(--serif);font-weight:300;font-size:clamp(20px,1.7vw,24px);line-height:1.35}
.step-list{list-style:none;margin:22px 0 0;padding:0;display:grid;gap:12px}
.step-list li{position:relative;padding-left:22px;color:var(--text);font-size:14.5px;line-height:1.65}
.step-list li::before{content:'';position:absolute;left:0;top:.82em;width:12px;height:1px;background:var(--silver-1,#D9E0EA)}

.site-footer .bottom a{color:inherit;transition:color .3s}
.site-footer .bottom a:hover{color:var(--silver-1,#D9E0EA)}

/* Touch screens (phones and tablets, also in "desktop site" mode): always the burger menu */
@media (hover: none) and (pointer: coarse) {
  .site-header .nav{position:fixed;inset:0;background:var(--navy-deep);flex-direction:column;justify-content:center;align-items:center;gap:30px;opacity:0;pointer-events:none;transition:opacity .3s}
  .site-header .nav a{font-size:14px}
  .site-header .nav a.nav-cta{margin-left:0;margin-top:8px}
  .menu-btn{display:block;position:relative;z-index:30;width:28px;height:18px;cursor:pointer}
  .menu-toggle:checked ~ .nav{opacity:1;pointer-events:auto;z-index:25}
  .site-header.on-light .nav a{color:var(--text)}
  .site-header.on-light .nav a.nav-cta{color:var(--stone);border-color:rgba(201,210,224,.75)}
  .site-header.on-light .nav a[aria-current="page"]{border-color:var(--silver-1,#D9E0EA)}
  .menu-btn span,.menu-btn::before,.menu-btn::after{content:'';position:absolute;left:0;right:0;height:1px;background:var(--stone);transition:transform .3s,opacity .3s,background-color .5s}
  .menu-btn::before{top:0}
  .menu-btn span{top:8px}
  .menu-btn::after{top:16px}
  .menu-toggle:checked + .menu-btn::before{transform:translateY(8px) rotate(45deg)}
  .menu-toggle:checked + .menu-btn::after{transform:translateY(-8px) rotate(-45deg)}
  .menu-toggle:checked + .menu-btn span{opacity:0}
  .site-header.on-light .menu-btn span,.site-header.on-light .menu-btn::before,.site-header.on-light .menu-btn::after{background:#0D2347}
}


/* ---------- Mobile legibility (19 Oct 2026) ----------
   Burger was 28x18 with 1px bars: too fine to see and under the 44px
   tap target. Menu and body type raised a step on phones. */
@media (hover: none) and (pointer: coarse){
  .menu-btn{width:40px;height:44px}
  .menu-btn span,.menu-btn::before,.menu-btn::after{height:2px}
  .menu-btn::before{top:11px}
  .menu-btn span{top:21px}
  .menu-btn::after{top:31px}
  .menu-toggle:checked + .menu-btn::before{transform:translateY(10px) rotate(45deg)}
  .menu-toggle:checked + .menu-btn::after{transform:translateY(-10px) rotate(-45deg)}
  .site-header .nav{gap:34px}
  .site-header .nav a{font-size:17px;letter-spacing:.2em;padding:10px 4px}
  .site-header .nav a.nav-cta{font-size:15px;padding:14px 28px;margin-top:14px}
}
@media (max-width:600px){
  body{font-size:17px}
  .step-list li,.delivered-note,.nl-copy p:last-child{font-size:16px}
  .contact-grid aside .appt{font-size:12.5px}
  .section-head .label{font-size:11.5px}
}


/* ---------- Mobile sizing, second pass (19 Oct 2026) ----------
   Roughly 35% up on logo, burger and menu: the great majority of
   visitors arrive on a phone. */
@media (hover: none) and (pointer: coarse){
  .site-header .brand img{height:48px}
  .menu-btn{width:52px;height:52px}
  .menu-btn span,.menu-btn::before,.menu-btn::after{height:3px}
  .menu-btn::before{top:14px}
  .menu-btn span{top:25px}
  .menu-btn::after{top:36px}
  .menu-toggle:checked + .menu-btn::before{transform:translateY(11px) rotate(45deg)}
  .menu-toggle:checked + .menu-btn::after{transform:translateY(-11px) rotate(-45deg)}
  .site-header .nav{gap:38px}
  .site-header .nav a{font-size:21px;letter-spacing:.16em;padding:12px 6px}
  .site-header .nav a.nav-cta{font-size:17px;padding:16px 32px;margin-top:16px}
}


/* ---------- Mobile sizing, third pass (19 Oct 2026) ----------
   Readable at arm's length for every age. Phone only. */
@media (hover: none) and (pointer: coarse){
  .site-header{padding-top:22px;padding-bottom:22px}
  .site-header .brand img{height:62px}
  .menu-btn{width:64px;height:64px}
  .menu-btn span,.menu-btn::before,.menu-btn::after{height:4px}
  .menu-btn::before{top:16px}
  .menu-btn span{top:30px}
  .menu-btn::after{top:44px}
  .menu-toggle:checked + .menu-btn::before{transform:translateY(14px) rotate(45deg)}
  .menu-toggle:checked + .menu-btn::after{transform:translateY(-14px) rotate(-45deg)}
  .site-header .nav{gap:26px}
  .site-header .nav a{font-size:34px;letter-spacing:.10em;padding:14px 8px;line-height:1.1}
  .site-header .nav a.nav-cta{font-size:24px;padding:18px 40px;margin-top:20px}
}
@media (max-width:600px){
  body{font-size:18px;line-height:1.7}
  .step-list li,.delivered-note,.nl-copy p:last-child{font-size:17px}
  .section-head .label{font-size:12.5px}
}


/* ---------- Consent (19 Oct 2026) ----------
   Nothing third-party loads until the visitor allows it. Bottom bar,
   two buttons of equal weight. § 25 (1) TDDDG, Art. 6 (1) (a) GDPR. */
.cc{position:fixed;left:0;right:0;bottom:0;z-index:70;background:var(--navy-ink);border-top:1px solid var(--line);box-shadow:0 -12px 34px rgba(0,0,0,.3)}
.cc[hidden]{display:none}
.cc-in{max-width:var(--max);margin:0 auto;padding:22px var(--gutter);display:flex;gap:28px;align-items:center;justify-content:space-between;flex-wrap:wrap}
.cc h2{font-family:var(--sans);font-size:12px;letter-spacing:.22em;text-transform:uppercase;color:var(--silver);margin:0 0 8px;font-weight:400}
.cc p{margin:0;max-width:60ch;font-size:15px;line-height:1.6;color:var(--text)}
.cc a{color:var(--stone)}
.cc-act{display:flex;gap:16px;align-items:center;flex-shrink:0}
.cc-btn{display:inline-block;font-family:var(--sans);font-size:12px;letter-spacing:.18em;text-transform:uppercase;padding:15px 30px;border:1px solid var(--stone);background:var(--stone);color:var(--navy-ink);cursor:pointer;transition:background .3s,color .3s}
.cc-btn.alt{background:transparent;color:var(--stone)}
.cc-btn:hover{background:transparent;color:var(--stone)}
.cc-btn.alt:hover{background:var(--stone);color:var(--navy-ink)}
@media (max-width:600px){
  .cc-in{gap:18px;padding-top:20px;padding-bottom:20px}
  .cc p{font-size:16px}
  .cc-act{width:100%}
  .cc-btn{flex:1;text-align:center;font-size:13px;padding:16px 18px}
}


/* ---------- Header restored to original sizes (19 Oct 2026, later) ----------
   The three enlargement passes were judged from a desktop-mode phone view and
   came out oversized. Logo, burger and menu return to their original values;
   the body-copy sizing stays. */
@media (hover: none) and (pointer: coarse){
  .site-header{padding-top:30px;padding-bottom:30px}
  .site-header .brand img{height:36px}
  .menu-btn{width:28px;height:18px}
  .menu-btn span,.menu-btn::before,.menu-btn::after{height:1px}
  .menu-btn::before{top:0}
  .menu-btn span{top:8px}
  .menu-btn::after{top:16px}
  .menu-toggle:checked + .menu-btn::before{transform:translateY(8px) rotate(45deg)}
  .menu-toggle:checked + .menu-btn::after{transform:translateY(-8px) rotate(-45deg)}
  .site-header .nav{gap:30px}
  .site-header .nav a{font-size:14px;letter-spacing:.26em;padding:6px 0}
  .site-header .nav a.nav-cta{font-size:14px;letter-spacing:.26em;padding:9px 18px;margin-top:8px}
}


/* ---------- Burger inset (21 Oct 2026) ----------
   On phones the burger sat against the right edge; bring it in to
   mirror the logo's margin on the left. */
@media (hover: none) and (pointer: coarse){
  .site-header .menu-btn{margin-right:18px}
}


/* ---------- Social, in words (21 Oct 2026) ----------
   Plain links, no icons, no widgets: nothing loads from the platforms. */
.foot-social{margin-top:22px!important;display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;font-size:10.5px!important;letter-spacing:.24em;text-transform:uppercase}
.foot-social a{color:var(--silver-1,#D9E0EA);transition:color .3s}
.foot-social a:hover{color:var(--stone)}
.foot-social span{color:var(--muted)}
@media (hover: none) and (pointer: coarse){.foot-social{font-size:12.5px!important;gap:12px 16px}}

.foot-social{flex-wrap:nowrap;white-space:nowrap;gap:0 10px;letter-spacing:.2em}