/* One Loudoun Motion Edition — understated, editorial motion.
   Animations progressively enhance the website; all content is available without JS. */
:root{--ease-lux:cubic-bezier(.22,1,.36,1);--ease-soft:cubic-bezier(.33,1,.68,1)}
html{scroll-padding-top:90px}
body{overflow-x:clip}
.skip-link{position:fixed;z-index:301;top:10px;left:10px;background:#241a14;color:#fff;padding:12px 22px;transform:translateY(-160%);transition:transform .25s}
.skip-link:focus{transform:translateY(0)}
/* Navigation becomes a light glass surface as the page scrolls. */
.site-header{position:sticky;top:0;z-index:60;transition:box-shadow .5s var(--ease-lux),background-color .5s var(--ease-lux);background:rgba(251,247,241,.96)}
.site-header.is-scrolled{background:rgba(253,249,243,.91);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);box-shadow:0 12px 45px rgba(58,39,22,.085)}
.scroll-progress{position:absolute;height:2px;bottom:-1px;left:0;right:0;pointer-events:none;overflow:hidden}
.scroll-progress span{height:100%;width:100%;display:block;background:linear-gradient(90deg,#9c7031,#e0b878,#a67934);transform:scaleX(0);transform-origin:left center;will-change:transform}
.main-nav a:after{height:1px!important;left:0;right:0;background:var(--gold);transform:scaleX(0);transform-origin:center;transition:transform .4s var(--ease-lux);content:"";position:absolute;bottom:18px}
.main-nav a.active:after,.main-nav a:hover:after{transform:scaleX(1)}
.wordmark span{transition:color .5s ease,letter-spacing .55s var(--ease-lux)}
.wordmark:hover span{color:#8e6939;letter-spacing:-.025em}
.mobile-nav:not([hidden]){transform-origin:top;animation:mobileReveal .43s var(--ease-lux) both}
@keyframes mobileReveal{from{opacity:0;transform:translateY(-13px)}to{opacity:1;transform:translateY(0)}}
/* Cinematic hero: single photograph, gentle movement, sequential type entrance. */
.hero-home{isolation:isolate}
.hero-image{inset:-24px 0 -24px 39%;transform:translate3d(0,var(--hero-shift,0px),0);transition:transform .1s linear;will-change:transform}
.hero-image img{animation:heroPush 15s var(--ease-lux) both;transform-origin:57% 45%}
@keyframes heroPush{0%{transform:scale(1.13);filter:saturate(.67) sepia(.18)}100%{transform:scale(1.02);filter:saturate(.76) sepia(.12)}}
.hero-shade{opacity:0;animation:heroShade .95s .15s var(--ease-soft) forwards}
@keyframes heroShade{to{opacity:1}}
.hero-copy{position:relative}
.hero-line{display:block;overflow:hidden;padding-bottom:.07em;margin-bottom:-.07em}
.hero-line>span{display:block;transform:translate3d(0,115%,0);opacity:.4;animation:heroTitle .95s .32s var(--ease-lux) forwards}
.hero-line:nth-child(2)>span{animation-delay:.47s}
@keyframes heroTitle{to{transform:translate3d(0,0,0);opacity:1}}
.hero-copy>.eyebrow,.hero-copy>p,.hero-copy>.button{opacity:0;transform:translate3d(0,18px,0);animation:softRise .95s var(--ease-lux) forwards}
.hero-copy>.eyebrow{animation-delay:.19s}.hero-copy>p{animation-delay:.74s}.hero-copy>.button{animation-delay:.9s}
@keyframes softRise{to{opacity:1;transform:translate3d(0,0,0)}}
.hero-side-note{opacity:0;animation:noteReveal .8s 1.1s var(--ease-lux) forwards}
@keyframes noteReveal{to{opacity:1}}
.hero-bottom-note{display:inline-flex;gap:9px;align-items:center;text-decoration:none;white-space:nowrap;transition:color .3s}
.hero-bottom-note span{display:inline-block;margin:0;animation:scrollCue 1.9s ease-in-out infinite}
.hero-bottom-note:hover{color:var(--gold-deep)}
@keyframes scrollCue{0%,100%{transform:translateY(-2px);opacity:.6}55%{transform:translateY(5px);opacity:1}}
/* A quiet, moving editorial ribbon. */
.editorial-ticker{position:relative;z-index:1;background:#e9dece;border-top:1px solid #d9c5aa;border-bottom:1px solid #d9c5aa;padding:17px 0;overflow:hidden}
.ticker-track{width:max-content;display:flex;align-items:center;animation:ticker 37s linear infinite;will-change:transform}
.ticker-phrase{display:flex;align-items:center;gap:33px;padding-right:33px;white-space:nowrap;color:#7f643f;font-family:var(--serif);font-size:26px;letter-spacing:.065em;line-height:1}
.ticker-phrase span{font-family:Georgia,serif;font-size:13px;color:#b39161}
.editorial-ticker:hover .ticker-track{animation-play-state:paused}
@keyframes ticker{to{transform:translateX(-50%)}}
/* Directional hover motion: gold line and clean image framing. */
.button{position:relative;isolation:isolate;overflow:hidden;transition:background .4s,color .4s,transform .45s var(--ease-lux),box-shadow .4s,border-color .4s}
.button::before{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 18%,rgba(255,255,255,.21) 50%,transparent 80%);transform:translateX(-160%) skewX(-12deg);transition:transform .9s var(--ease-lux);pointer-events:none;z-index:-1}
.button:hover::before{transform:translateX(140%) skewX(-12deg)}
.button:hover{transform:translateY(-3px);box-shadow:0 12px 26px rgba(87,55,21,.17)}
.button svg,.text-link svg,.circle-link svg,.round-arrow svg{transition:transform .45s var(--ease-lux)}
.button:hover svg,.text-link:hover svg,.circle-link:hover svg,.round-arrow:hover svg{transform:translateX(3px)}
.text-link{position:relative}
.text-link::after{content:"";width:0;position:absolute;left:0;bottom:-5px;height:1px;background:var(--gold);transition:width .55s var(--ease-lux)}
.text-link:hover::after{width:calc(100% - 33px)}
.category-card .image-wrap{position:relative;isolation:isolate}
.category-card .image-wrap::after{content:"";position:absolute;inset:0;border:1px solid rgba(255,255,255,.48);opacity:0;transform:scale(.95);transition:transform .7s var(--ease-lux),opacity .7s;pointer-events:none}
.category-card:hover .image-wrap::after{opacity:1;transform:scale(.94)}
.category-card .category-bottom h3{transition:color .4s}
.category-card:hover .category-bottom h3{color:var(--gold-deep)}
.category-image img,.place-photo img,.story-image img,.final-photo img,.about-photo img,.banner-visual img,.internal-hero-photo img{transition:transform 1.1s var(--ease-lux),filter .9s var(--ease-lux)}
.category-card:hover .category-image img,.place-card:hover .place-photo img{transform:scale(1.085)!important;filter:saturate(.9)}
.place-card{transition:transform .55s var(--ease-lux),box-shadow .5s}
.place-card:hover{transform:translateY(-7px);box-shadow:0 21px 43px rgba(74,53,32,.125)}
.place-photo{overflow:hidden}
.favorite{transition:background .35s,transform .4s var(--ease-lux),box-shadow .35s}
.favorite:hover{transform:scale(1.12);box-shadow:0 5px 18px rgba(0,0,0,.14)}
.icon-button svg{transition:transform .35s var(--ease-lux)}
.icon-button:hover svg{transform:scale(1.08)}
/* Entrance and scroll reveals: only elements which JS can observe are hidden. */
.motion-ready .reveal-target{opacity:0;transform:translate3d(0,35px,0);transition:opacity 1s var(--ease-lux),transform 1.1s var(--ease-lux);transition-delay:var(--reveal-delay,0ms);will-change:opacity,transform}
.motion-ready .reveal-target.is-inview{opacity:1;transform:translate3d(0,0,0);will-change:auto}
.motion-ready .reveal-target.reveal-image{opacity:0;transform:translate3d(0,16px,0) scale(.975)}
.motion-ready .reveal-target.reveal-image.is-inview{opacity:1;transform:translate3d(0,0,0) scale(1)}
.story-image{overflow:hidden}
.banner-visual{transform:translate3d(0,var(--banner-shift,0px),0);will-change:transform}
.banner-visual img{transform:scale(1.075)}
.story-image img{transform:scale(1.06)}
/* Inner page introduction is coordinated with home hero. */
.internal-hero-content .eyebrow,.internal-hero-content .breadcrumbs,.internal-hero-content h1,.internal-hero-content p{animation:softRise .85s var(--ease-lux) both}
.internal-hero-content .breadcrumbs{animation-delay:.05s}
.internal-hero-content .eyebrow{animation-delay:.11s}
.internal-hero-content h1{animation-delay:.24s}
.internal-hero-content p{animation-delay:.38s}
.internal-hero-photo img{animation:heroPush 12s var(--ease-lux) both}
/* Small utility: a fast-return-to-top control. */
.back-to-top{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:1px;position:fixed;right:22px;bottom:22px;z-index:52;width:56px;height:56px;border:1px solid rgba(180,148,105,.55);border-radius:50%;color:#fff;background:#32271e;box-shadow:0 8px 28px rgba(54,31,14,.18);opacity:0;pointer-events:none;transform:translateY(18px);transition:opacity .4s,transform .5s var(--ease-lux),background .35s}
.back-to-top svg{transform:rotate(-90deg);width:18px;height:18px}
.back-to-top span{font-size:8px;font-weight:700;letter-spacing:.15em}
.back-to-top.is-visible{opacity:1;pointer-events:auto;transform:translateY(0)}
.back-to-top:hover{background:var(--gold-deep);transform:translateY(-5px)}
/* Search panel and transitions */
.search-overlay:not([hidden]) .search-backdrop{animation:fadeIn .35s both}
.search-overlay:not([hidden]) .search-panel{animation:searchArrive .55s var(--ease-lux) both}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
@keyframes searchArrive{from{opacity:0;transform:translate3d(0,30px,0) scale(.97)}to{opacity:1;transform:translate3d(0,0,0) scale(1)}}
main{animation:pageEnter .48s var(--ease-lux) both}
@keyframes pageEnter{from{opacity:.84}to{opacity:1}}
body.page-leaving main{opacity:0;transform:translateY(9px);transition:opacity .19s,transform .2s}
body.page-leaving .site-header{opacity:.9;transition:opacity .2s}
/* Decorative dividers and careful editorial detail. */
.section-heading .eyebrow::before,.split-heading .eyebrow::before,.story-copy .eyebrow::before,.footer-cta .eyebrow::before{content:"";display:inline-block;width:20px;height:1px;vertical-align:middle;margin-right:10px;background:currentColor;opacity:.7}
.section-heading .eyebrow::before{display:none}
.site-footer a{transition:color .3s}
.site-footer a:hover{color:#bf965e}
/* Mobile reduces continuous effects, while preserving elegant entrance. */
@media(max-width:850px){.hero-image{left:27%;right:0}.editorial-ticker{padding:14px 0}.ticker-phrase{font-size:21px;gap:24px;padding-right:24px}.back-to-top{width:49px;height:49px;right:15px;bottom:17px}}
@media(max-width:590px){.hero-image{inset:-14px 0 -14px 5%}.hero-copy h1{letter-spacing:-.06em}.ticker-phrase{font-size:18px;gap:18px;padding-right:18px}.editorial-ticker{padding:12px 0}.back-to-top{right:13px;bottom:14px;width:45px;height:45px}.back-to-top span{font-size:7px}}
/* Accessibility: a motion-free experience on request. */
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto!important}.hero-image,.banner-visual{transform:none!important}.hero-image img,.internal-hero-photo img,.hero-copy>.eyebrow,.hero-copy>p,.hero-copy>.button,.hero-line>span,.hero-side-note,.internal-hero-content *{animation:none!important;opacity:1!important;transform:none!important}.hero-shade{animation:none!important;opacity:1!important}.ticker-track{animation:none!important}.motion-ready .reveal-target{opacity:1!important;transform:none!important}.back-to-top{transition:none!important}body.page-leaving main{opacity:1!important;transform:none!important}.hero-bottom-note span{animation:none!important}}