/* 米兰体育官网 - GLOBAL EVENT CONTROL 2026 样式表 */
:root{
  --navy:#0a1626;
  --navy-2:#0f2038;
  --carbon:#12181f;
  --ice:#f4f7fb;
  --silver:#b9c2cc;
  --blue:#2f6fed;
  --gold:#d4af37;
  --red:#c0392b;
  --cyan:#22c1c3;
  --line: rgba(185,194,204,0.18);
  --maxw: 1240px;
  --radius: 10px;
  --shadow: 0 12px 30px rgba(4,10,20,0.35);
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  font-family:"PingFang SC","Microsoft YaHei","Segoe UI",sans-serif;
  background:var(--navy);
  color:var(--ice);
  line-height:1.75;
}
img{max-width:100%;display:block;}
a{color:var(--cyan);text-decoration:none;}
a:hover{text-decoration:underline;}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 20px;}
ul{padding-left:1.2em;}

/* Header */
.site-header{
  position:sticky;top:0;z-index:100;
  background:linear-gradient(180deg,rgba(10,22,38,0.98),rgba(10,22,38,0.9));
  border-bottom:1px solid var(--line);
  backdrop-filter:blur(6px);
}
.header-inner{display:flex;align-items:center;justify-content:space-between;padding:10px 20px;max-width:var(--maxw);margin:0 auto;}
.logo-link{display:flex;align-items:center;gap:8px;}
.logo-link img{height:38px;width:auto;}
.main-nav{display:flex;gap:4px;flex-wrap:wrap;}
.main-nav a{
  color:var(--ice);padding:10px 14px;border-radius:6px;font-size:14px;font-weight:500;
  border:1px solid transparent;
}
.main-nav a:hover,.main-nav a[aria-current="page"]{
  background:rgba(47,111,237,0.15);
  border-color:rgba(47,111,237,0.4);
  color:#cfe0ff;
  text-decoration:none;
}
.nav-toggle{display:none;background:none;border:1px solid var(--line);color:var(--ice);padding:8px 12px;border-radius:6px;font-size:20px;cursor:pointer;}

.breadcrumb{font-size:13px;color:var(--silver);padding:10px 20px;max-width:var(--maxw);margin:0 auto;}
.breadcrumb a{color:var(--silver);}
.breadcrumb a:hover{color:var(--cyan);}

/* Hero */
.hero-section{position:relative;padding:50px 0 30px;overflow:hidden;background:radial-gradient(circle at 75% 20%,rgba(47,111,237,0.18),transparent 55%);}
.hero-grid{display:grid;grid-template-columns:1.05fr 0.95fr;gap:30px;align-items:center;}
.hero-tag{display:inline-block;font-size:12px;letter-spacing:2px;color:var(--gold);border:1px solid rgba(212,175,55,0.5);padding:4px 10px;border-radius:20px;margin-bottom:14px;}
.hero-eyebrow{font-family:"Segoe UI",sans-serif;font-size:13px;letter-spacing:3px;color:var(--cyan);margin:0 0 10px;}
.hero-section h1{font-size:clamp(26px,3.6vw,42px);margin:0 0 16px;color:#fff;line-height:1.35;}
.hero-lead{color:var(--silver);font-size:15.5px;max-width:620px;}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:22px;}
.btn{display:inline-block;padding:12px 20px;border-radius:8px;font-size:14px;font-weight:600;border:1px solid transparent;cursor:pointer;}
.btn-primary{background:var(--blue);color:#fff;}
.btn-primary:hover{background:#255ad1;text-decoration:none;}
.btn-gold{background:var(--gold);color:#1a1300;}
.btn-gold:hover{background:#c39d2c;text-decoration:none;}
.btn-outline{background:transparent;color:var(--ice);border-color:var(--line);}
.btn-outline:hover{border-color:var(--cyan);color:var(--cyan);text-decoration:none;}
.hero-media{position:relative;}
.hero-media img{border-radius:14px;box-shadow:var(--shadow);border:1px solid var(--line);}

/* Section framing */
.section{padding:46px 0;border-top:1px solid var(--line);}
.section-head{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;flex-wrap:wrap;margin-bottom:24px;}
.section-eyebrow{font-size:12px;letter-spacing:3px;color:var(--gold);margin:0 0 6px;text-transform:uppercase;}
.section h2{font-size:24px;margin:0;color:#fff;}
.section-desc{color:var(--silver);font-size:14px;max-width:560px;}

/* Event Pulse timeline */
.pulse-track{display:flex;overflow-x:auto;gap:0;padding:10px 0 20px;position:relative;}
.pulse-track::before{content:"";position:absolute;top:38px;left:0;right:0;height:2px;background:linear-gradient(90deg,var(--blue),var(--gold),var(--red));opacity:0.5;}
.pulse-node{flex:0 0 220px;padding:0 16px;position:relative;}
.pulse-dot{width:14px;height:14px;border-radius:50%;background:var(--gold);border:3px solid var(--navy);margin-bottom:10px;position:relative;z-index:2;}
.pulse-month{font-size:12px;color:var(--cyan);letter-spacing:2px;}
.pulse-card{background:var(--navy-2);border:1px solid var(--line);border-radius:var(--radius);padding:14px;margin-top:8px;}
.pulse-card h3{margin:4px 0;font-size:15px;color:#fff;}
.pulse-card .meta{font-size:12px;color:var(--silver);}
.status-tag{display:inline-block;font-size:11px;padding:3px 8px;border-radius:12px;margin:6px 0;font-weight:600;}
.status-done{background:rgba(192,57,43,0.18);color:#ff8b7c;}
.status-live{background:rgba(34,193,195,0.18);color:#7cf0f2;}
.status-upcoming{background:rgba(212,175,55,0.18);color:var(--gold);}
.status-champion{background:rgba(212,175,55,0.22);color:var(--gold);}

/* Championship wall - asymmetric */
.champ-wall{display:grid;grid-template-columns:1.6fr 1fr;gap:18px;}
.champ-feature{grid-row:span 2;background:var(--navy-2);border:1px solid var(--line);border-radius:14px;overflow:hidden;box-shadow:var(--shadow);}
.champ-feature img{border-radius:0;}
.champ-feature .pad{padding:18px;}
.champ-col{display:flex;flex-direction:column;gap:18px;}
.champ-mini{background:var(--navy-2);border:1px solid var(--line);border-radius:12px;overflow:hidden;}
.champ-mini .pad{padding:14px;}
.champ-wide{grid-column:1 / -1;display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:18px;}
.champ-row{display:flex;gap:14px;background:var(--navy-2);border:1px solid var(--line);border-radius:12px;padding:14px;align-items:center;}
.champ-row img{width:120px;height:80px;object-fit:cover;border-radius:8px;flex-shrink:0;}
.card-title{color:#fff;font-size:15px;margin:6px 0;}
.card-excerpt{font-size:13px;color:var(--silver);}
.tag-row{display:flex;gap:6px;flex-wrap:wrap;margin:8px 0;}
.tag{font-size:11px;background:rgba(47,111,237,0.15);color:#a9c4ff;padding:2px 8px;border-radius:10px;}

/* Status board */
.status-board{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px;}
.status-cell{background:var(--navy-2);border:1px solid var(--line);border-radius:12px;padding:16px;}
.status-cell h3{margin:0 0 8px;font-size:15px;color:#fff;}
.status-cell .date{font-size:12px;color:var(--silver);}

/* Calendar */
.calendar-track{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;}
.calendar-month{background:var(--navy-2);border:1px solid var(--line);border-radius:12px;padding:14px;}
.calendar-month h3{margin:0 0 10px;color:var(--gold);font-size:14px;letter-spacing:2px;}
.calendar-month ul{list-style:none;padding:0;margin:0;font-size:13px;color:var(--silver);}
.calendar-month li{padding:6px 0;border-top:1px dashed var(--line);}
.calendar-month li:first-child{border-top:none;}

/* Knowledge grid */
.knowledge-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px;}
.knowledge-card{background:var(--navy-2);border:1px solid var(--line);border-radius:12px;padding:16px;}
.knowledge-card h3{margin:0 0 8px;font-size:15px;color:var(--cyan);}
.knowledge-card p{font-size:13.5px;color:var(--silver);margin:0;}

/* Article grid generic */
.article-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:18px;}
.article-card{background:var(--navy-2);border:1px solid var(--line);border-radius:12px;overflow:hidden;display:flex;flex-direction:column;}
.article-card img{width:100%;height:160px;object-fit:cover;}
.article-card .pad{padding:14px;flex:1;display:flex;flex-direction:column;}
.article-meta{font-size:11.5px;color:var(--silver);margin:6px 0;}
.article-card h3{font-size:15px;margin:0 0 8px;color:#fff;}
.article-card p{font-size:13px;color:var(--silver);flex:1;}
.card-actions{display:flex;gap:8px;margin-top:10px;flex-wrap:wrap;}
.mini-btn{font-size:12px;padding:6px 10px;border-radius:6px;border:1px solid var(--line);background:transparent;color:var(--ice);cursor:pointer;}
.mini-btn:hover{border-color:var(--cyan);color:var(--cyan);}
.mini-btn[aria-pressed="true"]{background:rgba(212,175,55,0.2);border-color:var(--gold);color:var(--gold);}

/* App flow */
.flow-steps{display:flex;flex-wrap:wrap;gap:12px;margin-top:20px;}
.flow-step{flex:1 1 150px;background:var(--navy-2);border:1px solid var(--line);border-radius:10px;padding:12px;text-align:center;font-size:13px;}
.flow-step b{display:block;color:var(--gold);font-size:20px;margin-bottom:4px;}

/* Company info table */
.info-table{width:100%;border-collapse:collapse;margin:16px 0;font-size:14px;}
.info-table th,.info-table td{border:1px solid var(--line);padding:10px 14px;text-align:left;}
.info-table th{background:var(--navy-2);color:var(--gold);width:220px;}

/* Timeline list (history / company updates) */
.history-list{list-style:none;padding:0;margin:0;position:relative;}
.history-list li{padding:12px 0 12px 24px;border-left:2px solid var(--line);position:relative;margin-left:6px;}
.history-list li::before{content:"";position:absolute;left:-7px;top:16px;width:12px;height:12px;border-radius:50%;background:var(--gold);}
.history-list h3{margin:0 0 4px;font-size:14.5px;color:#fff;}
.history-list .date{font-size:12px;color:var(--silver);}

/* FAQ */
.faq-item{border:1px solid var(--line);border-radius:10px;margin-bottom:10px;background:var(--navy-2);overflow:hidden;}
.faq-q{width:100%;text-align:left;background:none;border:none;color:var(--ice);padding:14px 16px;font-size:14.5px;font-weight:600;cursor:pointer;display:flex;justify-content:space-between;align-items:center;}
.faq-q::after{content:"+";font-size:20px;color:var(--gold);}
.faq-item.open .faq-q::after{content:"−";}
.faq-a{max-height:0;overflow:hidden;padding:0 16px;font-size:13.5px;color:var(--silver);transition:max-height 0.25s ease, padding 0.25s ease;}
.faq-item.open .faq-a{max-height:400px;padding:0 16px 16px;}

/* Filters */
.filter-bar{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:20px;}
.filter-btn{font-size:13px;padding:8px 14px;border-radius:20px;border:1px solid var(--line);background:transparent;color:var(--ice);cursor:pointer;}
.filter-btn[aria-pressed="true"]{background:var(--blue);border-color:var(--blue);color:#fff;}

/* Big status table (events.html) */
.event-board-table{width:100%;border-collapse:collapse;font-size:13.5px;}
.event-board-table th,.event-board-table td{border:1px solid var(--line);padding:10px 12px;text-align:left;vertical-align:top;}
.event-board-table th{background:var(--navy-2);color:var(--gold);font-size:12.5px;}
.event-board-table tr:hover td{background:rgba(47,111,237,0.06);}
.table-scroll{overflow-x:auto;}

/* Next events board */
.next-events{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px;}
.next-event-card{background:var(--navy-2);border:1px solid var(--line);border-radius:10px;padding:14px;}
.next-event-card h3{margin:0 0 6px;font-size:14.5px;color:var(--cyan);}

/* AI assistant */
.ai-box{background:var(--navy-2);border:1px solid var(--line);border-radius:14px;padding:20px;}
.ai-log{background:rgba(0,0,0,0.25);border-radius:10px;padding:14px;min-height:140px;max-height:340px;overflow-y:auto;font-size:13.5px;margin-bottom:14px;}
.ai-log .q{color:var(--cyan);margin:8px 0 2px;}
.ai-log .a{color:var(--silver);margin:0 0 8px;padding-left:10px;border-left:2px solid var(--line);}
.ai-suggest{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:12px;}
.ai-suggest button{font-size:12.5px;padding:6px 10px;border-radius:14px;background:rgba(34,193,195,0.12);border:1px solid rgba(34,193,195,0.4);color:var(--cyan);cursor:pointer;}
.ai-input-row{display:flex;gap:8px;}
.ai-input-row input{flex:1;padding:10px 12px;border-radius:8px;border:1px solid var(--line);background:var(--navy);color:var(--ice);}
.ai-note{font-size:12px;color:var(--silver);margin-top:10px;}

/* Forms */
.register-demo,.device-form{background:var(--navy-2);border:1px solid var(--line);border-radius:12px;padding:20px;max-width:520px;}
.register-demo label,.device-form label{display:block;margin-bottom:14px;font-size:13.5px;color:var(--silver);}
.register-demo input,.device-form input{width:100%;margin-top:6px;padding:10px 12px;border-radius:8px;border:1px solid var(--line);background:var(--navy);color:var(--ice);}

/* Steps (download.html) */
.step-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px;}
.step-card{background:var(--navy-2);border:1px solid var(--line);border-radius:12px;padding:16px;position:relative;}
.step-num{font-size:12px;color:var(--gold);letter-spacing:2px;}
.step-card h3{margin:6px 0;font-size:15px;color:#fff;}
.step-card p{font-size:13px;color:var(--silver);margin:0;}

/* Notice boxes */
.notice{border:1px solid rgba(212,175,55,0.4);background:rgba(212,175,55,0.08);border-radius:10px;padding:14px 16px;font-size:13.5px;color:#f1e4b8;margin:16px 0;}
.notice-red{border-color:rgba(192,57,43,0.5);background:rgba(192,57,43,0.1);color:#ffb8ad;}
.notice-blue{border-color:rgba(47,111,237,0.5);background:rgba(47,111,237,0.08);color:#cfe0ff;}

/* Footer */
.site-footer{background:var(--carbon);border-top:1px solid var(--line);padding:40px 0 20px;margin-top:40px;}
.footer-grid{display:grid;grid-template-columns:1.4fr repeat(3,1fr);gap:24px;}
.footer-grid h4{color:#fff;font-size:14px;margin:0 0 10px;}
.footer-grid ul{list-style:none;padding:0;margin:0;}
.footer-grid li{margin-bottom:8px;font-size:13px;}
.footer-grid a{color:var(--silver);}
.footer-grid a:hover{color:var(--cyan);}
.footer-info p{font-size:13px;color:var(--silver);margin:4px 0;}
.footer-bottom{text-align:center;font-size:12px;color:var(--silver);margin-top:30px;padding-top:16px;border-top:1px solid var(--line);}

/* Back to top */
#backToTop{position:fixed;right:20px;bottom:24px;width:44px;height:44px;border-radius:50%;background:var(--blue);color:#fff;border:none;font-size:18px;cursor:pointer;box-shadow:var(--shadow);display:none;z-index:200;}
#backToTop.show{display:block;}

/* Responsive */
@media (max-width:920px){
  .hero-grid{grid-template-columns:1fr;}
  .champ-wall{grid-template-columns:1fr;}
  .champ-feature{grid-row:auto;}
  .champ-wide{grid-template-columns:1fr;}
  .footer-grid{grid-template-columns:1fr 1fr;}
  .calendar-track{grid-template-columns:1fr 1fr;}
}
@media (max-width:720px){
  .nav-toggle{display:block;}
  .main-nav{display:none;width:100%;flex-direction:column;padding:10px 0;}
  .main-nav.open{display:flex;}
  .header-inner{flex-wrap:wrap;}
  .calendar-track{grid-template-columns:1fr;}
  .footer-grid{grid-template-columns:1fr;}
}