/* Antonyan Project: additions on top of site.css
   welcome opening, before/after comparisons, project pages with floating images,
   Journal, Visit section with the Yerevan plan, live maps, former colleagues. */

/* ---------- Welcome (light headline, side note, wide image) ---------- */
.welcome{padding-top:clamp(40px,8vw,120px)}
.welcome-head{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:clamp(28px,6vw,110px);align-items:end;margin-bottom:clamp(32px,4.5vw,60px)}
.welcome-h{font-family:var(--sans);font-weight:280;font-size:clamp(40px,5.2vw,82px);line-height:1.04;letter-spacing:-.03em;color:var(--ink);margin:0;max-width:12ch;text-wrap:balance;animation:apUp 1.1s var(--ease) both}
:lang(hy) .welcome-h,:lang(ru) .welcome-h{max-width:16ch;font-size:clamp(32px,4.2vw,64px);letter-spacing:-.015em}
.welcome-side{max-width:480px;padding-bottom:8px;animation:apUp 1.1s var(--ease) .15s both}
.welcome-name{font-size:14px;font-weight:600;color:var(--ink);margin:0 0 12px}
.welcome-p{font-size:15.5px;line-height:1.65;color:var(--grey);margin:0 0 22px}
.welcome-actions{display:flex;flex-wrap:wrap;gap:10px}
.welcome-media{position:relative;aspect-ratio:16/8.2;overflow:hidden;background:var(--stone)}
.welcome-media .slide-cap{left:clamp(18px,2.4vw,32px);bottom:clamp(18px,2.4vw,30px)}
.welcome-media .hero-dots{right:clamp(18px,2.4vw,32px);bottom:clamp(20px,2.6vw,32px);left:auto}
@keyframes apUp{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@media (max-width:900px){.welcome-head{grid-template-columns:minmax(0,1fr);align-items:start;gap:22px}}
@media (max-width:760px){
  .welcome{padding-top:32px}
  .welcome-h{font-size:clamp(34px,10vw,46px)}
  :lang(hy) .welcome-h{font-size:clamp(26px,7.8vw,36px)}
  .welcome-media{aspect-ratio:4/5;width:100vw;margin-left:calc(50% - 50vw)}
  .welcome-media .hero-dots{top:16px;bottom:auto}
}

/* ---------- Before / after comparisons ---------- */
.ba-sec{padding:clamp(56px,7vw,104px) 0}
.ba-wrap{position:relative;margin-top:clamp(24px,3vw,44px)}
.ba-rail{list-style:none;margin:0;padding:0 var(--gutter);display:flex;gap:clamp(14px,1.8vw,24px);overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding:0 var(--gutter);scrollbar-width:none}
.ba-rail::-webkit-scrollbar{display:none}
@media (min-width:1440px){.ba-rail{padding-left:calc((100vw - var(--max))/2 + var(--gutter));scroll-padding-left:calc((100vw - var(--max))/2 + var(--gutter))}}
.ba-item{flex:0 0 min(1000px,86vw);scroll-snap-align:start}
.ba{margin:0}
.ba-img{position:relative;aspect-ratio:3/2;overflow:hidden;background:var(--stone);--p:50%;user-select:none;-webkit-user-select:none;cursor:ew-resize;touch-action:pan-y}
.ba-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;pointer-events:none}
.ba-before{position:absolute;inset:0;clip-path:inset(0 calc(100% - var(--p)) 0 0)}
.ba-line{position:absolute;top:0;bottom:0;left:var(--p);width:2px;margin-left:-1px;background:#fff;pointer-events:none}
.ba-knob{position:absolute;top:50%;left:50%;width:54px;height:54px;margin:-27px 0 0 -27px;border-radius:50%;background:rgba(255,255,255,.75);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;font-size:24px;color:var(--ink);box-shadow:0 4px 18px rgba(0,0,0,.14)}
.ba-tag{position:absolute;top:14px;padding:6px 12px;font-size:12.5px;color:var(--ink);background:rgba(255,255,255,.82);border-radius:4px;pointer-events:none}
.ba-l{left:14px}.ba-r{right:14px}
.ba-range{position:absolute;left:0;bottom:0;width:100%;height:1px;margin:0;opacity:0;pointer-events:none}
.ba-img:has(.ba-range:focus-visible) .ba-knob{outline:2px solid var(--ocean);outline-offset:3px}
.ba figcaption{display:flex;flex-wrap:wrap;gap:4px 16px;align-items:baseline;padding-top:14px;font-size:14.5px}
.ba figcaption b{font-weight:500;color:var(--ink)}
.ba figcaption span{color:var(--grey)}
.ba-nav{display:flex;justify-content:flex-end;gap:10px;margin-top:18px}
.ba-nav button{width:48px;height:48px;border:1px solid var(--ink);background:none;color:var(--ink);font-size:18px;cursor:pointer;transition:background .2s,color .2s}
.ba-nav button:hover{background:var(--ink);color:#fff}
.ba-nav button:disabled{opacity:.3;cursor:default;background:none;color:var(--ink)}

/* ---------- Project pages: plain facts, floating images and drawings ---------- */
.pj-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:clamp(28px,6vw,110px);padding:clamp(16px,2.6vw,36px) 0 clamp(40px,6vw,90px);align-items:start}
.pj-title{font-family:var(--sans);font-weight:500;font-size:clamp(30px,3.4vw,52px);line-height:1.05;letter-spacing:-.025em;margin:6px 0 clamp(20px,2.4vw,32px);color:var(--ink)}
.pj-facts{margin:0;display:grid;gap:8px;font-size:15px}
.pj-facts div{display:flex;gap:6px;flex-wrap:wrap}
.pj-facts dt{color:var(--grey)}.pj-facts dt::after{content:":"}
.pj-facts dd{margin:0;color:var(--ink)}
.pj-text .summary{font-size:clamp(19px,1.6vw,24px);line-height:1.4;letter-spacing:-.01em;color:var(--ink);margin:0 0 20px}
.pj-text .prose p{color:var(--grey);font-size:15.5px;line-height:1.7;margin:0 0 14px;max-width:62ch}
.float{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:clamp(16px,3vw,48px);row-gap:clamp(56px,8vw,140px);align-items:start;padding-bottom:clamp(60px,8vw,120px)}
.fl{margin:0;cursor:zoom-in;position:relative}
.fl-in{will-change:transform}
.fl img{display:block;width:100%;height:auto;transition:transform .7s var(--ease),filter .5s}
.fl.photo:hover img{transform:scale(1.015)}
.fl.drawing img{mix-blend-mode:multiply}
.fl figcaption{margin-top:10px;font-size:12px;letter-spacing:.08em;color:var(--grey);opacity:0;transition:opacity .35s}
.fl:hover figcaption,.fl:focus-visible figcaption{opacity:1}
.fl:focus-visible{outline:2px solid var(--ink);outline-offset:6px}
.fl-0{grid-column:1/span 7}
.fl-1{grid-column:8/span 5;margin-top:22%}
.fl-2{grid-column:3/span 5}
.fl-3{grid-column:8/span 5;margin-top:34%}
.fl-4{grid-column:1/span 5;margin-top:6%}
.fl-5{grid-column:6/span 7}
.fl-solo{grid-column:2/span 10;margin-top:0}
.ap-js .fl{opacity:0;transform:translateY(48px);transition:opacity 1s var(--ease),transform 1.1s var(--ease)}
.ap-js .fl.shown{opacity:1;transform:none}
@media (max-width:900px){.pj-head{grid-template-columns:minmax(0,1fr);gap:24px}}
@media (max-width:760px){
  .float{grid-template-columns:minmax(0,1fr);row-gap:44px}
  .fl,.fl-solo{grid-column:1/-1;margin-top:0}
  .fl-1,.fl-3{width:84%;margin-left:auto}
  .fl-2,.fl-4{width:90%}
  .fl figcaption{opacity:1}
}

/* ---------- Journal ---------- */
.jr-grid{columns:3 320px;column-gap:clamp(18px,2.4vw,36px)}
.jr-grid .jr{break-inside:avoid;margin-bottom:clamp(28px,3.4vw,48px)}
.jr-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(14px,2vw,28px);margin:clamp(24px,3vw,40px) 0}
.jr-row .jr-cap{-webkit-line-clamp:3}
.jr{display:flex;flex-direction:column}
.jr-media{position:relative;background:var(--stone);overflow:hidden}
.jr-track{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}
.jr-track::-webkit-scrollbar{display:none}
.jr-fig{flex:0 0 100%;margin:0;scroll-snap-align:start;position:relative}
.jr-fig img,.jr-fig video{display:block;width:100%;height:auto;background:var(--stone)}
.jr-row .jr-fig img,.jr-row .jr-fig video{aspect-ratio:4/5;object-fit:cover}
.jr-nav{position:absolute;left:10px;right:10px;bottom:10px;display:flex;align-items:center;justify-content:space-between;pointer-events:none}
.jr-nav button{pointer-events:auto;width:34px;height:34px;border:0;border-radius:50%;background:rgba(255,255,255,.85);color:var(--ink);font-size:15px;cursor:pointer;opacity:0;transition:opacity .25s}
.jr-media:hover .jr-nav button,.jr-nav button:focus-visible{opacity:1}
@media (hover:none){.jr-nav button{opacity:1}}
.jr-count{font-size:12px;padding:4px 9px;border-radius:20px;background:rgba(14,17,19,.55);color:#fff}
.jr-count b{font-weight:500}
.jr-tag{position:absolute;top:10px;left:10px;font-size:11.5px;letter-spacing:.06em;text-transform:uppercase;padding:4px 9px;background:rgba(255,255,255,.88);color:var(--ink)}
.jr-sound{position:absolute;right:10px;top:10px;width:36px;height:36px;border:0;border-radius:50%;background:rgba(14,17,19,.55);color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer}
.jr-sound .jr-wave{opacity:.25}.jr-sound[aria-pressed="true"] .jr-wave{opacity:1}
.jr-body{padding-top:14px}
.jr-body time{display:block;font-size:12px;letter-spacing:.08em;color:var(--grey);margin-bottom:8px}
.jr-cap{font-size:14.5px;line-height:1.6;color:var(--ink);display:-webkit-box;-webkit-line-clamp:5;-webkit-box-orient:vertical;overflow:hidden}
.jr-cap p{margin:0 0 10px}
.jr-cap.open{display:block;-webkit-line-clamp:unset}
.jr-more{display:block;background:none;border:0;padding:0;margin:2px 0 8px;font-size:13px;color:var(--grey);text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.jr-link{display:inline-flex;gap:8px;align-items:center;font-size:13px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink);border-bottom:1px solid var(--ink);padding-bottom:3px;margin-top:6px;align-self:flex-start;text-decoration:none}
@media (max-width:1000px){.jr-row{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.jr-row{grid-template-columns:minmax(0,1fr)}.jr-row .jr:nth-child(n+3){display:none}}

/* ---------- Visit: architectural plan of Yerevan ---------- */
.visit-grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(32px,6vw,100px);align-items:center}
.visit-addr{font-size:17px;line-height:1.55;color:var(--ink);margin:22px 0 26px}
.visit-links{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:22px}
.visit-links .btn{white-space:normal;text-align:center}
.visit-plan{display:block;color:var(--ink);border:1px solid var(--line);background:var(--paper);transition:border-color .3s}
.visit-plan:hover{border-color:var(--ink)}
.plan{display:block;width:100%;height:auto;font-family:var(--sans)}
.plan .pl-pulse{transform-origin:466px 140px;animation:plPulse 2.6s ease-out infinite}
@keyframes plPulse{0%{transform:scale(.6);opacity:.9}100%{transform:scale(2.4);opacity:0}}
.ap-js .plan .pl-draw{stroke-dasharray:var(--len,600);stroke-dashoffset:var(--len,600);transition:stroke-dashoffset 2.2s var(--ease)}
.ap-js .plan.drawn .pl-draw{stroke-dashoffset:0}
.plan .pl-blocks,.plan .pl-labels,.plan .pl-pin{transition:opacity 1s .9s}
.ap-js .plan:not(.drawn) .pl-blocks,.ap-js .plan:not(.drawn) .pl-labels,.ap-js .plan:not(.drawn) .pl-pin{opacity:0}
@media (max-width:900px){.visit-grid{grid-template-columns:minmax(0,1fr)}}

/* ---------- Live map: Google or Yandex, directions and route links ---------- */
.locate{margin-top:28px}
.locate .lmap{position:relative;aspect-ratio:4/3;background:var(--paper);border:1px solid var(--line);overflow:hidden;display:flex;align-items:flex-end;justify-content:center}
.locate .lmap iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.map-plan{position:absolute;inset:0;width:100%;height:100%;color:var(--ink);opacity:.9}
.map-gate{position:relative;z-index:1;background:rgba(255,255,255,.94);border:1px solid var(--line);padding:20px 22px;margin:0 16px 6%;max-width:360px;text-align:center}
.map-gate p{margin:0 0 12px;font-size:14px;color:var(--grey)}
.map-gate .map-addr{font-size:16px;color:var(--ink);font-weight:500;margin-bottom:6px}
.map-btns{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}
.map-btns .btn{padding:10px 16px;font-size:13px}
.map-tabs{display:flex;margin-top:10px;border:1px solid var(--line);width:max-content}
.map-tabs[hidden]{display:none}
.map-tabs button{background:none;border:0;padding:8px 16px;font-size:13px;color:var(--grey);cursor:pointer}
.map-tabs button[aria-pressed="true"]{background:var(--ink);color:#fff}
.map-links{list-style:none;margin:16px 0 0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.map-links a{display:flex;justify-content:space-between;align-items:baseline;gap:10px;padding:12px 14px;border:1px solid var(--line);color:var(--ink);text-decoration:none;transition:background .2s,color .2s,border-color .2s}
.map-links a:hover{background:var(--ink);color:#fff;border-color:var(--ink)}
.map-links b{font-weight:500;font-size:14px}.map-links span{font-size:12.5px;opacity:.65}
.foot-maps{font-size:13px}

/* ---------- Former colleagues ---------- */
.former{margin-top:clamp(56px,7vw,96px);padding-top:clamp(28px,3vw,40px);border-top:1px solid var(--line)}
.former-k{font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--grey);margin:0}
.former-note{color:var(--grey);font-size:15px;margin:6px 0 24px;max-width:56ch}
.is-former img{filter:grayscale(1) contrast(.9);opacity:.6;transition:opacity .5s}
.is-former:hover img{opacity:.8}
.is-former h3,.is-former .role,.is-former p{color:var(--grey)!important}

@media (prefers-reduced-motion:reduce){
  .welcome-h,.welcome-side,.plan .pl-pulse{animation:none}
  .ap-js .fl{opacity:1;transform:none;transition:none}
}
.welcome-media .slide-cap{right:auto;align-items:flex-start;text-align:left;max-width:60%}
.welcome-media .slide::after{background:linear-gradient(to top,rgba(14,17,19,.5) 0%,rgba(14,17,19,0) 40%)}

/* Projects in black and white. Colour and a slow, light zoom come in on hover,
   and ease back out when the pointer leaves. On touch screens the image in the
   middle of the screen takes its colour instead. */
.card-img img,.row-thumb img,.fl.photo img,.pn-next img{
  filter:grayscale(1) contrast(1.04);
  transition:filter .9s var(--ease),transform 1.4s cubic-bezier(.22,.61,.36,1),opacity .5s var(--ease)!important}
.fl-in{overflow:hidden}
@media (hover:hover){
  .card:hover .card-img img,.card:focus-visible .card-img img,
  .row:hover .row-thumb img,.row:focus-visible .row-thumb img,
  .fl.photo:hover img,.fl.photo:focus-visible img{filter:grayscale(0) contrast(1);transform:scale(1.015)}
  .pn-next:hover img,.pn-next:focus-visible img{filter:grayscale(0) contrast(1);transform:none}
}
.card-img img.in-colour,.fl.photo img.in-colour{filter:grayscale(0) contrast(1)}
@media (prefers-reduced-motion:reduce){
  .card-img img,.row-thumb img,.fl.photo img,.pn-next img{transition:filter .4s!important;transform:none!important}
}

/* Homepage slideshow: a calmer height, and the project name large and white over the picture */
.welcome-media{aspect-ratio:16/6.6;max-height:64vh}
.welcome-media .slide-cap b{font-family:var(--sans);font-weight:400;font-size:clamp(28px,3.6vw,56px);line-height:1.05;letter-spacing:-.02em;color:#fff;margin-bottom:8px;text-shadow:0 1px 24px rgba(0,0,0,.25)}
.welcome-media .slide-cap span{color:rgba(255,255,255,.88);font-size:14px}
.welcome-media .slide::after{background:linear-gradient(to top,rgba(14,17,19,.55) 0%,rgba(14,17,19,0) 50%)}
.welcome-media .slide-cap{display:flex}
@media (max-width:760px){.welcome-media{aspect-ratio:4/4.4;max-height:none}.welcome-media .slide-cap{max-width:85%}.welcome-media .slide-cap b{font-size:30px}}

/* Refined palette: black for actions, a much deeper ocean only for small accents */
:root{--ocean:#0f2a33;--ocean-2:#1f3d48}
.btn,.nav-cta{background:var(--ink)!important;border-color:var(--ink)!important;color:#fff!important;letter-spacing:.08em}
.btn:hover,.nav-cta:hover{background:#fff!important;color:var(--ink)!important}
.btn .arr{transition:transform .35s var(--ease)}
.btn:hover .arr{transform:translateX(5px)}

/* Closing call to action: white page, oversized type, a hairline that draws across */
.hs-cta{background:var(--paper);color:var(--ink);border-top:1px solid var(--line);position:relative;overflow:hidden;padding:clamp(88px,11vw,170px) 0}
.hs-cta::before{content:"";position:absolute;left:var(--gutter);right:var(--gutter);top:clamp(44px,5.5vw,84px);height:1px;background:var(--ink);transform:scaleX(0);transform-origin:left;transition:transform 1.4s var(--ease)}
.hs-cta.ap-in::before{transform:scaleX(1)}
.hs-cta h2{font-weight:300;font-size:clamp(44px,7vw,116px);line-height:.98;letter-spacing:-.04em;max-width:14ch;color:var(--ink)}
.hs-cta p{color:var(--grey);font-size:clamp(16px,1.3vw,19px)}
.hs-cta .btn{background:var(--ink)!important;color:#fff!important;border-color:var(--ink)!important}
.hs-cta .btn:hover{background:transparent!important;color:var(--ink)!important}
.hs-cta-mail{color:var(--ink);border-bottom-color:rgba(14,17,19,.3)}
.hs-cta-mail:hover{border-color:var(--ink)}
@media (prefers-reduced-motion:reduce){.hs-cta::before{transform:none;transition:none}}

/* Logo mark 1.25 times larger */
.brand-mark{width:68px}
@media (max-width:1200px){.brand-mark{width:52px}}
@media (min-width:1201px) and (max-width:1520px){:lang(hy) .brand-mark{width:55px}}
@media (max-width:420px){.brand-mark{width:45px}}

/* Page titles: smaller, still clearly the headline */
.ah-title{font-size:clamp(30px,3.3vw,50px);line-height:1.1}
@media (max-width:600px){.ah-title{font-size:clamp(26px,7.4vw,32px)}:lang(hy) .ah-title{font-size:clamp(22px,6.4vw,28px)}}

/* ---------- Structure explorer (Services) ---------- */
.st-head{max-width:760px;margin-bottom:clamp(28px,3.5vw,48px)}
.st-head .lead{margin-top:20px}
.st-tabs{display:flex;gap:0;border-top:1px solid var(--ink);border-bottom:1px solid var(--line);overflow-x:auto;scrollbar-width:none}
.st-tabs::-webkit-scrollbar{display:none}
.st-tab{flex:1 0 auto;background:none;border:0;padding:16px 22px 16px 0;margin-right:22px;text-align:left;font-size:15px;color:var(--grey);cursor:pointer;position:relative;white-space:nowrap;display:flex;gap:10px;align-items:baseline;transition:color .25s}
.st-tab span{font-size:11px;letter-spacing:.12em;color:var(--grey-2);font-feature-settings:"tnum"}
.st-tab::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:var(--ink);transform:scaleX(0);transform-origin:left;transition:transform .45s var(--ease)}
.st-tab:hover,.st-tab[aria-selected="true"]{color:var(--ink)}
.st-tab[aria-selected="true"]::after{transform:scaleX(1)}
.st-body{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(0,1fr);gap:clamp(24px,4vw,64px);margin-top:clamp(20px,2.5vw,32px);align-items:start}
.st-fig{margin:0}
.st-stage{position:relative;background:var(--bone);border:1px solid var(--line);cursor:grab;touch-action:pan-y;outline-offset:4px;
  background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);background-size:32px 32px;background-position:-1px -1px}
.st-stage.grab{cursor:grabbing}
.st-svg{display:block;width:100%;height:auto;user-select:none}
.st-svg path{fill:none;transition:opacity .3s}
.st-found{fill:#8a8f94!important;fill-opacity:.28;stroke:#5f6469;stroke-width:.7}
.st-col{stroke:var(--ink);stroke-width:1.5;stroke-linecap:round}
.st-beam{stroke:var(--ink);stroke-width:.75;stroke-opacity:.7}
.st-slab{fill:var(--ocean)!important;fill-opacity:.05;stroke:var(--ocean-2);stroke-width:.5;stroke-opacity:.45}
.st-core{fill:var(--ink)!important;fill-opacity:.1;stroke:var(--ink);stroke-width:.9}
.st-brace{stroke:#a1302b;stroke-width:.9;stroke-dasharray:4 3}
.st-roof{stroke:var(--ocean-2);stroke-width:.8}
.st-svg[data-focus] path{opacity:.12}
.st-svg[data-focus="found"] .st-found,.st-svg[data-focus="col"] .st-col,.st-svg[data-focus="beam"] .st-beam,.st-svg[data-focus="slab"] .st-slab,
.st-svg[data-focus="core"] .st-core,.st-svg[data-focus="brace"] .st-brace,.st-svg[data-focus="roof"] .st-roof{opacity:1}
.st-hint{position:absolute;left:16px;bottom:12px;margin:0;font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--grey);pointer-events:none;transition:opacity .5s}
.st-used .st-hint{opacity:0}
.st:not(.st-ready) .st-stage,.st:not(.st-ready) .st-bar{display:none}
.st-bar{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px 28px;padding:14px 0 0}
.st-views,.st-layers{display:flex;flex-wrap:wrap;gap:6px}
.st-view,.st-layer{background:none;border:1px solid var(--line);padding:7px 12px;font-size:12.5px;color:var(--grey);cursor:pointer;transition:color .2s,border-color .2s,background .2s}
.st-view:hover,.st-layer:hover{color:var(--ink);border-color:var(--ink)}
.st-view[aria-pressed="true"]{background:var(--ink);color:#fff;border-color:var(--ink)}
.st-layer{display:inline-flex;align-items:center;gap:8px}
.st-layer i{width:14px;height:0;border-top:2px solid var(--ink)}
.st-layer[data-layer="found"] i{border-top:6px solid #b9bcbf}
.st-layer[data-layer="slab"] i{border-top:6px solid #dde3e5}
.st-layer[data-layer="core"] i{border-top:6px solid #c9cacb}
.st-layer[data-layer="brace"] i{border-top:2px dashed #a1302b}
.st-layer[data-layer="roof"] i{border-top-color:var(--ocean-2)}
.st-layer[data-layer="beam"] i{border-top-width:1px}
.st-layer[aria-pressed="false"]{opacity:.45;text-decoration:line-through}
.st-fig figcaption{margin-top:14px;font-size:12.5px;color:var(--grey)}
.st-panel{animation:apUp .6s var(--ease) both}
.st-kicker{margin:0 0 10px;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--grey)}
.st-panel h3{margin:0 0 16px;font-weight:400;font-size:clamp(24px,2.2vw,32px);line-height:1.12;letter-spacing:-.02em}
.st-panel>p:not(.st-kicker){margin:0 0 24px;color:var(--ink-2);font-size:16px;line-height:1.65}
.st-panel dl{margin:0 0 28px;border-top:1px solid var(--line)}
.st-panel dl div{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.3fr);gap:16px;padding:11px 0;border-bottom:1px solid var(--line);font-size:14.5px}
.st-panel dt{color:var(--grey)}
.st-panel dd{margin:0;color:var(--ink)}
.st-proj{display:flex;align-items:center;gap:16px;font-size:14px;font-weight:500;color:var(--ink)}
.st-proj img{width:120px;height:80px;object-fit:cover;filter:grayscale(1);transition:filter .6s var(--ease)}
.st-proj:hover img{filter:none}
.st-proj:hover>span{text-decoration:underline;text-underline-offset:4px}
@media (max-width:980px){.st-body{grid-template-columns:minmax(0,1fr)}}
@media (max-width:600px){.st-tab{font-size:14px;margin-right:16px}.st-bar{flex-direction:column}.st-layer,.st-view{font-size:12px;padding:6px 10px}.st-stage{background-size:24px 24px}}

/* Contact quick list: six items in two rows on wide screens */
.ct-quick{grid-template-columns:repeat(3,minmax(0,1fr))}
.ct-quick li:nth-child(3n+1) a{padding-left:0}
.ct-quick li:nth-child(3n+1){border-left:0}
.ct-quick li:nth-child(n+4){border-top:1px solid var(--line)}
@media (max-width:900px){.ct-quick{grid-template-columns:repeat(2,minmax(0,1fr))}.ct-quick li:nth-child(3n+1) a{padding-left:24px}.ct-quick li:nth-child(odd) a{padding-left:0}.ct-quick li{border-left:0!important}.ct-quick li:nth-child(even){border-left:1px solid var(--line)!important}.ct-quick li:nth-child(n+3){border-top:1px solid var(--line)}}
@media (max-width:600px){.ct-quick{grid-template-columns:minmax(0,1fr)}.ct-quick li{border-left:0!important;border-top:1px solid var(--line)}.ct-quick li:first-child{border-top:0}.ct-quick li a,.ct-quick li:nth-child(odd) a{padding-left:0}}

/* ---------- Opening curtain (home page, once per visit) ---------- */
.intro{position:fixed;inset:0;z-index:9999;background:radial-gradient(120% 70% at 50% 0%,#1d2a25 0%,#0b0d0e 62%);color:#fff;display:flex;align-items:center;justify-content:center;overflow:hidden;
  animation:introLift .75s cubic-bezier(.76,0,.24,1) 2.25s forwards;cursor:pointer}
.intro-in{position:relative;display:flex;flex-direction:column;align-items:center;gap:22px;text-align:center;padding:0 24px}
.intro-mark{width:clamp(96px,11vw,150px);height:auto;filter:brightness(1.9) contrast(1.05);overflow:visible}
.im{opacity:0;animation:imIn .8s var(--ease) forwards}
.im0{--x:-40px;--y:0;animation-delay:.1s}.im1{--x:60px;--y:0;animation-delay:.2s}.im2{--x:-70px;--y:30px;animation-delay:.3s}.im3{--x:0;--y:50px;animation-delay:.4s}.im4{--x:30px;--y:-50px;animation-delay:.5s}
@keyframes imIn{from{opacity:0;transform:translate(var(--x),var(--y))}to{opacity:1;transform:none}}
.intro-mark{animation:imBreath 1.6s ease-in-out .9s 1}
@keyframes imBreath{50%{transform:scale(1.045)}}
.intro-word{margin:0;font-weight:500;font-size:clamp(22px,3.4vw,46px);letter-spacing:.34em;text-indent:.34em;white-space:nowrap}
.intro-word span{display:inline-block;opacity:0;transform:translateY(.5em);animation:introIn .55s var(--ease) calc(.7s + var(--i) * .03s) forwards}
.intro-sub{margin:0;font-size:clamp(10px,1vw,13px);letter-spacing:.24em;text-transform:uppercase;color:rgba(255,255,255,.62);opacity:0;animation:introIn .6s var(--ease) 1.35s forwards}
@keyframes introIn{to{opacity:1;transform:none}}
/* Landscape and building outlines, in grey and only just visible. They draw in turn and swap. */
.intro-forms{position:absolute;left:0;right:0;bottom:0;width:100%;height:78%;pointer-events:none}
.intro-forms .if-ink path{fill:none;stroke:#8a8f94;stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke}
.if-hill{stroke-opacity:.34;stroke-dasharray:1;stroke-dashoffset:1;animation:ifDraw 1.5s var(--ease) .1s forwards}
.if-hill2{stroke-opacity:.2;animation-delay:.3s}
.if-ground{stroke-opacity:.4}
.if-form{stroke-opacity:0;stroke-dasharray:1;stroke-dashoffset:1;animation:ifForm 1.2s ease-in-out var(--d) forwards}
@keyframes ifDraw{to{stroke-dashoffset:0}}
@keyframes ifForm{0%{stroke-opacity:0;stroke-dashoffset:1}60%{stroke-opacity:.6;stroke-dashoffset:0}100%{stroke-opacity:.5;stroke-dashoffset:0}}
@keyframes introLift{0%{transform:none}99%{transform:translateY(-100%);visibility:visible}100%{transform:translateY(-100%);visibility:hidden}}
.intro.gone{display:none}
html.intro-on{overflow:hidden}
@media (max-width:600px){.intro-word{font-size:19px;letter-spacing:.22em;text-indent:.22em}.intro-forms{height:55%}}
@media (prefers-reduced-motion:reduce){.intro{display:none}}

/* ---------- Projects list in the manner of big.dk ----------
   A centred column of small images with the name beside each. Rest on one and it grows in place,
   stay a second and it comes fully forward: name, facts and share on the left, description on the right. */
.card{position:relative}
.card-link{position:absolute;inset:0;z-index:2}
.card-link:focus-visible{outline:2px solid var(--ink);outline-offset:6px}
.card-logo,.card-meta,.card-share,.card-desc,.card-peek{display:none}
.card-year{font-size:11px;letter-spacing:.1em;color:var(--grey-2);font-feature-settings:"tnum"}
@media (min-width:901px){
  .grid{--w0:380px;--w1:440px;--w2:clamp(520px,41vw,720px);display:flex;flex-direction:column;gap:30px;max-width:none;margin:0;padding:8px 0 40px}
  .grid .card,.grid .card.wide,.grid .card.wide.right{display:flex;flex-direction:row;justify-content:center;align-items:stretch;gap:0;grid-column:auto;grid-row:auto;transition:opacity .6s var(--ease)}
  .grid .card .card-img,.grid .card.wide .card-img{order:2;flex:none;align-self:flex-start;width:var(--w0);min-height:0;aspect-ratio:750/435;transition:width 1.1s cubic-bezier(.22,.61,.36,1),box-shadow .8s var(--ease)}
  .grid .card .card-img img,.grid .card.wide .card-img img{position:static;width:100%;height:100%;object-fit:cover;transform:none!important}
  .grid .card .card-body{order:1;flex:1 1 0;min-width:0;display:flex;flex-direction:column;align-items:flex-end;text-align:right;gap:0;padding:0 34px 0 0}
  .card-logo{display:flex;align-items:center;justify-content:center;width:34px;height:34px;background:var(--ink);margin-bottom:14px}
  .card-logo img{width:22px;height:auto;filter:brightness(2.2) contrast(1.05)}
  .grid .card .card-title{font-size:14px;font-weight:400;line-height:1.35;margin:0;text-decoration:none!important;color:var(--ink);transition:font-size .6s var(--ease)}
  .grid .card .card-place{margin:3px 0 0;font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--grey)}
  .grid .card .card-year{margin-top:18px;display:block}
  .card-meta{display:block;margin:0;max-height:0;opacity:0;overflow:hidden;transition:max-height .7s var(--ease),opacity .6s var(--ease) .2s}
  .card-meta div{margin-top:14px}
  .card-meta dt{font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--grey-2)}
  .card-meta dd{margin:2px 0 0;font-size:11.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink)}
  .card-share{display:flex;align-items:center;gap:6px;margin-top:auto;padding-top:18px;opacity:0;transition:opacity .6s var(--ease) .3s;position:relative;z-index:3}
  .card-share span{font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--grey-2);margin-right:4px}
  .card-share a{display:flex;align-items:center;justify-content:center;width:17px;height:17px;background:var(--ink);color:#fff;transition:background .2s}
  .card-share a:hover{background:var(--ocean-2)}
  .card-share svg{width:10px;height:10px}
  .grid .card .card-desc{order:3;display:block;flex:1 1 0;min-width:0;padding:0 0 0 34px;opacity:0;transform:translateX(-8px);transition:opacity .7s var(--ease) .25s,transform .8s var(--ease) .25s;pointer-events:none}
  .card-desc p{margin:0 0 12px;padding-right:72px;font-size:12px;line-height:1.55;color:var(--ink)}
  .card-desc p:nth-child(n+3){display:none}
  .card-peek{position:absolute;right:calc(-1 * var(--gutter));top:0;width:0;height:calc(var(--w2) * .58);overflow:hidden;opacity:0;transition:width 1.1s cubic-bezier(.22,.61,.36,1),opacity .8s var(--ease) .3s;pointer-events:none}
  .card-peek img{position:absolute;right:0;top:0;height:100%;width:auto;max-width:none;filter:grayscale(1)}
  .grid .card .card-tag{left:8px;top:8px;font-size:10px;padding:3px 6px}
  .grid .card.card-cta{display:block;border:0;background:none;padding:18px 0 0;min-height:0;text-align:right}
  @media (hover:hover){
    .grid:has(.card:hover) .card:not(:hover):not(.card-cta){opacity:.32}
    .grid .card:hover .card-img{width:var(--w1)}
    .grid .card:hover .card-img img{filter:grayscale(0) contrast(1) brightness(1.04)}
  }
}
@media (min-width:1100px) and (hover:hover){
  .grid .card.is-focus .card-img{width:var(--w2);box-shadow:0 22px 60px rgba(14,17,19,.14)}
  .grid .card.is-focus .card-title{font-size:17px}
  .grid .card.is-focus .card-meta{max-height:260px;opacity:1}
  .grid .card.is-focus .card-share{opacity:1}
  .grid .card.is-focus .card-desc{opacity:1;transform:none}
  .grid .card.is-focus .card-peek{width:clamp(36px,calc(var(--gutter) + 40px),90px);opacity:1}
}
@media (max-width:900px){
  .grid{grid-template-columns:minmax(0,1fr);gap:34px}
  .grid .card .card-title{font-size:15px;font-weight:400}
  .grid .card .card-place{font-size:12px;letter-spacing:.08em;text-transform:uppercase}
}

/* ---------- Project types across the top, in the manner of big.dk: plain words, one row, sticky under the header ---------- */
.pl-hero{padding-bottom:0}
.pl-hero .ah-img{display:none}
.pl-hero .ah-grid{grid-template-columns:minmax(0,1fr)}
.pl-hero .ah-lead{max-width:56ch}
.pl-bar{position:sticky;top:var(--head);z-index:30;background:var(--paper);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.filters{gap:6px clamp(26px,5vw,78px);padding:14px 0;align-items:center}
.filters button{font-size:14px;letter-spacing:.01em;color:var(--grey);font-weight:400;padding:7px 0;transition:color .3s var(--ease)}
.filters button sup{display:none}
.filters button::after{content:"";position:absolute;left:0;right:0;bottom:2px;height:1px;background:var(--ink);transform:scaleX(0);transform-origin:left;transition:transform .5s var(--ease)}
.filters:hover button:not(:hover):not(.view-toggle button){color:var(--grey-2)}
.filters button:hover,.filters button[aria-pressed="true"]{color:var(--ink);font-weight:400}
.filters button:hover::after,.filters button[aria-pressed="true"]::after{transform:scaleX(1);background:var(--ink);height:1px}
.view-toggle button::after{display:none!important}
@media (max-width:640px){.filters{gap:24px;padding:12px var(--gutter)}.pl-bar{top:var(--head)}}
.grid .card.is-hidden{display:none!important}
.filters .view-toggle button{padding:7px 12px;font-size:12px;letter-spacing:.12em;text-transform:uppercase}
.filters .view-toggle{gap:2px}
.filters:hover .view-toggle button:not(:hover){color:var(--grey)}
.filters .view-toggle button[aria-pressed="true"]{color:var(--ink);border-color:var(--line)}

/* Legal hub, documents, brand identity, footer legal row */
.lg-list{list-style:none;margin:0;padding:0;border-top:1px solid var(--ink)}
.lg-list a{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr) auto 24px;gap:24px;align-items:baseline;padding:22px 0;border-bottom:1px solid var(--line);transition:padding .35s var(--ease),color .2s}
.lg-t{font-size:clamp(19px,1.7vw,24px);font-weight:500;letter-spacing:-.01em}
.lg-s{color:var(--grey);font-size:15.5px;line-height:1.55}
.lg-d{font-size:14px;color:var(--grey);font-feature-settings:"tnum"}
.lg-list .arr{transition:transform .3s var(--ease)}
.lg-list a:hover{padding-left:10px;color:var(--ocean)}
.lg-list a:hover .arr{transform:translateX(4px)}
.lg-sum{margin:0;font-size:17px;line-height:1.6;color:var(--ink-2)}
.pv-sec ul{margin:0;padding-left:20px;max-width:64ch;font-size:17px;line-height:1.7;color:var(--ink-2)}
.pv-sec li{margin:0 0 8px}
.pv-sec p+p,.pv-sec p+ul,.pv-sec ul+p{margin-top:14px}
.lg-back{margin:36px 0 0}
.foot-legal{display:flex;flex-wrap:wrap;gap:12px 36px;align-items:baseline;padding:28px 0;margin-top:36px;border-top:1px solid var(--line)}
.foot-legal h2{margin:0;font-size:13px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--grey)}
.foot-legal ul{display:flex;flex-wrap:wrap;gap:8px 28px;list-style:none;margin:0;padding:0}
.foot-legal a{font-size:15px}
.foot-legal a:hover{opacity:1;text-decoration:underline;text-underline-offset:4px}
.bd-h{margin:0 0 12px;font-size:clamp(22px,2vw,30px);font-weight:500;letter-spacing:-.01em}
.bd-gap{margin-top:clamp(40px,5vw,72px)}
.bd-p{margin:0 0 28px;max-width:64ch;font-size:17px;line-height:1.7;color:var(--ink-2)}
.bd-note{margin:32px 0 0}
.bd-alt{background:var(--stone)}
.bd-pair{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.bd-tile{margin:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:22px;min-height:260px;padding:32px;border:1px solid var(--line);background:#fff}
.bd-tile img{width:min(260px,70%);height:auto}
.bd-tile figcaption{font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:var(--grey)}
.bd-black{background:#0e1113;border-color:#0e1113}
.bd-black figcaption{color:rgba(255,255,255,.6)}
.bd-inv{filter:brightness(0) invert(1)}
.bd-two{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,6vw,96px)}
.bd-list{margin:0;padding-left:20px;max-width:56ch;font-size:17px;line-height:1.7;color:var(--ink-2)}
.bd-list li{margin-bottom:8px}
.bd-sw{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:20px}
.bd-sw li{display:flex;flex-direction:column;gap:4px}
.bd-chip{display:block;height:96px;border:1px solid var(--line);margin-bottom:8px}
.bd-sw code{font-size:13.5px;color:var(--grey)}
.bd-sw small{font-size:14px;color:var(--grey);line-height:1.5}
.bd-spec{display:flex;gap:clamp(24px,5vw,72px);margin:8px 0 0;font-size:clamp(56px,8vw,112px);font-weight:300;line-height:1;letter-spacing:-.02em}
.bd-dl{list-style:none;margin:0;padding:0;border-top:1px solid var(--ink)}
.bd-dl a{display:flex;justify-content:space-between;gap:16px;padding:18px 0;border-bottom:1px solid var(--line);font-size:17px;transition:padding .3s var(--ease),color .2s}
.bd-dl a:hover{padding-left:10px;color:var(--ocean)}
@media (max-width:900px){.lg-list a{grid-template-columns:1fr auto;gap:6px 16px}.lg-s{grid-column:1/-1;order:3}.lg-d{order:2}.bd-pair,.bd-two{grid-template-columns:1fr}}

/* Mosaic view: equal tiles, staggered columns */
@media (min-width:701px){
.is-mosaic .grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(18px,2vw,32px);align-items:start;--w0:100%}
.is-mosaic .grid .card{display:block;position:relative;margin:0}
.is-mosaic .grid .card:nth-child(3n+2){margin-top:clamp(28px,5vw,80px)}
.is-mosaic .grid .card:nth-child(3n){margin-top:clamp(14px,2.5vw,40px)}
.is-mosaic .grid .card .card-img{width:100%;order:0;transition:none;overflow:hidden}
.is-mosaic .grid .card:hover .card-img,.is-mosaic .grid .card.is-focus .card-img{width:100%}
.is-mosaic .grid .card .card-img img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;transition:transform 1.2s cubic-bezier(.22,.61,.36,1),filter .6s}
.is-mosaic .grid .card:hover .card-img img{transform:scale(1.02)}
.is-mosaic .grid .card .card-body{align-items:flex-start;text-align:left;padding:12px 0 0}
.is-mosaic .grid .card .card-meta,.is-mosaic .grid .card .card-share,.is-mosaic .grid .card .card-desc,.is-mosaic .grid .card .card-peek,.is-mosaic .grid .card .card-logo,.is-mosaic .grid .card .card-year{display:none!important}
.is-mosaic .grid:has(.card:hover) .card:not(:hover):not(.card-cta){opacity:.45}
}
@media (max-width:1000px) and (min-width:701px){.is-mosaic .grid{grid-template-columns:repeat(2,minmax(0,1fr))}.is-mosaic .grid .card:nth-child(3n),.is-mosaic .grid .card:nth-child(3n+2){margin-top:0}.is-mosaic .grid .card:nth-child(2n){margin-top:clamp(28px,5vw,60px)}}

/* Team: equal portraits on a tinted caption, columns gently staggered */
.team{align-items:start}
.member{background:var(--stone);padding:0 0 18px}
.member figure{margin:0 0 14px!important;aspect-ratio:4/5!important}
.member .h3,.member .role,.member button,.member .bio,.member .years{margin-left:16px;margin-right:16px}
.member .role{margin-bottom:6px}
.member.is-former{background:transparent}
@media (min-width:981px){.team .member:nth-child(4n+2){margin-top:44px}.team .member:nth-child(4n+3){margin-top:18px}.team .member:nth-child(4n+4){margin-top:62px}}

/* Home: live street map instead of the diagram */
.visit-live{margin:0;border:1px solid var(--line);background:#fff}
.visit-live iframe{display:block;width:100%;height:clamp(320px,38vw,480px);border:0;filter:grayscale(.15)}
.visit-live figcaption{display:flex;flex-wrap:wrap;gap:4px 18px;align-items:baseline;padding:14px 16px;font-size:15px;border-top:1px solid var(--line)}
.visit-live figcaption span{color:var(--grey)}
.visit-live figcaption a{margin-left:auto;color:var(--ink);border-bottom:1px solid currentColor}
:lang(hy) .welcome-h{font-size:clamp(28px,3.4vw,52px);max-width:18ch}
@media (max-width:600px){:lang(hy) .welcome-h{font-size:clamp(23px,6.6vw,30px)}}

/* Opening curtain: watercolour washes, pencil hatching, soft light */
.if-glow{opacity:0;animation:iwIn 1.2s ease .1s forwards}
.iw{opacity:0;animation:iwIn 1.1s ease var(--d) forwards}
@keyframes iwIn{to{opacity:1}}
.if-hatch path{stroke:#9aa3a7;stroke-width:1;stroke-opacity:0;fill:none;vector-effect:non-scaling-stroke;animation:ihIn .8s ease 1.2s forwards}
@keyframes ihIn{to{stroke-opacity:.28}}

/* Forest accent (#1F4D3A): small quiet touches, and a bolder selected state */
:root{--forest:#1f4d3a;--forest-2:#2f6b52;--forest-tint:#eef3f0;--stone:#f1f3f0}
::selection{background:var(--forest);color:#fff}
:focus-visible{outline-color:var(--forest-2)}
.hs-kicker span,.ph-kicker,.hs-n,.pv-n{color:var(--forest)}
.hs-kicker>span::after{background:var(--forest)}
.nav a[aria-current="page"]{font-weight:700;color:var(--ink)}
.nav a[aria-current="page"]::after{transform:scaleX(1);height:2px;bottom:0;background:var(--forest)}
.nav a:hover::after{background:var(--forest)}
.lang a[aria-current="true"]{font-weight:700!important;border-bottom:2px solid var(--forest)}
.filters button[aria-pressed="true"],.map-tabs button[aria-pressed="true"]{font-weight:700;color:var(--ink)}
.filters button:hover::after,.filters button[aria-pressed="true"]::after{background:var(--forest);height:2px}
.view-toggle button[aria-pressed="true"]{font-weight:700;box-shadow:inset 0 -2px 0 var(--forest)}
.pv-toc a:hover,.pv-toc a[aria-current="true"]{color:var(--forest);font-weight:600}
.link:hover,.text-link:hover,.lg-list a:hover,.bd-dl a:hover{color:var(--forest)}
.text-link{color:var(--forest-2);border-bottom-color:rgba(47,107,82,.4)}
.card-tag{background:var(--forest);color:#fff}
.hs-stone,.section.stone,.bd-alt,.member{background:var(--forest-tint)}
.hs-clients li,.hs-affil li{border-top-color:rgba(31,77,58,.28)}
.btn-ghost:hover{border-color:var(--forest);color:var(--forest);background:transparent}
.card-title{transition:color .3s}
.card:hover .card-title{color:var(--forest)}
.ba-knob{color:var(--forest)}
.hero-dots button[aria-current="true"]{background:var(--forest)}
@media (max-width:900px){.nav a[aria-current="page"]{color:var(--forest);font-weight:700}}

/* Home start: full-bleed photograph with the headline set large on it */
.welcome{padding-top:0}
.welcome>.wrap{max-width:none;padding:0;display:grid;grid-template-columns:minmax(0,1fr)}
.welcome-head{display:contents}
.welcome-media{grid-area:1/1;aspect-ratio:auto;width:100%;margin:0;height:min(84svh,860px);min-height:500px;max-height:none}
.welcome-h{grid-area:1/1;z-index:3;align-self:end;pointer-events:none;color:#fff;font-weight:300;font-size:clamp(46px,7.4vw,124px);line-height:1;letter-spacing:-.035em;max-width:13ch;padding:0 var(--gutter,24px) clamp(76px,9vw,128px);text-shadow:0 2px 40px rgba(0,0,0,.28)}
:lang(hy) .welcome-h,:lang(ru) .welcome-h{font-size:clamp(34px,5vw,84px);max-width:17ch;letter-spacing:-.02em;color:#fff}
.welcome-media .slide::after{background:linear-gradient(to top,rgba(10,14,13,.66) 0%,rgba(10,14,13,.22) 42%,rgba(10,14,13,0) 70%)}
.welcome-media .slide-cap{display:flex;top:clamp(16px,2.2vw,28px);bottom:auto;left:auto;right:var(--gutter,24px);align-items:flex-end;text-align:right;max-width:60%}
.welcome-media .slide-cap b{font-size:15px;font-weight:500;margin:0;text-shadow:none}
.welcome-media .slide-cap span{font-size:13px}
.welcome-media .hero-dots{right:var(--gutter,24px);bottom:clamp(22px,3vw,36px)}
.welcome-side{grid-area:2/1;max-width:none;display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:8px clamp(28px,6vw,110px);align-items:start;padding:clamp(32px,4.5vw,64px) var(--gutter,24px) 0}
.welcome-name{grid-column:1;margin:0;font-size:14px}
.welcome-p{grid-column:2;grid-row:1/3;margin:0 0 22px;max-width:560px;font-size:17px}
.welcome-actions{grid-column:1;align-self:end}
@media (max-width:900px){
.welcome-side{grid-template-columns:minmax(0,1fr)}
.welcome-name,.welcome-p,.welcome-actions{grid-column:1;grid-row:auto}
.welcome-p{margin-bottom:18px}
.welcome-media{height:min(80svh,700px);min-height:460px}
.welcome-media .slide-cap{display:none}
.welcome-h{font-size:clamp(38px,11.5vw,64px);padding-bottom:72px}
:lang(hy) .welcome-h,:lang(ru) .welcome-h{font-size:clamp(28px,8.6vw,46px)}
}

/* Project video */
.pj-video{padding-bottom:clamp(40px,6vw,88px)}
.pv-box{position:relative;aspect-ratio:16/9;background:var(--forest,#1f4d3a);overflow:hidden}
.pv-box video,.pv-box .pv-poster,.pv-box .pv-frame{position:absolute;inset:0;width:100%;height:100%;border:0;object-fit:cover;display:block}
.pv-play{position:absolute;left:clamp(16px,2.4vw,32px);bottom:clamp(16px,2.4vw,32px);z-index:2;display:inline-flex;align-items:center;gap:12px;padding:10px 20px 10px 10px;border:0;border-radius:999px;background:#fff;color:#0e1113;font:500 14px/1 inherit;cursor:pointer;transition:background .25s,color .25s}
.pv-play:hover,.pv-play:focus-visible{background:var(--forest,#1f4d3a);color:#fff}
.pv-ico{width:34px;height:34px;border-radius:50%;background:#0e1113;position:relative;flex:none;transition:background .25s}
.pv-ico::after{content:"";position:absolute;left:13px;top:10px;border-style:solid;border-width:7px 0 7px 11px;border-color:transparent transparent transparent #fff}
.pv-play:hover .pv-ico,.pv-play:focus-visible .pv-ico{background:#fff}
.pv-play:hover .pv-ico::after,.pv-play:focus-visible .pv-ico::after{border-left-color:var(--forest,#1f4d3a)}
.pv-box:not(.has-teaser) .pv-poster+.pv-play{}
@media (max-width:900px){.pv-box{aspect-ratio:4/3}}
@media (max-width:900px){.welcome-media .hero-dots{top:auto;bottom:24px}}
/* Armenian and Russian headline on the home photograph: smaller, wider measure */
@media (min-width:901px){
:lang(hy) .welcome-h{font-size:clamp(30px,3.9vw,62px);max-width:24ch;line-height:1.08;letter-spacing:-.015em}
:lang(ru) .welcome-h{font-size:clamp(34px,4.6vw,76px);max-width:18ch;line-height:1.05}
}

/* Project cards: swipeable strip under each project (hidden on large screens) */
.card-rail{display:none}
@media (max-width:760px){
.grid .card{position:relative;display:block}
.grid .card .card-img{aspect-ratio:3/2;margin-bottom:18px}
.grid .card .card-img img,.js .grid .card .card-img img{filter:none!important;opacity:1}
.grid .card .card-body{display:grid;grid-template-columns:56px minmax(0,1fr);gap:2px 16px;align-items:center;padding:0}
.grid .card .card-logo{display:flex!important;grid-row:1/3;width:56px;height:56px;margin:0;align-items:center;justify-content:center;background:var(--ink)}
.grid .card .card-logo img{width:34px;height:auto;filter:brightness(2.4) contrast(1.05)}
.grid .card .card-title{grid-column:2;font-size:19px;line-height:1.25;align-self:end}
.grid .card .card-place{grid-column:2;font-size:13px;letter-spacing:.08em;text-transform:uppercase;align-self:start}
.grid .card .card-year,.grid .card .card-meta,.grid .card .card-share,.grid .card .card-desc,.grid .card .card-peek{display:none!important}
.grid .card .card-rail{display:flex;gap:14px;margin:22px calc(-1 * var(--gutter,20px)) 0;padding:0 var(--gutter,20px);overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-left:var(--gutter,20px);-webkit-overflow-scrolling:touch;scrollbar-width:none;position:relative;z-index:3;overscroll-behavior-x:contain}
.grid .card .card-rail::-webkit-scrollbar{display:none}
.card-rail>*{flex:none;scroll-snap-align:start}
.card-rail .cr-text{width:min(78vw,340px);display:flex;flex-direction:column;justify-content:space-between;gap:14px;padding:6px 8px 4px 0}
.card-rail .cr-prose{font-size:15px;line-height:1.55;color:var(--ink);display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:7;overflow:hidden}
.card-rail .cr-prose p{margin:0 0 8px}
.card-rail .cr-prose p:nth-child(n+2){display:none}
.card-rail .cr-more{font-size:15px;color:var(--ink);text-decoration:underline;text-underline-offset:4px;align-self:flex-start;padding:6px 0}
.card-rail .cr-fig{margin:0;width:min(70vw,300px);aspect-ratio:3/2;background:var(--stone)}
.card-rail .cr-fig img{width:100%;height:100%;object-fit:cover;display:block}
.grid .card .card-link{z-index:2}
.grid{gap:56px}
.is-mosaic .grid .card .card-rail{display:none}
}

/* Phone: calmer first screen, closer to the project list below it */
@media (max-width:760px){
.welcome-media{height:auto!important;min-height:0!important;aspect-ratio:4/3.4}
.welcome-h,:lang(hy) .welcome-h,:lang(ru) .welcome-h{font-size:clamp(25px,7.2vw,32px);line-height:1.08;letter-spacing:-.015em;max-width:15ch;padding:0 var(--gutter,20px) 48px;font-weight:400}
:lang(hy) .welcome-h,:lang(ru) .welcome-h{font-size:clamp(21px,6vw,27px);max-width:20ch}
.welcome-media .hero-dots{bottom:18px!important;left:var(--gutter,20px);right:var(--gutter,20px);justify-content:flex-start}
.welcome-media .hero-dots button{width:22px}
.welcome-side{padding-top:24px!important}
.welcome-name{font-size:13px}
.welcome-p{font-size:15.5px!important;line-height:1.55}
.hs{padding-top:56px}
}

/* Owner feedback, 11 Nov: no logo tiles on project cards, larger project names */
.grid .card .card-logo,.card-logo{display:none!important}
.card-title{font-size:clamp(18px,1.45vw,22px)!important;font-weight:500;line-height:1.25}
.card-place{font-size:13px;letter-spacing:.06em;text-transform:uppercase}
@media (max-width:760px){
.grid .card .card-body{display:block}
.grid .card .card-title{font-size:21px!important;margin-bottom:4px}
}

/* No section numbers or rules in the small labels above headings */
.hs-kicker>span,.hs-n,.pv-n{display:none!important}
.hs-kicker{gap:0}

/* Closing call to action: smaller headline */
.hs-cta h2{font-size:clamp(28px,3.4vw,50px)!important;line-height:1.1;letter-spacing:-.02em;max-width:20ch;font-weight:400}

/* Project images show the whole facade, never cropped */
.grid .card .card-img,.grid .card.wide .card-img,.grid.is-filtered .card.wide .card-img{aspect-ratio:auto!important;flex:none!important;min-height:0!important;background:none}
.grid .card .card-img img,.grid .card.wide .card-img img{position:static!important;height:auto!important;object-fit:contain!important}
.grid{align-items:start}
.card-rail .cr-fig{aspect-ratio:auto;height:200px;width:auto;background:none}
.card-rail .cr-fig img{width:auto;height:100%;object-fit:contain}
.is-mosaic .grid .card .card-img{aspect-ratio:4/3!important}
.is-mosaic .grid .card .card-img img{height:100%!important;object-fit:cover!important}

/* Clients: plain names, no logo-style tiles */
.hs-clients .wordmark,.cl-grid .wordmark,.wordmark{text-transform:none!important;letter-spacing:0!important;font-weight:500;font-size:18px!important;text-align:left;color:var(--ink)}
.ch-logo{display:none!important}
.hs-clients{border:0!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:0 32px}
.hs-clients li{min-height:0!important;justify-content:flex-start!important;text-align:left;padding:18px 0!important;border:0!important;border-bottom:1px solid var(--line)!important}
.hs-clients li:hover{background:none}
@media (max-width:760px){.hs-clients{grid-template-columns:1fr!important}}

/* Phone home, 11 Nov: no slideshow, a short line of text, then straight into the projects (as big.dk) */
@media (max-width:760px){
.welcome .welcome-media{display:none!important}
.welcome>.wrap{display:block!important;padding:0 var(--gutter,20px)!important}
.welcome .welcome-h,:lang(hy) .welcome .welcome-h,:lang(ru) .welcome .welcome-h{color:var(--ink)!important;text-shadow:none!important;padding:28px 0 0!important;font-size:24px!important;line-height:1.2;font-weight:400;max-width:20ch;letter-spacing:-.01em}
:lang(hy) .welcome .welcome-h,:lang(ru) .welcome .welcome-h{font-size:21px!important;max-width:26ch}
.welcome .welcome-side{padding:10px 0 0!important;display:block}
.welcome .welcome-name{display:none}
.welcome .welcome-p{font-size:14.5px!important;line-height:1.5;color:var(--grey);margin:0 0 4px!important;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
.welcome .welcome-actions{display:none}
.welcome+.hs{padding-top:28px!important}
.welcome+.hs .hs-head{display:none}
.welcome+.hs .hs-grid{gap:48px}
}

/* Services coming in 2027 */
.sv-soon{border-top:1px solid var(--line)}
.sv-soon-list{list-style:none;margin:28px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 32px}
.sv-soon-i{padding:22px 0 26px;border-top:1px solid var(--ink)}
.sv-soon-tag{display:inline-block;font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--forest);border:1px solid var(--forest);padding:4px 8px;margin-bottom:16px}
.sv-soon-i h3{font-size:clamp(19px,1.6vw,23px);font-weight:500;line-height:1.25;margin:0 0 10px}
.sv-soon-i p{margin:0;color:var(--grey);font-size:15.5px;line-height:1.55;max-width:38ch}
.sv-soon-cta{margin-top:28px}
@media (max-width:900px){.sv-soon-list{grid-template-columns:1fr}}

/* Phone opening: drawn structural grid with Projects, Services and Contacts */
.hx{display:none}
@media (max-width:760px){
.hx{display:block;padding:18px var(--gutter,20px) 6px}
.hx-svg{display:block;width:100%;height:auto;overflow:visible;font-family:inherit}
.hx path{fill:none;stroke-dasharray:1;stroke-dashoffset:1;animation:hxDraw 1.1s cubic-bezier(.65,0,.35,1) forwards;animation-delay:var(--d,0s)}
.hx-ax{stroke:#c9ceca;stroke-width:.8}
.hx-bub circle{fill:#fff;stroke:#9aa29d;stroke-width:.8}
.hx-bub text{font-size:9px;text-anchor:middle;fill:#5f6469;letter-spacing:.04em}
.hx-beam{stroke:var(--ink,#0e1113);stroke-width:3.2}
.hx-col{stroke:var(--ink,#0e1113);stroke-width:2.2}
.hx-thin{stroke:var(--ink,#0e1113);stroke-width:.9}
.hx-hatch{stroke:#5f6469;stroke-width:.7}
.hx-nodes circle{fill:var(--ink,#0e1113)}
.hx-key{fill:var(--forest,#1f4d3a)}
.hx-pin{fill:var(--forest,#1f4d3a)!important}
.hx-pulse{fill:none!important;stroke:var(--forest,#1f4d3a);stroke-width:1.2;transform-origin:112px 352px;animation:hxPulse 2.4s ease-out 1.8s infinite;opacity:0}
.hx-nodes,.hx-bub,.hx-a{opacity:0;animation:hxFade .8s ease forwards}
.hx-bub{animation-delay:.3s}.hx-nodes{animation-delay:1.1s}
.hx-p{animation-delay:.55s}.hx-s{animation-delay:.95s}.hx-c{animation-delay:1.15s}
.hx-t1{font-size:62px;font-weight:600;letter-spacing:-.035em;fill:var(--ink,#0e1113)}
.hx-t2{font-size:28px;font-weight:300;letter-spacing:-.02em;fill:var(--ink,#0e1113)}
.hx-sub{font-size:10.5px;letter-spacing:.09em;text-transform:uppercase;fill:#5f6469}
.hx-sub-s{font-size:8.6px}
:lang(hy) .hx-t1{font-size:50px;letter-spacing:-.02em}
:lang(hy) .hx-t2{font-size:19px}
:lang(hy) .hx-sub{font-size:9.5px;letter-spacing:.04em}
:lang(hy) .hx-sub-s{font-size:7.6px}
:lang(ru) .hx-t2{font-size:26px}
.hx-a:active text,.hx-a:focus-visible text{fill:var(--forest,#1f4d3a)}
.hx-a:focus{outline:none}
html.intro-on .hx *{animation-play-state:paused!important}
.welcome .welcome-h{padding-top:18px!important}
}
@keyframes hxDraw{to{stroke-dashoffset:0}}
@keyframes hxFade{to{opacity:1}}
@keyframes hxPulse{0%{opacity:.9;transform:scale(1)}100%{opacity:0;transform:scale(4)}}
@media (prefers-reduced-motion:reduce){.hx path{animation:none;stroke-dashoffset:0}.hx-nodes,.hx-bub,.hx-a{animation:none;opacity:1}.hx-pulse{display:none}}
@media (max-width:760px){.hx-sub-s{letter-spacing:.04em}}
@media (min-width:901px){:lang(it) .welcome-h{font-size:clamp(36px,5vw,84px);max-width:16ch;line-height:1.04}}

/* Phone opening v2: a cottage drawn in technical pen, the three ways into the site as drafting labels */
@media (max-width:760px){
.hx-house path{stroke-linecap:round;stroke-linejoin:round}
.hx-house .hx-ax3 path{stroke:#cfd4d0;stroke-width:.7;stroke-dasharray:1;animation-duration:.9s}
.hx-house .w1{stroke:var(--ink,#0e1113);stroke-width:1.7}
.hx-house .w2{stroke:var(--ink,#0e1113);stroke-width:1.05}
.hx-house .w3{stroke:#3c4245;stroke-width:.65}
.hx-house .hx-ink path{animation-duration:1s}
.hx-house .hx-wash{fill:var(--forest,#1f4d3a);fill-opacity:.1;stroke:none!important;stroke-dasharray:none!important;stroke-dashoffset:0!important;opacity:0;animation:hxFade 1s ease 1.5s forwards!important}
.hx-house .hx-head{fill:none;stroke:var(--ink,#0e1113);stroke-width:1;opacity:0;animation:hxFade .4s ease 2s forwards}
.hx-house .hx-lead path{stroke:var(--ink,#0e1113);stroke-width:.7;animation-duration:.6s}
.hx-house .hx-lead circle{fill:var(--ink,#0e1113);opacity:0;animation:hxFade .3s ease 2.5s forwards}
.hx-house .hx-pin{opacity:0;animation:hxFade .4s ease 2.6s forwards}
.hx-house .hx-pulse{transform-origin:196px 370px;animation:hxPulse 2.4s ease-out 2.8s infinite}
.hx-house .hx-bub{animation-delay:.2s}
.hx-house .hx-bub text{font-size:10px}
.hx-house .hx-s{animation-delay:1.9s}.hx-house .hx-p{animation-delay:2.1s}.hx-house .hx-c{animation-delay:2.3s}
.hx-house .hx-t1{font-size:54px}
.hx-house .hx-t2{font-size:26px}
:lang(hy) .hx-house .hx-t1{font-size:42px}
:lang(hy) .hx-house .hx-t2{font-size:19px}
.hx-house .hx-sub-s{font-size:9px}
:lang(hy) .hx-house .hx-sub-s{font-size:7.6px}
}
@media (max-width:760px){.hx-house .hx-a text{paint-order:stroke;stroke:#fff;stroke-width:6px;stroke-linejoin:round}:lang(hy) .hx-house .hx-s .hx-t2{font-size:17px}}

/* Opening curtain v6: back to the animated logo. The five pieces of the mark fly in from the sides,
   lock together over white, the name tightens into place, and the screen opens. About 2.6 s, click to skip. */
.intro{background:radial-gradient(120% 80% at 50% 0%,#ffffff 0%,#f7f7f5 60%,#f0f0ed 100%);color:#111;animation:introLift .5s cubic-bezier(.76,0,.24,1) 2.1s forwards}
.intro::after{content:"";position:absolute;inset:-10% auto -10% 0;width:34%;background:linear-gradient(100deg,transparent 0%,rgba(255,255,255,.75) 50%,transparent 100%);transform:translateX(-120%) skewX(-12deg);animation:introSheen 1s cubic-bezier(.5,0,.3,1) 1.05s forwards;pointer-events:none}
@keyframes introSheen{to{transform:translateX(320%) skewX(-12deg)}}
@keyframes introLift{0%{clip-path:inset(0 0 0 0)}99%{clip-path:inset(50% 0 50% 0);visibility:visible}100%{clip-path:inset(50% 0 50% 0);visibility:hidden}}
.intro-forms{display:none!important}
.intro .intro-in{position:relative;z-index:2;animation:introPush .5s cubic-bezier(.76,0,.24,1) 2.1s forwards}
@keyframes introPush{to{transform:scale(1.07);opacity:0}}
.intro-mark{width:clamp(110px,12vw,170px);filter:none;animation:markSettle .8s cubic-bezier(.2,.7,.2,1) .62s both}
@keyframes markSettle{from{transform:scale(.94)}to{transform:scale(1.06)}}
.im{opacity:0;animation:imIn3 .7s cubic-bezier(.2,.8,.2,1) forwards}
.im0{--x:-170px;--y:44px;--r:-14deg;animation-delay:.1s}.im1{--x:230px;--y:-24px;--r:12deg;animation-delay:.17s}.im2{--x:-250px;--y:95px;--r:-10deg;animation-delay:.25s}.im3{--x:40px;--y:170px;--r:8deg;animation-delay:.33s}.im4{--x:120px;--y:-175px;--r:-8deg;animation-delay:.41s}
@keyframes imIn3{0%{opacity:0;transform:translate(var(--x),var(--y)) rotate(var(--r));filter:blur(6px)}60%{opacity:1;filter:blur(0)}100%{opacity:1;transform:none;filter:none}}
.intro-word{color:#111;animation:track .9s cubic-bezier(.2,.8,.2,1) .7s both}
@keyframes track{from{letter-spacing:.85em;text-indent:.85em}to{letter-spacing:.34em;text-indent:.34em}}
.intro-word span{animation:introIn .45s var(--ease) calc(.7s + var(--i) * .02s) forwards}
.intro-sub{display:block;color:#6b7076;animation-delay:1.25s}
.intro-geo{display:none}
@media (max-width:600px){.intro-word{animation:none}}

/* Services: six abstract tiles, staggered like a drawing sheet. Glyph, number, name, one line, and the scope as small tags. */
.svcs-sec .wrap{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:clamp(18px,2.4vw,36px);row-gap:clamp(18px,2.4vw,36px);align-items:start}
.svcs-sec .hs-head{grid-column:1/-1}
.svcs-sec .svc{position:relative;display:flex!important;flex-direction:column;gap:14px;padding:clamp(22px,2.2vw,32px)!important;border:1px solid var(--line)!important;background:#fff;min-height:100%;transition:transform .45s var(--ease),box-shadow .45s var(--ease),border-color .3s}
.svcs-sec .svc:nth-of-type(3n+2){--y:clamp(28px,4vw,60px)}
.svcs-sec .svc:nth-of-type(3n+3){--y:clamp(56px,8vw,120px)}
.svcs-sec .svc{translate:0 var(--y,0px)}
.svcs-sec{padding-bottom:clamp(120px,12vw,200px)}
.svcs-sec .svc:first-of-type{border-top:1px solid var(--line)!important}
.svcs-sec .svc:hover{transform:translateY(-6px);box-shadow:0 22px 50px -30px rgba(10,14,16,.35);border-color:var(--ink)!important}
.svcs-sec .svc:target{background:#fff}
.svcs-sec .svc-n{position:absolute;top:clamp(18px,2vw,28px);right:clamp(20px,2.2vw,32px);font-size:13px!important;font-weight:500!important;letter-spacing:.14em!important;color:var(--grey-2)!important}
.svc-g{width:64px;height:64px;fill:none;stroke:var(--ink);stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round;overflow:visible}
.svc-g .g2{stroke:var(--grey-2)}
.svc-g .g3{stroke-dasharray:3 4}
.svc-g path:not(.g3){stroke-dasharray:1;stroke-dashoffset:0;transition:stroke-dashoffset .9s var(--ease)}
.svcs-sec .svc:hover .svc-g path:not(.g3){animation:svcDraw 1s var(--ease)}
.svcs-sec .svc:hover .svc-g .g2{stroke:var(--forest-2,#2f6b52);animation-delay:.15s}
@keyframes svcDraw{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
.svcs-sec .svc-t{font-size:clamp(19px,1.5vw,23px)!important;font-weight:500!important;letter-spacing:-.01em;margin-top:6px!important}
.svcs-sec .svc-t a::after{content:"";position:absolute;inset:0}
.svcs-sec .svc > div{display:flex;flex-direction:column;gap:14px;flex:1}
.svcs-sec .svc .lead{font-size:14.5px!important;line-height:1.55;color:var(--grey);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.svcs-sec .svc ul{margin:auto 0 0!important;gap:6px!important}
.svcs-sec .svc ul li{font-size:11.5px!important;padding:4px 8px!important;letter-spacing:.02em;background:transparent!important;border-color:var(--line)!important;color:var(--ink-2)}
.svcs-sec .svc-more{display:none}
@media (max-width:980px){.svcs-sec .wrap{grid-template-columns:repeat(2,minmax(0,1fr))}.svcs-sec .svc{--y:0px!important}.svcs-sec .svc:nth-of-type(even){--y:32px!important}}
@media (max-width:600px){.svcs-sec .wrap{grid-template-columns:minmax(0,1fr)}.svcs-sec .svc:nth-of-type(even){--y:0px!important}.svcs-sec{padding-bottom:56px}.svcs-sec .svc ul{display:none}.svcs-sec .svc .lead{-webkit-line-clamp:unset;display:block}}
@media (prefers-reduced-motion:reduce){.svcs-sec .svc:hover .svc-g path{animation:none}}

/* Home start v5 (desktop and tablet): editorial split. The headline sits in ink on white,
   the photograph below is left clean, with only a small caption and the slide bar. */
@media (min-width:761px){
.welcome{padding-top:clamp(36px,5vw,76px)!important}
.welcome>.wrap{max-width:var(--max,1440px)!important;margin:0 auto;padding:0 var(--gutter,24px)!important;display:grid!important;grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);column-gap:clamp(32px,6vw,120px);row-gap:clamp(28px,3.4vw,48px);align-items:end}
.welcome .welcome-h,:lang(hy) .welcome .welcome-h,:lang(ru) .welcome .welcome-h,:lang(it) .welcome .welcome-h{grid-area:1/1!important;align-self:end;color:var(--ink)!important;text-shadow:none!important;padding:0!important;font-weight:300!important;font-size:clamp(34px,3.7vw,60px)!important;line-height:1.06!important;letter-spacing:-.025em!important;max-width:16ch!important;pointer-events:auto}
:lang(hy) .welcome .welcome-h,:lang(ru) .welcome .welcome-h{font-size:clamp(28px,2.9vw,46px)!important;max-width:22ch!important;letter-spacing:-.01em!important}
.welcome .welcome-side{grid-area:1/2!important;display:block!important;padding:0 0 6px!important;max-width:440px}
.welcome .welcome-name{font-size:11.5px!important;letter-spacing:.16em;text-transform:uppercase;color:var(--grey);font-weight:500;margin:0 0 14px!important}
.welcome .welcome-p{font-size:15px!important;line-height:1.6;color:var(--grey);margin:0 0 20px!important;max-width:none}
.welcome .welcome-media{grid-area:2/1/3/3!important;width:100%!important;margin:0!important;height:auto!important;min-height:0!important;max-height:none!important;aspect-ratio:16/7.2!important}
.welcome-media .slide::after{background:linear-gradient(to top,rgba(10,14,13,.38) 0%,rgba(10,14,13,0) 28%)!important}
.welcome-media .slide-cap{display:flex!important;top:auto!important;bottom:clamp(16px,2vw,26px)!important;left:clamp(18px,2.2vw,30px)!important;right:auto!important;align-items:flex-start!important;text-align:left!important}
.welcome-media .slide-cap b{font-size:14px!important;font-weight:500!important}
.welcome-media .slide-cap span{font-size:12.5px!important;opacity:.85}
.welcome-media .hero-dots{right:clamp(18px,2.2vw,30px)!important;bottom:clamp(20px,2.2vw,30px)!important}
}
@media (min-width:761px) and (max-width:1000px){
.welcome>.wrap{grid-template-columns:minmax(0,1fr)!important}
.welcome .welcome-side{grid-area:2/1!important;max-width:560px}
.welcome .welcome-media{grid-area:3/1!important;aspect-ratio:4/3!important}
}

/* Home, 11 Nov: no full-width rendering. The headline leads straight into the project list,
   every ribbon aligned on the same centre line, keeping the big.dk behaviour on hover. */
@media (min-width:761px){
.welcome .welcome-media{display:none!important}
.welcome+.hs{padding-top:clamp(40px,5vw,72px)!important}
}
@media (min-width:901px){
.welcome+.hs .hs-grid{gap:clamp(24px,2.6vw,42px)!important;padding-top:12px}
}

/* Header, 11 Nov: a larger mark and name */
@media (min-width:1201px){
.site-head .wrap{min-height:92px}
.brand-mark{width:72px!important;height:auto}
.brand-name{font-size:19px!important;letter-spacing:.3em}
.brand-sub{font-size:10px!important;margin-top:8px}
}
@media (max-width:1200px) and (min-width:601px){.brand-mark{width:56px!important;height:auto}.brand-name{font-size:16px!important}}

/* Home opening v6: headline with a serif accent, and a distributed cluster of project photographs */
.welcome-h em{font-family:"Newsreader","Noto Serif Cyr",Georgia,serif;font-style:italic;font-weight:300;letter-spacing:-.01em}
:lang(hy) .welcome-h em{font-family:inherit;font-style:normal;color:var(--grey)}
.wc{display:none}
@media (min-width:761px){
.welcome>.wrap{grid-template-columns:minmax(0,1fr) minmax(0,1.05fr)!important;align-items:center!important;row-gap:28px!important}
.welcome .welcome-h,:lang(it) .welcome .welcome-h{grid-area:1/1!important;align-self:end;font-weight:400!important;font-size:clamp(40px,4.4vw,74px)!important;line-height:1.02!important;letter-spacing:-.03em!important;max-width:13ch!important}
:lang(hy) .welcome .welcome-h,:lang(ru) .welcome .welcome-h{font-size:clamp(30px,3.1vw,52px)!important;max-width:18ch!important;font-weight:400!important}
.welcome .welcome-side{grid-area:2/1!important;align-self:start;max-width:470px}
.wc{grid-area:1/2/3/3;display:block;position:relative;height:clamp(560px,54vw,820px)}
.wc-i{position:absolute;display:block;overflow:hidden;background:var(--stone);transition:transform .7s var(--ease),box-shadow .7s var(--ease),opacity .5s,z-index 0s}
.wc-i img{width:100%;height:100%;object-fit:cover;display:block;filter:grayscale(1) contrast(1.02);transition:filter .6s,transform 1.2s cubic-bezier(.22,.61,.36,1)}
.wc-i span{position:absolute;left:10px;bottom:8px;right:10px;font-size:11px;letter-spacing:.06em;color:#fff;opacity:0;transform:translateY(6px);transition:opacity .4s,transform .4s;text-shadow:0 1px 10px rgba(0,0,0,.5)}
.wc-1{left:1%;top:0;width:28%;aspect-ratio:4/5}
.wc-2{left:33%;top:4%;width:22%;aspect-ratio:1/1}
.wc-3{left:59%;top:0;width:40%;aspect-ratio:3/2}
.wc-4{left:0;top:42%;width:22%;aspect-ratio:3/2}
.wc-5{left:25%;top:38%;width:24%;aspect-ratio:4/3}
.wc-6{left:52%;top:42%;width:24%;aspect-ratio:3/2}
.wc-7{left:80%;top:38%;width:19%;aspect-ratio:3/4}
.wc-8{left:3%;top:70%;width:16%;aspect-ratio:3/4}
.wc-9{left:22%;top:74%;width:24%;aspect-ratio:3/2}
.wc-10{left:49%;top:72%;width:19%;aspect-ratio:1/1}
.wc-11{left:71%;top:68%;width:21%;aspect-ratio:4/3}
.wc-12{left:84%;top:88%;width:15%;aspect-ratio:3/2}
.wc:hover .wc-i{opacity:.45}
.wc .wc-i:hover,.wc .wc-i:focus-visible{opacity:1;z-index:3;transform:scale(1.18);box-shadow:0 24px 60px -24px rgba(14,17,19,.45)}
.wc .wc-i:hover img,.wc .wc-i:focus-visible img{filter:none}
.wc .wc-i:hover span,.wc .wc-i:focus-visible span{opacity:1;transform:none}
.wc-i{animation:wcIn .9s var(--ease) both}
.wc-2{animation-delay:.06s}.wc-3{animation-delay:.12s}.wc-4{animation-delay:.18s}.wc-5{animation-delay:.24s}.wc-6{animation-delay:.3s}.wc-7{animation-delay:.36s}.wc-8{animation-delay:.42s}.wc-9{animation-delay:.48s}.wc-10{animation-delay:.54s}.wc-11{animation-delay:.6s}.wc-12{animation-delay:.66s}
@keyframes wcIn{from{opacity:0;transform:translateY(18px)}}
}
@media (min-width:761px) and (max-width:1000px){.welcome>.wrap{grid-template-columns:minmax(0,1fr)!important}.wc{grid-area:3/1!important;height:62vw}}
@media (prefers-reduced-motion:reduce){.wc-i{animation:none}}

/* Feed: bridge engineering case studies, three staggered cards */
.cs-sec{border-bottom:1px solid var(--line)}
.cs-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(18px,2.4vw,36px);align-items:start;margin-top:clamp(24px,3vw,44px)}
.cs{position:relative;border:1px solid var(--line);background:#fff;padding:clamp(22px,2.2vw,32px);display:flex;flex-direction:column;gap:12px;transition:transform .45s var(--ease),border-color .3s,box-shadow .45s var(--ease)}
.cs:nth-child(2){translate:0 clamp(28px,4vw,60px)}
.cs:nth-child(3){translate:0 clamp(56px,8vw,120px)}
.cs-grid{padding-bottom:clamp(56px,8vw,120px)}
.cs:hover{transform:translateY(-6px);border-color:var(--ink);box-shadow:0 22px 50px -30px rgba(10,14,16,.35)}
.cs-g{width:120px;height:48px;fill:none;stroke:var(--ink);stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round}
.cs-g .g2{stroke:var(--grey-2)}
.cs-tag{margin:6px 0 0;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--grey)}
.cs-t{margin:0;font-size:clamp(19px,1.5vw,23px);font-weight:500;letter-spacing:-.01em;line-height:1.25}
.cs-p{margin:0;font-size:14.5px;line-height:1.6;color:var(--ink-2)}
.cs-st{margin:6px 0 0;display:flex;align-items:center;gap:8px;font-size:12px;letter-spacing:.06em;color:var(--grey)}
.cs-st span{width:7px;height:7px;border-radius:50%;background:var(--ink);opacity:.7}
.cs-cta{align-self:flex-start;margin-top:4px}
@media (max-width:900px){.cs-grid{grid-template-columns:minmax(0,1fr);padding-bottom:0}.cs:nth-child(n){translate:none}}


/* Norms reference: the correspondence table */
.nm-note{max-width:760px;font-size:14px;line-height:1.6;color:var(--grey);border-left:2px solid var(--forest,#1f4d3a);padding-left:16px;margin:26px 0 0}
.nm-wrap{overflow-x:auto;margin-top:clamp(28px,3.4vw,48px);-webkit-overflow-scrolling:touch}
.nm{width:100%;min-width:860px;border-collapse:collapse;font-size:13.5px;line-height:1.5}
.nm caption{caption-side:bottom;text-align:left;font-size:12.5px;color:var(--grey);padding:14px 0 0}
.nm th{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--grey);font-weight:600;text-align:left;padding:0 18px 12px 0;border-bottom:1px solid var(--ink)}
.nm td{vertical-align:top;padding:16px 18px 16px 0;border-bottom:1px solid var(--line)}
.nm td:first-child{font-weight:600;color:var(--ink);min-width:150px}
.nm b{display:block;font-weight:600;color:var(--ink);white-space:nowrap}
.nm span{color:var(--grey)}
.nm tr:hover td{background:var(--forest-tint,#eef3f0)}
.nm-topics{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(18px,2.4vw,36px);margin-top:clamp(26px,3vw,44px)}
.nm-topic{border:1px solid var(--line);padding:clamp(20px,2vw,28px);background:#fff}
.nm-topic h3{margin:0 0 8px;font-size:18px;font-weight:600}
.nm-topic p{margin:0 0 14px;font-size:14.5px;line-height:1.6;color:var(--grey)}
@media (max-width:760px){.nm-topics{grid-template-columns:minmax(0,1fr)}}


/* Home cluster v3: twelve projects, built work included, every picture shown whole in three staggered columns */
@media (min-width:761px){
.welcome>.wrap{grid-template-columns:minmax(0,.78fr) minmax(0,1.4fr)!important;column-gap:clamp(28px,4vw,72px)!important}
.wc{height:auto!important;display:flex!important;gap:clamp(12px,1.2vw,18px);align-items:flex-start;position:static}
.wc-col{flex:1;display:flex;flex-direction:column;gap:clamp(12px,1.2vw,18px)}
.wc-col:nth-child(2){margin-top:clamp(36px,4vw,64px)}
.wc-col:nth-child(3){margin-top:clamp(12px,1.5vw,24px)}
.wc .wc-i{position:relative!important;left:auto!important;top:auto!important;width:100%!important;aspect-ratio:auto!important;transform:none}
.wc .wc-i img{height:auto!important;object-fit:contain!important}
.wc:hover .wc-i{opacity:.5}
.wc .wc-i:hover,.wc .wc-i:focus-visible{opacity:1;transform:scale(1.06)}
.wc-tag{position:absolute;left:10px;top:10px;font-style:normal;font-size:10px;letter-spacing:.14em;text-transform:uppercase;background:var(--ink);color:#fff;padding:4px 7px;z-index:2}
}
@media (min-width:761px) and (max-width:1000px){.wc-col:nth-child(3){display:none}}

/* Home: a nearly invisible grey elevation drawing fills the space behind the headline */
@media (min-width:761px){
.welcome>.wrap{position:relative}
.welcome>.wrap::before{content:"";grid-area:1/1/3/2;align-self:stretch;margin:-4% 0 -6% -2%;background:url(../img/compare/arinj-a.webp) center 30%/cover no-repeat;filter:grayscale(1) contrast(1.1);opacity:.09;pointer-events:none;z-index:0;-webkit-mask-image:radial-gradient(120% 90% at 40% 45%,#000 45%,transparent 85%);mask-image:radial-gradient(120% 90% at 40% 45%,#000 45%,transparent 85%)}
.welcome .welcome-h,.welcome .welcome-side{position:relative;z-index:1}
}
@media (min-width:761px){
.welcome>.wrap::before{align-self:stretch;margin:calc(-1 * clamp(36px,5vw,76px)) -4% -2% -6%;background-position:center top;background-size:cover;opacity:.11;mix-blend-mode:multiply;-webkit-mask-image:radial-gradient(75% 70% at 45% 50%,#000 35%,transparent 78%);mask-image:radial-gradient(75% 70% at 45% 50%,#000 35%,transparent 78%)}
}


/* Home cluster v5: rectangles only, every picture whole at its own proportions, in colour.
   Columns are balanced by picture height so the top and bottom edges line up. */
@media (min-width:761px){
.wc{height:auto!important;align-items:stretch!important}
.wc .wc-i{flex:0 0 auto!important;border-radius:0!important;aspect-ratio:auto!important;width:100%!important}
.wc-col:nth-child(n){margin-top:0!important}
.wc .wc-i img{filter:none!important}
.wc:hover .wc-i{opacity:.55}
.wc .wc-i:hover,.wc .wc-i:focus-visible{transform:scale(1.04)}
.wc .wc-i img{position:static!important;height:auto!important;object-fit:cover!important}
.wc-col .wc-i:last-child{flex:1 1 auto!important;display:flex}
.wc-col .wc-i:last-child img{height:100%!important;min-height:100%;object-fit:cover!important}
}

/* the Dilijan hotel as one long rectangle across the whole cluster */
@media (min-width:761px){
.wc{flex-wrap:wrap!important}
.wc .wc-wide{flex:0 0 100%!important;aspect-ratio:2.5/1!important;overflow:hidden}
.wc .wc-wide img{width:100%;height:100%!important;object-fit:cover!important;object-position:50% 58%}
}
/* background drawing: the Armavir district master plan */
@media (min-width:761px){.welcome>.wrap::before{background-image:url(../img/works/armavir-district-2.webp);background-position:center;background-size:cover;opacity:.12}}

/* the hotel shown whole: two columns wide at its own proportions, two pictures stacked beside it */
@media (min-width:761px){
.wc{--g:clamp(12px,1.2vw,18px)}
.wc-top{flex:0 0 100%;display:flex;gap:var(--g);align-items:stretch}
.wc .wc-wide{flex:0 0 calc((100% - 2 * var(--g)) * 2 / 3 + var(--g))!important;aspect-ratio:auto!important;width:auto!important}
.wc .wc-wide img{position:static!important;height:auto!important;object-fit:contain!important}
.wc-side{flex:1 1 0}
}
@media (min-width:761px){
.wc .wc-wide{display:block;background:none}
.wc .wc-wide img{position:absolute!important;inset:0;width:100%;height:100%!important;object-fit:cover!important;object-position:50% 20%}
.wc .wc-wide{aspect-ratio:1.42/1!important}
.wc-side .wc-i:last-child img{object-position:50% 30%}
}

/* Cluster interaction: the column under the pointer widens and its neighbours make room,
   the picture under the pointer comes forward in full colour, the rest step back */
@media (min-width:1001px) and (hover:hover){
.wc-col,.wc-top .wc-wide,.wc-side{transition:flex-grow .7s cubic-bezier(.2,.7,.2,1),flex-basis .7s cubic-bezier(.2,.7,.2,1)}
.wc>.wc-col{flex:1 1 0}
.wc>.wc-col:hover{flex-grow:1.7}
.wc-top .wc-wide{flex:2 1 0!important}
.wc-top .wc-side{flex:1 1 0}
.wc-top:has(.wc-side:hover) .wc-wide{flex-grow:1.2!important}
.wc-top:has(.wc-side:hover) .wc-side{flex-grow:1.8}
.wc-top:has(.wc-wide:hover) .wc-wide{flex-grow:2.6!important}
.wc .wc-i{transition:opacity .45s,transform .7s cubic-bezier(.2,.7,.2,1),box-shadow .7s}
.wc .wc-i:hover{transform:scale(1.035);z-index:3;box-shadow:0 26px 60px -28px rgba(14,17,19,.5)}
.wc:hover .wc-i:not(:hover){opacity:.42}
.wc .wc-i span{font-size:12px;font-weight:500}
}
/* hold the cluster height steady while widths change, so nothing jumps and edges stay aligned */
@media (min-width:1001px) and (hover:hover){
.wc-top{height:clamp(340px,29vw,440px)}
.wc-top .wc-wide{aspect-ratio:auto!important;height:100%}
.wc-top .wc-side{height:100%}
.wc>.wc-col{height:clamp(480px,42vw,640px)}
.wc .wc-col>.wc-i{flex:1 1 0!important;min-height:0;position:relative}
.wc .wc-col>.wc-i img{position:absolute!important;inset:0;width:100%;height:100%!important;object-fit:cover;object-position:50% 40%}
}
/* second flagship row: two side pairs around a wide master plan */
.wc-bot .wc-wide img{object-position:50% 50%!important}
@media (min-width:1001px) and (hover:hover){
.wc-bot .wc-wide{flex:1.6 1 0!important}
.wc-bot:has(.wc-side:hover) .wc-wide{flex-grow:1.1!important}
.wc-bot:has(.wc-side:hover) .wc-side:not(:hover){flex-grow:.9}
.wc-bot:has(.wc-wide:hover) .wc-wide{flex-grow:2.4!important}
}
@media (min-width:1001px) and (hover:hover){
.wc-top.wc-bot{height:clamp(260px,21vw,330px)}
.wc-bot .wc-wide{flex:2.2 1 0!important}
.wc-bot:has(.wc-side:hover) .wc-wide{flex-grow:1.6!important}
.wc-bot:has(.wc-side:hover) .wc-side:hover{flex-grow:1.5}
.wc-bot:has(.wc-wide:hover) .wc-wide{flex-grow:3!important}
}
@media (min-width:761px) and (max-width:1000px){.wc-bot .wc-wide{aspect-ratio:1.78/1!important}}
/* background behind the headline: Yerevan from above, faded, in natural colour */
@media (min-width:761px){
.welcome>.wrap::before{grid-area:1/1/3/3!important;margin:-90px 0 -40px -80px!important;background:url(../img/works/bg-office-sketch.svg) 50% 50%/cover no-repeat!important;opacity:.3!important;filter:saturate(.85)!important;-webkit-mask-image:linear-gradient(90deg,#000 0%,#000 30%,rgba(0,0,0,.35) 55%,transparent 75%)!important;mask-image:linear-gradient(90deg,#000 0%,#000 30%,rgba(0,0,0,.35) 55%,transparent 75%)!important}
}
.welcome{overflow-x:clip}
/* background behind the headline: a light pencil-line sketch of the Yerevan residential construction site */
@media (min-width:761px){
.welcome>.wrap::before{grid-area:1/1/3/2!important;margin:-70px -10px -50px -70px!important;background:url(../img/works/bg-office-sketch.svg) 50% 50%/cover no-repeat!important;opacity:.16!important;filter:none!important;-webkit-mask-image:radial-gradient(120% 95% at 45% 50%,#000 50%,transparent 90%)!important;mask-image:radial-gradient(120% 95% at 45% 50%,#000 50%,transparent 90%)!important}
}
@media (min-width:761px){.welcome>.wrap::before{opacity:.13!important;-webkit-mask-image:linear-gradient(90deg,#000 45%,transparent 97%),linear-gradient(180deg,transparent 0,#000 12%,#000 80%,transparent 100%)!important;-webkit-mask-composite:source-in!important;mask-image:linear-gradient(90deg,#000 45%,transparent 97%),linear-gradient(180deg,transparent 0,#000 12%,#000 80%,transparent 100%)!important;mask-composite:intersect!important}}
/* background behind the headline: vector line sketch of the Digitain headquarters, a built Antonyan Project building */
@media (min-width:761px){.welcome>.wrap::before{background:url(../img/works/bg-office-sketch.svg) 30% 14%/135% auto no-repeat!important;opacity:.6!important}}
/* white ribbon tile in the cluster leading to all projects */
.wc .wc-all{display:flex!important;flex-direction:column;justify-content:flex-end;gap:6px;padding:clamp(16px,1.6vw,24px);background:#fff;border:1px solid #0e1113;color:#0e1113;text-decoration:none;min-height:150px}
.wc .wc-all em{font-style:normal;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:#6b7075}
.wc .wc-all strong{font-weight:400;font-size:clamp(20px,1.7vw,28px);line-height:1.1;letter-spacing:-.01em}
.wc .wc-all i{font-style:normal;font-size:22px;transition:transform .4s}
.wc .wc-all:hover{background:#0e1113;color:#fff;opacity:1!important}
.wc .wc-all:hover em{color:#c9cdd1}
.wc .wc-all:hover i{transform:translateX(6px)}
/* Services: local practice / RIBA Plan of Work 2020 switch */
.pw-tabs{display:inline-flex;border:1px solid var(--ink);margin:0 0 clamp(20px,2.4vw,32px)}
.pw-tabs button{font:inherit;font-size:13px;letter-spacing:.06em;padding:11px 18px;background:transparent;color:var(--ink);border:0;cursor:pointer;transition:background .3s,color .3s}
.pw-tabs button[aria-selected="true"]{background:var(--ink);color:#fff}
.pw-tabs button:focus-visible{outline:2px solid var(--ink);outline-offset:3px}
.pw-note{max-width:70ch;color:var(--grey);margin:0 0 clamp(18px,2vw,28px)}
.steps.steps-8{grid-template-columns:repeat(4,minmax(0,1fr))}
.steps-8 .step b{letter-spacing:-.005em}
@media (max-width:1000px){.steps.steps-8{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:600px){.steps.steps-8{grid-template-columns:minmax(0,1fr)}.pw-tabs{display:flex}.pw-tabs button{flex:1;padding:11px 10px}}
.pw-panel[hidden]{display:none!important}