/* ============================================================
   NEXUS ASSOCIATES AUSTRALIA — design system
   Direction: minimal architecture-studio / premium advisory.
   Deep charcoal & deep sea blue, matte silver, cool steel accent.
   Generous whitespace, restrained type, hairline rules.
   ============================================================ */
:root{
  --charcoal:#14171a;        /* near-black */
  --ink:#1b2025;             /* headings */
  --deep:#0c1a22;            /* deep sea blue */
  --deep-2:#11222c;
  --steel:#3e6e8e;           /* muted cool blue accent */
  --steel-2:#5b8bab;
  --silver:#b9c0c6;          /* matte silver */
  --silver-d:#8d959c;
  --gray:#58626b;            /* body text */
  --faint:#949da5;
  --line:#e4e7ea;            /* hairlines on light */
  --line-dark:rgba(255,255,255,.14);
  --bg:#ffffff;
  --bg-soft:#f5f6f7;
  --bg-mist:#eef0f1;
  --fh:'Montserrat',system-ui,-apple-system,'Segoe UI',Helvetica,Arial,sans-serif;
  --fb:'Inter',system-ui,-apple-system,'Segoe UI',Helvetica,Arial,sans-serif;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
[id]{scroll-margin-top:120px}
body{font-family:var(--fb);color:var(--gray);background:var(--bg);line-height:1.75;font-size:16px;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
ul{list-style:none}
button{font-family:inherit;cursor:pointer;border:none;background:none}
::selection{background:var(--steel);color:#fff}
.container{width:min(1240px,90%);margin-inline:auto}

h1,h2,h3,h4{font-family:var(--fh);color:var(--ink);font-weight:300;line-height:1.18;letter-spacing:-.01em}
.h2{font-size:clamp(1.9rem,3.2vw,2.7rem)}
.h3{font-size:clamp(1.25rem,1.8vw,1.5rem);font-weight:400}
.on-dark{color:#fff}
.on-dark h1,.on-dark h2,.on-dark h3{color:#fff}

.kicker{font-family:var(--fh);font-size:.7rem;font-weight:600;letter-spacing:.34em;text-transform:uppercase;color:var(--steel);margin-bottom:22px}
.section-head{max-width:720px;margin-bottom:64px}
.section-head .h2{margin-bottom:18px}
.section-sub{font-size:1.02rem;color:var(--gray)}
.center{text-align:center}
.center .section-head{margin-inline:auto}

/* buttons — rectangular, architectural */
.btn{display:inline-flex;align-items:center;gap:12px;font-family:var(--fh);font-size:.72rem;font-weight:600;letter-spacing:.24em;text-transform:uppercase;padding:17px 34px;transition:.3s;white-space:nowrap;border:1px solid transparent}
.btn .arr{transition:transform .3s}
.btn:hover .arr{transform:translateX(6px)}
.btn-solid{background:var(--charcoal);color:#fff}
.btn-solid:hover{background:var(--steel);color:#fff}
.btn-ghost{border-color:rgba(255,255,255,.5);color:#fff}
.btn-ghost:hover{background:#fff;color:var(--ink);border-color:#fff}
.btn-line{border-color:var(--ink);color:var(--ink)}
.btn-line:hover{background:var(--charcoal);color:#fff}
.text-link{font-family:var(--fh);font-size:.74rem;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:var(--steel);display:inline-flex;align-items:center;gap:10px;padding-bottom:6px;border-bottom:1px solid transparent;transition:.3s}
.text-link:hover{color:var(--ink);border-bottom-color:var(--ink)}
.text-link .arr{transition:transform .3s}
.text-link:hover .arr{transform:translateX(5px)}

/* hairline helper */
.rule{height:1px;background:var(--line);border:none}
.on-dark .rule,.rule-dark{background:var(--line-dark)}

/* ============ topbar + header ============ */
.topbar{background:var(--deep);color:var(--silver);font-size:.78rem;letter-spacing:.04em}
.topbar-in{display:flex;justify-content:space-between;align-items:center;padding:9px 0;gap:20px}
.topbar-in span,.topbar-in a{display:inline-flex;align-items:center;gap:8px}
.topbar-in a:hover{color:#fff}
.topbar-right{display:flex;gap:26px}
.topbar .sep{color:rgba(255,255,255,.25)}

#siteHeader{position:sticky;top:0;z-index:900;background:var(--bg);border-bottom:1px solid var(--line);transition:box-shadow .3s,background .3s}
#siteHeader.scrolled{box-shadow:0 12px 34px rgba(15,20,26,.09)}
.navbar-in{display:flex;align-items:center;gap:34px;padding:16px 0}
.brand{display:flex;align-items:center;gap:14px}
.brand img{height:46px;width:auto}
.brand-fallback{font-family:var(--fh);font-weight:600;color:var(--ink);font-size:1.05rem;letter-spacing:.14em}
.brand-txt b{display:block;font-family:var(--fh);font-weight:600;font-size:.86rem;letter-spacing:.2em;color:var(--ink);line-height:1.3}
.brand-txt span{display:block;font-family:var(--fh);font-size:.6rem;letter-spacing:.52em;color:var(--faint);text-transform:uppercase}

.main-nav{margin-left:auto}
.menu{display:flex;gap:8px}
.menu>li{position:relative}
.menu>li>a{display:flex;align-items:center;gap:7px;font-family:var(--fh);font-size:.76rem;font-weight:500;letter-spacing:.2em;text-transform:uppercase;color:var(--ink);padding:14px 16px;position:relative;white-space:nowrap;transition:color .25s}
.menu>li>a::after{content:"";position:absolute;left:16px;right:16px;bottom:8px;height:1px;background:var(--steel);transform:scaleX(0);transform-origin:left;transition:transform .3s}
.menu>li>a:hover,.menu>li:hover>a,.menu>li>a.active{color:var(--steel)}
.menu>li>a:hover::after,.menu>li:hover>a::after,.menu>li>a.active::after{transform:scaleX(1)}
.caret{width:9px;height:9px;fill:currentColor;opacity:.55;transition:transform .3s}
.has-drop:hover .caret{transform:rotate(180deg)}
.drop{position:absolute;top:calc(100% + 14px);left:0;min-width:430px;background:#fff;border:1px solid var(--line);box-shadow:0 30px 64px rgba(15,20,26,.15);padding:20px 0 0;opacity:0;visibility:hidden;transform:translateY(12px);transition:.3s;z-index:60}
.drop::before{content:"";position:absolute;top:-15px;left:0;right:0;height:15px}
.has-drop:hover .drop,.has-drop.open .drop,.has-drop:focus-within .drop{opacity:1;visibility:visible;transform:none}
.drop-wide{min-width:560px}
.drop-head{font-family:var(--fh);font-size:.6rem;font-weight:600;letter-spacing:.3em;text-transform:uppercase;color:var(--silver-d);padding:0 28px 14px;border-bottom:1px solid var(--line)}
.drop-item{display:flex;align-items:flex-start;gap:16px;padding:13px 28px;border-left:2px solid transparent;transition:.25s}
.drop-item b{font-family:var(--fh);font-weight:300;font-size:1rem;color:var(--silver);min-width:26px;line-height:1.5}
.drop-item .di-txt strong{display:block;font-family:var(--fh);font-weight:500;font-size:.9rem;color:var(--ink);letter-spacing:.02em}
.drop-item .di-txt small{display:block;font-size:.78rem;color:var(--faint);line-height:1.55;margin-top:3px}
.drop-item:hover{background:var(--bg-soft);border-left-color:var(--steel)}
.drop-item:hover b{color:var(--steel)}
.drop-foot{margin-top:16px;border-top:1px solid var(--line);padding:15px 28px;display:flex;justify-content:space-between;align-items:center;gap:24px;background:var(--bg-soft)}
.drop-note{font-size:.72rem;color:var(--faint);font-style:italic}
.has-drop.open .caret,.has-drop:hover .caret{transform:rotate(180deg)}
.nav-cta{margin-left:8px}

/* ============ image placeholders ============ */
.ph{position:relative;overflow:hidden;background:linear-gradient(150deg,#20292f 0%,#0c1a22 60%,#14171a 100%)}
.ph::before{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 42%,rgba(255,255,255,.045) 42%,rgba(255,255,255,.045) 58%,transparent 58%),linear-gradient(65deg,transparent 46%,rgba(255,255,255,.03) 46%,rgba(255,255,255,.03) 62%,transparent 62%)}
.ph::after{content:attr(data-label);position:absolute;left:22px;bottom:16px;font-family:var(--fh);font-size:.58rem;font-weight:600;letter-spacing:.3em;text-transform:uppercase;color:rgba(255,255,255,.42)}
.ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:2;transition:transform 1.2s ease}

/* ============ hero (home) ============ */
.hero{position:relative;min-height:92vh;display:flex;flex-direction:column;justify-content:center;background:linear-gradient(140deg,#20292f 0%,var(--deep) 55%,var(--charcoal) 100%);color:#fff;overflow:hidden}
.hero-media{position:absolute;inset:0}
.hero-media img{width:100%;height:100%;object-fit:cover;opacity:.9;transform:scale(1.04)}
@keyframes heroZoom{from{transform:scale(1)}to{transform:scale(1.07)}}
.hero-scrim{position:absolute;inset:0;background:linear-gradient(90deg,rgba(10,21,29,.96) 0%,rgba(10,21,29,.86) 52%,rgba(10,21,29,.55) 100%),linear-gradient(0deg,rgba(10,21,29,.94) 0%,rgba(10,21,29,.42) 42%,rgba(10,21,29,.15) 68%)}
.hero-inner{position:relative;z-index:2;padding:150px 0 120px}
.hero-inner .kicker{color:var(--silver)}
.hero h1{font-size:clamp(2.5rem,4.8vw,4.1rem);max-width:820px;margin-bottom:28px}
.hero .lede{font-size:1.08rem;color:var(--silver);max-width:600px;margin-bottom:44px;font-weight:400}
.hero-actions{display:flex;gap:16px;flex-wrap:wrap}
.hero-meta{position:relative;z-index:2;display:flex;gap:0;border-top:1px solid var(--line-dark);margin-bottom:44px;flex-wrap:wrap}
.hero-meta span{font-family:var(--fh);font-size:.66rem;font-weight:500;letter-spacing:.26em;text-transform:uppercase;color:var(--silver);padding:20px 34px 0 0;margin-right:34px;position:relative}
.hero-meta span::before{content:"";position:absolute;top:-1px;left:0;width:34px;height:1px;background:var(--steel-2)}
.hero-meta span:first-child::before{width:60px}

/* ============ page hero (subpages, image background) ============ */
.page-hero{position:relative;background:var(--deep);border-bottom:1px solid var(--line);padding:130px 0 88px;overflow:hidden;color:var(--silver)}
.page-hero-media{position:absolute;inset:0}
.page-hero-media img{width:100%;height:100%;object-fit:cover;opacity:.55}
.page-hero-scrim{position:absolute;inset:0;background:linear-gradient(90deg,rgba(10,21,29,.94) 0%,rgba(10,21,29,.72) 52%,rgba(10,21,29,.42) 100%),linear-gradient(0deg,rgba(10,21,29,.9) 0%,rgba(10,21,29,.3) 45%)}
.page-hero .container{position:relative;z-index:2}
.page-hero .kicker{margin-bottom:18px;color:var(--steel-2)}
.page-hero h1{font-size:clamp(2.2rem,4vw,3.3rem);max-width:860px;margin-bottom:22px;color:#fff}
.page-hero .lede{max-width:660px;font-size:1.05rem;color:var(--silver)}
.page-hero .crumbs{font-family:var(--fh);font-size:.64rem;letter-spacing:.26em;text-transform:uppercase;color:var(--silver-d);margin-bottom:26px}
.page-hero .crumbs a{color:var(--silver-d)}
.page-hero .crumbs a:hover{color:#fff}
.page-hero .crumbs .sep{margin:0 10px;color:rgba(255,255,255,.3)}
.placeholder-band{min-height:260px}

/* ============ sections ============ */
.section{padding:130px 0}
.section-soft{background:var(--bg-soft);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}

/* statement / about preview */
.statement{padding:140px 0}
.statement-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:80px;align-items:start}
.statement-big{font-size:clamp(1.8rem,3vw,2.6rem);line-height:1.3}
.statement-big em{font-style:normal;color:var(--steel)}
.statement-copy p{margin-bottom:20px;font-size:1.02rem}
.fact-list{margin:34px 0;border-top:1px solid var(--line)}
.fact-list li{display:flex;justify-content:space-between;gap:24px;padding:13px 2px;border-bottom:1px solid var(--line);font-size:.92rem}
.fact-list li b{font-family:var(--fh);font-weight:500;color:var(--ink)}
.fact-list li span{color:var(--faint);font-family:var(--fh);font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;white-space:nowrap;padding-top:4px}

/* ============ services rows (home) ============ */
.svc-list{border-top:1px solid var(--line)}
.svc-row{display:grid;grid-template-columns:120px 1.05fr 1.2fr 60px;gap:34px;align-items:center;padding:38px 10px;border-bottom:1px solid var(--line);transition:background .3s}
.svc-row:hover{background:var(--bg-soft)}
.svc-num{font-family:var(--fh);font-weight:200;font-size:2.5rem;color:var(--silver);letter-spacing:.04em;transition:color .3s}
.svc-row:hover .svc-num{color:var(--steel)}
.svc-title{font-family:var(--fh);font-weight:400;font-size:1.22rem;color:var(--ink);line-height:1.35}
.svc-desc{font-size:.94rem}
.svc-arrow{font-family:var(--fh);font-size:1.3rem;color:var(--silver-d);text-align:right;transition:transform .3s,color .3s}
.svc-row:hover .svc-arrow{transform:translateX(8px);color:var(--steel)}

/* ============ facts band ============ */
.facts{border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:var(--bg)}
.facts-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:40px;padding:72px 0}
.fact{border-left:1px solid var(--line);padding-left:30px}
.fact:first-child{border-left:none;padding-left:0}
.fact-num{font-family:var(--fh);font-weight:200;font-size:3.2rem;color:var(--ink);line-height:1;letter-spacing:-.02em}
.fact-num sup{font-size:1.1rem;color:var(--steel);font-weight:400;letter-spacing:0;vertical-align:super}
.fact-lbl{font-family:var(--fh);font-size:.68rem;font-weight:600;letter-spacing:.24em;text-transform:uppercase;color:var(--faint);margin-top:14px}

/* ============ principles ============ */
.prin-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:44px}
.prin{border-top:1px solid var(--ink);padding-top:26px;position:relative}
.prin::before{content:"";position:absolute;top:-1px;left:0;width:44px;height:1px;background:var(--steel);transition:width .5s}
.prin:hover::before{width:100%}
.prin h3{font-size:1.05rem;font-weight:500;margin-bottom:12px}
.prin p{font-size:.92rem}

/* ============ industries ============ */
.ind-list{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);border-left:1px solid var(--line)}
.ind-list li{border-bottom:1px solid var(--line);border-right:1px solid var(--line);padding:34px 30px;display:flex;align-items:center;gap:18px;transition:background .3s}
.ind-list li:hover{background:var(--bg-soft)}
.ind-list b{font-family:var(--fh);font-weight:200;font-size:1.5rem;color:var(--silver)}
.ind-list span{font-family:var(--fh);font-weight:500;font-size:.88rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ink)}
.cross-note{margin-top:56px;display:grid;grid-template-columns:1fr auto;gap:40px;align-items:center;background:var(--deep);color:var(--silver);padding:46px 54px}
.cross-note p{max-width:640px}
.cross-note .kicker{color:var(--steel-2);margin-bottom:10px}
.cross-note h3{font-size:1.4rem;color:#fff;font-weight:400;margin-bottom:8px}

/* ============ insights cards ============ */
.ins-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:34px}
.ins-card{border:1px solid var(--line);background:#fff;display:flex;flex-direction:column;transition:border-color .3s}
.ins-card:hover{border-color:var(--steel)}
.ins-media{aspect-ratio:16/9}
.ins-card:hover .ins-media img{transform:scale(1.05)}
.ins-body{padding:30px 28px 32px;display:flex;flex-direction:column;gap:13px;flex:1}
.ins-cat{font-family:var(--fh);font-size:.6rem;font-weight:600;letter-spacing:.3em;text-transform:uppercase;color:var(--steel)}
.ins-body h3{font-size:1.12rem;font-weight:400;line-height:1.4}
.ins-body p{font-size:.9rem;flex:1}
.ins-body .text-link{margin-top:6px;align-self:flex-start}

/* ============ CTA band ============ */
.cta-band{background:linear-gradient(130deg,var(--deep-2) 0%,var(--deep) 55%,var(--charcoal) 100%);color:var(--silver);padding:120px 0}
.cta-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:70px;align-items:center}
.cta-grid h2{font-size:clamp(1.9rem,3.2vw,2.8rem);margin-bottom:18px}
.cta-grid .kicker{color:var(--steel-2)}
.cta-contacts{border-top:1px solid var(--line-dark)}
.cta-contacts li{display:grid;grid-template-columns:130px 1fr;gap:20px;padding:18px 2px;border-bottom:1px solid var(--line-dark);font-size:.95rem}
.cta-contacts .lbl{font-family:var(--fh);font-size:.64rem;font-weight:600;letter-spacing:.26em;text-transform:uppercase;color:var(--silver-d);padding-top:5px}
.cta-contacts a{color:#fff}
.cta-contacts a:hover{color:var(--steel-2)}
.cta-band .btn-ghost{margin-top:34px}

/* ============ footer ============ */
.footer{background:var(--charcoal);color:var(--silver-d);font-size:.9rem}
.footer-top{display:grid;grid-template-columns:1.5fr 1fr 1.15fr .8fr .7fr;gap:48px;padding:88px 0 70px}
.footer .brand{margin-bottom:26px}
.footer .brand img{height:44px}
.footer-brand-name{font-family:var(--fh);font-size:.72rem;font-weight:600;letter-spacing:.26em;color:#fff;text-transform:uppercase;line-height:1.9;margin-bottom:18px}
.footer address{font-style:normal;line-height:2;margin-bottom:18px}
.footer address a{color:var(--silver);transition:.25s}
.footer address a:hover{color:#fff}
.footer h5{font-family:var(--fh);font-size:.66rem;font-weight:600;letter-spacing:.3em;text-transform:uppercase;color:#fff;margin-bottom:24px}
.fcol a{display:block;padding:6px 0;color:var(--silver-d);transition:.25s}
.fcol a:hover{color:#fff;padding-left:8px}
.footer-bottom{border-top:1px solid var(--line-dark);padding:26px 0}
.fb-in{display:flex;justify-content:space-between;align-items:center;gap:18px;flex-wrap:wrap;font-size:.8rem;color:var(--faint)}
.fb-in a{color:var(--silver-d)}
.fb-in a:hover{color:#fff}
.fb-in .sep{margin:0 12px;color:rgba(255,255,255,.2)}

/* ============ contact page ============ */
.contact-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:80px;align-items:start}
.c-details li{display:grid;grid-template-columns:120px 1fr;gap:20px;padding:20px 2px;border-bottom:1px solid var(--line)}
.c-details .lbl{font-family:var(--fh);font-size:.62rem;font-weight:600;letter-spacing:.26em;text-transform:uppercase;color:var(--faint);padding-top:6px}
.c-details .val{color:var(--ink);font-size:1rem;line-height:1.7}
.c-details .val a{color:var(--steel)}
.c-details .val a:hover{color:var(--ink)}
.c-details .val small{display:block;color:var(--faint);font-size:.82rem;margin-top:2px}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:26px 30px}
.field{display:flex;flex-direction:column;gap:8px}
.field.full{grid-column:1/-1}
.field label{font-family:var(--fh);font-size:.62rem;font-weight:600;letter-spacing:.26em;text-transform:uppercase;color:var(--faint)}
.field input,.field select,.field textarea{border:none;border-bottom:1px solid var(--line);background:transparent;padding:12px 2px;font-family:var(--fb);font-size:.98rem;color:var(--ink);outline:none;transition:border-color .3s;border-radius:0}
.field textarea{min-height:120px;resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{border-bottom-color:var(--steel)}
.form-actions{grid-column:1/-1;display:flex;align-items:center;gap:26px;flex-wrap:wrap}
.form-note{font-size:.82rem;color:var(--faint)}
.map-ph{margin-top:90px;aspect-ratio:21/7}

/* ============ legal / prose ============ */
.prose{max-width:800px}
.prose h2{font-size:1.4rem;font-weight:400;margin:56px 0 16px}
.prose h2:first-child{margin-top:0}
.prose p,.prose ul{margin-bottom:16px}
.prose ul{padding-left:22px;list-style:disc}
.prose ul li{margin-bottom:8px}
.prose .updated{font-family:var(--fh);font-size:.68rem;letter-spacing:.24em;text-transform:uppercase;color:var(--faint);margin-bottom:40px}
.legal-foot{margin-top:70px;padding-top:30px;border-top:1px solid var(--line);display:flex;gap:30px;flex-wrap:wrap}

/* services detail blocks */
.svc-block{display:grid;grid-template-columns:140px 1fr 1.1fr;gap:50px;padding:84px 0;border-top:1px solid var(--line)}
.svc-block:first-of-type{border-top:none;padding-top:10px}
.svc-block .svc-num{font-size:3.2rem}
.svc-block h2{font-size:clamp(1.5rem,2.4vw,2rem);margin-bottom:18px}
.svc-block .svc-desc{margin-bottom:8px}
.svc-block ul{border-top:1px solid var(--line)}
.svc-block ul li{padding:12px 2px 12px 26px;border-bottom:1px solid var(--line);font-size:.93rem;position:relative}
.svc-block ul li::before{content:"";position:absolute;left:2px;top:22px;width:12px;height:1px;background:var(--steel)}
.svc-fine{margin-top:70px;padding:34px 40px;background:var(--bg-soft);border:1px solid var(--line);font-size:.9rem;color:var(--gray);max-width:100%}
.svc-fine b{font-family:var(--fh);font-weight:500;color:var(--ink)}

/* ============ motion (restrained) ============ */
html.js .reveal{opacity:0;transform:translateY(20px);transition:opacity .9s ease,transform .9s ease}
.reveal[data-delay="1"]{transition-delay:.12s}
.reveal[data-delay="2"]{transition-delay:.24s}
.reveal[data-delay="3"]{transition-delay:.36s}
.reveal[data-delay="4"]{transition-delay:.48s}
.reveal.in-view{opacity:1;transform:none}
/* wall-clock backstop: 2s after load, hero intro elements are forced to
   their end state regardless of animation engine health */
html.intro-done .word-reveal .w,
html.intro-done .hero .kicker,html.intro-done .hero .lede,
html.intro-done .hero .hero-actions .btn,html.intro-done .hero-meta span,
html.intro-done .page-hero .crumbs,html.intro-done .page-hero .kicker,
html.intro-done .page-hero h1,html.intro-done .page-hero .lede,
html.intro-done .page-hero .hero-actions .btn,html.intro-done .page-hero .hero-meta span{
  animation:none!important;opacity:1!important;transform:none!important}

@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
  html{scroll-behavior:auto}
  .reveal{opacity:1;transform:none}
}

/* ============ responsive (desktop-first, graceful) ============ */
@media(max-width:1180px){
  .menu>li>a{padding:14px 10px;letter-spacing:.14em}
  .svc-row{grid-template-columns:80px 1fr 50px;gap:24px}
  .svc-row .svc-desc{grid-column:2;grid-row:2}
  .svc-arrow{grid-row:1/3}
}
@media(max-width:980px){
  .topbar-in span:first-child{display:none}
  .navbar-in{flex-wrap:wrap;gap:14px}
  .main-nav{margin-left:0;order:3;width:100%}
  .menu{flex-wrap:wrap;gap:0}
  .drop{left:auto;right:0}
  .statement-grid,.cta-grid,.contact-grid{grid-template-columns:1fr;gap:50px}
  .footer-top{grid-template-columns:1fr 1fr;gap:44px}
  .prin-grid{grid-template-columns:repeat(2,1fr);gap:34px}
  .ins-grid{grid-template-columns:repeat(2,1fr)}
  .facts-grid{grid-template-columns:repeat(2,1fr);gap:34px}
  .facts-grid .fact{border-left:none;padding-left:0}
  .ind-list{grid-template-columns:repeat(2,1fr)}
  .cross-note{grid-template-columns:1fr}
  .svc-block{grid-template-columns:80px 1fr;gap:26px}
  .svc-block ul{grid-column:2}
  .hero-meta span{padding-right:20px;margin-right:20px}
}
@media(max-width:680px){
  .topbar-right{display:none}
  .section,.statement{padding:84px 0}
  .hero-inner{padding:110px 0 80px}
  .svc-row{grid-template-columns:56px 1fr;gap:16px}
  .svc-arrow{display:none}
  .prin-grid,.ins-grid,.facts-grid,.ind-list,.form-grid,.footer-top{grid-template-columns:1fr}
  .svc-list{border-top:none}
  .hero-meta{display:none}
}

/* ============================================================
   ADDENDUM — homepage signature motion, projects, articles,
   index rows, quote flow, editorial figures
   ============================================================ */

/* ---- hero: nexus line-drawing + word reveal ---- */
.hero .nexus{position:absolute;right:0;top:0;height:100%;width:60%;opacity:.55;pointer-events:none;z-index:1}
.nexus line{stroke:rgba(91,139,171,.5);stroke-width:1;stroke-dasharray:1200;stroke-dashoffset:1200;animation:nxDraw 3.4s cubic-bezier(.4,0,.2,1) forwards}
.nexus circle{fill:rgba(91,139,171,.85);opacity:0;animation:nxFade 1.4s ease forwards;transform-box:fill-box;transform-origin:center}
.nexus circle.pulse{animation:nxFade 1.4s ease forwards,nxPulse 5.5s ease-in-out 2s infinite}
@keyframes nxDraw{to{stroke-dashoffset:0}}
@keyframes nxFade{to{opacity:1}}
@keyframes nxPulse{0%,100%{transform:scale(1)}50%{transform:scale(1.9)}}
html.intro .word-reveal .w{display:inline-block;opacity:0;transform:translateY(.6em);animation:wordRise .8s cubic-bezier(.2,.7,.2,1) forwards;animation-delay:calc(120ms + var(--i,0)*45ms)}
@keyframes wordRise{to{opacity:1;transform:none}}
@keyframes heroRise{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
html.intro .hero .kicker{animation:heroRise .55s cubic-bezier(.2,.7,.2,1) .05s both}
html.intro .hero .lede{animation:heroRise .6s cubic-bezier(.2,.7,.2,1) .4s both}
html.intro .hero .hero-actions .btn{animation:heroRise .55s cubic-bezier(.2,.7,.2,1) both}
html.js .hero .hero-actions .btn:nth-child(1){animation-delay:.52s}
html.js .hero .hero-actions .btn:nth-child(2){animation-delay:.6s}
html.intro .hero-meta span{animation:heroRise .55s cubic-bezier(.2,.7,.2,1) both}
html.js .hero-meta span:nth-child(1){animation-delay:.68s}
html.js .hero-meta span:nth-child(2){animation-delay:.74s}
html.js .hero-meta span:nth-child(3){animation-delay:.8s}
html.js .hero-meta span:nth-child(4){animation-delay:.86s}
html.intro .page-hero .crumbs{animation:heroRise .5s cubic-bezier(.2,.7,.2,1) .05s both}
html.intro .page-hero .kicker{animation:heroRise .5s cubic-bezier(.2,.7,.2,1) .12s both}
html.intro .page-hero h1{animation:heroRise .65s cubic-bezier(.2,.7,.2,1) .18s both}
html.intro .page-hero .lede{animation:heroRise .55s cubic-bezier(.2,.7,.2,1) .3s both}
html.intro .page-hero .hero-actions .btn{animation:heroRise .5s cubic-bezier(.2,.7,.2,1) both}
html.js .page-hero .hero-actions .btn:nth-child(1){animation-delay:.4s}
html.js .page-hero .hero-actions .btn:nth-child(2){animation-delay:.48s}
html.intro .page-hero .hero-meta span{animation:heroRise .5s cubic-bezier(.2,.7,.2,1) both}
html.js .page-hero .hero-meta span:nth-child(1){animation-delay:.54s}
html.js .page-hero .hero-meta span:nth-child(2){animation-delay:.6s}
html.js .page-hero .hero-meta span:nth-child(3){animation-delay:.66s}
html.js .page-hero .hero-meta span:nth-child(4){animation-delay:.72s}
.word-reveal.in-view .w{opacity:1;transform:none}

/* ---- sector ticker ---- */
.ticker{background:var(--charcoal);border-bottom:1px solid var(--line-dark);overflow:hidden}
.ticker-track{display:flex;width:max-content;animation:tickerMove 46s linear infinite}
.ticker:hover .ticker-track{animation-play-state:paused}
.ticker-track span{display:inline-flex;align-items:center;font-family:var(--fh);font-size:.66rem;font-weight:500;letter-spacing:.34em;text-transform:uppercase;color:var(--silver);padding:19px 0 19px 42px;white-space:nowrap}
.ticker-track span::after{content:"";width:5px;height:5px;background:var(--steel);border-radius:50%;margin-left:42px}
@keyframes tickerMove{to{transform:translateX(-50%)}}

/* ---- editorial statement image ---- */
.ph-editorial{aspect-ratio:4/3;border-radius:0}
.statement-fig{position:relative}
.statement-fig .fig-cap{position:absolute;left:0;bottom:0;background:var(--charcoal);color:var(--silver);font-family:var(--fh);font-size:.62rem;font-weight:600;letter-spacing:.28em;text-transform:uppercase;padding:12px 22px;z-index:3}

/* ---- approach line-draw headers ---- */
.draw-rule{position:relative;height:1px;background:var(--line);overflow:visible;margin-bottom:44px}
.draw-rule::before{content:"";position:absolute;left:0;top:0;height:1px;width:100%;background:var(--steel);transform:scaleX(0);transform-origin:left;transition:transform 1.4s cubic-bezier(.4,0,.2,1)}
.draw-rule.in-view::before{transform:scaleX(1)}

/* ---- project preview cards (home) ---- */
.proj-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:30px}
.proj-card{border:1px solid var(--line);background:#fff;display:flex;flex-direction:column;transition:border-color .3s,transform .3s,box-shadow .3s}
.proj-card:hover{border-color:var(--steel);transform:translateY(-6px);box-shadow:0 26px 50px rgba(15,20,26,.1)}
.proj-card .ph{aspect-ratio:16/10}
.proj-body{padding:28px 26px 30px;display:flex;flex-direction:column;gap:12px;flex:1}
.proj-sector{font-family:var(--fh);font-size:.6rem;font-weight:600;letter-spacing:.3em;text-transform:uppercase;color:var(--steel)}
.proj-body h3{font-size:1.18rem;font-weight:400;line-height:1.4}
.proj-body p{font-size:.88rem;flex:1}
.proj-metrics{display:flex;gap:30px;margin-top:6px;padding-top:18px;border-top:1px solid var(--line)}
.proj-metrics div b{display:block;font-family:var(--fh);font-weight:300;font-size:1.55rem;color:var(--ink);line-height:1.1}
.proj-metrics div span{font-family:var(--fh);font-size:.62rem;letter-spacing:.16em;text-transform:uppercase;color:var(--faint)}

/* ---- case study pages ---- */
.case-grid{display:grid;grid-template-columns:1.4fr .6fr;gap:70px;align-items:start}
.case-side{border:1px solid var(--line);background:var(--bg-soft);padding:32px 30px;position:sticky;top:130px}
.case-side h4{font-family:var(--fh);font-size:.64rem;font-weight:600;letter-spacing:.28em;text-transform:uppercase;color:var(--faint);margin-bottom:16px}
.case-facts li{display:flex;justify-content:space-between;gap:16px;padding:10px 0;border-bottom:1px solid var(--line);font-size:.84rem}
.case-facts li:last-child{border-bottom:none}
.case-facts li span{color:var(--faint);font-family:var(--fh);font-size:.66rem;letter-spacing:.12em;text-transform:uppercase;text-align:right}
.case-facts li b{font-weight:500;color:var(--ink)}
.case-note{margin-top:24px;font-size:.76rem;color:var(--faint);line-height:1.7;border-top:1px solid var(--line);padding-top:18px}
.figure{margin:48px 0}
.figure .ph{aspect-ratio:16/8}
.figure figcaption{font-size:.78rem;color:var(--faint);margin-top:12px;letter-spacing:.05em}
.metrics-band{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line);margin:56px 0}
.metrics-band div{background:#fff;padding:36px 32px}
.metrics-band b{display:block;font-family:var(--fh);font-weight:300;font-size:2.5rem;color:var(--ink);line-height:1.1;margin-bottom:10px}
.metrics-band span{font-family:var(--fh);font-size:.68rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--faint)}
.step-list{list-style:none;counter-reset:step}
.step-list li{position:relative;padding:24px 0 24px 68px;border-bottom:1px solid var(--line)}
.step-list li::before{counter-increment:step;content:counter(step,decimal-leading-zero);position:absolute;left:0;top:24px;font-family:var(--fh);font-weight:200;font-size:1.7rem;color:var(--silver);line-height:1}
.step-list li strong{display:block;font-family:var(--fh);font-weight:500;font-size:1.04rem;color:var(--ink);margin-bottom:6px}
.case-nav{display:flex;justify-content:space-between;gap:24px;margin-top:80px;padding-top:34px;border-top:1px solid var(--line);flex-wrap:wrap}

/* ---- article pages ---- */
.article-meta{display:flex;gap:26px;flex-wrap:wrap;font-family:var(--fh);font-size:.64rem;font-weight:600;letter-spacing:.24em;text-transform:uppercase;color:var(--faint);margin-bottom:38px}
.article-body{max-width:780px}
.article-body p{margin-bottom:20px;font-size:1.02rem}
.article-body h2{font-size:1.5rem;font-weight:400;margin:52px 0 18px}
.article-body h3{font-size:1.1rem;font-weight:500;margin:34px 0 12px}
.pullquote{border-left:2px solid var(--steel);padding:8px 0 8px 28px;margin:44px 0;font-family:var(--fh);font-weight:300;font-size:1.4rem;line-height:1.5;color:var(--ink)}
.checklist{border-top:1px solid var(--line);margin:36px 0;list-style:none}
.checklist li{padding:13px 2px 13px 32px;border-bottom:1px solid var(--line);position:relative;font-size:.95rem}
.checklist li::before{content:"";position:absolute;left:2px;top:23px;width:14px;height:1px;background:var(--steel)}
.article-side-note{background:var(--bg-soft);border:1px solid var(--line);padding:28px 30px;margin:44px 0;font-size:.92rem}
.article-side-note b{font-family:var(--fh);font-weight:600;font-size:.66rem;letter-spacing:.26em;text-transform:uppercase;color:var(--steel);display:block;margin-bottom:12px}

/* ---- text index rows (viewpoints / whitepapers) ---- */
.idx-rows{border-top:1px solid var(--line)}
.idx-row{display:grid;grid-template-columns:88px 1.05fr 1.5fr 40px;gap:34px;padding:38px 8px;border-bottom:1px solid var(--line);align-items:baseline;transition:background .3s}
.idx-row:hover{background:var(--bg-soft)}
.idx-row .n{font-family:var(--fh);font-weight:200;font-size:2rem;color:var(--silver);line-height:1}
.idx-row .t h3{font-size:1.22rem;font-weight:400;line-height:1.4;margin-bottom:8px}
.idx-row .t .cat{font-family:var(--fh);font-size:.6rem;font-weight:600;letter-spacing:.28em;text-transform:uppercase;color:var(--steel)}
.idx-row p{font-size:.92rem}
.idx-row .go{font-size:1.2rem;color:var(--silver-d);transition:transform .3s,color .3s;align-self:center}
.idx-row:hover .go{transform:translateX(8px);color:var(--steel)}

/* ---- quote flow (contact) ---- */
.q-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}
.q-steps>div{background:#fff;padding:32px 28px}
.q-steps b{font-family:var(--fh);font-weight:200;font-size:2rem;color:var(--silver);display:block;line-height:1;margin-bottom:14px}
.q-steps strong{font-family:var(--fh);font-weight:500;font-size:.98rem;color:var(--ink);display:block;margin-bottom:8px}
.q-steps p{font-size:.85rem}

/* ---- services page practice figures ---- */
.svc-fig{aspect-ratio:16/9;margin-top:30px}

/* ---- two-up figure row ---- */
.fig-duo{display:grid;grid-template-columns:1fr 1fr;gap:26px;margin:48px 0}
.fig-duo .figure{margin:0}
.fig-duo .figure .ph{aspect-ratio:4/3}

/* ---- responsive for addendum ---- */
@media(max-width:1080px){
  .proj-grid{grid-template-columns:repeat(2,1fr)}
  .q-steps{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:980px){
  .case-grid{grid-template-columns:1fr;gap:44px}
  .case-side{position:static}
  .idx-row{grid-template-columns:56px 1fr 34px;gap:20px}
  .idx-row p{grid-column:2}
  .metrics-band{grid-template-columns:1fr}
  .hero .nexus{width:100%;opacity:.3}
}
@media(max-width:680px){
  .proj-grid{grid-template-columns:1fr}
  .q-steps{grid-template-columns:1fr}
  .fig-duo{grid-template-columns:1fr}
  .idx-row{grid-template-columns:1fr;gap:10px}
  .idx-row .go{display:none}
}

/* ---- pass 2: editorial band + drop caps ---- */
.ph-wide{aspect-ratio:2.15/1}
.article-body.dropcap>p:first-of-type::first-letter{font-family:var(--fh);font-weight:300;font-size:3.3em;line-height:.9;float:left;margin:.1em .14em 0 0;color:var(--ink)}
@media(max-width:680px){.article-body.dropcap>p:first-of-type::first-letter{font-size:2.6em}}

/* ---- page-hero actions + meta (parity with home hero) ---- */
.page-hero .hero-actions{margin-top:42px}
.page-hero .hero-meta{margin:50px 0 0}

/* ============================================================
   PASS 4 — display-grade refinements (build-awwwards pass)
   ============================================================ */

/* ---- type scale: larger display contrast, tighter tracking ---- */
.hero-inner h1{font-size:clamp(2.7rem,5.1vw,4.5rem);letter-spacing:-.018em;font-weight:300;color:#fff}
.page-hero h1{font-size:clamp(2.3rem,4.2vw,3.6rem);letter-spacing:-.015em;font-weight:300}
.h2{font-size:clamp(2rem,3.4vw,2.9rem);letter-spacing:-.014em;font-weight:300}
.statement-big{font-size:clamp(1.9rem,3.1vw,2.8rem);letter-spacing:-.014em;font-weight:300}
.kicker{letter-spacing:.38em}
.hero .lede,.page-hero .lede{font-size:1.08rem;max-width:640px}

/* ---- generous vertical rhythm on large screens ---- */
@media(min-width:1025px){
  .section{padding:150px 0}
  .statement{padding:160px 0}
  .section-head{margin-bottom:72px}
}

/* ---- visible keyboard focus ---- */
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{
  outline:2px solid var(--steel);outline-offset:3px;border-radius:2px}

/* ---- refined scrollbar (WebKit) ---- */
::-webkit-scrollbar{width:10px}
::-webkit-scrollbar-track{background:#0e141a}
::-webkit-scrollbar-thumb{background:#3a4a58;border-radius:5px;border:2px solid #0e141a}
::-webkit-scrollbar-thumb:hover{background:var(--steel)}

/* ---- motion takeover: vanilla reveal steps aside for GSAP ---- */
html.js.motion .reveal,html.js.motion .reveal.in-view{opacity:1;transform:none;transition:none}
html.js.motion .word-reveal .w{transition:none}
.hw{display:inline-block;will-change:transform}

/* ---- button sweeps ---- */
.btn-solid{position:relative;overflow:hidden;z-index:0}
.btn-solid::before{content:"";position:absolute;inset:0;background:var(--steel);transform:translateX(-101%);transition:transform .45s cubic-bezier(.4,0,.2,1);z-index:-1}
.btn-solid:hover::before{transform:translateX(0)}
.btn-ghost{position:relative;overflow:hidden;z-index:0}
.btn-ghost::before{content:"";position:absolute;inset:0;background:#fff;transform:translateY(101%);transition:transform .45s cubic-bezier(.4,0,.2,1);z-index:-1}
.btn-ghost:hover{color:var(--ink);border-color:#fff}
.btn-ghost:hover::before{transform:translateY(0)}

/* ---- card micro-interactions ---- */
.ins-card .ph img,.proj-card .ph img{transform:scale(1.001);transition:transform 1s cubic-bezier(.2,.6,.2,1)}
.ins-card:hover .ph img,.proj-card:hover .ph img{transform:scale(1.05)}
.ins-card:hover{box-shadow:0 30px 60px rgba(15,20,26,.12)}
.proj-card:hover .proj-sector{color:var(--ink)}
.svc-row{border-bottom:1px solid var(--line)}
.svc-row .svc-num{transition:transform .4s ease,color .4s ease}
.svc-row:hover .svc-num{transform:translateX(6px)}
.idx-row .n{transition:color .35s ease}
.idx-row:hover .n{color:var(--steel)}

/* ---- tabular numerals for figures ---- */
.metrics-band b,.fact-num,.proj-metrics b{font-variant-numeric:tabular-nums lining-nums}

/* ---- ticker and nexus stay CSS-driven (no JS dependency) ---- */

/* ---- reduced motion: everything reaches final state ---- */
@media(prefers-reduced-motion:reduce){
  html.js .reveal,html.js .reveal.in-view{opacity:1;transform:none;transition:none}
  html.js .word-reveal .w,html.js .hero .kicker,html.js .hero .lede,html.js .hero .hero-actions .btn,html.js .hero-meta span,
  html.js .page-hero .crumbs,html.js .page-hero .kicker,html.js .page-hero h1,html.js .page-hero .lede,
  html.js .page-hero .hero-actions .btn,html.intro .page-hero .hero-meta span{opacity:1;transform:none;animation:none;transition:none}
  .hw{transform:none!important}
  .ph{clip-path:none!important}
  .ph img{transform:none!important}
}