/*
Theme Name: Junior Taekwondo
Theme URI: https://example.com
Author: Junior Taekwondo Club
Author URI: https://example.com
Description: Тема для сайту спортивного клубу тхеквондо з можливістю редагування всіх розділів (hero, переваги, програми, тренери, зали, відгуки, галерея, футер) через Кастомайзер та власні типи записів, а також публікації новин через стандартні пости WordPress.
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: junior-taekwondo
*/

:root{
  --navy:#0d1b2a;
  --navy-2:#122238;
  --red:#e0261f;
  --red-dark:#b31f19;
  --ink:#16212e;
  --grey:#5b6b7a;
  --line:#e7eaee;
  --paper:#f6f7f9;
  --blue-panel:#1b3a6b;
}
*{box-sizing:border-box; margin:0; padding:0;}
body{font-family:'Inter',sans-serif; color:var(--ink); background:#fff; line-height:1.5;}
h1,h2,h3,h4{font-family:'Oswald',sans-serif; text-transform:uppercase; letter-spacing:.3px;}
a{text-decoration:none; color:inherit;}
img{display:block; max-width:100%;}
ul{list-style:none;}
.wrap{max-width:1160px; margin:0 auto; padding:0 24px;}
.eyebrow{color:var(--red); font-weight:700; font-size:13px; letter-spacing:1.5px; text-transform:uppercase; margin-bottom:8px; display:block;}
.btn{display:inline-block; padding:14px 26px; font-weight:600; font-size:14px; letter-spacing:.5px; text-transform:uppercase; border-radius:2px; transition:.2s; cursor:pointer; border:none;}
.btn-red{background:var(--red); color:#fff;}
.btn-red:hover{background:var(--red-dark); color:#fff;}
.btn-outline{background:transparent; color:#fff; border:1px solid rgba(255,255,255,.5);}
.btn-outline:hover{border-color:#fff;}
.btn-link{color:var(--red); font-weight:600; font-size:14px; text-transform:uppercase;}

/* HEADER */
header#site-header{background:var(--navy); position:sticky; top:0; z-index:50;}
.nav{display:flex; align-items:center; justify-content:space-between; padding:16px 24px; max-width:1160px; margin:0 auto;}
.logo{display:flex; align-items:center; gap:10px; color:#fff; font-family:'Oswald',sans-serif; font-weight:700; font-size:19px; text-transform:uppercase; line-height:1.1;}
.logo span{display:block; color:var(--red); font-size:11px; letter-spacing:1px;}
.logo img{max-height:38px;}
.navlinks{display:flex; gap:28px; font-size:13.5px; font-weight:500; color:#dfe4ea; text-transform:uppercase; letter-spacing:.4px;}
.navlinks ul{display:flex; gap:28px;}
.navlinks a{border-bottom:2px solid transparent; padding-bottom:4px;}
.navlinks a.current-menu-item, .navlinks li.current-menu-item > a{color:#fff; border-color:var(--red);}
.navlinks a:hover{color:#fff;}
.navright{display:flex; align-items:center; gap:22px;}
.phone{color:#fff; font-weight:600; font-size:14.5px;}
.burger{display:none; background:none; border:none; color:#fff; font-size:24px; cursor:pointer;}
@media(max-width:980px){
  .navlinks{display:none; position:absolute; top:100%; left:0; right:0; background:var(--navy); flex-direction:column; padding:10px 24px 20px;}
  .navlinks.open{display:flex;}
  .navlinks ul{flex-direction:column; gap:14px;}
  .burger{display:block;}
}

/* HERO */
.hero{position:relative; background:linear-gradient(120deg,#0d1b2a 40%, #1a2c3f 100%); overflow:hidden; color:#fff;}
.hero-inner{max-width:1160px; margin:0 auto; padding:70px 24px 60px; display:grid; grid-template-columns:1fr 1fr; gap:20px; align-items:center; position:relative; z-index:2;}
.hero-numbers{position:absolute; left:24px; top:120px; display:flex; flex-direction:column; gap:22px; font-family:'Oswald'; font-size:13px; color:#7c8a9a; z-index:3;}
.hero-numbers .on{color:#fff; border-left:2px solid var(--red); padding-left:8px; margin-left:-10px;}
.hero h1{font-size:46px; line-height:1.08; margin-bottom:18px;}
.hero p{color:#c3cad3; font-size:15.5px; max-width:440px; margin-bottom:30px;}
.hero-ctas{display:flex; gap:14px; flex-wrap:wrap;}
.hero-visual{position:relative; height:420px; border-radius:4px; overflow:hidden; background:radial-gradient(circle at 30% 20%, #24405f, #0d1b2a 70%); display:flex; align-items:center; justify-content:center;}
.hero-visual img{width:100%; height:100%; object-fit:cover; position:absolute; inset:0;}
.hero-visual svg{width:78%; opacity:.95; position:relative; z-index:1;}
.hero-visual::after{content:""; position:absolute; right:-40px; bottom:-60px; width:260px; height:260px; background:var(--red); opacity:.18; border-radius:50%; filter:blur(10px); z-index:2;}
.scrolldown{display:flex; align-items:center; gap:10px; color:#9aa5b1; font-size:12px; letter-spacing:1px; text-transform:uppercase; padding:0 24px 30px; max-width:1160px; margin:0 auto;}
@media(max-width:860px){.hero-inner{grid-template-columns:1fr;} .hero-numbers{display:none;} .hero h1{font-size:34px;}}

/* BENEFITS */
.section{padding:80px 0;}
.section-head{text-align:center; margin-bottom:50px;}
.section-head h2{font-size:30px;}
.benefits-grid{display:grid; grid-template-columns:repeat(5,1fr); gap:26px;}
.benefit{text-align:center;}
.benefit .icon{width:56px; height:56px; margin:0 auto 18px; color:var(--navy);}
.benefit h4{font-family:'Inter'; text-transform:none; font-size:15.5px; font-weight:700; margin-bottom:8px;}
.benefit p{font-size:13.5px; color:var(--grey);}
@media(max-width:900px){.benefits-grid{grid-template-columns:repeat(2,1fr);}}

/* PROGRAMS */
.programs{background:var(--paper);}
.programs-top{display:grid; grid-template-columns:1fr 2.4fr; gap:40px; align-items:end; margin-bottom:40px;}
.programs-top h2{font-size:30px; margin-top:6px;}
.program-cards{display:grid; grid-template-columns:repeat(4,1fr); gap:20px;}
.program-card{background:#fff; border:1px solid var(--line);}
.program-photo{height:190px; background:linear-gradient(135deg,#1b3a6b,#0d1b2a); display:flex; align-items:center; justify-content:center; color:rgba(255,255,255,.85); overflow:hidden; position:relative;}
.program-photo img{width:100%; height:100%; object-fit:cover; position:absolute; inset:0;}
.program-photo svg{width:52px; height:52px; position:relative; z-index:1;}
.program-body{padding:20px;}
.program-body h4{font-family:'Inter'; text-transform:none; font-size:15.5px; font-weight:700; margin-bottom:8px;}
.program-body p{font-size:13px; color:var(--grey); margin-bottom:14px; min-height:54px;}
@media(max-width:900px){.program-cards{grid-template-columns:repeat(2,1fr);} .programs-top{grid-template-columns:1fr;}}

/* STATS */
.stats{background:var(--navy); color:#fff;}
.stats-head{text-align:center; margin-bottom:36px;}
.stats-grid{display:grid; grid-template-columns:repeat(4,1fr);}
.stat{text-align:center; padding:0 20px; border-left:1px solid rgba(255,255,255,.12);}
.stat:first-child{border-left:none;}
.stat .icon{width:34px; height:34px; margin:0 auto 14px; color:var(--red);}
.stat b{font-family:'Oswald'; font-size:38px; display:block;}
.stat span{font-size:13px; color:#9aa5b1;}
@media(max-width:800px){.stats-grid{grid-template-columns:repeat(2,1fr); gap:30px;} .stat{border-left:none;}}

/* COACHES */
.coaches-top{display:flex; justify-content:space-between; align-items:flex-end; margin-bottom:36px;}
.coaches-top h2{font-size:30px; margin-top:6px;}
.coach-grid{display:grid; grid-template-columns:repeat(5,1fr); gap:20px;}
.coach-photo{aspect-ratio:1/1; border-radius:4px; background:linear-gradient(160deg,#233649,#0d1b2a); display:flex; align-items:center; justify-content:center; color:#54677c; font-family:'Oswald'; font-size:36px; margin-bottom:14px; overflow:hidden; position:relative;}
.coach-photo img{width:100%; height:100%; object-fit:cover; position:absolute; inset:0;}
.coach h4{font-family:'Inter'; text-transform:none; font-size:15px; font-weight:700;}
.coach p{font-size:12.5px; color:var(--grey); margin-top:3px;}
@media(max-width:900px){.coach-grid{grid-template-columns:repeat(2,1fr);}}

/* GALLERY + TESTIMONIAL */
.split{display:grid; grid-template-columns:1.3fr 1fr; gap:0;}
.gallery-pane{padding:70px 40px 70px 24px;}
.gallery-top{display:flex; justify-content:space-between; align-items:center; margin-bottom:22px;}
.gallery-top h3{font-size:22px;}
.gallery-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:10px;}
.gallery-grid div, .gallery-grid a{aspect-ratio:1/1; border-radius:3px; background:linear-gradient(145deg,#dfe4ea,#c7cdd6); overflow:hidden; display:block;}
.gallery-grid img{width:100%; height:100%; object-fit:cover;}
.testi-pane{background:var(--blue-panel); color:#fff; padding:70px 40px;}
.testi-eyebrow{color:#ffb199; font-weight:700; font-size:12.5px; letter-spacing:1.5px; text-transform:uppercase; margin-bottom:8px; display:block;}
.testi-pane h3{font-size:22px; margin-bottom:24px;}
.testi-card{background:rgba(255,255,255,.08); border-radius:4px; padding:24px; font-size:14.5px; line-height:1.6; display:none;}
.testi-card.active{display:block;}
.testi-card b{display:block; margin-top:16px; font-weight:600; font-size:13.5px; color:#cfe0f5;}
.dots{display:flex; gap:6px; margin-top:22px;}
.dots span{width:6px; height:6px; border-radius:50%; background:rgba(255,255,255,.35); cursor:pointer;}
.dots span.active{background:#fff;}
@media(max-width:900px){.split{grid-template-columns:1fr;}}

/* NEWS */
.news-top{display:flex; justify-content:space-between; align-items:flex-end; margin-bottom:36px;}
.news-top h2{font-size:30px; margin-top:6px;}
.news-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:22px;}
.news-card{border:1px solid var(--line);}
.news-photo{height:170px; background:linear-gradient(135deg,#233649,#0d1b2a); position:relative; overflow:hidden;}
.news-photo img{width:100%; height:100%; object-fit:cover; position:absolute; inset:0;}
.news-date{position:absolute; left:14px; bottom:-14px; background:#fff; border:1px solid var(--line); font-size:11.5px; font-weight:600; padding:5px 10px; color:var(--navy); z-index:2;}
.news-body{padding:26px 18px 18px;}
.news-body h4{font-family:'Inter'; text-transform:none; font-size:15.5px; font-weight:700; margin-bottom:8px; line-height:1.35;}
.news-body p{font-size:13px; color:var(--grey); margin-bottom:14px;}
@media(max-width:900px){.news-grid{grid-template-columns:1fr;}}

/* CONTACT / MAP */
.contact{background:var(--blue-panel); color:#fff;}
.contact-grid{display:grid; grid-template-columns:1fr 1fr;}
.contact-form{padding:70px 24px 70px 24px;}
.contact-form h3{font-size:26px; line-height:1.25; margin:10px 0 26px; max-width:360px;}
.form-row{display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-bottom:14px;}
.form-row input, .form-row select{width:100%; padding:13px 14px; border:none; border-radius:2px; font-size:13.5px; font-family:'Inter';}
.form-note{font-size:12px; color:#c7d3e3; margin-top:14px;}
.form-msg{font-size:13px; margin-top:12px; padding:10px 12px; border-radius:2px;}
.form-msg.ok{background:rgba(60,180,100,.2); color:#c8f5d8;}
.form-msg.err{background:rgba(224,38,31,.25); color:#ffd7d5;}
.map-pane{background:#1b2a3d; position:relative; min-height:420px; padding:70px 24px; display:flex; flex-direction:column; gap:16px; justify-content:center;}
.map-card{background:#fff; color:var(--ink); border-radius:3px; padding:14px 18px; display:flex; justify-content:space-between; gap:20px; align-items:center; max-width:420px;}
.map-card b{display:block; font-size:14px; margin-bottom:3px;}
.map-card small{color:var(--grey); font-size:12px;}
.map-card .hours{text-align:right; font-size:12px; color:var(--grey); white-space:nowrap;}
@media(max-width:900px){.contact-grid{grid-template-columns:1fr;} .form-row{grid-template-columns:1fr;}}

/* FOOTER */
footer#site-footer{background:var(--navy); color:#c3cad3; padding:60px 0 24px;}
.footer-grid{display:grid; grid-template-columns:1.6fr 1fr 1fr 1fr; gap:30px; padding-bottom:40px;}
.footer-logo{color:#fff; font-family:'Oswald'; font-weight:700; font-size:19px; text-transform:uppercase; margin-bottom:14px;}
.footer-logo span{display:block; color:var(--red); font-size:11px; letter-spacing:1px;}
.footer-grid h5{color:#fff; font-size:13px; letter-spacing:.5px; margin-bottom:16px; text-transform:uppercase;}
.footer-grid ul{list-style:none;}
.footer-grid li{margin-bottom:10px; font-size:13.5px;}
.footer-socials{display:flex; gap:10px; margin-top:18px;}
.footer-socials a{width:32px; height:32px; border:1px solid rgba(255,255,255,.2); border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:13px;}
.footer-bottom{border-top:1px solid rgba(255,255,255,.1); padding-top:20px; display:flex; justify-content:space-between; font-size:12.5px; color:#7c8a9a; flex-wrap:wrap; gap:8px;}
@media(max-width:900px){.footer-grid{grid-template-columns:1fr 1fr;}}

/* SINGLE NEWS / PAGE CONTENT */
.single-news{padding:60px 0 90px;}
.single-news .single-photo{height:360px; border-radius:4px; overflow:hidden; margin-bottom:30px; background:linear-gradient(135deg,#233649,#0d1b2a);}
.single-news .single-photo img{width:100%; height:100%; object-fit:cover;}
.single-news .single-date{color:var(--red); font-weight:700; font-size:13px; text-transform:uppercase; letter-spacing:1px; margin-bottom:10px; display:block;}
.single-news h1{font-size:34px; margin-bottom:24px; text-transform:none;}
.single-news .single-content{font-size:15.5px; line-height:1.8; color:var(--ink);}
.single-news .single-content p{margin-bottom:18px;}
.single-news .back-link{display:inline-block; margin-bottom:30px; color:var(--grey); font-size:13.5px;}
.single-news .back-link:hover{color:var(--red);}

/* ===== ANIMATIONS ===== */
@media (prefers-reduced-motion: reduce){
  *{animation:none !important; transition:none !important;}
}

.hero-numbers div{opacity:0; transform:translateX(-10px); animation:heroSlideIn .6s ease forwards;}
.hero-numbers div:nth-child(1){animation-delay:.15s;}
.hero-numbers div:nth-child(2){animation-delay:.28s;}
.hero-numbers div:nth-child(3){animation-delay:.41s;}
@keyframes heroSlideIn{to{opacity:1; transform:translateX(0);}}

.hero h1{opacity:0; transform:translateY(18px); animation:heroUp .7s cubic-bezier(.2,.8,.2,1) forwards; animation-delay:.1s;}
.hero p{opacity:0; transform:translateY(18px); animation:heroUp .7s cubic-bezier(.2,.8,.2,1) forwards; animation-delay:.28s;}
.hero-ctas{opacity:0; transform:translateY(18px); animation:heroUp .7s cubic-bezier(.2,.8,.2,1) forwards; animation-delay:.42s;}
.hero-visual{opacity:0; transform:scale(.94); animation:heroScale .8s cubic-bezier(.2,.8,.2,1) forwards; animation-delay:.3s;}
@keyframes heroUp{to{opacity:1; transform:translateY(0);}}
@keyframes heroScale{to{opacity:1; transform:scale(1);}}

.hero-visual svg{animation:floatKick 4.5s ease-in-out infinite; animation-delay:1.2s;}
@keyframes floatKick{0%,100%{transform:translateY(0) rotate(0deg);}50%{transform:translateY(-8px) rotate(-2deg);}}

.scrolldown{animation:bob 2s ease-in-out infinite;}
@keyframes bob{0%,100%{transform:translateY(0);}50%{transform:translateY(5px);}}

.reveal{opacity:0; transform:translateY(28px); transition:opacity .7s cubic-bezier(.2,.8,.2,1), transform .7s cubic-bezier(.2,.8,.2,1);}
.reveal.in-view{opacity:1; transform:translateY(0);}
.reveal-stagger .r-item{opacity:0; transform:translateY(24px); transition:opacity .6s cubic-bezier(.2,.8,.2,1), transform .6s cubic-bezier(.2,.8,.2,1);}
.reveal-stagger.in-view .r-item{opacity:1; transform:translateY(0);}
.reveal-stagger .r-item:nth-child(1){transition-delay:.05s;}
.reveal-stagger .r-item:nth-child(2){transition-delay:.13s;}
.reveal-stagger .r-item:nth-child(3){transition-delay:.21s;}
.reveal-stagger .r-item:nth-child(4){transition-delay:.29s;}
.reveal-stagger .r-item:nth-child(5){transition-delay:.37s;}

.btn-red, .btn-outline{transition:transform .25s ease, background .2s ease, border-color .2s ease;}
.btn-red:hover{transform:translateY(-2px);}
.btn-outline:hover{transform:translateY(-2px);}
.btn-link{position:relative; transition:color .2s ease;}
.btn-link::after{content:""; position:absolute; left:0; bottom:-2px; width:0; height:1px; background:var(--red); transition:width .25s ease;}
.btn-link:hover::after{width:100%;}

.benefit .icon{transition:transform .35s ease;}
.benefit:hover .icon{transform:translateY(-4px) scale(1.08);}

.program-card{transition:transform .3s ease, box-shadow .3s ease;}
.program-card:hover{transform:translateY(-6px); box-shadow:0 16px 30px rgba(13,27,42,.12);}
.program-photo svg{transition:transform .4s ease;}
.program-card:hover .program-photo svg{transform:scale(1.12) rotate(-3deg);}

.coach-photo{transition:transform .35s ease;}
.coach:hover .coach-photo{transform:translateY(-5px);}

.news-card{transition:transform .3s ease, box-shadow .3s ease;}
.news-card:hover{transform:translateY(-6px); box-shadow:0 16px 30px rgba(13,27,42,.1);}

.gallery-grid div, .gallery-grid a{transition:transform .35s ease, filter .35s ease;}
.gallery-grid div:hover, .gallery-grid a:hover{transform:scale(1.04); filter:brightness(1.06);}

.map-card{transition:transform .3s ease, box-shadow .3s ease;}
.map-card:hover{transform:translateX(4px); box-shadow:0 10px 22px rgba(0,0,0,.18);}

.stat .icon{transition:transform .4s ease;}
.stat:hover .icon{transform:rotate(-6deg) scale(1.1);}

.navlinks a{transition:color .2s ease, border-color .2s ease;}
.logo{transition:transform .2s ease;}
.logo:hover{transform:translateY(-1px);}

/* WP core alignment helpers */
.alignwide{max-width:1000px; margin-left:auto; margin-right:auto;}
.alignfull{width:100%;}
.wp-caption, .wp-block-image{margin-bottom:20px;}