
:root{
  --bg:#eef3f8;
  --card:#ffffff;
  --text:#13263f;
  --muted:#64758b;
  --line:#d9e3ef;
  --navy:#031223;
  --navy2:#0a305c;
  --blue:#0b61b8;
  --orange:#ff8a00;
  --orange2:#ffbf6b;
  --shadow:0 18px 44px rgba(14,30,60,.08);
  --shadow-strong:0 24px 54px rgba(14,30,60,.14);
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:var(--bg);color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,sans-serif}
a{text-decoration:none;color:inherit}
img{max-width:100%;display:block}
.container{width:min(1360px,calc(100% - 42px));margin:auto}
.topbar{background:linear-gradient(90deg,#021022,#06203d);color:#d8e4f0}
.topbar .container{display:flex;justify-content:space-between;align-items:center;padding:10px 0;gap:16px}
.topbar .socials{display:flex;gap:10px;flex-wrap:wrap}
.socials a{width:40px;height:40px;border-radius:999px;border:1px solid rgba(255,255,255,.12);display:grid;place-items:center;background:rgba(255,255,255,.04);font-weight:800;transition:transform .2s ease, background .2s ease}
.socials a:hover{transform:translateY(-2px);background:rgba(255,255,255,.1)}
.header{position:sticky;top:0;z-index:60;background:rgba(255,255,255,.94);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.nav{display:grid;grid-template-columns:auto 1fr auto;gap:24px;align-items:center;padding:18px 0}
.brand{display:flex;align-items:center;gap:14px}
.crest{width:60px;height:60px;border-radius:18px;background:linear-gradient(135deg,var(--orange),var(--orange2));display:grid;place-items:center;color:#fff;font:900 28px/1 Montserrat,sans-serif;box-shadow:0 14px 30px rgba(255,138,0,.24)}
.brand-title{font:900 29px/1.05 Montserrat,sans-serif}
.brand-sub{font-size:14px;color:var(--muted);margin-top:4px}
.menu{display:flex;justify-content:center;align-items:center;gap:26px;flex-wrap:wrap}
.menu-item{position:relative;font-weight:800;color:#23364f}
.menu-item>a{display:inline-flex;align-items:center;gap:8px;padding:14px 0;position:relative;transition:color .2s ease}
.menu-item>a::after{content:"";position:absolute;left:0;bottom:4px;width:0;height:3px;border-radius:999px;background:var(--orange);transition:width .2s ease}
.menu-item:hover>a,.menu-item:focus-within>a{color:var(--blue)}
.menu-item:hover>a::after,.menu-item:focus-within>a::after{width:100%}
.menu-item.has-dropdown::before{
  content:"";
  position:absolute;
  left:50%;
  transform:translateX(-50%);
  top:100%;
  width:260px;
  height:20px;
}
.dropdown{
  opacity:0;visibility:hidden;transform:translate(-50%,10px);
  transition:opacity .22s ease, transform .22s ease, visibility .22s ease;
  position:absolute;left:50%;top:calc(100% + 10px);
  min-width:280px;background:#fff;border:1px solid var(--line);border-radius:22px;padding:10px;
  box-shadow:var(--shadow-strong)
}
.has-dropdown:hover .dropdown,
.has-dropdown:focus-within .dropdown,
.dropdown:hover{
  opacity:1;visibility:visible;transform:translate(-50%,0)
}
.dropdown a{
  display:block;padding:14px 14px;border-radius:14px;font-weight:700;color:#31445d;
  transition:transform .16s ease, background .16s ease, color .16s ease
}
.dropdown a:hover{background:#f5f8fc;color:var(--blue);transform:translateX(4px)}
.panel-btn{
  background:linear-gradient(135deg,var(--orange),#ff9d25);color:#fff;padding:16px 24px;border-radius:18px;
  font:900 18px/1 Montserrat,sans-serif;box-shadow:0 18px 30px rgba(255,138,0,.22);transition:transform .2s ease, box-shadow .2s ease
}
.panel-btn:hover{transform:translateY(-2px);box-shadow:0 22px 36px rgba(255,138,0,.28)}
.ticker-wrap{background:#fff;border-bottom:1px solid var(--line)}
.ticker{display:flex;gap:14px;align-items:center;overflow-x:auto;padding:14px 0}
.ticker-label{flex:0 0 auto;padding:14px 22px;min-width:188px;border-radius:999px;background:var(--orange);color:#fff;font:900 20px/1 Montserrat,sans-serif}
.ticker-items{display:flex;gap:14px}
.ticker-items a{
  white-space:nowrap;padding:14px 22px;border-radius:999px;background:#f5f8fb;border:1px solid var(--line);
  color:#314156;font-weight:700;transition:transform .2s ease, box-shadow .2s ease, background .2s ease
}
.ticker-items a:hover{transform:translateY(-2px);box-shadow:var(--shadow);background:#fff}
.hero{background:radial-gradient(circle at top left,#113f78,#081a31 46%,#04101d 100%);color:#fff;overflow:hidden;position:relative}
.hero::after{content:"";position:absolute;right:-100px;bottom:-100px;width:360px;height:360px;background:radial-gradient(circle,rgba(255,166,0,.22),transparent 66%)}
.hero-grid{display:grid;grid-template-columns:1.08fr .92fr;gap:38px;align-items:center;padding:94px 0}
.eyebrow{font:800 14px/1 Montserrat,sans-serif;letter-spacing:.18em;text-transform:uppercase;color:#90c3ff}
.hero h1{font:900 clamp(58px,7vw,98px)/.92 Montserrat,sans-serif;max-width:900px;margin:18px 0 20px}
.hero p{font-size:28px;line-height:1.58;color:#dce8f7;max-width:760px;margin:0}
.hero-actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:30px}
.btn{
  padding:17px 25px;border-radius:18px;font:800 17px/1 Montserrat,sans-serif;
  transition:transform .2s ease, box-shadow .2s ease, background .2s ease
}
.btn:hover{transform:translateY(-2px)}
.btn-primary{background:linear-gradient(135deg,var(--orange),#ffa01f);color:#fff;box-shadow:0 18px 30px rgba(255,138,0,.22)}
.btn-secondary{border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.08);color:#fff}
.card{border-radius:30px;padding:28px;box-shadow:0 20px 48px rgba(0,0,0,.18)}
.card.glass{background:rgba(255,255,255,.96);color:#102030}
.card.dark{background:rgba(6,12,24,.58);border:1px solid rgba(255,255,255,.1);color:#fff}
.card h3{margin:0 0 18px;font:900 34px/1.05 Montserrat,sans-serif}
.match-row{display:grid;gap:4px;padding:16px 0;border-top:1px solid rgba(120,140,160,.18)}
.match-row:first-of-type{padding-top:0;border-top:0}
.match-row strong{font-size:18px}
.match-row span{font-size:24px;font-weight:900;line-height:1.24}
.match-row small{font-size:16px;color:#6b7c91}
.dark small{color:#c8d4e4}
.section{padding:84px 0}
.section.white{background:#fff;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.section-head{display:flex;justify-content:space-between;align-items:end;gap:14px;margin-bottom:30px}
.section h2{font:900 58px/1 Montserrat,sans-serif;margin:10px 0 0}
.more{font-weight:900;color:var(--blue)}
.news-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.news-card{
  background:#fff;border:1px solid var(--line);border-radius:28px;overflow:hidden;box-shadow:var(--shadow);
  transition:transform .22s ease, box-shadow .22s ease
}
.news-card:hover{transform:translateY(-10px);box-shadow:var(--shadow-strong)}
.news-image{
  height:220px;background:linear-gradient(135deg,#134684,#2f9bd0);display:block;position:relative;overflow:hidden
}
.news-image::after{
  content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent,rgba(0,0,0,.12));
  opacity:0;transition:opacity .2s ease
}
.news-card:hover .news-image::after{opacity:1}
.news-image.n2{background:linear-gradient(135deg,#ff8a00,#ffb347)}
.news-image.n3{background:linear-gradient(135deg,#101827,#2563eb)}
.news-image.n4{background:linear-gradient(135deg,#0f766e,#2dd4bf)}
.news-body{padding:24px 24px 28px}
.tag{display:inline-block;padding:8px 14px;border-radius:999px;background:#fff3e7;color:#d46a00;font-size:13px;font-weight:900}
.news-card h3{font:900 31px/1.1 Montserrat,sans-serif;margin:14px 0 10px;transition:color .2s ease}
.news-card:hover h3{color:var(--blue)}
.news-card p{color:var(--muted);font-size:18px;line-height:1.65;margin:0 0 16px}
.read-more{font-weight:900;color:#0d3b72}
.split{display:grid;grid-template-columns:1.05fr .95fr;gap:28px}
.teams-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:24px}
.team-card{
  height:190px;border-radius:26px;background:linear-gradient(135deg,#0a1830,#154f93);padding:22px;display:flex;align-items:end;color:#fff;position:relative;overflow:hidden;box-shadow:0 16px 34px rgba(11,28,58,.15);transition:transform .2s ease, box-shadow .2s ease
}
.team-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-strong)}
.team-card::after{content:"";position:absolute;right:-20px;top:-20px;width:120px;height:120px;background:radial-gradient(circle,rgba(255,255,255,.18),transparent 70%)}
.team-card span{font:900 30px/1 Montserrat,sans-serif;position:relative;z-index:1}
.admin-box{background:#04111f;color:#fff;border-radius:32px;padding:30px;box-shadow:0 20px 50px rgba(0,0,0,.18)}
.admin-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-top:22px}
.admin-grid span{padding:15px 16px;border:1px solid rgba(255,255,255,.08);border-radius:16px;background:rgba(255,255,255,.05);font-weight:800}
.players-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.player-card{background:#fff;border:1px solid var(--line);border-radius:28px;overflow:hidden;box-shadow:var(--shadow);transition:transform .22s ease, box-shadow .22s ease}
.player-card:hover{transform:translateY(-10px);box-shadow:var(--shadow-strong)}
.player-photo{height:280px;background:linear-gradient(135deg,#143e76,#3db5ef)}
.player-photo.p2{background:linear-gradient(135deg,#ff8a00,#ffc46a)}
.player-photo.p3{background:linear-gradient(135deg,#07243f,#0ea5e9)}
.player-photo.p4{background:linear-gradient(135deg,#12483d,#10b981)}
.player-body{padding:22px}
.player-meta{font-size:14px;color:var(--blue);font-weight:900;letter-spacing:.08em;text-transform:uppercase}
.player-card h3{font:900 28px/1.08 Montserrat,sans-serif;margin:10px 0 8px}
.player-card p{margin:0;color:var(--muted);line-height:1.6;font-size:17px}
.cromo-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.cromo-card{
  border-radius:30px;background:linear-gradient(160deg,#04111f,#0b3e78 64%,#ff8a00 150%);
  color:#fff;padding:24px;box-shadow:var(--shadow-strong);overflow:hidden;position:relative
}
.cromo-card::after{content:"";position:absolute;right:-30px;top:-30px;width:140px;height:140px;background:radial-gradient(circle,rgba(255,255,255,.16),transparent 70%)}
.cromo-top{display:flex;justify-content:space-between;align-items:center;font:800 14px/1 Montserrat,sans-serif;letter-spacing:.12em;text-transform:uppercase}
.cromo-photo{height:240px;border-radius:24px;background:linear-gradient(135deg,#1b4d89,#4ac3ff);margin:18px 0}
.cromo-name{font:900 28px/1.05 Montserrat,sans-serif}
.cromo-meta{margin-top:10px;color:#dce8f7}
.footer{background:#021022;color:#dbe5ef;padding:58px 0}
.footer-grid{display:grid;grid-template-columns:1.1fr .8fr .9fr;gap:32px}
.footer h4{font:900 24px/1 Montserrat,sans-serif;color:#fff;margin:0 0 16px}
.footer p,.footer li{font-size:17px;line-height:1.7;color:#b8c7d6}
.footer ul{list-style:none;padding:0;margin:0}

/* admin */
.admin-shell{display:grid;grid-template-columns:320px 1fr;min-height:100vh;background:linear-gradient(180deg,#eef3f8,#e7eef6)}
.admin-side{background:linear-gradient(180deg,#021022,#06254a);color:#fff;padding:28px 22px;position:sticky;top:0;height:100vh}
.admin-brand{display:flex;align-items:center;gap:12px;margin-bottom:28px}
.admin-brand .crest{width:48px;height:48px;border-radius:16px}
.admin-brand h1{font:900 28px/1 Montserrat,sans-serif;margin:0}
.admin-brand p{margin:6px 0 0;color:#b7c7d8}
.admin-nav{display:grid;gap:8px}
.admin-nav a{
  padding:14px 16px;border-radius:16px;color:#d8e4ef;font-weight:800;
  transition:background .18s ease, transform .18s ease
}
.admin-nav a:hover,.admin-nav a.active{background:rgba(255,255,255,.1);color:#fff;transform:translateX(4px)}
.admin-main{padding:30px}
.admin-top{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:24px}
.admin-top h2{font:900 52px/1 Montserrat,sans-serif;margin:0}
.admin-top p{margin:8px 0 0;color:var(--muted);font-size:18px}
.admin-actions{display:flex;gap:12px}
.admin-btn{padding:14px 20px;border-radius:16px;font-weight:900;transition:transform .18s ease}
.admin-btn:hover{transform:translateY(-2px)}
.admin-btn.primary{background:linear-gradient(135deg,var(--orange),#ff9d25);color:#fff}
.admin-btn.ghost{background:#fff;border:1px solid var(--line)}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-bottom:22px}
.stat{background:#fff;border:1px solid var(--line);border-radius:26px;padding:22px;box-shadow:var(--shadow)}
.stat small{display:block;color:var(--muted);font-weight:800;margin-bottom:10px}
.stat strong{font:900 44px/1 Montserrat,sans-serif}
.admin-panels{display:grid;grid-template-columns:1.15fr .85fr;gap:18px}
.panel{background:#fff;border:1px solid var(--line);border-radius:28px;padding:24px;box-shadow:var(--shadow)}
.panel h3{font:900 28px/1.05 Montserrat,sans-serif;margin:0 0 18px}
.table-like{display:grid;gap:12px}
.row{display:grid;grid-template-columns:1.4fr .9fr .7fr auto;gap:12px;align-items:center;padding:14px 16px;border:1px solid var(--line);border-radius:18px;background:#f9fbfd}
.row .muted{color:var(--muted)}
.badge{display:inline-block;padding:8px 12px;border-radius:999px;background:#fff3e7;color:#d46a00;font-weight:900;font-size:12px}
.form-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
.input, .textarea{
  width:100%;padding:16px 18px;border:1px solid var(--line);border-radius:18px;background:#fff;
  font:600 16px/1.4 Inter,sans-serif;color:var(--text)
}
.textarea{min-height:130px;resize:vertical}
.full{grid-column:1/-1}
.icon-link-row{display:grid;grid-template-columns:140px 1fr 1fr;gap:12px}
.help{font-size:14px;color:var(--muted);margin-top:8px}
.save-bar{margin-top:18px;display:flex;gap:12px;align-items:center}
.cromo-admin-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.mini-cromo{border-radius:24px;background:linear-gradient(160deg,#04111f,#0b3e78 64%,#ff8a00 150%);color:#fff;padding:18px;box-shadow:var(--shadow);position:relative;overflow:hidden}
.mini-cromo .season{font:800 13px/1 Montserrat,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:#ffc96a}
.mini-cromo .name{font:900 24px/1.05 Montserrat,sans-serif;margin-top:12px}
.mini-cromo .meta{color:#dce8f7;margin-top:8px}
@media (max-width:1200px){
  .hero-grid,.split,.news-grid,.players-grid,.footer-grid,.admin-panels,.stats,.cromo-grid,.cromo-admin-grid{grid-template-columns:1fr 1fr}
}
@media (max-width:920px){
  .hero-grid,.split,.news-grid,.players-grid,.footer-grid,.admin-panels,.stats,.admin-shell,.cromo-grid,.cromo-admin-grid,.form-grid{grid-template-columns:1fr}
  .admin-side{position:relative;height:auto}
  .nav{grid-template-columns:1fr}
  .menu{justify-content:flex-start}
}
@media (max-width:700px){
  .container{width:min(100% - 24px,1360px)}
  .section h2,.admin-top h2{font-size:38px}
  .hero h1{font-size:46px}
  .hero p{font-size:20px}
  .teams-grid{grid-template-columns:1fr}
  .icon-link-row{grid-template-columns:1fr}
}

:root{
  --green:#157347;
  --green2:#1c8b54;
}
.brand-sub{color:#4d647d}
.menu{gap:20px}
.menu-item>a{padding:12px 0;font-size:16px}
.menu-item>a::after{background:linear-gradient(90deg,var(--orange),var(--green))}
.dropdown{min-width:300px;border-radius:24px}
.dropdown a:hover{background:linear-gradient(90deg,#f6fbf7,#fef6ea);color:var(--green)}
.ticker-label{background:linear-gradient(90deg,var(--orange),#ff9f1a)}
.hero{background:radial-gradient(circle at top left, #155a33, #0a2c54 44%, #04101d 100%)}
.team-card{background:linear-gradient(135deg,#0b5b35,#144d8e)}
.news-image{background:linear-gradient(135deg,#0b5b35,#2f9bd0)}
.news-image.n2{background:linear-gradient(135deg,#ff8a00,#1c8b54)}
.news-image.n3{background:linear-gradient(135deg,#10325a,#157347)}
.news-image.n4{background:linear-gradient(135deg,#ff8a00,#2dd4bf)}
.eyebrow{color:#9bd6b0}
.more{color:var(--green)}
.tag{background:#eef8f0;color:#146c43}
.ad-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:24px}
.ad-box{height:120px;border-radius:24px;background:linear-gradient(135deg,#fff,#f5f8fb);border:1px solid var(--line);box-shadow:var(--shadow);display:flex;align-items:center;justify-content:center;font:800 22px/1 Montserrat,sans-serif;color:#6a7f94}
.ad-box strong{display:block;color:var(--text)}
.two-cols{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.compact-card{background:#fff;border:1px solid var(--line);border-radius:28px;padding:24px;box-shadow:var(--shadow)}
.compact-card h3{margin:0 0 16px;font:900 32px/1.02 Montserrat,sans-serif}
.results-list{display:grid;gap:12px}
.results-item{display:grid;grid-template-columns:130px 1fr auto;gap:12px;align-items:center;padding:14px 16px;border:1px solid var(--line);border-radius:18px;background:#f9fbfd}
.results-item strong{font-size:14px;letter-spacing:.08em;text-transform:uppercase;color:var(--green)}
.results-item span{font-weight:800;color:var(--text)}
.results-item small{color:var(--muted);font-weight:700}
.top-teams{display:grid;grid-template-columns:repeat(7,1fr);gap:12px;margin-top:18px}
.top-teams a{padding:14px 10px;border-radius:18px;background:#fff;border:1px solid var(--line);text-align:center;font:800 16px/1.1 Montserrat,sans-serif;box-shadow:var(--shadow);transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease}
.top-teams a:hover{transform:translateY(-4px);border-color:#b8d5c1;box-shadow:var(--shadow-strong)}
@media (max-width:1200px){
  .ad-strip,.top-teams,.two-cols{grid-template-columns:1fr 1fr}
}
@media (max-width:820px){
  .ad-strip,.top-teams,.two-cols{grid-template-columns:1fr}
}
