/*
Theme Name: Nexaweb24 Pro
Theme URI: https://nexaweb24.de
Author: Nexaweb24
Description: Full-Service digital agency theme for Nexaweb24 — data analysis, digital marketing, web development.
Version: 1.0
*/

@import url('https://fonts.googleapis.com/css2?family=Sora:wght@600;700;800&family=Manrope:wght@400;500;600;700&family=JetBrains+Mono:wght@500;600&display=swap');

:root{
  --ink:#0E1220; --ink2:#171C33; --ink3:#232948;
  --accent:#4C7CFF; --accent-deep:#2F5FE0; --accent-tint:#E8EEFF;
  --mint:#00C9A0; --mint-tint:#DFF8F1;
  --coral:#FF6B4A;
  --paper:#EEF1FB; --surface:#FFFFFF;
  --line:#DCE1F5;
  --grey:#5B6178; --grey-soft:#8A8FA6;
  --hero-fade:#F3F5FC;
  --shadow: 0 1px 2px rgba(14,18,32,.04), 0 16px 36px -20px rgba(14,18,32,.18);
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--paper);color:var(--ink);font-family:'Manrope',Arial,sans-serif;line-height:1.65;-webkit-font-smoothing:antialiased;}
a{color:inherit;text-decoration:none}
img,svg{max-width:100%}
.wrap{max-width:1160px;margin:0 auto;padding:0 28px}
h1,h2,h3,h4{font-family:'Sora',Arial,sans-serif;font-weight:700;color:var(--ink);text-wrap:balance;letter-spacing:-.01em;}
.mono{font-family:'JetBrains Mono',ui-monospace,monospace;}

/* nav */
header.site{position:sticky;top:0;z-index:60;background:rgba(247,248,251,.9);backdrop-filter:blur(10px);border-bottom:1px solid var(--line);}
.nav-inner{display:flex;align-items:center;justify-content:space-between;padding:16px 28px;gap:20px;}
.brand{display:flex;align-items:center;gap:10px;font-family:'Sora',sans-serif;font-weight:800;font-size:1.15rem;color:var(--ink);}
.brand .dot{width:10px;height:10px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 4px var(--accent-tint);}
nav.primary ul{list-style:none;display:flex;gap:28px;font-size:.92rem;font-weight:600;}
nav.primary a{color:var(--grey);}
nav.primary a:hover{color:var(--ink);}
.btn{display:inline-block;font-family:'Sora',sans-serif;font-weight:700;font-size:.86rem;padding:12px 22px;border-radius:8px;border:2px solid transparent;}
.btn-accent{background:var(--ink);color:#fff;}
.btn-accent:hover{background:var(--accent-deep);}
.btn-outline{border-color:var(--line);color:var(--ink);}
.btn-outline:hover{border-color:var(--ink);}
@media(max-width:880px){nav.primary{display:none;}}

/* hero */
.hero{padding:64px 0 0;position:relative;overflow:hidden;background:linear-gradient(155deg,var(--ink) 0%,var(--ink2) 65%,var(--ink3) 100%);color:#fff;}
.hero::after{content:"";position:absolute;left:0;right:0;bottom:0;height:120px;background:linear-gradient(180deg,transparent,var(--hero-fade));pointer-events:none;}
.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:48px;align-items:center;position:relative;padding-bottom:70px;}
@media(max-width:900px){.hero-grid{grid-template-columns:1fr;}}
.eyebrow{font-family:'JetBrains Mono',monospace;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:#CBDAFF;background:rgba(76,124,255,.18);border:1px solid rgba(76,124,255,.35);display:inline-block;padding:6px 12px;border-radius:20px;margin-bottom:20px;}
.hero h1{color:#fff;font-size:clamp(2.1rem,4.4vw,3.1rem);line-height:1.12;margin-bottom:20px;}
.hero h1 em{font-style:normal;color:#8FB0FF;}
.hero p.lead{font-size:1.1rem;color:#B7BEDB;max-width:52ch;margin-bottom:30px;}
.btnrow{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:30px;}
.hero .btn-outline{border-color:rgba(255,255,255,.3);color:#fff;}
.hero .btn-outline:hover{border-color:#fff;}
.hero .btn-accent{background:var(--accent);}
.hero .btn-accent:hover{background:#6E96FF;}
.platform-row{display:flex;gap:10px;flex-wrap:wrap;align-items:center;font-size:.8rem;color:#9FA6C4;}
.platform-chip{display:flex;align-items:center;gap:6px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.16);padding:6px 12px;border-radius:20px;font-weight:600;color:#E7E9F5;}
.platform-chip svg{width:14px;height:14px;}

.hero-art{position:relative;}
.chart-card{background:var(--surface);border:1px solid var(--line);border-radius:16px;box-shadow:0 30px 60px -20px rgba(0,0,0,.5);padding:26px 26px 20px;}
.chart-card .head{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px;}
.chart-card .head b{font-family:'Sora',sans-serif;font-size:.86rem;}
.chart-card .head span{font-family:'JetBrains Mono',monospace;font-size:.68rem;color:var(--mint);background:var(--mint-tint);padding:3px 9px;border-radius:12px;}

section{padding:70px 0;}
.alt{background:var(--surface);border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
.kicker{font-family:'JetBrains Mono',monospace;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--accent-deep);margin-bottom:10px;}
h2{font-size:clamp(1.6rem,3.2vw,2.1rem);margin-bottom:16px;max-width:26ch;}
.section-lead{color:var(--grey);max-width:64ch;font-size:1.03rem;margin-bottom:34px;}

/* services */
.svc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
@media(max-width:900px){.svc-grid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:640px){.svc-grid{grid-template-columns:1fr;}}
.svc-card{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:26px 24px;box-shadow:var(--shadow);transition:transform .15s,border-color .15s;}
.svc-card:hover{transform:translateY(-3px);border-color:var(--accent);}
.svc-card .ic{width:42px;height:42px;border-radius:10px;background:var(--accent-tint);color:var(--accent-deep);display:flex;align-items:center;justify-content:center;margin-bottom:16px;}
.svc-card .ic svg{width:22px;height:22px;}
.svc-card h3{font-size:1.05rem;margin-bottom:8px;}
.svc-card p{font-size:.88rem;color:var(--grey);}

/* comparison table */
.compare-wrap{overflow-x:auto;margin-top:10px;border:1px solid var(--line);border-radius:14px;background:var(--surface);box-shadow:var(--shadow);}
table.compare{width:100%;border-collapse:collapse;min-width:640px;font-size:.88rem;}
table.compare th{font-family:'Sora',sans-serif;font-size:.82rem;padding:16px 14px;text-align:center;border-bottom:2px solid var(--line);}
table.compare th.row-label-head{text-align:left;}
table.compare th.us{color:var(--accent-deep);background:var(--accent-tint);border-radius:10px 10px 0 0;}
table.compare td{padding:12px 14px;border-bottom:1px solid var(--line);text-align:center;color:var(--grey);}
table.compare td.row-label{text-align:left;color:var(--ink);font-weight:600;}
table.compare td.us{background:var(--accent-tint);}
table.compare tr:last-child td{border-bottom:none;}
.chk{color:var(--mint);font-weight:700;}
.dash{color:var(--line);}

/* process */
.process{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;margin-top:10px;position:relative;}
@media(max-width:860px){.process{grid-template-columns:1fr;}}
.process::before{content:"";position:absolute;top:22px;left:6%;right:6%;height:2px;background:var(--line);}
@media(max-width:860px){.process::before{display:none;}}
.p-step{position:relative;padding:0 12px;}
@media(max-width:860px){.p-step{padding-left:52px;}}
.p-step .num{width:44px;height:44px;border-radius:12px;background:var(--ink);color:#fff;font-family:'Sora',sans-serif;font-weight:700;display:flex;align-items:center;justify-content:center;margin-bottom:16px;position:relative;z-index:1;}
@media(max-width:860px){.p-step .num{position:absolute;left:0;top:0;margin:0;}}
.p-step h3{font-size:1.02rem;margin-bottom:8px;}
.p-step p{font-size:.86rem;color:var(--grey);}

/* careers */
.careers{background:var(--ink);color:#fff;border-radius:20px;padding:48px 40px;display:grid;grid-template-columns:1.3fr .7fr;gap:30px;align-items:center;}
@media(max-width:760px){.careers{grid-template-columns:1fr;padding:34px 26px;}}
.careers h2{color:#fff;}
.careers p{color:#B9BFDA;max-width:56ch;}
.careers .btn-accent{background:var(--accent);}
.careers .btn-accent:hover{background:var(--accent-deep);}

/* blog preview */
.blog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:10px;}
@media(max-width:860px){.blog-grid{grid-template-columns:1fr;}}
.blog-card{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:22px;box-shadow:var(--shadow);}
.blog-card .date{font-family:'JetBrains Mono',monospace;font-size:.68rem;color:var(--grey-soft);text-transform:uppercase;letter-spacing:.05em;margin-bottom:10px;}
.blog-card h3{font-size:1rem;margin-bottom:8px;}
.blog-card p{font-size:.86rem;color:var(--grey);margin-bottom:12px;}
.blog-card a.readmore{font-size:.82rem;font-weight:700;color:var(--accent-deep);}

/* final CTA */
.cta-band{background:linear-gradient(120deg,var(--ink) 0%,var(--ink2) 100%);color:#fff;border-radius:20px;padding:52px 40px;text-align:center;}
.cta-band h2{color:#fff;margin-left:auto;margin-right:auto;}
.cta-band p{color:#B9BFDA;margin:0 auto 26px;max-width:52ch;}

/* footer */
footer.site{background:var(--ink);color:#9AA0BE;padding:48px 0 26px;font-size:.86rem;}
.foot-grid{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:32px;margin-bottom:30px;}
@media(max-width:700px){.foot-grid{grid-template-columns:1fr;}}
.foot-grid h5{color:#fff;font-family:'Sora',sans-serif;font-size:.8rem;letter-spacing:.04em;text-transform:uppercase;margin-bottom:14px;}
.foot-grid .brand{color:#fff;margin-bottom:10px;}
.foot-grid ul{list-style:none;}
.foot-grid li{margin-bottom:8px;}
.foot-grid a:hover{color:#fff;}
.foot-bottom{border-top:1px solid rgba(255,255,255,.1);padding-top:20px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;font-size:.78rem;color:#767c9c;}

/* generic page (contact / legal) */
.page-hero{padding:56px 0 20px;}
.page-hero h1{font-size:clamp(1.8rem,4vw,2.5rem);}
.page-content{max-width:74ch;font-size:1rem;color:var(--ink3);}
.page-content h2{margin-top:30px;font-size:1.3rem;}
.page-content p{margin-bottom:16px;}
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:start;}
@media(max-width:800px){.contact-grid{grid-template-columns:1fr;}}
.contact-card{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:26px;box-shadow:var(--shadow);}
.contact-card b{display:block;font-family:'Sora',sans-serif;margin-bottom:4px;}
.contact-card p{margin-bottom:14px;color:var(--grey);}
.placeholder-note{background:var(--accent-tint);border:1px dashed var(--accent);border-radius:10px;padding:14px 18px;font-size:.86rem;color:var(--accent-deep);margin:18px 0;}

/* blog listing / single */
.post-list{display:grid;gap:24px;max-width:74ch;}
.post-item{border-bottom:1px solid var(--line);padding-bottom:24px;}
.post-item .date{font-family:'JetBrains Mono',monospace;font-size:.7rem;color:var(--grey-soft);text-transform:uppercase;letter-spacing:.05em;margin-bottom:8px;}
.post-item h2{font-size:1.3rem;margin-bottom:8px;}
.single-post{max-width:74ch;}
.single-post .date{font-family:'JetBrains Mono',monospace;font-size:.75rem;color:var(--grey-soft);margin-bottom:16px;}
.single-post .content{font-size:1.02rem;}
.single-post .content p{margin-bottom:18px;}
