/*
Theme Name: Susan Strebe
Theme URI: https://susanstrebe.de
Author: Susan Strebe
Author URI: https://susanstrebe.de
Description: Individuelles One-Page-Theme für susanstrebe.de
Version: 1.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: susanstrebe
*/

:root{
  --ink:#171513;
  --paper:#FBF8F1;
  --acid:#D6FF3D;
  --rust:#C8482B;
  --clay:#6E665C;
  --cream:#F2ECE0;

  --ink-70:rgba(23,21,19,.70);
  --ink-45:rgba(23,21,19,.45);
  --ink-18:rgba(23,21,19,.18);
  --ink-08:rgba(23,21,19,.08);
  --paper-70:rgba(251,248,241,.70);
  --paper-18:rgba(251,248,241,.18);

  --f-display:'Bebas Neue','Oswald',Impact,sans-serif;
  --f-lede:'Oswald','Arial Narrow',sans-serif;
  --f-body:'Inter',system-ui,-apple-system,sans-serif;
  --f-mono:'Space Mono','SFMono-Regular',monospace;
}

*{ box-sizing:border-box; }
body{ margin:0; background:var(--paper); font-family:var(--f-body); color:var(--ink); }
a{ color:var(--rust); text-decoration:none; }
a:hover{ color:var(--ink); }

.label{
  font-family:var(--f-mono); font-weight:700; font-size:12px;
  letter-spacing:.24em; text-transform:uppercase;
}

.btn{
  display:inline-flex; align-items:center; gap:8px;
  font-family:var(--f-mono); font-weight:700; font-size:13px;
  letter-spacing:.14em; text-transform:uppercase;
  padding:16px 28px; border-radius:999px;
  border:1.5px solid var(--ink); background:var(--ink); color:var(--paper);
  cursor:pointer;
}
.btn.outline{ background:transparent; color:var(--ink); }
.btn.on-ink{ border-color:var(--paper); background:var(--acid); color:var(--ink); }

.card{
  background:var(--cream); border:1.5px solid var(--ink);
  padding:28px; box-shadow:6px 6px 0 0 var(--ink);
}

.grid-bg{
  background-color:var(--ink);
  background-image:
    linear-gradient(var(--paper-18) 1px, transparent 1px),
    linear-gradient(90deg, var(--paper-18) 1px, transparent 1px);
  background-size:56px 56px;
}

.section{ padding:96px 56px; }
@media (max-width:900px){ .section{ padding:64px 24px; } }

.icon-badge{
  width:40px; height:40px; display:flex; align-items:center; justify-content:center;
  border:1.5px solid var(--ink); color:var(--ink); flex-shrink:0;
}

.field{ display:flex; flex-direction:column; gap:8px; }
.field input, .field select, .field textarea{
  font-family:var(--f-body); font-size:16px; padding:14px 16px;
  border:1.5px solid var(--ink); background:var(--paper); color:var(--ink); border-radius:0;
}