/*
Theme Name: Seeds Classroom Coming Soon
Theme URI: https://seedslanguageacademy.com/
Author: Seeds Language Academy
Description: Tema temporaneo Coming Soon animato per Seeds Language Academy. Una classe si riempie di alunni in attesa della maestra.
Version: 1.1.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: seeds-classroom
License: GPL-2.0-or-later
*/
:root{--navy:#152e55;--green:#438e4b;--brown:#a36b40;--paper:#f8f5ee;--ink:#243b50}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:#eaf2ed;color:var(--ink);font-family:ui-rounded,"Trebuchet MS",Arial,sans-serif;-webkit-font-smoothing:antialiased}
.page{min-height:100vh;overflow:hidden;background:radial-gradient(ellipse at 50% 0%,#fffef7 0%,#f4f7ec 45%,#e4f0ee 100%)}
.topbar{max-width:1250px;margin:0 auto;padding:24px 24px 0;display:flex;justify-content:center}.brand-card{background:rgba(255,255,255,.86);border:1px solid rgba(222,231,218,.95);box-shadow:0 18px 40px rgba(31,75,59,.08);border-radius:28px;padding:14px 24px}.brand{width:min(500px,82vw);height:auto;display:block;filter:drop-shadow(0 7px 8px rgba(19,56,55,.05))}
.hero{text-align:center;margin:8px auto 0;padding:0 22px;max-width:1000px}.eyebrow{font-weight:800;letter-spacing:.27em;color:#6d8a70;font-size:12px;text-transform:uppercase;margin:0 0 7px}.hero h1{font-size:clamp(46px,7.4vw,94px);line-height:1.04;letter-spacing:-.06em;color:var(--navy);margin:0 0 8px;font-weight:900}.hero h1 span{color:#70a15e}.sub{font-size:clamp(16px,2.1vw,23px);margin:0 auto;max-width:710px;color:#465d6b;line-height:1.5}.sub strong{color:var(--navy)}
.scene-wrap{position:relative;width:min(1180px,96vw);margin:15px auto 0;filter:drop-shadow(0 22px 30px rgba(31,75,59,.14))}.scene-svg{width:100%;height:auto;display:block}
.bottom{position:relative;max-width:1100px;margin:-2px auto 0;padding:14px 25px 31px;text-align:center}.pill{display:inline-flex;align-items:center;gap:10px;background:#fffdf6;border:1px solid #e0e7d8;padding:11px 20px;border-radius:40px;box-shadow:0 7px 20px rgba(40,70,55,.08);font-size:15px;color:#466352;font-weight:700}.dot{width:9px;height:9px;background:#78ab59;box-shadow:0 0 0 5px #dcebd2;border-radius:50%;animation:pulse 2.5s ease-in-out infinite}.lang{font-size:14px;color:#6b807a;margin:18px 0 0}.footer{font-size:12px;color:#81928b;padding:0 0 24px;text-align:center}
.board-text{font-family:"Trebuchet MS",Arial,sans-serif;font-weight:800}.chalk-title{animation:write-in 26s ease-in-out infinite;transform-origin:center}.clock-minute{transform-origin:965px 122px;animation:clockturn 26s linear infinite}.clock-hour{transform-origin:965px 122px;animation:hourturn 78s linear infinite}
.student{opacity:1}.student .walker{opacity:0;transform-box:fill-box;transform-origin:center;animation-duration:26s;animation-timing-function:ease-in-out;animation-iteration-count:infinite}
.student.s1 .walker{animation-name:enter-seat-1}.student.s2 .walker{animation-name:enter-seat-2}.student.s3 .walker{animation-name:enter-seat-3}.student.s4 .walker{animation-name:enter-seat-4}.student.s5 .walker{animation-name:enter-seat-5}.student.s6 .walker{animation-name:enter-seat-6}
.teacher{opacity:0;animation:teacher-enter 26s ease-in-out infinite}.spark{animation:twinkle 3s ease-in-out infinite}.spark.two{animation-delay:1.4s}.leaf{transform-origin:center;animation:sway 3.8s ease-in-out infinite alternate}
@keyframes enter-seat-1{0%,2%{opacity:0;transform:translate(-205px,-120px)}5%,13%{opacity:1;transform:translate(-145px,-92px)}16%,72%{opacity:1;transform:translate(0,9px)}90%,100%{opacity:0;transform:translate(0,9px)}}
@keyframes enter-seat-2{0%,12%{opacity:0;transform:translate(-420px,-116px)}15%,23%{opacity:1;transform:translate(-250px,-88px)}26%,72%{opacity:1;transform:translate(0,9px)}90%,100%{opacity:0;transform:translate(0,9px)}}
@keyframes enter-seat-3{0%,22%{opacity:0;transform:translate(-612px,-120px)}25%,33%{opacity:1;transform:translate(-355px,-93px)}36%,72%{opacity:1;transform:translate(0,9px)}90%,100%{opacity:0;transform:translate(0,9px)}}
@keyframes enter-seat-4{0%,32%{opacity:0;transform:translate(-174px,-226px)}35%,43%{opacity:1;transform:translate(-120px,-175px)}46%,72%{opacity:1;transform:translate(0,11px)}90%,100%{opacity:0;transform:translate(0,11px)}}
@keyframes enter-seat-5{0%,42%{opacity:0;transform:translate(-447px,-221px)}45%,53%{opacity:1;transform:translate(-220px,-164px)}56%,72%{opacity:1;transform:translate(0,11px)}90%,100%{opacity:0;transform:translate(0,11px)}}
@keyframes enter-seat-6{0%,52%{opacity:0;transform:translate(-685px,-222px)}55%,63%{opacity:1;transform:translate(-320px,-168px)}66%,72%{opacity:1;transform:translate(0,11px)}90%,100%{opacity:0;transform:translate(0,11px)}}
@keyframes teacher-enter{0%,70%{opacity:0;transform:translateX(34px)}77%,88%{opacity:1;transform:translateX(0)}95%,100%{opacity:0;transform:translateX(0)}}
@keyframes write-in{0%,5%{opacity:0}13%,90%{opacity:1}96%,100%{opacity:0}}@keyframes clockturn{to{transform:rotate(360deg)}}@keyframes hourturn{to{transform:rotate(360deg)}}@keyframes twinkle{50%{opacity:.25;transform:scale(.9)}}@keyframes pulse{50%{box-shadow:0 0 0 8px #dcebd2;opacity:.65}}@keyframes sway{to{transform:rotate(8deg)}}
@media(max-width:600px){.topbar{padding-top:18px}.brand-card{padding:12px 18px;border-radius:22px}.brand{width:min(340px,84vw)}.eyebrow{font-size:10px;letter-spacing:.18em}.hero h1{font-size:clamp(44px,11vw,65px)}.sub{font-size:15px}.scene-wrap{width:125vw;max-width:none;left:50%;transform:translateX(-50%);margin-top:10px}.bottom{margin-top:0}.pill{font-size:12px;padding:10px 14px}.lang{font-size:12px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}.student .walker,.teacher,.chalk-title{opacity:1!important;transform:none!important}}