/* A continuous, image-led architectural narrative. All content remains in the
   document flow; no vertical wheel is redirected to a horizontal carousel. */
.header,.header.az-navigation-header{position:fixed;inset:0 0 auto;z-index:30;background:linear-gradient(#111411eb,#111411d9);border:0;transition:background .35s,color .35s}
.header.az-header-compact{background:#111411f5;box-shadow:none}
.hero{display:block;min-height:0;height:140svh;max-height:none;overflow:visible;background:var(--ivory)}
.hero-scene{position:sticky;top:0;height:100svh;min-height:620px;isolation:isolate;display:flex;align-items:center;overflow:hidden;background:var(--ivory);clip-path:inset(0 var(--scene-inset,0%) round var(--scene-radius,0px))}
.hero:after{display:none}
.hero-scene:after{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#1114119c,transparent 85%),linear-gradient(0deg,#1114115c,transparent 65%)}
.hero-photo{inset:0;z-index:-2;overflow:hidden}
.hero-photo img{transform:scale(var(--scene-scale,1.055));object-position:57% 47%;filter:saturate(.9)}
.hero-content{padding:140px var(--space) 150px;opacity:var(--scene-copy,1)}
.hero h1{font-size:clamp(52px,6.1vw,96px);line-height:1.14;max-width:1050px;letter-spacing:-.045em}
.hero-bottom{margin-top:42px}
.hero .button{border-radius:60px;padding-inline:32px;background:var(--ivory);color:var(--ink);min-height:56px}
.az-hero-drafting{display:none}
.hero-scroll-cue{position:absolute;left:50%;bottom:38px;width:38px;height:58px;border:1px solid #ffffff80;border-radius:30px;display:grid;place-items:center;opacity:var(--scene-copy,1)}
.hero-scroll-cue span{width:1px;height:22px;background:#fff;transform-origin:top;animation:scroll-cue 2.2s ease-in-out infinite}
@keyframes scroll-cue{0%,100%{transform:scaleY(.55);opacity:.5}50%{transform:scaleY(1);opacity:1}}
.hero+.section{position:relative;z-index:2;margin-top:-40svh;border-radius:48px 48px 0 0;background:var(--ivory)}
#projects{background:var(--ivory);color:var(--ink);padding-top:105px;padding-bottom:125px;overflow:hidden}
#projects .section-head{text-align:center;justify-content:center;margin-bottom:65px}
#projects .section-head>div{max-width:740px}
#projects h2 em{color:#7c6947}
#projects .section-copy{color:#51594c;max-width:600px;margin:26px auto 0;font-size:17px}
#projects .project-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:clamp(24px,4vw,65px);row-gap:75px;overflow:visible}
#projects .project-card{grid-column:1/span 5;padding-top:0;min-width:0}
#projects .project-card:nth-child(4n+2){grid-column:7/span 6;margin-top:130px}
#projects .project-card:nth-child(4n+3){grid-column:2/span 6;margin-top:0}
#projects .project-card:nth-child(4n){grid-column:9/span 4;margin-top:-60px}
#projects .project-image,#projects .project-image.tall{height:auto;aspect-ratio:3/4;border-radius:30px;isolation:isolate}
#projects .project-card:nth-child(4n+2) .project-image{aspect-ratio:3/2}
#projects .project-card:nth-child(4n+3) .project-image{aspect-ratio:4/3}
#projects .project-card:nth-child(4n) .project-image{aspect-ratio:3/4;border-radius:150px 150px 28px 28px}
#projects .project-image img{position:absolute;inset:0;height:100%;width:100%;filter:saturate(.9);object-position:center}
#projects .image-tag{left:22px;bottom:22px;background:#111411d9;border-radius:30px;font-size:12px;letter-spacing:.06em;max-width:calc(100% - 44px)}
#projects .project-title{margin-top:25px}
#projects .project-title h3{font-size:clamp(25px,2.4vw,36px);line-height:1.25}
#projects .project-card>p{font-size:16px;color:#51594c;line-height:1.65;max-width:480px}
#projects .text-button{color:var(--ink);border-color:#8c8068;font-size:14px}
#expertise{background:var(--ivory);color:var(--ink)}
#expertise h2 em{color:#7c6947}
#expertise .section-copy{color:#51594c}
#expertise .service-list{column-gap:5vw;row-gap:55px}
#expertise .service{border:0;border-radius:26px;background:#e7e3d9;color:var(--ink)}
#expertise .service:nth-child(2){margin-top:90px}
#expertise .service:nth-child(3){margin-top:-10px}
#expertise .service summary>.competency-photo{height:auto;aspect-ratio:3/2}
#expertise .service:nth-child(2) summary>.competency-photo{aspect-ratio:4/3}
#expertise .service-body p{color:#51594c}
#expertise .service .plus:before,#expertise .service .plus:after{background:#51594c}
#expertise .service-scope{color:#746449!important}
@media(min-width:1600px){#projects .project-grid{max-width:1480px;margin:auto}}
@media(max-width:1000px){.hero-scene{min-height:580px}.header nav.open{background:var(--black)}.hero h1{font-size:clamp(48px,7.6vw,76px)}#projects .project-grid{gap:55px 30px}#projects .project-card:nth-child(4n+2){margin-top:90px}#projects .project-card:nth-child(4n){margin-top:-20px}}
@media(max-width:700px){
 .hero{height:115svh}.hero-scene{height:100svh;min-height:640px}.hero-content{padding:130px 24px 150px}.hero h1{font-size:clamp(38px,8.8vw,60px);line-height:1.2}.hero-scroll-cue{bottom:40px}.hero-photo img{object-position:60% 48%}
 .hero+.section{margin-top:-15svh;border-radius:28px 28px 0 0}
 #projects{padding:65px 24px 75px}#projects .section-head{margin-bottom:40px}#projects .project-grid{grid-template-columns:repeat(12,minmax(0,1fr));gap:42px 0}
 #projects .project-card,#projects .project-card:nth-child(4n+2),#projects .project-card:nth-child(4n+3),#projects .project-card:nth-child(4n){grid-column:1/-1;margin-top:0}
 #projects .project-card:nth-child(4n+2){grid-column:2/-1}#projects .project-card:nth-child(4n){grid-column:2/12}
 #projects .project-image,#projects .project-image.tall{aspect-ratio:4/5;border-radius:24px}#projects .project-card:nth-child(4n) .project-image{aspect-ratio:4/5;border-radius:130px 130px 24px 24px}
 #projects .project-title h3{font-size:26px}#projects .image-tag{left:14px;bottom:14px;font-size:12px;padding:8px 12px}
 #expertise .service:nth-child(2),#expertise .service:nth-child(3){margin-top:0}#expertise .service-list{gap:26px}
}
@media(prefers-reduced-motion:reduce){.hero{height:100svh}.hero-scene{position:relative;clip-path:none}.hero-photo img{transform:none}.hero-content,.hero-scroll-cue{opacity:1}.hero-scroll-cue span{animation:none}.hero+.section{margin-top:0;border-radius:0}.header{transition:none}}
#projects :focus-visible{outline-color:#69562d}
@media(max-height:600px) and (max-width:1000px){.hero{height:680px}.hero-scene{height:600px;min-height:600px}.hero+.section{margin-top:-80px}.hero-content{padding-top:120px;padding-bottom:115px}}
@media(prefers-reduced-motion:reduce) and (max-height:600px) and (max-width:1000px){.hero{height:600px}.hero+.section{margin-top:0}}
/* Brand palette, horizontal photographs. Touch remains native swipe; desktop
   uses one bounded sticky scene driven by normal document scroll. */
#projects .az-portfolio-stage>.section-head{display:flex;align-items:end;justify-content:space-between;text-align:left;gap:30px}
#projects .az-portfolio-stage .section-copy{margin:20px 0 0}
#projects .az-portfolio-controls{color:var(--ink)}
#projects .az-portfolio-counter,#projects .az-portfolio-hint{color:#6c5b3c}
#projects .az-portfolio-arrow{color:var(--ink);border-color:#8c8068}
#projects .az-portfolio-arrow:not([aria-disabled=true]):hover{background:var(--ink);color:var(--ivory)}
#projects .az-portfolio-rail{background:#20261f1c}
#projects .az-portfolio-fill{background:#8a744b}
#projects .project-grid.az-portfolio-grid{max-width:none;display:flex;gap:clamp(28px,5vw,80px);overflow-x:auto;overflow-y:hidden;margin-inline:calc(-1 * var(--space));padding:12px var(--space) 26px;scroll-snap-type:x proximity}
#projects .az-portfolio-grid>.project-card,#projects .az-portfolio-grid>.project-card:nth-child(n){flex:0 0 32vw;grid-column:auto;margin:0;padding:0;min-width:0}
#projects .az-portfolio-grid>.project-card:nth-child(4n+2),#projects .az-portfolio-grid>.project-card:nth-child(4n+3){flex-basis:46vw;padding-top:40px}
#projects .az-portfolio-grid .project-image{width:100%}
#projects .az-portfolio-grid .project-image img{inset:0;width:100%;height:100%;translate:none}
#projects.az-portfolio-pinned{padding:0;overflow:visible}
#projects.az-portfolio-pinned .az-portfolio-stage{position:sticky;top:var(--portfolio-header,96px);height:calc(100svh - var(--portfolio-header,96px));padding:20px var(--space) 18px;overflow:hidden}
#projects.az-portfolio-pinned .section-head{margin-bottom:18px;align-items:center}
#projects.az-portfolio-pinned h2,#projects.az-portfolio-pinned:lang(ka) h2{font-size:32px;line-height:1.16}
#projects.az-portfolio-pinned h2 br{display:none}
#projects.az-portfolio-pinned h2 em:before{content:' '}
#projects.az-portfolio-pinned .section-copy{font-size:14px;line-height:1.5;max-width:620px;margin-top:12px}
#projects.az-portfolio-pinned .project-grid{overflow:hidden;scroll-snap-type:none;scroll-behavior:auto;padding-top:0;padding-bottom:0}
#projects.az-portfolio-pinned .az-portfolio-grid>.project-card{flex-basis:clamp(220px,29svh,350px)}
#projects.az-portfolio-pinned .az-portfolio-grid>.project-card:nth-child(4n+2),#projects.az-portfolio-pinned .az-portfolio-grid>.project-card:nth-child(4n+3){flex-basis:clamp(320px,44svh,620px);padding-top:30px}
#projects.az-portfolio-pinned .project-image,#projects.az-portfolio-pinned .project-image.tall{height:auto;max-height:none;aspect-ratio:3/4;width:100%}
#projects.az-portfolio-pinned .project-card:nth-child(4n+2) .project-image,#projects.az-portfolio-pinned .project-card:nth-child(4n+3) .project-image{height:auto;max-height:none}
#projects.az-portfolio-pinned .project-title{margin-top:16px}
#projects.az-portfolio-pinned .project-title h3{font-size:22px;line-height:1.2}
#projects.az-portfolio-pinned .project-card>p{font-size:14px;line-height:1.4;margin-block:8px}
#projects.az-portfolio-pinned .project-card>.text-button{font-size:13px;padding-block:8px;min-height:36px}
#projects.az-portfolio-pinned .image-tag{font-size:12px;padding:8px 12px;letter-spacing:0;left:12px;bottom:12px;max-width:calc(100% - 24px)}
#projects.az-portfolio-pinned .az-portfolio-footer{margin-top:12px;gap:25px}
@media(max-width:1000px){#projects .az-portfolio-stage>.section-head{display:block}#projects .az-portfolio-controls{justify-content:flex-end;margin-top:22px}#projects .az-portfolio-grid>.project-card,#projects .az-portfolio-grid>.project-card:nth-child(n){flex-basis:82vw;margin:0;padding:0}#projects .az-portfolio-grid>.project-card:nth-child(4n+2),#projects .az-portfolio-grid>.project-card:nth-child(4n+3){padding-top:32px}#projects .az-portfolio-grid .project-image{max-height:65svh}#projects .az-portfolio-grid .project-title h3{font-size:25px}#projects .az-portfolio-footer{margin-top:12px}#projects .az-portfolio-hint{max-width:70%;font-size:12px}}

@media(min-width:1001px) and (max-height:820px){#projects.az-portfolio-pinned .project-title h3{font-size:20px}#projects.az-portfolio-pinned .section-copy{max-width:650px}}

#projects.az-portfolio-pinned .project-card:nth-child(4n+2) .project-image{aspect-ratio:3/2}
#projects.az-portfolio-pinned .project-card:nth-child(4n+3) .project-image{aspect-ratio:4/3}

/* Light brand section with transparent inner backing and genuine alpha edge masks. Captions and layout
   never animate; only the photo window and its image respond to gallery position. */
#projects .az-portfolio-stage,#projects .project-grid{background:transparent}
#projects .az-portfolio-grid .project-image{background:transparent;-webkit-mask-image:var(--az-photo-mask,none);mask-image:var(--az-photo-mask,none)}
#projects .az-portfolio-grid .project-image img{scale:var(--az-photo-scale,1);transform-origin:center}
@media(prefers-reduced-motion:reduce){#projects .az-portfolio-grid .project-image{-webkit-mask-image:none;mask-image:none}#projects .az-portfolio-grid .project-image img{scale:1}}

/* Full-width editorial ribbon: two substantial windows with a third entering
   during travel. Card sizing comes from the available width, not a narrow cap. */
@media(min-width:1001px){
#projects .project-grid.az-portfolio-grid{max-width:none;width:auto;margin-inline:calc(-1 * var(--space));padding-inline:var(--space);gap:4vw}
#projects .az-portfolio-grid>.project-card,#projects .az-portfolio-grid>.project-card:nth-child(n),#projects.az-portfolio-pinned .az-portfolio-grid>.project-card:nth-child(n){flex-basis:45vw;padding-top:0}
#projects .az-portfolio-grid>.project-card:nth-child(4n+2){padding-top:24px}
#projects .az-portfolio-grid .project-image,#projects .az-portfolio-grid .project-image.tall{aspect-ratio:3/2;max-height:none}
#projects .az-portfolio-grid>.project-card:nth-child(4n) .project-image{aspect-ratio:4/3;border-radius:140px 140px 28px 28px}
#projects.az-portfolio-pinned .project-grid.az-portfolio-grid{overflow-x:auto;scrollbar-width:none}
#projects.az-portfolio-pinned .project-grid::-webkit-scrollbar{display:none}
}
/* Cyclic rebasing must never reveal stale per-card masks from a previous frame.
   Rounded/arched windows provide the clipping; looping photographs stay opaque. */
#projects.az-portfolio-loop .project-image{-webkit-mask-image:none!important;mask-image:none!important;clip-path:none!important;opacity:1!important}
#projects.az-portfolio-loop .project-image img{scale:1;translate:none}
#projects.az-portfolio-loop .project-card{opacity:1!important}

/* Stable photo identities, including CMS collections of any length. Legacy
   positional recipes must not change shapes between an original and its copy. */
#projects.az-portfolio-loop .az-portfolio-grid>.project-card:nth-child(n){padding-top:0}
#projects.az-portfolio-loop .az-portfolio-grid>.project-card:nth-child(n) .project-image{border-radius:30px}
#projects.az-portfolio-loop .az-portfolio-grid>.project-card[data-portfolio-shape=arch] .project-image{border-radius:140px 140px 28px 28px}
@media(min-width:1001px){
#projects.az-portfolio-loop .az-portfolio-grid>.project-card:nth-child(n) .project-image{aspect-ratio:3/2}
#projects.az-portfolio-loop .az-portfolio-grid>.project-card[data-portfolio-shape=arch] .project-image{aspect-ratio:4/3}
}

/* Natural-flow galleries must not inherit the page's 1440px prose gutter. */
@media(min-width:1001px){#projects.az-portfolio-gallery:not(.az-portfolio-pinned){padding-inline:var(--space)}}
/* A short decode warm-up affects horizontal travel only; vertical scrolling
   remains native. Failed/slow images have an explicit stable fallback. */
#projects.az-portfolio-preparing .project-grid.az-portfolio-grid{overflow-x:hidden!important}
#projects .az-photo-unavailable{background:var(--ivory)!important}
#projects .az-photo-unavailable img{visibility:hidden}
#projects .az-portfolio-photo-status{position:absolute;inset:30% 12%;display:grid;place-items:center;text-align:center;color:var(--ink);font-size:16px;line-height:1.5}

/* First paint already uses the native horizontal ribbon. Loading the optional
   loop controller must never expose the former staggered grid, even with JS off. */
#projects .project-grid:not(.az-portfolio-grid){display:flex;align-items:flex-start;max-width:none;width:auto;gap:4vw;overflow-x:auto;overflow-y:hidden;margin-inline:calc(-1 * var(--space));padding:0 var(--space) 26px;scrollbar-width:none}
#projects .project-grid:not(.az-portfolio-grid)>.project-card:nth-child(n){flex:0 0 45vw;min-width:0;margin:0;padding:0;grid-column:auto}
#projects .project-grid:not(.az-portfolio-grid) .project-image{width:100%;height:auto;max-height:none;aspect-ratio:3/2;border-radius:30px;background:transparent}
#projects .project-grid:not(.az-portfolio-grid) .project-image img{inset:0;width:100%;height:100%;translate:none}
#projects .project-grid:not(.az-portfolio-grid)>.project-card:has(img[src*="staircase-0818"]) .project-image{aspect-ratio:4/3;border-radius:140px 140px 28px 28px}
@media(min-width:1001px){
#projects:not(.az-portfolio-pinned){padding:20px var(--space) 18px}
#projects>.section-head,#projects .az-portfolio-stage>.section-head{display:flex;align-items:center;justify-content:space-between;text-align:left;gap:30px;margin-bottom:18px}
#projects h2,#projects:lang(ka) h2{font-size:32px;line-height:1.16}
#projects h2 br{display:none}
#projects h2 em:before{content:' '}
#projects .section-copy,#projects .az-portfolio-stage .section-copy{font-size:14px;line-height:1.5;max-width:620px;margin:12px 0 0}
#projects .project-title{margin-top:16px}
#projects .project-title h3{font-size:22px;line-height:1.2}
#projects .project-card>p{font-size:14px;line-height:1.4;margin-block:8px}
#projects .project-card>.text-button{font-size:13px;padding-block:8px;min-height:36px}
#projects .project-grid:not(.az-portfolio-grid){padding-bottom:0}
}
@media(max-width:1000px){
#projects .project-grid:not(.az-portfolio-grid){gap:clamp(28px,5vw,80px);padding-top:12px}
#projects .project-grid:not(.az-portfolio-grid)>.project-card:nth-child(n){flex-basis:82vw}
#projects .project-grid:not(.az-portfolio-grid) .project-image,#projects .project-grid:not(.az-portfolio-grid)>.project-card:has(img[src*="staircase-0818"]) .project-image{aspect-ratio:4/5;max-height:65svh}
}
@media(max-width:1000px){
#projects>.section-head{text-align:left}
#projects>.section-head .section-copy{margin:20px 0 0}
}

/* The cyclic controller owns seam rebasing and button destinations. Native
   snapping must not pull a rounded mobile offset back across that seam. */
#projects.az-portfolio-loop .project-grid.az-portfolio-grid{scroll-snap-type:none!important;scroll-behavior:auto}

/* Keep services compact on spacious screens. */
@media(min-width:1001px){
#expertise.section{padding-top:48px;position:relative;z-index:2}
#expertise>.section-head{margin-bottom:32px}
}
@media(min-width:1200px){
#expertise h2 br{display:none}
#expertise h2 em:before{content:' '}
}

/* A phone's two-row fixed navigation needs a solid reading surface. */
@media(max-width:1000px){
.header,.header.az-navigation-header,.header.az-header-compact{background:var(--black)}
}
