/* ===== Code-based 3D diver logo (colors, size and glow come from site_settings through CSS variables) ===== */
.logo{gap:10px;color:var(--logo-color,var(--accent))}
.logo-mark{display:inline-flex;align-items:center}
.logo svg.ld{width:auto;height:calc(44px * var(--logo-scale,1));overflow:visible;color:var(--logo-color,var(--accent));filter:drop-shadow(var(--logo-glow,none));animation:ldglow 3.6s ease-in-out infinite}
.logo .wm{font-size:calc(20px * var(--logo-scale,1))}
.ld-diver{animation:ldswim 4.8s ease-in-out infinite;transform-origin:60px 32px}
.ld-kick1{transform-origin:46px 34px;animation:ldkick 1.7s ease-in-out infinite}
.ld-kick2{transform-origin:46px 37px;animation:ldkick 1.7s ease-in-out infinite reverse}
.ld-wave path{animation:ldwave 3s linear infinite}
.ld-bubbles circle{animation:ldrise 3.4s ease-in infinite;transform-box:fill-box;transform-origin:center}
.ld-bubbles .b2{animation-delay:.7s}.ld-bubbles .b3{animation-delay:1.4s}.ld-bubbles .b4{animation-delay:2.1s}.ld-bubbles .b5{animation-delay:2.7s}
@keyframes ldswim{0%,100%{transform:translate(0,0) rotate(-1.5deg)}50%{transform:translate(2px,-3px) rotate(1.5deg)}}
@keyframes ldkick{0%,100%{transform:rotate(-7deg)}50%{transform:rotate(8deg)}}
@keyframes ldwave{from{transform:translateX(0)}to{transform:translateX(-20px)}}
@keyframes ldrise{0%{transform:translateY(8px) scale(.5);opacity:0}15%{opacity:.95}100%{transform:translateY(-16px) scale(1.15);opacity:0}}
@keyframes ldglow{0%,100%{filter:drop-shadow(var(--logo-glow,none))}50%{filter:drop-shadow(var(--logo-glow,none)) brightness(1.15)}}


.logo{display:inline-flex;align-items:center;text-decoration:none}