/*
Theme Name: Work in Wonderland
Theme URI: https://workinwonderland.berlin
Author: Work in Wonderland Berlin
Author URI: https://workinwonderland.berlin
Description: Liebevolle Kinderbetreuung und Nachhilfe in Berlin-Reinickendorf. Flexibel buchbar auch nach 17 Uhr und am Wochenende.
Version: 1.1.0
Requires at least: 6.0
Tested up to: 6.7
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: work-in-wonderland
Tags: childcare, berlin, kids, tutoring, responsive
*/

@import url('https://fonts.googleapis.com/css2?family=Nunito:wght@400;500;600;700;800;900&display=swap');

/* ===== RESET ===== */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

:root {
  --blue-deep:  #1565C0;
  --blue-mid:   #0288D1;
  --blue-light: #29B6F6;
  --blue-pale:  #E3F2FD;
  --yellow:     #FFD600;
  --yellow-warm:#F9A825;
  --green:      #4CAF50;
  --white:      #ffffff;
  --bg:         #F8FBFF;
  --text:       #374151;
  --text-light: #6B7280;
  --radius:     1rem;
  --radius-lg:  1.5rem;
  --radius-full:9999px;
  --shadow:     0 4px 24px rgba(41,182,246,.12);
  --shadow-lg:  0 8px 40px rgba(21,101,192,.15);
}

html { scroll-behavior: smooth; }
body {
  font-family: 'Nunito', sans-serif;
  font-size: 16px;
  line-height: 1.6;
  color: var(--text);
  background: var(--white);
}
img { max-width: 100%; height: auto; display: block; }
a { text-decoration: none; color: inherit; }
ul { list-style: none; }

h1,h2,h3,h4,h5,h6 { font-family:'Nunito',sans-serif; font-weight:900; color:var(--blue-deep); line-height:1.2; }
h1 { font-size: clamp(1.8rem,4vw,3rem); }
h2 { font-size: clamp(1.4rem,3vw,2.2rem); }
h3 { font-size: 1.15rem; }
p  { font-weight: 500; }

/* ===== CONTAINER ===== */
.wiw-container {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 1.25rem;
}
@media(min-width:768px){ .wiw-container{ padding:0 2rem; } }

/* ===== BUTTONS ===== */
.wiw-btn {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  padding: .875rem 1.75rem;
  border-radius: var(--radius-full);
  font-family: 'Nunito',sans-serif;
  font-weight: 800;
  font-size: .95rem;
  border: none;
  cursor: pointer;
  transition: all .2s;
  text-decoration: none;
  line-height: 1;
}
.wiw-btn:hover { transform:scale(1.04); opacity:.9; }
.wiw-btn-primary { background:linear-gradient(135deg,var(--blue-light),var(--blue-mid)); color:#fff; box-shadow:var(--shadow); }
.wiw-btn-outline  { background:transparent; color:var(--blue-deep); border:2px solid var(--blue-light); }
.wiw-btn-outline:hover { background:var(--blue-pale); }
.wiw-btn-yellow   { background:linear-gradient(135deg,var(--yellow),var(--yellow-warm)); color:var(--blue-deep); }
.wiw-btn-white    { background:#fff; color:var(--blue-deep); box-shadow:var(--shadow); }
.wiw-btn-wa       { background:#25D366; color:#fff; }

/* ===== SECTION ===== */
.wiw-section    { padding:4rem 0; }
.wiw-section-lg { padding:6rem 0; }
.wiw-bg-pale    { background:linear-gradient(135deg,#E3F2FD,#F8FBFF); }
.wiw-bg-yellow  { background:linear-gradient(135deg,#FFFDE7,#F8FBFF); }
.wiw-bg-dark    { background:linear-gradient(135deg,#0D47A1,#1565C0); }
.wiw-bg-white   { background:#fff; }

/* ===== GRID ===== */
.wiw-grid-2 { display:grid; grid-template-columns:1fr; gap:2rem; }
.wiw-grid-3 { display:grid; grid-template-columns:1fr; gap:1.5rem; }
.wiw-grid-4 { display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
@media(min-width:768px){
  .wiw-grid-2 { grid-template-columns:1fr 1fr; }
  .wiw-grid-3 { grid-template-columns:repeat(3,1fr); }
  .wiw-grid-4 { grid-template-columns:repeat(4,1fr); }
}
.wiw-two-col { display:grid; grid-template-columns:1fr; gap:3rem; align-items:center; }
@media(min-width:1024px){ .wiw-two-col { grid-template-columns:1fr 1fr; } }

/* ===== CARD ===== */
.wiw-card {
  background:#fff;
  border-radius:var(--radius-lg);
  padding:1.5rem;
  box-shadow:var(--shadow);
  transition:transform .2s,box-shadow .2s;
}
.wiw-card:hover { transform:translateY(-4px); box-shadow:var(--shadow-lg); }

/* ===== BADGE ===== */
.wiw-badge {
  display:inline-flex; align-items:center; gap:.4rem;
  padding:.35rem 1rem; border-radius:var(--radius-full);
  font-size:.82rem; font-weight:700;
}
.wiw-badge-blue   { background:rgba(41,182,246,.15); color:var(--blue-mid); border:2px solid rgba(41,182,246,.25); }
.wiw-badge-yellow { background:rgba(255,214,0,.15); color:var(--yellow-warm); border:2px solid rgba(255,214,0,.3); }

/* ===== HEADER ===== */
#wiw-header {
  position:sticky; top:0; z-index:1000;
  background:rgba(255,255,255,.96);
  backdrop-filter:blur(12px);
  border-bottom:1px solid rgba(41,182,246,.1);
  transition:box-shadow .3s;
}
#wiw-header.scrolled { box-shadow:0 4px 24px rgba(21,101,192,.1); }

.wiw-header-inner {
  display:flex; align-items:center; justify-content:space-between;
  padding:.75rem 0; gap:1rem;
}
.wiw-logo {
  display:flex; align-items:center; gap:.75rem;
  text-decoration:none; flex-shrink:0;
}
.wiw-logo img { width:52px; height:52px; object-fit:contain; }
.wiw-logo-text { font-weight:900; font-size:1.05rem; color:var(--blue-deep); line-height:1.2; }
.wiw-logo-text span { color:var(--blue-light); }

.wiw-nav { display:none; }
@media(min-width:1024px){
  .wiw-nav { display:flex; align-items:center; gap:.25rem; }
}
.wiw-nav a {
  padding:.5rem .875rem; border-radius:var(--radius-full);
  font-weight:700; font-size:.875rem; color:var(--text);
  transition:all .2s;
}
.wiw-nav a:hover, .wiw-nav a.active { background:var(--blue-pale); color:var(--blue-deep); }

.wiw-header-actions { display:flex; align-items:center; gap:.75rem; }
.wiw-header-phone {
  display:none; align-items:center; gap:.4rem;
  padding:.5rem 1.25rem; border-radius:var(--radius-full);
  border:2px solid var(--blue-light); color:var(--blue-deep);
  font-weight:800; font-size:.875rem; transition:all .2s;
}
@media(min-width:768px){ .wiw-header-phone { display:flex; } }
.wiw-header-phone:hover { background:var(--blue-pale); }

.wiw-insta-btn {
  width:40px; height:40px; border-radius:var(--radius-full);
  background:var(--blue-pale); display:flex; align-items:center; justify-content:center;
  color:var(--blue-deep); transition:all .2s;
}
.wiw-insta-btn:hover { background:#FCE4EC; color:#E91E63; }

.wiw-menu-toggle {
  display:flex; align-items:center; justify-content:center;
  width:40px; height:40px; border-radius:var(--radius);
  border:none; background:var(--blue-pale); cursor:pointer; color:var(--blue-deep);
}
@media(min-width:1024px){ .wiw-menu-toggle { display:none; } }

.wiw-mobile-nav { display:none; flex-direction:column; gap:.25rem; padding:1rem 0; border-top:1px solid var(--blue-pale); }
.wiw-mobile-nav.open { display:flex; }
.wiw-mobile-nav a { padding:.75rem 1rem; border-radius:var(--radius); font-weight:700; color:var(--text); transition:all .2s; }
.wiw-mobile-nav a:hover { background:var(--blue-pale); color:var(--blue-deep); }

/* ===== FOOTER ===== */
#wiw-footer { background:linear-gradient(135deg,#0D47A1,#1565C0); color:#fff; padding:3rem 0 1.5rem; }
.wiw-footer-grid { display:grid; grid-template-columns:1fr; gap:2rem; margin-bottom:2rem; }
@media(min-width:768px){ .wiw-footer-grid { grid-template-columns:2fr 1fr 1fr; } }
.wiw-footer-brand p { color:rgba(255,255,255,.75); font-size:.875rem; line-height:1.6; margin-top:.75rem; }
.wiw-footer-heading { font-size:.75rem; font-weight:800; color:rgba(255,255,255,.5); text-transform:uppercase; letter-spacing:.1em; margin-bottom:1rem; }
.wiw-footer-links { display:flex; flex-direction:column; gap:.5rem; }
.wiw-footer-links a { color:rgba(255,255,255,.75); font-size:.875rem; font-weight:500; transition:color .2s; }
.wiw-footer-links a:hover { color:#fff; }
.wiw-footer-contact { display:flex; flex-direction:column; gap:.75rem; }
.wiw-footer-contact-item { display:flex; align-items:flex-start; gap:.75rem; }
.wiw-footer-contact-item a, .wiw-footer-contact-item span { color:rgba(255,255,255,.85); font-size:.85rem; font-weight:500; }
.wiw-footer-contact-item a:hover { color:#fff; }
.wiw-footer-bottom {
  border-top:1px solid rgba(255,255,255,.1); padding-top:1.5rem;
  display:flex; flex-direction:column; gap:.5rem; align-items:center; text-align:center;
}
@media(min-width:768px){ .wiw-footer-bottom { flex-direction:row; justify-content:space-between; text-align:left; } }
.wiw-footer-bottom p, .wiw-footer-bottom a { color:rgba(255,255,255,.5); font-size:.8rem; }
.wiw-footer-bottom a:hover { color:#fff; }
.wiw-footer-socials { display:flex; gap:.75rem; margin-top:1.25rem; }
.wiw-footer-socials a {
  width:38px; height:38px; border-radius:50%;
  background:rgba(255,255,255,.1); display:flex; align-items:center; justify-content:center;
  color:#fff; transition:background .2s;
}
.wiw-footer-socials a:hover { background:rgba(255,255,255,.25); }

/* ===== WHATSAPP FLOAT ===== */
.wiw-wa-float {
  position:fixed; bottom:2rem; right:2rem; z-index:999;
  display:flex; align-items:center; gap:.75rem;
  padding:.875rem 1.5rem;
  background:#25D366; color:#fff; border-radius:var(--radius-full);
  font-weight:800; font-size:.875rem;
  box-shadow:0 4px 24px rgba(37,211,102,.4);
  transition:all .2s;
  animation:wiw-pulse 2.5s infinite;
}
.wiw-wa-float:hover { transform:scale(1.05); color:#fff; }
@keyframes wiw-pulse {
  0%,100% { box-shadow:0 4px 24px rgba(37,211,102,.4); }
  50%      { box-shadow:0 4px 36px rgba(37,211,102,.65); }
}

/* ===== PAGE HERO ===== */
.wiw-page-hero { background:linear-gradient(135deg,#E3F2FD,#F8FBFF); padding:5rem 0 3rem; text-align:center; }
.wiw-page-hero h1 { margin-bottom:1rem; }
.wiw-page-hero p { color:var(--text-light); font-size:1.05rem; max-width:40rem; margin:0 auto; }

/* ===== INFO CARD ===== */
.wiw-info-card {
  display:flex; align-items:flex-start; gap:1rem;
  padding:1.25rem; border-radius:var(--radius-lg); margin-bottom:1rem;
}
.wiw-info-icon {
  width:2.75rem; height:2.75rem; border-radius:var(--radius-full);
  display:flex; align-items:center; justify-content:center; flex-shrink:0;
}
.wiw-info-label { font-size:.75rem; font-weight:700; color:var(--blue-deep); margin-bottom:.25rem; }
.wiw-info-value { font-size:.9rem; font-weight:600; color:var(--text); }
.wiw-info-value a { color:var(--blue-light); }

/* ===== CONTACT FORM ===== */
.wiw-form { display:flex; flex-direction:column; gap:1.25rem; }
.wiw-form-group label { display:block; font-size:.875rem; font-weight:700; color:var(--blue-deep); margin-bottom:.5rem; }
.wiw-form-group .req { color:#ef4444; }
.wiw-input {
  width:100%; padding:.75rem 1rem; border-radius:.75rem;
  border:2px solid var(--blue-pale); background:#F8FBFF;
  font-family:'Nunito',sans-serif; font-size:.9rem; font-weight:500; color:var(--text);
  outline:none; transition:border-color .2s;
}
.wiw-input:focus { border-color:var(--blue-light); }
textarea.wiw-input { resize:none; }

.wiw-captcha-box { background:var(--blue-pale); border:2px solid rgba(41,182,246,.2); border-radius:var(--radius); padding:1rem; }
.wiw-captcha-box label { font-size:.875rem; font-weight:700; color:var(--blue-deep); margin-bottom:.75rem; display:block; }
.wiw-captcha-q {
  display:inline-flex; align-items:center;
  padding:.75rem 1.5rem; background:#fff; border:2px solid var(--blue-light);
  border-radius:.75rem; font-family:monospace; font-size:1.1rem; font-weight:900;
  color:var(--blue-deep); letter-spacing:.1em; margin-bottom:.75rem;
}
.wiw-captcha-row { display:flex; align-items:center; gap:.75rem; margin-bottom:.75rem; }
.wiw-captcha-refresh { padding:.5rem; border-radius:.5rem; border:none; background:transparent; color:var(--blue-mid); cursor:pointer; transition:background .2s; }
.wiw-captcha-refresh:hover { background:rgba(41,182,246,.1); }
.wiw-captcha-hint { font-size:.8rem; color:var(--text-light); font-weight:500; }

.wiw-privacy { display:flex; align-items:flex-start; gap:.75rem; }
.wiw-privacy input { margin-top:3px; width:1rem; height:1rem; accent-color:var(--blue-light); cursor:pointer; }
.wiw-privacy label { font-size:.875rem; color:var(--text-light); font-weight:500; line-height:1.5; cursor:pointer; }
.wiw-privacy a { color:var(--blue-light); font-weight:700; }

.wiw-form-error { display:none; background:#FEE2E2; color:#DC2626; padding:.875rem 1rem; border-radius:.75rem; font-weight:600; font-size:.875rem; }
.wiw-form-success { display:none; background:#E8F5E9; border-radius:var(--radius-lg); padding:2.5rem; text-align:center; }
.wiw-form-success h3 { color:var(--blue-deep); margin-bottom:.5rem; }
.wiw-form-success p { color:var(--text-light); }

/* ===== MAP ===== */
.wiw-map { border-radius:var(--radius-lg); overflow:hidden; box-shadow:var(--shadow-lg); height:420px; }
.wiw-map iframe { width:100%; height:100%; border:0; }

/* ===== LEGAL ===== */
.wiw-legal { background:#F8FBFF; border:2px solid var(--blue-pale); border-radius:var(--radius-lg); padding:2rem; margin-bottom:1.5rem; }
.wiw-legal h2 { font-size:1.2rem; margin-bottom:1rem; }
.wiw-legal h3 { font-size:.95rem; color:var(--blue-mid); margin:.75rem 0 .35rem; }
.wiw-legal p { color:var(--text); font-size:.9rem; line-height:1.7; margin-bottom:.75rem; }
.wiw-legal a { color:var(--blue-light); }

/* ===== ANIMATIONS ===== */
@keyframes wiw-fadeUp { from{opacity:0;transform:translateY(20px)} to{opacity:1;transform:translateY(0)} }
.wiw-animate { animation:wiw-fadeUp .5s ease forwards; }

/* ===== IMAGE HELPERS ===== */
.wiw-img-cover { width:100%; height:100%; object-fit:cover; display:block; }
.wiw-rounded { border-radius:var(--radius-lg); overflow:hidden; }