/* SYNTHLUCIDA – shared styles for bio.html and services.html (same look as index.html) */
:root{--cyan:#3ec6e0;--ink:#eaf6ff;--muted:#9fb3d1;--text:#d7d7d7;--card:rgba(11,17,38,.55);--line:rgba(62,198,224,.13)}
*{box-sizing:border-box}
html{scroll-behavior:smooth;background-color:#000}
body{margin:0;min-height:100svh;display:flex;flex-direction:column;font-family:'Orbitron',sans-serif;color:#fff;text-align:center;overflow-x:hidden;background-color:#000;background-image:radial-gradient(circle 1000px at top,#0a1e5c,#05123a,#000);padding:env(safe-area-inset-top,0) env(safe-area-inset-right,0) env(safe-area-inset-bottom,0) env(safe-area-inset-left,0)}
body::before{content:"";position:fixed;top:-50%;left:-50%;width:200%;height:200%;z-index:-1;background:radial-gradient(circle,rgba(0,255,255,.07),transparent 60%),radial-gradient(circle,rgba(255,0,255,.07),transparent 60%),radial-gradient(circle,rgba(0,90,255,.06),transparent 55%)}
main.container{flex:1;width:100%;max-width:920px;margin:0 auto;padding:0 20px 56px;position:relative;z-index:1}

/* nav – identical to index */
header.site-nav{position:sticky;top:0;z-index:40;margin:0 0 28px;padding:14px 20px;background:rgba(8,14,36,.82);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid rgba(62,198,224,.16);text-align:left}
.nav-inner{max-width:880px;margin:0 auto;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 18px}
.nav-brand{font-weight:600;font-size:15px;letter-spacing:.08em;color:var(--ink);text-decoration:none;white-space:nowrap}
.nav-toggle-checkbox{display:none}
.nav-toggle-label{display:none;cursor:pointer;padding:6px;font-size:18px;line-height:1;color:#cfe7ff}
.nav-links{display:flex;align-items:center;gap:22px;flex:1}
.nav-links a{font-size:11px;letter-spacing:.04em;color:var(--muted);text-decoration:none;white-space:nowrap;transition:color .2s}
.nav-links a:hover,.nav-links a:focus-visible,.nav-links a[aria-current="page"]{color:var(--cyan)}
.nav-right{display:flex;align-items:center;gap:12px}
.nav-cta{display:inline-flex;padding:8px 18px;border-radius:999px;background:linear-gradient(135deg,#1f6fa8,#3ec6e0);color:#04101f;font-weight:600;font-size:11px;letter-spacing:.04em;text-decoration:none;white-space:nowrap;box-shadow:0 4px 16px rgba(62,198,224,.22);transition:transform .2s,box-shadow .2s}
.nav-cta:hover,.nav-cta:focus-visible{transform:translateY(-1px);box-shadow:0 6px 20px rgba(62,198,224,.32)}
.lang-toggle-btn{border:1px solid rgba(62,198,224,.24);background:rgba(11,17,38,.5);color:var(--cyan);font-family:inherit;font-size:12px;font-weight:600;letter-spacing:1px;cursor:pointer;padding:8px 18px;border-radius:20px;box-shadow:0 0 15px rgba(62,198,224,.09);transition:.25s}
.lang-toggle-btn:hover{background:var(--cyan);color:#000;box-shadow:0 0 18px rgba(62,198,224,.55)}
:focus-visible{outline:2px solid var(--cyan);outline-offset:3px}

/* hero – tagline, mini sun and moon like index */
.page-hero{margin:4px 0 36px}
.mini-sun{position:relative;width:56px;height:56px;margin:0 auto 22px;border-radius:50%;overflow:hidden;background:radial-gradient(circle at 50% 38%,#fff6e2 0%,#ffe2ab 12%,#ffb666 28%,#ff8c4a 44%,#ff6f4d 62%,#dd6178 80%,rgba(200,80,90,0) 100%);box-shadow:0 0 22px rgba(255,150,90,.32),0 0 42px rgba(255,110,90,.2);animation:sun 6.5s ease-in-out infinite}
.mini-sun::after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(to bottom,transparent 0,transparent 3px,rgba(12,4,24,.5) 3px,rgba(12,4,24,.5) 5px);-webkit-mask-image:linear-gradient(to bottom,transparent 44%,#000 52%);mask-image:linear-gradient(to bottom,transparent 44%,#000 52%)}
@keyframes sun{50%{box-shadow:0 0 36px rgba(255,170,110,.52),0 0 64px rgba(255,130,110,.32)}}
h1{margin:0 0 14px;font-size:clamp(22px,5.4vw,36px);font-weight:600;letter-spacing:.06em;line-height:1.2;color:var(--ink)}
.subtitle{font-size:13px;line-height:1.7;color:#b9d4ee;margin:0 0 22px}
.mini-moon{display:flex;align-items:center;justify-content:center;gap:clamp(8px,2.4vw,16px);max-width:260px;margin:0 auto}
.mini-moon-line{width:clamp(24px,14vw,70px);height:1px;background:linear-gradient(to right,transparent,rgba(130,210,235,.55));box-shadow:0 0 8px 1px rgba(110,200,235,.22)}
.mini-moon-line.r{background:linear-gradient(to left,transparent,rgba(130,210,235,.55))}
.mini-moon svg{width:30px;height:30px;overflow:visible;animation:moon 4.5s ease-in-out infinite}
@keyframes moon{0%,100%{filter:drop-shadow(0 0 4px rgba(150,225,248,.5)) drop-shadow(0 0 10px rgba(120,180,255,.28))}50%{filter:drop-shadow(0 0 7px rgba(170,232,250,.7)) drop-shadow(0 0 16px rgba(130,190,255,.4))}}

/* content */
h2{font-size:18px;color:var(--cyan);margin:40px 0 20px;letter-spacing:1px}
.bio,.bio-text{font-size:15px;line-height:1.9;color:var(--text);max-width:680px;margin:0 auto 24px;text-align:left}
.bio-image,.bio-portrait{display:block;max-width:100%;height:auto;margin:30px auto;border-radius:15px;border:1px solid rgba(62,198,224,.18);box-shadow:0 0 20px rgba(62,198,224,.09)}
.bio-image{width:100%;max-width:640px}
.bio-portrait{width:200px;margin-top:40px}
.philosophy-card,.player-card,.service-card{max-width:680px;margin:28px auto 0;padding:30px 26px;border-radius:18px;background:var(--card);border:1px solid var(--line);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);box-shadow:0 0 25px rgba(62,198,224,.06);text-align:left}
.services-wrapper{max-width:680px;margin:0 auto}
.card-highlight{display:inline-block;font-size:10.5px;text-transform:uppercase;letter-spacing:2px;color:var(--cyan);border:1px solid rgba(62,198,224,.22);background:rgba(62,198,224,.044);padding:6px 14px;border-radius:20px;margin-bottom:16px}
.card-title,.service-card h3{margin:0 0 14px;font-size:18px;font-weight:600;letter-spacing:1px;color:var(--cyan)}
.philosophy-card p,.player-card p,.service-card p{margin:0 0 14px;font-size:14px;line-height:1.85;color:var(--text)}
.service-card ul{margin:0;padding-left:20px;font-size:14px;line-height:1.8;color:#b0b0b0}
.service-card li{margin-bottom:8px}
.service-card li strong{color:#fff}

/* buttons – same as index a.button / nav-cta */
.links{display:flex;flex-direction:column;align-items:center;gap:14px;margin-top:44px}
a.button,.contact-form-toggle-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;width:100%;max-width:330px;padding:15px;border-radius:14px;text-decoration:none;color:var(--cyan);border:1px solid rgba(62,198,224,.21);background:rgba(255,255,255,.03);box-shadow:0 0 10px rgba(62,198,224,.072);font-family:inherit;font-size:14px;line-height:1.75;letter-spacing:.5px;cursor:pointer;transition:all .25s}
a.button:hover,.contact-form-toggle-btn:hover{transform:translateY(-2px) scale(1.03);box-shadow:0 0 20px rgba(62,198,224,.27);background:rgba(255,255,255,.05)}
.contact-form-toggle-btn[aria-expanded="true"]{background:rgba(62,198,224,.06);border-color:rgba(62,198,224,.33)}
.contact-form-toggle-btn .chevron{font-size:11px;transition:transform .3s}
.contact-form-toggle-btn[aria-expanded="true"] .chevron{transform:rotate(180deg)}
.player-btn-container{text-align:center;margin-top:24px}
.player-btn{display:inline-flex;padding:13px 28px;border-radius:999px;background:linear-gradient(135deg,#1f6fa8,#3ec6e0);color:#04101f;font-weight:600;font-size:12px;letter-spacing:.05em;text-decoration:none;box-shadow:0 4px 16px rgba(62,198,224,.22);transition:transform .2s,box-shadow .2s}
.player-btn:hover{transform:translateY(-1px);box-shadow:0 6px 20px rgba(62,198,224,.32)}

/* contact form – same as index */
.contact-form-panel{width:100%;max-width:440px;max-height:0;opacity:0;overflow:hidden;scroll-margin-top:90px;transition:max-height .5s ease,opacity .4s ease}
.contact-form-panel.open{opacity:1}
.contact-form{display:flex;flex-direction:column;gap:12px;padding:22px;border-radius:14px;background:rgba(255,255,255,.03);border:1px solid rgba(62,198,224,.12);text-align:left}
.contact-recipient{margin:0 0 4px;font-size:12px;color:#c4c4c4;text-align:center}
.contact-recipient strong{color:var(--cyan)}
.contact-input,.contact-textarea{width:100%;padding:12px 14px;background:rgba(255,255,255,.05);border:1px solid rgba(62,198,224,.18);color:#fff;border-radius:8px;font-family:inherit;font-size:12.5px;outline:none;transition:all .2s}
.contact-input::placeholder,.contact-textarea::placeholder{color:rgba(255,255,255,.4)}
.contact-input:hover,.contact-input:focus,.contact-textarea:hover,.contact-textarea:focus{border-color:var(--cyan);background:rgba(62,198,224,.03)}
.contact-textarea{resize:vertical;min-height:100px}
.contact-submit-btn{font-family:inherit;background:rgba(255,255,255,.03);border:1px solid rgba(62,198,224,.24);color:var(--cyan);padding:13px 24px;font-size:13px;font-weight:600;border-radius:10px;cursor:pointer;letter-spacing:1px;box-shadow:0 0 8px rgba(62,198,224,.09);transition:all .2s}
.contact-submit-btn:hover{background:rgba(62,198,224,.06);border-color:var(--cyan);box-shadow:0 0 15px rgba(62,198,224,.24)}
.contact-thanks{margin:0;padding:10px 0;color:var(--cyan);font-size:13px;text-align:center}
.contact-status{margin:4px 0 0;font-size:12px;text-align:center;min-height:14px}
.contact-status.sending{color:rgba(255,255,255,.6)}
.contact-status.error{color:#ff6b6b}

/* footer – same as index */
.footer-logo{display:block;width:100%;max-width:160px;height:auto;margin:48px auto 16px}
.privacy-link{display:inline-block;margin-top:40px;font-size:10px;color:#9a9a9a;text-decoration:none;letter-spacing:.4px;opacity:.65;transition:.2s}
.privacy-link:hover{opacity:1;color:var(--cyan)}
footer{margin-top:20px;padding:0 20px 28px;font-size:11px;color:#7d7d7d;letter-spacing:1px}
footer p{margin:0}
.footer-links{display:flex;flex-wrap:wrap;justify-content:center;gap:8px 18px;margin-bottom:14px}
.footer-links a{font-size:10px;letter-spacing:.5px;color:#8095b3;text-decoration:none;transition:color .2s}
.footer-links a:hover,.footer-links a:focus-visible{color:var(--cyan)}

@media (max-width:700px){
  .nav-toggle-label{display:block}
  .nav-links{display:none;position:absolute;top:100%;left:0;right:0;flex-direction:column;align-items:stretch;gap:0;background:rgba(5,8,20,.97);border-bottom:1px solid rgba(62,198,224,.16);padding:4px 20px 10px}
  .nav-links a{padding:11px 0;font-size:13px;border-bottom:1px solid rgba(62,198,224,.08)}
  .nav-links a:last-child{border-bottom:none}
  .nav-toggle-checkbox:checked~.nav-links{display:flex}
  .nav-cta,.lang-toggle-btn{padding:7px 14px;font-size:10px}
}
@media (max-width:600px){
  main.container{padding:0 16px 45px}
  .bio,.bio-text{font-size:14px;line-height:1.8}
  .philosophy-card,.player-card,.service-card{padding:22px 18px}
  a.button{font-size:13px}
}
@media (max-width:480px){
  header.site-nav{padding:12px 14px}
  .nav-brand{font-size:13px}
  .nav-cta,.lang-toggle-btn{padding:6px 11px;font-size:9px}
  .philosophy-card,.player-card,.service-card{-webkit-backdrop-filter:none;backdrop-filter:none}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .mini-sun,.mini-moon svg{animation:none}
}
