/* Shared chrome for squeeezy.me — homepage extras stay in index.html */
    *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

    :root {
      --ink: #122026;
      --muted: #4a6670;
      --line: #d7e4e9;
      --paper: #ffffff;
      --canvas: #3DC8EC;
      --cyan: #3DC8EC;
      --cyan-deep: #1788a8;
      --yellow: #F5C800;
      --dark: #1a1a2e;
      --max: 1120px;
    }

    html {
      scroll-behavior: smooth;
      overflow-x: hidden;
      overflow-y: scroll;
      scrollbar-gutter: stable;
    }

    body {
      min-height: 100vh;
      display: flex;
      flex-direction: column;
      background-color: var(--canvas);
      background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20width%3D%27160%27%20height%3D%27160%27%3E%3Cg%20fill%3D%27none%27%20stroke%3D%27%231a1a2e%27%20stroke-opacity%3D%270.09%27%20stroke-width%3D%271.3%27%3E%3Ccircle%20cx%3D%2732%27%20cy%3D%2710%27%20r%3D%274.8%27/%3E%3Ccircle%20cx%3D%2766%27%20cy%3D%2761%27%20r%3D%272.1%27/%3E%3Ccircle%20cx%3D%2730%27%20cy%3D%27143%27%20r%3D%271.9%27/%3E%3Ccircle%20cx%3D%27112%27%20cy%3D%2712%27%20r%3D%271.6%27/%3E%3Ccircle%20cx%3D%2759%27%20cy%3D%2763%27%20r%3D%273.8%27/%3E%3Ccircle%20cx%3D%2710%27%20cy%3D%27147%27%20r%3D%272.4%27/%3E%3Ccircle%20cx%3D%27143%27%20cy%3D%27111%27%20r%3D%272.5%27/%3E%3Ccircle%20cx%3D%27154%27%20cy%3D%2775%27%20r%3D%275.1%27/%3E%3Ccircle%20cx%3D%275%27%20cy%3D%2744%27%20r%3D%274.6%27/%3E%3Ccircle%20cx%3D%2791%27%20cy%3D%2775%27%20r%3D%272.2%27/%3E%3Ccircle%20cx%3D%2790%27%20cy%3D%2730%27%20r%3D%271.9%27/%3E%3Ccircle%20cx%3D%2728%27%20cy%3D%2795%27%20r%3D%275.3%27/%3E%3Ccircle%20cx%3D%2771%27%20cy%3D%2715%27%20r%3D%274.8%27/%3E%3Ccircle%20cx%3D%27141%27%20cy%3D%2735%27%20r%3D%275.9%27/%3E%3Ccircle%20cx%3D%27100%27%20cy%3D%2724%27%20r%3D%274.0%27/%3E%3Ccircle%20cx%3D%2796%27%20cy%3D%27151%27%20r%3D%272.4%27/%3E%3Ccircle%20cx%3D%2721%27%20cy%3D%2715%27%20r%3D%274.5%27/%3E%3Ccircle%20cx%3D%2778%27%20cy%3D%2724%27%20r%3D%275.3%27/%3E%3Ccircle%20cx%3D%2729%27%20cy%3D%27101%27%20r%3D%272.8%27/%3E%3Ccircle%20cx%3D%2797%27%20cy%3D%2745%27%20r%3D%273.2%27/%3E%3Ccircle%20cx%3D%2757%27%20cy%3D%2772%27%20r%3D%274.7%27/%3E%3Ccircle%20cx%3D%2722%27%20cy%3D%2747%27%20r%3D%273.9%27/%3E%3Ccircle%20cx%3D%2766%27%20cy%3D%2745%27%20r%3D%273.6%27/%3E%3Ccircle%20cx%3D%2773%27%20cy%3D%27146%27%20r%3D%272.5%27/%3E%3Ccircle%20cx%3D%2787%27%20cy%3D%2718%27%20r%3D%272.5%27/%3E%3Ccircle%20cx%3D%2712%27%20cy%3D%2784%27%20r%3D%273.3%27/%3E%3Ccircle%20cx%3D%2720%27%20cy%3D%2758%27%20r%3D%275.6%27/%3E%3Ccircle%20cx%3D%27149%27%20cy%3D%2784%27%20r%3D%272.5%27/%3E%3Ccircle%20cx%3D%27131%27%20cy%3D%27105%27%20r%3D%275.5%27/%3E%3Ccircle%20cx%3D%27121%27%20cy%3D%2740%27%20r%3D%272.7%27/%3E%3Ccircle%20cx%3D%2767%27%20cy%3D%27147%27%20r%3D%273.9%27/%3E%3Ccircle%20cx%3D%27153%27%20cy%3D%27113%27%20r%3D%275.5%27/%3E%3Ccircle%20cx%3D%27106%27%20cy%3D%2796%27%20r%3D%272.5%27/%3E%3Ccircle%20cx%3D%2739%27%20cy%3D%27134%27%20r%3D%273.7%27/%3E%3C/g%3E%3C/svg%3E");
      background-repeat: repeat;
      font-family: 'Plus Jakarta Sans', system-ui, sans-serif;
      color: var(--ink);
      line-height: 1.55;
    }

    a { color: inherit; }

    main { flex: 1 0 auto; }

    .skip-link {
      position: absolute;
      left: 16px;
      top: -40px;
      background: var(--dark);
      color: #fff;
      padding: 8px 12px;
      border-radius: 8px;
      z-index: 50;
    }
    .skip-link:focus { top: 12px; }

    /* ── HEADER ── */
    .site-header {
      position: relative;
      top: auto;
      z-index: 20;
    }

    .site-header-inner {
      max-width: var(--max);
      margin: 0 auto;
      min-height: 72px;
      padding: 14px 24px 8px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 20px;
    }

    .logo {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      text-decoration: none;
      flex-shrink: 0;
    }

    .logo-mark {
      width: 36px;
      height: 36px;
      object-fit: contain;
      flex-shrink: 0;
    }

    .logo-word {
      font-family: 'KG Empire of Dirt', 'Impact', sans-serif;
      font-weight: 400;
      font-size: 1.7rem;
      letter-spacing: 2px;
      color: var(--yellow);
      -webkit-text-stroke: 1.5px var(--dark);
      text-shadow: 2px 2px 0 var(--dark);
      line-height: 1;
    }

    .nav-links {
      display: flex;
      align-items: center;
      gap: 8px;
    }

    .nav-links a {
      text-decoration: none;
      font-size: 0.88rem;
      font-weight: 700;
      color: var(--ink);
      background: rgba(255,255,255,0.4);
      padding: 8px 16px;
      border-radius: 100px;
      transition: background 0.2s ease, transform 0.2s ease;
    }
    .nav-links a:hover { background: rgba(255,255,255,0.6); transform: translateY(-1px); }

    /* ── LAYOUT ── */
    .wrap {
      max-width: var(--max);
      margin: 0 auto;
      padding: 0 24px;
    }

    footer {
      margin-top: auto;
      border: none;
      border-top: 0;
      padding: 40px 0 40px;
    }

    .footer-inner {
      max-width: var(--max);
      margin: 0 auto;
      padding: 0 24px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 16px;
      flex-wrap: wrap;
    }

    .footer-copy {
      font-size: 0.84rem;
      color: var(--muted);
    }

    .footer-links {
      display: flex;
      flex-wrap: wrap;
      gap: 20px;
    }

    .footer-links a {
      font-size: 0.88rem;
      font-weight: 600;
      color: var(--muted);
      text-decoration: none;
    }
    .footer-links a:hover { color: var(--ink); }

    .nav-links a[aria-current="page"] {
      background: #fff;
    }

    .legal {
      max-width: 860px;
      margin: 0 auto;
      padding: 8px 0 72px;
    }

    .legal-card {
      background: var(--paper);
      border: 1px solid var(--line);
      border-radius: 20px;
      padding: 44px 48px;
      box-shadow: 0 1px 2px rgba(18, 32, 38, 0.04), 0 16px 40px rgba(18, 32, 38, 0.08);
    }

    .legal-card h1 {
      font-size: clamp(1.8rem, 3vw, 2.2rem);
      font-weight: 700;
      letter-spacing: -0.03em;
      margin-bottom: 8px;
    }

    .legal-date {
      font-size: 0.85rem;
      color: var(--muted);
      margin-bottom: 28px;
    }

    .legal-card h2 {
      font-size: 1.05rem;
      font-weight: 700;
      letter-spacing: -0.02em;
      margin: 28px 0 10px;
    }

    .legal-card p,
    .legal-card li {
      font-size: 0.98rem;
      line-height: 1.75;
      color: var(--muted);
    }

    .legal-card p { margin-bottom: 16px; }
    .legal-card ul { margin: 0 0 16px 20px; }
    .legal-card li { margin-bottom: 6px; }
    .legal-card a { color: var(--cyan-deep); font-weight: 700; }
    .legal-card strong { color: var(--ink); }
    .legal-card p:last-child { margin-bottom: 0; }

    .legal-card code {
      font-size: 0.88em;
      background: #f3f7f9;
      border-radius: 4px;
      padding: 1px 6px;
    }

    .gdpr-box {
      background: rgba(245, 200, 0, 0.16);
      border-left: 4px solid var(--yellow);
      border-radius: 0 10px 10px 0;
      padding: 16px 20px;
      margin: 12px 0 20px;
    }
    .gdpr-box p { margin-bottom: 0; color: var(--ink); }

    .notice-box {
      background: rgba(245, 200, 0, 0.12);
      border: 1.5px solid var(--yellow);
      border-radius: 10px;
      padding: 16px 20px;
      margin: 16px 0 20px;
    }
    .notice-box p { margin-bottom: 8px; }
    .notice-box p:last-child { margin-bottom: 0; }

    .contact-intro {
      max-width: 640px;
      width: 100%;
      margin: 0 auto;
      padding: 8px 0 24px;
    }

    .contact-kicker {
      display: block;
      font-size: 0.72rem;
      font-weight: 700;
      letter-spacing: 2.5px;
      text-transform: uppercase;
      color: var(--ink);
      margin-bottom: 10px;
    }

    .contact-intro h1 {
      font-size: clamp(2rem, 4vw, 2.8rem);
      font-weight: 700;
      letter-spacing: -0.03em;
      line-height: 1.1;
      margin: 0 0 12px;
    }

    .contact-intro p {
      font-size: 1.05rem;
      color: var(--muted);
      max-width: 520px;
      line-height: 1.7;
      margin: 0;
    }

    .form-card {
      background: var(--paper);
      border: 1px solid var(--line);
      border-radius: 20px;
      padding: 36px 40px;
      max-width: 640px;
      width: 100%;
      margin: 0 auto 72px;
      box-shadow: 0 1px 2px rgba(18, 32, 38, 0.04), 0 16px 40px rgba(18, 32, 38, 0.08);
    }

    #contact-form { display: block; }

    .form-row {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 16px;
      margin-bottom: 18px;
    }

    .form-group {
      display: flex;
      flex-direction: column;
      align-items: stretch;
      margin: 0 0 18px;
    }

    .form-row .form-group { margin-bottom: 0; }

    .form-group label {
      display: block;
      font-size: 0.82rem;
      font-weight: 700;
      margin: 0 0 6px;
    }

    .required::after { content: " *"; color: #c0392b; }

    .optional-hint {
      font-weight: 500;
      color: var(--muted);
    }

    .form-group input,
    .form-group textarea {
      display: block;
      box-sizing: border-box;
      width: 100%;
      font-family: inherit;
      font-size: 0.95rem;
      color: var(--ink);
      background: #f7fbfd;
      border: 1px solid var(--line);
      border-radius: 12px;
      padding: 12px 14px;
      outline: none;
    }

    .form-group input::placeholder,
    .form-group textarea::placeholder { color: #8aa0a8; }

    .form-group input:focus,
    .form-group textarea:focus {
      border-color: var(--cyan-deep);
      box-shadow: 0 0 0 3px rgba(23, 136, 168, 0.16);
      background: #fff;
    }

    .form-group input.error,
    .form-group textarea.error {
      border-color: #c0392b;
      box-shadow: 0 0 0 3px rgba(192, 57, 43, 0.12);
    }

    .error-msg {
      display: none;
      font-size: 0.78rem;
      color: #c0392b;
      margin-top: 6px;
    }

    .error-msg.visible { display: block; }

    .form-group textarea { resize: vertical; min-height: 140px; }

    .hp-field {
      position: absolute;
      width: 1px;
      height: 1px;
      padding: 0;
      margin: -1px;
      overflow: hidden;
      clip: rect(0, 0, 0, 0);
      clip-path: inset(50%);
      border: 0;
      white-space: nowrap;
    }

    .btn-submit {
      display: block;
      width: 100%;
      margin-top: 8px;
      background: var(--dark);
      color: #fff;
      border: none;
      border-radius: 100px;
      padding: 14px 24px;
      font-family: inherit;
      font-size: 1rem;
      font-weight: 700;
      cursor: pointer;
    }

    .btn-submit:hover:not(:disabled) { background: #2a2a46; }
    .btn-submit:disabled { opacity: 0.7; cursor: not-allowed; }

    .form-status {
      display: none;
      margin-top: 12px;
      font-size: 0.88rem;
      color: #c0392b;
      text-align: center;
    }
    .form-status.visible { display: block; }

    .success-msg {
      display: none;
      text-align: center;
      padding: 28px 8px;
    }

    .success-msg.is-visible { display: block; }

    .success-msg h3 {
      font-size: 1.45rem;
      letter-spacing: -0.03em;
      margin: 0 0 8px;
    }

    .success-msg p { color: var(--muted); margin: 0; }

    @media (max-width: 860px) {
      .wrap { padding: 0 16px; }
      .site-header-inner { padding: 12px 16px 8px; gap: 10px; }
      .logo-word { font-size: 1.35rem; letter-spacing: 1px; }
      .nav-links a { padding: 7px 12px; font-size: 0.8rem; }
    }

    @media (max-width: 600px) {
      .legal-card,
      .form-card { padding: 28px 20px; }
      .form-row { grid-template-columns: 1fr; }
    }
