/*
Theme Name: Kleine Wirkung
Theme URI: https://example.org/kleine-wirkung
Author: designrichter / OpenAI prototype
Description: Handgemachtes, warmes Block-Theme für kleine Wirkung gGmbH. Entwickelt auf Basis des bereitgestellten Corporate Designs.
Version: 1.0.4
Requires at least: 6.6
Tested up to: 7.0
Requires PHP: 7.4
Text Domain: kleine-wirkung
*/

:root {
  --kw-coral: #E74D45;
  --kw-teal: #6BA7A2;
  --kw-blush: #E7B4B8;
  --kw-mustard: #F1B134;
  --kw-mint: #A9D6D0;
  --kw-navy: #1F2B4D;
  --kw-cream: #FFF9F1;
  --kw-ink: #1B1B1B;
  --kw-line: rgba(31,43,77,.14);
  --kw-radius: 18px;
}

html { scroll-behavior: smooth; }
[id] { scroll-margin-top: 120px; }
body { background: var(--kw-cream); }

/* Slightly imperfect, handmade feel without hurting readability */
.kw-display, .wp-block-site-title, h1, h2, h3 {
  letter-spacing: -0.025em;
}

.kw-paper {
  background: rgba(255,255,255,.58);
  border: 1px solid var(--kw-line);
  box-shadow: 0 16px 45px rgba(31,43,77,.06);
}

.kw-kicker {
  text-transform: uppercase;
  letter-spacing: .14em;
  font-size: .78rem;
  font-weight: 700;
}

.kw-hero-title strong,
.kw-accent { color: var(--kw-coral); }

.kw-brush {
  height: 9px;
  width: 132px;
  border-radius: 999px 70% 999px 55%;
  background: var(--kw-coral);
  transform: rotate(-1.2deg);
}

.kw-scribble {
  border: 3px solid var(--kw-teal);
  border-radius: 48% 52% 43% 57%;
  transform: rotate(-4deg);
}

.kw-card {
  height: 100%;
  border-radius: var(--kw-radius);
  overflow: hidden;
  transition: transform .22s ease, box-shadow .22s ease;
}
.kw-card:hover { transform: translateY(-4px) rotate(-.25deg); box-shadow: 0 18px 46px rgba(31,43,77,.11); }
.kw-card img { aspect-ratio: 4 / 3; object-fit: cover; width: 100%; }

.kw-tag {
  display: inline-block;
  border: 1.5px solid currentColor;
  border-radius: 999px;
  padding: .28rem .7rem;
  font-size: .78rem;
}

.kw-dominoes { display:flex; align-items:flex-end; gap:10px; }
.kw-domino { width:24px; height:62px; border-radius:5px; background:currentColor; opacity:.95; }
.kw-domino:first-child { transform: rotate(39deg) translateY(6px); color:var(--kw-coral); transform-origin: bottom right; }
.kw-domino:nth-child(2){color:var(--kw-teal)}
.kw-domino:nth-child(3){color:var(--kw-blush)}
.kw-domino:nth-child(4){color:var(--kw-mustard)}
.kw-domino:nth-child(5){color:var(--kw-mint)}
.kw-impact { color:var(--kw-coral); font-size:1.4rem; margin-bottom:50px; margin-left:-12px; letter-spacing:.05em; }

/* Buttons echo the rounded rectangular shape of the domino stones */
.wp-block-button .wp-block-button__link {
  border-radius: 7px;
  padding: .82rem 1.45rem;
  line-height: 1.15;
  transition: transform .18s ease, box-shadow .18s ease;
}
.wp-block-button .wp-block-button__link:hover {
  transform: translateY(-2px) rotate(-.35deg);
  box-shadow: 0 8px 18px rgba(31,43,77,.12);
}
.wp-block-button.is-style-outline .wp-block-button__link {
  border-width: 2px;
}

.wp-block-navigation a { text-decoration-thickness: 2px; text-underline-offset: 5px; }
.wp-block-navigation a:hover { text-decoration-line: underline; text-decoration-color: var(--kw-coral); }

.kw-section-label { position:relative; display:inline-block; }
.kw-section-label:after { content:""; position:absolute; left:-3%; right:8%; bottom:.04em; height:.24em; background:var(--kw-blush); z-index:-1; transform:rotate(-1deg); opacity:.8; }

.kw-quote { border-left: 8px solid var(--kw-coral); padding-left: 1.5rem; }
.kw-logo-word { font-family: "American Typewriter", "Courier Prime", "Courier New", serif; color:var(--kw-navy); font-weight:700; }

@media (max-width: 780px) {
  .kw-domino { width:18px; height:48px; }
  .kw-impact { margin-bottom:38px; font-size:1.1rem; }
}

/* Contact section / Contact Form 7 */
.kw-contact-section {
  position: relative;
  overflow: hidden;
}
.kw-contact-card {
  height: 100%;
  border-radius: 8px !important;
}
.kw-contact-mail { margin-top: -.35rem; }
.kw-contact-domino {
  display: flex;
  align-items: flex-end;
  gap: 9px;
  margin-top: 2.1rem;
  min-height: 58px;
}
.kw-contact-domino span {
  display: block;
  width: 22px;
  height: 56px;
  border-radius: 6px;
  background: var(--kw-navy);
}
.kw-contact-domino span:first-child {
  background: var(--kw-coral);
  transform: rotate(34deg) translateY(4px);
  transform-origin: bottom right;
}
.kw-contact-domino span:nth-child(2) { background: var(--kw-teal); }
.kw-contact-domino span:nth-child(3) { background: var(--kw-mustard); }
.kw-contact-domino span:nth-child(4) { background: var(--kw-mint); }

.kw-contact-card .wpcf7 { margin-top: 1.25rem; }
.kw-contact-card .wpcf7-form p { margin: 0 0 15px; }
.kw-contact-card .wpcf7-form label {
  display: block;
  color: var(--kw-navy);
  font-size: .88rem;
  font-weight: 600;
}
.kw-contact-card .wpcf7 input:not([type="submit"]):not([type="checkbox"]),
.kw-contact-card .wpcf7 textarea,
.kw-contact-card .wpcf7 select {
  width: 100%;
  box-sizing: border-box;
  margin-top: 6px;
  padding: .88rem .95rem;
  border: 1.5px solid rgba(31,43,77,.20);
  border-radius: 7px;
  background: rgba(255,255,255,.72);
  color: var(--kw-ink);
  font: inherit;
  outline: none;
  transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}
.kw-contact-card .wpcf7 textarea { min-height: 118px; resize: vertical; }
.kw-contact-card .wpcf7 input:focus,
.kw-contact-card .wpcf7 textarea:focus,
.kw-contact-card .wpcf7 select:focus {
  border-color: var(--kw-coral);
  box-shadow: 0 0 0 3px rgba(231,77,69,.12);
}
.kw-contact-card .wpcf7 input[type="submit"] {
  width: 100%;
  border: 0;
  border-radius: 7px;
  padding: .9rem 1.2rem;
  background: var(--kw-coral);
  color: #fff;
  font: inherit;
  font-weight: 700;
  cursor: pointer;
  transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.kw-contact-card .wpcf7 input[type="submit"]:hover {
  transform: translateY(-2px) rotate(-.35deg);
  box-shadow: 0 8px 18px rgba(31,43,77,.14);
}
.kw-contact-card .wpcf7 input[type="checkbox"] { accent-color: var(--kw-coral); }
.kw-contact-card .wpcf7-list-item { margin-left: 0; }
.kw-contact-card .wpcf7-acceptance label {
  display: flex;
  align-items: flex-start;
  gap: .55rem;
  font-size: .78rem;
  font-weight: 400;
  line-height: 1.4;
}
.kw-contact-card .wpcf7-not-valid-tip {
  color: var(--kw-coral);
  font-size: .78rem;
  margin-top: 4px;
}
.kw-contact-card .wpcf7 form .wpcf7-response-output {
  margin: 1rem 0 0;
  border: 0;
  border-left: 5px solid var(--kw-coral);
  background: rgba(231,77,69,.08);
  padding: .7rem .85rem;
}

@media (max-width: 980px) {
  .kw-contact-section > .wp-block-columns { flex-direction: column; }
  .kw-contact-section > .wp-block-columns > .wp-block-column { flex-basis: 100% !important; }
}
@media (max-width: 720px) {
  .kw-contact-cards { flex-direction: column; }
  .kw-contact-card { margin-bottom: 12px; }
}


/* Portfolio / Projekte */
.kw-project-card .wp-block-post-featured-image { margin: 0; }
.kw-project-card .wp-block-post-featured-image img { border-radius: 0; }
.kw-project-card .wp-block-post-title { margin-top: .15rem; }
.kw-project-card .wp-block-post-title a { text-decoration: none; }
.kw-project-card .wp-block-post-title a:hover { color: var(--kw-coral); }
.kw-project-card .wp-block-post-excerpt__more-link { font-weight: 700; text-decoration: none; }
.kw-project-terms a {
  display: inline-block;
  padding: .25rem .58rem;
  margin: 0 .28rem .28rem 0;
  border: 1.5px solid currentColor;
  border-radius: 6px;
  text-decoration: none;
  line-height: 1.25;
}
.kw-portfolio-query .wp-block-post-template { align-items: stretch; }
@media (max-width: 900px) {
  .kw-portfolio-query .wp-block-post-template { grid-template-columns: repeat(2, minmax(0,1fr)) !important; }
}
@media (max-width: 620px) {
  .kw-portfolio-query .wp-block-post-template { grid-template-columns: 1fr !important; }
}


/* v1.0.4 – editable one-page layout */
.wp-site-blocks > .wp-block-post-content {
  margin-block-start: 0;
}
.wp-block-post-content > .alignfull {
  width: 100vw;
  max-width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
}
.kw-section-inner {
  width: min(1500px, calc(100% - 40px));
  margin-inline: auto;
}
@media (max-width: 780px) {
  [id] { scroll-margin-top: 90px; }
}

/* Robust dynamic portfolio shortcode */
.kw-projects-shortcode {
  padding: 90px 20px;
}
.kw-projects-shortcode__inner {
  width: min(1500px, 100%);
  margin-inline: auto;
}
.kw-projects-shortcode__head {
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  gap:24px;
  margin-bottom:34px;
}
.kw-projects-shortcode__head h2 { margin-bottom:0; }
.kw-projects-shortcode__grid {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:24px;
}
.kw-project-card__image { display:block; }
.kw-project-card__image img { display:block; width:100%; aspect-ratio:4/3; object-fit:cover; }
.kw-project-card__body { padding:20px 20px 24px; }
.kw-project-card__body h3 { margin:.45rem 0 .65rem; }
.kw-project-card__body h3 a, .kw-project-more { text-decoration:none; }
.kw-project-card__body h3 a:hover, .kw-project-more:hover { color:var(--kw-coral); }
.kw-projects-shortcode .kw-project-terms span {
  display:inline-block;
  padding:.25rem .58rem;
  margin:0 .28rem .28rem 0;
  border:1.5px solid currentColor;
  border-radius:6px;
  font-size:.78rem;
}
.kw-projects-empty { padding:32px; border-radius:8px; }
@media (max-width:900px){ .kw-projects-shortcode__grid{grid-template-columns:repeat(2,minmax(0,1fr));} }
@media (max-width:620px){
  .kw-projects-shortcode__grid{grid-template-columns:1fr;}
  .kw-projects-shortcode__head{display:block;}
}
