:root {
  --ink: #111827;
  --muted: #5b6474;
  --surface: #ffffff;
  --surface-soft: #f6f9f7;
  --line: #d9e1dc;
  --green: #14532d;
  --green-light: #e4f3e8;
  --green-mid: #228b45;
  --blue: #145d79;
  --shadow: 0 14px 36px rgba(15, 38, 27, .10);
  --radius: 18px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--ink);
  background: var(--surface);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  line-height: 1.55;
}
a { color: var(--green); text-underline-offset: .17em; }
a:hover { color: #0b3b1f; }
button, input, select, textarea { font: inherit; }
button { cursor: pointer; }
.container { width: min(1160px, calc(100% - 2.4rem)); margin-inline: auto; }
.skip-link { position: fixed; left: 1rem; top: -4rem; z-index: 10; padding: .65rem .85rem; color: #fff; background: var(--green); border-radius: 0 0 8px 8px; }
.skip-link:focus { top: 0; }

.site-header { position: sticky; top: 0; z-index: 5; background: rgba(255,255,255,.94); backdrop-filter: blur(12px); border-bottom: 1px solid rgba(217,225,220,.9); }
.header-inner { display: flex; gap: 1.2rem; align-items: center; justify-content: space-between; min-height: 72px; }
.brand { display: inline-flex; align-items: center; gap: .7rem; color: var(--ink); text-decoration: none; }
.brand strong, .brand small { display: block; line-height: 1.12; }
.brand strong { font-size: 1rem; letter-spacing: -.01em; }
.brand small { margin-top: .15rem; color: var(--muted); font-size: .73rem; }
.brand-mark { position: relative; display: grid; grid-template-columns: repeat(2, 1fr); gap: 3px; width: 37px; aspect-ratio: 1; padding: 5px; background: var(--green); border-radius: 8px; }
.brand-mark span { background: #fff; border-radius: 1px; }
.brand-mark span:nth-child(2) { opacity: .55; }
.brand-mark span:nth-child(3) { opacity: .75; }
.site-nav { display: flex; flex-wrap: wrap; gap: .3rem .8rem; justify-content: flex-end; font-size: .88rem; }
.site-nav a { color: var(--ink); text-decoration: none; padding: .4rem .45rem; border-radius: 7px; }
.site-nav a:hover { background: var(--green-light); color: var(--green); }

.hero { overflow: hidden; background: linear-gradient(135deg, #ecf7ed 0%, #f7fbf8 58%, #e8f1ec 100%); border-bottom: 1px solid #dbe6dd; }
.hero-grid { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(250px, .75fr); gap: clamp(2rem, 7vw, 7rem); align-items: center; padding: clamp(3rem, 7vw, 6.3rem) 0; }
.eyebrow { margin: 0 0 .55rem; color: var(--green); font-size: .78rem; font-weight: 800; letter-spacing: .10em; text-transform: uppercase; }
h1, h2, h3 { line-height: 1.12; letter-spacing: -.035em; }
h1 { max-width: 760px; margin: 0; font-size: clamp(2.1rem, 5vw, 4.5rem); }
h2 { margin: 0; font-size: clamp(1.65rem, 3.4vw, 2.65rem); }
h3 { margin: 0; font-size: 1.15rem; }
.hero-lead { max-width: 650px; margin: 1.35rem 0 0; color: #3e4b43; font-size: clamp(1.03rem, 1.7vw, 1.22rem); }
.hero-pills { display: flex; flex-wrap: wrap; gap: .55rem; margin-top: 1.45rem; }
.hero-pills span, .local-badge { display: inline-block; padding: .28rem .60rem; border: 1px solid #b8d9bf; border-radius: 999px; color: var(--green); background: rgba(255,255,255,.63); font-size: .78rem; font-weight: 700; }
.hero-code { position: relative; justify-self: center; width: min(100%, 318px); aspect-ratio: 1; padding: 9%; background: #fff; border: 16px solid #fff; border-radius: 24px; box-shadow: var(--shadow); transform: rotate(3deg); }
.hero-code-grid { width: 100%; height: 100%; opacity: .94; background-color: #173f29; background-image: linear-gradient(90deg, transparent 42%, #fff 42% 56%, transparent 56%), linear-gradient(0deg, transparent 45%, #fff 45% 59%, transparent 59%), repeating-linear-gradient(90deg, transparent 0 10%, #fff 10% 16%, transparent 16% 25%), repeating-linear-gradient(0deg, transparent 0 9%, #fff 9% 17%, transparent 17% 27%); background-size: 100% 100%, 100% 100%, 43px 100%, 100% 37px; }
.hero-code-finder { position: absolute; width: 27%; aspect-ratio: 1; border: 11px solid #173f29; background: #fff; }
.hero-code-finder::after { content: ""; position: absolute; inset: 21%; background: #173f29; }
.finder-one { left: 9%; top: 9%; }.finder-two { right: 9%; top: 9%; }.finder-three { left: 9%; bottom: 9%; }

.section { padding: clamp(3.5rem, 7vw, 6.5rem) 0; }
.section-heading { max-width: 760px; margin-bottom: 1.8rem; }
.section-heading > p:last-child { margin: .75rem 0 0; color: var(--muted); }
.generator-section { background: #fafcfb; }
.generator-shell { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow); overflow: hidden; }
.generator-tabs { display: flex; border-bottom: 1px solid var(--line); background: #fcfdfc; }
.generator-tab { display: inline-flex; align-items: center; justify-content: center; gap: .45rem; flex: 1; min-height: 60px; padding: .8rem 1rem; color: var(--muted); background: transparent; border: 0; border-bottom: 3px solid transparent; font-weight: 800; }
.generator-tab:hover { color: var(--green); background: #f5f9f6; }
.generator-tab.is-active { color: var(--green); border-bottom-color: var(--green); background: #fff; }
.tab-symbol { font-size: 1.28rem; line-height: 1; }
.generator-panel { display: grid; grid-template-columns: minmax(0, 1.12fr) minmax(340px, .88fr); min-height: 510px; }
.generator-form-card { padding: clamp(1.25rem, 4vw, 2.2rem); border-right: 1px solid var(--line); }
.preview-card { display: flex; flex-direction: column; padding: clamp(1.25rem, 4vw, 2.2rem); background: linear-gradient(145deg, #f4f8f5, #edf5ee); }
.preview-heading { display: flex; align-items: center; justify-content: space-between; gap: .8rem; }
.local-badge { background: #fff; font-size: .7rem; }
.field-grid { display: grid; gap: 1rem; }
.field-grid-two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.field-grid-three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.field-group { display: flex; flex-direction: column; gap: .38rem; min-width: 0; }
.field-group label { font-size: .88rem; font-weight: 750; }
.field-group small { color: var(--muted); font-size: .77rem; }
input[type="text"], input[type="email"], input[type="url"], input[type="tel"], input[type="number"], input[type="datetime-local"], select, textarea { width: 100%; min-height: 44px; padding: .65rem .72rem; color: var(--ink); background: #fff; border: 1px solid #bfc9c2; border-radius: 9px; outline: none; }
textarea { min-height: 115px; resize: vertical; }
input:focus, select:focus, textarea:focus { border-color: var(--green-mid); box-shadow: 0 0 0 3px rgba(34,139,69,.16); }
input[type="color"] { width: 100%; min-height: 43px; padding: .2rem; background: #fff; border: 1px solid #bfc9c2; border-radius: 9px; }
.dynamic-fields { display: grid; gap: 1rem; margin-top: 1rem; }
.advanced-options { margin-top: 1.15rem; padding: .84rem 1rem 1rem; border: 1px solid var(--line); border-radius: 10px; background: #fbfdfb; }
.advanced-options summary { color: var(--green); cursor: pointer; font-size: .91rem; font-weight: 800; }
.advanced-content { margin-top: 1rem; }
.field-check { flex-direction: row; align-items: center; padding-top: 1.55rem; }
.field-check input { width: 17px; height: 17px; margin: 0; accent-color: var(--green); }
.button { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: .65rem 1rem; border: 1px solid transparent; border-radius: 9px; font-weight: 800; text-decoration: none; transition: transform .14s ease, box-shadow .14s ease, background .14s ease; }
.button:hover { transform: translateY(-1px); }
.button-primary { margin-top: 1.25rem; color: #fff; background: var(--green); box-shadow: 0 7px 16px rgba(20,83,45,.20); }
.button-primary:hover { background: #0e4123; color: #fff; }
.button-secondary { color: #fff; background: var(--blue); }
.button-secondary:hover { color: #fff; background: #0c4a63; }
.button-outline { color: var(--green); background: #fff; border-color: #aac9b2; }
.button-outline:hover { background: var(--green-light); }
.form-message { min-height: 1.3em; margin: .75rem 0 0; color: var(--muted); font-size: .88rem; }
.form-message.is-error { color: #9f1d1d; }.form-message.is-success { color: var(--green); }
.code-preview { display: grid; place-items: center; flex: 1; min-height: 330px; margin-top: 1.15rem; padding: 1.15rem; border: 1px dashed #bfd1c2; border-radius: 13px; background: rgba(255,255,255,.72); overflow: auto; }
.code-preview-qr svg { display: block; width: min(100%, 320px); height: auto; image-rendering: pixelated; }
.code-preview-barcode svg { display: block; max-width: 100%; height: auto; }
.preview-placeholder { max-width: 250px; margin: 0; color: var(--muted); text-align: center; font-size: .93rem; }
.download-actions { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: .55rem; margin-top: 1rem; }
.download-actions .button { padding-inline: .45rem; font-size: .82rem; }
.privacy-section { background: var(--green); color: #fff; }
.privacy-section .eyebrow { color: #bce9c5; }.privacy-section h2 { color: #fff; }.privacy-section p { color: #e5f2e7; }
.two-column-text { display: grid; grid-template-columns: minmax(0,.88fr) minmax(0,1.12fr); gap: clamp(1.5rem, 8vw, 8rem); }
.two-column-text p { margin-top: 0; font-size: 1.03rem; }
.partners-section { background: #fafcfb; }
.partners-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .9rem; }
.partner-card { display: flex; align-items: center; gap: .85rem; min-height: 108px; padding: .9rem; color: var(--ink); text-decoration: none; background: #fff; border: 1px solid var(--line); border-radius: 13px; box-shadow: 0 6px 16px rgba(17, 55, 29, .045); transition: border-color .16s ease, transform .16s ease, box-shadow .16s ease; }
.partner-card:hover { color: var(--ink); border-color: #86b593; box-shadow: 0 10px 21px rgba(17, 55, 29, .11); transform: translateY(-2px); }
.partner-icon { position: relative; display: grid; flex: 0 0 54px; width: 54px; height: 54px; place-items: center; overflow: hidden; color: #fff; background: linear-gradient(145deg, var(--green), var(--blue)); border-radius: 13px; }
.partner-icon img { position: relative; z-index: 1; width: 100%; height: 100%; object-fit: cover; }.partner-fallback { position: absolute; z-index: 0; font-size: 1.45rem; font-weight: 850; }.partner-icon-w .partner-fallback { font-family: Georgia, serif; font-size: 1.7rem; }
.partner-card strong, .partner-card small { display: block; }.partner-card strong { font-size: .96rem; }.partner-card small { margin-top: .2rem; color: var(--muted); font-size: .77rem; line-height: 1.32; }
.partner-card-wide { grid-column: 2 / span 1; }
.site-footer { padding: 1.25rem 0; color: #dde9df; background: #10291a; font-size: .85rem; }.footer-inner { display: flex; align-items: center; justify-content: space-between; gap: .8rem 1.5rem; }.site-footer p { margin: 0; }.site-footer a { color: #fff; }
.content-page { background: #fafcfb; }.prose { max-width: 850px; padding-bottom: 2rem; }.prose h1 { font-size: clamp(2rem, 4vw, 3.35rem); }.prose h2 { margin-top: 2rem; font-size: 1.45rem; }.prose .lead { color: #3d4a42; font-size: 1.15rem; }

@media (max-width: 920px) {
  .hero-grid, .generator-panel { grid-template-columns: 1fr; }
  .hero-code { width: min(270px, 72vw); }.generator-form-card { border-right: 0; border-bottom: 1px solid var(--line); }.partners-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }.partner-card-wide { grid-column: auto; }.two-column-text { grid-template-columns: 1fr; gap: 1rem; }
}
@media (max-width: 650px) {
  .container { width: min(100% - 1.25rem, 1160px); }.header-inner { min-height: 62px; }.site-nav { display: none; }.field-grid-two, .field-grid-three { grid-template-columns: 1fr; }.field-check { padding-top: .15rem; }.download-actions { grid-template-columns: 1fr; }.code-preview { min-height: 260px; }.partners-grid { grid-template-columns: 1fr; }.site-footer .footer-inner { align-items: flex-start; flex-direction: column; }.generator-tab { font-size: .9rem; }
}
@media print {
  .site-header, .hero, .generator-form-card, .preview-heading, .download-actions, .privacy-section, .partners-section, .site-footer { display: none !important; }.generator-section { padding: 0; background: #fff; }.generator-shell { border: 0; box-shadow: none; }.generator-tabs { display: none; }.generator-panel { display: block; }.preview-card { padding: 0; background: #fff; }.code-preview { min-height: 0; border: 0; background: #fff; }.code-preview svg { max-width: 100%; }
}