
/*
 Theme Name: Fiberpie 3D
 Theme URI: https://fiberpie.com
 Author: Fiberpie FZE
 Description: Dark neon, 3D-style tech theme with parallax/tilt effects for IT solutions websites. Includes menu, footer, and Gutenberg-friendly styles.
 Version: 1.0
 Requires at least: 6.0
 Tested up to: 6.6
 License: GPL-2.0-or-later
 Text Domain: fiberpie-3d
*/
:root{
  --fp-bg:#0A0A0A;
  --fp-bg-2:#111111;
  --fp-text:#FFFFFF;
  --fp-sub:#B3B3B3;
  --fp-blue:#00FFFF;
  --fp-green:#00FF9C;
  --fp-card:#0f0f0f;
  --fp-border:#1f2937;
  --fp-radius:18px;
  --fp-shadow:0 0 30px rgba(0,255,156,.15), 0 0 40px rgba(0,255,255,.08);
  --fp-grad: radial-gradient(1000px 600px at 20% 10%, rgba(0,255,255,.05), transparent 60%),
             radial-gradient(800px 500px at 80% 30%, rgba(0,255,156,.05), transparent 60%);
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:var(--fp-bg);color:var(--fp-text);font-family:Poppins,Inter,system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,'Helvetica Neue',Arial,sans-serif;line-height:1.65}
a{color:var(--fp-blue);text-decoration:none}
a:hover{opacity:.9}
.container{max-width:1200px;margin:0 auto;padding:24px}
.fp-hero{position:relative;overflow:hidden;background:var(--fp-bg-2);border:1px solid var(--fp-border);border-radius:calc(var(--fp-radius) + 6px);padding:80px 28px;margin:24px 0;box-shadow:var(--fp-shadow)}
.fp-hero:before{content:"";position:absolute;inset:-1px;background:var(--fp-grad);pointer-events:none}
.fp-hero h1{font-size: clamp(34px,5vw,56px);margin:0 0 10px;font-weight:800;letter-spacing:.5px}
.fp-hero p{font-size: clamp(16px,2vw,20px);color:var(--fp-sub);max-width:900px}
.fp-row{display:grid;grid-template-columns:repeat(12,1fr);gap:18px}
.fp-col-4{grid-column:span 4;min-width:0}
.fp-col-6{grid-column:span 6;min-width:0}
.fp-col-8{grid-column:span 8;min-width:0}
@media(max-width:900px){.fp-col-4,.fp-col-6,.fp-col-8{grid-column:span 12}}

.fp-btn{display:inline-block;margin:14px 10px 0 0;padding:13px 18px;border-radius:14px;border:1px solid var(--fp-blue);color:#021315;background:linear-gradient(180deg,#00FFFF 0%,#00FFDF 100%);box-shadow:0 0 18px rgba(0,255,255,.4);font-weight:700}
.fp-btn.secondary{background:linear-gradient(180deg,#00FFB5 0%,#00FF9C 100%);border-color:var(--fp-green);box-shadow:0 0 18px rgba(0,255,156,.4)}

.card{background:var(--fp-card);border:1px solid var(--fp-border);padding:22px;border-radius:var(--fp-radius);position:relative;box-shadow:var(--fp-shadow);transform-style:preserve-3d;transition:transform .25s ease, box-shadow .3s ease}
.card h3{margin:0 0 6px;font-size:22px}
.card p{color:var(--fp-sub);margin:0}
.card:hover{box-shadow:0 0 40px rgba(0,255,255,.2),0 0 50px rgba(0,255,156,.15)}

.section{margin:48px 0}
.section h2{font-size:28px;margin:0 0 14px 0}
.section .sub{color:var(--fp-sub);margin-top:-6px;margin-bottom:18px}

.fp-footer{margin-top:60px;padding:36px 0;border-top:1px solid var(--fp-border);color:var(--fp-sub)}
.fp-badge{display:inline-block;padding:6px 10px;border-radius:999px;border:1px solid var(--fp-border);color:var(--fp-sub);margin-bottom:12px;background:rgba(255,255,255,.02)}
.fp-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.fp-list li{padding:10px 14px;border:1px dashed var(--fp-border);border-radius:10px;background:rgba(255,255,255,.02)}
.nav{display:flex;gap:16px;justify-content:flex-end}
.nav a{padding:10px 12px;border-radius:10px;border:1px solid var(--fp-border);background:rgba(255,255,255,.02)}
.header{display:flex;align-items:center;justify-content:space-between;padding:18px 0}
.logo{font-weight:900;letter-spacing:.5px;font-size:18px}
.tilt{will-change:transform}
.parallax-wrap{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.parallax-blob{position:absolute;filter:blur(40px);opacity:.35}
.parallax-blob.b1{left:-120px;top:-100px;width:380px;height:380px;background:radial-gradient(circle at 30% 30%, rgba(0,255,255,.5), transparent 60%)}
.parallax-blob.b2{right:-160px;bottom:-120px;width:420px;height:420px;background:radial-gradient(circle at 70% 70%, rgba(0,255,156,.5), transparent 60%)}
.wp-block{max-width:100%!important}
*/
