:root {
    --paper: #F5F3EE; --paper-2: #EDEAE2; --line: #DDD9CF; --ink: #141412; --ink-2: #4A4944; --muted: #77756E;
    --green: #6E9F5E; --green-ink: #46733B; --green-soft: #E4EEDF; --peach: #FFA07A; --peach-ink: #5A2A15;
    --dark: #17160F; --dark-2: #23211A; --dark-text: #F5F3EE; --dark-muted: #B4B0A5;
    --w: 1200px; --r: 14px;
  }
  * { box-sizing: border-box; }
  html { scroll-behavior: smooth; }
  body { margin: 0; background: var(--paper); color: var(--ink); font-family: "Plus Jakarta Sans", "Helvetica Neue", Arial, sans-serif; font-size: 17px; line-height: 1.6; -webkit-font-smoothing: antialiased; }
  a { color: inherit; text-decoration: none; }
  a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible { outline: 2px solid var(--green); outline-offset: 3px; }
  img { max-width: 100%; display: block; }
  .wrap { width: min(var(--w), calc(100% - 48px)); margin: 0 auto; }
  h1, h2, h3 { margin: 0; font-weight: 800; letter-spacing: -0.035em; line-height: 1.02; text-wrap: balance; }
  h1 { font-size: clamp(42px, 6.2vw, 88px); }
  h2 { font-size: clamp(34px, 4.4vw, 60px); }
  h3 { font-size: 22px; letter-spacing: -0.02em; line-height: 1.2; }
  p { margin: 0; }
  .eyebrow { display: inline-flex; align-items: center; gap: 10px; font-size: 12px; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; color: var(--muted); }
  .eyebrow::before { content: ""; width: 8px; height: 8px; border-radius: 2px; background: var(--green); }
  .lead { font-size: 20px; line-height: 1.55; color: var(--ink-2); max-width: 34em; }
  .green { color: var(--green-ink); }
  .btn { display: inline-flex; align-items: center; gap: 12px; height: 56px; padding: 0 26px; border-radius: 999px; font-weight: 700; font-size: 16px; white-space: nowrap; transition: transform .15s ease, background .15s ease; border: 0; cursor: pointer; font-family: inherit; }
  .btn:hover { transform: translateY(-1px); }
  .btn-primary { background: var(--ink); color: var(--paper); }
  .btn-primary:hover { background: #000; }
  .btn-primary .dot { width: 30px; height: 30px; border-radius: 50%; background: var(--green); display: inline-flex; align-items: center; justify-content: center; margin-right: -10px; }
  .btn-ghost { background: transparent; color: var(--ink); border: 1.5px solid var(--line); }
  .btn-ghost:hover { border-color: var(--ink); }
  .btn-light { background: var(--paper); color: var(--ink); }
  .btn-sm { height: 46px; padding: 0 20px; font-size: 14px; }
  section { padding: 112px 0; }
  .grid { display: grid; gap: 24px; }
  .head { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: 48px; align-items: end; margin-bottom: 56px; }
  .head .lead { font-size: 18px; }
  .card { background: #fff; border: 1px solid var(--line); border-radius: var(--r); padding: 32px; display: flex; flex-direction: column; gap: 14px; }
  .icon { width: 44px; height: 44px; border-radius: 12px; background: var(--green-soft); display: inline-flex; align-items: center; justify-content: center; color: var(--green-ink); }
  .icon svg { width: 22px; height: 22px; }
  .card p { color: var(--ink-2); font-size: 16px; }
  .tag { display: inline-block; font-size: 12px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--muted); }

  /* Nav */
  .nav { position: sticky; top: 0; z-index: 50; background: rgba(245,243,238,0.86); backdrop-filter: blur(12px); border-bottom: 1px solid transparent; }
  .nav.scrolled { border-bottom-color: var(--line); }
  .nav .wrap { display: flex; align-items: center; justify-content: space-between; height: 76px; gap: 24px; }
  .logo { display: flex; align-items: center; gap: 10px; font-weight: 800; font-size: 21px; letter-spacing: -0.03em; }
  .logo svg { width: 26px; height: 26px; }
  .nav-links { display: flex; gap: 32px; font-size: 14px; font-weight: 600; color: var(--ink-2); }
  .nav-links a:hover { color: var(--ink); }
  .nav-right { display: flex; align-items: center; gap: 20px; }
  .nav-phone { font-size: 14px; font-weight: 600; color: var(--ink-2); }
  .lang-switch{display:inline-flex;align-items:center;gap:7px;font-size:12px;font-weight:800;letter-spacing:.06em;color:var(--ink-2);padding:8px 11px;border:1px solid var(--line);border-radius:999px;background:rgba(255,255,255,.45);transition:.2s}.lang-switch:hover{border-color:var(--green);color:var(--ink);transform:translateY(-1px)}.flag-icon{display:inline-block;width:23px;height:16px;border-radius:3px;border:1px solid rgba(20,20,18,.16);box-shadow:0 1px 3px rgba(20,20,18,.16);overflow:hidden}.flag-gb{background:linear-gradient(33deg,transparent 42%,#fff 43%,#fff 49%,#c8102e 50%,#c8102e 56%,#fff 57%,#fff 62%,transparent 63%),linear-gradient(-33deg,transparent 42%,#fff 43%,#fff 49%,#c8102e 50%,#c8102e 56%,#fff 57%,#fff 62%,transparent 63%),linear-gradient(90deg,transparent 38%,#fff 39%,#fff 61%,transparent 62%),linear-gradient(0deg,transparent 34%,#fff 35%,#fff 65%,transparent 66%),#012169}.flag-de{background:linear-gradient(#1a1a1a 0 33%,#dd0000 33% 66%,#ffce00 66% 100%)}

  /* Hero */
  .hero { padding: 72px 0 40px; }
  .hero-grid { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 56px; align-items: center; }
  .hero-copy { display: flex; flex-direction: column; gap: 28px; }
  .badge { display: inline-flex; align-items: center; gap: 8px; align-self: flex-start; font-size: 13px; font-weight: 600; color: var(--ink-2); background: #fff; border: 1px solid var(--line); border-radius: 999px; padding: 8px 14px 8px 10px; }
  .badge i { width: 8px; height: 8px; border-radius: 50%; background: var(--green); box-shadow: 0 0 0 0 rgba(110,159,94,.5); animation: pulse 2s infinite; }
  @keyframes pulse { 0% { box-shadow: 0 0 0 0 rgba(110,159,94,.55); } 70% { box-shadow: 0 0 0 9px rgba(110,159,94,0); } 100% { box-shadow: 0 0 0 0 rgba(110,159,94,0); } }
  .cta-row { display: flex; flex-wrap: wrap; gap: 14px; align-items: center; }
  .trust { display: flex; flex-wrap: wrap; gap: 8px 22px; font-size: 14px; color: var(--muted); font-weight: 500; }
  .trust span { display: inline-flex; align-items: center; gap: 8px; }
  .trust svg { width: 16px; height: 16px; color: var(--green-ink); }
  /* Hero visual: workflow board instead of stock photo */
  .visual { position: relative; background: var(--dark); border-radius: 22px; padding: 28px; color: var(--dark-text); min-height: 460px; display: flex; flex-direction: column; gap: 14px; overflow: hidden; }
  .visual::after { content: ""; position: absolute; inset: auto -80px -120px auto; width: 320px; height: 320px; border-radius: 50%; background: radial-gradient(closest-side, rgba(110,159,94,.45), rgba(110,159,94,0)); pointer-events: none; }
  .v-head { display: flex; justify-content: space-between; align-items: center; font-size: 12px; letter-spacing: .12em; text-transform: uppercase; color: var(--dark-muted); font-weight: 700; }
  .v-row { position: relative; z-index: 1; display: grid; grid-template-columns: 1fr auto 1fr; gap: 12px; align-items: center; background: var(--dark-2); border: 1px solid rgba(255,255,255,.07); border-radius: 12px; padding: 14px 16px; font-size: 14px; }
  .v-row .from { color: var(--dark-muted); text-decoration: line-through; text-decoration-color: rgba(255,160,122,.7); }
  .v-row .to { font-weight: 700; }
  .v-row .arrow { color: var(--green); }
  .v-tools { position: relative; z-index: 1; margin-top: auto; display: flex; flex-wrap: wrap; gap: 8px; }
  .v-tools span { font-size: 12px; font-weight: 600; padding: 6px 12px; border-radius: 999px; border: 1px solid rgba(255,255,255,.14); color: var(--dark-text); }
  .v-tools .lbl { border: 0; color: var(--dark-muted); padding-left: 0; }

  /* Proof */
  .proof { padding: 40px 0 0; }
  .proof-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
  .proof-grid div { padding: 32px 24px 32px 0; border-right: 1px solid var(--line); }
  .proof-grid div:last-child { border-right: 0; }
  .proof-grid div + div { padding-left: 24px; }
  .num { font-size: 44px; font-weight: 800; letter-spacing: -0.04em; line-height: 1; font-variant-numeric: tabular-nums; }
  .proof-grid small { display: block; margin-top: 8px; font-size: 14px; color: var(--muted); }

  /* Pain */
  .pain .grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .pain .card { background: var(--paper-2); border-color: transparent; }
  .pain .card strong { font-size: 19px; letter-spacing: -0.01em; line-height: 1.3; }

  /* Services */
  .services .grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .services .card { padding: 40px; gap: 18px; }
  .services .card ul { margin: 4px 0 0; padding: 0; list-style: none; display: flex; flex-wrap: wrap; gap: 8px; }
  .services .card li { font-size: 13px; font-weight: 600; color: var(--ink-2); background: var(--paper); border-radius: 999px; padding: 6px 12px; }
  .services .card .more { margin-top: auto; padding-top: 8px; font-weight: 700; font-size: 15px; color: var(--green-ink); display: inline-flex; gap: 8px; align-items: center; }

  /* AI tools */
  .ai { background: #fff; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
  .ai-grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 64px; align-items: start; }
  .tools { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 28px; }
  .tools span { font-weight: 700; font-size: 15px; padding: 12px 18px; border: 1.5px solid var(--line); border-radius: 12px; background: var(--paper); }
  .ai-steps { display: grid; gap: 0; border-top: 1px solid var(--line); }
  .ai-step { display: grid; grid-template-columns: 56px minmax(0, 1fr); gap: 20px; padding: 30px 0; border-bottom: 1px solid var(--line); }
  .ai-step .n { font-weight: 800; font-size: 14px; color: var(--green-ink); letter-spacing: .08em; padding-top: 4px; }
  .ai-step h3 { margin-bottom: 8px; }
  .ai-step p { color: var(--ink-2); font-size: 16px; }
  .usecases { margin-top: 36px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 28px; font-size: 15px; font-weight: 500; color: var(--ink-2); }
  .usecases span { display: flex; gap: 10px; align-items: flex-start; }
  .usecases svg { flex: none; width: 18px; height: 18px; color: var(--green-ink); margin-top: 3px; }

  /* Dark band */
  .studio { padding: 0; }
  .studio .wrap { background: var(--dark); color: var(--dark-text); border-radius: 28px; padding: 88px 72px; display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 6fr); gap: 56px; align-items: center; position: relative; overflow: hidden; }
  .studio .eyebrow { color: var(--dark-muted); }
  .studio .lead { color: var(--dark-muted); }
  .studio-copy { display: flex; flex-direction: column; gap: 24px; }
  .studio-visual { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
  .frame { aspect-ratio: 3 / 4; border-radius: 12px; background: linear-gradient(160deg, #2C2A22, #1C1B14); border: 1px solid rgba(255,255,255,.08); display: flex; align-items: flex-end; padding: 14px; font-size: 12px; color: var(--dark-muted); position: relative; }
  .frame img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:.82; }
  .frame span { position:relative; z-index:2; }
  .frame.play::before { content: ""; position: absolute; left: 50%; top: 50%; width: 52px; height: 52px; margin: -26px 0 0 -26px; border-radius: 50%; background: var(--green); }
  .frame.play::after { content: ""; position: absolute; left: 50%; top: 50%; margin: -8px 0 0 -5px; border-left: 14px solid var(--dark); border-top: 8px solid transparent; border-bottom: 8px solid transparent; }
  .big-a { position: absolute; right: -20px; bottom: -70px; font-size: 360px; font-weight: 800; letter-spacing: -0.06em; color: rgba(255,255,255,.04); line-height: 1; pointer-events: none; }

  /* Process */
  .process .grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .step { border-top: 2px solid var(--ink); padding-top: 24px; display: flex; flex-direction: column; gap: 12px; }
  .step .n { font-size: 13px; font-weight: 800; letter-spacing: .1em; color: var(--green-ink); }
  .step p { color: var(--ink-2); font-size: 16px; }
  .step .time { font-size: 13px; font-weight: 600; color: var(--muted); }

  /* References */
  .refs .grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .ref { background: #fff; border: 1px solid var(--line); border-radius: var(--r); overflow: hidden; display: flex; flex-direction: column; transition: transform .2s ease, box-shadow .2s ease; }
  .ref:hover { transform: translateY(-3px); box-shadow: 0 18px 40px -24px rgba(20,20,18,.35); }
  .shot { aspect-ratio: 16 / 11; background: var(--paper-2); display: flex; align-items: center; justify-content: center; position: relative; }
  .shot .mono { font-weight: 800; font-size: 34px; letter-spacing: -0.04em; color: var(--ink); opacity: .9; }
  .shot img { width: 100%; height: 100%; object-fit: cover; }
  .shot .ph { position: absolute; left: 14px; bottom: 12px; font-size: 11px; color: var(--muted); }
  .ref-body { padding: 22px 24px 24px; display: flex; flex-direction: column; gap: 8px; }
  .ref-body h3 { font-size: 19px; }
  .ref-body p { color: var(--ink-2); font-size: 15px; }
  .ref-body .meta { display: flex; justify-content: space-between; gap: 12px; font-size: 13px; color: var(--muted); margin-top: 6px; }
  .ref-body .meta b { color: var(--green-ink); font-weight: 700; }
  .refs .more-row { display: flex; justify-content: center; margin-top: 40px; }

  /* Marquee */
  .marquee { padding: 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); overflow: hidden; white-space: nowrap; }
  .marquee .track { display: inline-flex; gap: 40px; padding: 22px 0; font-weight: 800; font-size: 22px; letter-spacing: -0.02em; animation: slide 40s linear infinite; }
  .marquee .track span::after { content: "✦"; color: var(--green); margin-left: 40px; font-size: 16px; }
  @keyframes slide { from { transform: translateX(0); } to { transform: translateX(-50%); } }

  /* Testimonials */
  .quotes .grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .quote { background: #fff; border: 1px solid var(--line); border-radius: var(--r); padding: 36px; display: flex; flex-direction: column; gap: 20px; }
  .quote blockquote { margin: 0; font-size: 20px; font-weight: 600; letter-spacing: -0.01em; line-height: 1.4; }
  .quote .who { display: flex; align-items: center; gap: 12px; font-size: 14px; color: var(--muted); }
  .quote .who i { width: 40px; height: 40px; border-radius: 50%; background: var(--paper-2); }

  /* FAQ */
  .faq .head { margin-bottom: 40px; }
  details { border-top: 1px solid var(--line); }
  details:last-of-type { border-bottom: 1px solid var(--line); }
  summary { cursor: pointer; list-style: none; display: flex; justify-content: space-between; gap: 24px; align-items: center; padding: 24px 0; font-weight: 700; font-size: 19px; letter-spacing: -0.01em; }
  summary::-webkit-details-marker { display: none; }
  summary::after { content: "+"; font-size: 26px; font-weight: 400; color: var(--muted); flex: none; }
  details[open] summary::after { content: "–"; }
  details p { padding: 0 0 26px; color: var(--ink-2); max-width: 64ch; }

  /* Contact (peach) */
  .contact { padding: 0 0 0; }
  .contact .wrap { background: var(--peach); color: var(--ink); border-radius: 28px; padding: 88px 72px; display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); gap: 64px; align-items: start; }
  .contact .eyebrow { color: var(--peach-ink); }
  .contact .eyebrow::before { background: var(--ink); }
  .contact .lead { color: #4A2C1E; }
  .contact-copy { display: flex; flex-direction: column; gap: 24px; }
  .contact-list { display: grid; gap: 10px; margin-top: 8px; font-weight: 600; }
  .contact-list a:hover { text-decoration: underline; }
  form { background: var(--paper); border-radius: 18px; padding: 32px; display: flex; flex-direction: column; gap: 14px; }
  form label { font-size: 13px; font-weight: 700; color: var(--ink-2); display: flex; flex-direction: column; gap: 6px; }
  form input, form textarea { font: inherit; font-size: 15px; padding: 14px 16px; border: 1.5px solid var(--line); border-radius: 10px; background: #fff; color: var(--ink); width: 100%; }
  form textarea { min-height: 110px; resize: vertical; }
  form .fine { font-size: 12px; color: var(--muted); }
  .form-ok { display: none; background: var(--paper); border-radius: 18px; padding: 40px 32px; font-weight: 600; }

  /* Footer */
  footer { padding: 56px 0 32px; }
  .foot-grid { display: grid; grid-template-columns: minmax(0, 2fr) repeat(3, minmax(0, 1fr)); gap: 32px; padding-bottom: 40px; border-bottom: 1px solid var(--line); font-size: 14px; color: var(--ink-2); }
  .foot-grid .tag { margin-bottom: 12px; }
  .foot-grid div { display: flex; flex-direction: column; gap: 6px; align-items: flex-start; }
  .foot-grid a:hover { color: var(--ink); }
  .foot-bottom { display: flex; justify-content: space-between; gap: 16px; padding-top: 24px; font-size: 13px; color: var(--muted); flex-wrap: wrap; }

  /* Sticky mobile CTA */
  .sticky-cta { display: none; }
  .consent { position: fixed; left: 24px; bottom: 24px; z-index: 80; width: min(430px, calc(100% - 48px)); padding: 22px; background: var(--dark); color: var(--dark-text); border: 1px solid rgba(255,255,255,.12); border-radius: 14px; box-shadow: 0 22px 60px rgba(20,20,18,.28); display: none; }
  .consent.show { display: block; }
  .consent p { color: var(--dark-muted); font-size: 14px; margin-bottom: 16px; }
  .consent-actions { display: flex; gap: 10px; }
  .consent .btn { height: 44px; font-size: 14px; padding: 0 18px; }
  .consent .btn-ghost { color: var(--dark-text); border-color: rgba(245,243,238,.72); }
  .consent .btn-ghost:hover { color: var(--dark); background: var(--paper); border-color: var(--paper); }
  .consent .btn-light:hover { background: #fff; }

  /* Premium navigation and hero */
  .nav { isolation:isolate; transition:background .35s ease,border-color .35s ease,box-shadow .35s ease; }
  .nav::after { content:""; position:absolute; left:50%; bottom:-1px; width:min(var(--w),calc(100% - 48px)); height:1px; transform:translateX(-50%) scaleX(0); background:linear-gradient(90deg,transparent,var(--green),var(--peach),transparent); transition:transform .45s ease; }
  .nav.scrolled { background:rgba(245,243,238,.78); box-shadow:0 16px 40px rgba(20,20,18,.06); }
  .nav.scrolled::after { transform:translateX(-50%) scaleX(1); }
  .nav-links a { position:relative; padding:27px 0; }
  .nav-links a::after { content:""; position:absolute; left:0; right:100%; bottom:19px; height:2px; border-radius:2px; background:var(--green); transition:right .25s ease; }
  .nav-links a:hover::after { right:0; }
  .nav .btn-primary { box-shadow:0 8px 24px rgba(20,20,18,.14); }
  .hero { position:relative; isolation:isolate; overflow:hidden; padding:88px 0 64px; }
  .hero::before,.hero::after { content:""; position:absolute; z-index:-1; pointer-events:none; border-radius:50%; filter:blur(2px); }
  .hero::before { width:560px; height:560px; left:-260px; top:-260px; background:radial-gradient(circle,rgba(110,159,94,.22),rgba(110,159,94,0) 68%); animation:heroGlow 9s ease-in-out infinite alternate; }
  .hero::after { width:620px; height:620px; right:-230px; bottom:-330px; background:radial-gradient(circle,rgba(255,160,122,.25),rgba(255,160,122,0) 68%); animation:heroGlow 11s ease-in-out infinite alternate-reverse; }
  .hero-copy { position:relative; animation:heroRise .75s cubic-bezier(.2,.75,.25,1) both; }
  .hero h1 { max-width:11ch; text-shadow:0 1px 0 rgba(255,255,255,.55); }
  .hero h1 .green { background:linear-gradient(110deg,var(--green-ink) 5%,var(--green) 48%,var(--green-ink) 92%); background-size:200% auto; -webkit-background-clip:text; background-clip:text; color:transparent; animation:headlineShine 7s linear infinite; }
  .badge { box-shadow:0 10px 35px rgba(20,20,18,.07),inset 0 1px 0 rgba(255,255,255,.8); backdrop-filter:blur(10px); }
  .visual { isolation:isolate; transform:perspective(1200px) rotateY(-2deg) rotateX(1deg); box-shadow:0 34px 80px -30px rgba(20,20,18,.5),inset 0 1px 0 rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.1); animation:visualIn .9s .12s cubic-bezier(.2,.75,.25,1) both; transition:transform .45s ease,box-shadow .45s ease; }
  .visual:hover { transform:perspective(1200px) rotateY(0) rotateX(0) translateY(-5px); box-shadow:0 44px 90px -30px rgba(20,20,18,.6); }
  .visual::before { content:""; position:absolute; inset:0; background:linear-gradient(125deg,rgba(255,255,255,.08),transparent 30%,transparent 70%,rgba(255,160,122,.08)); pointer-events:none; }
  .v-row { transition:transform .3s ease,border-color .3s ease,background .3s ease; }
  .v-row:hover { transform:translateX(-6px); border-color:rgba(110,159,94,.45); background:#29271e; }
  .v-row:nth-of-type(2){animation:rowFloat 5s ease-in-out infinite}.v-row:nth-of-type(3){animation:rowFloat 5s .7s ease-in-out infinite}.v-row:nth-of-type(4){animation:rowFloat 5s 1.4s ease-in-out infinite}
  @keyframes heroRise { from{opacity:0;transform:translateY(22px)} to{opacity:1;transform:none} }
  @keyframes visualIn { from{opacity:0;transform:perspective(1200px) rotateY(-7deg) translateX(35px)} }
  @keyframes heroGlow { to{transform:translate3d(35px,24px,0) scale(1.08)} }
  @keyframes headlineShine { to{background-position:200% center} }
  @keyframes rowFloat { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-3px)} }
  @media(prefers-reduced-motion:reduce){.hero::before,.hero::after,.hero-copy,.visual,.hero h1 .green,.v-row{animation:none!important}.visual{transform:none}}

  /* Homepage hero: signature art direction */
  .hero-pro{min-height:calc(100svh - 76px);display:flex;align-items:center;padding:70px 0 82px;background-image:linear-gradient(90deg,rgba(245,243,238,.98) 0%,rgba(245,243,238,.94) 37%,rgba(245,243,238,.64) 67%,rgba(245,243,238,.42) 100%),linear-gradient(0deg,rgba(245,243,238,.28),rgba(245,243,238,.28)),url("assets/hero-vienna-growth-v1.webp");background-size:cover;background-position:center;background-repeat:no-repeat}
  .hero-pro .hero-grid{grid-template-columns:minmax(0,1.08fr) minmax(480px,.92fr);gap:clamp(42px,6vw,90px)}
  .hero-gridlines{position:absolute;inset:0;z-index:-2;opacity:.46;background-image:linear-gradient(rgba(20,20,18,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(20,20,18,.035) 1px,transparent 1px);background-size:52px 52px;mask-image:linear-gradient(to bottom,transparent,#000 18%,#000 75%,transparent)}
  .hero-gridlines:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,var(--paper) 0,transparent 18%,transparent 82%,var(--paper) 100%)}
  .hero-orbit{position:absolute;z-index:-1;border:1px solid rgba(110,159,94,.2);border-radius:50%;pointer-events:none}
  .orbit-a{width:520px;height:520px;right:-120px;top:20px;animation:orbitSpin 28s linear infinite}
  .orbit-b{width:310px;height:310px;right:180px;top:150px;border-color:rgba(255,160,122,.3);animation:orbitSpin 20s linear infinite reverse}
  .hero-orbit:before{content:"";position:absolute;width:12px;height:12px;top:12%;left:12%;border-radius:50%;background:var(--green);box-shadow:0 0 0 7px rgba(110,159,94,.12),0 0 28px var(--green)}
  .hero-line{display:block;animation:lineReveal .8s cubic-bezier(.2,.8,.2,1) both}.hero-line:nth-child(2){animation-delay:.08s}.hero-line:nth-child(3){animation-delay:.16s}
  .hero-pro h1{font-size:clamp(54px,6vw,92px);max-width:10.8ch;line-height:.94;letter-spacing:-.065em}
  .hero-pro .lead{font-size:clamp(18px,1.5vw,21px);max-width:31em}
  .hero-cta{position:relative;overflow:hidden;box-shadow:0 18px 42px rgba(20,20,18,.2)}
  .hero-cta:before{content:"";position:absolute;inset:-2px;transform:translateX(-120%) skewX(-18deg);background:linear-gradient(90deg,transparent,rgba(255,255,255,.24),transparent);transition:transform .7s ease}
  .hero-cta:hover:before{transform:translateX(120%) skewX(-18deg)}
  .hero-stage{position:relative;perspective:1400px;animation:visualIn .95s .1s cubic-bezier(.2,.75,.25,1) both}
  .pro-console{min-height:540px;padding:18px;border-radius:28px;background:linear-gradient(145deg,#201f18,#11110d);transform:rotateY(-5deg) rotateX(2deg);overflow:visible}
  .pro-console:after{width:390px;height:390px;right:-80px;bottom:-110px;background:radial-gradient(circle,rgba(110,159,94,.38),transparent 66%)}
  .console-bar{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:4px 4px 16px;color:#8f8b80;font-size:10px;letter-spacing:.12em;text-transform:uppercase}
  .console-lights{display:flex;gap:5px}.console-lights i{width:6px;height:6px;border-radius:50%;background:#45433a}.console-lights i:nth-child(2){background:var(--peach)}.console-lights i:nth-child(3){background:var(--green)}
  .console-bar .live{justify-self:end;display:flex;align-items:center;gap:6px;color:#c9c6bd}.console-bar .live i{width:6px;height:6px;border-radius:50%;background:var(--green);box-shadow:0 0 12px var(--green);animation:pulse 2s infinite}
  .console-title{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:22px 20px 26px;border-top:1px solid rgba(255,255,255,.08)}
  .console-title small,.console-bottom small{display:block;color:#89867d;font-size:11px;text-transform:uppercase;letter-spacing:.11em;margin-bottom:5px}.console-title strong{font-size:21px;letter-spacing:-.035em}
  .ai-mark{display:grid;place-items:center;width:58px;height:58px;border-radius:18px;background:linear-gradient(135deg,var(--green),#98bd8c);color:#11110d;font-weight:800;box-shadow:0 12px 30px rgba(110,159,94,.24)}
  .flow{position:relative;display:grid;gap:10px;padding:0 7px}.flow-line{position:absolute;left:35px;top:34px;bottom:34px;width:1px;background:linear-gradient(var(--green),var(--peach));opacity:.45}
  .flow-node{position:relative;display:grid;grid-template-columns:42px 1fr auto;gap:13px;align-items:center;padding:17px 16px;border:1px solid rgba(255,255,255,.08);border-radius:15px;background:rgba(255,255,255,.035);backdrop-filter:blur(12px);transition:transform .3s ease,border-color .3s ease}
  .flow-node:hover{transform:translateX(6px);border-color:rgba(255,160,122,.45)}.flow-node.active{background:linear-gradient(100deg,rgba(110,159,94,.16),rgba(255,255,255,.05));border-color:rgba(110,159,94,.38)}
  .flow-node>i{position:relative;z-index:1;display:grid;place-items:center;width:36px;height:36px;border-radius:11px;background:#292820;color:var(--peach);font-size:10px;font-style:normal;font-weight:800}
  .flow-node span small{display:block;color:#858279;font-size:10px;text-transform:uppercase;letter-spacing:.1em}.flow-node span strong{font-size:14px}.flow-node b{color:var(--green);font-weight:400}
  .console-bottom{margin-top:auto;display:flex;align-items:end;justify-content:space-between;gap:20px;padding:20px 14px 7px}.console-bottom strong{display:flex;align-items:center;gap:7px;font-size:12px}.console-bottom strong i{width:7px;height:7px;border-radius:50%;background:var(--green);box-shadow:0 0 12px var(--green)}
  .mini-chart{height:55px;width:150px;display:flex;align-items:end;gap:5px}.mini-chart span{flex:1;border-radius:4px 4px 1px 1px;background:linear-gradient(to top,var(--green),#9fc295);animation:barGrow .9s ease both;transform-origin:bottom}
  .float-chip{position:absolute;z-index:4;display:grid;grid-template-columns:auto 1fr;column-gap:9px;align-items:center;padding:13px 16px;border:1px solid rgba(255,255,255,.75);border-radius:16px;background:rgba(255,255,255,.75);backdrop-filter:blur(16px);box-shadow:0 20px 45px rgba(20,20,18,.15);color:var(--ink);animation:chipFloat 5s ease-in-out infinite}
  .float-chip strong{font-size:18px;line-height:1}.float-chip small{grid-column:2;color:var(--muted);font-size:10px}.chip-dot{grid-row:1/3;width:24px;height:24px;border-radius:8px;background:var(--green);box-shadow:inset 0 0 0 7px rgba(255,255,255,.42)}
  .chip-top{right:-22px;top:56px}.chip-side{left:-38px;bottom:54px;animation-delay:-2s}.chip-side>span{grid-row:1/3;display:grid;place-items:center;width:25px;height:25px;border-radius:50%;background:var(--peach);font-size:12px}
  @keyframes lineReveal{from{opacity:0;transform:translateY(45px);clip-path:inset(100% 0 0)}to{opacity:1;transform:none;clip-path:inset(0)}}
  @keyframes orbitSpin{to{transform:rotate(360deg)}}@keyframes chipFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}@keyframes barGrow{from{transform:scaleY(0)}}

  @media (max-width: 960px) {
    section { padding: 80px 0; }
    .nav-links, .nav-phone { display: none; }
    .lang-switch{margin-left:auto;margin-right:10px}
    .hero-grid, .head, .ai-grid, .studio .wrap, .contact .wrap { grid-template-columns: 1fr; }
    .studio .wrap, .contact .wrap { padding: 56px 28px; }
    .pain .grid, .services .grid, .process .grid, .refs .grid, .quotes .grid { grid-template-columns: 1fr; }
    .proof-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .proof-grid div:nth-child(2) { border-right: 0; }
    .proof-grid div:nth-child(n+3) { border-top: 1px solid var(--line); }
    .proof-grid div:nth-child(3) { padding-left: 0; }
    .usecases { grid-template-columns: 1fr; }
    .foot-grid { grid-template-columns: 1fr 1fr; }
    .big-a { display: none; }
    .sticky-cta { display: flex; position: fixed; left: 0; right: 0; bottom: 0; z-index: 60; padding: 12px 16px calc(12px + env(safe-area-inset-bottom)); background: rgba(245,243,238,.94); backdrop-filter: blur(10px); border-top: 1px solid var(--line); gap: 10px; }
    .sticky-cta .btn { flex: 1; justify-content: center; height: 50px; }
    body { padding-bottom: 80px; }
    .hero { padding-top:64px }.visual{transform:none}
    .hero-pro{min-height:auto}.hero-pro .hero-grid{grid-template-columns:1fr}.hero-stage{width:min(100%,620px);margin:10px auto 0}.pro-console{min-height:510px}.chip-side{left:-8px}.chip-top{right:-8px}
    .consent { bottom: 96px; }
  }
  @media (prefers-reduced-motion: reduce) {
    .badge i, .marquee .track,.hero-line,.hero-orbit,.float-chip,.mini-chart span { animation: none; }
    html { scroll-behavior: auto; }
  }

  /* Modal contact form on homepage */
  .modal{position:fixed;inset:0;z-index:100;display:grid;place-items:center;padding:20px;background:rgba(20,20,18,.58);backdrop-filter:blur(14px);opacity:0;visibility:hidden;transition:opacity .25s,visibility .25s}.modal.is-open{opacity:1;visibility:visible}.modal-card{position:relative;width:min(560px,100%);max-height:calc(100vh - 40px);overflow:auto;padding:42px;border:1px solid rgba(255,255,255,.75);border-radius:26px;background:var(--paper);box-shadow:0 35px 100px rgba(0,0,0,.3);transform:translateY(14px) scale(.98);transition:transform .3s}.modal.is-open .modal-card{transform:none}.modal-card h2{margin:12px 0 25px;font-size:40px;line-height:1;letter-spacing:-.055em}.modal-card form{display:flex;flex-direction:column;gap:15px;padding:0;background:transparent}.modal-card form label{display:flex;flex-direction:column;gap:7px;width:100%;font-size:13px;font-weight:700;color:var(--ink-2);white-space:normal}.modal-card form input:not([type="checkbox"]),.modal-card form textarea{display:block;width:100%;min-height:50px;padding:14px 16px;border:1.5px solid var(--line);border-radius:11px;background:#fff;color:var(--ink);font:inherit;font-size:15px}.modal-card form textarea{min-height:120px;resize:vertical}.modal-card form label.fine{display:flex;flex-direction:row;align-items:flex-start;gap:9px;font-size:12px;font-weight:400;line-height:1.45}.modal-card form label.fine input[type="checkbox"]{width:17px;height:17px;flex:none;margin:1px 0}.modal-card form label.fine a{color:var(--green-ink);text-decoration:underline}.modal-close{position:absolute;right:19px;top:15px;border:0;background:transparent;font-size:29px;line-height:1;color:var(--muted);cursor:pointer}.modal-close:hover{color:var(--ink)}body.modal-open{overflow:hidden}
  @media(max-width:600px){.modal{padding:12px}.modal-card{padding:31px 21px;border-radius:21px}.modal-card h2{font-size:32px}.modal-card form{gap:12px}}
  @media (max-width: 600px) {
    .hero-pro{padding:42px 0 62px;background-image:linear-gradient(180deg,rgba(245,243,238,.97) 0%,rgba(245,243,238,.9) 48%,rgba(245,243,238,.65) 100%),url("assets/hero-vienna-growth-v1.webp");background-position:64% center}.hero-pro h1{font-size:clamp(43px,13vw,58px)}
    .hero-pro .hero-copy{gap:22px}.hero-pro .hero-grid{gap:42px}
    .pro-console{min-height:470px;padding:13px;border-radius:22px}
    .console-title{padding:18px 11px 21px}.console-title strong{font-size:17px}.ai-mark{width:48px;height:48px;border-radius:14px}
    .flow-node{grid-template-columns:38px 1fr auto;padding:14px 11px;gap:9px}.flow-node span strong{font-size:12px}
    .mini-chart{width:105px}.float-chip{padding:10px 12px}.chip-top{top:44px}.chip-side{bottom:34px}
    .orbit-a{right:-310px}.orbit-b{right:-170px}
  }