:root { --background:#071419; --foreground:#fffaf0; --primary:#ff5b3d; --accent:#ffd166; --card:#0d2027; --border:#ffffff2b; --radius:1.5rem; }
@theme inline { --color-background:var(--background); --color-foreground:var(--foreground); --color-primary:var(--primary); --color-accent:var(--accent); --font-sans:var(--font-body); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--background); color:var(--foreground); font-family:Arial,sans-serif; }
a { color:inherit; text-decoration:none; }
.site-shell { min-height:100svh; position:relative; isolation:isolate; overflow:hidden; display:grid; grid-template-rows:auto 1fr; padding:clamp(1.25rem,3vw,3rem) clamp(1.25rem,5vw,5rem); }
.hero-image { position:absolute; inset:0; z-index:-4; background-image:url('../media/rural-festival-hero.png'); background-position:center; background-size:cover; background-repeat:no-repeat; transform:scale(1.03); transition:opacity .7s ease; }
.hero-image[data-season="autumn"] { background-image:url('../media/season-autumn.png'); }
.hero-image[data-season="christmas"] { background-image:url('../media/season-christmas.png'); }
.hero-image[data-season="newyear"] { background-image:url('../media/season-newyear.png'); }
.hero-image[data-season="winter"] { background-image:url('../media/season-winter.png'); }
.color-wash { position:absolute; inset:0; z-index:-3; background:linear-gradient(90deg,rgba(2,13,17,.95) 0%,rgba(4,19,24,.72) 45%,rgba(4,17,22,.18) 77%),linear-gradient(0deg,rgba(3,13,17,.9) 0%,transparent 55%); }
.grain { position:absolute; inset:0; z-index:-2; opacity:.16; pointer-events:none; background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.45'/%3E%3C/svg%3E"); mix-blend-mode:soft-light; }
.topbar { display:flex; align-items:center; z-index:2; }
.brand { display:flex; align-items:center; gap:.75rem; font-size:clamp(1.45rem,2vw,2rem); font-weight:800; letter-spacing:-.06em; }
.brand-dot { color:var(--primary); }
.brand-copy { display:flex; flex-direction:column; line-height:1; }
.brand-copy small { margin-top:.42rem; color:var(--accent); font-size:clamp(.58rem,.7vw,.72rem); font-weight:750; letter-spacing:.08em; text-transform:none; }
.brand-mark { width:2.25rem; height:2.25rem; display:flex; align-items:flex-end; justify-content:center; gap:3px; padding:.45rem; border-radius:50%; background:var(--primary); box-shadow:0 0 35px #ff5b3d55; }
.brand-mark i { display:block; width:4px; border-radius:5px; background:#fff; transform-origin:bottom; animation:equalize 1.4s ease-in-out infinite alternate; }
.brand-mark i:nth-child(1){height:40%}.brand-mark i:nth-child(2){height:90%;animation-delay:.25s}.brand-mark i:nth-child(3){height:60%;animation-delay:.5s}
.status { display:flex; align-items:center; gap:.6rem; padding:.55rem .8rem; border:1px solid var(--border); border-radius:999px; background:#07141966; backdrop-filter:blur(12px); color:#e8eee9; font-size:.84rem; }
.status i { width:.45rem; height:.45rem; background:#75e6a4; border-radius:50%; box-shadow:0 0 0 .25rem #75e6a421; }
.hero { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:clamp(2.8rem,7vh,5.5rem); padding:clamp(3rem,7vh,6rem) 0; text-align:center; }
.hero-copy { max-width:65rem; }
.eyebrow { margin:0 0 1rem; color:var(--accent); font-size:.78rem; font-weight:800; letter-spacing:.22em; text-transform:uppercase; }
h1 { margin:0; font-size:clamp(4rem,9vw,9rem); line-height:.82; letter-spacing:-.075em; font-weight:860; text-wrap:balance; }
h1 em { color:var(--primary); font-family:Georgia,serif; font-weight:500; }
.intro { max-width:40rem; margin:clamp(1.6rem,3vw,2.8rem) 0 0; font-size:clamp(1rem,1.4vw,1.25rem); line-height:1.65; color:#d9e0dc; }
.countdown-wrap { width:min(100%,78rem); }
.pulse { width:.55rem; height:.55rem; background:var(--primary); border-radius:50%; animation:pulse 1.6s infinite; }
.countdown { margin-top:3rem;display:grid; grid-template-columns:1fr 1fr 1fr 1fr; align-items:start; gap:clamp(.5rem,1.8vw,2.1rem); }
.countdown b { font-size:clamp(3.5rem,7vw,7rem); line-height:.78; color:#ffffff80; font-weight:200; }
.time-unit { min-width:0; text-align:center; border-right:5px solid #ffffff22; }
.time-unit:last-child { border-right:0; }
.time-unit strong { display:block; font-size:clamp(4rem,8.5vw,9rem); line-height:.78; letter-spacing:-.07em; font-variant-numeric:tabular-nums; transition:transform .25s,color .25s; text-shadow:0 .25rem 2rem #0008; }
.time-unit strong.is-changing { transform:translateY(-.12rem); color:var(--accent); }
.time-unit span { display:block; margin-top:1rem; color:#dfe6e2; font-size:clamp(.62rem,.9vw,.82rem); text-transform:uppercase; letter-spacing:.16em; }
.countdown-card>p { margin:1rem 0 0; color:#acbab6; font-size:.86rem; line-height:1.55; }
.footer { display:flex; align-items:flex-end; justify-content:space-between; gap:2rem; padding-top:1.4rem; border-top:1px solid #ffffff22; }
.tags { display:flex; flex-wrap:wrap; gap:.55rem; }
.tags span { padding:.45rem .7rem; border:1px solid #ffffff26; border-radius:999px; color:#d5deda; background:#06121766; font-size:.72rem; }
.footer p { margin:0; max-width:20rem; text-align:right; color:#aeb9b5; font:italic .95rem/1.4 Georgia,serif; }
.reveal { opacity:0; transform:translateY(16px); transition:opacity .75s ease,transform .75s cubic-bezier(.2,.8,.2,1); }
.reveal.is-visible { opacity:1; transform:none; }
@keyframes pulse { 0%{box-shadow:0 0 0 0 #ff5b3d88} 70%{box-shadow:0 0 0 .7rem transparent} 100%{box-shadow:0 0 0 0 transparent} }
@keyframes equalize { to{transform:scaleY(.45)} }
@media(max-width:900px){.hero{gap:3.5rem}h1{font-size:clamp(4rem,15vw,7rem)}.countdown{gap:clamp(.2rem,1vw,.7rem)}.time-unit strong{font-size:clamp(3rem,12vw,6rem)}.countdown b{font-size:clamp(2.6rem,9vw,4.8rem)}}
@media(max-width:600px){.site-shell{padding:1.1rem;min-height:100svh}.brand{font-size:1.3rem}.brand-mark{width:2rem;height:2rem}.hero{padding:3rem 0;gap:3rem}.eyebrow{font-size:.68rem}.countdown{gap:.12rem}.time-unit strong{font-size:clamp(2.35rem,12.5vw,4rem)}.countdown b{font-size:clamp(2rem,9vw,3rem)}.time-unit span{font-size:.5rem;letter-spacing:.06em;margin-top:.65rem}.color-wash{background:linear-gradient(0deg,rgba(3,13,17,.86),rgba(3,13,17,.38))}.hero-image{background-position:62% center}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}.reveal{opacity:1;transform:none}}
