/* ShapedSI motion layer: reveals, header, menu, ribbons and page transitions.
   Pages opt in with <body class="si-elevated"> and an inline `si-motion` flag on <html>. */
:root{--si-ease:cubic-bezier(.16,1,.3,1);--si-ease-soft:cubic-bezier(.33,1,.68,1);--si-ease-io:cubic-bezier(.65,0,.35,1)}

/* Cross-page transitions where the browser supports them. */
@view-transition{navigation:auto}
::view-transition-old(root),::view-transition-new(root){animation-duration:.42s;animation-timing-function:var(--si-ease-io)}
.si-elevated .si-header{view-transition-name:si-header}

/* Header: fixed, condenses after the first scroll and tucks away while reading. */
.si-elevated .si-header{position:fixed;transition:padding .6s var(--si-ease),background-color .6s,box-shadow .6s,translate .7s var(--si-ease)}
.si-elevated .si-header.is-condensed{padding-block:14px;background:rgba(251,247,241,.88);box-shadow:0 12px 32px -22px rgba(43,28,19,.35)}
.si-elevated .si-header.is-tucked:not(:focus-within):not(:has(.si-mobile-menu:not([hidden]))){translate:0 -105%}
.si-elevated .si-brand img{transition:width .6s var(--si-ease),height .6s var(--si-ease)}
.si-elevated .si-header.is-condensed .si-brand img{width:38px;height:38px}
.si-progress{position:absolute;left:0;right:0;bottom:-1px;height:1px;background:var(--si-clay);transform-origin:0 50%;transform:scaleX(var(--si-progress,0));pointer-events:none}
.si-elevated .si-nav>a:not(.si-button){background:linear-gradient(currentColor,currentColor) 0 100%/0 1px no-repeat;padding-bottom:3px;transition:background-size .55s var(--si-ease)}
.si-elevated .si-nav>a:not(.si-button):is(:hover,:focus-visible,[aria-current=page]){text-decoration:none;background-size:100% 1px}

/* Buttons and links: arrows travel, surfaces warm. */
.si-elevated .si-button{position:relative;overflow:hidden;isolation:isolate;transition:background-color .45s var(--si-ease),color .45s,translate .45s var(--si-ease),transform .4s var(--si-ease),box-shadow .45s}
.si-elevated .si-button:before{content:"";position:absolute;inset:0;z-index:-1;background:var(--si-clay);border-radius:inherit;transform:translateY(101%);transition:transform .6s var(--si-ease)}
.si-elevated .si-button:hover{transform:none;translate:0 -2px;box-shadow:0 14px 28px -16px rgba(81,51,29,.55)}
.si-elevated .si-button:hover:before{transform:none}
.si-elevated .si-outline:before{background:var(--si-espresso)}
.si-elevated .si-outline:hover{color:var(--si-paper)!important}
.si-elevated :is(.si-button,.si-text-link,.si-card-link,.si-index a,.si-more-grid h3) span[aria-hidden]{display:inline-block;transition:translate .5s var(--si-ease)}
.si-elevated :is(.si-button,.si-text-link):hover span[aria-hidden],.si-elevated :is(.si-door,.si-more-grid a,.si-index a,.si-product-card):hover span[aria-hidden]{translate:3px -3px}
.si-elevated .si-text-link[href^="#"]:hover span[aria-hidden]{translate:0 3px}
.si-elevated .si-text-link{background:linear-gradient(var(--si-cocoa),var(--si-cocoa)) 0 100%/0 1px no-repeat;transition:background-size .6s var(--si-ease),border-color .3s}
.si-elevated .si-text-link:hover{background-size:100% 1px}

/* Mobile menu: a calm full-height sheet with staggered serif links. */
.si-elevated .si-menu-button{position:relative;transition:background-color .3s}
.si-elevated .si-menu-button span{transition:translate .5s var(--si-ease),rotate .5s var(--si-ease)}
.si-elevated .si-menu-button[aria-expanded=true] span:first-child{translate:0 3px;rotate:45deg}
.si-elevated .si-menu-button[aria-expanded=true] span:last-child{translate:0 -3px;rotate:-45deg}
.si-elevated .si-mobile-menu{left:0;right:0;top:100%;height:100dvh;margin:0;border:0;border-top:1px solid var(--si-line);border-radius:0;box-shadow:none;padding:clamp(28px,6vh,64px) var(--si-gutter) 140px;overflow-y:auto;display:flex;flex-direction:column;background:var(--si-paper);clip-path:inset(0);transition:clip-path .75s var(--si-ease)}
.si-elevated .si-mobile-menu[hidden]{display:none}
@starting-style{.si-elevated .si-mobile-menu:not([hidden]){clip-path:inset(0 0 100% 0)}}
.si-elevated .si-mobile-menu a{display:flex;justify-content:space-between;align-items:baseline;gap:20px;padding:14px 0;border-bottom:1px solid var(--si-line);font:400 clamp(30px,7.4vw,46px)/1.15 var(--si-serif);letter-spacing:-.02em}
.si-elevated .si-mobile-menu a:after{content:"↗";font:400 18px var(--si-sans);color:var(--si-clay)}
.si-elevated .si-mobile-menu a[lang]{font:500 11px/1.6 var(--si-sans);letter-spacing:.18em;text-transform:uppercase;border:0;margin-top:22px}
.si-elevated .si-mobile-menu a[lang]:after{content:none}
.si-elevated .si-mobile-menu .si-menu-foot{margin-top:auto;padding-top:28px;font-size:12px;color:var(--si-muted)}
.si-elevated .si-mobile-menu .si-menu-foot a{display:inline;border:0;padding:0;font:400 26px var(--si-serif);color:var(--si-ink)}
.si-elevated .si-mobile-menu .si-menu-foot a:after{content:none}
.si-elevated:has(.si-mobile-menu:not([hidden])){overflow:hidden}
.si-motion .si-elevated .si-mobile-menu:not([hidden])>*{animation:si-rise .9s var(--si-ease) both;animation-delay:calc(var(--si-i,0)*55ms + 120ms)}
.si-elevated .si-mobile-menu>:nth-child(2){--si-i:1}.si-elevated .si-mobile-menu>:nth-child(3){--si-i:2}.si-elevated .si-mobile-menu>:nth-child(4){--si-i:3}.si-elevated .si-mobile-menu>:nth-child(5){--si-i:4}.si-elevated .si-mobile-menu>:nth-child(6){--si-i:5}.si-elevated .si-mobile-menu>:nth-child(7){--si-i:6}.si-elevated .si-mobile-menu>:nth-child(8){--si-i:7}.si-elevated .si-mobile-menu>:nth-child(9){--si-i:8}

/* Scroll reveals. Hidden states only apply once the motion flag is set. */
@keyframes si-rise{from{opacity:0;translate:0 28px}}
@keyframes si-fade{from{opacity:0}}
@keyframes si-settle{from{scale:1.07}}
.si-motion [data-reveal]{opacity:0;translate:0 30px;transition:opacity 1.1s var(--si-ease),translate 1.3s var(--si-ease);transition-delay:calc(var(--si-i,0)*95ms + var(--si-delay,0ms))}
.si-motion [data-reveal].is-in{opacity:1;translate:none}
.si-motion [data-reveal=fade]{translate:none}
.si-motion [data-reveal=line]{opacity:1;translate:none;transform:scaleX(0);transform-origin:0 50%;transition:transform 1.4s var(--si-ease-io);transition-delay:calc(var(--si-i,0)*95ms + var(--si-delay,0ms))}
.si-motion [data-reveal=line].is-in{transform:none}
.si-motion [data-reveal=arch]{opacity:1;translate:none;clip-path:inset(100% 0 0 0);transition:clip-path 1.5s var(--si-ease-io);transition-delay:calc(var(--si-i,0)*110ms + var(--si-delay,0ms))}
.si-motion [data-reveal=arch] img{scale:1.16;transition:scale 2.2s var(--si-ease),transform .9s var(--si-ease);transition-delay:calc(var(--si-i,0)*110ms + var(--si-delay,0ms)),0s}
.si-motion [data-reveal=arch].is-in{clip-path:inset(0)}
.si-motion [data-reveal=arch].is-in img{scale:1}

/* Headings rise line by line from a soft mask. */
.si-line{display:block;padding-bottom:.14em;margin-bottom:-.14em;clip-path:inset(-.4em -.6em 0 -.6em)}
.si-line-inner{display:block}
.si-motion [data-split] .si-line-inner{translate:0 108%;transition:translate 1.35s var(--si-ease);transition-delay:calc(var(--si-l,0)*120ms + var(--si-delay,0ms))}
.si-motion [data-split].is-in .si-line-inner{translate:none}

/* Image drift inside fixed frames. */
.si-motion [data-parallax]{scale:1.12;translate:0 var(--si-shift,0px);will-change:translate}

/* Shared section finishes used by elevated pages. */
.si-elevated .si-door-copy{display:flex;flex-direction:column;flex:1}
.si-elevated .si-door-copy .si-eyebrow{margin-bottom:12px!important}
.si-elevated .si-door-copy>p:not(.si-eyebrow){font-size:14px;line-height:1.85;color:var(--si-muted);max-width:340px;margin-bottom:24px;flex:1}
.si-elevated .si-door h3{transition:color .5s var(--si-ease)}
.si-elevated .si-door:hover h3{color:var(--si-cocoa)}
.si-elevated .si-card-link{transition:border-color .5s var(--si-ease)}
.si-elevated .si-door:hover .si-card-link{border-color:var(--si-cocoa)}
.si-elevated .si-arch{position:relative}
.si-elevated .si-arch:after{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:inset 0 0 0 1px rgba(81,51,29,.08);pointer-events:none}
.si-elevated .si-door:hover .si-arch img{transform:scale(1.04)}
.si-elevated .si-steps article{position:relative;border-top:0}
.si-elevated .si-steps article:before{content:"";position:absolute;top:0;left:0;right:0;height:1px;background:rgba(81,51,29,.32);transform-origin:0 50%}
.si-elevated .si-steps article:after{content:"";position:absolute;top:-3px;left:0;width:7px;height:7px;border-radius:50%;background:var(--si-clay)}
.si-motion .si-elevated .si-steps article:before{transform:scaleX(0);transition:transform 1.5s var(--si-ease-io);transition-delay:calc(var(--si-i,0)*140ms + 200ms)}
.si-motion .si-elevated .si-steps article.is-in:before{transform:none}
.si-elevated .si-media{display:block;overflow:hidden;border-radius:20px;margin-bottom:24px;aspect-ratio:4/3;background:var(--si-linen)}
.si-elevated .si-media img{width:100%;height:100%!important;object-fit:cover;margin:0!important;border-radius:0!important;transition:transform 1.1s var(--si-ease)}
.si-elevated a:hover>.si-media img{transform:scale(1.045)}
.si-elevated .si-feature-image{overflow:hidden}
.si-elevated .si-meet{position:relative;overflow:hidden}

/* Ribbon: a slow line of what we make. */
.si-ribbon{overflow:hidden;border-block:1px solid var(--si-line);padding:clamp(18px,2.4vw,30px) 0;background:var(--si-paper);-webkit-mask:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.si-ribbon-track{display:flex;width:max-content;animation:si-marquee 58s linear infinite}
.si-ribbon:hover .si-ribbon-track{animation-play-state:paused}
.si-ribbon-track span{display:flex;align-items:center;gap:clamp(26px,3vw,48px);padding-right:clamp(26px,3vw,48px);font:400 clamp(34px,4.4vw,64px)/1 var(--si-serif);letter-spacing:-.02em;white-space:nowrap;color:var(--si-ink)}
.si-ribbon-track em{color:var(--si-clay)}
.si-ribbon-track i{font:400 clamp(12px,1vw,15px) var(--si-sans);font-style:normal;color:var(--si-clay)}
@keyframes si-marquee{to{transform:translateX(-50%)}}

/* Rotating seal around the mark. */
.si-seal{position:relative;display:inline-grid;place-items:center;width:132px;height:132px;margin:0 auto 34px}
.si-seal svg{position:absolute;inset:0;width:100%;height:100%;animation:si-spin 34s linear infinite}
.si-seal text{font:500 7.4px var(--si-sans);letter-spacing:.2em;text-transform:uppercase;fill:var(--si-cocoa)}
.si-seal img{width:46px;height:46px}
@keyframes si-spin{to{rotate:360deg}}

/* Footer wordmark. */
.si-footer-mark{display:flex;justify-content:space-between;max-width:var(--si-wrap);margin:70px auto 0;font:400 clamp(64px,15.4vw,236px)/.8 var(--si-serif);letter-spacing:-.01em;color:#E8D9C3;opacity:.92;overflow:hidden;padding-bottom:.06em;user-select:none}
.si-footer-mark span{display:inline-block}
.si-motion .si-footer-mark span{translate:0 105%;transition:translate 1.4s var(--si-ease);transition-delay:calc(var(--si-l,0)*55ms)}
.si-motion .si-footer-mark.is-in span{translate:none}
.si-footer-mark i{font-style:italic;color:#C9A27F}

/* AI Desk launcher and panel in the ShapedSI palette. */
html body #shapedsi-trigger-wrap,html body #shapedsi-panel{--desk-paper:#F3EADC;--desk-panel:#FBF7F1;--desk-ink:#2B1C13;--desk-forest:#51331D;--desk-lime:#E8D9C3;--desk-muted:#6F5B4C;--desk-line:rgba(81,51,29,.19);font-family:var(--si-sans)}
html body #shapedsi-trigger{background:#51331D;border-color:#7a5638;font-family:var(--si-sans);font-weight:500;letter-spacing:.02em;box-shadow:0 14px 30px -16px rgba(43,28,19,.6);transition:background-color .35s,translate .45s var(--si-ease)}
html body #shapedsi-trigger:hover{background:#633C1F;translate:0 -2px}
html body #shapedsi-panel{border-color:#d9c8b0}
html body #shapedsi-panel::backdrop{background:rgba(43,28,19,.16)}
html body #shapedsi-panel .desk-action{border-color:#cdb89b}
html body #shapedsi-panel .desk-check input{accent-color:#51331D}
.si-elevated:has(.si-mobile-menu:not([hidden])) #shapedsi-trigger-wrap{visibility:hidden}

@media(max-width:600px){.si-seal{width:112px;height:112px}.si-seal img{width:40px;height:40px}.si-footer-mark{margin-top:48px}}

@media(prefers-reduced-motion:reduce){
  @view-transition{navigation:none}
  .si-elevated *,.si-elevated *:before,.si-elevated *:after{animation:none!important;transition-duration:.01ms!important;transition-delay:0s!important}
  .si-ribbon-track{transform:none}
  .si-ribbon{-webkit-mask:none;mask:none}
  .si-ribbon-track span:nth-child(n+2){display:none}
  .si-ribbon-track span{flex-wrap:wrap;white-space:normal;justify-content:center;padding-inline:var(--si-gutter)}
  .si-ribbon-track{width:auto}
}

/* Printing never hides content that has not been scrolled into view yet. */
@media print{.si-motion :is([data-reveal],[data-split] .si-line-inner,.si-footer-mark span){opacity:1!important;translate:none!important;transform:none!important;clip-path:none!important}.si-motion [data-reveal=arch] img{scale:1!important}.si-header{position:absolute!important}}