/* DR Architects · version 2 (10.2026)
   Header with an in-row menu, the home reel, the projects index that opens in place.
   Loaded last; dr-system.css stays untouched. */

.dr-sr{position:absolute !important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.dr-progress{display:none}

/* ---------- Header ---------- */
.dr-hd .dr-header__in{height:72px;max-width:none}
.dr-hd__logo{display:flex;align-items:center}
.dr-hd__end{display:flex;align-items:center;gap:clamp(20px,2.4vw,40px)}
.dr-hd__nav{display:flex;align-items:center;gap:clamp(22px,2.8vw,48px)}
.dr-hd__link{position:relative;font-size:13px;line-height:1;font-weight:var(--weight-regular);color:var(--text-primary);text-decoration:none;padding-block:16px;
  opacity:0;visibility:hidden;transform:translateX(-18px);
  transition:opacity .35s var(--ease-standard),transform .6s var(--ease-entrance),visibility 0s linear .6s;
  transition-delay:calc((4 - var(--i,0)) * 45ms),calc((4 - var(--i,0)) * 45ms),.6s}
.dr-hd__link::after{content:"";position:absolute;inset-inline:0;bottom:10px;height:1px;background:currentColor;transform:scaleX(0);transform-origin:right;transition:transform .4s var(--ease-standard)}
.dr-hd__link:hover{text-decoration:none}
.dr-hd__link:hover::after,.dr-hd__link[aria-current="page"]::after{transform:scaleX(1)}
.dr-hd.is-open .dr-hd__link{opacity:1;visibility:visible;transform:none;
  transition:opacity .45s var(--ease-standard),transform .7s var(--ease-entrance),visibility 0s;
  transition-delay:calc((4 - var(--i,0)) * 55ms)}

.dr-hd__toggle{position:relative;width:44px;height:44px;margin-inline-end:-10px;background:none;border:0;padding:0;cursor:pointer;color:var(--text-primary);display:block}
.dr-hd__toggle i{position:absolute;left:11px;width:22px;height:1px;background:currentColor;transition:transform .45s var(--ease-entrance),opacity .2s var(--ease-standard),top .45s var(--ease-entrance)}
.dr-hd__toggle i:nth-child(1){top:16px}
.dr-hd__toggle i:nth-child(2){top:22px}
.dr-hd__toggle i:nth-child(3){top:28px}
.dr-hd.is-open .dr-hd__toggle i:nth-child(1){top:22px;transform:rotate(45deg)}
.dr-hd.is-open .dr-hd__toggle i:nth-child(2){opacity:0;transform:scaleX(.2)}
.dr-hd.is-open .dr-hd__toggle i:nth-child(3){top:22px;transform:rotate(-45deg)}

@media (max-width:820px){
  .dr-hd .dr-header__in{height:64px}
  .dr-hd__nav{display:none}
}

/* Full-screen menu on phones, in Latin caps */
.dr-menu nav a.dr-latin{font-size:clamp(30px,9vw,44px);font-weight:var(--weight-light);letter-spacing:.06em;padding-block:var(--space-4)}
.dr-menu nav a[aria-current="page"]{color:var(--concrete-300)}
.dr-menu nav a{opacity:0;transform:translateY(14px);animation:dr-v2-up .6s var(--ease-entrance) forwards}
.dr-menu nav a:nth-child(2){animation-delay:.05s}
.dr-menu nav a:nth-child(3){animation-delay:.1s}
.dr-menu nav a:nth-child(4){animation-delay:.15s}
.dr-menu nav a:nth-child(5){animation-delay:.2s}
.dr-menu nav a:nth-child(6){animation-delay:.25s}
@keyframes dr-v2-up{to{opacity:1;transform:none}}

/* ---------- Home reel ---------- */
.dr-reel{position:relative;height:calc(100svh - 72px);min-height:440px;background:var(--ink-0);color:var(--paper-0);overflow:hidden}
body.admin-bar .dr-reel{height:calc(100svh - 72px - 32px)}
.dr-reel__stage{position:absolute;inset:0}
.dr-reel__slide{position:absolute;inset:0;display:block;opacity:0;transition:opacity 1.4s var(--ease-standard);z-index:0}
.dr-reel__slide.is-on{opacity:1;z-index:1}
.dr-reel__slide picture,.dr-reel__slide img{display:block;width:100%;height:100%}
.dr-reel__slide img{object-fit:cover;transform:scale(1.08);transition:transform 8s cubic-bezier(.25,.1,.25,1)}
.dr-reel__slide.is-on img{transform:scale(1)}
.dr-reel::after{content:"";position:absolute;inset:auto 0 0 0;height:42%;background:linear-gradient(to top,rgba(0,0,0,.55),rgba(0,0,0,0));z-index:2;pointer-events:none}

.dr-reel__bar{position:absolute;inset-inline:0;bottom:0;z-index:3;display:flex;align-items:flex-end;justify-content:space-between;gap:var(--space-6);padding:0 var(--page-margin) clamp(96px,7vw,112px)}
.dr-reel__cap{display:flex;flex-direction:column;gap:8px;color:var(--paper-0);text-decoration:none;max-width:60ch}
.dr-reel__cap:hover{text-decoration:none}
.dr-reel__t{font-size:clamp(26px,3.2vw,52px);font-weight:var(--weight-light);line-height:1.05;letter-spacing:-.01em}
.dr-reel__s{font-size:var(--size-body-sm);color:rgba(255,255,255,.78)}
.dr-reel__cap.is-swap .dr-reel__t,.dr-reel__cap.is-swap .dr-reel__s{animation:dr-v2-cap .9s var(--ease-entrance)}
@keyframes dr-v2-cap{0%{opacity:0;transform:translateY(12px)}100%{opacity:1;transform:none}}

.dr-reel__ctl{display:flex;align-items:center;gap:var(--space-4);font-size:13px;white-space:nowrap}
.dr-reel__ctl button{background:none;border:0;color:var(--paper-0);width:44px;height:44px;cursor:pointer;font-size:18px;line-height:1;padding:0;opacity:.8;transition:opacity var(--duration-fast)}
.dr-reel__ctl button:hover{opacity:1}
.dr-reel__n{min-width:5.5em;text-align:center;direction:ltr;unicode-bidi:isolate}
.dr-reel__all{color:var(--paper-0);text-decoration:none;margin-inline-start:var(--space-5);padding-block:14px;border-bottom:1px solid rgba(255,255,255,.5)}
.dr-reel__all:hover{text-decoration:none;border-bottom-color:var(--paper-0)}
.dr-reel__prog{position:absolute;inset-inline:0;bottom:0;height:2px;z-index:4;background:rgba(255,255,255,.18)}
.dr-reel__prog i{display:block;height:100%;background:var(--paper-0);transform:scaleX(0);transform-origin:right}
.dr-reel__prog i.is-run{animation:dr-v2-prog var(--dr-reel-ms,6000ms) linear forwards}
@keyframes dr-v2-prog{to{transform:scaleX(1)}}
.dr-reel :focus-visible{outline:1px solid var(--paper-0);outline-offset:4px}

@media (max-width:820px){
  .dr-reel{height:calc(100svh - 64px)}
  .dr-reel__bar{flex-direction:column;align-items:stretch;gap:var(--space-4);padding-bottom:88px}
  .dr-reel__ctl{justify-content:space-between}
  .dr-reel__all{margin-inline-start:auto}
}
@media (prefers-reduced-motion:reduce){
  .dr-reel__slide img{transform:none !important;transition:none}
  .dr-reel__slide{transition:none}
}

/* ---------- Projects index ---------- */
.dr-idx{max-width:none;margin-inline:auto;padding:clamp(28px,4vw,56px) var(--page-margin) var(--section-gap)}
.dr-idx__top{display:flex;align-items:baseline;flex-wrap:wrap;gap:var(--space-4) var(--space-7);padding-bottom:var(--space-6)}
.dr-idx__h{margin:0;font-size:var(--size-title-2);font-weight:var(--weight-light);letter-spacing:-.01em;line-height:1.1}
.dr-idx__filter{display:flex;flex-wrap:wrap;gap:4px var(--space-5);font-size:var(--size-body-sm)}
.dr-idx__filter a{color:var(--text-muted);text-decoration:none;padding-block:10px;border-bottom:1px solid transparent;transition:color var(--duration-fast)}
.dr-idx__filter a:hover{color:var(--text-primary);text-decoration:none}
.dr-idx__filter a[aria-current="true"]{color:var(--text-primary);border-bottom-color:var(--text-primary)}
.dr-idx__count{margin-inline-start:auto;font-size:13px;color:var(--text-muted)}

.dr-idx__cols,.dr-idx__row{display:grid;grid-template-columns:var(--dr-idx-cols,minmax(0,3.2fr) minmax(0,1.4fr) minmax(0,1.4fr) 72px minmax(0,1fr) 28px);gap:var(--space-5);align-items:center}
.dr-idx__cols{border-top:1px solid var(--ink-0);border-bottom:1px solid var(--ink-0);height:36px;font-size:12px;color:var(--text-muted)}
.dr-idx__cols button{background:none;border:0;padding:0;font:inherit;color:inherit;text-align:start;cursor:pointer;height:100%}
.dr-idx__cols button:hover,.dr-idx__cols button[data-dir]{color:var(--text-primary)}
.dr-idx__cols button[data-dir="asc"]::after{content:" \2193"}
.dr-idx__cols button[data-dir="desc"]::after{content:" \2191"}

.dr-idx__list{list-style:none;margin:0;padding:0}
.dr-idx__item{border-bottom:1px solid var(--line-rule);scroll-margin-top:88px}
.dr-idx__rowh{margin:0;font:inherit}
.dr-idx__row{min-height:46px;padding-block:9px;font-size:15px;line-height:1.35;color:var(--text-primary);text-decoration:none;transition:color .25s var(--ease-standard),padding .35s var(--ease-entrance)}
.dr-idx__row:hover{text-decoration:none}
.dr-idx__c{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dr-idx__c--name{font-weight:var(--weight-regular)}
.dr-idx__c--loc,.dr-idx__c--type,.dr-idx__c--year,.dr-idx__c--status{color:var(--text-secondary)}
@media (hover:hover){
  .dr-idx__list:hover .dr-idx__row{color:var(--concrete-300)}
  .dr-idx__list:hover .dr-idx__row .dr-idx__c{color:inherit}
  .dr-idx__list .dr-idx__row:hover,.dr-idx__list .dr-idx__item.is-open .dr-idx__row{color:var(--text-primary)}
  .dr-idx__row:hover .dr-idx__c--name{transform:translateX(-6px)}
  .dr-idx__c--name{transition:transform .45s var(--ease-entrance)}
}
.dr-idx__x{position:relative;width:14px;height:14px;justify-self:end}
.dr-idx__x::before,.dr-idx__x::after{content:"";position:absolute;top:50%;left:0;width:14px;height:1px;background:currentColor;transition:transform .45s var(--ease-entrance)}
.dr-idx__x::after{transform:rotate(90deg)}
.dr-idx__item.is-open .dr-idx__x::before{transform:rotate(45deg)}
.dr-idx__item.is-open .dr-idx__x::after{transform:rotate(135deg)}
.dr-idx__item.is-open .dr-idx__row{font-weight:var(--weight-medium)}
.dr-idx__item.is-open .dr-idx__c--name{font-weight:var(--weight-medium)}

.dr-idx__panel{padding:var(--space-2) 0 var(--space-7)}
.dr-idx__item.is-opening .dr-idx__panel{animation:dr-v2-open .7s var(--ease-entrance)}
@keyframes dr-v2-open{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}

/* Gallery: a film strip at one height, every photo at its own proportions */
.dr-gal{position:relative;outline:none;margin-inline:calc(-1 * var(--page-margin))}
.dr-gal__track{display:flex;gap:10px;height:min(74svh,860px);overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scroll-behavior:smooth;scrollbar-width:none;overscroll-behavior-x:contain;cursor:pointer;padding-inline:var(--page-margin);scroll-padding-inline:var(--page-margin)}
.dr-gal__track::-webkit-scrollbar{display:none}
.dr-gal__slide{flex:0 0 auto;height:100%;margin:0;scroll-snap-align:start;background:var(--surface-media);max-width:calc(100vw - 2 * var(--page-margin))}
.dr-gal__slide img{display:block;width:100%;height:100%;object-fit:cover}
.dr-gal__nav{position:absolute;top:0;bottom:0;width:22%;background:none;border:0;padding:0;color:var(--paper-0);font-size:22px;cursor:pointer;opacity:0;transition:opacity .3s var(--ease-standard);display:flex;align-items:center}
.dr-gal__nav--prev{right:0;justify-content:flex-start;padding-inline-start:var(--space-5)}
.dr-gal__nav--next{left:0;justify-content:flex-end;padding-inline-end:var(--space-5)}
.dr-gal__nav span{display:grid;place-items:center;width:52px;height:52px;background:rgba(0,0,0,.42)}
.dr-gal:hover .dr-gal__nav:not([disabled]),.dr-gal__nav:focus-visible{opacity:1}
.dr-gal__nav[disabled]{opacity:0 !important;pointer-events:none}

.dr-idx__foot{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr) auto;gap:var(--space-6);align-items:start;padding-top:var(--space-5);font-size:var(--size-body-sm)}
.dr-idx__lead{margin:0;color:var(--text-primary);max-width:60ch}
.dr-idx__more{margin-top:var(--space-3);color:var(--text-secondary);max-width:62ch}
.dr-idx__more summary{cursor:pointer;list-style:none;display:inline-flex;gap:8px;align-items:center;color:var(--text-muted);font-size:13px;padding-block:8px}
.dr-idx__more summary::-webkit-details-marker{display:none}
.dr-idx__more summary::before{content:"+";font-size:15px;line-height:1}
.dr-idx__more[open] summary::before{content:"\2212"}
.dr-idx__more p{margin:var(--space-3) 0 0;line-height:var(--leading-body)}
.dr-idx__meta{display:flex;flex-direction:column;gap:6px;color:var(--text-muted);font-size:13px}
.dr-idx__counter{color:var(--text-primary);direction:ltr;unicode-bidi:isolate;align-self:flex-start}
.dr-idx__actions{display:flex;flex-direction:column;align-items:flex-end;gap:2px;font-size:13px}
.dr-idx__actions a{color:var(--text-primary);text-decoration:none;padding-block:8px;border-bottom:1px solid transparent}
.dr-idx__actions a:hover{text-decoration:none;border-bottom-color:currentColor}
.dr-idx__close{color:var(--text-muted) !important}

.dr-idx__empty{padding-block:var(--space-7);color:var(--text-muted)}

/* Hover preview that trails the cursor */
.dr-idx__peek{position:fixed;top:0;left:0;z-index:30;width:220px;aspect-ratio:4/5;pointer-events:none;opacity:0;transform:translate3d(-50%,-50%,0) scale(.92);transition:opacity .25s var(--ease-standard),transform .35s var(--ease-entrance);background:var(--surface-media);overflow:hidden}
.dr-idx__peek img{width:100%;height:100%;object-fit:cover;display:block}
.dr-idx__peek.is-on{opacity:1;transform:translate3d(-50%,-50%,0) scale(1)}
@media (hover:none),(max-width:900px){.dr-idx__peek{display:none}}

@media (max-width:900px){
  .dr-idx__cols{display:none}
  .dr-idx__row{grid-template-columns:minmax(0,1fr) auto 20px;gap:var(--space-4);border-top:0}
  .dr-idx__c--loc,.dr-idx__c--status{display:none}
  .dr-idx__c--type{font-size:12px}
  .dr-idx__c--year{display:none}
  .dr-idx__list{border-top:1px solid var(--ink-0)}
  .dr-idx__foot{grid-template-columns:1fr;gap:var(--space-4)}
  .dr-idx__meta{flex-direction:row;flex-wrap:wrap;gap:6px var(--space-5)}
  .dr-idx__actions{flex-direction:row;justify-content:space-between;align-items:center}
  .dr-gal__track{height:min(62svh,560px)}
  .dr-gal__nav{display:none}
  .dr-idx__count{margin-inline-start:0}
}
@media (max-width:700px){
  .dr-gal__track{height:auto;align-items:center;gap:8px}
  .dr-gal__slide{flex:0 0 84vw;height:auto;max-width:none}
  .dr-gal__slide img{height:auto}
}
@media (max-width:560px){
  .dr-idx__c--type{display:none}
  .dr-idx__row{grid-template-columns:minmax(0,1fr) 20px}
}

/* ---------- Footer, lighter ---------- */
@media (min-width:1001px){.dr-footer__grid{grid-template-columns:2fr 1fr 1.4fr}}
.dr-footer__list a.dr-latin{font-size:13px}

/* ---------- Less text ---------- */
.dr-cta p{display:none}

/* Projects top bar on phones: title and count on one line, the filter scrolls */
@media (max-width:700px){
  .dr-idx__top{gap:var(--space-3) var(--space-5);padding-bottom:var(--space-4)}
  .dr-idx__count{margin-inline-start:auto}
  .dr-idx__filter{order:3;flex:0 0 100%;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;gap:var(--space-5);margin-inline:calc(-1 * var(--page-margin));padding-inline:var(--page-margin)}
  .dr-idx__filter::-webkit-scrollbar{display:none}
  .dr-idx__filter a{white-space:nowrap}
}