/* I.S.S. Security 2.0 — original design, deliberate motion architecture.
   Self-hosted and dependency-free: no CDNs, trackers or external motion runtime. */
:root{--v20-ink:#294b68;--v20-gold:#aa9070;--v20-cream:#faf8f3}
html{scroll-behavior:smooth;scroll-padding-top:110px}
/* Cinematic transition between the monogram opening and the actual homepage. */
.v16-hero{--v20-hero-progress:0;--v20-hero-depth:0;position:relative}
.v16-hero-content{position:relative}
.v16-hero-text{transform:translate3d(0,var(--v20-hero-text-offset,0px),0);will-change:transform}
.v16-hero-visual{transform:translate3d(0,var(--v20-hero-visual-offset,0px),0) scale(var(--v20-hero-scale,1));will-change:transform}
.v16-hero-end{opacity:var(--v20-hero-end-opacity,1);transform:translate3d(0,var(--v20-hero-end-offset,0px),0)}
.v16-hero:after{content:"";position:absolute;z-index:1;left:0;right:0;bottom:-1px;height:105px;pointer-events:none;background:linear-gradient(to bottom,transparent,#fffdfa);opacity:var(--v20-hero-seam-opacity,0)}
@media(min-width:961px){
  .v20-enter .v16-hero h1,.v20-enter .v16-hero-lead,.v20-enter .v16-hero .v16-actions,.v20-enter .v16-hero-visual{opacity:0;transform:translate3d(0,22px,0)}
  .v20-enter.v20-hero-ready .v16-hero h1{animation:v20-enter .95s .03s both}
  .v20-enter.v20-hero-ready .v16-hero-lead{animation:v20-enter .88s .20s both}
  .v20-enter.v20-hero-ready .v16-hero .v16-actions{animation:v20-enter .86s .35s both}
  .v20-enter.v20-hero-ready .v16-hero-visual{animation:v20-enter 1.2s .20s both}
}
@keyframes v20-enter{from{opacity:0;transform:translate3d(0,26px,0)}to{opacity:1;transform:translate3d(0,0,0)}}
/* Story choreography: one quiet viewport, three coordinated editorial chapters. */
.v20-process{position:relative;background:#fffdfa;padding:0!important;min-height:270svh}
.v20-process-pin{position:sticky;top:clamp(94px,11vh,128px);height:calc(100svh - clamp(94px,11vh,128px));max-height:820px;min-height:550px;display:grid;grid-template-columns:minmax(0, .9fr) minmax(0,1.14fr);gap:clamp(38px,7vw,126px);align-items:center;padding-block:30px 55px}
.v20-process-text{align-self:center;position:relative;z-index:2}
.v20-process-text h2{font-size:clamp(3.1rem,5.4vw,6.0rem);line-height:1.03}
.v20-process-text .v16-journey-lead{margin:25px 0 38px;max-width:440px}
.v20-progress{display:flex;align-items:center;gap:15px;max-width:335px;color:#9a856d;font:12px/1.4 Arial,sans-serif;letter-spacing:.10em}
.v20-progress-track{display:block;flex:1;height:2px;background:#ded8cf;position:relative;overflow:hidden}
.v20-progress-fill{position:absolute;left:0;top:0;height:100%;width:100%;transform-origin:left center;transform:scaleX(var(--v20-process-progress,0));background:#ad9576}
.v20-process-dots{display:flex;gap:9px;margin-top:22px}
.v20-process-dots span{height:3px;flex:1;max-width:70px;background:#ddd8cf;position:relative;overflow:hidden}
.v20-process-dots span:before{content:"";position:absolute;inset:0;background:#a98d6e;transform:scaleX(0);transform-origin:left;transition:transform .55s ease}
.v20-process-dots span.v20-done:before{transform:scaleX(1)}
.v20-process-scenes{position:relative;height:min(65vh,560px);min-height:400px;isolation:isolate}
/* Atomic scene switching: Safari/Chrome must never compose two readable chapters on top of one another. */
.v20-process-scenes>.v20-process-scene{position:absolute;inset:0;margin:0;min-height:0;border:0;padding:0;display:flex;flex-direction:column;justify-content:center;pointer-events:none;visibility:hidden!important;opacity:0!important;transform:translate3d(0,20px,0)!important;transition:none!important;}
body.v20-motion-ready .v20-process-scenes>.v20-process-scene.v20-scene-present{visibility:visible!important;opacity:1!important;transform:none!important;pointer-events:auto;}
/* Only animate the incoming content inside the visible chapter. Previous chapter is fully hidden. */
body.v20-motion-ready .v20-process-scene.v20-scene-present .v20-stage-index{animation:v201-content-in .48s ease-out both;}
body.v20-motion-ready .v20-process-scene.v20-scene-present .v16-stage-heading{animation:v201-content-in .55s .04s cubic-bezier(.22,.7,.2,1) both;}
body.v20-motion-ready .v20-process-scene.v20-scene-present p{animation:v201-content-in .62s .12s cubic-bezier(.22,.7,.2,1) both;}
@keyframes v201-content-in{from{opacity:0;transform:translate3d(0,17px,0)}to{opacity:1;transform:translate3d(0,0,0)}}
.v20-stage-index{display:block;font:400 clamp(88px,12.5vw,182px)/.76 Georgia,'Times New Roman',serif;color:#ece5dc;letter-spacing:-.09em;margin-left:-6px;margin-bottom:28px;user-select:none}
.v20-process-scene .v16-stage-heading{gap:0;display:block;position:relative}
.v20-process-scene .v16-stage-tag{display:none}
.v20-process-scene h3{font-size:clamp(2.65rem,4.1vw,5.05rem);line-height:1.07;max-width:520px;letter-spacing:-.052em;color:#294b68}
.v20-process-scene p{max-width:510px;margin:22px 0 0;color:#617480;font:17px/1.72 Arial,sans-serif}
.v20-process-ornament{height:72px;margin-top:26px;width:min(350px,100%);overflow:visible}
.v20-process-ornament path{fill:none;stroke:#b8a083;stroke-width:1.4;vector-effect:non-scaling-stroke;stroke-dasharray:1;stroke-dashoffset:calc(1 - var(--v20-line-progress,0));transition:stroke-dashoffset .07s linear}
.v20-process-ornament circle{fill:#b8a083;opacity:.75}
/* Motion in service area connects headings, dividers and actions — never obscures information. */
.v16-services{position:relative}
.v20-motion-ready .v16-services .v16-heading-row{opacity:0;transform:translate3d(0,25px,0)}
.v20-motion-ready .v16-services .v16-heading-row.v20-shown{animation:v20-reveal 1s both}
.v16-service{position:relative;border-bottom:1px solid transparent!important;background-image:linear-gradient(#d6cdc3,#d6cdc3);background-repeat:no-repeat;background-size:0 1px;background-position:left bottom;transition:background-size .9s cubic-bezier(.23,.6,.28,1),padding-left .3s ease,transform .45s ease,opacity .45s ease}
.v20-motion-ready .v16-service{opacity:.52;transform:translate3d(0,20px,0)}
.v20-motion-ready .v16-service.v20-shown{opacity:1;transform:none;background-size:100% 1px}
.v20-motion-ready .v16-service.v20-shown .v16-service-arrow{transform:rotate(0deg);opacity:1}
.v16-service .v16-service-arrow{display:inline-block;transform:rotate(-28deg);opacity:.5;transition:transform .35s ease,opacity .35s ease}
.v16-service:hover .v16-service-arrow,.v16-service:focus-visible .v16-service-arrow{transform:translate(3px,-3px)}
@keyframes v20-reveal{from{opacity:0;transform:translate3d(0,25px,0)}to{opacity:1;transform:translate3d(0,0,0)}}
/* Historical photograph sequence: vertically driven, horizontally moving photographic record. */
.v16-archive{padding:122px 0 0!important;overflow:clip}
.v16-archive-head{margin-bottom:40px!important}
.v20-archive-flow{position:relative;height:245svh;--v20-archive-progress:0}
.v20-archive-sticky{position:sticky;top:clamp(100px,13vh,145px);height:calc(100svh - clamp(100px,13vh,145px));min-height:510px;display:flex;flex-direction:column;justify-content:center;gap:22px}
.v20-archive-sticky .v16-gallery-container{margin-left:max(26px,calc((100vw - min(calc(100% - 96px),1280px))/2))}
.v20-archive-sticky .v16-archive-strip{scroll-snap-type:none;padding-bottom:13px;overscroll-behavior-x:contain}
.v20-archive-sticky .v16-archive-item{flex:0 0 clamp(250px,27vw,370px)}
.v20-archive-sticky .v16-archive-item img{height:clamp(250px,30vw,360px);filter:saturate(.94)}
.v20-archive-sticky .v16-archive-item figcaption{padding-top:14px}
.v20-archive-sticky .v16-archive-item figcaption span{font-size:21px}
.v20-archive-meta{padding-top:18px!important;padding-bottom:22px!important}
.v20-archive-intro-line{font:12px/1.7 Arial,sans-serif;letter-spacing:.1em;color:#a0876e;margin:0 auto 8px;max-width:1280px;padding:0 26px;text-align:right}
.v20-archive-progress{height:2px;background:#ebe6df;max-width:235px;flex:1;overflow:hidden}
.v20-archive-progress span{display:block;width:100%;height:100%;background:#a58d70;transform-origin:left;transform:scaleX(var(--v20-archive-progress,0))}
.v20-archive-sticky .v16-gallery-controls{display:flex;align-items:center;gap:13px}
.v20-archive-sticky .v16-gallery-count{white-space:nowrap}
.v20-archive-sticky .v16-gallery-controls button{min-width:42px;min-height:42px}
/* The final personal conversation is a landing, not a fourth animated spectacle. */
.v16-founder{background:linear-gradient(125deg,#f6f2eb 0%,#e9ecea 100%)}
.v16-founder-copy{opacity:1}
.v20-motion-ready .v16-founder .v16-founder-copy{opacity:0;transform:translate3d(-28px,0,0)}
.v20-motion-ready .v16-founder .v16-founder-photo{opacity:0;clip-path:inset(0 0 0 100%);transform:translate3d(20px,0,0)}
.v20-motion-ready .v16-founder.v20-shown .v16-founder-copy{opacity:1;transform:none;transition:opacity 1.05s ease,transform 1.05s cubic-bezier(.2,.7,.12,1)}
.v20-motion-ready .v16-founder.v20-shown .v16-founder-photo{opacity:1;clip-path:inset(0);transform:none;transition:opacity 1.1s ease,clip-path 1.18s cubic-bezier(.25,.75,.22,1),transform 1.2s ease .1s}
@media(max-width:960px){
 .v20-process{min-height:auto;padding:75px 0!important}
 .v20-process-pin{position:relative;top:auto;max-height:none;height:auto;min-height:0;display:block;padding:0}
 .v20-process-text .v16-journey-lead{margin-bottom:24px}
 .v20-progress,.v20-process-dots{display:none}
 .v20-process-scenes{height:auto;min-height:0;display:grid;gap:0}
 body .v20-process-scenes>.v20-process-scene{position:relative;inset:auto;visibility:visible!important;opacity:1!important;transform:none!important;min-height:auto;padding:32px 0;border-top:1px solid #ded8cf;pointer-events:auto!important;animation:none!important}
 .v20-stage-index{font-size:68px;margin:0 0 14px}
 .v20-process-scene h3{font-size:clamp(2.4rem,6vw,4rem)}
 .v20-process-scene p{font-size:16px}
 .v20-process-ornament{display:none}
 .v20-archive-flow{height:auto}
 .v20-archive-sticky{position:relative;top:auto;height:auto;min-height:0;gap:12px;padding-bottom:40px}
 .v20-archive-sticky .v16-archive-strip{scroll-snap-type:x mandatory}
 .v20-archive-intro-line{display:none}
 .v20-archive-progress{display:none}
 .v20-motion-ready .v16-founder .v16-founder-copy,.v20-motion-ready .v16-founder .v16-founder-photo{opacity:1;transform:none;clip-path:none}
 .v20-motion-ready .v16-services .v16-heading-row{opacity:1;transform:none}
 .v20-motion-ready .v16-service{opacity:1;transform:none;background-size:100% 1px}
 .v16-hero-text,.v16-hero-visual{will-change:auto}
}
@media(max-width:640px){
 .v20-process{padding:64px 0!important}
 .v16-archive{padding-top:74px!important}
 .v20-archive-sticky .v16-archive-item{flex-basis:82vw}
 .v20-archive-sticky .v16-archive-item img{height:340px}
 .v16-founder{padding:70px 0 78px}
}
/* Native, readable fallback if JavaScript is disabled or delayed. */
body:not(.v20-motion-ready) .v20-process{min-height:0;padding:85px 0!important}
body:not(.v20-motion-ready) .v20-process-pin{position:relative;top:auto;height:auto;min-height:0;max-height:none;display:block}
body:not(.v20-motion-ready) .v20-process-scenes{position:relative;height:auto;min-height:0;display:grid}
body:not(.v20-motion-ready) .v20-process-scenes>.v20-process-scene{position:relative;visibility:visible!important;opacity:1!important;transform:none!important;min-height:0;padding:30px 0;border-top:1px solid #ded8cf;pointer-events:auto!important}
body:not(.v20-motion-ready) .v20-progress,body:not(.v20-motion-ready) .v20-process-dots{display:none}
body:not(.v20-motion-ready) .v20-archive-flow{height:auto}
body:not(.v20-motion-ready) .v20-archive-sticky{position:relative;top:auto;height:auto;min-height:0;padding-bottom:50px}
body:not(.v20-motion-ready) .v20-archive-sticky .v16-archive-strip{scroll-snap-type:x mandatory}
@media(prefers-reduced-motion:reduce){
 html{scroll-behavior:auto}
 .v16-hero-text,.v16-hero-visual,.v16-hero-end{transform:none!important;transition:none!important;animation:none!important;opacity:1!important}
 .v20-process{min-height:auto;padding:80px 0!important}
 .v20-process-pin{position:relative;top:auto;height:auto;min-height:0;max-height:none;display:block}
 .v20-process-scenes{height:auto;min-height:0;display:block}
 body .v20-process-scenes>.v20-process-scene{position:relative;visibility:visible!important;min-height:0;opacity:1!important;transform:none!important;animation:none!important;padding:32px 0;border-top:1px solid #ddd6cc}
 .v20-progress,.v20-process-dots,.v20-process-ornament{display:none}
 .v20-archive-flow{height:auto}
 .v20-archive-sticky{position:relative;top:auto;height:auto;min-height:0}
 .v20-motion-ready .v16-service,.v20-motion-ready .v16-heading-row,.v20-motion-ready .v16-founder .v16-founder-copy,.v20-motion-ready .v16-founder .v16-founder-photo{opacity:1!important;transform:none!important;clip-path:none!important;transition:none!important}
 .v20-archive-sticky .v16-archive-strip{scroll-snap-type:x mandatory}
}

/* Safari with reduced viewport height / browser toolbar: no viewport clipping. */
@media(min-width:961px) and (max-height:740px){.v20-process-pin{min-height:0;height:calc(100svh - 112px);padding-block:15px}.v20-process-scenes{min-height:0;height:min(65svh,490px)}.v20-stage-index{font-size:clamp(74px,10vw,120px);margin-bottom:17px}.v20-process-scene h3{font-size:clamp(2.4rem,3.7vw,4.25rem)}}

@media(max-width:960px),(prefers-reduced-motion:reduce){body.v20-motion-ready .v20-process-scene.v20-scene-present :is(.v20-stage-index,.v16-stage-heading,p){animation:none!important}}
