
/*
Theme Name: Kidoosy
Theme URI: https://kidoosy.com/
Author: Kidoosy
Description: A playful, responsive one-page WordPress theme for Kidoosy children's toys.
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: kidoosy
*/

:root{
  --purple:#7B4BC4;
  --deep:#6036A8;
  --lav:#DCC8F2;
  --light:#F5EFFB;
  --yellow:#FFC94D;
  --warm:#FFFDF9;
  --ink:#30263B;
  --muted:#6d6376;
  --white:#fff;
  --green:#25D366;
  --radius:28px;
  --shadow:0 18px 55px rgba(84,51,126,.12);
  --max:1180px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;color:var(--ink);background:var(--warm);font-family:Nunito,ui-rounded,"Trebuchet MS",system-ui,sans-serif;line-height:1.65}
img{max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
button,a{ -webkit-tap-highlight-color:transparent}
.site-header{position:sticky;top:0;z-index:100;background:rgba(255,253,249,.9);backdrop-filter:blur(14px);border-bottom:1px solid rgba(123,75,196,.09)}
.nav-wrap{max-width:var(--max);margin:auto;padding:12px 22px;display:flex;align-items:center;justify-content:space-between;gap:18px}
.brand-logo{width:145px;display:block}
.header-cta,.cta{display:inline-flex;align-items:center;justify-content:center;gap:9px;border:0;border-radius:999px;background:var(--purple);color:#fff;font-weight:900;padding:13px 21px;box-shadow:0 10px 25px rgba(123,75,196,.2);transition:.2s transform,.2s box-shadow,.2s background}
.header-cta:hover,.cta:hover{transform:translateY(-2px);background:var(--deep);box-shadow:0 14px 30px rgba(123,75,196,.27)}
.wa{background:var(--green)!important;color:#102b1a!important}
.container{width:min(var(--max),calc(100% - 44px));margin:auto}
.hero{position:relative;overflow:hidden;padding:72px 0 78px;background:linear-gradient(135deg,#fff 0%,#f8f1fd 54%,#fff7d9 100%)}
.hero:before,.hero:after{content:"";position:absolute;border-radius:50%;pointer-events:none}
.hero:before{width:360px;height:360px;background:#eadcf8;left:-190px;top:-80px}
.hero:after{width:290px;height:290px;background:#fff0b6;right:-120px;bottom:-100px}
.hero-grid{position:relative;z-index:1;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:50px}
.kicker{display:inline-flex;align-items:center;gap:8px;color:var(--purple);font-weight:900;letter-spacing:.04em;text-transform:uppercase;font-size:.78rem}
.kicker:before{content:"";width:9px;height:9px;border-radius:50%;background:var(--yellow)}
h1,h2,h3{font-family:Fredoka,"Trebuchet MS",system-ui,sans-serif;line-height:1.1;letter-spacing:-.02em}
h1{font-size:clamp(3rem,6vw,5.4rem);margin:16px 0 20px}
h1 span{color:var(--purple)}
.hero-copy{font-size:1.12rem;color:var(--muted);max-width:590px}
.price{font-family:Fredoka,"Trebuchet MS",sans-serif;font-size:2.2rem;font-weight:900;margin:25px 0 18px;color:var(--deep)}
.price small{font-family:inherit;font-size:.45em;color:var(--muted);font-weight:700;margin-left:5px}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap}
.hero-note{font-size:.85rem;color:var(--muted);margin-top:12px}
.hero-art{position:relative;padding:30px}
.art-card{background:rgba(255,255,255,.74);border:1px solid rgba(123,75,196,.12);border-radius:42px;padding:20px;box-shadow:var(--shadow)}
.bunny-img{display:block;width:100%;animation:bob 2.8s ease-in-out infinite;transform-origin:50% 80%;will-change:transform}
@keyframes bob{
  0%,100%{transform:translateY(0) rotate(0deg) scale(1)}
  25%{transform:translateY(-10px) rotate(-1deg) scale(1.012)}
  50%{transform:translateY(-18px) rotate(1deg) scale(1.025)}
  75%{transform:translateY(-9px) rotate(-.8deg) scale(1.012)}
}
.art-card{animation:cardPulse 3.8s ease-in-out infinite}
@keyframes cardPulse{0%,100%{box-shadow:0 18px 55px rgba(84,51,126,.12)}50%{box-shadow:0 24px 70px rgba(123,75,196,.22)}}
.decor.star{animation:starFloat 2.6s ease-in-out infinite}
.decor.dot{animation:dotFloat 2.1s ease-in-out infinite}
@keyframes starFloat{0%,100%{transform:translateY(0) rotate(0deg)}50%{transform:translateY(-14px) rotate(12deg)}}
@keyframes dotFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(10px)}}
.decor{position:absolute;border-radius:50%;z-index:2}
.decor.star{width:50px;height:50px;background:var(--yellow);clip-path:polygon(50% 0,61% 35%,98% 35%,68% 57%,79% 94%,50% 72%,21% 94%,32% 57%,2% 35%,39% 35%);top:5px;right:10px}
.decor.dot{width:18px;height:18px;background:var(--purple);bottom:45px;left:5px}
.section{padding:92px 0}
.section.alt{background:#f8f1fd}
.section.yellow{background:#fff7d9}
.center{text-align:center}
.eyebrow{color:var(--purple);font-weight:900;text-transform:uppercase;letter-spacing:.08em;font-size:.78rem}
h2{font-size:clamp(2.3rem,4vw,3.5rem);margin:10px 0 14px}
.section-intro{max-width:720px;margin:0 auto 44px;color:var(--muted);font-size:1.06rem}
.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.card{background:#fff;border:1px solid rgba(123,75,196,.09);border-radius:var(--radius);padding:28px;box-shadow:0 12px 35px rgba(84,51,126,.07);transition:.22s transform,.22s box-shadow}
.card:hover{transform:translateY(-5px);box-shadow:0 20px 45px rgba(84,51,126,.12)}
.icon{width:54px;height:54px;border-radius:18px;display:grid;place-items:center;background:var(--light);font-size:1.55rem;margin-bottom:17px}
.card h3{font-size:1.35rem;margin:0 0 8px}
.card p{margin:0;color:var(--muted)}
.feature{display:flex;gap:15px;align-items:flex-start}
.feature .icon{flex:0 0 54px}
.showcase{background:linear-gradient(145deg,#6d42b6,#8d5bd0);color:#fff;overflow:hidden}
.showcase .section-intro{color:#eee4fb}
.showcase-grid{display:grid;grid-template-columns:1fr 1.1fr 1fr;align-items:center;gap:22px}
.callout{padding:20px;border-radius:24px;background:rgba(255,255,255,.11);border:1px solid rgba(255,255,255,.16);backdrop-filter:blur(8px)}
.callout strong{display:block;font-family:Fredoka,sans-serif;font-size:1.1rem;margin-bottom:4px}
.callout span{font-size:.9rem;color:#eee4fb}
.showcase .art-card{background:rgba(255,255,255,.95);border:0}
.pillars{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.pillar{padding:38px;border-radius:34px;background:#fff;border:1px solid rgba(123,75,196,.1);position:relative;overflow:hidden}
.pillar:nth-child(2){background:#f8f1fd}
.pillar:nth-child(3){background:#fff7d9}
.pillar .num{font-family:Fredoka;font-size:4rem;color:var(--lav);font-weight:900;position:absolute;right:20px;top:10px}
.pillar h3{font-size:2rem;margin:20px 0 10px}
.split{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:50px}
.checks{display:grid;gap:13px;margin-top:25px}
.check{display:flex;gap:12px;align-items:center;font-weight:800}
.check b{width:28px;height:28px;border-radius:50%;background:var(--yellow);display:grid;place-items:center;color:var(--deep)}
.product-box{background:#fff;border-radius:34px;padding:35px;box-shadow:var(--shadow);border:1px solid rgba(123,75,196,.1)}
.specs{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid #eee6f5;margin-top:20px}
.spec{padding:15px 0;border-bottom:1px solid #eee6f5}
.spec strong{display:block;font-size:.8rem;color:var(--muted);text-transform:uppercase;letter-spacing:.06em}
.spec span{font-weight:800}
.price-card{background:linear-gradient(145deg,#fff,#f7effd);border:2px solid #e3d1f5;border-radius:38px;padding:42px;box-shadow:var(--shadow);text-align:center}
.big-price{font-family:Fredoka;font-size:4rem;color:var(--deep);font-weight:900;line-height:1;margin:10px 0 20px}
.big-price small{font-size:1.1rem;color:var(--muted);font-family:inherit}
.faq{max-width:850px;margin:auto;display:grid;gap:12px}
.faq details{background:#fff;border:1px solid rgba(123,75,196,.1);border-radius:20px;padding:20px 22px}
.faq summary{cursor:pointer;font-family:Fredoka;font-size:1.15rem;font-weight:700}
.faq p{color:var(--muted);margin:13px 0 0}
.final-cta{padding:95px 0;background:linear-gradient(135deg,#f0e4fb,#fff7d9)}
.final-box{display:grid;grid-template-columns:1.1fr .9fr;align-items:center;gap:40px;background:rgba(255,255,255,.62);border:1px solid rgba(123,75,196,.1);border-radius:42px;padding:42px;box-shadow:var(--shadow)}
.site-footer{background:#2d2340;color:#fff;padding:55px 0 35px}
.footer-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:40px}
.footer-logo{width:165px;background:#fff;border-radius:12px;padding:6px}
.footer-copy{color:#d9d0e5;max-width:520px}
.footer-links{display:flex;flex-wrap:wrap;gap:10px 20px;margin-top:20px}
.footer-links a{color:#eee4fb;font-weight:700}
.footer-links a:hover{color:#fff}
.footer-bottom{border-top:1px solid rgba(255,255,255,.1);margin-top:30px;padding-top:20px;color:#bfb4cf;font-size:.85rem}
.mobile-order{display:none}
.screen-reader-text{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media (max-width:980px){
 .grid-4{grid-template-columns:repeat(2,1fr)}
 .showcase-grid{grid-template-columns:1fr 1fr}
 .showcase-grid .center-art{grid-column:1/-1;grid-row:1}
 .showcase-grid .callout{min-height:100%}
}
@media (max-width:760px){
 .container{width:min(var(--max),calc(100% - 28px))}
 .nav-wrap{padding:10px 14px}
 .brand-logo{width:118px}
 .header-cta{padding:10px 14px;font-size:.86rem}
 .hero{padding:45px 0 58px}
 .hero-grid,.split,.final-box,.footer-grid{grid-template-columns:1fr}
 .hero-grid{gap:20px}
 h1{font-size:clamp(2.65rem,14vw,4.1rem)}
 .hero-copy{font-size:1rem}
 .hero-art{padding:0}
 .section{padding:70px 0}
 .grid-4,.grid-3,.pillars{grid-template-columns:1fr}
 .showcase-grid{grid-template-columns:1fr}
 .showcase-grid .center-art{grid-column:auto}
 .final-box{padding:26px}
 .product-box,.price-card{padding:27px}
 .big-price{font-size:3.4rem}
 .mobile-order{display:flex;position:fixed;z-index:110;bottom:12px;left:12px;right:12px;justify-content:center;align-items:center;padding:14px 18px;border-radius:999px;background:var(--green);color:#102b1a;font-weight:900;box-shadow:0 12px 35px rgba(0,0,0,.18)}
 body{padding-bottom:74px}
}
@media (prefers-reduced-motion:reduce){
 html{scroll-behavior:auto}
 *,*:before,*:after{animation:none!important;transition:none!important}
}

/* Supplied Kidoosy rabbit feature artwork */
.bunny-img,
.product-image,
.rabbit-image,
.feature-image img {
  object-fit: contain;
  object-position: center;
}
