:root {
  --bg: #FBF5DD;
  --bg-soft: #E7E1B1;
  --green: #306D29;
  --green-dark: #0D530E;
  --ink: #142613;
  --muted: #3c5236;
  --radius: 0;
  --shadow-soft: 0 18px 36px rgba(13, 83, 14, 0.11);
  --shadow-hover: 0 22px 42px rgba(13, 83, 14, 0.18);
  --space-xs: 0.55rem;
  --space-sm: 0.95rem;
  --space-md: 1.45rem;
  --space-lg: 2.2rem;
  --space-xl: 4rem;
  --speed: 280ms;
}
* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; scroll-behavior: smooth; }
body { font-family: Manrope, Arial, sans-serif; color: var(--ink); background: var(--bg); line-height: 1.62; }
a { color: inherit; text-decoration: none; transition: color var(--speed) ease; }
a:hover { color: var(--green-dark); }
.container { width: min(1140px, 92vw); margin: 0 auto; }
.site-header { position: sticky; top: 0; z-index: 70; border-bottom: 1px solid rgba(13, 83, 14, 0.14); backdrop-filter: blur(10px); background: rgba(251, 245, 221, 0.93); }
.header-row { display: flex; justify-content: space-between; align-items: center; gap: var(--space-md); padding: 0.85rem 0; }
.brand-mark { font-family: "Playfair Display", serif; font-size: 1.3rem; font-weight: 700; }
.square-nav { display: flex; gap: 0.45rem; flex-wrap: wrap; }
.square-nav a { border: 1px solid var(--green); padding: 0.62rem 0.95rem; background: var(--bg-soft); transition: background var(--speed), color var(--speed), transform var(--speed); }
.square-nav a:hover, .square-nav a.active { background: var(--green-dark); color: var(--bg); transform: translateY(-2px); }
.section { padding: var(--space-xl) 0; }
.full-screen { min-height: 100vh; display: grid; align-items: center; position: relative; overflow: hidden; }
.hero-media { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.hero-overlay { position: absolute; inset: 0; background: linear-gradient(100deg, rgba(13,83,14,0.82), rgba(13,83,14,0.24)); }
.hero-grid { position: relative; z-index: 2; display: grid; grid-template-columns: 1.2fr 0.8fr; gap: var(--space-lg); color: #fff8e0; }
.hero h1 { font-family: "Playfair Display", serif; font-size: clamp(2rem, 4vw, 3.6rem); line-height: 1.08; margin: 0.5rem 0 1rem; }
.hero p { max-width: 62ch; }
.kicker { text-transform: uppercase; letter-spacing: .12em; font-size: .75rem; font-weight: 700; opacity: .9; }
.hero-card { border: 1px solid rgba(251,245,221,.42); background: rgba(251,245,221,.1); padding: 1.3rem; box-shadow: var(--shadow-soft); }
.hero-card ul { list-style: none; margin: .9rem 0 0; padding: 0; display: grid; gap: .7rem; }
.hero-card li { display: flex; gap: .6rem; align-items: center; }
.btn { display: inline-block; border: 1px solid transparent; padding: .7rem 1.15rem; font-weight: 600; cursor: pointer; transition: transform var(--speed), background var(--speed), color var(--speed), box-shadow var(--speed); }
.btn:hover { transform: translateY(-2px); box-shadow: var(--shadow-soft); }
.btn-primary { background: var(--green-dark); color: var(--bg); }
.btn-ghost { border-color: rgba(251,245,221,.85); color: #fff8e0; }
.btn-outline { border-color: var(--green-dark); color: var(--green-dark); background: transparent; }
.btn-dark { background: var(--green); color: var(--bg); }
.hero-actions { display: flex; gap: .8rem; flex-wrap: wrap; margin-top: 1.1rem; }
.grid-2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-lg); align-items: start; }
.trust-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: .7rem; }
.trust-grid div { border: 1px solid rgba(13,83,14,.22); background: #f8f2d2; padding: 1rem; transition: transform var(--speed), background var(--speed); }
.trust-grid div:hover { transform: translateY(-3px); background: #f1eabf; }
.trust-grid span { display: block; margin-top: .25rem; color: var(--muted); font-size: .94rem; }
.accent { background: linear-gradient(180deg, #f0e8c4, #f9f4dd); }
.planner-card { border: 1px solid rgba(13,83,14,.24); background: #fff9de; padding: 1.1rem; box-shadow: var(--shadow-soft); }
.planner-card input[type="range"] { width: 100%; accent-color: var(--green-dark); margin-top: .4rem; }
.toggle-row { display: flex; gap: .5rem; margin: .8rem 0; flex-wrap: wrap; }
.mini-btn { border: 1px solid var(--green); background: #f4edc7; padding: .45rem .72rem; cursor: pointer; transition: all var(--speed); }
.mini-btn.active, .mini-btn:hover { background: var(--green-dark); color: var(--bg); }
.stack-cards { display: grid; gap: .7rem; }
.floating-panel { border: 1px solid rgba(13,83,14,.2); background: #fff8df; padding: 1rem; animation: drift 4.8s ease-in-out infinite; }
.floating-panel:nth-child(2) { animation-delay: .5s; }
.floating-panel:nth-child(3) { animation-delay: 1s; }
@keyframes drift { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-6px); } }
.media-split .prompt-list { display: grid; gap: .7rem; }
.media-split .prompt-list > div { border: 1px solid rgba(13,83,14,.2); background: #fbf6de; padding: .9rem; transition: box-shadow var(--speed), transform var(--speed); }
.media-split .prompt-list > div:hover { box-shadow: var(--shadow-hover); transform: translateY(-2px); }
.rounded-media { width: 100%; height: auto; display: block; box-shadow: var(--shadow-soft); }
.map-wrap iframe { border: 0; width: 100%; min-height: 320px; box-shadow: var(--shadow-soft); }
.contact-facts { display: grid; gap: .55rem; margin-top: .7rem; }
.form-card { border: 1px solid rgba(13,83,14,.22); background: #fff9de; padding: 1.2rem; box-shadow: var(--shadow-soft); }
label { display: block; margin-bottom: .25rem; font-weight: 600; }
input, textarea { width: 100%; border: 1px solid rgba(13,83,14,.35); background: #fffbe9; font: inherit; padding: .7rem; margin-bottom: .4rem; transition: border-color var(--speed), box-shadow var(--speed); }
input:focus, textarea:focus { outline: none; border-color: var(--green-dark); box-shadow: 0 0 0 3px rgba(48,109,41,.12); }
.gdpr-check { display: flex; align-items: flex-start; gap: .55rem; margin: .4rem 0; font-weight: 500; }
.gdpr-check input { width: auto; margin-top: .2rem; }
.error { color: #9c2424; font-size: .88rem; min-height: 1rem; display: block; }
.plain-list { margin: 0; padding-left: 1.15rem; }
.plain-list li { margin-bottom: .45rem; }
.timeline { display: grid; gap: .8rem; }
.timeline article { border-left: 4px solid var(--green); padding: .7rem .9rem; background: #f9f3d4; }
.accordion { display: grid; gap: .55rem; }
.acc-item { border: 1px solid rgba(13,83,14,.22); background: #fbf5d9; overflow: hidden; }
.acc-trigger { width: 100%; text-align: left; border: 0; background: transparent; padding: .9rem; font: inherit; font-weight: 700; cursor: pointer; }
.acc-content { max-height: 0; overflow: hidden; transition: max-height var(--speed) ease, padding var(--speed) ease; padding: 0 .9rem; }
.acc-item.open .acc-content { max-height: 180px; padding: 0 .9rem .85rem; }
.page-hero h1 { font-family: "Playfair Display", serif; font-size: clamp(1.7rem, 3.2vw, 3rem); }
.legal h1 { font-family: "Playfair Display", serif; }
.legal h2 { margin-top: 1.2rem; }
.center-box { max-width: 700px; text-align: center; }
.site-footer { border-top: 1px solid rgba(13,83,14,.15); padding: .85rem 0; }
.footer-line { display: flex; justify-content: center; align-items: center; flex-wrap: wrap; gap: .85rem; font-size: .9rem; }
.cookie-panel { position: fixed; left: 1rem; right: 1rem; bottom: 1rem; z-index: 90; display: none; }
.cookie-panel.show { display: block; }
.cookie-inner { max-width: 880px; margin: 0 auto; border: 1px solid rgba(13,83,14,.24); background: #fff8de; box-shadow: var(--shadow-soft); padding: 1rem; }
.cookie-actions { display: flex; gap: .5rem; flex-wrap: wrap; margin-top: .6rem; }
.cookie-settings { display: none; margin-top: .65rem; }
.cookie-settings.show { display: grid; gap: .4rem; }
.cookie-settings label { display: flex; gap: .5rem; align-items: center; font-weight: 500; }
.reveal { opacity: 0; transform: translateY(20px); transition: opacity .8s ease, transform .8s ease; }
.reveal.visible { opacity: 1; transform: translateY(0); }
@media (max-width: 920px) {
  .hero-grid, .grid-2 { grid-template-columns: 1fr; }
  .trust-grid { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .square-nav { width: 100%; }
  .square-nav a { flex: 1 1 calc(33% - .45rem); text-align: center; }
  .section { padding: 2.8rem 0; }
}
