/* VATRA COLIBIȚA — Visual Experience v1.2.0
   Shared design enhancements; per-page treatments live in assets/css/pages/.
   Motion is opt-in for capable devices and reduced for accessibility. */
:root{--v-ease:cubic-bezier(.19,1,.22,1);--v-gold:#e0c099;--v-forest:#153945;--v-teal:#2b6871;--v-shadow:0 28px 72px rgba(14,44,52,.13)}
body{background:radial-gradient(ellipse at 92% 10%,rgba(227,211,187,.18),transparent 33%),#faf9f5}
main{overflow:clip}
::selection{background:#dfc29a;color:#173743}
.site-header{border-bottom-color:rgba(20,58,67,.08);box-shadow:0 4px 25px rgba(25,51,49,.025)}
.site-header.scrolled{box-shadow:0 13px 50px rgba(13,46,53,.10)}
.brand img{transition:transform .55s var(--v-ease),width .3s,height .3s}
.brand:hover img{transform:translateY(-2px) scale(1.045)}
.nav-links>a::before{content:'';position:absolute;top:-12px;left:50%;width:4px;height:4px;background:var(--sand);border-radius:50%;opacity:0;transform:translate(-50%,5px);transition:opacity .3s,transform .4s var(--v-ease)}
.nav-links>a:hover::before,.nav-links>a[aria-current="page"]::before{opacity:1;transform:translate(-50%,0)}
.nav-cta{position:relative;isolation:isolate;overflow:hidden;box-shadow:0 10px 21px rgba(20,59,70,.12)}
.nav-cta::after{content:'';position:absolute;inset:0;background:linear-gradient(100deg,transparent,rgba(255,255,255,.22),transparent);transform:translateX(-140%);transition:transform .7s var(--v-ease);z-index:-1}
.nav-cta:hover::after{transform:translateX(140%)}
.button{position:relative;overflow:hidden;isolation:isolate;box-shadow:0 6px 20px rgba(10,42,49,.08)}
.button::after{content:'';position:absolute;top:0;left:-150%;width:65%;height:100%;transform:skewX(-24deg);background:linear-gradient(90deg,transparent,rgba(255,255,255,.23),transparent);transition:left .75s var(--v-ease);pointer-events:none}
.button:hover::after{left:160%}
.text-link{transition:color .3s,border-color .3s}.text-link:hover{color:#a27d52}
.eyebrow-line{transform-origin:left center;animation:lineBreath 4s ease-in-out infinite alternate}
.editorial-index{display:block;color:#b18e66;font-size:10px;letter-spacing:.22em;font-weight:800;margin-bottom:26px}
/* Reusable brand mark: always the real editable logo image, never recreated as HTML letters. */
.brand-overlay{position:absolute;z-index:6;background:rgba(255,253,247,.97);border:1px solid rgba(255,255,255,.75);border-radius:13px;box-shadow:0 23px 75px rgba(4,27,36,.23),0 0 0 1px rgba(11,53,62,.03) inset;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:12px 25px 14px;isolation:isolate;overflow:hidden;transform-origin:50% 60%;animation:brandArrive 1.25s .2s var(--v-ease) both}
.brand-overlay::before{content:'';position:absolute;inset:-95%;background:conic-gradient(from 40deg,transparent 0 32%,rgba(224,189,143,.17) 41%,transparent 49% 100%);animation:brandShimmer 16s linear infinite;z-index:-1;pointer-events:none}
.brand-overlay img{display:block;width:100%;height:auto;object-fit:contain;mix-blend-mode:multiply}
.brand-overlay__kicker{font-size:8px;letter-spacing:.27em;font-weight:800;color:#b78e63;margin-bottom:3px}
.brand-overlay__line{display:flex;align-items:center;justify-content:center;gap:12px;color:#bb976d;width:100%;font-family:Georgia,serif;font-size:11px;line-height:1}
.brand-overlay__line i{display:block;height:1px;width:26%;background:linear-gradient(90deg,transparent,#cda982)}
.brand-overlay__line i:last-child{transform:scaleX(-1)}
/* Global photographic surfaces and entrance animations */
.visual-parallax{--parallax-y:0px;transform:translate3d(0,var(--parallax-y),0) scale(1.055);will-change:transform}
.hero-photo.visual-parallax{animation:heroReveal 1.8s var(--v-ease) both;transform:translate3d(0,var(--parallax-y),0) scale(1.055);animation-name:photoFadeIn}
.inner-hero-media.visual-parallax{transform:translate3d(0,var(--parallax-y),0) scale(1.085)}
.photo-label{border:1px solid rgba(213,181,144,.3);animation:labelFloat 5.5s ease-in-out infinite alternate}
.scenery-photo,.simple-editorial-photo{transition:transform 1.1s var(--v-ease),box-shadow .6s var(--v-ease),filter .6s var(--v-ease)}
.scenery-photo-wrap:hover .scenery-photo{transform:scale(1.025);filter:saturate(1.11)}
.simple-editorial-photo:hover{transform:scale(1.012);box-shadow:23px 23px 0 #eadcca}
.nature-tags span{transition:background .35s,border-color .35s,color .35s,transform .4s var(--v-ease)}
.nature-tags span:hover{background:#173d49;color:#fff;border-color:#173d49;transform:translateY(-3px)}
/* Animated chapter dividers, editorial atmosphere */
.chapter-break{display:flex;align-items:center;justify-content:center;gap:30px;padding:0 20px 70px;color:#a68660}
.chapter-break span{height:1px;max-width:220px;flex:1;background:linear-gradient(90deg,transparent,#d9c8b1)}
.chapter-break span:last-child{transform:scaleX(-1)}
.chapter-break strong{font-size:10px;letter-spacing:.28em;font-weight:750;white-space:nowrap}
.social-card{isolation:isolate;will-change:transform;transform-style:preserve-3d}
.social-card::after{content:'';position:absolute;inset:0;opacity:0;background:radial-gradient(420px circle at var(--pointer-x,50%) var(--pointer-y,30%),rgba(234,213,184,.25),transparent 60%);pointer-events:none;z-index:-1;transition:opacity .4s}
.social-card:hover::after{opacity:1}
.social-card:hover{transform:translateY(-13px)}
.qr-wrap{transition:border-color .4s,box-shadow .45s var(--v-ease),transform .45s var(--v-ease)}
.social-card:hover .qr-wrap{box-shadow:0 15px 32px rgba(23,62,72,.08);transform:translateY(-2px)}
.card-top .platform-dot{box-shadow:0 0 0 5px rgba(207,179,151,.12);animation:dotPulse 3.2s ease-in-out infinite}
.social-card:nth-child(2) .platform-dot{animation-delay:.65s}.social-card:nth-child(3) .platform-dot{animation-delay:1.3s}
.contact-section{box-shadow:0 29px 80px rgba(9,42,50,.14);isolation:isolate}
.contact-section::after{animation:contactGlow 15s ease-in-out infinite alternate}
.contact-curve{animation:slowOrbit 28s linear infinite;transform-origin:50% 50%}
.contact-row{transition:padding-left .35s var(--v-ease),border-color .3s}
.contact-row:hover{padding-left:8px;border-color:rgba(245,220,177,.55)}
.contact-icon{transition:background .35s,color .35s,transform .35s}
.contact-row:hover .contact-icon{background:#e7c69b;color:#163744;transform:rotate(-9deg)}
/* Interior hero component: the same visual signature on every page */
.inner-page-hero{height:clamp(530px,44vw,635px);isolation:isolate;box-shadow:0 14px 45px rgba(13,39,47,.09)}
.inner-hero-shade{background:linear-gradient(92deg,rgba(7,27,38,.9) 0%,rgba(7,27,38,.76) 40%,rgba(7,27,38,.1) 100%),linear-gradient(0deg,rgba(7,27,38,.45),transparent 44%)}
.inner-hero-copy{z-index:2;max-width:660px;animation:innerCopyEnter 1s .14s var(--v-ease) both}
.inner-hero-copy h1{font-family:var(--serif);font-size:clamp(52px,6.2vw,88px);line-height:1.08;max-width:690px}
.inner-hero-copy>p:last-of-type{max-width:550px}
.inner-hero-brand{top:42px;right:4%;width:235px;padding:7px 18px 10px}
.brand-overlay--inner{top:36px;right:4.4%;width:225px;padding:7px 18px 10px;animation-delay:.4s}
.brand-overlay--inner .brand-overlay__kicker{font-size:7px}
.brand-overlay--inner .brand-overlay__line{display:none}
.inner-hero-breadcrumb{display:flex;align-items:center;gap:12px;margin-top:35px;font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:#c9d9db;font-weight:700}
.inner-hero-breadcrumb a{transition:color .25s}.inner-hero-breadcrumb a:hover{color:#f1d09d}.inner-hero-breadcrumb>span:nth-child(2){color:#c4a884}
.hero-corner-number{position:absolute;right:27px;bottom:26px;z-index:3;font-size:10px;letter-spacing:.25em;font-weight:700;color:rgba(255,255,255,.6)}
.simple-editorial-text{position:relative}.simple-editorial-text::before{content:'';width:54px;height:2px;position:absolute;top:-32px;left:0;background:linear-gradient(90deg,#bf946c,#e6cfaf)}
.simple-editorial-photo{object-position:center center}
/* Soft footer improvements */
.footer-spacer{width:min(calc(100% - 72px),1370px);margin:85px auto 0;display:flex;align-items:center;gap:24px;color:#ab8b66;font-size:10px;letter-spacing:.25em;font-weight:800}
.footer-spacer__line{height:1px;background:linear-gradient(90deg,transparent,#dbd0bd);flex:1}.footer-spacer__line:last-child{transform:scaleX(-1)}
.footer{padding-top:44px}.footer-logo img{transition:transform .5s var(--v-ease)}.footer-logo:hover img{transform:translateY(-4px)}
.footer-social a{position:relative;padding:10px 0}.footer-social a::after{content:'';position:absolute;bottom:4px;left:0;width:0;height:1px;background:#b79669;transition:width .35s}.footer-social a:hover::after{width:100%}
.footer-bottom-links span a{transition:color .3s}.footer-bottom-links span a:hover{color:#a8794d}
.back-to-top{position:fixed;bottom:22px;right:22px;z-index:85;width:48px;height:48px;border:1px solid rgba(255,255,255,.45);border-radius:50%;background:rgba(18,55,67,.93);backdrop-filter:blur(12px);color:#f9e5c8;font-size:23px;box-shadow:0 15px 32px rgba(4,29,36,.16);cursor:pointer;opacity:0;visibility:hidden;transform:translateY(15px);transition:opacity .3s,transform .4s var(--v-ease),visibility .3s,background .3s}
.back-to-top.is-visible{opacity:1;visibility:visible;transform:translateY(0)}.back-to-top:hover{background:#bb9065;transform:translateY(-4px)}
/* Scroll reveals include graceful no-JS fallback. */
.has-js .reveal{transition-duration:1s;transition-timing-function:var(--v-ease)}
.has-js .reveal.visible{filter:none}
@keyframes brandArrive{from{opacity:0;transform:translateY(-19px) scale(.92);filter:blur(5px)}to{opacity:1;transform:translateY(0) scale(1);filter:blur(0)}}
@keyframes brandShimmer{to{transform:rotate(360deg)}}
@keyframes photoFadeIn{from{opacity:.35;filter:saturate(.62);transform:translate3d(0,18px,0) scale(1.09)}to{opacity:1;filter:saturate(1);transform:translate3d(0,var(--parallax-y),0) scale(1.055)}}
@keyframes innerCopyEnter{from{opacity:0;transform:translateY(calc(-50% + 23px));filter:blur(7px)}to{opacity:1;transform:translateY(-50%);filter:blur(0)}}
@keyframes lineBreath{from{transform:scaleX(.68);opacity:.55}to{transform:scaleX(1.2);opacity:1}}
@keyframes labelFloat{to{transform:translateY(calc(50% - 8px))}}
@keyframes dotPulse{0%,100%{box-shadow:0 0 0 5px rgba(207,179,151,.12)}50%{box-shadow:0 0 0 10px rgba(207,179,151,.02)}}
@keyframes contactGlow{0%{transform:translate(-2%,2%)}100%{transform:translate(4%,-3%)}}
@keyframes slowOrbit{to{transform:rotate(360deg)}}
@media(max-width:1100px){.inner-hero-copy{max-width:62%}.inner-hero-copy h1{font-size:clamp(48px,6.2vw,72px)}.brand-overlay--inner{width:190px;right:3%;top:34px}}
@media(max-width:870px){.inner-page-hero{height:590px}.brand-overlay--inner{width:175px;right:24px;top:27px}.inner-hero-copy{max-width:80%;top:auto;bottom:65px;transform:none;animation:none}.inner-hero-shade{background:linear-gradient(0deg,rgba(7,27,38,.9) 0%,rgba(7,27,38,.57) 48%,rgba(7,27,38,.08) 100%)}.inner-hero-breadcrumb{margin-top:22px}.nav-links>a::before{display:none}}
@media(max-width:600px){.footer-spacer{width:calc(100% - 28px);margin-top:55px;gap:14px;white-space:nowrap;font-size:9px}.brand-overlay--inner{width:155px;padding:5px 12px;top:16px;right:17px;border-radius:8px}.brand-overlay--inner .brand-overlay__kicker{font-size:6px;letter-spacing:.15em}.inner-page-hero{height:590px}.inner-hero-copy{bottom:48px;left:25px;max-width:calc(100% - 40px)}.inner-hero-copy h1{font-size:clamp(41px,10.7vw,64px)}.inner-hero-breadcrumb{font-size:8px}.hero-corner-number{right:15px;bottom:15px;font-size:8px}.chapter-break{padding-bottom:40px}.chapter-break strong{font-size:8px}.photo-label{animation:none}.contact-curve{animation-duration:42s}.back-to-top{right:14px;bottom:14px;width:43px;height:43px}}
/* Respect user's device motion preference and touch/low performance hardware */
@media(prefers-reduced-motion:reduce){.visual-parallax,.hero-photo.visual-parallax,.inner-hero-media.visual-parallax{will-change:auto;transform:none!important}.brand-overlay,.inner-hero-copy,.brand-overlay::before,.contact-section::after,.contact-curve,.photo-label,.eyebrow-line,.platform-dot,.hero-light{animation:none!important}.brand-overlay{opacity:1!important}.has-js .reveal{opacity:1;transform:none}}
@media(hover:none){.social-card{will-change:auto}.visual-parallax{will-change:auto}.nav-cta::after,.button::after{display:none}}
