/* Teeny Days theme — design system
   Colours, fonts and spacing live in theme.json so they appear in the editor.
   This file holds the decorative bits WordPress can't express as settings:
   the wavy section edges and the doodle wallpaper. */

:root{
  --td-pink:#EC0A64;
  --td-cyan:#1CBFD0;
  --td-lime:#A4CE39;
  --td-orange:#F07C1E;
  --td-yellow:#FFE500;
  --td-navy:#0F1B52;
  --td-grey:#5F6B76;
  --td-wave-h:26px;
}

body{-webkit-font-smoothing:antialiased}
a{color:var(--td-pink)}

/* ---------- buttons ---------- */
.wp-block-button__link{
  font-family:"Baloo 2",system-ui,sans-serif;font-weight:700;letter-spacing:.06em;
  padding:.7rem 2rem;border-radius:999px;transition:filter .15s ease,transform .15s ease;
}
.wp-block-button__link:hover{filter:brightness(1.08);transform:translateY(-2px)}

/* ---------- colour bands ---------- */
.td-band{position:relative;overflow:hidden}
.td-band > *{position:relative;z-index:2}
.td-band::after{
  content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background-image:url("data:image/svg+xml,<svg xmlns=%22http://www.w3.org/2000/svg%22 width=%22330%22 height=%22330%22 viewBox=%220 0 330 330%22><g fill=%22none%22 stroke=%22%23ffffff%22 stroke-opacity=%220.16%22 stroke-width=%222%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22><g transform=%22translate(18,22)%22><path d=%22M10 4c-6 0-10 5-10 11s5 12 10 12 10-6 10-12-4-11-10-11z%22/><path d=%22M10 4V0M10 2c2-3 5-2 5-2%22/></g><g transform=%22translate(108,18) rotate(28)%22><rect x=%220%22 y=%220%22 width=%2252%22 height=%2216%22 rx=%222%22/><path d=%22M10 0v6M20 0v9M30 0v6M40 0v9%22/></g><g transform=%22translate(228,30)%22><circle cx=%2211%22 cy=%2211%22 r=%2211%22/><path d=%22M6 24h10M7 28h8%22/></g><g transform=%22translate(180,58)%22><path d=%22M6 0v10L0 26h22L16 10V0z%22/><path d=%22M4 0h14%22/></g><g transform=%22translate(30,120) rotate(-18)%22><path d=%22M2 14V6a6 6 0 0112 0v12a4 4 0 01-8 0V8%22/></g><g transform=%22translate(96,116)%22><circle cx=%2216%22 cy=%2216%22 r=%2216%22/><path d=%22M0 16h32M16 0c8 8 8 24 0 32M16 0C8 8 8 24 16 32%22/><path d=%22M16 36v6M8 44h16%22/></g><g transform=%22translate(196,130) rotate(42)%22><rect x=%220%22 y=%220%22 width=%2214%22 height=%2234%22 rx=%222%22/><path d=%22M0 26h14M7 42l-7-8h14z%22/></g><g transform=%22translate(268,132)%22><path d=%22M0 12L34 0 22 34l-8-12z%22/><path d=%22M14 22L34 0%22/></g><g transform=%22translate(20,228)%22><rect x=%220%22 y=%220%22 width=%2246%22 height=%2234%22 rx=%223%22/><path d=%22M0 12h46M0 23h46%22/><circle cx=%2212%22 cy=%226%22 r=%223%22/><circle cx=%2230%22 cy=%2217%22 r=%223%22/><circle cx=%2220%22 cy=%2229%22 r=%223%22/></g><g transform=%22translate(118,236)%22><circle cx=%2216%22 cy=%2216%22 r=%2216%22/><path d=%22M16 6v10l7 5%22/></g><g transform=%22translate(200,240)%22><circle cx=%2215%22 cy=%2215%22 r=%2215%22/><path d=%22M0 15h30M15 0v30M4 4c8 6 14 12 22 22M26 4C18 10 12 16 4 26%22/></g><g transform=%22translate(272,232)%22><rect x=%220%22 y=%228%22 width=%2232%22 height=%2230%22 rx=%226%22/><path d=%22M8 8a8 8 0 0116 0M0 22h32%22/></g></g></svg>");
  background-repeat:repeat;background-size:330px 330px;
}
.td-band--cyan{background:var(--td-cyan)}
.td-band--pink{background:var(--td-pink)}
.td-band--lime{background:var(--td-lime)}
.td-band--orange{background:var(--td-orange)}
.td-band--navy{background:var(--td-navy)}
.td-band--cyan,.td-band--pink,.td-band--lime,.td-band--orange,.td-band--navy{color:#fff}
.td-band h1,.td-band h2,.td-band h3,.td-band h4,.td-band p,.td-band li{color:#fff}
/* Links on a colour band read white. Buttons are excluded so they keep the
   colour chosen in the editor. */
.td-band a:not(.wp-block-button__link){color:#fff}
.td-band a:not(.wp-block-button__link):hover{text-decoration:underline}

/* wavy top/bottom edges — the signature device */
.td-wave{position:relative}
.td-wave::before,.td-wave::after{
  content:"";position:absolute;left:0;right:0;height:var(--td-wave-h);z-index:5;pointer-events:none;
  background-repeat:repeat-x;background-size:46px var(--td-wave-h);
}
.td-wave::before{top:0;background-image:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 46 26' preserveAspectRatio='none'><path d='M0 13 Q11.5 0 23 13 T46 13 V0 H0 Z' fill='%23ffffff'/></svg>")}
.td-wave::after{bottom:0;background-image:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 46 26' preserveAspectRatio='none'><path d='M0 13 Q11.5 0 23 13 T46 13 V26 H0 Z' fill='%23ffffff'/></svg>")}
.td-wave-bottom-only::before{display:none}
.td-wave-top-only::after{display:none}

/* ---------- split band: colour one side, photo the other ---------- */
.td-split{display:grid;grid-template-columns:1fr 1fr;align-items:stretch;gap:0}
.td-split > .wp-block-column{padding:0}
.td-split .td-split__text{display:flex;align-items:center;padding:5rem 3rem}
.td-split .td-split__text > *{max-width:36rem}
.td-split figure,.td-split .wp-block-image,.td-split .wp-block-image img{
  height:100%;margin:0;
}
.td-split .wp-block-image img{width:100%;height:100%;object-fit:cover;display:block}
@media (max-width:781px){
  .td-split{grid-template-columns:1fr}
  .td-split .td-split__text{padding:3rem 1.5rem}
  .td-split .wp-block-image img{height:280px}
}

/* ---------- hero ---------- */
.td-hero .td-split__text{padding-block:4.5rem}
.td-hero h1{text-transform:uppercase;line-height:1.12}
.td-hero__tel{
  font-family:"Baloo 2",system-ui,sans-serif;font-weight:800;font-size:2.6rem;
  line-height:1.1;display:block;margin-bottom:.3rem;
}
.td-hero__tel a{text-decoration:none}
.td-hero__tel a:hover{text-decoration:none;opacity:.85}

/* ---------- announcement strip ---------- */
.td-strip{padding-block:1.5rem}
.td-strip h2{text-align:center;letter-spacing:.05em;margin:0}

/* ---------- page header band on inner pages ---------- */
.td-page-header{padding-block:3.5rem 4rem}
.td-page-header h1{margin:0;text-align:center}

/* ---------- icon cards ---------- */
.td-helpers{text-align:center}
.td-helpers .wp-block-column > .wp-block-image{margin-bottom:1.2rem}
.td-helpers img{width:76px;height:76px;margin-inline:auto}

/* ---------- room / programme dots ---------- */
.td-prog{display:flex;align-items:center;gap:.9rem;text-decoration:none;
  font-family:"Baloo 2",system-ui,sans-serif;font-weight:700;letter-spacing:.04em;font-size:1.05rem}
.td-prog__dot{width:66px;height:66px;border-radius:50%;flex:none;display:grid;place-items:center}
.td-prog--cyan .td-prog__dot{background:var(--td-cyan)} .td-prog--cyan{color:var(--td-cyan)}
.td-prog--pink .td-prog__dot{background:var(--td-pink)} .td-prog--pink{color:var(--td-pink)}
.td-prog--orange .td-prog__dot{background:var(--td-orange)} .td-prog--orange{color:var(--td-orange)}
.td-prog--lime .td-prog__dot{background:var(--td-lime)} .td-prog--lime{color:var(--td-lime)}

/* ---------- fee cards ---------- */
.td-fee{border:3px solid #EDF1F4;border-radius:22px;padding:2rem 1.5rem;text-align:center}
.td-fee__ring{width:96px;height:96px;border-radius:50%;margin:0 auto 1.2rem;display:grid;place-items:center;
  font-family:"Baloo 2",system-ui,sans-serif;font-weight:800;font-size:1.5rem;color:#fff}
.td-fee--cyan .td-fee__ring{background:var(--td-cyan)}
.td-fee--pink .td-fee__ring{background:var(--td-pink)}
.td-fee--orange .td-fee__ring{background:var(--td-orange)}

/* ---------- pill badges ---------- */
.td-badges{display:flex;flex-wrap:wrap;justify-content:center;gap:1rem}
.td-badge{border-radius:999px;padding:.7rem 1.6rem;color:#fff;
  font-family:"Baloo 2",system-ui,sans-serif;font-weight:700;font-size:.95rem;letter-spacing:.03em}
.td-badge--cyan{background:var(--td-cyan)}
.td-badge--pink{background:var(--td-pink)}
.td-badge--orange{background:var(--td-orange)}
.td-badge--lime{background:var(--td-lime)}

/* ---------- quote cards (testimonials) ---------- */
.td-quote{background:#F7FAFB;border-radius:22px;padding:1.8rem;border-left:6px solid var(--td-cyan)}
.td-quote p{font-style:italic;margin:0}
.td-quote:nth-child(2n){border-left-color:var(--td-pink)}
.td-quote:nth-child(3n){border-left-color:var(--td-orange)}

/* ---------- team ---------- */
.td-person{border-bottom:2px dashed #E3EAF0;padding-bottom:1.2rem;margin-bottom:1.2rem}
.td-person h3{margin:0 0 .2rem}
.td-person p{margin:0;font-size:.98rem}

/* ---------- header / nav ---------- */
.td-topbar{font-size:.85rem}
.td-topbar p{margin:0}
.td-topbar a{color:#fff;text-decoration:none}
.wp-block-navigation{font-family:"Baloo 2",system-ui,sans-serif;font-weight:600}
.wp-block-navigation a:hover{color:var(--td-pink)}
.wp-block-site-title a{font-family:"Baloo 2",system-ui,sans-serif;font-weight:800;
  font-size:1.6rem;text-decoration:none;color:var(--td-cyan)}

/* sticky header */
.td-header{position:sticky;top:0;z-index:100;background:#fff;box-shadow:0 2px 14px rgba(15,27,82,.10)}
.admin-bar .td-header{top:32px}
@media (max-width:782px){.admin-bar .td-header{top:46px}}

/* ---------- content width & prose rhythm ---------- */
.td-prose li{margin-bottom:.4rem}
.td-prose h2{margin-top:2.5rem}
.td-prose h3{margin-top:2rem}

/* ---------- accessibility ---------- */
a:focus-visible,button:focus-visible,.wp-block-button__link:focus-visible{
  outline:3px solid var(--td-orange);outline-offset:3px;border-radius:6px}
@media (prefers-reduced-motion:reduce){*{animation:none !important;transition:none !important}}