/* Extracted from inline <style> in home.html for CSP compliance */
/* Note: This file consolidates all styles previously embedded in home.html */

:root {
  --turquoise-primary: #25D0B3;
  --turquoise-light: #3CDCBE;
  --turquoise-medium: #41D4BA;
  --turquoise-dark: #30A794;
  --auburn-primary: #A0522D;
  --auburn-light: #CD853F;
  --auburn-dark: #8B4513;
  --bg-primary: #0a0a0a;
  --bg-secondary: #1a1a1a;
  --bg-tertiary: #2a2a2a;
  --text-primary: #ffffff;
  --text-secondary: #e0e0e0;
  --text-muted: #cccccc;
}

* { margin: 0; padding: 0; box-sizing: border-box; }

body {
  font-family: var(--font-primary);
  background: linear-gradient(135deg, #0a0a0a 0%, #1a1a1a 100%) !important;
  color: #fff;
  line-height: 1.6;
  min-height: 100vh;
  position: relative;
}
.container { background: none !important; }
.glass-card, .main-card, .home-card {
  background: rgba(20, 20, 20, 0.97) !important;
  border-radius: 20px;
  box-shadow: 0 8px 32px rgba(0,0,0,0.3), 0 0 0 1px rgba(37,208,179,0.2);
}

.bg-animation { position: fixed; top:0; left:0; width:100%; height:100%; z-index:-1; opacity:0.1; }
.bg-animation::before {
  content: ''; position:absolute; top:0; left:0; width:200%; height:200%;
  background: radial-gradient(circle at 20% 50%, rgba(37, 208, 179, 0.15) 0%, transparent 50%),
              radial-gradient(circle at 80% 20%, rgba(160, 82, 45, 0.15) 0%, transparent 50%),
              radial-gradient(circle at 40% 80%, rgba(60, 220, 190, 0.15) 0%, transparent 50%);
  animation: float 20s ease-in-out infinite;
}

.floating-orbs { position: fixed; top:0; left:0; width:100%; height:100%; z-index:0; pointer-events:none; overflow:visible; }
.orb { position:absolute; border-radius:50%; filter: blur(1px); opacity:0.4; }

.orb-left-1 { width:8px; height:8px; background:var(--turquoise-primary); left:5%; top:20%; animation: floatOrbLeft1 18s infinite ease-in-out; }
.orb-left-2 { width:6px; height:6px; background:var(--turquoise-light); left:8%; top:50%; animation: floatOrbLeft2 22s infinite ease-in-out; }
.orb-left-3 { width:10px; height:10px; background:var(--turquoise-dark); left:3%; top:80%; animation: floatOrbLeft3 16s infinite ease-in-out; }
.orb-left-4 { width:5px; height:5px; background:var(--turquoise-medium); left:12%; top:90%; animation: floatOrbLeft4 25s infinite ease-in-out; }

.orb-right-1 { width:7px; height:7px; background:var(--turquoise-light); right:5%; top:30%; animation: floatOrbRight1 20s infinite ease-in-out; }
.orb-right-2 { width:9px; height:9px; background:var(--turquoise-primary); right:8%; top:60%; animation: floatOrbRight2 17s infinite ease-in-out; }
.orb-right-3 { width:6px; height:6px; background:var(--turquoise-medium); right:12%; top:85%; animation: floatOrbRight3 23s infinite ease-in-out; }
.orb-right-4 { width:8px; height:8px; background:var(--turquoise-dark); right:3%; top:95%; animation: floatOrbRight4 19s infinite ease-in-out; }

.orb-top-1 { width:5px; height:5px; background:var(--turquoise-primary); left:20%; top:3%; animation: floatOrbTop1 21s infinite ease-in-out; }
.orb-top-2 { width:7px; height:7px; background:var(--turquoise-light); right:25%; top:5%; animation: floatOrbTop2 24s infinite ease-in-out; }

.orb-bottom-1 { width:6px; height:6px; background:var(--turquoise-medium); left:30%; bottom:3%; animation: floatOrbBottom1 26s infinite ease-in-out; }
.orb-bottom-2 { width:8px; height:8px; background:var(--turquoise-dark); right:20%; bottom:5%; animation: floatOrbBottom2 18s infinite ease-in-out; }

@keyframes floatOrbLeft1 { 0%,100%{transform:translate(0,0) scale(1); opacity:.4;} 25%{transform:translate(20px,-30px) scale(1.1); opacity:.6;} 50%{transform:translate(-15px,40px) scale(.9); opacity:.3;} 75%{transform:translate(25px,-15px) scale(1.2); opacity:.5;} }
@keyframes floatOrbLeft2 { 0%,100%{transform:translate(0,0) scale(1); opacity:.4;} 30%{transform:translate(-20px,-40px) scale(.8); opacity:.2;} 60%{transform:translate(25px,-20px) scale(1.3); opacity:.7;} 80%{transform:translate(-10px,30px) scale(.9); opacity:.4;} }
@keyframes floatOrbLeft3 { 0%,100%{transform:translate(0,0) scale(1); opacity:.4;} 20%{transform:translate(30px,-35px) scale(1.1); opacity:.6;} 40%{transform:translate(-20px,-50px) scale(.8); opacity:.2;} 70%{transform:translate(20px,25px) scale(1.2); opacity:.5;} }
@keyframes floatOrbLeft4 { 0%,100%{transform:translate(0,0) scale(1); opacity:.4;} 15%{transform:translate(-30px,35px) scale(.9); opacity:.3;} 45%{transform:translate(15px,-45px) scale(1.4); opacity:.8;} 75%{transform:translate(-20px,-15px) scale(.7); opacity:.2;} }

@keyframes floatOrbRight1 { 0%,100%{transform:translate(0,0) scale(1); opacity:.4;} 25%{transform:translate(-25px,-30px) scale(1.2); opacity:.7;} 50%{transform:translate(20px,35px) scale(.8); opacity:.2;} 75%{transform:translate(-30px,-10px) scale(1.1); opacity:.5;} }
@keyframes floatOrbRight2 { 0%,100%{transform:translate(0,0) scale(1); opacity:.4;} 30%{transform:translate(25px,-45px) scale(.9); opacity:.3;} 60%{transform:translate(-15px,-20px) scale(1.3); opacity:.8;} 80%{transform:translate(30px,30px) scale(.7); opacity:.2;} }
@keyframes floatOrbRight3 { 0%,100%{transform:translate(0,0) scale(1); opacity:.4;} 20%{transform:translate(-35px,40px) scale(1.1); opacity:.6;} 40%{transform:translate(25px,-30px) scale(.8); opacity:.2;} 70%{transform:translate(-25px,-25px) scale(1.2); opacity:.5;} }
@keyframes floatOrbRight4 { 0%,100%{transform:translate(0,0) scale(1); opacity:.4;} 15%{transform:translate(30px,-40px) scale(.9); opacity:.3;} 45%{transform:translate(-20px,45px) scale(1.4); opacity:.8;} 75%{transform:translate(25px,-20px) scale(.7); opacity:.2;} }

@keyframes float { 0%,100%{ transform:translate(-50%,-50%) rotate(0deg);} 50%{ transform:translate(-50%,-50%) rotate(180deg);} }

.nav-bar { position: fixed; top:2rem; right:2rem; z-index:1000; }
.nav-link { color:var(--turquoise-primary); text-decoration:none; padding:.8rem 1.5rem; background:rgba(255,255,255,.05); backdrop-filter:blur(20px); border:1px solid var(--turquoise-primary); border-radius:25px; font-weight:600; transition:all .3s ease; }
.nav-link:hover { background:var(--turquoise-primary); color:#000; transform:translateY(-2px); }

.container { min-height:100vh; display:flex; flex-direction:column; justify-content:center; align-items:center; padding:2rem; position:relative; z-index:1; }
.glass-card { background:rgba(255,255,255,.05); backdrop-filter:blur(20px); border:1px solid rgba(255,255,255,.1); border-radius:30px; padding:4rem; max-width:800px; width:100%; text-align:center; animation: slideInUp 1.5s ease-out; box-shadow: 0 8px 32px rgba(0,0,0,.3), 0 0 0 1px rgba(37,208,179,.2); }
@keyframes slideInUp { from{opacity:0; transform:translateY(50px);} to{opacity:1; transform:translateY(0);} }

.logo { width:150px; height:150px; margin:0 auto 2rem; border-radius:50%; object-fit:cover; border:3px solid var(--turquoise-primary); animation: pulse 3s ease-in-out infinite; }
@keyframes pulse { 0%,100%{ box-shadow:0 0 0 0 rgba(37,208,179,.7);} 50%{ box-shadow:0 0 0 20px rgba(37,208,179,0);} }
@keyframes glowPulse { 0%,100%{ text-shadow:0 0 8px #25e4e0, 0 0 16px #25D0B3;} 50%{ text-shadow:0 0 32px #25e4e0, 0 0 64px #25D0B3;} }
h1 { font-family:'Chakra Petch', sans-serif; text-transform:uppercase; font-size:2.7rem; font-weight:700; letter-spacing:.08em; margin-bottom:1rem; max-width:100%; word-break:break-word; background:linear-gradient(90deg,#25e4e0 0%,#25D0B3 100%); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; color:#25D0B3; text-shadow:0 0 16px #25e4e0, 0 0 32px #25D0B3; animation: fadeIn 2s ease-out .5s both, glowPulse 3.5s ease-in-out infinite; }
.subtitle { font-family:'Space Grotesk', sans-serif; font-size:1.3rem; font-weight:500; letter-spacing:.04em; color:var(--turquoise-primary); margin-bottom:2rem; line-height:1.6; animation: fadeIn 2s ease-out 1.5s both; }
h2.subtitle { font-family:'Space Grotesk', sans-serif; font-size:1.4rem; font-weight:600; color:#A0522D; letter-spacing:.03em; margin-bottom:2rem; line-height:1.6; animation: fadeIn 2s ease-out 1.5s both; }
@keyframes fadeIn { from{opacity:0} to{opacity:1} }

.contact-info { font-size:1.1rem; color:var(--text-muted); margin-bottom:2rem; animation: fadeIn 2s ease-out 2s both; }
.contact-info p { margin-bottom:.5rem; transition:all .3s ease; }
.contact-info p:nth-child(1):hover, .contact-info p:nth-child(2):hover { color:var(--turquoise-light); transform:translateX(5px); }
.contact-info p.manifesto-line { font-family:var(--font-primary); color:#25D0B3; font-size:1.2em; text-shadow:0 0 2px #25D0B3, 0 0 4px #25D0B3; font-style:normal; font-weight:700; letter-spacing:.01em; line-height:1.2; }
.contact-info p.iykyk-line { font-family:var(--font-primary); color:#A0522D; font-size:1.5em; text-shadow:0 0 2px #A0522D, 0 0 4px #A0522D; font-style:italic; font-weight:600; letter-spacing:.03em; }

.contact-btn, .cta-button { font-family:'Space Grotesk', sans-serif; font-weight:600; font-size:1.15rem; letter-spacing:.04em; display:inline-block; background:linear-gradient(135deg, var(--turquoise-primary), var(--turquoise-dark)); color:#000; padding:1.2rem 2.5rem; text-decoration:none; border-radius:50px; text-transform:uppercase; transition:all .4s cubic-bezier(.4,0,.2,1); box-shadow:0 4px 15px rgba(37,208,179,.4); margin:1rem 0 2rem 0; position:relative; overflow:hidden; }
.cta-button::before, .contact-btn::before { content:''; position:absolute; top:0; left:-100%; width:100%; height:100%; background:linear-gradient(90deg, transparent, rgba(255,255,255,.2), transparent); transition:left .6s ease; }
.cta-button:hover::before, .contact-btn:hover::before { left:100%; }
.cta-button:hover, .contact-btn:hover { transform:translateY(-5px) scale(1.05); box-shadow:0 12px 30px rgba(37,208,179,.6), 0 0 0 2px rgba(37,208,179,.3); }
.cta-button:active, .contact-btn:active { transform:translateY(-2px) scale(1.02); }

.services-preview { display:grid; grid-template-columns:repeat(auto-fit, minmax(180px, 1fr)); gap:1.5rem; margin-top:2rem; padding-top:2rem; border-top:1px solid rgba(255,255,255,.1); animation: fadeIn 2s ease-out 3s both; }
.service-item { text-align:center; padding:1.5rem; border-radius:15px; background:rgba(255,255,255,.03); backdrop-filter:blur(10px); border:1px solid rgba(255,255,255,.05); transition:all .4s cubic-bezier(.4,0,.2,1); position:relative; overflow:hidden; }
.service-item:nth-child(1){ animation: slideInUp .6s ease-out .8s both; }
.service-item:nth-child(2){ animation: slideInUp .6s ease-out 1.0s both; }
.service-item:nth-child(3){ animation: slideInUp .6s ease-out 1.2s both; }
.service-item:nth-child(4){ animation: slideInUp .6s ease-out 1.4s both; }
.service-item:nth-child(5){ animation: slideInUp .6s ease-out 1.6s both; }
.service-item:nth-child(6){ animation: slideInUp .6s ease-out 1.8s both; }
.service-item::before { content:''; position:absolute; top:0; left:-100%; width:100%; height:100%; background:linear-gradient(90deg, transparent, rgba(37,208,179,.1), transparent); transition:left .6s ease; }
.service-item:hover::before { left:100%; }
.service-item:hover { transform:translateY(-8px) scale(1.02); background:rgba(255,255,255,.08); border-color:var(--turquoise-primary); box-shadow:0 15px 35px rgba(37,208,179,.25), 0 0 0 1px rgba(37,208,179,.1); }
.service-icon { font-size:2.5rem; margin-bottom:1rem; filter:grayscale(.2); transition:all .4s cubic-bezier(.4,0,.2,1); display:inline-block; }
.service-item:hover .service-icon { transform:scale(1.1) rotate(5deg); filter:grayscale(0); }
.service-title { font-weight:600; margin-bottom:.5rem; color:var(--turquoise-light); font-size:.8rem; }
.service-desc { font-family:'IBM Plex Sans', sans-serif; font-size:.9rem; color:var(--text-muted); line-height:1.4; }

.footer { position:fixed; bottom:2rem; left:50%; transform:translateX(-50%); font-size:.9rem; color:var(--text-muted); text-align:center; z-index:100; }

.honeypot { position:absolute; left:-9999px; top:-9999px; opacity:0; pointer-events:none; }

@media (max-width: 768px) {
  .nav-bar { top:1rem; right:1rem; }
  .container { padding:1rem; }
  .glass-card { padding:2.5rem; }
  h1 { font-size:2.5rem; }
  h2.subtitle { font-size:1.2rem; }
  .logo { width:120px; height:120px; }
  .services-preview { grid-template-columns:repeat(auto-fit, minmax(150px, 1fr)); gap:1rem; }
  .service-item { padding:1rem; }
  .footer { bottom:1rem; font-size:.8rem; }
  .orb-left-1, .orb-left-2, .orb-left-3, .orb-left-4 { left:2%; }
  .orb-right-1, .orb-right-2, .orb-right-3, .orb-right-4 { right:2%; }
  .orb-top-1, .orb-top-2 { top:2%; }
  .orb-bottom-1, .orb-bottom-2 { bottom:2%; }
}

@media (max-width: 480px) {
  .glass-card { padding:2rem; }
  h1 { font-size:2rem; }
  .logo { width:100px; height:100px; }
  .services-preview { grid-template-columns:1fr; }
}

/* Footer separators */
.footer-dark-separator { border:none; border-top:1px solid rgba(255,255,255,.08); height:0; max-width:800px; margin:2.5rem auto 0 auto; width:100%; }
.footer-separator { border:none; height:3px; max-width:800px; margin:2.5rem auto 2rem auto; width:100%; background:linear-gradient(90deg,#25e4e0 0%, #25D0B3 100%); box-shadow:0 0 16px 2px #25e4e0, 0 2px 8px 0 rgba(37,208,179,.12); opacity:.85; }

.nav-links { text-align:center; margin-top:2rem; padding-top:2rem; animation: fadeIn 2s ease-out 4s both; }
.nav-link { font-family:'IBM Plex Sans', sans-serif; display:inline-block; color:var(--turquoise-primary); text-decoration:none; padding:.8rem 1.5rem; background:rgba(37,208,179,.1); border:1px solid var(--turquoise-primary); text-transform:uppercase; border-radius:25px; margin:.5rem; transition:all .4s cubic-bezier(.4,0,.2,1); font-weight:600; font-size:.9rem; position:relative; overflow:hidden; }
.nav-link::before { content:''; position:absolute; top:0; left:-100%; width:100%; height:100%; background:linear-gradient(90deg, transparent, rgba(37,208,179,.2), transparent); transition:left .5s ease; }
.nav-link:hover::before { left:100%; }
.nav-link:hover { background:var(--turquoise-primary); color:#000; transform:translateY(-3px) scale(1.05); box-shadow:0 8px 20px rgba(37,208,179,.3); }
.copyright-line { text-align:center; color:var(--text-muted); font-size:.95rem; margin-bottom:2rem; animation: fadeIn 2s ease-out 4.5s both; transition: all .3s ease; }
.copyright-line:hover { color:var(--turquoise-light); }

/* Inputs */
input[type="text"], input[type="email"], select, textarea { padding:1rem; border:2px solid rgba(255,255,255,.1); border-radius:10px; background:rgba(34,34,34,.95) !important; color:#fff !important; font-size:1rem; font-family:inherit; transition:all .3s ease; backdrop-filter:blur(10px); }
input:-webkit-autofill, textarea:-webkit-autofill, select:-webkit-autofill { -webkit-box-shadow:0 0 0 1000px #222 inset !important; -webkit-text-fill-color:#fff !important; color:#fff !important; background-color:#222 !important; caret-color:#fff !important; }
input:-webkit-autofill:focus, textarea:-webkit-autofill:focus, select:-webkit-autofill:focus { -webkit-box-shadow:0 0 0 1000px #222 inset !important; -webkit-text-fill-color:#fff !important; color:#fff !important; background-color:#222 !important; caret-color:#fff !important; }
input:-internal-autofill-selected { background-color:#222 !important; color:#fff !important; }
input, textarea, select { background-color:#222 !important; color:#fff !important; }


