/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Nov 14 2026 | 15:32:57 */
@import url('https://fonts.googleapis.com/css2?family=Oxanium:wght@400;500;600;700;800&family=Sulphur+Point:wght@400;500;600;700&family=Material+Symbols+Rounded:opsz,wght,FILL,GRAD@20..48,400,0,0&display=swap');

/* =====================================================================
   HSE ELEMENTS | PROJECT HISTORY | COMPLETE STANDALONE STYLESHEET
   Page-scoped, responsive, no dependency on other HSE Elements pages.
   Integrated interactions only. No appended patch fixes or overrides.
   ===================================================================== */

/* 01 | WordPress Twenty Twenty-Five spacing and page foundation */
body:has(#hse-project-history) { margin-top:0; }
body:has(#hse-project-history) .wp-site-blocks,
body:has(#hse-project-history) .wp-site-blocks > main,
body:has(#hse-project-history) .wp-block-post-content,
body:has(#hse-project-history) .entry-content { margin-block-start:0; padding-block-start:0; }
body:has(#hse-project-history) .wp-site-blocks > header:has(.hse-site-header) + * { margin-block-start:0; }
body:has(#hse-project-history) .wp-block-post-content > .wp-block-html:has(#hse-project-history) { margin-block-start:0; padding-block-start:0; }
#hse-project-history {
  --hph-amber:#FFC84A;
  --hph-gold:#D89B2B;
  --hph-amber-light:#FFD578;
  --hph-light:#FAD995;
  --hph-paper:#F7F7F5;
  --hph-white:#FFFFFF;
  --hph-ink:#161817;
  --hph-muted:#59615D;
  --hph-silver:#E7EBEB;
  --hph-charcoal:#191D1F;
  --hph-black:#0F1213;
  --hph-ease:cubic-bezier(.22,1,.36,1);
  --hph-gutter:clamp(20px,4.6vw,86px);
  --hph-max:1520px;
  position:relative; isolation:isolate; width:100%; max-width:none; margin:0;
  overflow-x:clip; background:var(--hph-paper); color:var(--hph-ink);
  font:400 16px/1.55 'Sulphur Point',Arial,sans-serif;
  -webkit-font-smoothing:antialiased;
}
#hse-project-history,#hse-project-history *,#hse-project-history *::before,#hse-project-history *::after { box-sizing:border-box; }
#hse-project-history :is(h1,h2,h3,h4,p,figure) { margin:0; }
#hse-project-history :is(h1,h2,h3,h4) { font-family:'Oxanium',Arial,sans-serif; letter-spacing:-.045em; text-wrap:balance; }
#hse-project-history h2 { font-size:clamp(35px,4vw,66px); font-weight:500; line-height:1.045; }
#hse-project-history h3 { font-weight:600; }
#hse-project-history :is(h1,h2) em { font-style:normal; }
#hse-project-history img { display:block; width:100%; max-width:100%; }
#hse-project-history a { color:inherit; text-decoration:none; -webkit-tap-highlight-color:transparent; }
#hse-project-history button,#hse-project-history input { font:inherit; }
#hse-project-history button { cursor:pointer; }
#hse-project-history :is(a,button,input):focus-visible { outline:3px solid var(--hph-gold); outline-offset:4px; }
#hse-project-history [hidden] { display:none!important; }
#hse-project-history .material-symbols-rounded {
  display:inline-grid!important; place-items:center; flex:none;
  font-family:'Material Symbols Rounded'; font-size:24px; font-weight:400;
  font-style:normal; line-height:1!important; letter-spacing:normal;
  text-transform:none; white-space:nowrap; word-wrap:normal; direction:ltr;
  -webkit-font-feature-settings:'liga'; font-feature-settings:'liga'; -webkit-font-smoothing:antialiased;
  font-variation-settings:'FILL' 0,'wght' 400,'GRAD' 0,'opsz' 24;
}
.hph-container { width:min(calc(100% - var(--hph-gutter)*2),var(--hph-max)); margin-inline:auto; }
.hph-section { padding-block:clamp(88px,8.4vw,140px); }
#hse-project-history .hph-kicker {
  margin:0 0 21px; color:var(--hph-gold);
  font:700 clamp(11px,.8vw,13px)/1.4 'Oxanium',Arial,sans-serif;
  letter-spacing:.16em; text-transform:uppercase;
}
#hse-project-history :is(#hph-intro,#hph-projects) { scroll-margin-top:clamp(92px,10vw,130px); }
.hph-visually-hidden { position:absolute!important; width:1px!important; height:1px!important; padding:0!important; margin:-1px!important; overflow:hidden!important; clip:rect(0,0,0,0)!important; white-space:nowrap!important; border:0!important; }

/* 02 | HSE Elements button styles, including pressed-slide detail */
#hse-project-history .hph-btn {
  --hph-pressed:#fff;
  position:relative; isolation:isolate; display:inline-flex; justify-content:center; align-items:center;
  gap:12px; min-height:49px; width:fit-content; max-width:100%; padding:12px 20px;
  border:1px solid transparent; border-radius:10px; overflow:hidden;
  font:700 12px/1.25 'Oxanium',Arial,sans-serif; text-align:center;
  text-transform:uppercase; letter-spacing:.015em; vertical-align:middle;
  cursor:pointer; transform:translate3d(0,0,0);
  transition:transform .33s var(--hph-ease),background-color .32s ease,color .32s ease,border-color .32s ease,box-shadow .43s ease;
}
.hph-btn::before { content:''; position:absolute; inset:0; z-index:-1; background:var(--hph-pressed); transform:translateX(-103%); transition:transform .48s var(--hph-ease); pointer-events:none; }
.hph-btn:active::before { transform:translateX(0); }
#hse-project-history .hph-btn > .material-symbols-rounded { font-size:19px!important; transition:transform .35s var(--hph-ease); }
#hse-project-history .hph-btn:hover { transform:translate3d(0,-2px,0); }
#hse-project-history .hph-btn:active { transform:translate3d(0,0,0); }
.hph-btn:hover > .material-symbols-rounded { transform:scale(1.06); }
#hse-project-history .hph-btn--amber { background:var(--hph-amber); color:#10120f; box-shadow:inset 0 1px rgba(255,255,255,.34),0 10px 31px rgba(216,155,43,.13); }
#hse-project-history .hph-btn--amber:hover { background:var(--hph-amber-light); color:#10120f; box-shadow:inset 0 1px rgba(255,255,255,.4),0 15px 36px rgba(216,155,43,.21); }
#hse-project-history .hph-btn--amber:active { border-color:var(--hph-gold); background:var(--hph-amber-light); color:#10120f; box-shadow:0 0 0 4px rgba(255,200,74,.21); }
#hse-project-history .hph-btn--glass { color:#fff; border-color:rgba(255,255,255,.40); background:rgba(255,255,255,.09); -webkit-backdrop-filter:blur(18px) saturate(130%); backdrop-filter:blur(18px) saturate(130%); box-shadow:inset 0 1px rgba(255,255,255,.15); }
#hse-project-history .hph-btn--glass:hover { color:#fff; border-color:rgba(255,200,74,.73); background:rgba(255,200,74,.19); box-shadow:inset 0 1px rgba(255,255,255,.15),0 13px 29px rgba(0,0,0,.13); }
#hse-project-history .hph-btn--glass:active { --hph-pressed:rgba(241,244,244,.9); color:#111; border-color:#fff; background:rgba(255,255,255,.26); box-shadow:0 0 0 4px rgba(255,255,255,.15); }
#hse-project-history .hph-btn--darkglass { --hph-pressed:#fff; color:#fff; border-color:rgba(255,255,255,.34); background:rgba(20,23,23,.27); -webkit-backdrop-filter:blur(18px); backdrop-filter:blur(18px); }
#hse-project-history .hph-btn--darkglass:hover { border-color:var(--hph-amber); background:rgba(255,200,74,.13); }
#hse-project-history .hph-btn--darkglass:active { color:#111; background:#fff; }
#hse-project-history .hph-btn--outline { color:#202320; background:#fff; border-color:rgba(54,63,62,.19); box-shadow:0 9px 25px rgba(21,27,25,.06); }
#hse-project-history .hph-btn--outline:hover { background:#FFF4D7; border-color:var(--hph-gold); }

/* 03 | Project Atlas — dark panorama + three stacked editorial field images */
.hph-hero {
  position:relative; isolation:isolate; min-height:clamp(730px,87svh,1030px);
  overflow:hidden; color:#fff;
  background:
    radial-gradient(ellipse at 86% 12%,rgba(216,155,43,.16),transparent 34%),
    radial-gradient(ellipse at 18% 95%,rgba(182,191,194,.09),transparent 43%),
    linear-gradient(127deg,#141819 0%,#202627 49%,#101415 100%);
}
.hph-hero__grid { position:absolute; inset:0; opacity:.35; pointer-events:none; background-image:linear-gradient(rgba(237,243,243,.052) 1px,transparent 1px),linear-gradient(90deg,rgba(237,243,243,.052) 1px,transparent 1px); background-size:154px 154px; -webkit-mask-image:linear-gradient(90deg,transparent 9%,#000 50%,#000 92%); mask-image:linear-gradient(90deg,transparent 9%,#000 50%,#000 92%); }
.hph-hero::before { content:''; position:absolute; z-index:0; right:-15%; top:-24%; width:72%; aspect-ratio:1; border-radius:50%; background:radial-gradient(circle,rgba(216,155,43,.12),transparent 66%); filter:blur(12px); animation:hph-atmosphere 23s ease-in-out infinite alternate; pointer-events:none; }
@keyframes hph-atmosphere { from { transform:translate3d(-20px,25px,0) scale(.95); } to { transform:translate3d(17px,-22px,0) scale(1.09); } }
/* Nested project-atlas diamonds: one centre, three sizes, descending gently from above. */
.hph-hero__diamonds { position:absolute; inset:0; z-index:0; pointer-events:none; }
.hph-hero__diamond {
  position:absolute; display:block; left:50%; top:49%; aspect-ratio:1;
  translate:-50% -50%; border:1px solid rgba(255,224,150,.45);
  border-radius:clamp(16px,2.3vw,35px);
  background:linear-gradient(145deg,rgba(255,200,74,.19),rgba(247,250,248,.06) 65%,rgba(255,227,164,.09));
  box-shadow:inset 0 1px rgba(255,255,255,.23),0 13px 54px rgba(216,155,43,.09);
  -webkit-backdrop-filter:blur(5px); backdrop-filter:blur(5px);
  animation:hph-hero-diamond-arrive 1.35s var(--hph-ease) var(--hph-entry,.1s) both,
            hph-hero-diamond-float var(--hph-float,17s) ease-in-out var(--hph-phase,0s) infinite alternate;
}
.hph-hero__diamond--one { width:86%; --hph-entry:.08s; --hph-float:18s; --hph-phase:-3s; }
.hph-hero__diamond--two { width:66%; --hph-entry:.30s; --hph-float:21s; --hph-phase:-7s; border-color:rgba(242,247,247,.42); background:linear-gradient(138deg,rgba(241,244,242,.14),rgba(255,200,74,.15)); }
.hph-hero__diamond--three { width:46%; --hph-entry:.52s; --hph-float:16s; --hph-phase:-5s; background:linear-gradient(138deg,rgba(255,210,106,.23),rgba(255,255,255,.09)); }
@keyframes hph-hero-diamond-arrive { from { opacity:0; translate:-50% calc(-50% - 92px); } to { opacity:1; translate:-50% -50%; } }
@keyframes hph-hero-diamond-float { from { transform:translate3d(-8px,12px,0) rotate(45deg); } to { transform:translate3d(11px,-20px,0) rotate(45deg); } }
.hph-hero__layout { position:relative; z-index:1; min-height:inherit; display:grid; grid-template-columns:minmax(0,1.06fr) minmax(0,.94fr); align-items:center; column-gap:clamp(30px,4.5vw,75px); padding-block:clamp(150px,11.8vw,200px) clamp(95px,9.2vw,142px); }
.hph-hero__copy { position:relative; z-index:3; align-self:center; max-width:785px; }
#hse-project-history .hph-kicker--pill { display:inline-flex; align-items:center; gap:9px; margin-bottom:26px; padding:9px 15px; color:var(--hph-light); border:1px solid rgba(255,200,74,.47); border-radius:999px; background:rgba(255,200,74,.105); -webkit-backdrop-filter:blur(16px); backdrop-filter:blur(16px); box-shadow:inset 0 1px rgba(255,255,255,.10); }
#hse-project-history .hph-kicker--pill .material-symbols-rounded { font-size:19px!important; }
.hph-hero h1 { max-width:800px; font-size:clamp(50px,5.3vw,88px); font-weight:500; line-height:1.025; color:#fff; letter-spacing:-.058em!important; }
.hph-hero h1 em { color:var(--hph-amber); background:linear-gradient(90deg,rgba(255,200,74,.22),rgba(255,200,74,0)) left bottom / 0% 21% no-repeat; animation:hph-underline 1.65s var(--hph-ease) .4s both; -webkit-box-decoration-break:clone; box-decoration-break:clone; }
@keyframes hph-underline { from { background-size:0 21%; } to { background-size:100% 21%; } }
.hph-hero__lead { max-width:625px; margin-top:25px!important; font-size:clamp(16px,1.4vw,21px); line-height:1.55; color:rgba(255,255,255,.77); }
.hph-hero__actions { display:flex; align-items:center; gap:12px; flex-wrap:wrap; margin-top:31px; }
.hph-hero__legend { position:relative; z-index:5; display:flex; align-items:center; gap:13px 22px; flex-wrap:wrap; padding-top:clamp(47px,6vw,84px); }
.hph-hero__legend > span { display:inline-flex; align-items:center; gap:9px; font:600 10px/1.4 'Oxanium',Arial,sans-serif; color:rgba(234,239,238,.51); letter-spacing:.10em; }
.hph-hero__legend i { display:block; width:7px; height:7px; border-radius:50%; background:var(--hph-gold); box-shadow:0 0 0 4px rgba(216,155,43,.11); }
.hph-hero__atlas { position:relative; isolation:isolate; width:100%; min-height:clamp(515px,38vw,660px); perspective:1200px; transform:translate3d(0,var(--hph-atlas-shift,0px),0); }
.hph-hero__frame { position:absolute; overflow:hidden; padding:5px; border:1px solid rgba(255,255,255,.62); border-radius:19px; background:rgba(210,218,217,.19); -webkit-backdrop-filter:blur(13px); backdrop-filter:blur(13px); box-shadow:0 19px 45px rgba(0,0,0,.32),inset 0 1px rgba(255,255,255,.18); transform:translate3d(0,0,0); animation:hph-hero-image-enter 1.4s var(--hph-ease) both; transition:border-color .55s ease,box-shadow .65s var(--hph-ease),transform .85s var(--hph-ease); }
@keyframes hph-hero-image-enter { from { opacity:0; translate:0 33px; } to { opacity:1; translate:0 0; } }
.hph-hero__frame img { width:100%; height:100%; min-height:0; object-fit:cover; border-radius:14px; filter:saturate(.89) contrast(1.045) sepia(.045); transition:transform 1.2s var(--hph-ease),filter 1.2s ease; }
.hph-hero__frame::after { content:''; position:absolute; inset:5px; pointer-events:none; border-radius:14px; background:linear-gradient(180deg,rgba(0,0,0,.33),transparent 45%,rgba(0,0,0,.20)); }
.hph-hero__frame--one { z-index:1; left:0%; top:5%; width:54%; height:43%; transform:rotate(-4deg); animation-delay:1.52s; }
.hph-hero__frame--two { z-index:3; right:0%; top:13%; width:60%; height:61%; transform:rotate(4deg); animation-delay:1.75s; }
.hph-hero__frame--three { z-index:2; left:6%; bottom:1%; width:53%; height:43%; transform:rotate(-2deg); animation-delay:1.98s; }
.hph-hero__frame--two img { object-position:center 38%; }
.hph-hero__frame--three img { object-position:center 35%; }
.hph-hero__frame:hover { border-color:rgba(255,200,74,.85); box-shadow:0 27px 62px rgba(0,0,0,.42),0 0 33px rgba(216,155,43,.11); }
.hph-hero__frame--one:hover { transform:translateY(-5px) rotate(-4deg); }
.hph-hero__frame--two:hover { transform:translateY(-5px) rotate(4deg); }
.hph-hero__frame--three:hover { transform:translateY(-5px) rotate(-2deg); }
.hph-hero__frame:hover img { transform:scale(1.055); filter:saturate(.99) contrast(1.03) sepia(.04); }
.hph-hero__frame:active { border-color:rgba(255,214,113,.93); box-shadow:0 19px 45px rgba(0,0,0,.32),0 0 0 3px rgba(255,200,74,.24),0 0 30px rgba(255,200,74,.30); }
.hph-hero__frame--one:active { transform:translate3d(0,0,0) rotate(-4deg); }
.hph-hero__frame--two:active { transform:translate3d(0,0,0) rotate(4deg); }
.hph-hero__frame--three:active { transform:translate3d(0,0,0) rotate(-2deg); }
.hph-hero__frame:active img { transform:scale(1); filter:saturate(.89) contrast(1.045) sepia(.045); }
.hph-hero__frame-head { position:absolute; z-index:1; left:19px; top:18px; display:flex; align-items:center; gap:0; padding:8px 10px; color:#fff; border:1px solid rgba(255,255,255,.30); border-radius:9px; background:rgba(14,17,18,.55); -webkit-backdrop-filter:blur(12px); backdrop-filter:blur(12px); box-shadow:inset 0 1px rgba(255,255,255,.13); }
.hph-hero__frame-head small { font:700 9px/1.2 'Oxanium',sans-serif; letter-spacing:.075em; white-space:nowrap; }
.hph-hero__atlas-stamp { position:absolute; z-index:4; display:flex; align-items:center; gap:11px; right:1%; bottom:-2%; padding:14px 17px; border:1px solid rgba(255,255,255,.66); border-radius:13px; background:rgba(42,48,48,.79); -webkit-backdrop-filter:blur(22px) saturate(140%); backdrop-filter:blur(22px) saturate(140%); box-shadow:inset 0 1px rgba(255,255,255,.16),0 14px 35px rgba(0,0,0,.25); font:700 10px/1.45 'Oxanium',sans-serif; letter-spacing:.06em; animation:hph-stamp-enter 1.25s var(--hph-ease) 1.75s both; }
.hph-hero__atlas-stamp .material-symbols-rounded { color:var(--hph-amber); font-size:25px!important; }
.hph-hero__atlas-stamp strong { display:block; margin-top:3px; color:var(--hph-light); }
@keyframes hph-stamp-enter { from { opacity:0; translate:48px 0; } to { opacity:1; translate:0 0; } }

/* 04 | Editorial project context/* 04 | Editorial project context and six-segment sector rail */
.hph-intro { background:linear-gradient(143deg,#FAFAF7,#F1F4F3); }
.hph-intro__heading {
  display:grid;
  grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);
  gap:clamp(32px,6vw,96px);
  align-items:center;
  margin-bottom:clamp(42px,5vw,72px);
}
.hph-intro h2 span { color:#727875; }
.hph-intro__copy {
  max-width:630px;
  padding-bottom:4px;
  align-self:center;
}
.hph-intro__copy p,.hph-intro__lead-paragraph { color:var(--hph-muted); font-size:clamp(16px,1.25vw,19px); line-height:1.64; }
.hph-intro__lead-paragraph { max-width:650px; margin-top:clamp(20px,2.3vw,32px)!important; }
.hph-intro__copy p + p { margin-top:16px!important; }
.hph-sector-line { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.hph-sector-line__item { position:relative; display:grid; grid-template-columns:39px minmax(0,1fr) 19px; align-items:center; gap:12px; min-height:88px; padding:18px 19px; border:1px solid #DCE2DF; border-radius:15px; background:var(--hph-sector-base,rgba(255,255,255,.61)); box-shadow:inset 0 1px rgba(255,255,255,.95),0 12px 27px rgba(18,32,29,.035); -webkit-backdrop-filter:blur(12px); backdrop-filter:blur(12px); transform:translate3d(0,0,0); transition:background-color .36s ease,border-color .36s ease,box-shadow .5s var(--hph-ease),transform .62s var(--hph-ease); }
/* Six light, distinct starting surfaces; existing hover and pressed surfaces stay intact. */
.hph-sector-line__item:nth-child(1) { --hph-sector-base:linear-gradient(135deg,#F5F7F8,#E9EDEF); }
.hph-sector-line__item:nth-child(2) { --hph-sector-base:linear-gradient(135deg,#EDF1F3,#E3E8EB); }
.hph-sector-line__item:nth-child(3) { --hph-sector-base:linear-gradient(135deg,#E6E9ED,#F1F3F5); }
.hph-sector-line__item:nth-child(4) { --hph-sector-base:linear-gradient(135deg,#F8F8F8,#ECEDEE); }
.hph-sector-line__item:nth-child(5) { --hph-sector-base:linear-gradient(135deg,#E9EEF1,#F8FAFA); }
.hph-sector-line__item:nth-child(6) { --hph-sector-base:linear-gradient(135deg,#F2F3F5,#E3E6EA); }
 .hph-sector-line__item > .material-symbols-rounded:first-child { width:39px; height:39px; border:1px solid transparent; border-radius:11px; color:#101313; background:rgba(255,200,74,.19); font-size:23px!important; transition:background-color .45s ease,color .4s ease,border-color .45s ease,box-shadow .5s var(--hph-ease); }
.hph-sector-line__item:hover > .material-symbols-rounded:first-child { background:#fff; color:#101313; border-color:rgba(177,187,191,.93); box-shadow:inset 0 1px rgba(255,255,255,.88); }
.hph-sector-line__item:active > .material-symbols-rounded:first-child { background:var(--hph-amber); color:#101313; border-color:rgba(255,227,154,.90); }
.hph-sector-line__item > span:nth-child(2) { font:600 clamp(13px,1.02vw,16px)/1.35 'Oxanium',sans-serif; letter-spacing:-.025em; }
.hph-sector-line__go { font-size:17px!important; color:#89928D; transform:rotate(0deg); transition:color .35s ease,transform .65s var(--hph-ease); }
.hph-sector-line__item:hover { transform:translateY(-3px); background:#fff; border-color:rgba(255,218,132,.90); box-shadow:inset 0 1px rgba(255,255,255,.85),0 17px 39px rgba(32,44,35,.078),0 0 0 1px rgba(255,228,164,.32); }
.hph-sector-line__item:hover .hph-sector-line__go { color:var(--hph-gold); transform:rotate(45deg); }
.hph-sector-line__item:active { transform:translateY(0); background:#FFF4D5; border-color:rgba(255,219,138,.95); box-shadow:0 0 0 3px rgba(255,200,74,.18),0 0 22px rgba(255,200,74,.23); }
.hph-sector-line__item:active .hph-sector-line__go { color:var(--hph-gold); transform:rotate(135deg); }

/* 05 | Searchable project index, controls, and cards with/without photos */
.hph-projects { background:#FFFFFF; }
.hph-projects__intro { display:flex; justify-content:space-between; align-items:center; gap:20px clamp(30px,6vw,110px); margin-bottom:clamp(40px,4.2vw,68px); }
.hph-projects__intro > div { flex:1 1 53%; }
.hph-projects__intro h2 em { color:#6D746F; }
.hph-projects__intro > p { flex:1 1 34%; max-width:520px; padding-bottom:5px; color:var(--hph-muted); font-size:clamp(16px,1.28vw,19px); }
.hph-toolbar { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:24px 22px; padding:28px 20px; overflow:visible; border:1px solid rgba(202,210,208,.83); border-radius:19px; background:rgba(255,255,255,.76); box-shadow:inset 0 1px #fff,0 15px 38px rgba(30,44,38,.045); }
.hph-filters { position:relative; display:flex; flex:1 1 750px; align-items:flex-start; align-content:flex-start; flex-wrap:wrap; column-gap:7px; row-gap:14px; padding-block:18px; overflow:visible; }
#hse-project-history .hph-filter { position:relative; display:inline-flex; flex:0 0 auto; justify-content:center; align-items:center; gap:8px; min-height:40px; padding:9px 12px; border:2px solid rgba(188,202,207,.82); border-radius:9px; color:#555D59; background:rgba(243,247,248,.72); font:700 10px/1.3 'Oxanium',sans-serif; letter-spacing:.018em; transition:transform .48s var(--hph-ease),background-color .3s ease,border-color .3s ease,color .3s ease,box-shadow .4s ease; }
.hph-filter span { display:inline-grid; place-items:center; min-width:23px; height:23px; padding:3px 6px; border-radius:6px; background:rgba(87,99,94,.11); color:inherit; font-size:10px; }
#hse-project-history .hph-filter:hover { z-index:1; color:#202622; background:rgba(255,200,74,.18); border-color:rgba(216,155,43,.26); transform:translateY(-2px); }
#hse-project-history .hph-filter:active { transform:translateY(0); }
#hse-project-history .hph-filter.is-active { color:#1C1D18; background:var(--hph-amber); border-color:var(--hph-amber); box-shadow:0 6px 16px rgba(216,155,43,.12),inset 0 1px rgba(255,255,255,.3); }
.hph-filter.is-active span { background:rgba(255,255,255,.46); }
#hse-project-history .hph-filter.is-active:hover { color:#1C1D18; background:rgba(255,200,74,.40); border-color:rgba(255,220,139,.86); box-shadow:inset 0 1px rgba(255,255,255,.75),0 10px 25px rgba(216,155,43,.13); }
#hse-project-history .hph-filter.is-active:active { color:#1C1D18; background:rgba(255,255,255,.94); border-color:rgba(216,155,43,.90); box-shadow:0 0 0 3px rgba(255,200,74,.18),0 0 20px rgba(216,155,43,.18); }
.hph-search { position:relative; display:flex; align-items:center; flex:1 1 250px; max-width:310px; min-height:45px; padding:0 10px 0 15px; border:1px solid #D7DFDC; border-radius:10px; background:#F7F8F7; transition:border-color .3s ease,box-shadow .3s ease,background .3s ease; }
.hph-search:focus-within { background:#fff; border-color:var(--hph-gold); box-shadow:0 0 0 3px rgba(216,155,43,.11); }
.hph-search > .material-symbols-rounded { font-size:20px!important; color:#6E7973; }
#hse-project-history .hph-search input { display:block; min-width:0; width:100%; height:44px; border:0; outline:0!important; box-shadow:none!important; padding:0 7px 0 11px; color:#1B2420; background:transparent; font:500 13px/1.3 'Sulphur Point',sans-serif; }
.hph-search input::placeholder { color:#838C87; }
/* Native browser cancel glyph is redundant beside the branded clear control. */
.hph-search input::-webkit-search-cancel-button,.hph-search input::-webkit-search-decoration,.hph-search input::-webkit-search-results-button,.hph-search input::-webkit-search-results-decoration { -webkit-appearance:none; appearance:none; display:none; }
.hph-search input[type="search"] { appearance:none; -webkit-appearance:none; }
#hse-project-history .hph-search__clear { display:grid; place-items:center; width:28px; height:28px; padding:0; border:1px solid transparent; border-radius:7px; color:#555B58; background:rgba(0,0,0,.045); }
#hse-project-history .hph-search__clear:hover { background:#F7E8C5; color:#111; }
#hse-project-history .hph-search__clear:active { color:#111; border-color:rgba(216,155,43,.96); }
.hph-search__clear .material-symbols-rounded { font-size:17px!important; }
/* Archive control focus is indicated by a soft, rounded glow instead of browser rectangles. */
#hse-project-history .hph-projects :is(a,button,input):focus-visible { outline:0; box-shadow:0 0 0 3px rgba(216,155,43,.27); }
.hph-projects__status { display:flex; justify-content:space-between; gap:12px 20px; flex-wrap:wrap; align-items:center; padding-block:25px 20px; }
.hph-projects__status p { color:#56605B; font:500 14px/1.3 'Sulphur Point',sans-serif; }
.hph-projects__status > span { color:#A0A7A2; font:700 10px/1.4 'Oxanium',sans-serif; letter-spacing:.10em; }
.hph-cards { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:clamp(16px,1.75vw,27px); align-items:stretch; }
.hph-project { min-width:0; height:100%; }
.hph-project__shell { display:flex; flex-direction:column; height:100%; min-height:438px; padding:7px; overflow:hidden; border:1px solid rgba(208,215,213,.94); border-radius:19px; background:rgba(255,255,255,.88); box-shadow:inset 0 1px rgba(255,255,255,.94),0 12px 32px rgba(20,36,31,.046); transform:translate3d(0,0,0); transition:transform .86s var(--hph-ease),border-color .7s ease,background-color .5s ease,box-shadow .9s var(--hph-ease); }
.hph-project:hover .hph-project__shell { transform:translate3d(0,-3px,0); border-color:rgba(255,224,151,.94); box-shadow:inset 0 1px #fff,0 22px 52px rgba(20,30,24,.11),0 0 0 1px rgba(255,228,171,.30); }
.hph-project:active:not(:has(.hph-project__details:active)) .hph-project__shell { transform:translate3d(0,0,0); border-color:rgba(255,220,133,.95); box-shadow:0 0 0 3px rgba(255,200,74,.20),0 0 25px rgba(255,200,74,.23),0 12px 27px rgba(20,30,24,.065); }
/* One identical image slot for every project: fill only src="" to switch from art to photo. */
.hph-project__media { position:relative; height:220px; min-height:220px; overflow:hidden; border-radius:12px; background:linear-gradient(135deg,#FFE4AA,#E9C979); isolation:isolate; }
.hph-project__media > img { display:block; position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center; filter:sepia(.045) saturate(.86) contrast(1.04); transition:transform 1.22s var(--hph-ease),filter 1.2s ease; }
.hph-project__media::after { content:''; position:absolute; z-index:1; inset:0; pointer-events:none; background:linear-gradient(180deg,rgba(5,13,10,.14),transparent 54%,rgba(5,13,10,.4)); }
.hph-project__media-label { position:absolute; bottom:11px; left:12px; z-index:3; padding:7px 9px; border-radius:7px; color:#fff; border:1px solid rgba(255,255,255,.30); background:rgba(17,22,21,.45); -webkit-backdrop-filter:blur(12px); backdrop-filter:blur(12px); font:700 9px/1.25 'Oxanium',sans-serif; letter-spacing:.08em; }
/* Frosted amber graphic remains in every slot but is shown only for an empty/broken image. */
.hph-project__art { position:absolute; inset:0; z-index:0; display:block; overflow:hidden; isolation:isolate; background:linear-gradient(135deg,rgba(255,221,151,.90),rgba(247,205,111,.64) 52%,rgba(235,199,130,.81)); -webkit-backdrop-filter:blur(19px) saturate(135%); backdrop-filter:blur(19px) saturate(135%); visibility:hidden; opacity:0; transition:opacity .35s ease,visibility .35s ease; }
.hph-project__art::before { content:''; position:absolute; z-index:0; width:75%; aspect-ratio:1; top:-61%; right:-8%; border:1px solid rgba(255,255,255,.84); border-radius:24px; transform:rotate(38deg); background:linear-gradient(145deg,rgba(255,255,255,.21),rgba(255,219,141,.13)); box-shadow:inset 0 1px rgba(255,255,255,.40),0 0 0 48px rgba(255,255,255,.05); transition:transform 1.3s var(--hph-ease); }
.hph-project__art-grid { position:absolute; inset:0; z-index:0; opacity:.44; background-image:linear-gradient(rgba(255,255,255,.14) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.14) 1px,transparent 1px); background-size:54px 54px; -webkit-mask-image:linear-gradient(120deg,rgba(0,0,0,.75),transparent 87%); mask-image:linear-gradient(120deg,rgba(0,0,0,.75),transparent 87%); }
.hph-project__media:has(> img[src=""]) .hph-project__art,
.hph-project__media.is-image-empty .hph-project__art,
.hph-project__media.is-image-broken .hph-project__art { opacity:1; visibility:visible; }
#hse-project-history .hph-project__media:has(> img[src=""]) > img,
#hse-project-history .hph-project__media.is-image-empty > img,
#hse-project-history .hph-project__media.is-image-broken > img { display:none; }
.hph-project__media:has(> img[src=""])::after,
.hph-project__media.is-image-empty::after,
.hph-project__media.is-image-broken::after,
.hph-project__media:has(> img[src=""]) .hph-project__media-label,
.hph-project__media.is-image-empty .hph-project__media-label,
.hph-project__media.is-image-broken .hph-project__media-label { display:none; }
.hph-project:hover .hph-project__media > img { transform:scale(1.045); filter:sepia(.035) saturate(.98) contrast(1.025); }
.hph-project:active:not(:has(.hph-project__details:active)) .hph-project__media > img { transform:scale(1); filter:sepia(.045) saturate(.86) contrast(1.04); }
.hph-project:hover .hph-project__art::before { transform:translate(9px,-11px) rotate(38deg); }
.hph-project:active:not(:has(.hph-project__details:active)) .hph-project__art::before { transform:rotate(38deg); }
/* Identical sector icon on photographs and on amber artwork. */
.hph-project__media > .hph-project__art-icon { position:absolute; z-index:4; top:25px; right:24px; display:grid!important; place-items:center; width:58px; height:58px; color:#141512; border-radius:14px; border:1px solid rgba(255,255,255,.84); background:rgba(255,255,255,.28); -webkit-backdrop-filter:blur(12px); backdrop-filter:blur(12px); font-size:31px!important; box-shadow:inset 0 1px rgba(255,255,255,.50); transition:background-color .5s ease,color .4s ease,border-color .45s ease,box-shadow .5s ease; }
.hph-project:hover .hph-project__media > .hph-project__art-icon { color:#141512; background:#fff; border-color:rgba(255,255,255,.95); }
.hph-project:active:not(:has(.hph-project__details:active)) .hph-project__media > .hph-project__art-icon { color:#141512; background:var(--hph-amber); border-color:rgba(255,255,255,.88); box-shadow:0 0 16px rgba(255,200,74,.27); }
.hph-project__body { display:flex; flex:1; flex-direction:column; min-height:196px; padding:clamp(18px,1.65vw,25px) clamp(16px,1.5vw,23px) clamp(15px,1.45vw,22px); }
.hph-project__meta { display:flex; align-items:center; justify-content:space-between; gap:8px 14px; margin-bottom:15px; }
.hph-project__meta > span { color:#B17C20; font:700 clamp(10px,.74vw,11px)/1.4 'Oxanium',sans-serif; text-transform:uppercase; letter-spacing:.055em; }
.hph-project__meta small { color:#969D98; font:700 10px/1.3 'Oxanium',sans-serif; white-space:nowrap; }
.hph-project__body h3 { max-width:100%; font-size:clamp(20px,1.62vw,27px); line-height:1.18; color:#222925; overflow-wrap:anywhere; }
.hph-project__body > p { color:#6D7770; font-size:14px; line-height:1.46; margin-top:12px!important; }
.hph-project__no-description { height:12px; }
 .hph-project__foot { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:auto; padding-top:22px; }
#hse-project-history .hph-project__details { display:inline-flex; align-items:center; justify-content:center; gap:8px; min-height:40px; padding:9px 13px; border:1px solid rgba(188,198,201,.90); border-radius:9px; color:#191D1B; background:rgba(255,255,255,.75); -webkit-backdrop-filter:blur(16px) saturate(125%); backdrop-filter:blur(16px) saturate(125%); box-shadow:inset 0 1px rgba(255,255,255,.92); font:700 10px/1.2 'Oxanium',sans-serif; letter-spacing:.03em; text-transform:uppercase; transform:translate3d(0,0,0); transition:transform .38s var(--hph-ease),border-color .35s ease,background-color .35s ease,color .3s ease,box-shadow .45s ease; }
#hse-project-history .hph-project__details .material-symbols-rounded { color:inherit; font-size:17px!important; transition:transform .45s var(--hph-ease); }
#hse-project-history .hph-project__details:hover { color:#191D1B; background:rgba(255,208,113,.36); border-color:rgba(255,218,139,.75); transform:translateY(-2px); box-shadow:inset 0 1px rgba(255,255,255,.84),0 9px 22px rgba(216,155,43,.12); }
#hse-project-history .hph-project__details:active { color:#191D1B; background:rgba(255,255,255,.96); border-color:rgba(216,155,43,.93); transform:translateY(0); box-shadow:0 0 0 3px rgba(255,200,74,.18),0 0 22px rgba(255,200,74,.27); }
#hse-project-history .hph-project__details:focus { outline:none!important; outline-offset:0; }
#hse-project-history .hph-project__details:focus-visible { outline:none!important; box-shadow:inset 0 1px rgba(255,255,255,.92); background:rgba(255,231,179,.32); }
#hse-project-history .hph-project__shell:focus-within { outline:none!important; }
.hph-project__details:hover .material-symbols-rounded { transform:scale(1.07); }
.hph-project__foot > .hph-project__verified { margin-left:auto; color:#A7B1AA; font-size:20px!important; transition:color .55s ease; }
.hph-project:hover .hph-project__verified { color:var(--hph-gold); }
.hph-load { display:flex; justify-content:center; padding-top:44px; }
.hph-load .hph-btn { min-width:225px; }
#hse-project-history .hph-btn--more { color:#111; background:var(--hph-amber); border-color:#fff; box-shadow:inset 0 1px rgba(255,255,255,.66),0 10px 28px rgba(216,155,43,.18); }
#hse-project-history .hph-btn--more:hover { color:#111; background:#FFF4D7; border-color:var(--hph-gold); }
#hse-project-history .hph-btn--more:active { color:#111; background:#FFF4D7; border-color:var(--hph-gold); }
.hph-empty { padding:70px 24px; margin-top:10px; border:1px solid #E2E7E4; border-radius:18px; background:#fff; text-align:center; }
.hph-empty > .material-symbols-rounded { font-size:39px!important; margin-bottom:18px; color:var(--hph-gold); }
.hph-empty h3 { font-size:clamp(23px,2.6vw,32px); }
.hph-empty p { color:#65716A; margin:11px 0 20px!important; }
 .hph-disclaimer { display:flex; align-items:center; gap:10px; width:100%; max-width:none; margin-top:clamp(44px,5vw,72px); padding:15px 17px; border-block:1px solid rgba(255,255,255,.97); border-radius:999px; color:#778179; background:rgba(255,255,255,.63); -webkit-backdrop-filter:blur(18px) saturate(125%); backdrop-filter:blur(18px) saturate(125%); box-shadow:inset 0 1px rgba(255,255,255,.92),0 8px 22px rgba(20,34,29,.055); }
.hph-disclaimer > .material-symbols-rounded { color:var(--hph-amber); font-size:20px!important; }
.hph-disclaimer p { max-width:none; font-size:13px; line-height:1.55; }

/* 06 | Closing editorial CTA, frosted glass borders, HSE Elements amber */
.hph-contact { position:relative; isolation:isolate; overflow:hidden; padding-block:clamp(70px,7vw,112px); background:linear-gradient(145deg,#EFF1EF,#FBFBFA); }
.hph-contact > .hph-container { position:relative; z-index:2; }
.hph-contact__panel { position:relative; isolation:isolate; display:grid; grid-template-columns:minmax(0,.95fr) minmax(0,1fr); align-items:center; min-height:clamp(390px,32vw,530px); gap:30px clamp(22px,5vw,100px); padding:clamp(45px,5.5vw,88px); overflow:hidden; border:3px solid rgba(255,255,255,.86); border-radius:clamp(19px,2.3vw,33px); color:#fff; background:#171C1C; box-shadow:inset 0 1px rgba(255,255,255,.18),0 25px 64px rgba(15,22,18,.17); transition:border-color .7s ease,box-shadow .85s var(--hph-ease); }
.hph-contact__image { position:absolute; z-index:-3; inset:0; }
.hph-contact__image img {
  position:absolute; top:-32px; left:0; width:100%; height:calc(100% + 64px);
  object-fit:cover; object-position:center 44%;
  translate:0 var(--hph-cta-photo-shift,0px);
  filter:saturate(.75) contrast(1.06);
  transition:transform 1.8s var(--hph-ease);
}
.hph-contact__panel:hover { border-color:rgba(255,220,150,.93); box-shadow:inset 0 1px rgba(255,255,255,.26),0 25px 64px rgba(15,22,18,.19),0 0 0 1px rgba(255,200,74,.19); }
.hph-contact__panel:hover .hph-contact__image img { transform:scale(1.028); }
.hph-contact__panel:active { border-color:rgba(255,220,150,.96); box-shadow:inset 0 1px rgba(255,255,255,.28),0 25px 64px rgba(15,22,18,.16),0 0 0 4px rgba(255,200,74,.40),0 0 53px rgba(216,155,43,.49); }
.hph-contact__panel:active .hph-contact__image img { transform:scale(1); transition-duration:.65s; }
.hph-contact__image::after { content:''; position:absolute; inset:0; background:linear-gradient(90deg,rgba(13,17,17,.91),rgba(13,17,17,.72) 46%,rgba(13,17,17,.80)),linear-gradient(0deg,rgba(0,0,0,.33),transparent 73%); }
/* The diamonds float OUTSIDE the dark CTA card, over the silver section. */
.hph-contact__diamonds { position:absolute; z-index:1; inset:0; pointer-events:none; }
.hph-contact__diamond { position:absolute; aspect-ratio:1; border-radius:clamp(17px,2vw,30px); border:1px solid rgba(255,255,255,.88); background:linear-gradient(135deg,rgba(255,200,74,.51),rgba(255,236,184,.34)); transform:rotate(45deg); box-shadow:inset 0 1px rgba(255,255,255,.66),0 19px 46px rgba(96,101,92,.07); animation:hph-contact-float var(--hph-contact-time,17s) ease-in-out var(--hph-contact-phase,0s) infinite alternate; }
.hph-contact__diamond--one { width:clamp(185px,25vw,365px); left:max(-13%,calc((100% - var(--hph-max))/2 - 95px)); top:-29%; --hph-contact-time:17s; }
.hph-contact__diamond--two { width:clamp(205px,27vw,385px); right:max(0px,calc((100% - var(--hph-max))/2 - 55px)); bottom:-19%; --hph-contact-time:20s; --hph-contact-phase:-8s; background:linear-gradient(135deg,rgba(255,207,103,.44),rgba(255,255,255,.38)); }
@keyframes hph-contact-float { from { transform:translate3d(-7px,12px,0) rotate(45deg); } to { transform:translate3d(11px,-20px,0) rotate(45deg); } }
#hse-project-history .hph-contact .hph-kicker { color:var(--hph-light); }
.hph-contact h2 { max-width:850px; color:#fff; }
.hph-contact h2 em { color:var(--hph-amber); }
.hph-contact__copy,.hph-contact__aside { position:relative; z-index:1; }
.hph-contact__aside { display:flex; flex-direction:column; justify-content:center; padding-bottom:0; }
.hph-contact__aside p { max-width:520px; color:rgba(255,255,255,.81); font-size:clamp(16px,1.3vw,19px); line-height:1.63; }
.hph-contact__actions { display:flex; align-items:center; flex-wrap:nowrap; gap:11px; margin-top:24px; }
.hph-contact__actions .hph-btn { white-space:nowrap; flex:0 1 auto; }

/* 07 | Accessible, responsive project-details glass dialog */
#hse-project-history .hph-dialog { position:fixed; inset:0; margin:auto; padding:0; width:min(92vw,1050px); max-height:min(88dvh,830px); overflow-y:auto; overflow-x:hidden; color:var(--hph-ink); border:1px solid rgba(255,255,255,.91); border-radius:clamp(18px,2.3vw,28px); background:rgba(246,248,247,.97); -webkit-backdrop-filter:blur(30px) saturate(138%); backdrop-filter:blur(30px) saturate(138%); box-shadow:inset 0 1px rgba(255,255,255,.87),0 34px 105px rgba(16,25,23,.29); }
#hse-project-history .hph-dialog::backdrop { background:rgba(18,24,24,.66); -webkit-backdrop-filter:blur(18px) saturate(90%); backdrop-filter:blur(18px) saturate(90%); }
.hph-dialog__layout { display:grid; grid-template-columns:minmax(0,.88fr) minmax(0,1.12fr); min-height:440px; }
.hph-dialog__visual { position:relative; min-width:0; min-height:430px; overflow:hidden; background:linear-gradient(140deg,rgba(255,222,149,.81),rgba(226,233,229,.75)); }
.hph-dialog__visual .hph-project__media { position:absolute; inset:0; width:100%; height:100%; min-height:0; border-radius:0; }
.hph-dialog__visual img { height:100%; object-fit:cover; }
.hph-dialog__visual .hph-project__art::before { top:6%; right:-12%; }
.hph-dialog__visual .hph-project__media > .hph-project__art-icon { top:28px; left:28px; right:auto; }
.hph-dialog__content { min-width:0; padding:clamp(35px,4.2vw,66px) clamp(26px,4.2vw,62px); display:flex; flex-direction:column; justify-content:center; }
#hse-project-history .hph-dialog__eyebrow { margin-bottom:17px; }
.hph-dialog__category { width:fit-content; padding:7px 11px; border:1px solid rgba(216,155,43,.47); border-radius:999px; background:rgba(255,200,74,.22); color:#654D21; font:700 10px/1.3 'Oxanium',sans-serif; letter-spacing:.05em; text-transform:uppercase; }
#hse-project-history .hph-dialog h2 { margin-top:20px; font-size:clamp(28px,3.15vw,48px); line-height:1.08; overflow-wrap:anywhere; }
.hph-dialog__description { margin-top:20px; }
.hph-dialog__description p { color:#4F5C57; font-size:clamp(14px,1.08vw,16px); line-height:1.66; }
.hph-dialog__description p + p { margin-top:13px!important; }
.hph-dialog__note { margin-top:22px!important; color:#858D88; font:500 12px/1.5 'Sulphur Point',sans-serif; }
.hph-dialog__footer { display:flex; align-items:center; gap:10px; margin-top:clamp(22px,3vw,42px); padding-top:18px; border-top:1px solid rgba(41,59,48,.16); color:#727E76; font:700 10px/1.25 'Oxanium',sans-serif; letter-spacing:.075em; }
.hph-dialog__footer .material-symbols-rounded { color:var(--hph-gold); font-size:21px!important; }
#hse-project-history .hph-dialog__close { position:absolute; z-index:8; top:17px; right:17px; margin:0; display:grid; place-items:center; width:39px; height:39px; border:1px solid rgba(200,211,210,.95); border-radius:11px; color:#18201D; background:rgba(255,255,255,.84); -webkit-backdrop-filter:blur(15px); backdrop-filter:blur(15px); box-shadow:0 8px 22px rgba(18,26,25,.08); transition:transform .4s var(--hph-ease),border-color .35s,background-color .35s,box-shadow .35s; }
#hse-project-history .hph-dialog__close:hover { transform:translateY(-2px); border-color:rgba(216,155,43,.69); background:rgba(255,222,150,.80); }
#hse-project-history .hph-dialog__close:active { transform:translateY(0); border-color:var(--hph-gold); background:#fff; box-shadow:0 0 0 3px rgba(255,200,74,.18),0 0 20px rgba(216,155,43,.19); }
#hse-project-history .hph-dialog__close .material-symbols-rounded { font-size:21px!important; }
#hse-project-history .hph-dialog:focus,
#hse-project-history .hph-dialog__close:focus { outline:none!important; outline-offset:0; }
#hse-project-history .hph-dialog__close:focus-visible { outline:none!important; box-shadow:0 8px 22px rgba(18,26,25,.08); }

/* 08 | Once-only reveals. Translate is independent of cards' hover transforms. */
.hph--reveal-ready .hph-reveal:not(.is-hph-visible) { opacity:0; translate:0 23px; }
.hph--reveal-ready .hph-reveal { transition:opacity .9s var(--hph-ease),translate .9s var(--hph-ease); transition-delay:var(--hph-reveal-delay,0ms); }
.hph--reveal-ready .hph-reveal.is-hph-visible { opacity:1; translate:0 0; }

/* 09 | Laptop / tablet */
@media (max-width:1250px) {
  .hph-hero__layout { grid-template-columns:minmax(0,1fr) minmax(0,.92fr); gap:30px; }
  .hph-hero h1 { font-size:clamp(50px,5.1vw,73px); }
  .hph-hero__atlas { min-height:510px; }
  .hph-hero__frame--one { top:11%; width:59%; }
  .hph-hero__frame--two { top:20%; width:62%; }
  .hph-hero__frame--three { bottom:2%; width:57%; }
  .hph-project__body h3 { font-size:clamp(19px,1.9vw,25px); }
  .hph-sector-line { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .hph-contact__panel { grid-template-columns:1.1fr .9fr; gap:28px; }
}
@media (max-width:980px) {
  .hph-hero { min-height:0; }
  .hph-hero__layout { grid-template-columns:1fr; padding-top:clamp(155px,17vw,220px); padding-bottom:128px; }
  .hph-hero__copy { max-width:800px; }
  .hph-hero h1 { font-size:clamp(52px,7.4vw,80px); }
  .hph-hero__lead { max-width:730px; }
  .hph-hero__legend { padding-top:30px; }
  .hph-hero__atlas { width:min(100%,680px); min-height:600px; margin:clamp(117px,15vw,150px) auto 0; }
  .hph-intro__heading { grid-template-columns:1fr; gap:22px; }
  .hph-intro__copy { max-width:800px; }
  .hph-cards { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .hph-projects__intro { align-items:start; flex-direction:column; }
  .hph-dialog__layout { grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); }
  .hph-dialog__visual { min-height:360px; }
  .hph-projects__intro > p { max-width:750px; }
  .hph-toolbar { align-items:stretch; }
  .hph-filters { flex:1 1 100%; }
  .hph-search { max-width:100%; flex:1 1 100%; }
  .hph-contact__panel { grid-template-columns:1fr; align-items:center; }
  .hph-contact__aside { max-width:680px; }
}
@media (max-width:630px) {
  .hph-section { padding-block:clamp(72px,16vw,94px); }
  .hph-hero__layout { padding-top:clamp(140px,30vw,177px); padding-bottom:105px; }
  .hph-hero h1 { font-size:clamp(42px,10.7vw,61px); }
  .hph-hero__lead { font-size:16px; line-height:1.57; }
  .hph-hero__actions { gap:10px; }
  #hse-project-history .hph-hero__actions .hph-btn { min-height:45px; padding:11px 13px; font-size:10px; gap:9px; }
  #hse-project-history .hph-hero__actions .hph-btn > .material-symbols-rounded { font-size:17px!important; }
  .hph-hero__legend { gap:10px 13px; }
  .hph-hero__legend > span { font-size:9px; }
  .hph-hero__atlas { min-height:clamp(365px,97vw,510px); margin:clamp(80px,21vw,106px) auto 0; }
  .hph-hero__frame { padding:3px; border-radius:12px; }
  .hph-hero__frame img,.hph-hero__frame::after { border-radius:9px; }
  .hph-hero__frame::after { inset:3px; }
  .hph-hero__frame--one { left:0; top:6%; width:59%; height:45%; }
  .hph-hero__frame--two { right:0; top:15%; width:63%; height:62%; }
  .hph-hero__frame--three { left:4%; bottom:4%; width:58%; height:45%; }
  .hph-hero__frame-head { left:7px; top:7px; gap:5px; padding:5px 6px; border-radius:5px; }
  .hph-hero__frame-head small { font-size:7px; letter-spacing:0; }
  .hph-hero__atlas-stamp { right:1%; bottom:-5%; padding:10px 11px; border-radius:8px; font-size:7px; gap:6px; }
  .hph-hero__atlas-stamp .material-symbols-rounded { font-size:20px!important; }
  .hph-intro h2,#hse-project-history h2 { font-size:clamp(34px,8vw,48px); }
  .hph-intro__copy p,.hph-intro__lead-paragraph { font-size:16px; }
  .hph-sector-line { grid-template-columns:1fr; gap:9px; }
  .hph-sector-line__item { min-height:72px; padding:13px 15px; grid-template-columns:38px minmax(0,1fr) 18px; }
  .hph-toolbar { padding:18px 14px; gap:14px; }
  .hph-filters { column-gap:6px; row-gap:14px; padding-block:19px; }
  #hse-project-history .hph-filter { min-height:37px; padding:8px 10px; font-size:9px; }
  .hph-cards { grid-template-columns:1fr; gap:16px; }
  .hph-project__shell { min-height:412px; }
  .hph-project__media,.hph-project__art { height:210px; min-height:210px; }
  .hph-project__body h3 { font-size:clamp(22px,5.4vw,27px); }
  .hph-project__body { min-height:188px; padding:19px 18px 17px; }
  .hph-projects__status { padding-block:20px 17px; }
  .hph-projects__status > span { font-size:9px; }
  .hph-contact { padding-block:55px; }
  .hph-contact__panel { padding:clamp(31px,7vw,50px) 23px; min-height:420px; border-radius:19px; }
  .hph-contact h2 { font-size:clamp(36px,8vw,48px); }
  .hph-contact__actions { width:100%; flex-direction:row; align-items:stretch; gap:8px; }
  .hph-contact__actions .hph-btn { flex:0 0 auto; min-width:0; white-space:nowrap; }
  #hse-project-history .hph-contact__actions .hph-btn { min-height:42px; padding:10px 9px; font-size:clamp(7px,2vw,10px); gap:6px; }
  #hse-project-history .hph-contact__actions .hph-btn > .material-symbols-rounded { font-size:clamp(13px,3.4vw,17px)!important; }
  #hse-project-history .hph-dialog { width:min(94vw,620px); max-height:89dvh; }
  .hph-dialog__layout { grid-template-columns:1fr; }
  .hph-dialog__visual { height:clamp(190px,48vw,270px); min-height:0; }
  .hph-dialog__content { padding:28px 23px 34px; }
  .hph-disclaimer { align-items:flex-start; }
}
@media (max-width:390px) {
  #hse-project-history .hph-hero__actions .hph-btn { font-size:9px; padding-inline:11px; gap:6px; }
  .hph-hero__atlas { min-height:365px; }
  .hph-hero__frame-head small { font-size:6px; }
  #hse-project-history .hph-contact__actions .hph-btn { padding-inline:7px; font-size:7px; gap:5px; }
  .hph-hero__atlas-stamp { bottom:-4%; }
}
@media (hover:none) {
  .hph-hero__frame:hover:not(:active) { box-shadow:0 19px 45px rgba(0,0,0,.32); }
  .hph-hero__frame:hover:not(:active) img,.hph-project:hover:not(:active) .hph-project__media > img,.hph-contact__panel:hover:not(:active) .hph-contact__image img { transform:none; }
  .hph-project:hover:not(:active) .hph-project__shell { transform:none; }
}
@media (prefers-reduced-motion:reduce) {
  #hse-project-history *,#hse-project-history *::before,#hse-project-history *::after { animation-duration:.01ms!important; animation-iteration-count:1!important; transition-duration:.01ms!important; scroll-behavior:auto!important; }
  .hph--reveal-ready .hph-reveal { opacity:1!important; translate:0 0!important; }
  .hph-hero h1 em { background-size:100% 21%; }
}