/* IA Trial Graphics — site styles
   Palette: page #F4F6FA · frame #162A4E · deep navy #0F1E3A · accent #8FBBFF · link blue #2F5FBF */

html{scroll-behavior:smooth}
@media (prefers-reduced-motion: reduce){html{scroll-behavior:auto} *{transition:none!important;animation:none!important}}
body{margin:0;overflow-x:hidden;font-family:'Nunito Sans',system-ui,-apple-system,sans-serif;background:#F4F6FA;color:#0F1E3A;-webkit-font-smoothing:antialiased}
h1,h2{text-wrap:balance}
a{transition:color .2s}
.page a{color:#0F1E3A}
:focus-visible{outline:3px solid #8FBBFF;outline-offset:3px;border-radius:6px}
#top,#jury,#work,#clients,#areas,#about,#contact{scroll-margin-top:110px}

/* layout */
.page{max-width:1280px;margin:0 auto;position:relative}
.page > div{padding-left:72px;padding-right:72px;position:relative;z-index:1}
.page > div[style*="margin: 96px 72px 0"]{margin-left:72px!important;margin-right:72px!important;padding-left:56px;padding-right:56px}
.page > div[style*="margin: 72px 72px 0"]{margin-left:72px!important;margin-right:72px!important}

/* background: soft glow + two patches of drafting grid */
.page > .lt, .lt{padding:0!important;position:absolute!important;top:0;bottom:0;left:calc(50% - 50vw);width:100vw;pointer-events:none;z-index:0!important}
.lt1{background:radial-gradient(900px 600px at 85% 0%,rgba(255,255,255,.55),rgba(255,255,255,0) 60%),radial-gradient(800px 700px at 5% 40%,rgba(143,187,255,.35),rgba(143,187,255,0) 60%),radial-gradient(900px 700px at 95% 95%,rgba(255,255,255,.4),rgba(255,255,255,0) 60%)}
.lt2{opacity:.55;background-image:linear-gradient(rgba(15,30,58,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(15,30,58,.06) 1px,transparent 1px);background-size:24px 24px;-webkit-mask-image:radial-gradient(1100px 800px at 72% 0%,#000 25%,transparent 100%),radial-gradient(1000px 900px at 12% 52%,#000 15%,transparent 100%);mask-image:radial-gradient(1100px 800px at 72% 0%,#000 25%,transparent 100%),radial-gradient(1000px 900px at 12% 52%,#000 15%,transparent 100%)}

/* sticky menu bar */
.page > .site-nav{position:sticky;top:0;z-index:50;background:rgba(22,42,78,0.96);backdrop-filter:saturate(1.2) blur(14px);-webkit-backdrop-filter:saturate(1.2) blur(14px);border-bottom:1px solid rgba(143,187,255,0.14);box-shadow:0 10px 28px rgba(15,30,58,0.22),0 2px 6px rgba(15,30,58,0.12);padding-top:14px!important;padding-bottom:14px!important;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);padding-left:max(20px,calc(50vw - 640px + 72px))!important;padding-right:max(20px,calc(50vw - 640px + 72px))!important}
.site-nav a:not([style*="background"]){color:#FFFFFF!important}
.site-nav a:not([style*="background"]):hover{color:#8FBBFF!important}
.site-nav a[style*="background"]{background:#8FBBFF!important;color:#0F1E3A!important}
.site-nav a[style*="background"]:hover{background:#A9CBFF!important}
.nav-toggle{display:none;background:none;border:0;padding:10px;cursor:pointer;margin-left:auto}
.nav-toggle span{display:block;width:24px;height:2px;background:#FFFFFF;margin:5px 0;transition:transform .25s,opacity .25s}
.nav-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.nav-toggle[aria-expanded="true"] span:nth-child(2){opacity:0}
.nav-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

/* text colours on the light page (outside the navy frames) */
.page > *:not(.panel) [style*="color: #FFFFFF"]:not(a[style*="background"]):not(button){color:#0F1E3A!important}
.page > *:not(.panel) [style*="color: #B9C7DE"]{color:#3F4E66!important}
.page > *:not(.panel) [style*="color: #9DAECB"]{color:#5A6A84!important}
.page > *:not(.panel) [style*="color: #7C8FB0"]{color:#6B7A92!important}
.page > *:not(.panel) [style*="color: #8FBBFF"]{color:#2F5FBF!important}
.page > *:not(.panel) [style*="color: #8FBBFF"][style*="text-transform: uppercase"][style*="font-size: 13px"]{color:#8FBBFF!important}
.page > *:not(.panel) [style*="background: #162A4E"][style*="border-radius: 999px"]{background:#162A4E!important;color:#FFFFFF!important}
.page > div[style*="margin-top: auto"] a{color:#162A4E!important}

/* navy frames */
.panel{background:#162A4E!important;border:1px solid #2A4470!important;box-shadow:inset 0 1px 0 rgba(255,255,255,0.10),0 30px 70px rgba(15,30,58,0.28),0 6px 16px rgba(15,30,58,0.14)!important}
.panel,.panel h2,.panel label{color:#FFFFFF}
.panel a{color:#FFFFFF}
.panel a[href*="linkedin"]{color:#8FBBFF!important}
.panel a[href*="linkedin"]:hover{text-decoration:underline}
.panel input,.panel textarea{background:#0F1E3A!important;color:#FFFFFF!important;border-color:#2A4470!important}
.panel input:focus,.panel textarea:focus{border-color:#8FBBFF!important;outline:none}
.panel button{background:#8FBBFF!important;color:#0F1E3A!important;transition:background .2s}
.panel button:hover{background:#A9CBFF!important}
.panel button:disabled{opacity:.7;cursor:default}
.hp{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden}

/* logo tiles + tile images */
div[style*="height: 96px"][style*="background: #162A4E"],div[style*="height: 84px"][style*="background: #162A4E"]{box-shadow:inset 0 1px 0 rgba(255,255,255,0.10),0 12px 28px rgba(15,30,58,0.22);border-color:#2A4470}
[style*="aspect-ratio: 16 / 9"]{border-color:#2A4470}

/* carousel */
.cf{height:470px!important;margin:0 -72px!important;padding:0 72px!important;touch-action:pan-y;cursor:pointer;user-select:none}
.cf:active{cursor:grabbing}
.cf > div:first-child{background:linear-gradient(90deg,#F4F6FA 0,rgba(244,246,250,0) 14%,rgba(244,246,250,0) 86%,#F4F6FA 100%)!important}
.cf-slide > div{box-shadow:0 24px 50px rgba(15,30,58,0.25)!important;border-color:#B9CCE6!important}
.cf-slide img{pointer-events:none}

/* tablet */
@media (max-width: 1100px){
  .page > div{padding-left:32px!important;padding-right:32px!important}
  .page > div.panel{padding-left:32px!important;padding-right:32px!important}
  .page > div[style*="margin: 96px 72px 0"],.page > div[style*="margin: 72px 72px 0"]{margin-left:32px!important;margin-right:32px!important;padding-left:32px;padding-right:32px}
  .cf{margin:0 -32px!important;padding:0 32px!important}
  [style*="grid-template-columns: repeat(5"]{grid-template-columns:repeat(3,minmax(0,1fr))!important}
  [style*="grid-template-columns: repeat(4"]{grid-template-columns:repeat(3,minmax(0,1fr))!important}
  [style*="grid-template-columns: 360px"],[style*="grid-template-columns: 340px"],[style*="grid-template-columns: minmax(0, 1fr) 440px"]{grid-template-columns:1fr!important}
  .cf-slide{width:78vw!important}
  #top{grid-template-columns:1fr!important}
}

/* phone */
@media (max-width: 760px){
  #top,#jury,#work,#clients,#areas,#about,#contact{scroll-margin-top:84px}
  .page > div{padding-left:20px!important;padding-right:20px!important}
  .page > div.panel{margin-left:14px!important;margin-right:14px!important;padding:32px 20px!important}
  .page > div[style*="padding: 96px 72px 0"]{padding-top:64px!important}
  .cf{margin:0 -20px!important;padding:0 20px!important}
  h1{font-size:38px!important;line-height:1.1!important}
  h2{font-size:30px!important}
  #top{padding-top:44px!important}
  #top [style*="font-size: 22px"]{font-size:18px!important;flex-direction:column;gap:6px!important;align-items:flex-start}
  #top [style*="padding: 0px 12px"]{display:none}
  [style*="grid-template-columns: repeat(5"]{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  [style*="grid-template-columns: repeat(4"]{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  [style*="font-size: 30px; line-height: 1"]{font-size:24px!important}
  .cf{height:215px!important}
  .cf-slide{width:90vw!important}
  div[style*="display: flex; gap: 12px"]:has(> div[style*="height: 84px"]){flex-wrap:wrap}
  div[style*="height: 84px"]{flex:1 1 34%!important;box-sizing:border-box}
  /* menu */
  .page > .site-nav{padding-top:10px!important;padding-bottom:10px!important;flex-wrap:wrap}
  .site-nav img{height:40px!important}
  .nav-toggle{display:block}
  .nav-links{display:none!important;width:100%;flex-direction:column;align-items:flex-start!important;gap:6px!important;padding:12px 0 6px}
  .nav-links.open{display:flex!important}
  .nav-links a{padding:10px 0;font-size:17px!important}
  .nav-links a[style*="background"]{margin-top:6px;width:100%;text-align:center;box-sizing:border-box}
  /* about + contact stack */
  #about > div:first-child{max-width:320px}
  #contact form > div{grid-template-columns:1fr!important}
  #contact input,#contact textarea,#contact button{font-size:16px!important}
  .page > div[style*="margin-top: auto"]{flex-direction:column;gap:10px;align-items:flex-start!important}
}

/* ---------- photo hero ---------- */
.page .hero{position:relative;z-index:1;margin:-76px calc(50% - 50vw) 0;padding:196px max(72px,calc(50vw - 640px + 72px)) 150px!important;min-height:82vh;box-sizing:border-box;display:grid;align-items:end!important;overflow:hidden;background:#0F1E3A}
.hero-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 45%;z-index:0}
.hero-shade{position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(15,30,58,.55) 0%,rgba(15,30,58,.15) 35%,rgba(15,30,58,.35) 70%,rgba(15,30,58,.82) 100%),linear-gradient(90deg,rgba(15,30,58,.45) 0%,rgba(15,30,58,0) 60%)}
.page .hero > div:not(.hero-shade){position:relative;z-index:2}
.page .hero h1{color:#FFFFFF;font-size:72px;text-shadow:0 2px 24px rgba(15,30,58,.45)}
.page .hero [style*="color: #8FBBFF"]{color:#BFD8FF!important;text-shadow:0 1px 12px rgba(15,30,58,.5)}
.page .hero [style*="color: #8FBBFF"] span{color:#BFD8FF!important}
/* menu bar: transparent over the photo, navy once you scroll */
.page > .site-nav{transition:background .35s,box-shadow .35s,border-color .35s}
.page > .site-nav.over a:not([style*="background"]){text-shadow:0 1px 10px rgba(15,30,58,.6)}
.page > .site-nav.over{background:none;box-shadow:none;border-bottom:0;backdrop-filter:none;-webkit-backdrop-filter:none}
.page > .site-nav.over .nav-links.open{background:rgba(22,42,78,.96);margin:0 -20px;padding:12px 20px 10px}
/* first frame overlaps the photo slightly */
.page #jury{margin-top:-48px!important}
@media (max-width: 1100px){.page .hero{padding-left:32px!important;padding-right:32px!important}}
@media (max-width: 760px){
  #top.hero{margin-top:-60px;padding:120px 20px 72px!important;min-height:78vh}
  .page .hero h1{font-size:40px}
  .hero-img{object-position:35% 50%}
  .page #jury{margin-top:-28px!important}
}

/* ---------- wide layout: full-bleed bands, content capped at 1440 ---------- */
.page{max-width:1440px}
.page > .site-nav{padding-left:max(20px,calc(50vw - 720px + 72px))!important;padding-right:max(20px,calc(50vw - 720px + 72px))!important}
.page .hero{padding-left:max(72px,calc(50vw - 720px + 72px))!important;padding-right:max(72px,calc(50vw - 720px + 72px))!important;min-height:86vh}
.hero-eyebrow{color:#BFD8FF;font-size:13px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;margin-bottom:6px;text-shadow:0 1px 10px rgba(15,30,58,.6)}
.hero-eyebrow::before{content:"";display:inline-block;width:36px;height:2px;background:#8FBBFF;vertical-align:middle;margin-right:14px}
.page .hero h1{font-size:76px;max-width:980px}
.hero-shade{background:linear-gradient(180deg,rgba(15,30,58,.45) 0%,rgba(15,30,58,.08) 30%,rgba(15,30,58,.30) 62%,rgba(15,30,58,.86) 100%),linear-gradient(90deg,rgba(15,30,58,.40) 0%,rgba(15,30,58,0) 55%)}

/* bands */
.page div.panel.panel{margin-left:calc(50% - 50vw)!important;margin-right:calc(50% - 50vw)!important;border-radius:0!important;border:0!important;padding-left:max(72px,calc(50vw - 720px + 72px))!important;padding-right:max(72px,calc(50vw - 720px + 72px))!important;box-shadow:none!important;position:relative;overflow:hidden}
.page #jury{margin-top:0!important;padding-top:88px!important;padding-bottom:96px!important;background:radial-gradient(1200px 500px at 90% -10%,rgba(143,187,255,.22),rgba(143,187,255,0) 60%),radial-gradient(800px 500px at 0% 110%,rgba(47,95,191,.25),rgba(47,95,191,0) 60%),linear-gradient(165deg,#1B3158 0%,#162A4E 50%,#0F1E3A 100%)!important}
.page #jury::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:linear-gradient(90deg,rgba(143,187,255,0),rgba(143,187,255,.35),rgba(143,187,255,0))}
.page > #about{margin-top:120px!important;padding-top:104px!important;padding-bottom:104px!important;background:radial-gradient(900px 600px at 12% 30%,rgba(143,187,255,.28),rgba(143,187,255,0) 60%),radial-gradient(700px 500px at 100% 100%,rgba(47,95,191,.3),rgba(47,95,191,0) 60%),linear-gradient(180deg,#1B3158 0%,#132647 100%)!important}
.page > #contact{margin-top:0!important;padding-top:104px!important;padding-bottom:112px!important;background:#0F1E3A!important}
.band-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 60%;z-index:0;opacity:.9}
.band-shade{position:absolute;inset:0;z-index:0;background:linear-gradient(180deg,rgba(15,30,58,.92) 0%,rgba(15,30,58,.72) 45%,rgba(15,30,58,.86) 100%)}
.page > #contact > *:not(.band-img):not(.band-shade){position:relative;z-index:1}
.page > .site-footer{margin-left:calc(50% - 50vw)!important;margin-right:calc(50% - 50vw)!important;padding-left:max(72px,calc(50vw - 720px + 72px))!important;padding-right:max(72px,calc(50vw - 720px + 72px))!important;padding-top:26px;padding-bottom:26px;background:#0A1629;border-top:1px solid rgba(143,187,255,.12)}
.page > .site-footer,.page > .site-footer a,.page > .site-footer [style*="color"]{color:#8FA3C4!important}

/* light sections: even rhythm, grid everywhere */
.page > #work{padding-top:112px!important}
.page > #clients{padding-top:112px!important}
.page > #areas{padding-bottom:16px!important}
.lt2{opacity:.5;-webkit-mask-image:radial-gradient(1200px 900px at 80% 22%,#000 20%,transparent 100%),radial-gradient(1100px 900px at 8% 62%,#000 15%,transparent 100%),radial-gradient(900px 700px at 92% 78%,#000 10%,transparent 100%);mask-image:radial-gradient(1200px 900px at 80% 22%,#000 20%,transparent 100%),radial-gradient(1100px 900px at 8% 62%,#000 15%,transparent 100%),radial-gradient(900px 700px at 92% 78%,#000 10%,transparent 100%)}
.cf{margin:0 calc(50% - 50vw)!important;padding:0!important}
.cf-slide > div{box-shadow:0 30px 60px rgba(15,30,58,.28),0 8px 18px rgba(15,30,58,.12)!important}

/* section headings: one system */
.page h2{font-size:44px!important;line-height:1.12!important;letter-spacing:-.3px}
.panel h2{font-size:44px!important}
[style*="text-transform: uppercase"][style*="font-size: 13px"]{letter-spacing:.2em!important}

@media (max-width: 1100px){
  .page div.panel.panel{padding-left:32px!important;padding-right:32px!important}
  .page > .site-footer{padding-left:32px!important;padding-right:32px!important}
  .cf{margin:0 calc(50% - 50vw)!important;padding:0!important}
  .page .hero h1{font-size:60px}
}
@media (max-width: 760px){
  .page div.panel.panel{margin-left:calc(50% - 50vw)!important;margin-right:calc(50% - 50vw)!important;padding:56px 20px!important}
  .page #jury{padding-top:56px!important;padding-bottom:64px!important}
  .page > #about{margin-top:80px!important;padding-top:72px!important;padding-bottom:72px!important}
  .page > #contact{padding-top:72px!important;padding-bottom:80px!important}
  .page > #work,.page > #clients{padding-top:80px!important}
  .page > .site-footer{padding-left:20px!important;padding-right:20px!important}
  .page .hero h1{font-size:42px}
  .hero-eyebrow{font-size:11px}
  .page h2,.panel h2{font-size:32px!important}
  .cf{margin:0 calc(50% - 50vw)!important;padding:0!important}
}

/* ---------- finesse: B&W hero, two-line headline, richer bands ---------- */
.page .hero h1{max-width:720px;font-size:80px;line-height:1.04}
.page .hero > div:not(.hero-shade){max-width:760px;gap:20px!important}
.page .hero [style*="font-size: 22px"]{max-width:640px;font-size:21px!important;line-height:1.6}
.hero-shade{background:linear-gradient(180deg,rgba(15,30,58,.42) 0%,rgba(15,30,58,.10) 28%,rgba(15,30,58,.40) 55%,rgba(15,30,58,.90) 88%,#132647 100%),linear-gradient(90deg,rgba(15,30,58,.55) 0%,rgba(15,30,58,.10) 58%,rgba(15,30,58,0) 100%)}
.page .hero{padding-bottom:132px!important}
/* dark bands: gradient + faint drafting grid + glow, and a soft join from the photo */
.page #jury{background:radial-gradient(1100px 600px at 88% 0%,rgba(143,187,255,.26),rgba(143,187,255,0) 60%),radial-gradient(900px 600px at 5% 100%,rgba(47,95,191,.32),rgba(47,95,191,0) 60%),linear-gradient(180deg,#132647 0%,#162A4E 35%,#12244A 100%)!important}
.page > #about{background:radial-gradient(1000px 700px at 10% 20%,rgba(143,187,255,.30),rgba(143,187,255,0) 60%),radial-gradient(800px 600px at 100% 100%,rgba(47,95,191,.34),rgba(47,95,191,0) 60%),linear-gradient(170deg,#1D355F 0%,#162A4E 55%,#12244A 100%)!important}
.page #jury::before,.page > #about::before{content:"";position:absolute;inset:0;pointer-events:none;background-image:linear-gradient(rgba(143,187,255,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(143,187,255,.07) 1px,transparent 1px);background-size:28px 28px;-webkit-mask-image:radial-gradient(900px 600px at 85% 20%,#000 20%,transparent 100%),radial-gradient(800px 600px at 10% 90%,#000 10%,transparent 100%);mask-image:radial-gradient(900px 600px at 85% 20%,#000 20%,transparent 100%),radial-gradient(800px 600px at 10% 90%,#000 10%,transparent 100%)}
.page #jury > *,.page > #about > *{position:relative;z-index:1}
.page #jury::after{display:none}
.band-img{opacity:1;object-position:50% 55%}
.band-shade{background:linear-gradient(180deg,rgba(15,30,58,.90) 0%,rgba(15,30,58,.62) 50%,rgba(15,30,58,.88) 100%)}
@media (max-width: 1100px){.page .hero h1{font-size:62px}}
@media (max-width: 760px){.page .hero h1{font-size:44px;max-width:none}.page .hero{padding-bottom:88px!important}.page .hero [style*="font-size: 22px"]{font-size:18px!important}}

.page .hero > .hero-shade{position:absolute;inset:0;z-index:1;max-width:none}
.page #jury::before{top:80px}
@media (max-width: 760px){.hero-eyebrow{letter-spacing:.14em}.hero-eyebrow::before{width:24px;margin-right:10px}}

/* ---------- round 3 ---------- */
.hero-eyebrow{display:none}
.page .hero h1{font-size:84px;color:#fff;text-shadow:0 2px 6px rgba(10,22,46,.5),0 14px 40px rgba(10,22,46,.55)}
.hero-services{list-style:none;margin:6px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:12px 0;max-width:680px}
.hero-services li{font-size:14px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:#D6E6FF;text-shadow:0 1px 8px rgba(10,22,46,.6);display:flex;align-items:center}
.hero-services li + li::before{content:"";width:5px;height:5px;border-radius:50%;background:#8FBBFF;margin:0 18px;flex:none;box-shadow:0 0 0 3px rgba(143,187,255,.18)}
.hero-shade{background:linear-gradient(180deg,rgba(15,30,58,.38) 0%,rgba(15,30,58,.06) 30%,rgba(15,30,58,.55) 60%,rgba(15,30,58,.94) 88%,#12284F 100%),linear-gradient(90deg,rgba(15,30,58,.60) 0%,rgba(15,30,58,.15) 50%,rgba(15,30,58,0) 100%)}
/* jury: brighter royal navy, no grid */
.page #jury{background:radial-gradient(1200px 700px at 92% -10%,rgba(143,187,255,.34),rgba(143,187,255,0) 60%),radial-gradient(900px 600px at 0% 110%,rgba(90,140,230,.38),rgba(90,140,230,0) 60%),linear-gradient(165deg,#12284F 0%,#1A3A6F 45%,#1E4384 100%)!important}
.page #jury::before{display:none}
/* about: richer indigo with strong glow */
.page > #about{background:radial-gradient(1100px 700px at 8% 25%,rgba(143,187,255,.42),rgba(143,187,255,0) 58%),radial-gradient(900px 600px at 100% 100%,rgba(90,140,230,.40),rgba(90,140,230,0) 60%),linear-gradient(170deg,#2A4A86 0%,#1B3564 50%,#152C57 100%)!important}
.page > #about::before{opacity:.8}
/* contact: full photo, palms uncropped at top */
.page > #contact{min-height:720px}
.band-img{object-position:50% 0%;opacity:1}
.band-shade{background:linear-gradient(180deg,rgba(15,30,58,.55) 0%,rgba(15,30,58,.70) 35%,rgba(15,30,58,.92) 100%)}
@media (max-width: 1100px){.page .hero h1{font-size:64px}}
@media (max-width: 760px){.page .hero h1{font-size:46px}.hero-services{gap:10px 0}.hero-services li{font-size:12px;letter-spacing:.14em}.hero-services li + li::before{margin:0 12px}.page > #contact{min-height:0}.band-img{object-position:60% 0%}}
.hero-services-wrap{display:flex;flex-direction:column;gap:12px;margin-top:6px}
.hero-services{margin:0}
@media (max-width: 760px){.hero-services-wrap{gap:10px}.hero-services{flex-direction:column;gap:10px}.hero-services li + li::before{display:none}}

/* ---------- round 4: mesh-gradient bands, lighter tile captions ---------- */
.page #jury{background:url(images/band-jury.jpg) center/cover no-repeat,#12284F!important}
.page > #about{background:url(images/band-about.jpg) center/cover no-repeat,#142048!important;position:relative}
.page > #about::before{display:none}
.page #jury::before{display:none}
.page #jury::after{display:block;content:"";position:absolute;left:0;right:0;top:0;height:120px;background:linear-gradient(180deg,#12284F,rgba(18,40,79,0));pointer-events:none}
.page #jury > *{position:relative;z-index:1}
#jury [style*="font-weight: 600; font-size: 15px"]{font-weight:400!important;font-size:16px!important;color:#C9D9F3!important;letter-spacing:.01em}
#jury [style*="font-size: 30px; line-height: 1"]{font-weight:400!important;color:#BFD8FF!important}
/* about photo: fill the height of the text block */
#about{grid-template-columns:420px minmax(0,1fr)!important;align-items:stretch!important;gap:64px!important}
#about > div:first-child{aspect-ratio:auto!important;height:100%;min-height:0;align-self:stretch}
#about > div:first-child img{object-position:50% 30%}
@media (max-width: 1100px){#about{grid-template-columns:1fr!important}#about > div:first-child{aspect-ratio:1/1!important;max-width:420px;min-height:0}}
/* jury: title higher, more room before the tiles */
.page #jury{padding-top:72px!important;gap:56px!important}
@media (max-width: 760px){.page #jury{padding-top:48px!important;gap:36px!important}}
/* hero text lower */
.page .hero{padding-bottom:88px!important}
@media (max-width: 760px){.page .hero{padding-bottom:64px!important}}
/* more photo visible below the services */
.page .hero{padding-bottom:150px!important;min-height:90vh}
.hero-shade{background:linear-gradient(180deg,rgba(15,30,58,.38) 0%,rgba(15,30,58,.06) 30%,rgba(15,30,58,.50) 58%,rgba(15,30,58,.72) 82%,rgba(15,30,58,.92) 95%,#12284F 100%),linear-gradient(90deg,rgba(15,30,58,.60) 0%,rgba(15,30,58,.15) 50%,rgba(15,30,58,0) 100%)}
@media (max-width: 760px){.page .hero{padding-bottom:96px!important}}

/* ---------- Our work on a dark band ---------- */
.page > #work{margin-left:calc(50% - 50vw)!important;margin-right:calc(50% - 50vw)!important;padding-left:max(72px,calc(50vw - 720px + 72px))!important;padding-right:max(72px,calc(50vw - 720px + 72px))!important;padding-top:104px!important;padding-bottom:104px!important;background:url(images/band-work.jpg) center/cover no-repeat,#0B1630;position:relative}
.page > #work h2, .page > #work h2 *{color:#FFFFFF!important}
.page > #work [style*="text-transform: uppercase"]{color:#8FBBFF!important}
.page > #work h2 em, .page > #work h2 span{color:#9DAECB!important}
.cf > div:first-child{background:linear-gradient(90deg,#0B1630 0,rgba(11,22,48,0) 14%,rgba(11,22,48,0) 86%,#0B1630 100%)!important}
.cf-slide > div{box-shadow:0 30px 70px rgba(0,0,0,.55),0 8px 18px rgba(0,0,0,.3)!important;border-color:rgba(143,187,255,.25)!important}
.page > #clients{padding-top:112px!important}
@media (max-width: 1100px){.page > #work{padding-left:32px!important;padding-right:32px!important}}
@media (max-width: 760px){.page > #work{padding:72px 20px 72px!important}}
/* jury band: bright blue body, hero dissolves into it */
.page #jury::after{height:220px;background:linear-gradient(180deg,#12284F 0%,rgba(18,40,79,.6) 45%,rgba(18,40,79,0) 100%)}
#jury [style*="font-size: 30px; line-height: 1"]{color:#FFFFFF!important}
#jury [style*="font-weight: 600; font-size: 15px"]{color:#E6EEFF!important}
/* jury band: back to the navy-to-electric mesh */
.page #jury::after{height:120px;background:linear-gradient(180deg,#12284F,rgba(14,30,62,0))}
#jury [style*="font-size: 30px; line-height: 1"]{color:#BFD8FF!important}
#jury [style*="font-weight: 600; font-size: 15px"]{color:#C9D9F3!important}
/* crisp edge between hero and the first band */
.hero-shade{background:linear-gradient(180deg,rgba(15,30,58,.38) 0%,rgba(15,30,58,.06) 30%,rgba(15,30,58,.50) 60%,rgba(15,30,58,.78) 100%),linear-gradient(90deg,rgba(15,30,58,.60) 0%,rgba(15,30,58,.15) 50%,rgba(15,30,58,0) 100%)}
.page #jury::after{display:none}
.page #jury{border-top:1px solid rgba(143,187,255,.22)!important}
/* hero → band: a short, gentle dissolve instead of a hard line */
.hero-shade{background:linear-gradient(180deg,rgba(15,30,58,.38) 0%,rgba(15,30,58,.06) 30%,rgba(15,30,58,.50) 62%,rgba(15,30,58,.80) 90%,#12284F 100%),linear-gradient(90deg,rgba(15,30,58,.60) 0%,rgba(15,30,58,.15) 50%,rgba(15,30,58,0) 100%)}
.page #jury{border-top:0!important}
.page #jury::after{display:block;height:56px;background:linear-gradient(180deg,#12284F,rgba(18,40,79,0))}
/* hero → band: tighter dissolve */
.hero-shade{background:linear-gradient(180deg,rgba(15,30,58,.38) 0%,rgba(15,30,58,.06) 30%,rgba(15,30,58,.50) 62%,rgba(15,30,58,.74) 95%,#12284F 100%),linear-gradient(90deg,rgba(15,30,58,.60) 0%,rgba(15,30,58,.15) 50%,rgba(15,30,58,0) 100%)}
.page #jury::after{height:24px}
/* jury thumbnails: board mounted inside a dark tile */
#jury div[style*="aspect-ratio"]{background:#0F1E3A!important;padding:14px;box-sizing:border-box;border-color:rgba(143,187,255,.28)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 14px 30px rgba(15,30,58,.35)}
#jury div[style*="aspect-ratio"] img{border-radius:6px;box-shadow:0 6px 16px rgba(0,0,0,.35)}
@media (max-width: 760px){#jury div[style*="aspect-ratio"]{padding:10px}}
/* no seam: photo ends in the exact colour the band starts with */
.page #jury::after{display:none}
#jury div[style*="aspect-ratio"]{border:0!important;box-shadow:0 14px 30px rgba(15,30,58,.35)}

/* ---------- continuous photo: hero runs on behind the jury section ---------- */
.hero-shade{background:linear-gradient(180deg,rgba(15,30,58,.38) 0%,rgba(15,30,58,.06) 30%,rgba(15,30,58,.55) 70%,rgba(15,30,58,.86) 100%),linear-gradient(90deg,rgba(15,30,58,.60) 0%,rgba(15,30,58,.15) 50%,rgba(15,30,58,0) 100%)}
.page #jury{background:none!important;position:relative}
.page #jury::before{content:"";display:block!important;position:absolute;inset:0;background:url(images/hero-2000.jpg) center 100%/cover no-repeat;z-index:0;top:0;-webkit-mask-image:none;mask-image:none}
.page #jury::after{display:block!important;content:"";position:absolute;inset:0;height:auto;top:0;background:linear-gradient(180deg,rgba(15,30,58,.86),rgba(15,30,58,.93) 60%,#0B1630 100%);z-index:0}
.page #jury > *{position:relative;z-index:1}
.hero-img{object-position:50% 20%}
.page > #work{margin-top:0!important}
@media (max-width: 760px){.page #jury::before{background-position:60% 100%}}
/* one photo spanning hero + jury (height set by script) */
.page .hero{overflow:visible}
.hero-img{height:100%;object-position:50% 30%;z-index:0}
.page .hero > .hero-shade{z-index:1}
.page #jury::before{display:none!important}
.page #jury{background:none!important;overflow:visible}
.page #jury::after{background:linear-gradient(180deg,rgba(15,30,58,.86),rgba(15,30,58,.92) 55%,#0B1630 100%)}
/* jury section: more room above it on the photo */
.page #jury{padding-top:150px!important;padding-bottom:104px!important}
@media (max-width: 760px){.page #jury{padding-top:88px!important}}
/* labels align with the mounted board, not the tile */
#jury div[style*="aspect-ratio"] + div{padding-left:14px}
@media (max-width: 760px){#jury div[style*="aspect-ratio"] + div{padding-left:10px}}
/* tiles shrink-wrap the board so label, frame and image share a left edge */
#jury div[style*="aspect-ratio"]{aspect-ratio:auto!important;width:fit-content;max-width:100%;display:block}
#jury div[style*="aspect-ratio"] img{height:132px;width:auto;max-width:100%;object-fit:contain;display:block}
@media (max-width: 1100px){#jury div[style*="aspect-ratio"] img{height:120px}}
@media (max-width: 760px){#jury div[style*="aspect-ratio"] img{height:96px}}
#jury div[style*="aspect-ratio"]{height:160px;display:flex;align-items:center}
#jury div[style*="aspect-ratio"] img{height:auto;max-height:132px;width:auto;max-width:100%}
@media (max-width: 1100px){#jury div[style*="aspect-ratio"]{height:148px}#jury div[style*="aspect-ratio"] img{max-height:120px}}
@media (max-width: 760px){#jury div[style*="aspect-ratio"]{height:116px}#jury div[style*="aspect-ratio"] img{max-height:96px}}
/* hero text lower */
.page .hero{padding-bottom:96px!important}
@media (max-width: 760px){.page .hero{padding-bottom:64px!important}}
/* seam fix: hero overlay ends at exactly the density the jury overlay starts with */
.hero-shade{background:linear-gradient(180deg,rgba(15,30,58,.38) 0%,rgba(15,30,58,.06) 30%,rgba(15,30,58,.55) 70%,rgba(15,30,58,.86) 100%),linear-gradient(90deg,rgba(15,30,58,.60) 0%,rgba(15,30,58,.15) 50%,rgba(15,30,58,0) 100%)}
.page #jury::after{background:linear-gradient(180deg,rgba(15,30,58,.86) 0%,rgba(15,30,58,.86) 4%,rgba(15,30,58,.92) 55%,#0B1630 100%)}
.page #jury::after{background:linear-gradient(180deg,rgba(15,30,58,.86) 0%,rgba(15,30,58,.86) 4%,rgba(15,30,58,.92) 55%,#0B1630 100%),linear-gradient(90deg,rgba(15,30,58,.60) 0%,rgba(15,30,58,.15) 50%,rgba(15,30,58,0) 100%)}

/* ---------- photo wrapper: one image behind hero + jury, no script ---------- */
.page > .photo-wrap{padding:0!important;position:relative;z-index:1;overflow:hidden}
.page > .photo-wrap > .hero-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 30%;z-index:0}
.page .hero,.page #jury{position:relative;z-index:1}
.page .hero{overflow:visible;background:none}
.page .hero > .hero-shade{position:absolute;inset:0;z-index:0}
.page .hero > div:not(.hero-shade){position:relative;z-index:1}
.page #jury{background:none!important}
.page #jury::after{z-index:0}
.page #jury > *{position:relative;z-index:1}
.page > .photo-wrap{margin-left:calc(50% - 50vw)!important;margin-right:calc(50% - 50vw)!important}
.page .hero{margin-left:0!important;margin-right:0!important;margin-top:0!important}
/* phone menu open: solid navy bar so the lockup and the X stay visible */
.page > .site-nav.menu-open{background:rgba(22,42,78,.98)!important;box-shadow:0 10px 28px rgba(15,30,58,.35)!important}
.page > .site-nav.over .nav-links.open{margin:0;padding:12px 0 10px;background:none}
