
:root{
  --modern-blue:#3f628f;
  --modern-navy:#1d3150;
  --modern-green:#166D3B;
  --modern-accent:#C94F4F;
  --modern-cream:#fffaf0;
  --modern-cream-2:#f7efe2;
  --modern-panel:#ffffff;
  --modern-border:rgba(29,49,80,.10);
  --modern-shadow:0 22px 54px rgba(30,41,59,.10);
  --modern-shadow-soft:0 12px 30px rgba(30,41,59,.08);
}
body.theme-modern{
  background:
    radial-gradient(circle at top left, rgba(201,79,79,.08), transparent 28%),
    radial-gradient(circle at top right, rgba(74,111,165,.11), transparent 32%),
    linear-gradient(180deg, #fffdf9 0%, var(--modern-cream) 45%, #f8f1e6 100%);
  color:#1f2a3d;
}
body.theme-modern .topBar{
  background:linear-gradient(90deg, var(--modern-navy), var(--modern-blue));
  box-shadow:inset 0 -1px 0 rgba(255,255,255,.08);
}
body.theme-modern .siteHeader{
  background:rgba(255,250,240,.88);
  border-bottom:1px solid rgba(29,49,80,.08);
  box-shadow:0 8px 28px rgba(30,41,59,.05);
}
body.theme-modern .siteHeader__inner{min-height:88px}
body.theme-modern .brandLogo{
  width:64px;height:64px;border-radius:20px;
  background:linear-gradient(180deg,#fff,#fff6ef);
  box-shadow:0 14px 26px rgba(31,42,61,.10);
}
body.theme-modern .brandName{font-size:28px;color:var(--modern-navy)}
body.theme-modern .brandMeta{color:#5f6d82;font-size:12px;letter-spacing:.04em;text-transform:uppercase}
body.theme-modern .nav a,.theme-modern .mobileNav a{
  border:1px solid transparent;
  font-weight:900;
}
body.theme-modern .nav a:hover,
body.theme-modern .nav a.is-active,
body.theme-modern .mobileNav a:hover{
  background:rgba(74,111,165,.08);
  color:var(--modern-navy);
  border-color:rgba(74,111,165,.12);
}
body.theme-modern .btn{
  border-radius:16px;
  box-shadow:var(--modern-shadow-soft);
  font-weight:900;
}
body.theme-modern .btn.primary{
  background:linear-gradient(180deg, #d86a67, var(--modern-accent));
  border-color:rgba(201,79,79,.35);
}
body.theme-modern .btn.ghost{
  background:rgba(255,255,255,.85);
  color:var(--modern-navy);
  border-color:rgba(29,49,80,.10);
}
body.theme-modern .burger{
  background:linear-gradient(180deg,#fff,#fff6ef);
  border-color:rgba(29,49,80,.10);
  box-shadow:var(--modern-shadow-soft);
}
body.theme-modern .burger em{color:var(--modern-navy)}
body.theme-modern .heroSection{
  padding:44px 0 46px;
  background:
    linear-gradient(135deg, rgba(63,98,143,.96), rgba(29,49,80,.97)),
    linear-gradient(45deg, rgba(201,79,79,.22), transparent 52%);
  position:relative;
}
body.theme-modern .heroSection::before{
  content:"";
  position:absolute;inset:0;
  background:
    radial-gradient(circle at 18% 24%, rgba(255,255,255,.12), transparent 18%),
    radial-gradient(circle at 85% 20%, rgba(201,79,79,.16), transparent 18%),
    radial-gradient(circle at 72% 80%, rgba(255,255,255,.09), transparent 14%);
  pointer-events:none;
}
body.theme-modern .heroBanner{
  position:relative;z-index:1;
  grid-template-columns:minmax(0,1.2fr) minmax(280px,.8fr);
  gap:28px;
}
body.theme-modern .heroBanner__content{
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.10);
  padding:28px;
  border-radius:28px;
  box-shadow:0 20px 40px rgba(13,24,42,.12);
}
body.theme-modern .heroEyebrow{
  display:inline-flex;align-items:center;gap:8px;
  padding:8px 12px;
  border-radius:999px;
  background:rgba(255,255,255,.10);
  font-size:12px;
  text-transform:uppercase;
  letter-spacing:.08em;
}
body.theme-modern .heroBanner h1{font-size:58px;max-width:11ch;margin-bottom:14px}
body.theme-modern .heroBanner p{font-size:18px;max-width:54ch;color:rgba(255,255,255,.92)}
body.theme-modern .heroActions{margin-top:28px}
body.theme-modern .heroSidebar{gap:14px}
body.theme-modern .sideAction{
  border:1px solid rgba(255,255,255,.12);
  background:linear-gradient(180deg, rgba(255,255,255,.97), rgba(255,248,241,.98));
  color:var(--modern-navy);
  border-radius:22px;
  box-shadow:0 18px 35px rgba(16,26,43,.18);
}
body.theme-modern .sideAction strong{font-size:19px}
body.theme-modern .sideAction span{color:#68758a}
body.theme-modern .appWrap{padding:38px 0 54px}
body.theme-modern .contentGrid{gap:28px;align-items:start}
body.theme-modern .card{
  background:linear-gradient(180deg, rgba(255,255,255,.95), rgba(255,252,247,.97));
  border:1px solid var(--modern-border);
  border-radius:28px;
  box-shadow:var(--modern-shadow);
}
body.theme-modern .sectionCard::before{
  top:22px;bottom:22px;width:7px;
  background:linear-gradient(180deg, var(--modern-accent), #df8b63);
  box-shadow:0 10px 22px rgba(201,79,79,.28);
}
body.theme-modern .sectionCard .cardPad{padding:28px 28px 28px 32px}
body.theme-modern .sectionTitle,
body.theme-modern .cardTitle{font-size:30px;color:var(--modern-navy);margin-bottom:14px}
body.theme-modern .lead{font-size:17px;line-height:1.8;color:#5e6d82}
body.theme-modern .quoteBox{
  background:linear-gradient(135deg, rgba(74,111,165,.07), rgba(201,79,79,.10));
  border:1px solid rgba(74,111,165,.10);
  border-left:6px solid var(--modern-accent);
  border-radius:22px;
  color:var(--modern-navy);
  font-size:21px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.55);
}
body.theme-modern .table thead th{color:#738196}
body.theme-modern .table td{border-bottom:1px solid rgba(29,49,80,.08)}
body.theme-modern .table tr:hover td{background:rgba(74,111,165,.035)}
body.theme-modern .contactCard{border-bottom:1px dashed rgba(29,49,80,.14)}
body.theme-modern .contactCard b{color:#79879b}
body.theme-modern .contactCard span,
body.theme-modern .contactCard a{color:var(--modern-navy)}
body.theme-modern .formGrid .input,
body.theme-modern textarea,
body.theme-modern select{
  border-radius:16px;
  border-color:rgba(29,49,80,.10);
  background:rgba(255,255,255,.95);
}
body.theme-modern .input:focus,
body.theme-modern textarea:focus,
body.theme-modern select:focus{
  border-color:rgba(74,111,165,.42);
  box-shadow:0 0 0 4px rgba(74,111,165,.10);
}
body.theme-modern .footer{
  background:linear-gradient(135deg, var(--modern-navy), var(--modern-blue));
  margin-top:22px;
}
body.theme-modern .footerCopy{border-top-color:rgba(255,255,255,.18)}
body.theme-modern .authCard,.theme-modern .kpi,.theme-modern .tile{
  background:linear-gradient(180deg,#fff,#fff9f1);
  border-color:rgba(29,49,80,.08);
  box-shadow:var(--modern-shadow-soft);
}
body.theme-modern .tileIcon{
  border-radius:16px;
  background:linear-gradient(135deg, rgba(74,111,165,.10), rgba(201,79,79,.10));
}
body.theme-modern .pageTable{border-radius:24px}
body.theme-modern .mobileNav{
  background:rgba(255,251,245,.98);
  border-color:rgba(29,49,80,.10);
  box-shadow:0 18px 40px rgba(31,42,61,.15);
}
body.theme-modern .mobileNav a{
  border-radius:16px;
  background:linear-gradient(180deg,#fff,#fff8f2);
}
body.theme-modern .infoList>div{border-bottom:1px dashed rgba(29,49,80,.12)}
body.theme-modern .kpi .value{color:var(--modern-navy)}
body.theme-modern .badge.ok{background:rgba(22,109,59,.10);color:var(--modern-green)}
body.theme-modern .badge.bad{background:rgba(201,79,79,.12);color:#8d2f2f}
body.theme-modern .badge.warn{background:rgba(211,138,60,.12);color:#9a5c17}
body.theme-modern .heroSection .btn.ghost{background:rgba(255,255,255,.10);color:#fff;border-color:rgba(255,255,255,.18)}
body.theme-modern .heroSection .btn.ghost:hover{background:rgba(255,255,255,.16)}
@media (max-width:1040px){
  body.theme-modern .heroBanner{grid-template-columns:1fr}
  body.theme-modern .heroBanner__content{padding:24px}
  body.theme-modern .heroBanner h1{font-size:48px;max-width:none}
}
@media (max-width:760px){
  body.theme-modern .siteHeader__inner{min-height:72px}
  body.theme-modern .brandName{font-size:18px}
  body.theme-modern .heroSection{padding:20px 0 24px}
  body.theme-modern .heroBanner__content{padding:18px 18px 20px;border-radius:22px}
  body.theme-modern .heroEyebrow{font-size:11px;padding:7px 11px}
  body.theme-modern .heroBanner h1{font-size:32px;line-height:1.08}
  body.theme-modern .heroBanner p{font-size:15px;line-height:1.65}
  body.theme-modern .sideAction{padding:16px 16px 18px}
  body.theme-modern .sectionCard .cardPad{padding:20px 18px 20px 24px}
  body.theme-modern .sectionCard::before{top:16px;bottom:16px;width:6px}
  body.theme-modern .sectionTitle,
  body.theme-modern .cardTitle{font-size:22px}
  body.theme-modern .quoteBox{font-size:17px;padding:18px}
}
@media (max-width:560px){
  body.theme-modern .container{padding:0 12px}
  body.theme-modern .brandLogo{width:46px;height:46px;border-radius:14px}
  body.theme-modern .brandName{font-size:16px}
  body.theme-modern .burger{width:56px;height:56px}
  body.theme-modern .mobileNav{left:8px;right:8px;top:70px;padding:10px}
  body.theme-modern .heroBanner{gap:12px}
  body.theme-modern .heroBanner h1{font-size:28px}
  body.theme-modern .heroActions .btn,
  body.theme-modern .heroSidebar .sideAction{width:100%}
  body.theme-modern .card,
  body.theme-modern .authCard{border-radius:22px}
}
