:root {--nav-red:#c82f28; --nav-width:1480px;}
.topline {height:28px; background:#080e14; color:#8095a1; border-bottom:1px solid #1b2a32; display:flex; align-items:center; justify-content:space-between; padding:0 max(40px,calc((100vw - var(--nav-width))/2)); font:750 10px/1 Inter,"Segoe UI",Arial,sans-serif; letter-spacing:.2em;}
.topline i {display:inline-block; width:3px; height:3px; margin:0 8px; border-radius:50%; background:var(--nav-red); box-shadow:0 0 10px var(--nav-red); vertical-align:middle;}
.topline a {color:#dfe7e9; text-decoration:none; letter-spacing:.04em;}
.topline a span {color:var(--nav-red);}
.header {height:76px; position:sticky; top:0; z-index:60; background:rgba(7,12,18,.92); border-bottom:1px solid #34454d88; color:#f7f9fa; backdrop-filter:blur(26px); box-shadow:0 12px 35px #0005; font-family:Inter,"Segoe UI",Arial,sans-serif;}
.header:after {content:""; position:absolute; bottom:-1px; left:0; width:26%; height:1px; background:linear-gradient(90deg,transparent,var(--nav-red),transparent); opacity:.8;}
.nav-container {width:min(100% - 80px,var(--nav-width)); margin-inline:auto;}
.navrow {height:100%; display:flex; align-items:center; gap:18px;}
.brand {width:188px; height:70px; display:flex; align-items:center; overflow:visible; flex:none;}
.brand img {display:block; width:188px; max-width:none; height:auto;}
.nav {display:flex; align-items:center; gap:clamp(15px,2vw,32px); margin-left:auto; margin-right:8px; font-size:13px; font-weight:650;}
.nav a {position:relative; color:#c6d2d6; text-decoration:none; transition:color .2s;}
.nav a:hover, .nav a.is-current {color:#fff;}
.nav-book {display:inline-flex; align-items:center; justify-content:center; border:0; border-radius:4px; padding:12px 18px; background:var(--nav-red); color:#fff; text-decoration:none; font-size:13px; font-weight:750; white-space:nowrap; transition:background .2s,transform .2s;}
.nav-book:hover {background:#b62823; transform:translateY(-2px);}
.nav-book span {margin-left:16px;}
.menu-button {display:flex; flex:none; min-width:96px; height:43px; padding:0 14px; gap:12px; border:1px solid #728d82; border-radius:4px; background:#ffffff0b; color:#f5f8f6; align-items:center; justify-content:center; font:800 13px/1 Inter,"Segoe UI",Arial,sans-serif; white-space:nowrap; cursor:pointer;}
.menu-button:hover {background:#ffffff1c; border-color:#c5dad1;}
.menu-bars {display:flex; flex-direction:column; gap:5px;}
.menu-bars i {display:block; width:18px; height:2px; background:#f6f8f5; transition:transform .25s;}
.menu-button[aria-expanded=true] .menu-bars i:first-child {transform:translateY(3.5px) rotate(45deg);}
.menu-button[aria-expanded=true] .menu-bars i:last-child {transform:translateY(-3.5px) rotate(-45deg);}
.mobile-nav[hidden] {display:none!important;}
.mobile-nav:not([hidden]) {display:block; position:absolute; top:76px; left:0; right:0; width:100%; height:calc(100dvh - 76px); overflow:auto; background:linear-gradient(135deg,#081019,#12202a 65%,#0a0d12); border-top:1px solid #4d647055; color:#f6f7f1; box-shadow:0 25px 55px #06110b63; animation:menuDrop .35s both;}
.header .mega-inner {width:min(100% - 80px,var(--nav-width));margin-inline:auto;}
.mega-inner {display:grid; grid-template-columns:.8fr 1.4fr; column-gap:10%; min-height:100%; padding-block:55px 30px;}
.mega-heading span {font-size:11px; color:#d9756b; letter-spacing:.16em; font-weight:800;}
.mega-heading p {font-size:clamp(32px,4vw,58px); line-height:1.03; letter-spacing:-.06em; margin:25px 0;}
.mega-links a {display:flex; align-items:baseline; gap:20px; border-bottom:1px solid #52635b; padding:8px 0 13px; color:#fff; text-decoration:none; font-size:clamp(29px,3.5vw,52px); font-weight:600; letter-spacing:-.055em; transition:padding .25s,color .25s;}
.mega-links a:first-child {border-top:1px solid #52635b;}
.mega-links a:hover {padding-left:12px; color:#e89081;}
.mega-links small {font-size:11px; letter-spacing:0; color:#b4c4ba;}
.mega-links a span {margin-left:auto; font-size:22px; color:#d97066;}
.mega-bottom {grid-column:1/-1; align-self:end; display:flex; align-items:center; gap:24px; border-top:1px solid #52635b; padding-top:22px; font-size:12px;}
.mega-bottom a {color:#fff; text-decoration:none;}
.mega-bottom .mega-cta {border:0; border-radius:3px; background:#c82f28; color:#fff; padding:13px 17px; font-weight:800; text-decoration:none;}
.mega-bottom span {margin-left:auto; color:#b2c0b7; letter-spacing:.14em;}
@keyframes menuDrop {from{opacity:0;transform:translateY(-14px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:1100px) {
  .brand {width:155px;}
  .brand img {width:155px;}
  .nav {display:none;}
  .nav-book {margin-left:auto;}
}
@media(max-width:850px) {
  .header .mega-inner {width:min(100% - 40px,var(--nav-width));}
  .nav-container {width:min(100% - 40px,var(--nav-width));}
  .mega-inner {grid-template-columns:1fr; gap:25px;}
  .mega-heading p {display:none;}
  .mega-links a {font-size:clamp(27px,6vw,46px);}
}
@media(max-width:610px) {
  .header .mega-inner {width:min(100% - 32px,var(--nav-width));}
  .topline {padding:0 20px; font-size:9px; letter-spacing:.07em;}
  .topline a {font-size:10px;}
  .header {height:68px;}
  .nav-container {width:min(100% - 32px,var(--nav-width));}
  .brand {width:142px; height:62px;}
  .brand img {width:142px;}
  .nav-book {display:none;}
  .menu-button {min-width:80px; padding:0 10px;}
  .menu-label {font-size:12px;}
  .mobile-nav:not([hidden]) {top:68px; height:calc(100dvh - 68px);}
  .mega-inner {padding-block:30px;}
  .mega-links a {font-size:clamp(27px,8vw,38px); padding:12px 0;}
  .mega-bottom {flex-wrap:wrap; gap:14px;}
  .mega-bottom span {width:100%; margin:0;}
}
@media(prefers-reduced-motion:reduce) {
  .mobile-nav:not([hidden]) {animation:none;}
}
[hidden] {display:none!important;}
body.menu-open {overflow:hidden;}
.menu-button {min-height:44px;}
@media(min-width:1101px) {
  .menu-button {display:none;}
  .nav {display:flex;}
}
.skip {position:absolute; top:-100px; left:12px; z-index:1000; background:#fff; color:#111; padding:12px;}
.skip:focus {top:12px;}
a:focus-visible, button:focus-visible {outline:2px solid #ff8177; outline-offset:3px;}
.gallery-footer {width:min(calc(100% - 32px),1440px); margin:0 auto; padding:28px 0; display:flex; justify-content:space-between; gap:20px; border-top:1px solid #3a4c58; font-size:13px; color:#aac4dd;}
@media(prefers-reduced-motion:reduce) {
  html {scroll-behavior:auto;}
}

/* Keep shared header icons centered on every public page. */
.nav-book > span,.mega-links a > span,.topline a > span[aria-hidden="true"] {
  display:inline-flex;align-items:center;justify-content:center;flex:none;width:18px;height:18px;
  padding:0;font-size:0;line-height:1;letter-spacing:0;vertical-align:middle;
}
.nav-book > span::before,.mega-links a > span::before,.topline a > span[aria-hidden="true"]::before {
  content:"";display:block;width:18px;height:18px;background:currentColor;
  mask:url('/assets/icons/arrow-up-right.svg') center / contain no-repeat;
}
.topline a > span[aria-hidden="true"] {width:12px;height:12px;}
.topline a > span[aria-hidden="true"]::before {width:12px;height:12px;}
.header .mega-links a {align-items:center;}
.mega-bottom .ui-arrow {margin:0 0 0 8px;letter-spacing:0;}
/* One header rhythm and button treatment across the homepage and services. */
:root {--nav-width:1440px;}
.header {font-size:16px;line-height:1.6;}
.topline {line-height:1.6;}
.nav {line-height:1.6;}
.topline > span {min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-transform:uppercase;font:750 10px/1.6 Inter,"Segoe UI",Arial,sans-serif;letter-spacing:.2em;}
body .topline > a {
  display:inline-flex;align-items:center;gap:6px;flex:none;height:28px;
  font:600 12px/1.2 "Segoe UI",Arial,sans-serif;letter-spacing:.015em;
  font-variant-numeric:tabular-nums;color:#dfe7e9;white-space:nowrap;
}
.header .navrow {gap:24px;}
.header .nav {gap:24px;margin-right:0;}
.header .nav a {font-size:12px;letter-spacing:.06em;text-transform:uppercase;white-space:nowrap;}
.header .nav-book {
  padding:12px 18px;border:1px solid #ff6d64;border-radius:0;
  background:#c82f28;line-height:1.6;box-shadow:0 8px 30px #ef453039;
  clip-path:polygon(0 0,calc(100% - 12px) 0,100% 12px,100% 100%,0 100%);
}
.header .nav-book:hover {background:#b62823;box-shadow:0 10px 38px #f2443b70;}
.header .nav a[aria-current="page"] {color:#fff;}
/* Give every primary link the same underline baseline, including Services. */
.header .nav > a,.header .nav .services-heading > a {
  display:inline-flex;align-items:center;height:44px;
}
.header .nav > a::after,.header .nav .services-heading > a::after {content:none;}
.header .nav > a::before,.header .nav .services-heading > a::before {
  content:"";position:absolute;left:0;right:0;bottom:-2px;height:2px;
  background:#e26b5f;transform:scaleX(0);transform-origin:left;
  pointer-events:none;
}
.header .nav > a.is-nav-highlighted::before,
.header .nav .services-heading > a.is-nav-highlighted::before {transform:scaleX(1);}
/* Services remain a page link, with a separate submenu disclosure. */
.nav-services {position:relative;}
.services-heading {display:flex;align-items:center;gap:2px;}
.services-toggle {
  display:inline-flex;align-items:center;justify-content:center;flex:none;
  width:28px;height:44px;padding:0;border:0;background:transparent;color:#c6d2d6;cursor:pointer;
}
.services-toggle::after {
  content:"";display:block;width:16px;height:16px;background:currentColor;
  mask:url('/assets/icons/chevron-down.svg') center / contain no-repeat;
  transition:transform .18s;
}
.services-toggle[aria-expanded="true"] {color:#ff8077;}
.services-toggle[aria-expanded="true"]::after {transform:rotate(180deg);}
.services-submenu {
  position:absolute;top:calc(100% + 14px);left:-20px;z-index:70;
  width:280px;padding:8px 16px;background:#0d1720;border:1px solid #34454d;
  box-shadow:0 18px 36px #0006;
}
.services-submenu::before {content:"";position:absolute;bottom:100%;left:0;right:0;height:18px;}
.header .nav .services-submenu a,.mega-links .services-submenu a {
  display:flex;align-items:center;justify-content:space-between;gap:20px;
  min-height:46px;padding:11px 0;border:0;border-bottom:1px solid #263640;
  font-size:15px;font-weight:500;line-height:1.5;letter-spacing:0;text-transform:none;
  color:#dce8f0;text-decoration:none;white-space:normal;
}
.header .nav .services-submenu a:last-child,.mega-links .services-submenu a:last-child {border-bottom:0;}
.header .nav .services-submenu a::after,.mega-links .services-submenu a::after {
  content:"";position:static;flex:none;width:14px;height:14px;background:#ff8077;
  mask:url('/assets/icons/arrow-up-right.svg') center / contain no-repeat;
}
.header .nav .services-submenu a:hover,.mega-links .services-submenu a:hover {color:#fff;background:#ffffff06;}
.mega-service-group {min-width:0;}
.header .mega-links .services-heading {gap:0;border-bottom:1px solid #52635b;}
.header .mega-links .services-heading > a {flex:1;min-width:0;border:0;}
.header .mega-links .services-toggle {
  width:44px;height:auto;min-height:44px;align-self:stretch;padding:0;border:0;
  background:transparent;color:#c6d2d6;
}
.header .mega-links .services-toggle[aria-expanded="true"] {color:#ff8077;}
.header .mega-bottom > a,.header .mega-bottom > button {
  display:inline-flex;align-items:center;justify-content:space-between;gap:12px;
  color:#fff;line-height:1.5;
}
.header .mega-bottom .ui-arrow {flex:none;width:18px;height:18px;margin:0;letter-spacing:0;}
.mega-links .services-submenu {position:static;width:100%;margin:0 0 12px;padding:4px 18px;box-shadow:none;}
.mega-links .services-submenu::before {display:none;}
@media(prefers-reduced-motion:reduce) {
  .services-toggle::after,.header .nav > a::before,.header .nav .services-heading > a::before {transition:none;}
}
@media(max-width:610px) {
  .topline > span {font-size:9px;letter-spacing:.07em;}
  body .topline > a {font-size:11px;}
  .header .navrow {gap:12px;}
  .header .menu-button {margin-left:auto;}
}

.header .nav {min-width:0;flex-wrap:wrap;row-gap:8px;flex:1;justify-content:flex-end;}
.header .nav > a,.header .nav .services-heading > a {overflow-wrap:anywhere;}
