:root{--cream: #fffaf5;--cream-deep: #f5ead9;--green: #00bf63;--green-deep: #058a4a;--green-dark: #0c3d27;--orange: #ffbd59;--ink: #123322;--font-display: "Fraunces", ui-serif, Georgia, serif;--font-body: "Inter", ui-sans-serif, system-ui, sans-serif}*{box-sizing:border-box}html,body{margin:0;padding:0;height:100%;overflow:hidden;background:var(--cream);color:var(--ink);font-family:var(--font-body);-webkit-font-smoothing:antialiased}#app{position:relative;width:100vw;height:100vh;overflow:hidden}#scene{position:fixed;top:0;right:0;bottom:0;left:0;z-index:0;display:block;touch-action:none}#grain{position:fixed;top:0;right:0;bottom:0;left:0;z-index:5;pointer-events:none;opacity:.035;mix-blend-mode:multiply;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}#site-header{position:fixed;top:0;left:0;right:0;z-index:20;display:flex;align-items:center;justify-content:space-between;padding:1.6rem clamp(1.25rem,4vw,3rem);pointer-events:none}#site-header>*{pointer-events:auto}.logo-mark{height:28px;width:auto;display:block}#cta-nav{font-family:var(--font-body);font-weight:700;font-size:.85rem;letter-spacing:.02em;background:var(--green);color:var(--cream);border:none;border-radius:999px;padding:.65rem 1.35rem;cursor:pointer;transition:transform .25s ease,background .25s ease,box-shadow .25s ease;box-shadow:0 6px 18px #00bf6340}#cta-nav:hover{transform:translateY(-2px);background:var(--green-deep);box-shadow:0 10px 24px #00bf6359}#progress-rail{position:fixed;right:clamp(1rem,3vw,2.25rem);top:50%;transform:translateY(-50%);z-index:20;width:3px;height:min(38vh,320px);background:#0c3d271f;border-radius:999px;overflow:hidden}#progress-fill{position:absolute;left:0;right:0;bottom:0;top:0;transform-origin:bottom;transform:scaleY(0);background:linear-gradient(180deg,var(--orange),var(--green));border-radius:999px;transition:transform .1s linear}body.at-contact #progress-rail,body.at-intro #progress-rail{opacity:.5}#panels{position:relative;z-index:10;width:100%;height:100%;pointer-events:none}.panel{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;padding:0 clamp(1.5rem,8vw,8rem);max-width:780px;opacity:0;transform:translateY(28px);transition:opacity .55s cubic-bezier(.22,1,.36,1),transform .65s cubic-bezier(.22,1,.36,1);will-change:opacity,transform}.panel.is-active{opacity:1;transform:translateY(0);pointer-events:auto}.panel.is-prev{transform:translateY(-40px)}.panel.is-next{transform:translateY(40px)}.eyebrow{font-family:var(--font-body);font-weight:700;font-size:.8rem;text-transform:uppercase;letter-spacing:.14em;color:var(--green-deep);margin:0 0 .9rem}h1{font-family:var(--font-display);font-weight:900;font-size:clamp(2.4rem,6.5vw,5rem);line-height:1.03;margin:0 0 1rem;color:var(--ink);letter-spacing:-.01em}h1 .accent,h2 .accent{color:var(--green);font-style:italic;font-weight:600}.panel .sub{font-size:clamp(1rem,1.6vw,1.25rem);color:#123322b8;max-width:34ch;margin:0}.scroll-hint{margin-top:3rem;display:flex;align-items:center;gap:.75rem;color:#1233228c}.scroll-hint span{width:22px;height:34px;border:2px solid currentColor;border-radius:999px;position:relative}.scroll-hint span:before{content:"";position:absolute;top:6px;left:50%;width:4px;height:8px;background:currentColor;border-radius:999px;transform:translate(-50%);animation:scrollDot 1.6s ease-in-out infinite}.scroll-hint p{margin:0;font-size:.85rem;letter-spacing:.06em;text-transform:uppercase;font-weight:600}@keyframes scrollDot{0%{transform:translate(-50%);opacity:1}70%{transform:translate(-50%,12px);opacity:0}to{transform:translate(-50%);opacity:0}}.grape-panel .grape-index{font-family:var(--font-display);font-weight:600;font-style:italic;font-size:1rem;color:var(--orange);margin:0 0 .5rem;letter-spacing:.06em}.grape-panel h2{font-family:var(--font-display);font-weight:800;font-size:clamp(2rem,4.4vw,3.6rem);line-height:1.05;margin:0 0 1rem;color:var(--ink);letter-spacing:-.01em;max-width:9ch}.grape-copy{font-size:clamp(1.05rem,1.7vw,1.3rem);color:#123322c7;max-width:38ch;margin:0;line-height:1.5}#panel-contact{max-width:620px;width:min(620px,92vw)}#panel-contact h2{font-family:var(--font-display);font-weight:800;font-size:clamp(2rem,4.6vw,3.2rem);margin:0 0 .6rem}#contact-form{margin-top:1.75rem;width:100%;display:flex;flex-direction:column;gap:1rem}.field{display:flex;flex-direction:column;gap:.4rem;flex:1}.field-row{display:flex;gap:1rem}@media (max-width: 640px){.field-row{flex-direction:column}}label{font-size:.8rem;font-weight:600;letter-spacing:.03em;color:var(--green-dark);text-transform:uppercase}input,textarea{font-family:var(--font-body);font-size:1rem;padding:.75rem .9rem;border-radius:12px;border:1.5px solid rgba(12,61,39,.18);background:#fff9;color:var(--ink);outline:none;transition:border-color .2s ease,background .2s ease;resize:vertical}input:focus,textarea:focus{border-color:var(--green);background:#ffffffe6}#submit-btn{margin-top:.4rem;align-self:flex-start;font-family:var(--font-body);font-weight:700;font-size:1rem;background:var(--ink);color:var(--cream);border:none;border-radius:999px;padding:.9rem 1.9rem;cursor:pointer;transition:transform .25s ease,background .25s ease}#submit-btn:hover{transform:translateY(-2px);background:var(--green-deep)}#form-status{min-height:1.2em;font-size:.9rem;margin:0;color:var(--green-deep)}#form-status[data-state=error]{color:#b8452f}#site-footer{margin-top:1.5rem;display:flex;justify-content:space-between;width:100%;font-size:.8rem;color:#12332280;letter-spacing:.03em}#site-footer span:first-child{font-family:var(--font-display);font-weight:800;font-style:normal;color:var(--green)}.footer-socials{display:flex;gap:1rem}.footer-socials a{color:#12332280;text-decoration:none;transition:color .2s ease}.footer-socials a:hover{color:var(--green-deep)}@media (max-width: 760px){.panel{padding:0 1.5rem;max-width:100%;justify-content:flex-start;padding-top:14vh}h1,.grape-panel h2,#panel-contact h2{max-width:9ch}.panel .sub,.grape-copy{max-width:22ch}#panel-contact{padding-top:10vh}#panel-contact .eyebrow{max-width:16ch}#progress-rail{height:24vh}#site-footer{flex-wrap:wrap;gap:.5rem 1rem}}
