/* __WHITEPAGE_V2__ site=opencode.gr.com generated=2026-04-21 palette=midnight-terminal+lime-cursor+cool-slate */
:root{
  --deep:#0D1321;
  --deep-2:#131B2B;
  --brand:#84E55A;
  --brand-ink:#0D1321;
  --accent:#6BD4E0;
  --light:#F5F7FB;
  --paper:#FFFFFF;
  --muted:#8B95A5;
  --line:#1F2A3D;
  --text:#1A1F2E;
  --text-inv:#F2F5F7;
  --max:1180px;
  --radius:2px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:'IBM Plex Sans',system-ui,-apple-system,sans-serif;color:var(--text);background:var(--paper);line-height:1.6;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block;height:auto}
a{color:inherit}
section{content-visibility:auto;contain-intrinsic-size:1px 800px}
:focus-visible{outline:2px solid var(--brand);outline-offset:3px}
@media (prefers-reduced-motion: reduce){*{animation-duration:.01ms!important;transition-duration:.01ms!important}}
@media print{.topbar,.footer-wide,.cta-card{display:none}}

/* ---- atomic utilities ---- */
.wrap{max-width:var(--max);margin:0 auto;padding:0 24px}
.flex{display:flex}.f-col{flex-direction:column}.f-center{align-items:center;justify-content:center}.f-between{justify-content:space-between;align-items:center}.f-wrap{flex-wrap:wrap}
.grid-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.grid-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.grid-4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}
.grid-5{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:24px}
.gap-3{gap:12px}.gap-4{gap:16px}.gap-6{gap:24px}.gap-8{gap:32px}
.p-4{padding:16px}.p-6{padding:24px}.p-8{padding:32px}
.py-4{padding-top:16px;padding-bottom:16px}.py-6{padding-top:24px;padding-bottom:24px}.py-8{padding-top:32px;padding-bottom:32px}.py-12{padding-top:48px;padding-bottom:48px}.py-16{padding-top:64px;padding-bottom:64px}
.mt-2{margin-top:8px}.mt-4{margin-top:16px}.mt-6{margin-top:24px}.mt-8{margin-top:32px}.mt-12{margin-top:48px}
.mb-2{margin-bottom:8px}.mb-4{margin-bottom:16px}.mb-6{margin-bottom:24px}.mb-8{margin-bottom:32px}
.txt-sm{font-size:14px}.txt-lg{font-size:18px}.txt-xl{font-size:22px}.txt-2xl{font-size:28px;line-height:1.25}.txt-3xl{font-size:36px;line-height:1.2}.txt-4xl{font-size:48px;line-height:1.12;letter-spacing:-.02em}
.w-400{font-weight:400}.w-500{font-weight:500}.w-600{font-weight:600}.w-700{font-weight:700}
.c-white{color:#fff}.c-muted{color:var(--muted)}.c-brand{color:var(--brand)}.c-text{color:var(--text)}
.bg-deep{background:var(--deep);color:var(--text-inv)}
.bg-brand{background:var(--brand);color:var(--brand-ink)}
.bg-accent{background:var(--accent);color:var(--brand-ink)}
.bg-light{background:var(--light)}
.t-up{text-transform:uppercase;letter-spacing:.12em;font-size:12px}

/* ---- topbar / nav-pills ---- */
.topbar{position:sticky;top:0;z-index:20;background:rgba(13,19,33,.94);backdrop-filter:blur(10px);border-bottom:1px solid #1F2A3D;color:var(--text-inv)}
.topbar .wrap{display:flex;align-items:center;justify-content:space-between;height:72px}
.brand-wordmark{display:inline-flex;align-items:center;gap:10px;text-decoration:none;color:#fff;font-weight:700;font-size:20px;letter-spacing:-.02em}
.brand-wordmark::before{content:"{}";display:inline-block;width:28px;height:28px;border:1.5px solid var(--brand);color:var(--brand);border-radius:var(--radius);font-family:'IBM Plex Mono',monospace;font-size:14px;display:inline-flex;align-items:center;justify-content:center}
.nav-pills{display:flex;gap:4px;list-style:none;align-items:center}
.nav-pill{text-decoration:none;color:#CCD3DF;padding:8px 14px;border-radius:999px;font-size:14px;font-weight:500;transition:background .15s}
.nav-pill:hover{background:#1F2A3D;color:#fff}
.nav-pill--cta{background:var(--brand);color:var(--brand-ink);padding:10px 18px;font-weight:600}
.nav-pill--cta:hover{background:#9AEE72;color:var(--brand-ink)}
@media (max-width:860px){.nav-pills{display:none}.nav-pills--mobile{display:flex;flex-wrap:wrap;gap:4px}}

/* ---- masthead ---- */
.masthead{position:relative;background:radial-gradient(1200px 600px at 80% 20%, rgba(132,229,90,.14), transparent 60%), linear-gradient(160deg, #0D1321 0%, #131B2B 48%, #0D1321 100%);color:var(--text-inv);padding:96px 0 80px;overflow:hidden}
.masthead::before{content:"";position:absolute;inset:0;background-image:repeating-linear-gradient(0deg,rgba(132,229,90,.04) 0,rgba(132,229,90,.04) 1px,transparent 1px,transparent 40px),repeating-linear-gradient(90deg,rgba(132,229,90,.04) 0,rgba(132,229,90,.04) 1px,transparent 1px,transparent 40px);pointer-events:none}
.masthead .wrap{position:relative;text-align:center}
.masthead h1{font-size:clamp(40px,6vw,64px);line-height:1.06;letter-spacing:-.02em;font-weight:700;max-width:900px;margin:0 auto 20px}
.masthead .lead{font-size:20px;color:#CCD3DF;max-width:720px;margin:0 auto 32px}
.masthead .ctas{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.masthead--sub{padding:64px 0 56px}
.masthead--sub h1{font-size:clamp(32px,4.5vw,44px);max-width:820px}
.btn{display:inline-flex;align-items:center;gap:8px;padding:14px 24px;border-radius:2px;font-weight:600;text-decoration:none;font-size:15px;transition:transform .1s,background .15s;border:1px solid transparent}
.btn--primary{background:var(--brand);color:var(--brand-ink)}
.btn--primary:hover{background:#9AEE72;transform:translateY(-1px)}
.btn--ghost{background:transparent;color:#fff;border:1px solid #3A4A66}
.btn--ghost:hover{background:#1F2A3D}

/* ---- stats ---- */
.stats{background:#0A0F1A;color:var(--text-inv);padding:56px 0;border-block:1px solid #1F2A3D}
.stats .grid-4{gap:16px}
.stat{padding:16px;border-left:2px solid var(--brand)}
.stat__value{font-size:40px;font-weight:700;line-height:1;letter-spacing:-.02em;color:var(--brand);font-family:'IBM Plex Mono',monospace}
.stat__label{color:#B2BCCC;font-size:14px;margin-top:8px;letter-spacing:.02em}

/* ---- product grid ---- */
.products{padding:88px 0}
.products h2{font-size:34px;margin-bottom:8px;letter-spacing:-.02em;font-weight:700}
.products .kicker{color:var(--muted);font-size:14px;letter-spacing:.12em;text-transform:uppercase;font-weight:600;margin-bottom:10px}
.product{background:var(--paper);border:1px solid #E1E6EF;padding:28px;border-radius:var(--radius);transition:border-color .15s,transform .15s;display:flex;flex-direction:column;gap:12px;height:100%}
.product:hover{border-color:var(--deep);transform:translateY(-2px)}
.product__icon{width:40px;height:40px;display:flex;align-items:center;justify-content:center;background:var(--light);border-radius:2px;color:var(--deep)}
.product h3{font-size:19px;letter-spacing:-.01em;font-weight:600}
.product p{color:#44506B;font-size:15px}
.product a.more{color:var(--deep);text-decoration:none;font-weight:600;margin-top:auto;border-bottom:1px solid var(--deep);align-self:flex-start;padding-bottom:2px;font-size:14px}
.product a.more:hover{color:#2C6B1F;border-color:#2C6B1F}

/* ---- trust + compliance ---- */
.trust{background:var(--light);padding:72px 0;border-block:1px solid #E1E6EF}
.trust h2{font-size:28px;margin-bottom:16px;font-weight:700}
.trust p{color:#44506B;font-size:15px}
.trust ul{list-style:none;padding:0;margin-top:12px}
.trust ul li{padding:6px 0;font-size:14px;color:#44506B;border-bottom:1px dashed #D3DAE4}
.trust ul li strong{color:var(--text)}
.cert-row{display:flex;flex-wrap:wrap;gap:10px;margin-top:24px}
.cert{background:#fff;border:1px solid #E1E6EF;padding:8px 14px;border-radius:2px;font-size:12px;color:#44506B;display:inline-flex;align-items:center;gap:8px;font-family:'IBM Plex Mono',monospace;text-transform:uppercase;letter-spacing:.05em}

/* ---- testimonials ---- */
.quotes{padding:88px 0}
.quotes h2{font-size:30px;margin-bottom:32px;font-weight:700}
.quote{background:var(--paper);padding:28px;border:1px solid #E1E6EF;border-radius:var(--radius);display:flex;flex-direction:column;gap:16px}
.quote--featured{background:var(--deep);color:var(--text-inv);grid-column:span 2;border:none;padding:40px}
.quote--featured p{font-size:22px;line-height:1.4;font-weight:500}
.quote--mini{padding:20px;font-size:14px}
.quote__body{flex:1}
.quote__body::before{content:"\201C";display:block;font-size:48px;line-height:0.6;font-family:Georgia,serif;color:var(--brand);margin-bottom:8px}
.quote--mini .quote__body::before{font-size:32px;color:var(--deep)}
.quote__attr{font-weight:600;font-size:13px;color:inherit;opacity:.9;border-top:1px solid rgba(255,255,255,.1);padding-top:14px;margin-top:auto}
.quote:not(.quote--featured) .quote__attr{color:#44506B;border-color:#E1E6EF}

/* ---- CTA card ---- */
.cta-card{background:linear-gradient(105deg,#0D1321 0%,#1A2A1A 100%);color:var(--text-inv);padding:64px 48px;border-radius:var(--radius);margin:64px 0;text-align:center;border:1px solid var(--brand)}
.cta-card h2{font-size:32px;margin-bottom:14px;font-weight:700;letter-spacing:-.01em}
.cta-card p{color:#CCD3DF;margin-bottom:24px;max-width:600px;margin-inline:auto}

/* ---- FAQ (flat, variant V2 style) ---- */
.faq{padding:88px 0;background:var(--light);border-block:1px solid #E1E6EF}
.faq h2{font-size:30px;margin-bottom:12px;font-weight:700;letter-spacing:-.01em}
.faq__intro{color:#44506B;margin-bottom:36px;max-width:640px}
.faq__item{background:var(--paper);border:1px solid #E1E6EF;border-radius:var(--radius);padding:24px 28px;margin-bottom:10px}
.faq__q{font-weight:600;font-size:17px;color:var(--deep);margin-bottom:10px;display:flex;gap:12px;align-items:baseline}
.faq__q::before{content:"Q.";font-family:'IBM Plex Mono',monospace;color:var(--brand);font-weight:700;font-size:13px;flex-shrink:0}
.faq__a{color:#44506B;font-size:15px;line-height:1.65;padding-left:24px}
.faq__a a{color:var(--deep);text-decoration:underline;text-underline-offset:3px}

/* ---- breadcrumbs ---- */
.crumbs{padding:20px 0;background:var(--light);border-bottom:1px solid #E1E6EF;font-size:13px;color:#44506B}
.crumbs ol{list-style:none;display:flex;gap:8px;flex-wrap:wrap}
.crumbs li::after{content:"/";margin-left:8px;color:var(--muted)}
.crumbs li:last-child::after{display:none}
.crumbs a{color:var(--deep);text-decoration:none}
.crumbs a:hover{text-decoration:underline}

/* ---- content prose ---- */
.content{padding:64px 0}
.content .lead-callout{background:var(--light);border-left:3px solid var(--brand);padding:22px 28px;margin:24px 0 40px;border-radius:0 var(--radius) var(--radius) 0}
.content .lead-callout h3{font-size:13px;letter-spacing:.1em;text-transform:uppercase;color:var(--deep);margin-bottom:8px;font-family:'IBM Plex Mono',monospace;font-weight:600}
.content .lead-callout p{font-size:17px;color:#2C3342}
.content h2{font-size:28px;margin-top:48px;margin-bottom:14px;letter-spacing:-.01em;font-weight:700;color:var(--text)}
.content h3{font-size:20px;margin-top:32px;margin-bottom:10px;font-weight:600}
.content p{margin-bottom:18px;font-size:16px;color:#2C3342}
.content ul,.content ol{margin:16px 0 22px 22px}
.content li{margin-bottom:8px;color:#2C3342}
.content a{color:var(--deep);text-decoration:underline;text-underline-offset:3px}
.content pre{background:var(--deep);color:#DEE4EC;padding:20px;border-radius:var(--radius);font-family:'IBM Plex Mono',monospace;font-size:14px;overflow-x:auto;margin:18px 0}
.content code{background:var(--light);color:var(--deep);padding:2px 6px;border-radius:2px;font-size:14px;font-family:'IBM Plex Mono',monospace}
.data-table{width:100%;border-collapse:collapse;margin:24px 0;font-size:14px;border:1px solid #E1E6EF}
.data-table th,.data-table td{padding:12px 14px;text-align:left;border-bottom:1px solid #E1E6EF;vertical-align:top}
.data-table th{background:var(--light);font-weight:600;color:var(--deep);letter-spacing:.02em}
.data-table tr:nth-child(even) td{background:#FBFCFD}
.content .related-block{margin-top:56px;padding:32px;background:var(--light);border-radius:var(--radius);border:1px solid #E1E6EF}
.content .related-block h3{margin-top:0;font-size:17px;color:var(--deep);font-weight:700}
.content .related-block ul{display:grid;grid-template-columns:repeat(2,1fr);gap:6px 28px;list-style:none;margin:14px 0 0 0;padding:0}
.content .related-block li{margin-bottom:4px;padding-left:16px;position:relative}
.content .related-block li::before{content:">";position:absolute;left:0;color:var(--brand);font-weight:700}
.content .related-block li a{text-decoration:none;color:var(--text);font-size:14px}
.content .related-block li a:hover{color:var(--deep);text-decoration:underline}

/* ---- footer-wide ---- */
.footer-wide{background:var(--deep);color:#B2BCCC;padding:72px 0 36px}
.footer-wide .grid-5{gap:32px}
.footer-wide h4{color:#fff;font-size:13px;letter-spacing:.12em;text-transform:uppercase;margin-bottom:16px;font-weight:600;font-family:'IBM Plex Mono',monospace}
.footer-wide ul{list-style:none;padding:0}
.footer-wide li{margin-bottom:8px}
.footer-wide a{color:#B2BCCC;text-decoration:none;font-size:14px}
.footer-wide a:hover{color:var(--brand)}
.footer-brand{color:#fff;font-weight:700;font-size:20px;margin-bottom:12px;font-family:'IBM Plex Sans',sans-serif}
.footer-col p{font-size:14px;line-height:1.65;color:#8B95A5}
.footer-legal{border-top:1px solid #1F2A3D;padding-top:24px;margin-top:48px;color:#6A7489;font-size:12px;text-align:center}
.footer-legal a{color:#B2BCCC;margin:0 6px}

@media (max-width:860px){
  .grid-2,.grid-3,.grid-4,.grid-5{grid-template-columns:1fr}
  .quote--featured{grid-column:span 1;padding:28px}
  .quote--featured p{font-size:18px}
  .masthead{padding:64px 0 56px}
  .masthead h1{font-size:36px}
  .masthead .lead{font-size:16px}
  .products,.quotes,.faq{padding:56px 0}
  .cta-card{padding:40px 24px}
  .stat__value{font-size:30px}
  .content .related-block ul{grid-template-columns:1fr}
}
