/* Malmö Kings · site-wide polish (loaded on every page) */

/* links to a section land below the sticky header */
[id]{scroll-margin-top:96px}

/* back to top */
.mk-totop{position:fixed;right:18px;bottom:18px;z-index:80;display:inline-flex;align-items:center;justify-content:center;width:48px;height:48px;padding:0;border-radius:50%;border:0;background:#1C252E;color:#fff;box-shadow:0 8px 24px rgba(15,23,42,.28);cursor:pointer;transition:transform .15s,background-color .2s,color .2s}
.mk-totop:hover{background:#F2C200;color:#0B0B0F}
.mk-totop:active{transform:scale(.94)}
.mk-totop:focus-visible{outline:2px solid #F2C200;outline-offset:3px}
.mk-totop[hidden]{display:none}
@media print{.mk-totop{display:none}}

/* home FAQ: two parallel columns, no help card, a link to the full FAQ page */
.mk-faqx{grid-template-columns:minmax(0,1fr)!important;gap:28px!important}
.mk-faqx__intro{position:static!important;max-width:760px}
.mk-faqx__lead{margin-bottom:0!important}
.mk-faqx__help{display:none!important}
.mk-faqx .faq{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-flow:column;grid-template-rows:repeat(6,auto);gap:12px 20px;align-items:start;max-width:none;margin:0}
.mk-faqx .faq.mk-faq2{grid-auto-flow:row;grid-template-rows:none}
.mk-faq2__col{display:grid;gap:12px;align-content:start;min-width:0}
.mk-faqx__more{margin:4px 0 0;display:flex;justify-content:center}
@media (max-width:860px){.mk-faqx .faq,.mk-faqx .faq.mk-faq2{grid-template-columns:minmax(0,1fr);grid-auto-flow:row;grid-template-rows:none}}

/* home squad: arrows that cannot be missed, plus a control bar under the cards */
.mk-sq__btn{background:#F2C200!important;border-color:#F2C200!important;color:#0B0B0F!important;box-shadow:0 10px 30px rgba(0,0,0,.5)!important}
.mk-sq__btn:hover{background:#fff!important;border-color:#fff!important}
.mk-sq__bar{display:flex;align-items:center;justify-content:center;gap:16px;margin:22px auto 0;padding:0 24px}
.mk-sq__nav{display:inline-flex;align-items:center;justify-content:center;width:48px;height:48px;padding:0;border-radius:50%;border:1px solid rgba(255,255,255,.24);background:rgba(255,255,255,.08);color:#fff;cursor:pointer;transition:background-color .2s,color .2s,border-color .2s,transform .15s}
.mk-sq__nav:hover{background:#F2C200;border-color:#F2C200;color:#0B0B0F}
.mk-sq__nav:active{transform:scale(.94)}
.mk-sq__nav:focus-visible{outline:2px solid #F2C200;outline-offset:3px}
.mk-sq__hint{font-size:13px;font-weight:600;letter-spacing:.04em;color:rgba(255,255,255,.72)}

/* mobile friendliness */
.guide-cols>*,.home-guide>*{min-width:0}
@media (max-width:900px){.guide-cols,.home-guide{grid-template-columns:minmax(0,1fr)!important}}
@media (max-width:767px){
  input:not([type=checkbox]):not([type=radio]):not([type=range]),select,textarea{font-size:16px!important}
  .footer-links a,.footer-contact a,.footer-addr{display:inline-flex;align-items:center;min-height:36px}
  .utility-links a{display:inline-flex;align-items:center;min-height:30px}
  .btn{white-space:normal;text-align:center}
  /* finger-sized links (at least 24 px, WCAG 2.5.8) */
  .mk-crumbs a,.mk-faq-contact a,.live-ext,.season-more,.mk-prof,.scf-link,a.sc{display:inline-flex;align-items:center;min-height:32px}
  .mk-nl{padding-top:2px;padding-bottom:2px}
  .mk-totop{right:14px;bottom:14px;width:44px;height:44px}
}
@media (max-width:480px){
  .fee-table td,.fee-table th{padding:14px 16px!important}
  .fee-table th{letter-spacing:.04em!important}
}
/* small phones (320 to 374 px): logo, language switch and menu button fit on one row */
@media (max-width:374px){
  .nav-inner{gap:8px!important}
  .brand{gap:8px!important;min-width:0;flex:0 1 auto}
  .brand-mark img{width:42px!important;height:auto!important}
  .brand-name{font-size:13.5px!important;white-space:nowrap}
  .mobile-lang{margin-right:0!important;margin-left:auto}
  .mobile-lang .lang-switch a{padding:6px 6px!important}
  .menu-toggle{flex:0 0 40px!important}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto!important}}

/* "Live" menu item */
.mk-nav-live a{display:inline-flex!important;align-items:center;gap:7px}
.mk-nav-live a i{width:8px;height:8px;border-radius:50%;background:#E11D48;box-shadow:0 0 0 0 rgba(225,29,72,.5);animation:mk-nav-pulse 1.8s ease-out infinite}
#mobile-menu .mk-nav-live a{display:flex!important}
@keyframes mk-nav-pulse{0%{box-shadow:0 0 0 0 rgba(225,29,72,.5)}70%{box-shadow:0 0 0 7px rgba(225,29,72,0)}100%{box-shadow:0 0 0 0 rgba(225,29,72,0)}}
@media (prefers-reduced-motion:reduce){.mk-nav-live a i{animation:none}}

/* player photos: head, shoulders and shirt, never a half-cut face (squad grids and player cards).
   Kept here, not in a page, because the site navigates between pages without reloading them. */
.squad-grid .player-photo{height:auto!important;min-height:0;overflow:hidden;aspect-ratio:20/21}
.mk-pcard__img{height:auto!important;min-height:0;aspect-ratio:20/21}

/* home squad carousel: previous and next sit beside the section title, never on a face;
   on smaller screens the buttons under the cards do the job */
@media (min-width:1100px){
  .mk-sq__btn{top:-107px}
  .mk-sq__btn--prev{left:max(24px,calc(50% - 566px))}
  .mk-sq__btn--next{right:max(24px,calc(50% - 566px))}
}
@media (max-width:1099.98px){.mk-sq__btn{display:none!important}}

/* home "Start here" cards: the whole card opens its page */
main:has(.mk-sq) .grid-3>article.card{position:relative;cursor:pointer;transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}
main:has(.mk-sq) .grid-3>article.card>a:last-child::after{content:"";position:absolute;inset:0;z-index:1}
main:has(.mk-sq) .grid-3>article.card:hover{transform:translateY(-3px);box-shadow:0 16px 32px -14px rgba(15,23,42,.28);border-color:rgba(37,99,235,.45)}
main:has(.mk-sq) .grid-3>article.card:hover>a:last-child{text-decoration:underline;text-underline-offset:3px}
main:has(.mk-sq) .grid-3>article.card:has(>a:last-child:focus-visible){outline:2px solid #2563eb;outline-offset:3px}
main:has(.mk-sq) .grid-3>article.card>a:last-child:focus-visible{outline:none}
@media (prefers-reduced-motion:reduce){main:has(.mk-sq) .grid-3>article.card{transition:none}main:has(.mk-sq) .grid-3>article.card:hover{transform:none}}
