/* Gilded details, velvet controls and finite, layered motion. */
/* The brush keeps its original proportions; the label has its own quiet central area. */
.outline-button{
  position:relative;isolation:isolate;display:inline-flex;align-items:center;justify-content:center;
  inline-size:22.5rem;min-inline-size:0;max-inline-size:100%;
  min-height:112px;aspect-ratio:3 / 1;padding:28px 42px 28px 48px;gap:16px;
  border:0;border-radius:0;background:none;box-shadow:none;
  color:#44382f;font-family:var(--text);font-size:1.625rem;font-style:italic;font-weight:600;
  line-height:1.32;letter-spacing:0;text-align:center;white-space:normal;
  overflow:visible;translate:none;transition:color .45s var(--ease);
}
.outline-button::before{content:'';position:absolute;inset:0;z-index:-2;pointer-events:none;background:url('/assets/impasto-stroke.webp') center/100% 100% no-repeat;transform:rotate(-.35deg);transition:transform .5s cubic-bezier(.2,.7,.3,1)}
.outline-button::after{content:'';position:absolute;inset:24% 13%;z-index:-1;pointer-events:none;background:radial-gradient(ellipse,#ece4d5f5 22%,#ece4d5c9 49%,#ece4d500 74%)}
.outline-button .button-label{position:relative;display:block;min-width:0;text-shadow:none;font-kerning:normal;font-variant-ligatures:common-ligatures}
.outline-button>.button-arrow,.outline-button>span[aria-hidden]{display:inline-block;flex:0 0 20px;width:20px;height:auto;padding:0;border:0;border-radius:0;font-size:1.375rem;font-style:normal;line-height:1;color:inherit;transform:none;transition:transform .65s cubic-bezier(.22,.61,.36,1)}
.outline-button:hover,.outline-button:active,.outline-button:focus-visible,.invitation .outline-button{background:none;border:0;box-shadow:none;color:#4b3329;translate:none}
.outline-button:hover>span[aria-hidden]{transform:none}
.outline-button:focus-visible{outline:2px solid var(--gold);outline-offset:0;border-radius:3px}
.outline-button:focus-visible::before{transform:rotate(0deg) scale(1.015)}
.outline-button:active::before,.outline-button.is-pressing::before{transform:translate3d(0,1px,0) scale(.99);transition-duration:.16s}
.outline-button.is-pressing .button-arrow{transform:translate(2px,-2px)}
.type-source{opacity:1}
.type-surface{position:relative}
.type-overlay{position:absolute;inset:0;pointer-events:none;user-select:none;overflow:visible;z-index:2;text-shadow:inherit}
.type-glyph{position:absolute;display:block;margin:0;padding:0;border:0;white-space:pre;transform-origin:0 50%;font-kerning:none;pointer-events:none}
.text-link{min-height:44px}
.text-link[data-open-brief]{position:relative;border-bottom-color:var(--gold)}
.text-link[data-open-brief]::before{content:'';position:absolute;left:-11px;top:calc(50% - 2px);width:4px;height:4px;background:var(--gold);transform:rotate(45deg) scale(0);transition:transform .5s var(--ease);pointer-events:none}
.text-link[data-open-brief]:focus-visible::before{transform:rotate(45deg) scale(1)}
.text-link:hover span[aria-hidden]{transform:none}
.text-link:focus-visible{color:var(--wine);border-color:currentColor}
.format-row,.service summary{position:relative;isolation:isolate}
.format-row{background-image:none}
.format-row::before,.service summary::before{
  content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:linear-gradient(90deg,#703b420d,transparent 85%);
  opacity:0;transition:opacity .4s var(--ease);
}
.format-row:hover{background-color:transparent}
.format-row:hover .format-title,.format-row:hover .format-action>span{transform:none}
.format-row:focus-visible::before,.service summary:focus-visible::before{opacity:1}
.format-row::after,.service summary::after{content:'';position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--gold);transform:scaleX(0);transform-origin:left;transition:transform .85s cubic-bezier(.2,.65,.25,1);pointer-events:none}
.format-row:focus-visible::after,.service summary:focus-visible::after,.service[open] summary::after{transform:scaleX(1)}
@media(hover:hover) and (pointer:fine){
  .outline-button:hover{color:#3e2721;translate:none}
  .outline-button:hover::before{transform:translate3d(0,-1px,0) scale(1.012)}
  .outline-button:active::before,.outline-button.is-pressing::before{transform:translate3d(0,1px,0) scale(.99)}
  .outline-button:hover>.button-arrow{transform:translate(3px,-2px)}
  #download-brief:hover>.button-arrow{transform:translateY(3px)}
  .text-link:hover span[aria-hidden]{transform:translate(3px,-3px)}
  .text-link[data-open-brief]:hover::before{transform:rotate(45deg) scale(1)}
  .text-link[data-close-menu]:hover span,.text-link[data-close-brief]:hover span{transform:none}
  #brief-back:hover span[aria-hidden]{transform:translateX(-3px)}
  .format-row:hover::before,.service summary:hover::before{opacity:1}
  .format-row:hover::after,.service summary:hover::after{transform:scaleX(1)}
  .format-row:hover .format-action>span{transform:translate(3px,-3px)}
}
.scene-frame{position:absolute;z-index:0;pointer-events:none;border:1px solid #916b4540;border-radius:48% 48% 2px 2px / 24% 24% 2px 2px}
.hero-frame{top:135px;bottom:105px;right:5%;width:43%;animation:frame-arrive 1.6s cubic-bezier(.22,.61,.36,1) .25s both}
.story-frame{top:90px;bottom:75px;left:5%;width:42%}
.scene-ornament{position:absolute;pointer-events:none;user-select:none}
.scene-ornament img{width:100%;height:auto;pointer-events:none}
.hero-ornament{z-index:1;width:clamp(175px,20vw,310px);right:-2%;bottom:125px;opacity:.72}
.story-ornament{z-index:1;width:clamp(130px,15vw,230px);right:-2%;bottom:50px;opacity:.48}
.story-ornament img{transform:scaleX(-1)}
.ornament-rule{display:flex;align-items:center;justify-content:center;gap:23px;max-width:360px;margin:0 auto 54px;color:var(--gold);font-size:1rem;line-height:1;pointer-events:none}
.ornament-rule::before,.ornament-rule::after{content:'';height:1px;flex:1;background:linear-gradient(90deg,transparent,#916b4599)}
.ornament-rule::after{transform:scaleX(-1)}
.atelier-initial{position:relative;display:grid;place-items:center;width:280px;max-width:100%;height:260px;margin-top:35px;pointer-events:none;isolation:isolate}
.atelier-initial img{position:absolute;left:0;top:0;width:160px;height:240px;object-fit:contain;transform:rotate(-15deg);opacity:.85;z-index:-1}
.atelier-initial span{font-family:Ballet,var(--text);font-size:9rem;line-height:1.3;color:var(--wine);padding-left:38px}
.invitation{isolation:isolate;overflow:hidden}
.invitation>.page-width{position:relative;z-index:1}
.invitation-ornament{z-index:0;width:clamp(180px,27vw,400px);right:-65px;top:22px}
.invitation-ornament img{opacity:.33}
.will-appear{transition-duration:1s;transition-timing-function:cubic-bezier(.2,.65,.25,1);transform:translateY(28px)}
.section-heading.will-appear{opacity:1;transform:none}
.section-heading.will-appear>p,.section-heading.will-appear>h2{opacity:0;transform:translateY(25px);transition:opacity 1s cubic-bezier(.2,.65,.25,1),transform 1s cubic-bezier(.2,.65,.25,1);transition-delay:var(--reveal-delay,0ms)}
.section-heading.will-appear>h2{transition-delay:calc(var(--reveal-delay,0ms) + 110ms)}
.section-heading.is-visible>p,.section-heading.is-visible>h2{opacity:1;transform:none}
.ornament-rule.will-appear{transform:scaleX(.72)}
.ornament-rule.is-visible{transform:none}
.chapter-transition{position:fixed;inset:0;z-index:75;pointer-events:none;perspective:1500px;overflow:hidden;contain:strict}
.chapter-leaf{position:absolute;top:0;bottom:0;width:50.2%;background:linear-gradient(135deg,#522c34,#703b42);will-change:transform}
.chapter-leaf::after{content:'';position:absolute;inset:22px;border:1px solid #c7a77955;pointer-events:none}
.chapter-leaf-left{left:0;border-right:1px solid #c7a77988;transform-origin:left center}
.chapter-leaf-right{right:0;border-left:1px solid #c7a77988;transform-origin:right center;background:linear-gradient(225deg,#522c34,#703b42)}
.chapter-ornament{position:absolute;top:8%;left:0;width:80%;height:84%;object-fit:contain;opacity:.28;pointer-events:none}
.chapter-leaf-right .chapter-ornament{left:auto;right:0;transform:scaleX(-1)}
.chapter-caption{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:25px;will-change:transform,opacity;pointer-events:none}
.chapter-wordmark{font-family:Ballet,var(--text);font-size:clamp(2.5rem,4vw,4rem);line-height:1.5;color:#dcc296;padding-inline:.35em}
.chapter-name{position:relative;display:block;max-width:76%;font-family:var(--text);font-style:italic;font-size:clamp(2.5rem,8vw,6.5rem);line-height:1.3;letter-spacing:0;color:#4b3329;text-align:center}
.chapter-divider{display:flex;align-items:center;gap:22px;color:#c7a779;font-size:1rem}
.chapter-divider::before,.chapter-divider::after{content:'';height:1px;width:70px;background:#c7a77988}
.brief-dialog{background:linear-gradient(118deg,#f5ecdb,#ece0ca 65%,#dfcfb3);transform-origin:12% 50%}
.brief-dialog .dialog-top{background:#eee2ce}
.brief-dialog .brief-inner{position:relative;isolation:isolate;overflow:hidden}
.brief-dialog .brief-inner::before{content:'';position:absolute;z-index:-1;left:18px;top:22px;bottom:28px;width:1px;background:linear-gradient(transparent,#a0845355,transparent);pointer-events:none}
.brief-step{transform-origin:left center;backface-visibility:hidden}
#brief-title{transform-origin:left center}
.brief-progress-label{font-style:italic}
.brief-dialog progress{height:1px}.brief-dialog progress::-webkit-progress-value{background:var(--gold)}
.sound-toggle{display:inline-flex;align-items:center;gap:10px;min-height:44px;padding:8px 12px;font-size:1.0625rem;line-height:1.1;color:var(--ivory);white-space:nowrap}
.sound-floating{position:fixed;z-index:65;bottom:16px;right:20px;background:#f0e6d5f5;border:1px solid #9c784344;border-radius:2px}
.sound-mark{position:relative;display:grid;place-items:center;width:27px;height:27px;border:1px solid var(--gold);border-radius:50%;font-family:var(--text);font-style:italic;font-size:1.1875rem;color:var(--gold)}
.sound-toggle[aria-pressed=true] .sound-mark{color:var(--wine);border-color:var(--wine)}
.sound-inline{display:flex;width:max-content;margin-top:24px;padding-left:0;color:var(--stone)}
.sound-inline .sound-mark{width:24px;height:24px}
.sound-toggle:disabled{cursor:default;opacity:.6}
.site-footer{padding-bottom:92px}
.hero-bottom,.story-bottom{padding-right:170px}
@keyframes frame-arrive{from{opacity:0;transform:translateY(18px) scale(.975)}to{opacity:1;transform:none}}
@media(min-width:601px) and (max-width:820px){
.hero-frame{top:465px;bottom:125px;left:9%;right:9%;width:auto}
.hero-ornament{width:190px;right:-25px;bottom:145px}
}
@media(max-width:600px){
.outline-button,.invitation .outline-button{min-height:100px;min-inline-size:0;padding:26px 30px 26px 34px;gap:12px;font-size:1.5rem}
.outline-button>span[aria-hidden]{font-size:1.25rem}
.brief-navigation{flex-wrap:wrap}
.brief-navigation .outline-button{min-inline-size:0;padding:24px 29px;gap:12px;flex:0 1 auto}
.hero-bottom{padding-bottom:40px;padding-right:0}.story-bottom{padding-right:0}.story-progress{visibility:hidden}.hero-sculpture{bottom:145px}.hero-content{padding-bottom:565px}
.chapter-leaf::after{inset:14px}.chapter-name{font-size:clamp(2.125rem,8vw,3.5rem)}
.sound-floating{bottom:12px;left:14px;right:auto;min-height:42px;font-size:1rem;padding:7px 10px}
.brief-dialog .brief-inner::before{left:12px}.sound-inline{margin-top:20px}
.hero-frame{top:470px;bottom:125px;left:8%;right:8%;width:auto}
.story-frame{top:320px;bottom:55px;left:10%;right:10%;width:auto}
.hero-ornament{width:160px;right:-34px;bottom:150px;opacity:.68}
.story-ornament{width:120px;right:-22px;bottom:55px;opacity:.4}
.ornament-rule{margin-bottom:35px;max-width:230px;gap:17px}
.atelier-initial{width:210px;height:175px;margin:22px auto 0}
.atelier-initial img{width:105px;height:160px;left:15px}
.atelier-initial span{font-size:6rem;padding-left:24px}
.invitation-ornament{width:160px;right:-70px;top:12px}
.invitation-ornament img{opacity:.26}
.chapter-caption{gap:15px}.chapter-ornament{width:100%;opacity:.22}
}
@media(prefers-reduced-motion:reduce){.chapter-transition{display:none}}

.chapter-title{position:relative;isolation:isolate;display:grid;place-items:center;width:min(94vw,1060px);aspect-ratio:3 / 1}
.chapter-brush{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;z-index:-1;pointer-events:none}
@media(max-width:360px){.outline-button,.invitation .outline-button{padding-left:30px;padding-right:28px;gap:10px;font-size:1.375rem}.brief-navigation .outline-button{padding-left:25px;padding-right:25px}}
@media(prefers-reduced-motion:reduce){.type-overlay{display:none}.type-source{opacity:1!important}}
html[data-art-motion=off] .type-overlay{display:none}
html[data-art-motion=off] .type-source{opacity:1!important}
.hero h1{letter-spacing:-.025em}
.hero h1 em,.story-copy h2,.story-emphasis{letter-spacing:-.012em}
.section-heading h2,.approach-heading h2,.invitation h2,#brief-title,#result-title{letter-spacing:-.02em}
.section-heading h2 em,.approach-heading h2 em,.invitation h2 em,#brief-title em,#result-title em{letter-spacing:0}
.format-row.is-pressing::before{opacity:1}
.text-link.is-pressing{color:var(--wine)}
.outline-button span.type-overlay,.outline-button:hover span.type-overlay{transform:none;transition:none;font-style:inherit}
