@font-face{font-family:"Young Serif";src:url(../fonts/young-serif-latin-400-normal.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Albert Sans";src:url(../fonts/albert-sans-latin-wght-normal.woff2) format("woff2");font-weight:100 900;font-display:swap}
@font-face{font-family:"Caveat Brush";src:url(../fonts/caveat-brush-latin-400-normal.woff2) format("woff2");font-weight:400;font-display:swap}
:root{--plum:#2B1B2E;--oak:#6B4A2B;--cream:#F1E6CF;--gold:#E8B04A;--indigo:#1D1B3A;--hedge:#3f6a45;--ridge:#9a9bbd;--hedgeA:#5d6c72;--hedgeB:#3c4d50;--field:#84926f;--grass:#2c3d33;--sway:0deg;
--serif:"Young Serif",Georgia,serif;--sans:"Albert Sans",system-ui,sans-serif;--hand:"Caveat Brush","Comic Sans MS",cursive}
*{box-sizing:border-box;margin:0}
html{background:#0b0e1f;-webkit-text-size-adjust:100%}
body{font:400 17px/1.55 var(--sans);color:var(--cream);overflow-x:hidden}
a{color:inherit}
.skip{position:absolute;left:-999px;background:#fff;color:#000;padding:8px 12px;z-index:99}.skip:focus{left:8px;top:8px}
:focus-visible{outline:3px solid var(--gold);outline-offset:3px}

.top{position:fixed;inset:12px 12px auto;z-index:40;display:flex;justify-content:space-between;align-items:center;gap:12px;padding:8px 8px 8px 16px;border-radius:999px;background:rgba(247,240,226,.86);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);color:var(--plum);box-shadow:0 6px 24px rgba(20,10,30,.18);max-width:1200px;margin:0 auto}
.brand{display:flex;align-items:center;gap:9px;text-decoration:none;font:400 22px/1 var(--serif)}.brand svg{width:26px;height:26px}
.top__r{display:flex;align-items:center;gap:14px}
.clock{font:600 14px/1 var(--sans);font-variant-numeric:tabular-nums;letter-spacing:.06em;padding:0 4px}
.top__tel{font:700 15px/1 var(--sans);text-decoration:none;background:var(--plum);color:var(--cream);padding:11px 16px;border-radius:999px}
@media(max-width:480px){.clock{display:none}.top__tel{padding:11px 13px}}

/* stage */
.stage{position:relative;height:100svh;min-height:540px;overflow:hidden;background:#c9a8b4;isolation:isolate}
.sky{position:absolute;inset:0}
.far{position:absolute;left:0;top:0;height:100%;will-change:transform}
.far img{position:absolute;left:0;top:0;height:100%;max-width:none;opacity:0;object-fit:cover}
.far img:first-child{opacity:1}
.sun{position:absolute;left:12%;top:36%;width:36vmax;height:36vmax;transform:translate(-50%,-50%);background:radial-gradient(circle,rgba(255,214,160,.7),rgba(255,180,140,0) 62%);mix-blend-mode:screen;pointer-events:none}
.layer{position:absolute;left:0;top:0;height:100%;will-change:transform;pointer-events:none}
.layer svg{position:absolute;display:block}
.ridge svg{top:30%;fill:var(--ridge)}
.hedgeA svg{top:46%;fill:var(--hedgeA)}
.hedgeB svg{top:55%;-webkit-mask-image:linear-gradient(#000 70%,transparent);mask-image:linear-gradient(#000 70%,transparent);fill:var(--hedgeB)}
.field{position:absolute;left:0;right:0;top:78%;bottom:0;background:linear-gradient(180deg,transparent,var(--grass) 120%)}
.furrows{position:absolute;inset:0;background:repeating-linear-gradient(100deg,rgba(0,0,0,0) 0 70px,rgba(0,0,0,.07) 70px 130px,rgba(255,255,255,.05) 130px 190px);will-change:transform}
.title{top:0}
.title{padding:clamp(88px,16vh,150px) 0 0 clamp(20px,5vw,90px);width:max-content}
.kicker{font:600 12px/1.3 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--plum);margin-bottom:14px}
.title h1{font:400 clamp(50px,9.2vw,152px)/.96 var(--serif);color:var(--plum);letter-spacing:-.015em;text-shadow:0 2px 30px rgba(255,235,220,.5)}
.walk{margin-top:18px;display:inline-block;background:rgba(247,240,226,.78);padding:8px 14px;border-radius:999px;font:500 clamp(15px,1.3vw,19px)/1.4 var(--sans);color:var(--plum);max-width:22em;white-space:normal}
@media(max-width:700px){.title{width:100vw;padding-right:20px}.title h1{font-size:clamp(46px,15vw,80px)}.kicker{max-width:19em}}

/* fence */
.fence{top:0;pointer-events:auto}
.rail{position:absolute;left:0;right:0;height:clamp(9px,1.5svh,15px);background:linear-gradient(180deg,#8a6a45,#5d4128 60%,#3d2a18);box-shadow:0 5px 8px rgba(0,0,0,.28)}
.r1{top:67%}.r2{top:75%}
.post{position:absolute;top:60%;height:var(--h);width:clamp(15px,2.3vw,30px);background:linear-gradient(90deg,#8d6c47,#6b4a2b 45%,#3f2b18);transform:rotate(var(--lean));transform-origin:50% 100%;border-radius:3px 3px 1px 1px;box-shadow:6px 6px 10px rgba(0,0,0,.25);clip-path:polygon(0 12%,50% 0,100% 12%,100% 100%,0 100%)}
.tuft{position:absolute;left:0;top:calc(100% - 22svh);height:22svh;pointer-events:none;display:flex;align-items:flex-end}
.tuft svg{position:static;flex:none;height:100%;display:block;fill:var(--grass)}
.sign{--r:1;position:absolute;top:56%;width:clamp(290px,31vw,500px);transform-origin:50% 0;transform:rotate(calc(var(--sway)*-1));z-index:2}
.sign::before,.sign::after{content:"";position:absolute;top:-16px;width:3px;height:20px;background:#2a1c10;left:16%}
.sign::after{left:auto;right:16%}
.sign__b{position:relative;padding:clamp(14px,1.6vw,24px) clamp(18px,2vw,30px) clamp(16px,1.7vw,26px);background:linear-gradient(rgba(246,236,214,.58),rgba(246,236,214,.58)),url(../img/oak.webp) 30% 60%/190% auto;border-radius:6px;box-shadow:0 14px 26px rgba(20,10,10,.38),inset 0 0 0 3px rgba(60,40,20,.55),inset 0 0 22px rgba(80,50,20,.35);animation:swing 6s ease-in-out infinite alternate;transform-origin:50% -30px;min-height:clamp(124px,13.5vw,190px)}
.sign:nth-of-type(odd) .sign__b{animation-duration:7.3s;animation-delay:-2s}
.sign:nth-of-type(3n) .sign__b{background-position:80% 20%}
@keyframes swing{from{transform:rotate(-1.4deg)}to{transform:rotate(1.4deg)}}
.sign h2{font:400 clamp(38px,4.6vw,76px)/.92 var(--hand);color:#2a1a0e;letter-spacing:.005em;transform:rotate(-1.5deg)}
.sign p{font:400 clamp(18px,1.75vw,27px)/1.15 var(--hand);color:#3b2412;margin-top:8px;max-width:20em}
.ink{display:block;clip-path:inset(-10% calc(100% - var(--r)*100%) -10% 0);-webkit-clip-path:inset(-10% calc(100% - var(--r)*100%) -10% 0)}
.sign--tel .sign__b{background-color:#f0d68e}
.gate{position:absolute;top:56%;height:25%;border-left:14px solid #4b331d;border-right:14px solid #4b331d}
.gate i{position:absolute;left:0;right:0;height:11px;background:#7c5a36;box-shadow:0 4px 6px rgba(0,0,0,.3)}
.gate i:nth-child(1){top:8%}.gate i:nth-child(2){top:26%}.gate i:nth-child(3){top:44%}.gate i:nth-child(4){top:62%}.gate i:nth-child(5){top:80%}
.gate b{position:absolute;left:0;right:0;top:12%;height:12px;background:#5d4128;transform-origin:0 50%;transform:rotate(26deg) scaleX(1.1)}

/* foreground */
.fgGrass{top:auto;bottom:-4px;height:30%;display:flex;align-items:flex-end;white-space:nowrap}
.fgGrass svg{position:static;flex:none;height:100%;fill:var(--grass);display:block}
.fgGrass svg{filter:blur(.4px)}
.sw{transform-origin:50% 100%;transform-box:fill-box;animation:sway 4.2s ease-in-out infinite alternate}
.sw1{animation-duration:5.1s;animation-delay:-1s}.sw2{animation-duration:3.7s;animation-delay:-2.2s}.sw3{animation-duration:4.8s;animation-delay:-.6s}.sw4{animation-duration:6s;animation-delay:-3s}
@keyframes sway{from{transform:skewX(-3deg)}to{transform:skewX(3.5deg)}}
.fgPosts{pointer-events:none}
.fgPosts i{position:absolute;top:-4%;bottom:-4%;background:linear-gradient(90deg,#4a3320,#2a1b0f 50%,#120a05);filter:blur(5px);opacity:.95;border-radius:6px}
.wash{position:absolute;inset:0;pointer-events:none;mix-blend-mode:multiply}
.grain{position:absolute;inset:0;pointer-events:none;opacity:.22;mix-blend-mode:overlay;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");box-shadow:inset 0 0 160px rgba(10,5,20,.4)}
.meter{position:absolute;left:50%;bottom:16px;width:min(420px,60vw);height:3px;transform:translateX(-50%);background:rgba(255,255,255,.35);border-radius:3px;overflow:hidden}
.meter i{position:absolute;inset:0;background:var(--gold);transform-origin:0 50%;transform:scaleX(0)}

/* contact */
.contact{position:relative;background:linear-gradient(#080a14,#0b0e1f 30%,#14122c);padding:clamp(80px,12vw,160px) clamp(20px,5vw,80px) 0;overflow:hidden}
.stars{position:absolute;inset:0 0 40%;pointer-events:none}
.stars i{position:absolute;width:var(--s);height:var(--s);border-radius:50%;background:#fff;opacity:.2;animation:tw 4s ease-in-out infinite alternate}
@keyframes tw{to{opacity:.9}}
.contact__in{position:relative;max-width:1200px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,6vw,90px);align-items:start}
.contact .kicker{color:var(--gold)}
.contact h2{font:400 clamp(40px,5.6vw,84px)/.98 var(--serif);margin-bottom:22px}
.contact p{max-width:30em;color:#e9dfcb}
.contact address{font-style:normal;margin-top:28px;line-height:1.8;color:#e9dfcb}
.contact address a:first-child{font:400 clamp(30px,3.4vw,46px)/1.2 var(--serif);color:var(--gold);text-decoration:none}
.contact address span{font-size:14px;opacity:.85}
.form{display:grid;grid-template-columns:1fr 1fr;gap:16px;padding:clamp(18px,2.4vw,32px);background:rgba(241,230,207,.06);border:1px solid rgba(241,230,207,.25);border-radius:12px}
.form label{display:flex;flex-direction:column;gap:6px;font:600 12px var(--sans);letter-spacing:.1em;text-transform:uppercase;color:#e9dfcb}
.form .full{grid-column:1/-1}
.form input,.form select,.form textarea{font:500 17px var(--sans);padding:13px 12px;border-radius:6px;border:1px solid rgba(241,230,207,.4);background:#f1e6cf;color:#2b1b2e;width:100%}
.form button{grid-column:1/-1;justify-self:start;font:700 16px var(--sans);padding:15px 24px;border-radius:999px;border:0;background:var(--gold);color:#2b1b2e;cursor:pointer}
.form__msg{grid-column:1/-1;min-height:1.5em;font-size:15px;color:var(--gold)}
@media(max-width:820px){.contact__in,.form{grid-template-columns:1fr}}
.foot{max-width:1200px;margin:clamp(70px,10vw,130px) auto 0;padding:28px 0 36px;border-top:1px solid rgba(241,230,207,.2);display:flex;flex-wrap:wrap;gap:12px 40px;justify-content:space-between;font-size:14px;color:#d9ceb8}
.foot__a{font:400 22px var(--serif);color:var(--cream)}.foot__b{max-width:44em}

/* static / reduced motion */
.static .stage{height:auto;overflow:visible;padding:130px 20px 60px;background:linear-gradient(#e9c7c0,#c9d6e2)}
.static .far,.static .sun,.static .ridge,.static .hedgeA,.static .hedgeB,.static .field,.static .fgGrass,.static .fgPosts,.static .wash,.static .meter,.static .rail,.static .gate{display:none}
.static .layer,.static .title{position:static;width:auto;transform:none!important;padding:0}
.static .fence{display:grid;gap:30px;max-width:720px;margin:40px auto 0}
.static .sign{position:relative;top:auto;left:auto!important;width:auto;transform:none;--r:1}
.static .sign::before,.static .sign::after{display:none}
.static .sign__b{animation:none}
.static .post{display:none}.static .grain{opacity:.1}
.static .stage .title{max-width:900px;margin:0 auto}
.static .clock{display:none}
.static .sw,.static .stars i{animation:none}
@media(prefers-reduced-motion:reduce){.sw,.sign__b,.stars i{animation:none}}

/* inner page */
.pp{background:linear-gradient(#f2d8a3,#f1e6cf 40vh);color:var(--plum);min-height:100vh}
.pp .top{position:fixed}
.pp__hero{position:relative;height:min(78svh,720px);overflow:hidden;background:#e8b04a}
.pp__hero img{position:absolute;inset:-10% 0 auto;width:100%;height:120%;object-fit:cover;will-change:transform}
.pp__hero::after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 55%,#f1e6cf)}
.pp__hero h1{position:absolute;z-index:2;left:clamp(20px,5vw,90px);bottom:clamp(40px,9vw,110px);font:400 clamp(52px,10vw,170px)/.92 var(--serif);color:#2b1b2e;text-shadow:0 2px 40px rgba(255,240,210,.6)}
.pp__w{max-width:1100px;margin:0 auto;padding:clamp(30px,5vw,70px) clamp(20px,5vw,60px) 100px;display:grid;gap:clamp(36px,5vw,64px)}
.pp .lede{font:400 clamp(22px,2.6vw,36px)/1.3 var(--serif);max-width:26em}
.pp__signs{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,3vw,40px);align-items:start}
.pp .sign{position:relative;top:auto;left:auto;width:auto;transform:none;margin-top:34px}
.pp .sign:nth-child(2){margin-top:60px}.pp .sign h2{font-size:clamp(36px,3.6vw,56px)}.pp .sign p{font-size:clamp(19px,1.7vw,25px)}
.pp .ink{clip-path:none}
.pp__tab{border-top:2px solid var(--plum);display:grid;grid-template-columns:repeat(4,1fr);gap:0}
.pp__tab div{padding:18px 18px 22px 0}.pp__tab dt{font:600 12px var(--sans);letter-spacing:.12em;text-transform:uppercase;opacity:.75}.pp__tab dd{font:400 clamp(24px,2.6vw,38px)/1.1 var(--serif);margin:4px 0 0}
.pp__cta{display:inline-block;font:700 17px var(--sans);padding:16px 26px;border-radius:999px;background:var(--plum);color:var(--cream);text-decoration:none;justify-self:start}
.pp .fgG{position:relative;height:150px;margin-top:-30px;background:linear-gradient(transparent,#1b2a1b)}
.pp .fgG svg{position:absolute;bottom:0;width:100%;height:100%;fill:#1b2a1b}
.pp .foot{margin:0;max-width:none;border-top:0;background:#0b0e1f;padding:30px clamp(20px,5vw,60px) 40px}
@media(max-width:820px){.pp__signs{grid-template-columns:1fr}.pp .sign:nth-child(2){margin-top:34px}.pp__tab{grid-template-columns:1fr 1fr}}
