/* Büyük ekran → tablet → küçük ekran. */

/* JS yokken mobil gezinme görünür kalır. */
@media(max-width:1050px){
  html:not(.menu-ready) .header-inner{flex-wrap:wrap;height:auto;min-height:72px;padding-block:16px}
  html:not(.menu-ready) .desktop-nav{display:flex;flex-wrap:wrap;order:3;width:100%;gap:8px 20px}
  html:not(.menu-ready) .menu-toggle{display:none}
}

@media(max-width:1200px){
  .container{width:calc(100% - 72px)}
  .desktop-nav{gap:24px}
  .hero-grid{gap:40px}
  .why-grid,.faq-layout{gap:64px}
  .service-card{padding:28px}
  .service-feature{padding:32px}
  .dist-targets li{font-size:13px;padding-inline:10px 12px}
  .pricing-grid{grid-template-columns:repeat(2,1fr);gap:20px;max-width:840px;margin-inline:auto}
  .price-card.is-featured{margin-block:0;padding-block:40px 32px}
}

@media(max-width:1050px){
  :root{--section-space:96px}
  .desktop-nav,.header-actions{display:none}
  .header-inner{height:72px}
  .menu-toggle{display:flex;align-items:center;justify-content:center;flex-direction:column;gap:6px;border:1px solid #dddbe5;border-radius:10px;background:transparent;width:44px;height:44px}
  .menu-toggle span{display:block;width:18px;height:1.5px;background:var(--ink);transition:transform var(--transition)}
  .menu-toggle[aria-expanded="true"] span:first-child{transform:translateY(3.75px) rotate(45deg)}
  .menu-toggle[aria-expanded="true"] span:last-child{transform:translateY(-3.75px) rotate(-45deg)}
  .mobile-menu{display:block;position:absolute;top:100%;left:0;right:0;background:var(--paper);height:calc(100dvh - 72px);overflow:auto;border-top:1px solid var(--line);padding:24px 0;overscroll-behavior:contain}
  .mobile-menu .container{display:flex;flex-direction:column}
  .mobile-menu a:not(.button){padding:16px 0;font-size:22px;font-weight:600;line-height:1.4;letter-spacing:-.02em;border-bottom:1px solid var(--line)}
  .mobile-menu .button{margin-top:28px;align-self:flex-start}

  .hero-grid{grid-template-columns:1fr;gap:56px;padding-block:64px 88px}
  .hero-copy{max-width:640px}
  .hero-visual{justify-self:center}

  .service-grid{grid-template-columns:1fr 1fr;grid-template-rows:none}
  .service-feature{grid-row:auto;grid-column:span 2;display:grid;grid-template-columns:1fr 1fr;column-gap:40px;align-items:center}
  .service-feature .dist-flow{grid-column:2;grid-row:1/span 2;margin:0}
  .service-feature .text-link{margin-top:24px;justify-self:start}

  .why-grid{grid-template-columns:1fr;gap:40px}
  .why-intro{position:static}

  .steps{grid-template-columns:1fr 1fr;gap:48px 32px}
  .steps li:nth-child(2)::before{display:none}

  .audience-card{padding:32px}
  .catalog i{width:112px;height:112px;margin-left:-48px}
  .catalog i:first-child{margin-left:0}

  .faq-layout{grid-template-columns:1fr;gap:40px}
  .faq-intro{position:static}

  .closing-card{padding:64px 48px}
  .closing-vinyl{width:320px;right:-140px;opacity:.6}

  .footer-grid{gap:40px}
  .footer-grid.has-socials{grid-template-columns:2fr 1fr 1fr}
  .footer-grid.has-socials .social-nav{grid-column:2/-1}
}

@media(max-width:760px){
  :root{--section-space:80px}
  .container{width:calc(100% - 40px)}
  html{scroll-padding-top:88px}
  .brand-mark{width:30px;height:30px}
  .brand-type{font-size:14px}

  .hero-grid{padding-block:48px 72px;gap:48px}
  .hero h1{font-size:clamp(42px,11vw,64px)}
  .hero-description{font-size:17px;margin:22px 0 30px}
  .eyebrow{font-size:11px}
  .hero-visual{max-width:440px;aspect-ratio:1/1.08}

  .platforms{padding:32px 0 24px}
  .platform-title{font-size:12px}
  .marquee-ready .platform-list{gap:40px;padding-inline-end:40px}
  .platform-list li{font-size:16px;gap:10px}
  .platform-list img{width:24px;height:24px}
  .marquee-ready .platform-track{animation-duration:38s}

  .section-heading{display:block;margin-bottom:40px}
  .section-heading>p{font-size:16px;margin-top:20px}

  .service-grid{grid-template-columns:1fr;gap:12px}
  .service-feature{grid-column:auto;display:flex;padding:28px}
  .service-feature .dist-flow{margin:32px 0 8px}
  .service-card{padding:28px}

  .principles article{gap:20px;padding:28px 0}
  .principles h3{font-size:22px}
  .principles p{font-size:15px}

  .steps{grid-template-columns:1fr;gap:0}
  .steps li{padding:0 0 36px 72px;min-height:120px}
  .steps li:last-child{padding-bottom:0;min-height:0}
  .steps li::before,.steps li:nth-child(2)::before{display:block;width:1px;height:auto;left:26px;right:auto;top:60px;bottom:8px}
  .steps li:last-child::before{display:none}
  .step-no{position:absolute;left:0;top:0}
  .steps h3{margin-top:0;padding-top:12px}
  .steps p{max-width:none}

  .pricing-grid{grid-template-columns:1fr;max-width:560px;gap:16px}
  .audience-grid{grid-template-columns:1fr;gap:16px}
  .audience-card{padding:28px}
  .artist-visual,.catalog{height:150px;margin:20px 0}
  .artist-visual .wave{height:80px}
  .artist-visual .play-btn{width:48px;height:48px}

  .faq-item summary{font-size:17px;padding:22px 0}
  .faq-answer{padding-right:16px;font-size:15px}

  .closing-section{padding-bottom:80px}
  .closing-card{padding:48px 28px 180px;border-radius:20px}
  .closing-vinyl{width:260px;top:auto;bottom:-110px;right:-40px;transform:none;opacity:.7}

  .footer-grid{grid-template-columns:1fr 1fr;gap:36px 24px}
  .footer-brand{grid-column:1/-1}
  .footer-grid.has-socials{grid-template-columns:1fr 1fr}
  .footer-grid.has-socials .social-nav{grid-column:auto}
  .footer-bottom{font-size:13px;margin-top:40px}
  .site-footer{padding-top:56px}
}

@media(max-width:480px){
  .hero .button-row .button{flex:1 1 100%}
  .player-card{width:78%;padding:14px 16px}
  .player-card .wave{height:28px;margin:12px 0}
  .player-platforms{gap:8px;padding-top:12px}
  .player-platforms img{width:18px;height:18px}
  .player-platforms span{display:none}
  .cover-mark{width:32px;height:32px}
  .dist-flow{grid-template-columns:48px 1fr auto}
  .dist-source{width:48px;height:48px;border-radius:12px}
  .dist-targets li{height:40px;font-size:13px}
  .catalog i{width:96px;height:96px;margin-left:-40px}
  .audience-card h3{font-size:28px}
  .price-card{padding:32px 24px 24px}
  .price-card.is-featured{padding-block:40px 28px}
  .price-value{font-size:40px}
  .closing-content h2{font-size:32px}
  .footer-bottom{flex-direction:column;align-items:flex-start;gap:8px}
}

@media(prefers-reduced-motion:reduce){
  .marquee-ready .platform-track{width:100%;animation:none;transform:none;will-change:auto}
  .marquee-ready .platform-list{flex-wrap:wrap;justify-content:center;gap:24px 40px;padding:0;width:100%}
  .platform-list-copy{display:none}
  .platform-marquee{mask-image:none}
}
