/* Four chapters in the established Azulweb visual language. */
.nav-links { gap: 22px; }
.nav-links a { font-size: 14px; }
.category-eyebrow { display: flex; align-items: center; gap: 12px; margin-bottom: 22px; font-size: 13px; line-height: 1.5; font-weight: 600; color: var(--gold-ink); letter-spacing: .01em; }
.category-eyebrow>span { width: 32px; height: 32px; border: 1px solid #6cbfea; border-radius: 50%; display: grid; place-items: center; font-size: 11px; font-weight: 650; flex: none; }
.infra-chapter .category-eyebrow { color: #b2dcf3; }
.category-art { perspective: 1100px; }
.category-image { width: 100%; aspect-ratio: 1; position: relative; pointer-events: none; }
.category-image img { width: 100%; height: 100%; display: block; object-fit: contain; animation: category-float 10s ease-in-out infinite; animation-play-state: paused; transform-origin: 50% 60%; }
.scene-active .category-image img { animation-play-state: running; }
@keyframes category-float { 0%,100% { transform: translateY(3px) rotate(-1.5deg); } 50% { transform: translateY(-12px) rotate(1deg); } }
.category-art .category-image { rotate: y var(--art-ry,0deg); transition: rotate 1200ms var(--art-ease); }
.support-art.category-art { min-height: 480px; }
.support-art .category-image { position: absolute; top: -15px; left: -24px; width: calc(100% + 48px); }
.support-art .large-headset, .support-art .support-disc { display: none; }
.support-art .policy-pass { width: 140px; height: 148px; top: auto; bottom: 48px; left: auto; right: 0; }
.support-art .pass-surface { padding: 16px; }
.support-art .pass-surface strong { font-size: 20px; margin-top: 7px; }
.support-art .pass-surface>span { font-size: 13px; }
.support-art .pass-surface svg { width: 26px; height: 26px; }
.support-art .token-tools { left: 12px; right: auto; top: 45px; }
.support-art .art-caption { bottom: 0; }
.category-notes { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 38px; padding-top: 36px; margin-top: 45px; border-top: 1px solid #c8c4b980; }
.category-notes svg { width: 26px; height: 26px; color: var(--gold-ink); margin-bottom: 12px; }
.category-notes h3 { font-size: 18px; line-height: 1.3; font-weight: 640; letter-spacing: -.025em; margin: 0 0 10px; }
.category-notes p { font-size: 15px; line-height: 1.6; color: var(--muted); max-width: 32ch; }
.infra-chapter .category-notes { border-color: #54728a70; }
.infra-chapter .category-notes svg { color: #7fcaf0; }
.infra-chapter .category-notes p { color: #d7e2ec; }
.infra-story { padding-bottom: 350px; }
.infra-sculpture.category-art { width: min(420px,105%); height: 350px; bottom: -10px; left: -12px; }
.infra-sculpture .infra-stack { display: none; }
.infra-sculpture .category-image { height: 100%; }
.infra-sculpture .category-image img { animation-delay: -3s; }
.infra-sculpture .token-cloud { right: 4px; top: 15px; width: 48px; height: 48px; }
.infra-options { padding-top: 55px; }
.category-bridge { max-width: 700px; margin: 36px auto 0; text-align: center; font-size: 18px; line-height: 1.7; color: var(--muted); }
.development-chapter { position: relative; isolation: isolate; padding: 64px; margin-top: 100px; border-radius: 44px; background: #e9f0f6; scroll-margin-top: 128px; }
.development-chapter h2 { font-size: clamp(2.4rem,4.4vw,3.75rem); }
.development-chapter .digital-custom { background: transparent; display: grid; grid-template-columns: 1fr 1fr; gap: 28px; overflow: visible; margin-top: 24px; }
.development-chapter .digital-text { padding: 20px 0 0; }
.development-chapter .digital-text h3 { font-size: 24px; }
.development-chapter .digital-text p { max-width: 44ch; }
.development-examples { padding: 0; margin: 26px 0 0; list-style: none; display: grid; gap: 16px; }
.development-examples li { padding-left: 18px; border-left: 2px solid #35a6e3; }
.development-examples strong { font-size: 16px; font-weight: 620; display: block; }
.development-examples span { display: block; font-size: 15px; color: var(--muted); margin-top: 3px; }
.development-chapter .custom-art { height: 440px; width: 100%; min-width: 0; }
.development-chapter .category-image { position: absolute; width: 112%; height: 100%; top: -28px; left: -6%; }
.development-chapter .category-image img { animation-delay: -5s; }
.development-chapter .token-custom { top: 0; right: 0; }
.development-orbit { position: absolute; inset: auto 0 0; display: flex; gap: 12px; justify-content: center; perspective: 700px; }
.development-orbit span { padding: 11px 15px; border-radius: 16px; background: #fff; color: var(--ink); font-size: 14px; font-weight: 550; border-right: 3px solid #c2d1dc; border-bottom: 4px solid #c9d8e3; animation: orbit-label 9s ease-in-out infinite; animation-play-state: paused; }
.development-orbit span:nth-child(2) { background: #275f8d; color: #fff; border-color: #173d60; animation-delay: -3s; }
.development-orbit span:nth-child(3) { background: #d3eaf8; border-color: #6cbfea; animation-delay: -6s; }
@keyframes orbit-label { 0%,100% { transform: translateY(0) rotateY(-9deg); } 50% { transform: translateY(-10px) rotateY(9deg); } }
.scene-active .development-orbit span { animation-play-state: running; }
.development-path { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 48px; margin-top: 46px; padding-top: 30px; border-top: 1px solid #b4c7d8; }
.development-path>div { position: relative; padding-left: 36px; }
.development-path>div>span { position: absolute; left: 0; top: 3px; color: var(--gold-ink); font-size: 13px; }
.development-path h3 { font-size: 18px; margin: 0 0 8px; letter-spacing: -.02em; }
.development-path p { font-size: 15px; color: var(--muted); }
body.page-idle .category-image img, body.page-idle .development-orbit span, body.swal2-shown .category-image img, body.swal2-shown .development-orbit span { animation-play-state: paused; }
body.motion-off .category-image img, body.motion-off .development-orbit span { animation: none; transform: none; }
@media (max-width:1100px) {
  .nav-links { gap: 14px; }
  .nav { gap: 16px; }
  .nav-cta { padding-inline: 18px; }
  .support-art.category-art { transform: none; min-height: 420px; margin-right: 0; }
  .support-art .category-image { top: 20px; }
  .category-notes { gap: 24px; }
  .infra-sculpture.category-art { height: 315px; }
  .infra-story { padding-bottom: 320px; }
  .development-chapter { padding: 44px; }
  .development-chapter .custom-art { height: 360px; }
  .development-chapter .category-image { top: 0; }
  .development-orbit { gap: 6px; }
  .development-orbit span { padding: 9px 10px; font-size: 12px; }
}
@media (max-width:800px) {
  .category-eyebrow { font-size: 12px; gap: 10px; margin-bottom: 18px; }
  .category-eyebrow>span { width: 28px; height: 28px; font-size: 10px; }
  .support-art.category-art { width: 100%; min-height: 370px; margin-top: 10px; }
  .support-art .category-image { top: -15px; left: -16px; width: calc(100% + 32px); max-height: 340px; }
  .support-art .policy-pass { width: 120px; height: 135px; bottom: 42px; right: 0; }
  .support-art .pass-surface { padding: 12px; }
  .support-art .pass-surface strong { font-size: 18px; }
  .support-art .pass-surface>span { font-size: 12px; }
  .support-art .token-tools { width: 38px; height: 38px; top: 15px; left: 0; }
  .category-notes { grid-template-columns: 1fr; gap: 26px; margin-top: 28px; padding-top: 28px; }
  .category-notes>div { display: grid; grid-template-columns: 28px 1fr; column-gap: 13px; }
  .category-notes svg { grid-row: 1 / 3; width: 24px; margin-top: 1px; }
  .category-notes h3 { font-size: 17px; margin-bottom: 8px; }
  .category-notes p { max-width: none; font-size: 15px; }
  .infra-story { padding-bottom: 300px; }
  .infra-sculpture.category-art { width: calc(100% + 32px); height: 300px; left: -16px; bottom: -10px; }
  .infra-sculpture .token-cloud { top: 15px; right: 12px; width: 38px; height: 38px; }
  .infra-options { padding-top: 0; margin-top: 15px; }
  .category-bridge { margin: 26px 12px 0; font-size: 16px; text-align: left; }
  .development-chapter { padding: 34px 24px; margin-top: 64px; border-radius: 32px; scroll-margin-top: 108px; }
  .development-chapter h2 { font-size: clamp(31px,8.6vw,39px); }
  .development-chapter .digital-custom { display: flex; flex-direction: column; gap: 4px; margin-top: 24px; }
  .development-chapter .custom-art { order: 0; height: 320px; }
  .development-chapter .category-image { top: -30px; width: calc(100% + 40px); left: -20px; max-height: 310px; }
  .development-chapter .digital-text { order: 1; padding: 20px 0 0; }
  .development-chapter .digital-text h3 { font-size: 23px; }
  .development-orbit { bottom: 0; }
  .development-chapter .token-custom { width: 38px; height: 38px; top: -10px; }
  .development-path { grid-template-columns: 1fr; gap: 22px; margin-top: 30px; padding-top: 24px; }
  .development-path>div { padding-left: 36px; }
  .development-path h3 { font-size: 17px; }
}
@media (max-width:370px) {
  .support-art.category-art { min-height: 330px; }
  .support-art .category-image { top: 0; }
  .support-art .policy-pass { width: 105px; bottom: 44px; }
  .infra-story { padding-bottom: 260px; }
  .infra-sculpture.category-art { height: 260px; }
  .development-chapter .custom-art { height: 270px; }
  .development-orbit span { padding: 8px; font-size: 11px; border-radius: 12px; }
}
@media (prefers-reduced-motion:reduce) {
  .category-image img, .development-orbit span { animation: none !important; transform: none; }
}