:root{
  --bg:#f4f7fb;
  --panel:#ffffff;
  --muted:#56647a;
  --text:#1b2a41;
  --heading:#0f1f35;
  --accent:#f59e0b;
  --accent-strong:#d97706;
  --accent-soft:#fff3dc;
  --border:#d6e0ec;
  --shadow:0 14px 36px rgba(20, 35, 62, .10);
  --radius:18px;
}

*{box-sizing:border-box}
html,body{margin:0;padding:0;background:linear-gradient(180deg,#f7faff 0%,#eef3fa 70%,#f4f7fb 100%);color:var(--text);font:16px/1.6 "Inter","Segoe UI",Roboto,Helvetica,Arial,sans-serif}
a{color:#1f5fbf;text-decoration:none}
a:hover{text-decoration:underline}

.container{max-width:1140px;margin:0 auto;padding:0 20px}

.site-header{
  padding:24px 0 34px;
  border-bottom:1px solid var(--border);
  background:radial-gradient(circle at 15% 10%,rgba(245,158,11,.18),transparent 40%),linear-gradient(145deg,#152841 0%,#1f3658 38%,#34587b 100%);
  color:#e8eef8;
}
.compact-header{padding-bottom:26px}

.topbar{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-bottom:26px;flex-wrap:wrap}
.eyebrow{margin:0;color:#c6d4e8;font-weight:600;letter-spacing:.08em;text-transform:uppercase;font-size:11px}
.top-link{color:#fff6e0;font-weight:600}
.top-link:hover{color:#ffe1a3;text-decoration:none}

h1{margin:0;font-size:clamp(1.9rem,3.8vw,3rem);line-height:1.2;color:#ffffff;max-width:18ch}
h2{font-size:1.4rem;margin:0 0 8px;color:var(--heading)}
.lead{font-size:1.04rem;color:#d7e5f8;max-width:62ch;margin:12px 0 0}
p{margin:8px 0;color:var(--muted)}
.small{font-size:12px;color:var(--muted)}

.hero{display:grid;grid-template-columns:2fr minmax(260px,1fr);gap:24px;align-items:start;margin-top:24px}
.controls-panel{margin-top:24px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.25);border-radius:var(--radius);padding:14px;backdrop-filter:blur(2px)}
.controls-panel .small{color:#d8e3f3;margin:0 0 10px}

.controls{display:flex;gap:10px;flex-wrap:wrap}
input,select,button{
  background:#ffffff;
  border:1px solid #c8d7ea;
  color:#19304f;
  padding:11px 12px;
  border-radius:12px;
  font:inherit;
  box-shadow:0 5px 14px rgba(9,25,47,.07);
}
input{flex:1;min-width:250px}
select{min-width:210px}
button{cursor:pointer;background:linear-gradient(180deg,#ffbf4d,#f59e0b);color:#3b2500;border-color:#d78a07;font-weight:700}
button:hover{background:linear-gradient(180deg,#ffc96a,#f3a61f)}

.hero-note{background:#ffffff;border:1px solid #d8e3ef;border-radius:var(--radius);padding:16px 16px 14px;box-shadow:var(--shadow)}
.hero-note p{font-size:14px}
.hero-stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:10px 0}
.hero-stats div{padding:10px;border-radius:12px;background:var(--accent-soft);border:1px solid #fde6b1}
.hero-stats strong{display:block;color:#5e3a00;font-size:18px}
.hero-stats span{font-size:12px;color:#7b5c1c}

main{padding:24px 0 46px}
.section-intro{display:flex;justify-content:space-between;gap:16px;align-items:flex-end;margin-bottom:16px}

.grid{display:grid;grid-template-columns:repeat(12,1fr);gap:16px}
.card{grid-column:span 12;background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);padding:16px;box-shadow:var(--shadow)}
@media(min-width:900px){.card{grid-column:span 6}}
.card h3{margin:0 0 6px;font-size:18px;line-height:1.35;color:var(--heading)}
.meta{color:var(--muted);font-size:13px}
.meta span{margin-right:10px}

.kv{display:grid;grid-template-columns:180px 1fr;gap:8px 14px;margin-top:10px}
.kv div{padding:9px 11px;border:1px solid #e1e8f2;border-radius:12px;background:#f8fbff}
.kv .k{color:#627289}

.hr{height:1px;background:var(--border);margin:16px 0}
.viewer{margin-top:12px}
.viewer img{max-width:100%;border-radius:16px;border:1px solid #d5e0ed;box-shadow:var(--shadow)}

.footer{padding:20px 0 0;color:var(--muted);border-top:1px solid var(--border);margin-top:26px}
.callout{margin-top:14px;padding:12px 14px;border-left:4px solid var(--accent);background:var(--accent-soft);border-radius:10px;color:#3e3121}
.details-main{padding-top:20px}

@media(max-width:860px){
  .hero{grid-template-columns:1fr}
  .section-intro{flex-direction:column;align-items:flex-start}
}