/*
Theme Name: SB Projects Engineering
Theme URI: https://www.sbprojects.it
Author: SB Projects
Description: Tema WordPress personalizzato per SB Projects Engineering.
Version: 1.1.0
Requires at least: 6.4
Requires PHP: 8.0
Text Domain: sb-projects
*/

:root{
  --sb-bg:#071015;
  --sb-bg-2:#0c171d;
  --sb-card:#111f26;
  --sb-gold:#c9a65a;
  --sb-gold-2:#e2c47c;
  --sb-steel:#c8d0d5;
  --sb-white:#f7f8f8;
  --sb-muted:#9caab2;
  --sb-line:rgba(201,166,90,.28);
  --sb-shadow:0 24px 80px rgba(0,0,0,.34);
  --sb-radius:18px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--sb-bg);color:var(--sb-white);font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;line-height:1.65}
a{color:inherit;text-decoration:none}
img{max-width:100%;height:auto;display:block}
.sb-container{width:min(1180px,calc(100% - 40px));margin:auto}
.sb-section{padding:100px 0;position:relative}
.sb-kicker{font-size:.78rem;letter-spacing:.2em;text-transform:uppercase;color:var(--sb-gold-2);font-weight:800}
.sb-title{font-size:clamp(2rem,4.8vw,4.7rem);line-height:1.03;margin:.35em 0 .35em;letter-spacing:-.035em}
.sb-subtitle{font-size:clamp(1.05rem,1.8vw,1.35rem);color:var(--sb-muted);max-width:760px}
.sb-grid{display:grid;gap:28px}
.sb-grid-3{grid-template-columns:repeat(3,1fr)}
.sb-grid-2{grid-template-columns:repeat(2,1fr)}
.sb-btn{display:inline-flex;align-items:center;justify-content:center;padding:15px 24px;border-radius:999px;font-weight:800;letter-spacing:.04em;border:1px solid var(--sb-gold);transition:.25s ease;cursor:pointer}
.sb-btn-primary{background:linear-gradient(135deg,var(--sb-gold),var(--sb-gold-2));color:#111}
.sb-btn:hover{transform:translateY(-2px);box-shadow:0 12px 30px rgba(201,166,90,.24)}
.sb-btn-ghost{background:rgba(7,16,21,.45);color:var(--sb-white)}

.site-header{position:fixed;inset:0 0 auto;z-index:50;background:rgba(5,12,16,.72);backdrop-filter:blur(16px);border-bottom:1px solid rgba(255,255,255,.06)}
.header-inner{height:82px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.brand{display:flex;align-items:center;gap:12px;font-weight:900;letter-spacing:.08em}
.brand img{width:54px;height:54px;object-fit:cover;object-position:center;border-radius:50%;border:1px solid var(--sb-line)}
.brand small{display:block;font-size:.62rem;color:var(--sb-gold-2);letter-spacing:.18em}
.main-nav{display:flex;gap:24px;font-size:.88rem;font-weight:700}
.main-nav a{color:#dce3e6}
.main-nav a:hover{color:var(--sb-gold-2)}
.menu-toggle{display:none;border:1px solid var(--sb-line);background:transparent;color:white;padding:9px 12px;border-radius:9px}

.hero{min-height:100vh;display:flex;align-items:center;padding-top:100px;overflow:hidden;background:radial-gradient(circle at 78% 26%,rgba(201,166,90,.20),transparent 28%),linear-gradient(135deg,#061017 0%,#0b1b23 54%,#071015 100%)}
.hero:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 78% 25%,rgba(201,166,90,.18),transparent 32%),linear-gradient(180deg,transparent 70%,var(--sb-bg) 100%)}
.hero-content{position:relative;z-index:2;max-width:910px;padding-top:70px}
.hero-logo{position:absolute;right:-220px;top:-10px;width:min(320px,28vw);margin:0;filter:drop-shadow(0 18px 40px rgba(0,0,0,.5));border-radius:12px;opacity:.96}
.hero h1{font-size:clamp(2.9rem,7vw,7.2rem);line-height:.92;margin:0;letter-spacing:-.055em;text-transform:uppercase}
.hero h1 span{display:block;color:var(--sb-gold-2)}
.hero p{font-size:clamp(1.05rem,2vw,1.35rem);max-width:760px;color:#d5dde0;margin:28px 0}
.hero-actions{display:flex;flex-wrap:wrap;gap:14px}
.hero-tags{display:flex;flex-wrap:wrap;gap:10px;margin-top:30px}
.hero-tags span{border:1px solid rgba(255,255,255,.14);background:rgba(0,0,0,.25);padding:8px 12px;border-radius:999px;font-size:.78rem;text-transform:uppercase;letter-spacing:.08em}

.stats{margin-top:-56px;position:relative;z-index:5}
.stats-wrap{display:grid;grid-template-columns:repeat(3,1fr);background:linear-gradient(135deg,#101e25,#0a151a);border:1px solid var(--sb-line);border-radius:var(--sb-radius);box-shadow:var(--sb-shadow);overflow:hidden}
.stat{padding:34px;text-align:center;border-right:1px solid var(--sb-line)}
.stat:last-child{border:0}
.stat strong{display:block;font-size:clamp(2rem,4vw,3.5rem);color:var(--sb-gold-2);line-height:1}
.stat span{font-size:.85rem;text-transform:uppercase;letter-spacing:.11em;color:var(--sb-muted)}

.card{background:linear-gradient(145deg,rgba(17,31,38,.96),rgba(10,22,28,.96));border:1px solid rgba(255,255,255,.07);border-radius:var(--sb-radius);padding:30px;box-shadow:0 16px 50px rgba(0,0,0,.18)}
.card h3{margin:.4rem 0;font-size:1.35rem}
.card p{color:var(--sb-muted)}
.icon{font-size:2rem;color:var(--sb-gold-2)}
.service-card{transition:.25s ease}
.service-card:hover{transform:translateY(-7px);border-color:var(--sb-line)}

.about-wrap{display:grid;grid-template-columns:.9fr 1.1fr;gap:55px;align-items:center}
.about-image{border-radius:var(--sb-radius);overflow:hidden;position:relative;border:1px solid var(--sb-line);box-shadow:var(--sb-shadow)}
.about-image:after{content:"";position:absolute;inset:0;border:1px solid rgba(255,255,255,.08);border-radius:inherit;pointer-events:none}
.about-copy blockquote{border-left:3px solid var(--sb-gold);margin:28px 0 0;padding:10px 0 10px 24px;font-size:1.28rem;color:#dce4e7}

.timeline{border-left:1px solid var(--sb-line);padding-left:28px;margin-top:34px}
.timeline-item{position:relative;margin:0 0 26px}
.timeline-item:before{content:"";position:absolute;left:-35px;top:8px;width:13px;height:13px;border-radius:50%;background:var(--sb-gold);box-shadow:0 0 0 6px rgba(201,166,90,.12)}
.timeline-item strong{color:var(--sb-gold-2)}

.project{padding:0;overflow:hidden}
.project img{width:100%;height:270px;object-fit:cover}
.project-body{padding:28px}
.project-meta{display:flex;gap:16px;flex-wrap:wrap;color:var(--sb-gold-2);font-size:.82rem;text-transform:uppercase;letter-spacing:.08em}

.contact-wrap{display:grid;grid-template-columns:.8fr 1.2fr;gap:38px}
.contact-list{display:grid;gap:14px;margin-top:28px}
.contact-list a,.contact-list div{padding:15px 18px;background:rgba(255,255,255,.035);border:1px solid rgba(255,255,255,.07);border-radius:12px}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.form-field{display:grid;gap:7px}
.form-field.full{grid-column:1/-1}
.form-field label{font-size:.85rem;color:#d4dce0}
.form-field input,.form-field textarea{width:100%;border:1px solid rgba(255,255,255,.12);background:#081218;color:white;border-radius:10px;padding:14px;font:inherit}
.form-field textarea{min-height:145px;resize:vertical}
.notice{padding:13px 15px;border-radius:10px;margin-bottom:18px}.notice.success{background:rgba(68,180,110,.15);border:1px solid rgba(68,180,110,.4)}.notice.error{background:rgba(220,80,80,.14);border:1px solid rgba(220,80,80,.4)}

.site-footer{padding:45px 0;border-top:1px solid rgba(255,255,255,.07);color:var(--sb-muted);font-size:.88rem}
.footer-inner{display:flex;justify-content:space-between;gap:24px;align-items:center}
.footer-brand{color:white;font-weight:800}

@media(max-width:900px){.main-nav{position:fixed;left:20px;right:20px;top:90px;display:none;flex-direction:column;background:#0b171d;padding:24px;border:1px solid var(--sb-line);border-radius:14px}.main-nav.open{display:flex}.menu-toggle{display:block}.sb-grid-3,.sb-grid-2,.about-wrap,.contact-wrap{grid-template-columns:1fr}.stats-wrap{grid-template-columns:1fr}.stat{border-right:0;border-bottom:1px solid var(--sb-line)}.hero{background-position:62% center}.hero-logo{width:260px}.footer-inner{flex-direction:column;align-items:flex-start}}
@media(max-width:600px){.sb-section{padding:72px 0}.sb-container{width:min(100% - 28px,1180px)}.form-grid{grid-template-columns:1fr}.brand span{display:none}.header-inner{height:72px}.hero{padding-top:90px}.hero h1{font-size:3.05rem}.stats{margin-top:-28px}}

.about-visual{min-height:520px;background:radial-gradient(circle at 30% 25%,rgba(226,196,124,.19),transparent 30%),linear-gradient(145deg,#142831,#071116);display:flex;align-items:center;justify-content:center;position:relative}
.visual-mark{font-size:clamp(7rem,18vw,13rem);font-weight:950;letter-spacing:-.12em;color:rgba(226,196,124,.18);line-height:1}
.visual-lines{position:absolute;inset:12%;border:1px solid var(--sb-line);transform:rotate(8deg)}
.visual-lines:before,.visual-lines:after{content:"";position:absolute;inset:14%;border:1px solid rgba(200,208,213,.16)}
.visual-lines:after{inset:29%;transform:rotate(18deg)}
.visual-caption{position:absolute;left:28px;bottom:24px;color:var(--sb-gold-2);font-size:.72rem;letter-spacing:.18em}
.project-clean{min-height:360px;display:flex;flex-direction:column;justify-content:space-between}
.project-symbol{height:150px;display:flex;align-items:center;justify-content:center;font-size:5rem;color:var(--sb-gold-2);background:radial-gradient(circle,rgba(201,166,90,.14),transparent 62%);border-bottom:1px solid var(--sb-line)}
.route-section{background:linear-gradient(135deg,#071015,#10232c)}
.route-wrap{display:grid;grid-template-columns:1.2fr .8fr;gap:50px;align-items:center}
.route-compass{min-height:380px;border:1px solid var(--sb-line);border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;box-shadow:inset 0 0 70px rgba(201,166,90,.08)}
.route-compass:before,.route-compass:after{content:"";position:absolute;background:var(--sb-line)}
.route-compass:before{width:1px;height:86%;top:7%}.route-compass:after{height:1px;width:86%;left:7%}
.route-compass span{position:absolute;top:22px;color:var(--sb-gold-2);font-weight:900}.route-compass strong{font-size:8rem;color:var(--sb-gold-2);z-index:1}.route-compass small{max-width:220px;text-align:center;letter-spacing:.12em;color:var(--sb-muted);z-index:1}
@media(max-width:1100px){.hero-logo{right:0;top:-15px;width:250px;opacity:.55}.hero-content{padding-top:130px}}
@media(max-width:900px){.route-wrap{grid-template-columns:1fr}.route-compass{max-width:420px;width:100%;aspect-ratio:1;min-height:0;margin:auto}.hero-logo{position:relative;right:auto;top:auto;width:220px;opacity:1;margin-bottom:22px}.hero-content{padding-top:20px}}
