/* =====================================================================
   TIC SEO Artikel – Design-System (1:1 an tic-academy.com/neue-website-v2)
   Flach & clean: dünne Borders, keine schweren Schatten, Fraunces + Barlow.
   Wichtige Eigenschaften mit !important, damit das Theme nicht überschreibt.
   ===================================================================== */
.tic-seo,
.tic-seo *{ box-sizing:border-box; }

.tic-seo{
  --green:#E4EAE1;
  --green-soft:#F3F5F0;
  --green-deep:#C9D5C2;
  --orange:#FFAA38;
  --orange-dk:#F0951A;
  --brown-deep:#2A2421;
  --brown-dk:#3F3633;
  --ink:#524846;
  --ink-soft:#6B605D;
  --ink-light:#F3F5F0;
  --line:rgba(82,72,70,.13);
  --line-d:rgba(243,245,240,.14);
  --radius:16px;

  font-family:'Barlow','Helvetica Neue',Arial,sans-serif !important;
  color:var(--ink);
  font-size:18px;
  line-height:1.8;
  background:#fff;
  -webkit-font-smoothing:antialiased;
  overflow:hidden;
}
.tic-seo a{ color:inherit; text-decoration:none; }
.tic-seo p{ font-family:'Barlow','Helvetica Neue',Arial,sans-serif !important; }

/* Layout */
.tic-seo .ts-wrap{ width:min(1180px,calc(100% - 48px)); margin:0 auto; }
.tic-seo .ts-narrow{ width:min(940px,calc(100% - 48px)); margin:0 auto; }
.tic-seo .ts-center{ text-align:center; }

/* Abschnitte + Hintergründe */
.tic-seo .ts-sec{ padding:100px 0; }
.tic-seo .sec--green{ background:var(--green); }
.tic-seo .sec--greensoft{ background:var(--green-soft); }
.tic-seo .sec--artbg{ background:#FAF7F3; }
.tic-seo .sec--dark{ background:var(--brown-deep); color:var(--ink-light); }

/* Headlines – Fraunces (gegen Theme erzwungen) */
.tic-seo h1,
.tic-seo h2,
.tic-seo h3,
.tic-seo .ts-h1,
.tic-seo .ts-h2,
.tic-seo .ts-h3{
  font-family:'Fraunces','Georgia',serif !important;
  margin:0;
  color:var(--brown-dk) !important;
  line-height:1.08 !important;
  font-weight:600 !important;
  letter-spacing:-.01em;
  text-transform:none !important;
}
.tic-seo .sec--dark h1,
.tic-seo .sec--dark h2,
.tic-seo .sec--dark h3,
.tic-seo .sec--dark .ts-h2{ color:var(--ink-light) !important; }

.tic-seo .ts-h1{ font-size:clamp(40px,5.2vw,68px) !important; max-width:19ch; }
.tic-seo .ts-h2{ font-size:clamp(30px,3.6vw,52px) !important; }
.tic-seo .ts-h3{ font-size:clamp(21px,2vw,28px) !important; }

/* Eyebrow – dunkler Text + orange pip */
.tic-seo .ts-eyebrow{
  display:inline-flex !important; align-items:center; gap:10px;
  margin-bottom:20px;
  color:var(--brown-dk) !important;
  font-family:'Barlow',sans-serif !important;
  font-size:12px !important; font-weight:700 !important;
  text-transform:uppercase !important; letter-spacing:.2em !important;
}
.tic-seo .sec--dark .ts-eyebrow{ color:var(--ink-light) !important; }
.tic-seo .ts-eyebrow .pip{
  width:8px; height:8px; border-radius:999px; background:var(--orange); display:inline-block; flex:0 0 auto;
}

/* Fließtext */
.tic-seo .ts-copy{ margin:0 0 20px; color:var(--ink); }
.tic-seo .sec--dark .ts-copy{ color:var(--ink-light); }
.tic-seo .ts-lead{
  font-size:clamp(19px,1.7vw,23px); line-height:1.72;
  color:var(--ink); margin:26px 0 0; max-width:62ch;
}
.tic-seo .ts-copy strong,
.tic-seo .ts-lead strong{ font-weight:700; color:var(--brown-dk); }
.tic-seo .sec--dark .ts-copy strong{ color:#fff; }

/* Buttons – v2: 11px Radius, gerichteter Schatten, dunkler Text (gegen Theme) */
.tic-seo .ts-btn{
  display:inline-flex !important; align-items:center; justify-content:center; gap:10px;
  padding:16px 28px !important; border-radius:11px !important;
  background:var(--orange) !important; color:var(--brown-deep) !important;
  font-family:'Barlow',sans-serif !important; font-size:16px !important; font-weight:700 !important;
  text-transform:none !important; text-decoration:none !important;
  box-shadow:0 12px 28px -10px rgba(255,170,56,.9) !important;
  transition:transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.tic-seo .ts-btn:hover{ background:var(--orange-dk) !important; transform:translateY(-2px); box-shadow:0 16px 30px -10px rgba(255,170,56,.95) !important; }
.tic-seo .ts-btn svg{ width:18px; height:18px; }

/* HERO */
.tic-seo .ts-hero{ padding:110px 0 104px; background:linear-gradient(180deg,#F3F5F0 0%,#F3F5F0 52%,#FAF7F3 100%); }
.tic-seo .ts-hero-box{ max-width:960px; }
.tic-seo .ts-hero-actions{ display:flex; align-items:center; gap:18px; flex-wrap:wrap; margin-top:36px; }
.tic-seo .ts-hero-note{ color:var(--ink-soft); font-size:14px; font-weight:600; }
.tic-seo .ts-pills{ display:flex; flex-wrap:wrap; gap:10px; margin-top:44px; }
.tic-seo .ts-pill{
  display:inline-flex !important; align-items:center; gap:8px; min-height:42px; padding:8px 18px;
  border-radius:999px !important; background:#fff !important; border:1px solid var(--line);
  color:var(--brown-dk) !important; font-size:14px; font-weight:600;
}
.tic-seo .ts-pill:before{ content:''; width:6px; height:6px; border-radius:999px; background:var(--orange); }

/* ARTIKEL */
.tic-seo .ts-article{ max-width:780px; }
.tic-seo .ts-article h2{ margin:54px 0 0; }
.tic-seo .ts-article h2:first-child{ margin-top:0; }
.tic-seo .ts-accent{ width:52px; height:3px; border-radius:999px; background:var(--orange); margin:18px 0 26px; }
.tic-seo .ts-article p{ margin:0 0 20px; }

/* INFOBOX – flache Karte */
.tic-seo .ts-table{
  max-width:1000px; margin:48px auto 0; background:#fff;
  border-radius:var(--radius) !important; overflow:hidden; border:1px solid var(--line);
  box-shadow:none !important;
}
.tic-seo .ts-row{ display:grid; grid-template-columns:300px 1fr; }
.tic-seo .ts-row:not(:last-child){ border-bottom:1px solid var(--line); }
.tic-seo .ts-cell{ padding:22px 30px; }
.tic-seo .ts-cell--k{ background:var(--green-soft); color:var(--brown-dk); font-weight:600; }
.tic-seo .ts-cell--v{ color:var(--ink); }

/* FAQ */
.tic-seo .ts-faq-list{ max-width:940px; margin:48px auto 0; border-top:1px solid var(--green-deep); }
.tic-seo .ts-faq-item{ border-bottom:1px solid var(--green-deep); }
.tic-seo .ts-faq-q{
  width:100%; padding:26px 64px 26px 6px; border:0; background:transparent;
  color:var(--brown-dk) !important; cursor:pointer; position:relative; text-align:left;
  font-family:'Fraunces',serif !important; font-size:clamp(18px,1.5vw,22px) !important; font-weight:600 !important; line-height:1.4;
}
.tic-seo .ts-faq-q:after{
  content:'+'; position:absolute; right:14px; top:50%; transform:translateY(-50%);
  color:var(--orange-dk); font-size:30px; font-weight:300; line-height:1;
}
.tic-seo .ts-faq-item.open .ts-faq-q:after{ content:'\2013'; }
.tic-seo .ts-faq-a{ display:none; padding:0 64px 28px 6px; color:var(--ink); line-height:1.8; }
.tic-seo .ts-faq-item.open .ts-faq-a{ display:block; }

/* FINAL CTA */
.tic-seo .ts-cta{ text-align:center; }
.tic-seo .ts-cta-text{
  font-family:'Fraunces',serif !important; font-weight:600 !important; color:var(--ink-light) !important;
  font-size:clamp(24px,2.6vw,38px) !important; line-height:1.22; max-width:20ch; margin:18px auto 0;
}
.tic-seo .ts-cta p{ max-width:60ch; margin:22px auto 34px; color:var(--ink-light); font-size:clamp(18px,1.6vw,21px); }

/* Reveal-Animation */
.tic-seo .rv{ opacity:0; transform:translateY(18px); transition:opacity .6s ease, transform .6s ease; }
.tic-seo .rv.in{ opacity:1; transform:none; }
.tic-seo .rv.d1{ transition-delay:.06s; }
.tic-seo .rv.d2{ transition-delay:.12s; }
.tic-seo .rv.d3{ transition-delay:.18s; }
@media (prefers-reduced-motion:reduce){ .tic-seo .rv{ opacity:1; transform:none; transition:none; } }

/* Responsive */
@media (max-width:920px){
  .tic-seo .ts-sec{ padding:76px 0; }
  .tic-seo .ts-hero{ padding:80px 0 84px; }
}
@media (max-width:620px){
  .tic-seo .ts-wrap, .tic-seo .ts-narrow{ width:min(100% - 32px,1180px); }
  .tic-seo .ts-row{ grid-template-columns:1fr; }
  .tic-seo .ts-cell--k{ padding-bottom:6px; }
  .tic-seo .ts-cell--v{ padding-top:6px; }
  .tic-seo .ts-btn{ width:100%; }
}