/*
Theme Name: Midori Web
Theme URI: https://midoriweb.io
Author: Midori Web
Author URI: https://midoriweb.io
Description: Premium, lightweight Gutenberg-first theme for Midori Web (UK Magento Performance & Stability Specialists). Dark, fast, conversion-focused.
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: midoriweb
Tags: one-column, custom-logo, custom-menu, featured-images, block-styles
*/

:root{
  --mw-bg:#0b1220;
  --mw-bg2:#0f1930;
  --mw-surface:rgba(255,255,255,.04);
  --mw-surface2:rgba(255,255,255,.02);
  --mw-text:#e9eefb;
  --mw-muted:#b7c3e2;
  --mw-accent:#39d98a;
  --mw-accent2:#4aa3ff;
  --mw-border:rgba(255,255,255,.10);
  --mw-shadow: 0 12px 40px rgba(0,0,0,.35);
  --mw-radius:16px;
  --mw-max:1160px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family: system-ui,-apple-system,Segoe UI,Roboto,Inter,Arial,sans-serif;
  color:var(--mw-text);
  background:
    radial-gradient(1200px 700px at 70% 10%, rgba(74,163,255,.18), transparent 55%),
    radial-gradient(900px 600px at 20% 30%, rgba(57,217,138,.12), transparent 55%),
    linear-gradient(180deg, var(--mw-bg), var(--mw-bg2));
  line-height:1.55;
}
a{color:inherit; text-decoration:none}
a:hover{opacity:.92}
img{max-width:100%; height:auto}
p{margin:0 0 14px}
ul{margin:0; padding-left:18px}

.mw-container{max-width:var(--mw-max); margin:0 auto; padding:0 18px}
.mw-section{padding:64px 0}
@media(min-width:980px){ .mw-section{padding:84px 0} }

.mw-card{
  background: linear-gradient(180deg, var(--mw-surface), var(--mw-surface2));
  border:1px solid var(--mw-border);
  border-radius:var(--mw-radius);
  box-shadow: var(--mw-shadow);
  backdrop-filter: blur(8px);
}

.mw-badge{
  display:inline-flex; align-items:center; gap:8px;
  padding:6px 10px;
  border:1px solid var(--mw-border);
  border-radius:999px;
  color:var(--mw-muted);
  font-size:13px;
}

.mw-h1{font-size:clamp(30px,4.2vw,54px); line-height:1.06; margin:12px 0}
.mw-h2{font-size:clamp(22px,2.6vw,36px); margin:0 0 12px}
.mw-h3{font-size:18px; margin:0 0 10px}
.mw-p{color:var(--mw-muted); font-size:16.5px}

.mw-hero{padding:52px 0 22px}
@media(min-width:980px){ .mw-hero{padding:86px 0 42px} }
.mw-hero-inner{display:grid; gap:22px; align-items:center}
@media(min-width:1020px){ .mw-hero-inner{grid-template-columns: 1.15fr .85fr} }

.mw-cta-row{display:flex; flex-wrap:wrap; gap:12px; margin-top:16px}
.mw-btn{
  display:inline-flex; align-items:center; justify-content:center;
  padding:12px 16px; border-radius:12px;
  border:1px solid var(--mw-border);
  font-weight:700;
  background: rgba(255,255,255,.04);
}
.mw-btn.primary{
  background: linear-gradient(180deg, rgba(57,217,138,.95), rgba(25,170,110,.95));
  color:#061017; border-color: rgba(57,217,138,.55);
}
.mw-btn.secondary{
  background: rgba(74,163,255,.12);
  border-color: rgba(74,163,255,.30);
}

.mw-grid{display:grid; gap:18px}
@media(min-width:900px){ .mw-grid.cols-3{grid-template-columns:repeat(3,1fr)} .mw-grid.cols-2{grid-template-columns:repeat(2,1fr)} }

.mw-kpi{padding:16px}
.mw-kpi small{color:var(--mw-muted)}
.mw-kpi strong{display:block; font-size:28px; margin-top:4px}

.mw-nav{
  position:sticky; top:0; z-index:99;
  background: rgba(11,18,32,.78);
  backdrop-filter: blur(12px);
  border-bottom:1px solid var(--mw-border);
}
.mw-nav-inner{display:flex; align-items:center; justify-content:space-between; padding:12px 0; gap:12px}
.mw-logo{display:flex; align-items:center; gap:10px; font-weight:900; letter-spacing:.4px}
.mw-logo-mark{
  width:28px; height:28px; border-radius:8px;
  background: linear-gradient(145deg, rgba(57,217,138,.95), rgba(74,163,255,.80));
  box-shadow: 0 10px 26px rgba(74,163,255,.12);
}
.mw-menu{display:flex; align-items:center; gap:14px; flex-wrap:wrap}
.mw-menu a{color:var(--mw-muted); font-weight:700; font-size:14px}
.mw-menu a:hover{color:var(--mw-text)}

.mw-footer{padding:34px 0; border-top:1px solid var(--mw-border); color:var(--mw-muted)}
.mw-note{font-size:13px; color:var(--mw-muted)}

.entry-content{color:var(--mw-text)}
.entry-content p{color:var(--mw-muted)}
.entry-content h2,.entry-content h3,.entry-content h4{color:var(--mw-text)}
.entry-content a{color:var(--mw-accent2); text-decoration:underline; text-underline-offset:3px}
.entry-content a:hover{opacity:.95}

input, textarea, select{
  width:100%;
  padding:12px 12px;
  border-radius:12px;
  border:1px solid var(--mw-border);
  background: rgba(255,255,255,.03);
  color: var(--mw-text);
}
label{display:block; font-weight:700; margin:10px 0 6px}
button, input[type="submit"]{
  cursor:pointer;
  padding:12px 16px;
  border-radius:12px;
  border:1px solid rgba(57,217,138,.55);
  background: linear-gradient(180deg, rgba(57,217,138,.95), rgba(25,170,110,.95));
  color:#061017;
  font-weight:800;
}
/* ===== Dropdown Menu ===== */

.mw-menu {
  position: relative;
}

.mw-menu li {
  list-style: none;
  position: relative;
}

.mw-menu > li {
  display: inline-block;
}

.mw-menu li ul {
  display: none;
  position: absolute;
  top: 100%;
  left: 0;
  background: #0f1930;
  border: 1px solid var(--mw-border);
  border-radius: 12px;
  padding: 10px 0;
  min-width: 220px;
  box-shadow: var(--mw-shadow);
  z-index: 999;
}

.mw-menu li:hover > ul {
  display: block;
}

.mw-menu li ul li {
  display: block;
}

.mw-menu li ul li a {
  display: block;
  padding: 10px 18px;
  color: var(--mw-muted);
}

.mw-menu li ul li a:hover {
  background: rgba(255,255,255,.04);
  color: var(--mw-text);
}
.mw-nav-inner { flex-wrap: wrap; }
@media (min-width: 980px){
  .mw-nav-inner { flex-wrap: nowrap; }
  .mw-menu { gap: 16px; }
}
/* Services page niceties */
.mw-card ul { margin-top: 10px; }
.mw-card ul li { margin: 8px 0; }
.mw-btn { white-space: nowrap; } /* prevents ugly button wraps */
/* Elevate hero section */
.mw-card:first-of-type {
  padding: 38px !important;
}

.mw-card:first-of-type .mw-h1 {
  font-size: clamp(36px,4.8vw,58px);
  line-height: 1.04;
}

.mw-card:first-of-type {
  background: linear-gradient(
    135deg,
    rgba(74,163,255,.18),
    rgba(57,217,138,.10)
  );
}
/* Card hover lift */
.mw-grid .mw-card {
  transition: transform .25s ease, box-shadow .25s ease;
}

.mw-grid .mw-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 20px 60px rgba(0,0,0,.45);
}
.mw-btn.secondary {
  background: rgba(74,163,255,.18);
  border-color: rgba(74,163,255,.45);
}
/* Homepage polish */
.mw-kpi { text-align: left; }
.mw-kpi strong { letter-spacing: .2px; }