@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=Montserrat:ital,wght@0,600;0,700;0,800;1,700;1,800&family=IBM+Plex+Mono:wght@400;500&display=swap');

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

:root {
  /* Pridin Group approved palette — "Corporate Balance" */
  --signal:       #1FB3E8;   /* Primary Blue */
  --amber:        #F69500;   /* Accent Orange */
  --navy:         #17375E;   /* Corporate Navy (dark sections, nav, footer) */
  --slate:        #5B6B7B;   /* Slate (secondary text) */
  --cream:        #F5F7FA;   /* Light Background */
  --ink:          #1B2430;   /* Deep Text */

  /* Supporting tints derived from the palette */
  --deep:         #1B2430;
  --mid:          #17375E;
  --steel:        #B4BECA;   /* muted text on navy */
  --mist:         #DDE3EA;   /* borders / dividers */
  --warm:         #FAFBFD;   /* page background */
  --white:        #ffffff;
  --amber-l:      #FFAD33;   /* orange hover */
  --signal-l:     #5CC8F0;   /* blue hover / accents on navy */
  --radius:       6px;
  --nav-h:        72px;
}

html { scroll-behavior: smooth; }

body {
  font-family: 'Inter', sans-serif;
  background: var(--warm);
  color: var(--ink);
  overflow-x: hidden;
}

/* ─── NAV ─── */
nav {
  position: fixed; top: 0; left: 0; right: 0; z-index: 200;
  height: var(--nav-h);
  display: flex; align-items: center; justify-content: space-between;
  padding: 0 5vw;
  background: rgba(23,55,94,0.95);
  backdrop-filter: blur(14px);
  border-bottom: 1px solid rgba(255,255,255,0.05);
  transition: box-shadow 0.3s;
}
nav.scrolled { box-shadow: 0 4px 30px rgba(0,0,0,0.3); }

.logo {
  font-family: 'Montserrat', sans-serif;
  font-size: 1.55rem;
  color: var(--white);
  text-decoration: none;
  letter-spacing: 0.02em;
  display: flex; align-items: center; gap: 0.15rem;
}
.logo span { color: var(--amber); font-size: 1.8rem; line-height: 1; }

.nav-links {
  display: flex; gap: 0.2rem; list-style: none;
}
.nav-links a {
  font-size: 0.78rem; font-weight: 500; letter-spacing: 0.09em;
  text-transform: uppercase; color: var(--steel);
  text-decoration: none; padding: 0.5rem 0.9rem;
  border-radius: 3px; transition: color 0.2s, background 0.2s;
}
.nav-links a:hover,
.nav-links a.active { color: var(--white); background: rgba(255,255,255,0.07); }
.nav-links a.active { color: var(--amber-l); background: rgba(246,149,0,0.1); }

.nav-cta {
  background: var(--amber); color: var(--white);
  border: none; padding: 0.6rem 1.4rem;
  border-radius: 3px; font-family: 'Inter', sans-serif;
  font-size: 0.78rem; font-weight: 600; letter-spacing: 0.07em;
  text-transform: uppercase; cursor: pointer; transition: background 0.2s, transform 0.15s;
  text-decoration: none; display: inline-block;
}
.nav-cta:hover { background: var(--amber-l); transform: translateY(-1px); }

/* Mobile nav toggle */
.nav-toggle {
  display: none; background: none; border: none;
  cursor: pointer; flex-direction: column; gap: 5px; padding: 4px;
}
.nav-toggle span {
  display: block; width: 24px; height: 2px;
  background: var(--steel); border-radius: 2px; transition: all 0.3s;
}

/* ─── PAGE HERO (inner pages) ─── */
.page-hero {
  padding-top: var(--nav-h);
  background: var(--navy);
  position: relative; overflow: hidden;
  padding-bottom: 4rem;
}
.page-hero-inner {
  max-width: 800px; padding: 4rem 5vw 0;
  position: relative; z-index: 2;
}
.page-hero-grid {
  position: absolute; inset: 0;
  
}
.page-hero-accent {
  position: absolute; right: 0; top: 0; bottom: 0; width: 45%;
  background: linear-gradient(135deg, transparent, rgba(31,179,232,0.08));
}

/* ─── TYPOGRAPHY ─── */
.section-label {
  font-size: 0.72rem; font-weight: 600; letter-spacing: 0.14em;
  text-transform: uppercase; color: var(--amber);
  margin-bottom: 0.8rem;
}
h1.display {
  font-family: 'Montserrat', sans-serif;
  font-size: clamp(2.4rem, 5vw, 3.8rem);
  line-height: 1.1; color: var(--white);
  margin-bottom: 1.2rem;
}
h1.display em { font-style: italic; color: var(--signal-l); }
h2 {
  font-family: 'Montserrat', sans-serif;
  font-size: clamp(1.8rem, 3vw, 2.6rem);
  line-height: 1.18; color: var(--ink);
  margin-bottom: 1rem;
}
h2 em { font-style: italic; color: var(--signal); }
h2.light { color: var(--white); }
h2.light em { color: var(--signal-l); }
h3 { font-size: 1rem; font-weight: 600; color: var(--ink); margin-bottom: 0.6rem; }
.lead {
  font-size: 1rem; font-weight: 300; line-height: 1.82;
  color: var(--slate); max-width: 580px;
}
.lead.light { color: var(--steel); }

/* ─── SECTIONS ─── */
.section { padding: 5.5rem 5vw; }
.section.dark { background: var(--navy); }
.section.cream { background: var(--cream); }
.section.white { background: var(--white); }

/* ─── BUTTONS ─── */
.btn {
  display: inline-flex; align-items: center; gap: 0.5rem;
  font-family: 'Inter', sans-serif; font-size: 0.85rem;
  font-weight: 600; letter-spacing: 0.05em;
  border-radius: 3px; padding: 0.85rem 1.8rem;
  border: none; cursor: pointer; text-decoration: none;
  transition: all 0.2s;
}
.btn-primary { background: var(--signal); color: var(--white); }
.btn-primary:hover { background: var(--signal-l); transform: translateY(-2px); }
.btn-amber { background: var(--amber); color: var(--white); }
.btn-amber:hover { background: var(--amber-l); transform: translateY(-2px); }
.btn-outline { background: transparent; color: var(--white); border: 1px solid rgba(255,255,255,0.25); }
.btn-outline:hover { border-color: var(--white); background: rgba(255,255,255,0.05); }
.btn-outline-dark { background: transparent; color: var(--ink); border: 1px solid rgba(27,36,48,0.25); }
.btn-outline-dark:hover { border-color: var(--ink); }

/* ─── CARDS ─── */
.card {
  background: var(--white); border-radius: var(--radius);
  border: 1px solid rgba(27,36,48,0.07);
  padding: 2rem; transition: all 0.28s ease;
  position: relative; overflow: hidden;
}
.card::before {
  content: '';
  position: absolute; top: 0; left: 0; right: 0; height: 3px;
  background: linear-gradient(90deg, var(--signal), var(--amber));
  transform: scaleX(0); transform-origin: left;
  transition: transform 0.3s ease;
}
.card:hover { transform: translateY(-4px); box-shadow: 0 16px 40px rgba(27,36,48,0.1); }
.card:hover::before { transform: scaleX(1); }
.card.cream-card { background: var(--cream); border-color: rgba(27,36,48,0.05); }

.icon-box {
  width: 48px; height: 48px; border-radius: var(--radius);
  background: rgba(31,179,232,0.1);
  display: flex; align-items: center; justify-content: center;
  margin-bottom: 1.2rem; flex-shrink: 0;
}
.icon-box svg { width: 22px; height: 22px; stroke: var(--signal); fill: none; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.icon-box.amber { background: rgba(246,149,0,0.12); }
.icon-box.amber svg { stroke: var(--amber); }

/* ─── GRID HELPERS ─── */
.grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 2rem; padding-top: 30px;} /*Added by Bomie*/
.grid-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.5rem; }
.grid-4 { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.5rem; }
.grid-auto { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 1.5rem; }

/* ─── DIVIDER ─── */
.divider {
  width: 48px; height: 3px;
  background: linear-gradient(90deg, var(--signal), var(--amber));
  border-radius: 2px; margin: 1.2rem 0 1.8rem;
}

/* ─── STATS BAR ─── */
.stats-bar {
  display: flex; flex-wrap: wrap; gap: 0;
  border-top: 1px solid rgba(255,255,255,0.06);
  padding-top: 2.5rem; margin-top: 2.5rem;
}
.stat-item { padding-right: 3rem; }
.stat-num {
  font-family: 'Montserrat', sans-serif;
  font-size: 2.1rem; color: var(--white); line-height: 1;
}
.stat-num em { font-style: normal; color: var(--amber); }
.stat-label { font-size: 0.74rem; color: var(--slate); letter-spacing: 0.07em; text-transform: uppercase; margin-top: 0.25rem; }

/* ─── FORM ─── */
.form-group { display: flex; flex-direction: column; gap: 0.4rem; margin-bottom: 1rem; }
.form-group label { font-size: 0.75rem; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: var(--slate); }
.form-group input,
.form-group textarea,
.form-group select {
  padding: 0.78rem 1rem;
  border: 1px solid var(--mist); border-radius: 4px;
  font-family: 'Inter', sans-serif; font-size: 0.9rem;
  color: var(--ink); background: var(--warm);
  outline: none; transition: border-color 0.2s, background 0.2s;
  -webkit-appearance: none;
}
.form-group input:focus,
.form-group textarea:focus,
.form-group select:focus { border-color: var(--signal); background: var(--white); }
.form-group textarea { resize: vertical; min-height: 120px; }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }

/* ─── FOOTER ─── */
footer {
  background: var(--navy);
  border-top: 1px solid rgba(255,255,255,0.06);
}
.footer-main {
  display: grid; grid-template-columns: 1.6fr 1fr 1fr 1fr;
  gap: 3rem; padding: 4rem 5vw;
}
.footer-brand .logo { font-size: 1.4rem; display: inline-flex; }
.footer-tagline { font-size: 0.85rem; color: #DDE3EA; line-height: 1.7; margin-top: 0.8rem; max-width: 260px; font-weight: 300; }
.footer-social { display: flex; gap: 0.7rem; margin-top: 1.4rem; }
.social-btn {
  width: 34px; height: 34px; border-radius: 4px;
  background: rgba(255,255,255,0.06);
  display: flex; align-items: center; justify-content: center;
  transition: background 0.2s; text-decoration: none;
}
.social-btn:hover { background: rgba(255,255,255,0.12); }
.social-btn svg { width: 15px; height: 15px; stroke: #DDE3EA; fill: none; stroke-width: 2; }

.footer-col h4 { font-size: 0.75rem; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: var(--white); margin-bottom: 1.2rem; }
.footer-col ul { list-style: none; display: flex; flex-direction: column; gap: 0.6rem; }
.footer-col ul a { font-size: 0.84rem; color: #DDE3EA; text-decoration: none; transition: color 0.2s; font-weight: 300; }
.footer-col ul a:hover { color: var(--white); }
.footer-col p { font-size: 0.84rem; color: #DDE3EA; line-height: 1.7; font-weight: 300; }

.footer-bottom {
  border-top: 1px solid rgba(255,255,255,0.05);
  padding: 1.4rem 5vw;
  display: flex; justify-content: space-between; align-items: center;
  flex-wrap: wrap; gap: 1rem;
}
.footer-bottom p { font-size: 0.78rem; color: #DDE3EA; }
.footer-bottom a { color: var(--slate); text-decoration: none; font-size: 0.78rem; transition: color 0.2s; }
.footer-bottom a:hover { color: var(--white); }

/* ─── REVEAL ANIMATION ─── */
.reveal {
  opacity: 0; transform: translateY(28px);
  transition: opacity 0.7s ease, transform 0.7s ease;
}
.reveal.visible { opacity: 1; transform: translateY(0); }

/* ─── RESPONSIVE ─── */
@media (max-width: 960px) {
  .grid-4 { grid-template-columns: 1fr 1fr; }
  .footer-main { grid-template-columns: 1fr 1fr; gap: 2rem; }
}
@media (max-width: 720px) {
  .grid-2, .grid-3 { grid-template-columns: 1fr; }
  .form-row { grid-template-columns: 1fr; }
  .nav-links, .nav-cta { display: none; }
  .nav-links.open { display: flex; flex-direction: column; position: fixed; top: var(--nav-h); left: 0; right: 0; background: var(--navy); padding: 1.5rem; gap: 0.5rem; border-bottom: 1px solid rgba(255,255,255,0.07); }
  .nav-toggle { display: flex; }
  .footer-main { grid-template-columns: 1fr; gap: 2rem; }
  .footer-bottom { flex-direction: column; text-align: center; }
  .stats-bar { gap: 2rem; }
  .stat-item { padding-right: 0; }
}


.logo {
    display: flex;
    align-items: center;
}

.logo img {
    height: 50px;   /* Adjust based on navbar height */
    width: auto;
}

/* ─── TYPE & BRAND REFINEMENTS ─── */
h1.display { font-weight: 800; letter-spacing: -0.02em; }
h2 { font-weight: 700; letter-spacing: -0.015em; }
h3 { font-family: 'Montserrat', sans-serif; font-weight: 700; }
.logo { font-weight: 700; }
.stat-num { font-family: 'IBM Plex Mono', monospace; font-weight: 500; }
.stat-label, .section-label { font-family: 'Inter', sans-serif; }
/* angled brand edge on inner-page heroes */
.page-hero { clip-path: polygon(0 0, 100% 0, 100% calc(100% - 36px), 0 100%); padding-bottom: 6rem; }

/* ─── SHARED PAGE SYSTEM (from homepage) ─── */
.hero{position:relative;min-height:92vh;display:flex;align-items:center;padding:calc(var(--nav-h) + 4rem) 5vw 10rem;background:var(--navy) url(images/hero-skyline.webp) center/cover no-repeat;overflow:hidden}
.hero::before{content:'';position:absolute;inset:0;background:linear-gradient(100deg,rgba(23,55,94,.97) 0%,rgba(23,55,94,.82) 42%,rgba(23,55,94,.28) 100%)}
.hero-content{position:relative;z-index:2;max-width:720px}
.hero-tag{display:inline-flex;align-items:center;gap:.6rem;font-size:.72rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--amber-l);border:1px solid rgba(246,149,0,.4);padding:.45rem .9rem;border-radius:3px;margin-bottom:1.6rem}
.pulse{width:7px;height:7px;border-radius:50%;background:var(--amber);animation:pulse 2s infinite}
@keyframes pulse{50%{opacity:.35}}
.hero .lead{color:var(--mist);max-width:560px;margin-bottom:2rem}
.hero-btns{display:flex;gap:1rem;flex-wrap:wrap}
.edge{position:absolute;left:0;right:0;bottom:-1px;height:100px;z-index:2}
.edge.w{background:var(--warm);clip-path:polygon(0 100%,100% 20%,100% 100%)}
.edge.o{background:var(--amber);clip-path:polygon(0 86%,100% 6%,100% 20%,0 100%)}
.stats-float{position:relative;z-index:3;margin:-4.5rem 5vw 0;background:var(--white);border-radius:8px;box-shadow:0 20px 60px rgba(23,55,94,.18);display:grid;grid-template-columns:repeat(4,1fr);border-top:4px solid var(--signal)}
.stats-float div{padding:1.8rem 1.5rem;border-right:1px solid var(--mist)}
.stats-float div:last-child{border:0}
.stats-float b{display:block;font-family:'IBM Plex Mono',monospace;font-weight:500;font-size:2.3rem;color:var(--navy);line-height:1}
.stats-float b i{font-style:normal;color:var(--amber)}
.stats-float span{font-size:.72rem;letter-spacing:.09em;text-transform:uppercase;color:var(--slate);margin-top:.5rem;display:block}
.chips{display:flex;flex-wrap:wrap;gap:.7rem;justify-content:center;padding:2.5rem 5vw 0;align-items:center}
.chips p{font-size:.85rem;color:var(--slate);width:100%;text-align:center;margin-bottom:.4rem}
.chip{font-size:.75rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--navy);background:var(--white);border:1px solid var(--mist);padding:.5rem 1rem;border-radius:30px}
.sec{padding:5.5rem 5vw}
.sec-head{display:flex;justify-content:space-between;align-items:flex-end;gap:2rem;flex-wrap:wrap;margin-bottom:2.5rem}
.svc{background:var(--white);border:1px solid var(--mist);border-radius:var(--radius);padding:2rem;position:relative;overflow:hidden;transition:.28s}
.svc::after{content:'';position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--signal);transform:scaleY(0);transform-origin:top;transition:transform .3s}
.svc:hover{transform:translateY(-4px);box-shadow:0 16px 40px rgba(23,55,94,.12)}
.svc:hover::after{transform:scaleY(1)}
.svc p{font-size:.87rem;color:var(--slate);line-height:1.75}
.field{display:grid;grid-template-columns:repeat(12,1fr);grid-auto-rows:220px;gap:1rem}
.ph{position:relative;border-radius:8px;overflow:hidden;background:var(--navy)}
.ph img{width:100%;height:100%;object-fit:cover;transition:transform .6s}
.ph:hover img{transform:scale(1.05)}
.ph::after{content:'';position:absolute;inset:0;background:linear-gradient(to top,rgba(23,55,94,.85),transparent 55%)}
.ph span{position:absolute;left:1.1rem;bottom:1rem;z-index:2;color:var(--white);font-size:.8rem;font-weight:600;letter-spacing:.05em}
.ph span::before{content:'';display:inline-block;width:18px;height:3px;background:var(--amber);margin-right:.6rem;vertical-align:middle}
.f1{grid-column:1/6;grid-row:1/3}.f2{grid-column:6/10}.f3{grid-column:10/13;grid-row:1/3}.f4{grid-column:6/10}
.split{display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:center}
.split .ph{height:480px}
.badge{position:absolute;right:1.2rem;top:1.2rem;z-index:2;background:var(--amber);color:var(--white);padding:.9rem 1.2rem;border-radius:6px;text-align:center}
.badge b{display:block;font-family:'IBM Plex Mono',monospace;font-size:1.6rem}
.badge small{font-size:.65rem;letter-spacing:.08em;text-transform:uppercase}
.steps{display:grid;grid-template-columns:repeat(5,1fr);gap:1.2rem;position:relative}
.steps::before{content:'';position:absolute;left:5%;right:5%;top:27px;height:3px;background:linear-gradient(90deg,var(--signal),var(--amber))}
.step{position:relative;text-align:center}
.step i{display:flex;width:56px;height:56px;margin:0 auto 1.1rem;border-radius:50%;background:var(--navy);color:var(--white);font:500 1.05rem 'IBM Plex Mono',monospace;align-items:center;justify-content:center;border:4px solid var(--cream);font-style:normal}
.step h3{font-size:.95rem}
.step p{font-size:.8rem;color:var(--slate);line-height:1.6}
.loc{background:var(--white);border-radius:8px;overflow:hidden;border:1px solid var(--mist)}
.loc .ph{border-radius:0;height:260px}
.loc div.t{padding:1.6rem}
.loc p{font-size:.88rem;color:var(--slate);line-height:1.7}
.mission{background:var(--navy);padding:5rem 5vw;text-align:center}
.mission blockquote{font:600 clamp(1.2rem,2.2vw,1.7rem)/1.55 'Montserrat',sans-serif;color:var(--white);max-width:860px;margin:0 auto 1.4rem}
.mission cite{font-style:normal;font-size:.8rem;letter-spacing:.1em;text-transform:uppercase;color:var(--steel)}
.mission cite span{color:var(--amber-l)}
.cta{background:linear-gradient(110deg,var(--navy) 55%,#1c5b8a);padding:5rem 5vw;text-align:center}
.cta .lead{margin:0 auto 2rem;color:var(--mist)}
.cta-btns{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap}
.quote-fab{position:fixed;right:1.2rem;bottom:1.2rem;z-index:150;box-shadow:0 8px 24px rgba(0,0,0,.25)}
@media(max-width:960px){.steps{grid-template-columns:1fr 1fr}.steps::before{display:none}.split{grid-template-columns:1fr;gap:2rem}.stats-float{grid-template-columns:1fr 1fr}.stats-float div:nth-child(2){border-right:0}}
@media(max-width:720px){.field{grid-template-columns:1fr;grid-auto-rows:240px}.f1,.f2,.f3,.f4{grid-column:auto;grid-row:auto}.steps{grid-template-columns:1fr}.hero{padding-bottom:8rem}}
  
.trio{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}.trio .ph{height:320px}
@media(max-width:720px){.trio{grid-template-columns:1fr}}

/* ─── SERVICES: explorer + capability tiles ─── */
.xp{display:grid;grid-template-columns:300px 1fr;gap:2rem;align-items:start}
.xp-tabs{display:flex;flex-direction:column;gap:.5rem}
.xp-tab{display:flex;align-items:center;gap:1rem;text-align:left;padding:1.1rem 1.2rem;background:var(--cream);border:1px solid var(--mist);border-left:4px solid transparent;border-radius:6px;cursor:pointer;font:600 .9rem 'Inter',sans-serif;color:var(--ink);transition:.2s}
.xp-tab b{font:500 .85rem 'IBM Plex Mono',monospace;color:var(--signal)}
.xp-tab:hover{background:var(--white)}
.xp-tab.active{background:var(--navy);color:var(--white);border-left-color:var(--amber)}
.xp-tab.active b{color:var(--amber-l)}
.xp-panel{display:none;grid-template-columns:1fr 1fr;background:var(--white);border:1px solid var(--mist);border-radius:8px;overflow:hidden;box-shadow:0 16px 40px rgba(23,55,94,.08)}
.xp-panel.active{display:grid;animation:xpIn .35s ease}
@keyframes xpIn{from{opacity:0;transform:translateY(10px)}}
.xp-photo{position:relative;min-height:420px}
.xp-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.xp-photo span{position:absolute;left:1rem;bottom:1rem;background:var(--amber);color:var(--white);font-size:.7rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;padding:.4rem .8rem;border-radius:3px}
.xp-body{padding:2.2rem}
.xp-body h3{font-size:1.25rem;margin-bottom:.8rem}
.xp-body .lead{font-size:.92rem;margin-bottom:1.2rem}
.cap-tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem}
.cap-tile{background:var(--white);border-radius:8px;padding:1.8rem;border-top:4px solid var(--signal);box-shadow:0 8px 24px rgba(23,55,94,.06)}
.cap-tile:nth-child(even){border-top-color:var(--amber)}
.cap-tile i{font:500 .85rem 'IBM Plex Mono',monospace;color:var(--slate);font-style:normal}
.cap-tile h3{margin:.5rem 0}
.cap-tile p{font-size:.85rem;color:var(--slate);line-height:1.7}
/* ─── ABOUT ─── */
.ab-who{display:grid;grid-template-columns:1.1fr 1fr;gap:4rem;align-items:center}
.ab-facts{display:flex;gap:2.5rem;margin-top:2rem;flex-wrap:wrap}
.ab-facts b{display:block;font:500 1.8rem 'IBM Plex Mono',monospace;color:var(--navy)}
.ab-facts span{font-size:.72rem;letter-spacing:.09em;text-transform:uppercase;color:var(--slate)}
.ab-photo{position:relative;padding-bottom:5rem}
.ab-photo>img{width:100%;height:520px;object-fit:cover;border-radius:8px;display:block}
.ab-vms{position:absolute;left:-2.5rem;right:2rem;bottom:0;display:grid;gap:.8rem}
.ab-vm{display:flex;gap:1rem;background:var(--white);padding:1.1rem 1.3rem;border-radius:8px;box-shadow:0 14px 40px rgba(23,55,94,.18);border-left:4px solid var(--amber)}
.ab-vm:last-child{border-left-color:var(--signal)}
.ab-vm .icon-box{margin:0}
.ab-vm h3{margin-bottom:.2rem;font-size:.95rem}
.ab-vm p{font-size:.8rem;color:var(--slate);line-height:1.6}
.ab-tls{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem}
.ab-tl{background:var(--white);border-radius:8px;padding:1.6rem;border-bottom:4px solid var(--signal)}
.ab-tl:nth-child(even){border-bottom-color:var(--amber)}
.ab-tl b{font:500 1.7rem 'IBM Plex Mono',monospace;color:var(--navy)}
.ab-tl h4{margin:.5rem 0 .4rem;font:700 .95rem 'Montserrat',sans-serif}
.ab-tl p{font-size:.82rem;color:var(--slate);line-height:1.65}
.ab-band{display:grid;grid-template-columns:1.2fr 1fr;gap:4rem;align-items:center}
.ab-discs{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-top:2rem}
.ab-disc{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12);border-radius:8px;padding:1.3rem;color:var(--white);font-weight:600;font-size:.9rem}
.ab-disc i{display:block;font:500 .8rem 'IBM Plex Mono',monospace;color:var(--amber-l);margin-bottom:.5rem;font-style:normal}
.ab-bb{background:var(--white);border-radius:8px;padding:2.2rem;border-top:4px solid var(--amber)}
.ab-bb-i svg{width:34px;height:34px;stroke:var(--amber);fill:none;stroke-width:1.6;margin-bottom:1rem}
.ab-bb p{font-size:.88rem;color:var(--slate);line-height:1.75;margin-top:.5rem}
.ab-award{display:grid;grid-template-columns:1.1fr 1fr;gap:3.5rem;align-items:center}
.ab-award .ph{height:460px}
.ab-valwrap{display:grid;grid-template-columns:.8fr 1.6fr;gap:4rem;align-items:start}
.ab-vals{display:grid;grid-template-columns:1fr 1fr;gap:1.2rem}
.ab-val{background:var(--white);border-radius:8px;padding:1.7rem}
.ab-val h4{font:700 1rem 'Montserrat',sans-serif;margin-bottom:.4rem}
.ab-val p{font-size:.84rem;color:var(--slate);line-height:1.7}
@media(max-width:960px){.xp,.ab-who,.ab-band,.ab-award,.ab-valwrap{grid-template-columns:1fr;gap:2rem}.xp-tabs{flex-direction:row;overflow-x:auto}.xp-tab{flex:0 0 auto}.xp-panel.active{grid-template-columns:1fr}.xp-photo{min-height:260px}.cap-tiles,.ab-tls{grid-template-columns:1fr 1fr}.ab-vms{position:static;margin-top:1rem}.ab-photo{padding-bottom:0}.ab-photo>img{height:360px}}
@media(max-width:600px){.cap-tiles,.ab-tls,.ab-vals,.ab-discs{grid-template-columns:1fr}}

/* ─── FOOTER SOCIALS ─── */
.footer-socials{display:flex;justify-content:space-between;align-items:center;gap:1rem;flex-wrap:wrap;padding:1.4rem 5vw;border-top:1px solid rgba(255,255,255,.08)}
.footer-socials>span{font-size:.75rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--steel)}
.social-links{display:flex;gap:.7rem}
.social-links a{width:40px;height:40px;border-radius:50%;background:rgba(255,255,255,.08);display:flex;align-items:center;justify-content:center;transition:.2s}
.social-links a:hover{background:var(--signal);transform:translateY(-2px)}
.social-links svg{width:18px;height:18px;stroke:var(--white);fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
/* ─── BLOG ─── */
.blog-filter{display:flex;gap:.6rem;flex-wrap:wrap;margin-bottom:2.5rem}
.blog-filter button{font:600 .78rem 'Inter',sans-serif;letter-spacing:.06em;text-transform:uppercase;padding:.6rem 1.2rem;border-radius:30px;border:1px solid var(--mist);background:var(--white);color:var(--slate);cursor:pointer;transition:.2s}
.blog-filter button:hover,.blog-filter button.active{background:var(--signal);border-color:var(--signal);color:var(--white)}
.post-cat{display:inline-block;font-size:.68rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;padding:.3rem .7rem;border-radius:3px;color:var(--white);background:var(--navy)}
.post-cat.c-culture{background:var(--signal)}.post-cat.c-awards{background:var(--amber)}
.post-meta{font-size:.78rem;color:var(--slate);display:flex;align-items:center;gap:.8rem}
.post-feat{display:grid;grid-template-columns:1.2fr 1fr;background:var(--white);border:1px solid var(--mist);border-radius:10px;overflow:hidden;margin-bottom:2rem;text-decoration:none;color:inherit;box-shadow:0 16px 40px rgba(23,55,94,.08)}
.post-feat img{width:100%;height:100%;min-height:380px;object-fit:cover;display:block}
.post-feat .pb{padding:2.5rem;display:flex;flex-direction:column;justify-content:center;gap:1rem}
.post-feat h2{margin:0;font-size:clamp(1.4rem,2.4vw,2rem)}
.post-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem}
.post-card{background:var(--white);border:1px solid var(--mist);border-radius:8px;overflow:hidden;text-decoration:none;color:inherit;display:flex;flex-direction:column;transition:.28s}
.post-card:hover{transform:translateY(-4px);box-shadow:0 16px 40px rgba(23,55,94,.12)}
.post-card img{width:100%;height:210px;object-fit:cover;display:block}
.post-card .pb{padding:1.5rem;display:flex;flex-direction:column;gap:.7rem;flex:1}
.post-card h3{margin:0;font-size:1.05rem;line-height:1.4}
.post-card p,.post-feat p{font-size:.88rem;color:var(--slate);line-height:1.7}
.post-more{margin-top:auto;font-size:.8rem;font-weight:600;color:var(--signal);letter-spacing:.04em}
.post-article{max-width:780px;margin:0 auto}
.post-article .cover{width:100%;max-height:460px;object-fit:cover;border-radius:10px;margin:1.5rem 0 2.2rem;display:block}
.post-article p{font-size:1.02rem;line-height:1.9;color:var(--ink);margin-bottom:1.4rem;font-weight:300}
.post-article h3{margin:2rem 0 .8rem;font-size:1.2rem}
.post-back{display:inline-block;margin-bottom:1rem;font-size:.82rem;font-weight:600;color:var(--signal);text-decoration:none}
.post-empty{text-align:center;color:var(--slate);padding:3rem 0}
@media(max-width:960px){.post-feat{grid-template-columns:1fr}.post-feat img{min-height:240px}.post-grid{grid-template-columns:1fr 1fr}}
@media(max-width:600px){.post-grid{grid-template-columns:1fr}.footer-socials{justify-content:center}}

/* footer: socials sit directly under the brand tagline; white logo */
.footer-brand .social-links{margin-top:1.4rem}
.footer-brand .logo img{height:64px}

/* ─── INNER HERO: text panel + tower photo (angled edge with orange accent) ─── */
.page-hero { background: linear-gradient(110deg, var(--navy) 0%, #1B2430 140%); }
.page-hero::before, .page-hero::after {
  content: ''; position: absolute; top: 0; bottom: 0; right: 0; width: 42%; z-index: 0;
  clip-path: polygon(20% 0, 100% 0, 100% 100%, 0 100%);
}
.page-hero::before { background: var(--amber); transform: translateX(-12px); }
.page-hero::after {
  background: linear-gradient(90deg, rgba(23,55,94,.55), rgba(23,55,94,0) 45%), url(images/img-tower.png) var(--hero-pos, 50% 40%) / cover no-repeat;
}
.page-hero-accent { display: none; }
@media (max-width: 860px) { .page-hero::before, .page-hero::after { display: none; } }

/* inner hero photo: same image & crop on every page, sits just below the menu bar */
.page-hero::before, .page-hero::after { top: var(--nav-h); }
.page-hero::after {
  background: linear-gradient(90deg, rgba(23,55,94,.45), rgba(23,55,94,0) 40%), url(images/hero-tower.webp) 50% 4% / cover no-repeat;
}

/* category badge hugs its text inside card columns */
.pb .post-cat{align-self:flex-start}

/* ─── BLOG: "Read more" and "Back to Blog" buttons ─── */
.post-more{display:inline-flex;align-items:center;gap:.55rem;align-self:flex-start;margin-top:auto;padding:.6rem 1.2rem;border:1.5px solid var(--signal);border-radius:30px;font:700 .72rem 'Inter',sans-serif;letter-spacing:.09em;text-transform:uppercase;color:var(--signal);background:transparent;transition:background .25s,color .25s,box-shadow .25s}
.post-more::after{content:'→';font-size:1rem;line-height:1;transition:transform .25s}
.post-card:hover .post-more,.post-feat:hover .post-more{background:var(--signal);color:var(--white);box-shadow:0 8px 20px rgba(31,179,232,.3)}
.post-card:hover .post-more::after,.post-feat:hover .post-more::after{transform:translateX(4px)}
.post-feat .post-more{margin-top:.6rem}
.post-back{display:inline-flex;align-items:center;gap:.55rem;margin-bottom:1.6rem;padding:.55rem 1.1rem;border:1.5px solid var(--mist);border-radius:30px;background:var(--white);font:700 .72rem 'Inter',sans-serif;letter-spacing:.09em;text-transform:uppercase;color:var(--navy);text-decoration:none;transition:background .25s,color .25s,border-color .25s}
.post-back::before{content:'←';font-size:1rem;line-height:1;transition:transform .25s}
.post-back:hover{background:var(--navy);border-color:var(--navy);color:var(--white)}
.post-back:hover::before{transform:translateX(-4px)}

/* small image credit on the Google Street View photos */
.img-credit{position:absolute;right:.8rem;bottom:.55rem;z-index:3;font-size:.62rem;letter-spacing:.02em;color:rgba(255,255,255,.82);text-shadow:0 1px 3px rgba(0,0,0,.6)}