/* =========================================================
   Meinz & Partner — Stylesheet
   Tokens: ink #221B15 · paper #F6F1E6 · brown #5B3A29
           forest #3E5641 · gold #A47148 · line #D9CCAA
   Type: Fraunces (display) · Inter (body) · IBM Plex Mono (data)
   ========================================================= */

@import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght,SOFT,WONK@9..144,300..700,0..100,0..1&family=Inter:wght@400;500;600&family=IBM+Plex+Mono:wght@500&display=swap');

:root{
  --ink:        #221B15;
  --ink-soft:   #4A4136;
  --paper:      #F6F1E6;
  --paper-dim:  #ECE3CB;
  --white:      #FFFDF8;
  --brown:      #5B3A29;
  --brown-deep: #3E2A1F;
  --forest:     #3E5641;
  --forest-deep:#2C4030;
  --gold:       #A47148;
  --line:       #D9CCAA;
  --shadow:     0 18px 40px -22px rgba(34,27,21,.35);

  --display: "Fraunces", "Iowan Old Style", serif;
  --body: "Inter", system-ui, -apple-system, sans-serif;
  --mono: "IBM Plex Mono", ui-monospace, monospace;

  --maxw: 1140px;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:var(--body);
  font-size:17px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
ul{margin:0;padding:0;}
/* ---- global horizontal overflow guard ---- */
html,body{overflow-x:hidden;}
img,svg,video{max-width:100%;}

.wrap{max-width:var(--maxw);margin:0 auto;padding:0 28px;}

h1,h2,h3,h4{
  font-family:var(--display);
  font-weight:600;
  font-variation-settings:"SOFT" 0,"WONK" 0;
  letter-spacing:-.01em;
  margin:0 0 .4em;
  color:var(--brown-deep);
}
h1{font-size:clamp(2.2rem,4.4vw,3.4rem);line-height:1.08;}
h2{font-size:clamp(1.6rem,3vw,2.2rem);line-height:1.15;}
h3{font-size:1.25rem;}
p{margin:0 0 1em;color:var(--ink-soft);}
strong{color:var(--ink);}

.eyebrow{
  font-family:var(--mono);
  font-size:.74rem;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--forest-deep);
  display:flex;align-items:center;gap:.6em;
  margin-bottom:1em;
}
.eyebrow::before{
  content:"";
  width:22px;height:1px;background:var(--gold);
  display:inline-block;
}

:focus-visible{outline:2px solid var(--forest);outline-offset:3px;border-radius:3px;}
@media (prefers-reduced-motion: reduce){
  *{animation:none !important;transition:none !important;}
  html{scroll-behavior:auto;}
}

/* ---------- Header ---------- */
.site-header{
  border-bottom:1px solid var(--line);
  background:var(--paper);
  position:-webkit-sticky;
  position:sticky;top:0;z-index:40;
}
.site-header .wrap{
  display:flex;align-items:center;justify-content:space-between;
  padding-top:16px;padding-bottom:16px;
  gap:24px;
}
.brand img{height:34px;width:auto;}
.brand{display:flex;align-items:center;gap:.6em;}

nav.primary-nav{display:flex;align-items:center;gap:2.1rem;}
nav.primary-nav a{
  font-size:.92rem;font-weight:500;color:var(--ink-soft);
  position:relative;padding:.2em 0;
}
nav.primary-nav a::after{
  content:"";position:absolute;left:0;right:0;bottom:-4px;height:2px;
  background:var(--gold);transform:scaleX(0);transform-origin:left;
  transition:transform .25s ease;
}
nav.primary-nav a:hover::after,
nav.primary-nav a[aria-current="page"]::after{transform:scaleX(1);}
nav.primary-nav a[aria-current="page"]{color:var(--brown-deep);}

.nav-toggle{
  display:none;background:none;border:1px solid var(--line);
  border-radius:8px;width:42px;height:38px;cursor:pointer;
  flex-direction:column;align-items:center;justify-content:center;gap:5px;
}
.nav-toggle span{width:20px;height:2px;background:var(--brown-deep);display:block;}

@media (max-width:860px){
  nav.primary-nav{
    display:none;
    position:fixed;inset:66px 0 0 0;background:var(--paper);
    flex-direction:column;align-items:flex-start;gap:0;
    padding:8px 28px 28px;border-top:1px solid var(--line);
    overflow-y:auto;z-index:39;
  }
  nav.primary-nav.open{display:flex;}
  nav.primary-nav a{width:100%;padding:.95em 0;border-bottom:1px solid var(--line);font-size:1.05rem;}
  .nav-toggle{display:flex;}
}

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex;align-items:center;gap:.5em;
  font-family:var(--body);font-weight:600;font-size:.95rem;
  padding:.85em 1.5em;border-radius:3px;border:1px solid transparent;
  cursor:pointer;transition:transform .18s ease, box-shadow .18s ease;
}
.btn-brown{background:var(--brown);color:var(--white);}
.btn-brown:hover{background:var(--brown-deep);}
.btn-forest{background:var(--forest);color:var(--white);}
.btn-forest:hover{background:var(--forest-deep);}
.btn-ghost{background:transparent;border-color:var(--brown);color:var(--brown-deep);}
.btn-ghost:hover{background:var(--brown);color:var(--white);}
.btn:hover{transform:translateY(-1px);}
.btn-row{display:flex;gap:14px;flex-wrap:wrap;margin-top:1.6em;}

/* ---------- Hero ---------- */
.hero{position:relative;overflow:hidden;border-bottom:1px solid var(--line);}
.hero .wrap{
  display:grid;grid-template-columns:1.15fr .85fr;gap:48px;
  padding-top:84px;padding-bottom:72px;align-items:center;
}
.hero-copy p.lead{font-size:1.12rem;max-width:36em;}
.hero-art{position:relative;display:flex;justify-content:center;}
.hero-art svg{width:100%;max-width:380px;opacity:.92;}
.hero-art .ring{
  position:absolute;inset:0;border:1px solid var(--line);
  border-radius:50%;transform:scale(1.18);
}
@media (max-width:860px){
  .hero .wrap{grid-template-columns:1fr;padding-top:36px;padding-bottom:36px;}
  .hero-art{order:-1;max-width:240px;margin:0 auto 8px;}
}
@media (max-width:480px){
  .hero .wrap{padding-top:28px;padding-bottom:28px;}
  .wrap{padding:0 18px;}
  h1{font-size:2rem;}
  .btn{font-size:.88rem;padding:.75em 1.2em;}
  .btn-row{gap:10px;}
  .pillar{padding:26px 20px;}
  .card{padding:22px 18px;}
  .office{padding:22px 18px;}
  .testi{padding:22px 18px;}
  .cta-banner{padding:28px 20px;}
  .pull{font-size:1.25rem;}
}

/* dachshund line-mark, reused as divider / watermark */
/* dual-business hero mark: growth chart (Beratung) + magazine pages (Anzeigenservice) */
.hero-mark-brown{stroke:var(--brown);stroke-width:2.6;fill:none;stroke-linecap:round;stroke-linejoin:round;}
.hero-mark-forest{stroke:var(--forest);stroke-width:2.4;fill:none;stroke-linecap:round;stroke-linejoin:round;}
.hero-mark-divider{stroke:var(--line);stroke-width:1;}
.divider{
  display:flex;align-items:center;gap:18px;margin:0 0 1.6em;
  color:var(--gold);
}
.divider::after{content:"";flex:1;height:1px;background:var(--line);}

/* ---------- Sections ---------- */
section{padding:76px 0;}
section.tight{padding:48px 0;}
.bg-paper-dim{background:var(--paper-dim);border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
.bg-ink{background:var(--ink);color:var(--paper);}
.bg-ink h2,.bg-ink h3{color:var(--paper);}
.bg-ink p{color:#CFC6B6;}

.section-head{max-width:42em;margin-bottom:2.6em;}

/* ---------- Pillars (two services) ---------- */
.pillars{display:grid;grid-template-columns:1fr 1fr;gap:28px;}
@media (max-width:760px){.pillars{grid-template-columns:1fr;}}
.pillar{
  background:var(--white);border:1px solid var(--line);
  border-radius:6px;padding:36px 32px;box-shadow:var(--shadow);
  display:flex;flex-direction:column;
}
.pillar .tag{
  font-family:var(--mono);font-size:.72rem;letter-spacing:.1em;
  text-transform:uppercase;padding:.3em .7em;border-radius:99px;
  display:inline-block;margin-bottom:1.1em;width:max-content;
}
.pillar.berat .tag{background:#EFE2D3;color:var(--brown-deep);}
.pillar.anzeige .tag{background:#DEE7DE;color:var(--forest-deep);}
.pillar ul{margin:1em 0 1.4em;display:flex;flex-direction:column;gap:.55em;}
.pillar li{display:flex;gap:.6em;align-items:flex-start;color:var(--ink-soft);font-size:.96rem;}
.pillar li::before{content:"—";color:var(--gold);flex:none;}
.pillar .btn{margin-top:auto;align-self:flex-start;}

/* ---------- Fact strip ---------- */
.facts{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line);}
.fact{background:var(--paper);padding:30px 24px;}
.fact .num{font-family:var(--display);font-size:2.1rem;color:var(--brown-deep);display:block;}
.fact .lbl{font-size:.85rem;color:var(--ink-soft);}
@media (max-width:760px){.facts{grid-template-columns:1fr 1fr;}}

/* ---------- Generic content grid ---------- */
.cols-2{display:grid;grid-template-columns:1fr 1fr;gap:40px;}
.cols-3{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;}
@media (max-width:860px){.cols-2,.cols-3{grid-template-columns:1fr;}}

.card{background:var(--white);border:1px solid var(--line);border-radius:6px;padding:28px;}

/* ---------- Tables (Mediadaten) ---------- */
.table-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:6px;background:var(--white);}
table{width:100%;border-collapse:collapse;font-size:.94rem;min-width:320px;}
thead th{
  text-align:left;font-family:var(--mono);font-size:.74rem;letter-spacing:.06em;
  text-transform:uppercase;color:var(--white);background:var(--brown-deep);
  padding:.85em 1.1em;
}
tbody td{padding:.8em 1.1em;border-bottom:1px solid var(--line);}
tbody tr:last-child td{border-bottom:none;}
tbody tr:nth-child(odd){background:var(--paper);}
td.num,th.num{font-family:var(--mono);text-align:right;white-space:nowrap;}
caption{text-align:left;font-size:.85rem;color:var(--ink-soft);padding:.8em 0;caption-side:bottom;}

/* ---------- Timeline / steps (used sparingly, real sequence only) ---------- */
.steps{display:flex;flex-direction:column;gap:0;}
.step{display:grid;grid-template-columns:64px 1fr;gap:18px;padding:22px 0;border-bottom:1px solid var(--line);}
.step:last-child{border-bottom:none;}
.step .yr{font-family:var(--mono);color:var(--gold);font-size:.95rem;}

/* ---------- Quote / pull ---------- */
.pull{
  font-family:var(--display);font-size:1.5rem;line-height:1.4;color:var(--brown-deep);
  border-left:3px solid var(--gold);padding-left:1.1em;margin:1.6em 0;
}

/* ---------- CTA banner ---------- */
.cta-banner{
  background:var(--forest);color:var(--white);border-radius:8px;
  padding:48px 44px;display:flex;justify-content:space-between;align-items:center;gap:28px;flex-wrap:wrap;
}
.cta-banner h2,.cta-banner h3{color:var(--white);}
.cta-banner p{color:#DCE6DC;}
@media (max-width:640px){
  .cta-banner{padding:32px 24px;flex-direction:column;align-items:flex-start;}
}

/* ---------- Contact cards ---------- */
.office{
  background:var(--white);border:1px solid var(--line);border-radius:6px;
  padding:30px 28px;
}
.office h3{display:flex;align-items:center;gap:.5em;}
.office .role{font-family:var(--mono);font-size:.78rem;color:var(--forest-deep);text-transform:uppercase;letter-spacing:.06em;margin-bottom:1em;}
.office dl{display:grid;grid-template-columns:auto 1fr;gap:.4em 1em;font-size:.94rem;margin:0;}
.office dt{color:var(--ink-soft);}
.office dd{margin:0;}
.office dd a{text-decoration:underline;text-decoration-color:var(--line);}
.office dd a:hover{text-decoration-color:var(--brown);}
@media (max-width:480px){
  .office dl{grid-template-columns:1fr;}
  .office dt{margin-top:.4em;}
}

/* ---------- Footer ---------- */
footer.site-footer{background:var(--ink);color:#CFC6B6;padding:56px 0 28px;margin-top:0;}
footer.site-footer a{color:#E7DFCB;}
footer.site-footer a:hover{color:var(--gold);}
.foot-grid{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:40px;margin-bottom:36px;}
.foot-grid h4{color:var(--paper);font-family:var(--body);font-weight:600;font-size:.85rem;letter-spacing:.06em;text-transform:uppercase;margin-bottom:1em;}
.foot-grid p{color:#A89E89;font-size:.92rem;}
.foot-grid ul{display:flex;flex-direction:column;gap:.6em;font-size:.92rem;}
.foot-bottom{
  border-top:1px solid #3A3327;padding-top:22px;
  display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;
  font-size:.82rem;color:#8B8270;
}
.foot-bottom a{color:#8B8270;}
.foot-logo{height:24px;filter:brightness(0) invert(1) opacity(.85);margin-bottom:14px;}
@media (max-width:760px){.foot-grid{grid-template-columns:1fr;gap:28px;}}

/* ---------- Legal pages ---------- */
.legal h2{margin-top:1.6em;}
.legal h2:first-child{margin-top:0;}
.legal section + section{margin-top:0;}
.legal{padding:60px 0 90px;}
.legal .wrap{max-width:780px;}
.legal address{font-style:normal;}
.fill{background:#FCEFCB;border:1px dashed var(--gold);padding:.05em .4em;border-radius:3px;font-family:var(--mono);font-size:.85em;}

/* ---------- Reader interest bars ---------- */
.readers{display:flex;flex-direction:column;gap:16px;}
.readers .row{display:grid;grid-template-columns:200px 1fr 64px;align-items:center;gap:16px;}
.readers .lbl{font-size:.94rem;color:var(--ink);}
.readers .bar{height:9px;background:var(--paper-dim);border:1px solid var(--line);border-radius:5px;overflow:hidden;}
.readers .bar span{display:block;height:100%;background:var(--forest);border-radius:5px 0 0 5px;}
.readers .pct{font-family:var(--mono);text-align:right;font-size:.92rem;color:var(--brown-deep);}
@media (max-width:640px){
  .readers .row{grid-template-columns:1fr;gap:6px;}
  .readers .pct{text-align:left;}
}

/* ---------- Small pill (inline tag in cards) ---------- */
.pill{
  font-family:var(--mono);font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;
  padding:.3em .7em;border-radius:99px;display:inline-block;margin-bottom:1em;
}
.pill-brown{background:#EFE2D3;color:var(--brown-deep);}
.pill-forest{background:#DEE7DE;color:var(--forest-deep);}

/* ---------- Reference logos ---------- */
.ref-grid{
  display:flex;flex-wrap:wrap;align-items:center;justify-content:center;
  gap:38px 58px;padding:18px 24px;background:var(--white);
  border:1px solid var(--line);border-radius:6px;
}
.ref-grid img{height:44px;width:auto;max-width:150px;object-fit:contain;opacity:.88;transition:opacity .2s ease;}
.ref-grid img:hover{opacity:1;}
.ref-grid img.ref-tall{height:60px;}
@media (max-width:640px){
  .ref-grid{gap:26px 34px;padding:20px;}
  .ref-grid img{height:34px;}
  .ref-grid img.ref-tall{height:46px;}
}

/* ---------- Hero photo (used instead of the dachshund mark on some pages) ---------- */
.hero-photo{
  position:relative;border-radius:8px;overflow:hidden;
  border:1px solid var(--line);box-shadow:var(--shadow);
  aspect-ratio:4/3;
}
.hero-photo img{width:100%;height:100%;object-fit:cover;display:block;}

/* ---------- Testimonials ---------- */
.testi-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
.testi{background:var(--white);border:1px solid var(--line);border-radius:6px;padding:30px 26px;display:flex;flex-direction:column;}
.testi blockquote{font-family:var(--display);font-size:1.04rem;line-height:1.5;color:var(--ink);margin:0 0 1.3em;font-weight:400;}
.testi blockquote::before{content:"“";color:var(--gold);font-size:1.7em;line-height:0;display:inline-block;vertical-align:-.32em;margin-right:.06em;}
.testi footer{margin-top:auto;font-size:.85rem;color:var(--ink-soft);border-top:1px solid var(--line);padding-top:.9em;}
.testi footer strong{color:var(--brown-deep);display:block;font-size:.95rem;}
@media (max-width:860px){.testi-grid{grid-template-columns:1fr;}}

/* ---------- Misc ---------- */
.muted{color:var(--ink-soft);font-size:.92rem;}
.center{text-align:center;}
.mt0{margin-top:0;}
.list-check{display:flex;flex-direction:column;gap:.7em;}
.list-check li{display:flex;gap:.7em;align-items:flex-start;}
.list-check li::before{content:"✓";color:var(--forest);font-weight:700;flex:none;}
