*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Arial,Helvetica,sans-serif;background:#111217;color:#f4f0e8;line-height:1.6}
a{color:inherit}
.site-header{position:sticky;top:0;z-index:50;background:rgba(17,18,23,.97);border-bottom:1px solid #3a3326}
.nav{max-width:1180px;margin:auto;display:flex;align-items:center;gap:14px;padding:12px 18px;flex-wrap:wrap}
.brand{font-family:Georgia,serif;font-weight:700;letter-spacing:.05em;color:#e1bd6c;text-decoration:none;margin-right:auto}
.nav a{text-decoration:none}
.nav-link,.lang{min-height:40px;display:flex;align-items:center;justify-content:center;padding:7px 10px;border-radius:7px}
.nav-link:hover,.nav-link:focus-visible,.lang:hover,.lang:focus-visible{background:#2b2d35;outline:none}
.lang{border:1px solid #caa95d;color:#e1bd6c}
.section{padding:54px 20px;scroll-margin-top:92px}
.section.alt{background:#17191f}
.wrap{max-width:1180px;margin:auto}
.section h2{font-family:Georgia,serif;font-size:clamp(1.8rem,4vw,2.35rem);margin:0 0 14px;color:#f3dfab}
.lead{max-width:820px;color:#d4d0c8}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:28px}
.card{background:#1d2027;border:1px solid #39342b;border-radius:12px;padding:24px}
.card h3{color:#e4c575;margin-top:0}
.card-link{display:block;text-decoration:none;color:inherit;cursor:pointer;transition:transform .15s ease,border-color .15s ease,background .15s ease}
.card-link:hover,.card-link:focus-visible{transform:translateY(-2px);border-color:#d6b66a;background:#23262e;outline:none}
.card-link:focus-visible{box-shadow:0 0 0 2px #d6b66a}
.actions{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-top:24px}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:11px 20px;border:1px solid #d6b66a;border-radius:8px;text-decoration:none;font-weight:700;color:#17140e;background:#d6b66a;cursor:pointer;font:inherit;transition:background .15s ease,color .15s ease,border-color .15s ease,transform .15s ease}
.btn:hover,.btn:focus-visible{background:#f1dda6;color:#17140e;border-color:#f1dda6;outline:none;transform:translateY(-1px)}
.footer{padding:30px 20px;border-top:1px solid #342f27;text-align:center;color:#aaa}
.form{max-width:820px;display:grid;gap:14px;margin-top:24px}
.form label{font-weight:700;color:#e8d69f}
.form input,.form select,.form textarea{width:100%;padding:12px 14px;border-radius:8px;border:1px solid #56504a;background:#111318;color:#fff;font:inherit}
.form textarea{min-height:150px;resize:vertical}
.notice{padding:14px 16px;border-radius:8px;background:#20242c;border:1px solid #4d473c;margin-bottom:20px}
.privacy{font-size:.9rem;color:#aaa}
.studio-background{width:100%;background:#0d0e12;overflow:hidden}
.studio-background img{display:block;width:100%;height:auto;margin:0 auto}
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}

/* Player */
.player-shell{margin-top:28px;padding:22px;background:#0d0e12;border:1px solid #423b2d;border-radius:14px}
.player-layout{display:grid;grid-template-columns:minmax(300px,430px) minmax(0,1fr);gap:18px;align-items:start}
.player-main{min-width:0}
.gramophone{position:relative;max-width:440px;margin:0 auto}
.gramophone #panel{width:100%;display:block}
.gramophone #cover{position:absolute;width:42%;left:47%;top:41%;transform:translate(-50%,-50%);border-radius:50%;transform-origin:center}
.gramophone #cover.playing{animation:spin 12s linear infinite}
@keyframes spin{from{transform:translate(-50%,-50%) rotate(0deg)}to{transform:translate(-50%,-50%) rotate(360deg)}}
.panelButton{position:absolute;width:6.6%;aspect-ratio:1;border-radius:50%;cursor:pointer;background:transparent;border:0}
.panelPlay{left:3.6%;top:83.1%}.panelPause{left:11.2%;top:83.1%}.panelStop{left:18.6%;top:83.1%}.panelPrev{left:26.1%;top:83.1%}.panelNext{left:33.5%;top:83.1%}
.mobile-player-controls{display:none;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px;margin:12px auto 0;max-width:520px}
.mobile-player-controls button{min-width:0;padding:12px 4px;border:1px solid #d6b66a;border-radius:7px;background:#d6b66a;color:#17140e;font-weight:800;cursor:pointer}
.mobile-player-controls button:hover,.mobile-player-controls button:focus-visible{background:#f1dda6;border-color:#f1dda6;outline:none}
.progress{display:flex;gap:10px;align-items:center;margin:16px auto 0;max-width:440px}
.progressBar{height:9px;flex:1;background:#444;border-radius:6px;overflow:hidden;cursor:pointer}
.progressFill{height:100%;width:0;background:#d6b66a}
.track-side{min-width:0;width:100%;overflow:hidden}
.track-side img{width:100%;max-width:100%;height:auto;display:block;border-radius:10px;border:1px solid #4a4232}
.track-meta{padding:18px 0 6px}
.track-meta strong{color:#e7c977}
.playlist-box{margin-top:16px;border:1px solid #39342b;border-radius:10px;overflow:hidden}
.playlist-title{padding:10px 12px;background:#17191f;color:#e8d69f;font-weight:800}
.playlist{display:grid;gap:8px;max-height:245px;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;padding:10px}
.track-btn{text-align:left;padding:10px 12px;background:#1b1d23;color:#eee;border:1px solid #444;border-radius:7px;cursor:pointer}
.track-btn:hover,.track-btn:focus-visible,.track-btn.active{border-color:#d6b66a;color:#f3d78f;outline:none}
.player-quick-nav{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-top:24px}
.player-order{margin-top:18px}
.order-success{text-align:center;padding:30px 12px}
.order-success h2{margin-bottom:20px}
.success-actions{display:flex;justify-content:center;gap:14px;align-items:center;flex-wrap:wrap}
.success-separator{display:none}

/* Android / smartphone */
@media(max-width:1200px){
  .section{padding:34px 14px}
  .cards{grid-template-columns:1fr}
  .player-layout{grid-template-columns:1fr;gap:18px}
  .track-side{order:-1}
  .player-shell{padding:12px}
  .mobile-player-controls{display:grid}
  .progress{display:none}
  .nav{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;padding:9px 8px}
  .brand{grid-column:1/-1;width:100%;text-align:center;margin:0;padding:4px 4px}
  .nav-link,.lang{font-size:.91rem;padding:7px 5px;min-height:42px;text-align:center}
  .player-quick-nav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .player-quick-nav .btn{width:100%;padding-left:8px;padding-right:8px;font-size:.88rem}
  .success-actions{display:grid;grid-template-columns:1fr;width:100%;max-width:520px;margin:0 auto}
  .success-actions .btn{width:100%}
  .success-separator{display:block;width:88%;height:1px;margin:2px auto;background:#d6b66a;opacity:.45}
}
@media(max-width:480px){
  .nav{grid-template-columns:repeat(2,minmax(0,1fr))}
  .mobile-player-controls button{font-size:.75rem;padding:11px 2px}
  .player-quick-nav{grid-template-columns:1fr 1fr}
}

/* Android player correction 2026-08-17 */
@media(max-width:1200px){
  .player-shell,
  .player-layout,
  .player-main,
  .track-side,
  .playlist-box,
  .playlist{
    width:100%;
    max-width:100%;
    min-width:0;
  }

  .player-layout{
    display:grid;
    grid-template-columns:1fr;
  }

  .track-side{
    order:-1;
  }

  .mobile-player-controls{
    display:grid !important;
    width:100%;
    max-width:520px;
    margin:12px auto 0;
  }

  .playlist-box{
    display:block !important;
    margin-top:16px;
  }

  .playlist{
    display:grid !important;
    max-height:245px;
    overflow-y:auto;
    overflow-x:hidden;
  }

  .track-btn{
    width:100%;
    white-space:normal;
    overflow-wrap:anywhere;
  }

  .track-meta{
    width:100%;
    overflow-wrap:anywhere;
  }

  .track-side img{
    object-fit:contain;
  }
}


/* AJS BLUEODEON — navigation: one fixed row on desktop */
@media (min-width: 901px){
  .nav{
    max-width:1320px !important;
    display:flex !important;
    flex-wrap:nowrap !important;
    align-items:center !important;
    gap:12px !important;
    padding:12px 18px !important;
  }
  .nav .brand{
    flex:0 0 auto !important;
    white-space:nowrap !important;
  }
  .nav .nav-link{
    flex:0 0 auto !important;
    white-space:nowrap !important;
  }
  .nav .language-switcher{
    flex:0 0 auto !important;
    display:flex !important;
    flex-wrap:nowrap !important;
    align-items:center !important;
    gap:8px !important;
    margin-left:auto !important;
    white-space:nowrap !important;
  }
  .nav .language-switcher .lang{
    flex:0 0 auto !important;
    white-space:nowrap !important;
  }
}


/* AJS BLUEODEON — unified 4-language navigation 2026-08-20 */
@media (min-width: 1201px){
  .nav{
    width:100% !important;
    max-width:1440px !important;
    box-sizing:border-box !important;
    display:flex !important;
    flex-wrap:nowrap !important;
    align-items:center !important;
    gap:8px !important;
    padding:10px 12px !important;
  }
  .nav .brand{
    flex:0 1 auto !important;
    margin-right:6px !important;
    white-space:nowrap !important;
    font-size:.96rem !important;
  }
  .nav .nav-link{
    flex:0 1 auto !important;
    white-space:nowrap !important;
    padding:7px 7px !important;
    font-size:.90rem !important;
  }
  .nav .language-switcher{
    flex:0 0 auto !important;
    display:flex !important;
    flex-wrap:nowrap !important;
    align-items:center !important;
    justify-content:flex-end !important;
    gap:6px !important;
    margin-left:auto !important;
    white-space:nowrap !important;
  }
  .nav .language-switcher .lang{
    flex:0 0 auto !important;
    white-space:nowrap !important;
    padding:7px 8px !important;
    min-width:38px !important;
    box-sizing:border-box !important;
  }
}

@media (max-width: 1200px){
  .nav .language-switcher{
    grid-column:1 / -1 !important;
    width:100% !important;
    box-sizing:border-box !important;
    display:grid !important;
    grid-template-columns:repeat(4,minmax(0,1fr)) !important;
    gap:7px !important;
    margin:0 !important;
  }
  .nav .language-switcher .lang{
    width:100% !important;
    min-width:0 !important;
    box-sizing:border-box !important;
    white-space:nowrap !important;
  }
}

/* AJS BLUEODEON — Android navigation centered 3 / 2 / 2 layout 2026-08-20 */
@media (max-width: 1200px){
  .nav{
    display:grid !important;
    grid-template-columns:repeat(6,minmax(0,1fr)) !important;
    gap:7px !important;
    padding:9px 8px !important;
    align-items:stretch !important;
  }

  .nav > .brand{
    grid-column:1 / -1 !important;
    grid-row:1 !important;
    width:100% !important;
    margin:0 !important;
    text-align:center !important;
    justify-content:center !important;
  }

  /* Row 1: Start/Home | About | Offer */
  .nav > .nav-link:nth-child(2){grid-column:1 / span 2 !important;grid-row:2 !important;}
  .nav > .nav-link:nth-child(3){grid-column:3 / span 2 !important;grid-row:2 !important;}
  .nav > .nav-link:nth-child(4){grid-column:5 / span 2 !important;grid-row:2 !important;}

  /* Row 2: Music | Custom songs — centered on the page axis */
  .nav > .nav-link:nth-child(5){grid-column:2 / span 2 !important;grid-row:3 !important;}
  .nav > .nav-link:nth-child(7){grid-column:4 / span 2 !important;grid-row:3 !important;}

  /* Row 3: How to order | Contact — centered on the page axis */
  .nav > .nav-link:nth-child(6){grid-column:2 / span 2 !important;grid-row:4 !important;}
  .nav > .nav-link:nth-child(8){grid-column:4 / span 2 !important;grid-row:4 !important;}

  .nav > .nav-link{
    width:100% !important;
    min-width:0 !important;
    box-sizing:border-box !important;
    text-align:center !important;
    justify-content:center !important;
  }

  .nav > .language-switcher{
    grid-column:1 / -1 !important;
    grid-row:5 !important;
    width:100% !important;
    margin:0 !important;
    display:grid !important;
    grid-template-columns:repeat(4,minmax(0,1fr)) !important;
    gap:7px !important;
  }
}

/* AJS BLUEODEON — Android only: minimal vertical spacing in navigation */
@media (max-width: 1200px){
  .nav{
    row-gap:0 !important;
    column-gap:7px !important;
    padding-top:2px !important;
    padding-bottom:2px !important;
  }

  .nav > .brand,
  .nav > .nav-link{
    margin-top:0 !important;
    margin-bottom:0 !important;
  }

  .nav > .language-switcher{
    row-gap:0 !important;
    column-gap:7px !important;
    margin-top:0 !important;
    margin-bottom:0 !important;
  }
}

/* AJS BLUEODEON — Android only: centered 5 + 2 navigation layout */
@media (max-width: 1200px){
  .nav{
    display:grid !important;
    grid-template-columns:repeat(10,minmax(0,1fr)) !important;
    row-gap:0 !important;
    column-gap:4px !important;
    padding-top:2px !important;
    padding-bottom:2px !important;
  }

  .nav > .brand{
    grid-column:1 / -1 !important;
    grid-row:1 !important;
    width:100% !important;
    margin:0 !important;
    text-align:center !important;
    justify-content:center !important;
  }

  /* Row 1: Start | About | Offer | Music | Contact */
  .nav > .nav-link:nth-child(2){grid-column:1 / span 2 !important;grid-row:2 !important;}
  .nav > .nav-link:nth-child(3){grid-column:3 / span 2 !important;grid-row:2 !important;}
  .nav > .nav-link:nth-child(4){grid-column:5 / span 2 !important;grid-row:2 !important;}
  .nav > .nav-link:nth-child(5){grid-column:7 / span 2 !important;grid-row:2 !important;}
  .nav > .nav-link:nth-child(8){grid-column:9 / span 2 !important;grid-row:2 !important;}

  /* Row 2: Custom songs | How to order — centered */
  .nav > .nav-link:nth-child(7){grid-column:3 / span 3 !important;grid-row:3 !important;}
  .nav > .nav-link:nth-child(6){grid-column:6 / span 3 !important;grid-row:3 !important;}

  .nav > .nav-link{
    width:100% !important;
    min-width:0 !important;
    box-sizing:border-box !important;
    text-align:center !important;
    justify-content:center !important;
    margin-top:0 !important;
    margin-bottom:0 !important;
    padding-top:4px !important;
    padding-bottom:4px !important;
  }

  .nav > .language-switcher{
    grid-column:1 / -1 !important;
    grid-row:4 !important;
    width:100% !important;
    margin:0 !important;
    display:grid !important;
    grid-template-columns:repeat(4,minmax(0,1fr)) !important;
    row-gap:0 !important;
    column-gap:4px !important;
  }
}

/* AJS BLUEODEON — Android only: centered 4 + 3 navigation layout */
@media (max-width: 1200px){
  .nav{
    display:grid !important;
    grid-template-columns:repeat(30,minmax(0,1fr)) !important;
    row-gap:0 !important;
    column-gap:2px !important;
    padding-top:2px !important;
    padding-bottom:2px !important;
  }

  .nav > .brand{
    grid-column:1 / -1 !important;
    grid-row:1 !important;
    width:100% !important;
    margin:0 !important;
    text-align:center !important;
    justify-content:center !important;
  }

  /* Row 1: Start | About | Offer | Music */
  .nav > .nav-link:nth-child(2){grid-column:3 / span 5 !important;grid-row:2 !important;}
  .nav > .nav-link:nth-child(3){grid-column:8 / span 5 !important;grid-row:2 !important;}
  .nav > .nav-link:nth-child(4){grid-column:13 / span 5 !important;grid-row:2 !important;}
  .nav > .nav-link:nth-child(5){grid-column:18 / span 5 !important;grid-row:2 !important;}

  /* Row 2: Custom songs | How to order | Contact */
  .nav > .nav-link:nth-child(7){grid-column:4 / span 6 !important;grid-row:3 !important;}
  .nav > .nav-link:nth-child(6){grid-column:10 / span 6 !important;grid-row:3 !important;}
  .nav > .nav-link:nth-child(8){grid-column:16 / span 6 !important;grid-row:3 !important;}

  .nav > .nav-link{
    width:100% !important;
    min-width:0 !important;
    box-sizing:border-box !important;
    text-align:center !important;
    justify-content:center !important;
    margin:0 !important;
    padding-top:3px !important;
    padding-bottom:3px !important;
  }

  .nav > .language-switcher{
    grid-column:1 / -1 !important;
    grid-row:4 !important;
    width:100% !important;
    margin:0 !important;
    display:grid !important;
    grid-template-columns:repeat(4,minmax(0,1fr)) !important;
    row-gap:0 !important;
    column-gap:4px !important;
  }
}

/* AJS BLUEODEON — Android only: centered 4 + 3 navigation layout
   Row 1: Start | About | Offer | Contact
   Row 2: Music | Custom songs | How to order */
@media (max-width: 1200px){
  .nav{
    display:grid !important;
    grid-template-columns:repeat(30,minmax(0,1fr)) !important;
    row-gap:0 !important;
    column-gap:2px !important;
    padding-top:2px !important;
    padding-bottom:2px !important;
  }

  .nav > .brand{
    grid-column:1 / -1 !important;
    grid-row:1 !important;
    width:100% !important;
    margin:0 !important;
    text-align:center !important;
    justify-content:center !important;
  }

  /* Row 1: Start | About | Offer | Contact */
  .nav > .nav-link:nth-child(2){grid-column:3 / span 5 !important;grid-row:2 !important;}
  .nav > .nav-link:nth-child(3){grid-column:8 / span 5 !important;grid-row:2 !important;}
  .nav > .nav-link:nth-child(4){grid-column:13 / span 5 !important;grid-row:2 !important;}
  .nav > .nav-link:nth-child(8){grid-column:18 / span 5 !important;grid-row:2 !important;}

  /* Row 2: Music | Custom songs | How to order */
  .nav > .nav-link:nth-child(5){grid-column:4 / span 6 !important;grid-row:3 !important;}
  .nav > .nav-link:nth-child(7){grid-column:10 / span 6 !important;grid-row:3 !important;}
  .nav > .nav-link:nth-child(6){grid-column:16 / span 6 !important;grid-row:3 !important;}

  .nav > .nav-link{
    width:100% !important;
    min-width:0 !important;
    box-sizing:border-box !important;
    text-align:center !important;
    justify-content:center !important;
    margin:0 !important;
    padding-top:3px !important;
    padding-bottom:3px !important;
  }

  .nav > .language-switcher{
    grid-column:1 / -1 !important;
    grid-row:4 !important;
    width:100% !important;
    margin:0 !important;
    display:grid !important;
    grid-template-columns:repeat(4,minmax(0,1fr)) !important;
    row-gap:0 !important;
    column-gap:4px !important;
  }
}

/* AJS BLUEODEON — Android only: move language buttons above the existing navigation.
   No desktop changes. No player/banner/content changes. */
@media (max-width: 1200px){

  .nav > .language-switcher{
    grid-column:1 / -1 !important;
    grid-row:1 !important;
    margin:0 !important;
  }

  .nav > .brand{
    grid-row:2 !important;
  }

  /* Keep the already-approved 4 + 3 navigation layout, only one row lower */
  .nav > .nav-link:nth-child(2){grid-row:3 !important;}
  .nav > .nav-link:nth-child(3){grid-row:3 !important;}
  .nav > .nav-link:nth-child(4){grid-row:3 !important;}
  .nav > .nav-link:nth-child(8){grid-row:3 !important;}

  .nav > .nav-link:nth-child(5){grid-row:4 !important;}
  .nav > .nav-link:nth-child(7){grid-row:4 !important;}
  .nav > .nav-link:nth-child(6){grid-row:4 !important;}
}

/* AJS BLUEODEON — Android only: slightly zoom the top sign/banner without changing Windows layout. */
@media (max-width: 768px){
  .studio-background{
    overflow:hidden !important;
  }

  .studio-background img{
    width:100% !important;
    max-width:none !important;
    height:220px !important;
    object-fit:cover !important;
    object-position:center 34% !important;
    display:block !important;
  }
}

/* AJS BLUEODEON — Android only: hide the brand text under language buttons, keep only the sign in the background. */
@media (max-width: 1200px){
  .nav > .brand{
    display:none !important;
  }

  /* Move the existing navigation rows one level up after hiding the brand line */
  .nav > .nav-link:nth-child(2),
  .nav > .nav-link:nth-child(3),
  .nav > .nav-link:nth-child(4),
  .nav > .nav-link:nth-child(8){
    grid-row:2 !important;
  }

  .nav > .nav-link:nth-child(5),
  .nav > .nav-link:nth-child(7),
  .nav > .nav-link:nth-child(6){
    grid-row:3 !important;
  }
}


/* AJS BLUODEON — Android only: isolated sign, perfectly centered on the page axis.
   Desktop/Windows remains unchanged. */
@media (max-width: 768px){
  .studio-background{
    width:100% !important;
    min-height:0 !important;
    height:auto !important;
    padding:8px 0 !important;
    margin:0 !important;
    background:#0d0e12 url("../Images/Background/ajs-bluodeon-mobile-sign-pl.jpg") center center / contain no-repeat !important;
    overflow:hidden !important;
    aspect-ratio:3 / 1 !important;
  }

  .studio-background img{
    display:none !important;
  }
}

/* AJS BLUODEON — Android only: slightly larger and more open navigation labels. */
@media (max-width: 768px){
  .nav > .nav-link{
    font-size:1rem !important;
    letter-spacing:.015em !important;
    line-height:1.12 !important;
    padding-left:7px !important;
    padding-right:7px !important;
  }
}

/* AJS BLUEODEON — Android only: universal English navigation + wider spacing + one-line local page explanation.
   Desktop/Windows and all other page elements remain unchanged. */
/* Page explanation line — visible on desktop/Windows and Android. */
.mobile-nav-explainer{
  display:block;
  width:100%;
  margin:0;
  padding:10px 14px 11px;
  background:linear-gradient(180deg,#2a1c06 0%,#140f07 100%);
  color:#f7e7b0;
  border-top:1px solid rgba(230,188,92,.34);
  border-bottom:1px solid rgba(230,188,92,.58);
  text-align:center;
  font-size:clamp(1.42rem,2.3vw,1.9rem);
  font-weight:700;
  line-height:1.18;
  letter-spacing:.015em;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  text-shadow:0 1px 2px rgba(0,0,0,.55);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05), 0 2px 8px rgba(0,0,0,.24);
}

@media (max-width: 768px){
  .nav{
    grid-template-columns:repeat(30,minmax(0,1fr)) !important;
    column-gap:1px !important;
    padding-left:8px !important;
    padding-right:8px !important;
  }

  /* Row 1: Home | About | Offer | Contact — use the full phone width */
  .nav > .nav-link:nth-child(2){grid-column:2 / span 6 !important;grid-row:2 !important;}
  .nav > .nav-link:nth-child(3){grid-column:9 / span 6 !important;grid-row:2 !important;}
  .nav > .nav-link:nth-child(4){grid-column:16 / span 6 !important;grid-row:2 !important;}
  .nav > .nav-link:nth-child(8){grid-column:23 / span 6 !important;grid-row:2 !important;}

  /* Row 2: Music | Custom Songs | How to Order — spread across the full phone width */
  .nav > .nav-link:nth-child(5){grid-column:3 / span 6 !important;grid-row:3 !important;}
  .nav > .nav-link:nth-child(7){grid-column:11 / span 9 !important;grid-row:3 !important;}
  .nav > .nav-link:nth-child(6){grid-column:22 / span 7 !important;grid-row:3 !important;}

  .nav > .nav-link{
    font-size:1.05rem !important;
    letter-spacing:.02em !important;
    line-height:1.12 !important;
    padding-left:2px !important;
    padding-right:2px !important;
    white-space:nowrap !important;
  }

  .mobile-nav-explainer{
    display:block;
    width:100%;
    margin:0;
    padding:8px 10px 9px;
    background:linear-gradient(180deg,#2a1c06 0%,#140f07 100%);
    color:#fff0be;
    border-top:1px solid rgba(230,188,92,.34);
    border-bottom:1px solid rgba(230,188,92,.58);
    text-align:center;
    font-size:clamp(1.22rem,5.2vw,1.42rem);
    font-weight:700;
    line-height:1.15;
    letter-spacing:.01em;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
    text-shadow:0 1px 2px rgba(0,0,0,.6);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.05), 0 2px 8px rgba(0,0,0,.24);
  }
}

/* WINDOWS ONLY — music/custom-song pages: five action buttons in one horizontal row. Android unchanged. */
.player-quick-nav-desktop{display:none;}
@media (min-width:1201px){
  #gramophone .player-order,
  #gramofon .player-order{display:none !important;}
  #gramophone .player-quick-nav,
  #gramofon .player-quick-nav{display:none !important;}
  #gramophone .player-quick-nav-desktop,
  #gramofon .player-quick-nav-desktop{
    display:grid !important;
    grid-template-columns:1.65fr 1fr .82fr 1fr 1.65fr;
    gap:12px;
    align-items:stretch;
    width:100%;
    margin-top:24px;
  }
  #gramophone .player-quick-nav-desktop .btn,
  #gramofon .player-quick-nav-desktop .btn{
    width:100%;
    min-width:0;
    padding:11px 10px;
    font-size:clamp(.78rem,.88vw,.99rem);
    font-weight:700;
    letter-spacing:.02em;
    line-height:1.15;
    white-space:nowrap;
    text-align:center;
  }
}

/* WINDOWS ONLY — unified AJS BLUE ODEON sign; Android unchanged. */
@media (min-width:1201px){
  .studio-background{
    min-height:clamp(260px,31vw,470px) !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    background-color:#06070b !important;
    background-image:url('../Images/Background/ajs-blueodeon-windows-sign.jpg') !important;
    background-repeat:no-repeat !important;
    background-position:center center !important;
    background-size:contain !important;
    overflow:hidden !important;
  }
  .studio-background img{
    display:none !important;
  }
}

/* WINDOWS ONLY — centered composition for section headings and introductory texts. Android unchanged. */
@media (min-width:1201px){
  .section > .wrap > h1,
  .section > .wrap > h2{
    width:100%;
    max-width:1180px;
    margin-left:auto;
    margin-right:auto;
    text-align:center;
    line-height:1.18;
  }

  .section > .wrap > .lead,
  .section > .wrap > p.status{
    width:100%;
    max-width:1180px;
    margin-left:auto;
    margin-right:auto;
    text-align:center;
  }

  .section > .wrap > .actions{
    justify-content:center;
  }
}

/* WINDOWS ONLY — section intro text in one line across the full content width */
@media (min-width:1201px){
  .section > .wrap > .lead{
    width:100%;
    max-width:1180px;
    white-space:nowrap;
  }
}

/* AJS BLUE ODEON — localized navigation labels (PL) — desktop */
@media (min-width:1201px){
  .nav > a.nav-link:nth-child(2){font-size:0 !important;}
  .nav > a.nav-link:nth-child(2)::after{content:"Start";font-size:.90rem;line-height:1.2;}
  .nav > a.nav-link:nth-child(3){font-size:0 !important;}
  .nav > a.nav-link:nth-child(3)::after{content:"O studiu";font-size:.90rem;line-height:1.2;}
  .nav > a.nav-link:nth-child(4){font-size:0 !important;}
  .nav > a.nav-link:nth-child(4)::after{content:"Oferta";font-size:.90rem;line-height:1.2;}
  .nav > a.nav-link:nth-child(5){font-size:0 !important;}
  .nav > a.nav-link:nth-child(5)::after{content:"Nasza muzyka";font-size:.90rem;line-height:1.2;}
  .nav > a.nav-link:nth-child(6){font-size:0 !important;}
  .nav > a.nav-link:nth-child(6)::after{content:"Jak zamówić";font-size:.90rem;line-height:1.2;}
  .nav > a.nav-link:nth-child(7){font-size:0 !important;}
  .nav > a.nav-link:nth-child(7)::after{content:"Piosenki na zamówienie";font-size:.90rem;line-height:1.2;}
  .nav > a.nav-link:nth-child(8){font-size:0 !important;}
  .nav > a.nav-link:nth-child(8)::after{content:"Kontakt";font-size:.90rem;line-height:1.2;}
}

/* AJS BLUE ODEON — Windows navigation: slogan left, centered menu, languages right */
@media (min-width:1201px){
  .nav{
    position:relative !important;
    width:100% !important;
    max-width:1440px !important;
    display:flex !important;
    flex-wrap:nowrap !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:0 !important;
    padding:10px 14px !important;
    min-height:62px !important;
  }

  .nav > .brand{
    flex:0 0 auto !important;
    margin:0 !important;
    padding:7px 8px !important;
    white-space:nowrap !important;
    font-size:0 !important;
    line-height:1.2 !important;
    color:#e1bd6c !important;
    z-index:2 !important;
  }
  .nav > .brand::after{
    content:"Muzyka dla Ciebie";
    font-size:1.08rem !important;
    font-family:Georgia,serif !important;
    font-weight:700 !important;
    letter-spacing:.025em !important;
  }

  .nav > .nav-link{
    position:relative !important;
    flex:0 0 auto !important;
    min-height:42px !important;
    padding:7px 8px !important;
    font-size:0 !important;
    line-height:1.15 !important;
    white-space:nowrap !important;
    z-index:2 !important;
  }
  .nav > .nav-link::after{
    font-size:1.12rem !important;
    font-weight:400 !important;
    line-height:1.15 !important;
  }

  .nav > .language-switcher{
    flex:0 0 auto !important;
    margin:0 !important;
    display:flex !important;
    align-items:center !important;
    gap:7px !important;
    white-space:nowrap !important;
    z-index:2 !important;
  }

  /* Center only the seven page links between the slogan and language buttons */
  .nav > .nav-link:nth-child(2){margin-left:auto !important;}
  .nav > .nav-link:nth-child(8){margin-right:auto !important;}

  .nav > .nav-link + .nav-link{
    margin-left:5px !important;
  }
}

/* AJS BLUEODEON — balanced gramophone / slideshow desktop layout.
   The gramophone panel is square; the slideshow/banner is 1900:800 (2.375:1).
   Column widths are calculated so both visual panels have the same height.
   Mobile layout remains unchanged. */
@media (min-width:1201px){
  .section-customsongs-wide > .wrap{
    max-width:1440px !important;
  }

  .section-customsongs-wide .player-layout{
    grid-template-columns:calc((100% - 18px) / 3.375) minmax(0,1fr) !important;
    gap:18px !important;
    align-items:start !important;
  }

  .section-customsongs-wide .player-main{
    width:100% !important;
    max-width:none !important;
  }

  .section-customsongs-wide .gramophone{
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
  }

  .section-customsongs-wide .track-side{
    width:100% !important;
    max-width:none !important;
  }

  .section-customsongs-wide .track-side img{
    width:100% !important;
    max-width:none !important;
    height:auto !important;
  }

  .section-customsongs-wide .slideshow-stage{
    width:100% !important;
    aspect-ratio:19 / 8;
  }

  .section-customsongs-wide .slideshow-stage #banner,
  .section-customsongs-wide .slideshow-stage .slideshow-overlay{
    width:100% !important;
    height:100% !important;
    object-fit:cover !important;
  }

  .section-customsongs-wide .player-shell{
    padding-right:0 !important;
  }
}

/* AJS BLUEODEON — active language indicator only */
html[lang="pl"] .language-switcher .lang-pl{font-weight:900 !important;color:#e8c56a !important;text-shadow:0 0 1px rgba(255,235,170,.35) !important;}

/* AJS form target correction: form links land below sticky navigation. */
#form,#formularz{scroll-margin-top:110px}

/* AJS BLUEODEON — unified desktop balance for Our Music / Nasza Muzyka.
   Gramophone panel and 1900:800 slideshow/banner have exactly the same height.
   The recovered width is given to the slideshow. Mobile remains unchanged. */
@media (min-width:1201px){
  #gramofon > .wrap{
    max-width:1440px !important;
  }
  #gramofon .player-layout{
    grid-template-columns:calc((100% - 18px) / 3.375) minmax(0,1fr) !important;
    gap:18px !important;
    align-items:start !important;
  }
  #gramofon .player-main,
  #gramofon .gramophone,
  #gramofon .track-side{
    width:100% !important;
    max-width:none !important;
  }
  #gramofon .gramophone{
    margin:0 !important;
  }
  #gramofon .track-side img{
    display:block !important;
    width:100% !important;
    max-width:none !important;
    aspect-ratio:19 / 8 !important;
    height:auto !important;
    object-fit:cover !important;
  }
}



/* AJS BLUEODEON - FINAL unified desktop geometry for Our Music / Nasza Muzyka.
   Applies equally to #gramofon (PL) and #gramophone (EN/IT/DE).
   Gramophone is square; right visual is 1900:800; both have equal height.
   Mobile rules are intentionally unchanged. */
@media (min-width:1201px){
  #gramofon > .wrap,
  #gramophone > .wrap{
    max-width:1440px !important;
  }
  #gramofon .player-layout,
  #gramophone .player-layout{
    grid-template-columns:calc((100% - 18px) / 3.375) minmax(0,1fr) !important;
    gap:18px !important;
    align-items:start !important;
  }
  #gramofon .player-main,
  #gramofon .gramophone,
  #gramofon .track-side,
  #gramophone .player-main,
  #gramophone .gramophone,
  #gramophone .track-side{
    width:100% !important;
    max-width:none !important;
  }
  #gramofon .gramophone,
  #gramophone .gramophone{
    margin:0 !important;
  }
  #gramofon .track-side > img,
  #gramophone .track-side > img{
    display:block !important;
    width:100% !important;
    max-width:none !important;
    aspect-ratio:19 / 8 !important;
    height:auto !important;
    object-fit:cover !important;
  }
}

/* AJS BLUEODEON - active page indicator, same as EN/IT/DE */
.nav-link.active-page{
  background:#1492ff !important;
  color:#ffffff !important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.18) !important;
}

/* AJS BLUEODEON — Our Music information layout 2026-09-08.
   Desktop: track information lives under the slideshow.
   Under the gramophone: time progress uses 70% and volume uses 30%.
   Mobile player behavior remains unchanged. */
.transport-row{
  display:grid;
  grid-template-columns:minmax(0,7fr) minmax(120px,3fr);
  gap:12px;
  align-items:center;
  width:100%;
  max-width:100%;
  margin:16px auto 0;
}
.transport-row .progress{
  width:100%;
  max-width:none;
  margin:0;
  min-width:0;
}
.volume-control{
  display:grid;
  grid-template-columns:auto minmax(60px,1fr) auto;
  gap:7px;
  align-items:center;
  min-width:0;
  color:#e8d69f;
  font-size:.72rem;
  font-weight:800;
}
.volumeSlider{
  width:100%;
  min-width:0;
  cursor:pointer;
  accent-color:#d6b66a;
}
.volume-value{
  min-width:34px;
  text-align:right;
  color:#eee;
  font-variant-numeric:tabular-nums;
}
.track-info-under-slideshow{
  width:100%;
  padding:0 4px;
}
.track-info-under-slideshow .track-meta{
  padding:14px 0 2px;
  margin:0;
  text-align:center;
  line-height:1.45;
}
.track-info-under-slideshow .track-meta > div + div{
  margin-top:4px;
}
@media(max-width:1200px){
  .transport-row{display:none !important;}
}
/* AJS DISPLAY FIX 1900x1100 BEGIN */
@media (min-width:1201px){
  .slideshow-stage,
  #gramofon .slideshow-stage,
  #gramophone .slideshow-stage,
  .section-customsongs-wide .slideshow-stage{
    aspect-ratio:19 / 11 !important;
    height:auto !important;
  }
  .slideshow-stage #banner,
  .slideshow-stage .slideshow-overlay,
  #gramofon .track-side .slideshow-stage #banner,
  #gramofon .track-side .slideshow-stage .slideshow-overlay,
  #gramophone .track-side .slideshow-stage #banner,
  #gramophone .track-side .slideshow-stage .slideshow-overlay,
  .section-customsongs-wide .slideshow-stage #banner,
  .section-customsongs-wide .slideshow-stage .slideshow-overlay{
    position:absolute !important;
    inset:0 !important;
    width:100% !important;
    height:100% !important;
    max-width:100% !important;
    aspect-ratio:auto !important;
    object-fit:contain !important;
    box-sizing:border-box !important;
  }
}
@media (max-width:900px){
  #pageTitle{display:none !important;}
}
/* AJS DISPLAY FIX 1900x1100 END */

/* AJS BLUE ODEON — navigation labels from the working language styles */
@media (min-width:1201px){
  html:lang(en) .nav > a.nav-link:nth-child(2)::after{content:"Home";}
  html:lang(en) .nav > a.nav-link:nth-child(3)::after{content:"About";}
  html:lang(en) .nav > a.nav-link:nth-child(4)::after{content:"Offer";}
  html:lang(en) .nav > a.nav-link:nth-child(5)::after{content:"Our Music";}
  html:lang(en) .nav > a.nav-link:nth-child(6)::after{content:"How to Order";}
  html:lang(en) .nav > a.nav-link:nth-child(7)::after{content:"Custom Songs";}
  html:lang(en) .nav > a.nav-link:nth-child(8)::after{content:"Contact";}
  html:lang(pl) .nav > a.nav-link:nth-child(2)::after{content:"Start";}
  html:lang(pl) .nav > a.nav-link:nth-child(3)::after{content:"O studiu";}
  html:lang(pl) .nav > a.nav-link:nth-child(4)::after{content:"Oferta";}
  html:lang(pl) .nav > a.nav-link:nth-child(5)::after{content:"Nasza muzyka";}
  html:lang(pl) .nav > a.nav-link:nth-child(6)::after{content:"Jak zamówić";}
  html:lang(pl) .nav > a.nav-link:nth-child(7)::after{content:"Piosenki na zamówienie";}
  html:lang(pl) .nav > a.nav-link:nth-child(8)::after{content:"Kontakt";}
  html:lang(it) .nav > a.nav-link:nth-child(2)::after{content:"Home";}
  html:lang(it) .nav > a.nav-link:nth-child(3)::after{content:"Chi siamo";}
  html:lang(it) .nav > a.nav-link:nth-child(4)::after{content:"Offerta";}
  html:lang(it) .nav > a.nav-link:nth-child(5)::after{content:"La nostra musica";}
  html:lang(it) .nav > a.nav-link:nth-child(6)::after{content:"Come ordinare";}
  html:lang(it) .nav > a.nav-link:nth-child(7)::after{content:"Canzoni su richiesta";}
  html:lang(it) .nav > a.nav-link:nth-child(8)::after{content:"Contatti";}
  html:lang(de) .nav > a.nav-link:nth-child(2)::after{content:"Start";}
  html:lang(de) .nav > a.nav-link:nth-child(3)::after{content:"Über uns";}
  html:lang(de) .nav > a.nav-link:nth-child(4)::after{content:"Angebot";}
  html:lang(de) .nav > a.nav-link:nth-child(5)::after{content:"Unsere Musik";}
  html:lang(de) .nav > a.nav-link:nth-child(6)::after{content:"So bestellen";}
  html:lang(de) .nav > a.nav-link:nth-child(7)::after{content:"Songs auf Bestellung";}
  html:lang(de) .nav > a.nav-link:nth-child(8)::after{content:"Kontakt";}
}
