/* The page stays usable when scripts are unavailable. Motion is a progressive enhancement. */
#brand-intro{position:fixed;inset:0;z-index:1000;background:var(--cream);display:none;align-items:center;justify-content:center;flex-direction:column;overflow:hidden}
html.brand-intro-active #brand-intro{display:flex!important}
html.brand-intro-active{overflow:hidden}
.brand-intro-mark{font-family:var(--serif);font-size:clamp(180px,25vw,300px);font-weight:400;line-height:.95;letter-spacing:-18px;padding-right:15px;color:var(--wine);animation:brand-mark-in .8s cubic-bezier(.22,.8,.25,1) both}
.brand-intro-name{font-family:var(--sans);font-size:11px;letter-spacing:4.7px;color:var(--wine);margin-top:27px;padding-left:5px;animation:brand-name-in .65s .25s cubic-bezier(.22,.8,.25,1) both}
.brand-intro-skip{position:absolute;top:25px;right:32px;min-height:44px;border:0;border-bottom:1px solid var(--line);background:transparent;color:var(--muted);font-size:11px;padding:10px 0;transition:color .2s,border-color .2s}
.brand-intro-skip:is(:hover,:focus-visible){color:var(--wine);border-color:var(--wine)}
html.brand-intro-leaving #brand-intro{animation:brand-veil-out .6s .1s linear both;pointer-events:auto}
html.brand-intro-leaving .brand-intro-mark{animation:brand-mark-out .55s cubic-bezier(.22,.8,.25,1) both}
html.brand-intro-leaving .brand-intro-name{animation:brand-name-out .35s linear both}
@keyframes brand-mark-in{from{opacity:0;transform:translateY(18px) scale(.94)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes brand-name-in{from{opacity:0;letter-spacing:6px;transform:translateY(7px)}to{opacity:1;letter-spacing:4.7px;transform:translateY(0)}}
@keyframes brand-mark-out{from{opacity:1;transform:translateY(0) scale(1)}to{opacity:0;transform:translateY(-15px) scale(1.07)}}
@keyframes brand-name-out{from{opacity:1}to{opacity:0}}
@keyframes brand-veil-out{from{opacity:1}to{opacity:0}}

/* All hyperlinks share a visible response, adapted to their role. Navigation stays native. */
a[data-motion-link]{transition:color .22s var(--ease),background-color .22s var(--ease),background-size .28s var(--ease),border-color .22s var(--ease),transform .22s var(--ease),box-shadow .22s var(--ease)}
a[data-motion-link="text"],a[data-motion-link="nav"],a[data-motion-link="skip"]{background-image:linear-gradient(currentColor,currentColor);background-repeat:no-repeat;background-position:left 100%;background-size:0 1px}
a:is([data-motion-link="text"],[data-motion-link="nav"],[data-motion-link="skip"]):is(:hover,:focus-visible){background-size:100% 1px;color:var(--wine)}
.desktop-nav a[data-motion-link="nav"]:after{content:none}
.mobile-menu>a[data-motion-link="nav"]{align-self:flex-start}
a[data-motion-link="brand"] .logo-symbol{transition:transform .3s var(--ease)}
a[data-motion-link="brand"] .wordmark-text{transition:color .25s var(--ease)}
a[data-motion-link="brand"]:is(:hover,:focus-visible) .logo-symbol{transform:rotate(-3deg) scale(1.035)}
a[data-motion-link="brand"]:is(:hover,:focus-visible) .wordmark-text{color:var(--wine)}
a[data-motion-link="button"]:is(:hover,:focus-visible),button.button:is(:hover,:focus-visible){transform:translateY(-3px);box-shadow:0 9px 22px #46232c16}
a[data-motion-link="button"]:active,button.button:active{transform:translateY(0) scale(.98);box-shadow:none}
a[data-motion-link="text"].back-top:is(:hover,:focus-visible){transform:translateY(-3px)}
a[data-motion-link="text"].resource-download:is(:hover,:focus-visible){transform:translateX(3px)}
a[data-motion-link] .arrow-icon,.button .arrow-icon,.text-link .arrow-icon,.service-link .arrow-icon{transition:transform .24s var(--ease)}
a[data-motion-link]:is(:hover,:focus-visible) .arrow-icon,.button:is(:hover,:focus-visible) .arrow-icon{transform:translate(2px,-2px)}
.text-link,.service-link,.privacy-inline,.footer-bottom button,.resource-tabs button{transition:color .22s var(--ease),border-color .22s var(--ease),background-color .22s var(--ease),transform .22s var(--ease)}
.text-link:is(:hover,:focus-visible),.service-link:is(:hover,:focus-visible),.privacy-inline:is(:hover,:focus-visible),.footer-bottom button:is(:hover,:focus-visible){color:var(--wine);border-color:var(--wine)}
.text-link:active,.service-link:active,.privacy-inline:active{transform:translateY(1px)}
.resource-tabs button{position:relative}
.resource-tabs button:is(:hover,:focus-visible){transform:translateY(-2px)}
.resource-tabs button:active{transform:translateY(0)}
.resource-case,.resource-guide,.guide-option,.service-card{transition:transform .3s var(--ease),box-shadow .3s var(--ease),background-color .25s var(--ease),border-color .25s var(--ease)}
.resource-case:is(:hover,:focus-visible),.resource-guide:focus-within,.resource-guide:hover,.guide-option:is(:hover,:focus-visible),.service-card:hover{transform:translateY(-4px);box-shadow:0 12px 24px #46232c12}
.resource-case:active,.guide-option:active{transform:translateY(-1px)}
.resource-guide>button{transition:color .25s var(--ease)}
.resource-guide>button:is(:hover,:focus-visible){color:var(--wine)}
.resource-download>span{transition:transform .25s var(--ease)}
.resource-download:is(:hover,:focus-visible)>span{transform:translateY(3px)}

/* Entrance and scroll reveals use opacity and small movements without shifting layout. */
.intro-content-reveal .hero-copy>.eyebrow,.intro-content-reveal .hero-copy>h1,.intro-content-reveal .hero-description,.intro-content-reveal .hero-actions,.intro-content-reveal .hero-details,.intro-content-reveal .hero-visual{animation:site-content-in .75s var(--ease) both}
.intro-content-reveal .hero-copy>.eyebrow{animation-delay:.1s}
.intro-content-reveal .hero-copy>h1{animation-delay:.2s}
.intro-content-reveal .hero-description{animation-delay:.3s}
.intro-content-reveal .hero-actions{animation-delay:.4s}
.intro-content-reveal .hero-details{animation-delay:.5s}
.intro-content-reveal .hero-visual{animation-delay:.25s}
html.motion-enhanced [data-motion-reveal]{transition:opacity .6s var(--ease) var(--reveal-delay,0ms),translate .6s var(--ease) var(--reveal-delay,0ms),transform .3s var(--ease),background-color .25s var(--ease),border-color .25s var(--ease),box-shadow .3s var(--ease)}
html.motion-enhanced [data-motion-reveal="pending"]{opacity:0;translate:0 18px}
html.motion-enhanced [data-motion-reveal="visible"]{opacity:1;translate:0 0}
[data-resource-panel]:not([hidden]),.guide-option,dialog[open] .dialog-content{animation:site-panel-in .3s var(--ease) both}
@keyframes site-content-in{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}
@keyframes site-panel-in{from{opacity:.35}to{opacity:1}}
@media(hover:none){a[data-motion-link="button"]:hover,button.button:hover,.resource-case:hover,.resource-guide:hover,.guide-option:hover,.service-card:hover{transform:none;box-shadow:none}}
@media(max-width:680px){.brand-intro-skip{right:22px;top:18px}.brand-intro-mark{font-size:210px;letter-spacing:-15px}.brand-intro-name{font-size:10px;letter-spacing:4px}}
@media(prefers-reduced-motion:reduce){#brand-intro{display:none!important}html.brand-intro-active{overflow:auto}a[data-motion-link],a[data-motion-link] *,button,.button *,.resource-guide,.service-card,[data-motion-reveal]{animation:none!important;transition:none!important;transform:none!important;translate:none!important}.intro-content-reveal .hero-copy>*,.intro-content-reveal .hero-visual,[data-resource-panel],.guide-option,dialog .dialog-content{animation:none!important;opacity:1!important}html.motion-enhanced [data-motion-reveal]{opacity:1!important;translate:none!important}}
@media print{#brand-intro{display:none!important}html.brand-intro-active{overflow:visible}html.motion-enhanced [data-motion-reveal]{opacity:1!important;translate:none!important}*{animation:none!important;transition:none!important}}