:root{
  --bg:#f7f3ee;
  --bg-soft:#fbf8f4;
  --surface:#ffffff;
  --surface-soft:#fcf3e8;
  --surface-warm:#fff8f1;
  --text:#2c2c2c;
  --muted:#6f665c;
  --primary:#e38b2c;
  --primary-strong:#c7741c;
  --primary-soft:#f8e4c7;
  --accent:#d77d3d;
  --accent-soft:#fbe8d2;
  --border:#e7ddd1;
  --success:#2e7d32;
  --warning:#d48a1f;
  --danger:#b84545;
  --shadow:0 10px 28px rgba(84, 63, 40, 0.08);
}
body{
  background:linear-gradient(180deg,#fbf8f4 0%, #f7f3ee 100%);
  color:var(--text);
  font-family:Calibri,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  margin:0;
  padding:0;
}
.container{
  max-width:1180px;
  margin:0 auto;
  padding:36px 20px 48px;
}
.brand-title,h1{
  text-align:center;
  font-weight:700;
  font-size:54px;
  margin:0 0 18px;
  color:#2f394d;
  letter-spacing:-0.02em;
}
.hero-actions{
  display:flex;
  justify-content:center;
  margin-bottom:28px;
}
.hero-btn{
  padding:16px 34px;
  font-size:28px;
}
.btn,button{
  display:inline-block;
  border-radius:10px;
  border:none;
  background:linear-gradient(180deg,var(--primary),var(--primary-strong));
  color:#fff;
  font-size:16px;
  font-weight:700;
  cursor:pointer;
  text-decoration:none;
  padding:14px 22px;
  box-shadow:0 8px 18px rgba(199,116,28,0.18);
  transition:all .2s ease;
}
.btn:hover,button:hover{
  background:linear-gradient(180deg,#d98222,#b96816);
  transform:translateY(-1px);
}
.btn-secondary{
  background:#fff;
  color:#3a352f;
  border:1px solid #d7c8b8;
  box-shadow:none;
}
.btn-secondary:hover{
  background:var(--accent-soft);
}
.full-width{
  display:block;
  text-align:center;
  width:100%;
  box-sizing:border-box;
}
.value-block{
  text-align:center;
  max-width:980px;
  margin:0 auto 34px;
}
.value-block h2{
  font-size:28px;
  line-height:1.35;
  margin:0 0 14px;
  color:#2f394d;
}
.value-block p{
  font-size:18px;
  line-height:1.7;
  margin:0 0 14px;
  color:var(--muted);
}
.value-highlight{
  font-size:20px;
  color:#2f394d !important;
}
.micro-copy{
  font-size:16px !important;
  color:#8a7f73 !important;
}
.plans-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:16px;
  align-items:stretch;
}
.plan-card{
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:14px;
  padding:22px 18px 16px;
  box-shadow:var(--shadow);
  position:relative;
  display:flex;
  flex-direction:column;
}
.plan-card h3{
  font-size:22px;
  margin:0 0 16px;
  text-align:center;
  color:#2f394d;
}
.price{
  border-top:1px solid var(--border);
  border-bottom:1px solid var(--border);
  padding:14px 6px;
  margin-bottom:16px;
  text-align:center;
  font-size:18px;
  font-weight:700;
  color:#2f394d;
}
.price span{
  font-weight:400;
  color:var(--muted);
}
.feature-list{
  list-style:none;
  padding:0;
  margin:0 0 18px;
  flex:1;
}
.feature-list li{
  padding:10px 0 10px 26px;
  border-bottom:1px solid #f1ebe4;
  position:relative;
  color:#4b433a;
  line-height:1.35;
}
.feature-list li:before{
  content:"✓";
  position:absolute;
  left:0;
  top:10px;
  color:var(--success);
  font-weight:700;
}
.featured{
  border-color:#d9b277;
  transform:translateY(-10px);
}
.badge{
  position:absolute;
  top:-12px;
  left:50%;
  transform:translateX(-50%);
  background:#edd19b;
  color:#5e4520;
  padding:6px 14px;
  border-radius:8px;
  font-weight:700;
  box-shadow:0 4px 12px rgba(94,69,32,0.12);
}

/* Premium warm gold highlight */
.plan-premium{
  border:2px solid #E3B04B;
  background:linear-gradient(180deg,#fff9ef 0%, #fdf3e4 100%);
  box-shadow:0 10px 30px rgba(210,154,46,0.15);
}

.plan-premium .premium-header{
  background:linear-gradient(135deg,#E3B04B,#D29A2E);
  color:white;
  font-weight:700;
  margin-left:-18px;
  margin-right:-18px;
  margin-top:-22px;
  padding:16px 18px 14px;
  border-top-left-radius:12px;
  border-top-right-radius:12px;
  text-align:center;
}

.plan-premium .premium-header h3{
  margin:0;
  color:white;
}

.plan-premium .premium-price{
  background:linear-gradient(135deg,#F0C46A,#D29A2E);
  color:white;
  font-weight:700;
  margin-left:-18px;
  margin-right:-18px;
  margin-bottom:16px;
  padding:16px 18px;
  text-align:center;
  border-top:1px solid rgba(255,255,255,0.25);
  border-bottom:1px solid rgba(0,0,0,0.06);
}

.plan-premium .premium-price span{
  color:#fff7ea;
}

.plan-premium .price{
  border-top:none;
  border-bottom:none;
}

.badge-popular{
  background:#F0D084;
  color:#4A3A1A;
  font-weight:700;
}

.plan-premium .btn-primary{
  background:linear-gradient(180deg,#D29A2E,#B9781A);
}

.plan-premium .btn-primary:hover{
  background:linear-gradient(180deg,#C98722,#A86A12);
}

.how-it-works{
  margin-top:30px;
  text-align:center;
}
.how-it-works h2{
  font-size:26px;
  margin-bottom:16px;
  color:#2f394d;
}
.steps-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px;
  max-width:860px;
  margin:0 auto;
}
.step-card{
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:14px;
  padding:18px;
  font-size:20px;
  font-weight:600;
  color:#2f394d;
  box-shadow:0 4px 14px rgba(84,63,40,0.05);
}
.footer-note{
  text-align:center;
  font-size:17px;
  color:var(--muted);
  margin-top:22px;
}
.form-page{max-width:900px;}
.top-back{margin-bottom:16px;}
.top-back a{color:var(--primary-strong);text-decoration:none;font-weight:700;}
.form-card,.card{
  background:var(--surface);
  padding:22px;
  margin:16px 0;
  border-radius:16px;
  box-shadow:var(--shadow);
  border:1px solid var(--border);
}
.narrow-card{max-width:520px;margin:32px auto;}
textarea,input,select{
  width:100%;
  padding:12px 14px;
  margin-bottom:15px;
  border-radius:10px;
  border:1px solid var(--border);
  font-size:15px;
  background:white;
  box-sizing:border-box;
  color:var(--text);
}
textarea:focus,input:focus,select:focus{
  outline:none;
  border-color:var(--primary);
  box-shadow:0 0 0 3px rgba(227,139,44,0.12);
}
.job-input-mode{margin-bottom:14px;}
.radio-row{display:flex;gap:18px;margin:10px 0;flex-wrap:wrap;}
.radio-row label{color:var(--text);font-weight:600;}
.cv-mode-group{
  background:var(--surface-soft);
  border:1px solid var(--border);
  border-radius:12px;
  padding:14px 16px;
}
.upload-note{margin-top:-6px;margin-bottom:12px;}
.navbar{
  position:sticky;
  top:0;
  background:rgba(255,250,245,0.95);
  backdrop-filter:blur(6px);
  padding:14px 20px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  box-shadow:0 2px 8px rgba(84,63,40,0.04);
  z-index:1000;
  border-bottom:1px solid var(--border);
}
.nav-title{font-weight:700;font-size:24px;color:#2f394d;}
.nav-links a{margin-left:18px;text-decoration:none;color:var(--primary-strong);font-weight:700;}
.score-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;}
.bar{height:28px;border-radius:8px;overflow:hidden;background:#ece7df;}
.bar.green{ background:#d7efe7; }
.bar.yellow{ background:#f7ebcd; }
.bar.red{ background:#f8dddd; }
.fill{height:100%;text-align:center;color:white;font-weight:700;line-height:28px;transition: width 0.9s ease-out;width:0%;}
.bar.green .fill{ background:var(--success); }
.bar.yellow .fill{ background:var(--warning); }
.bar.red .fill{ background:var(--danger); }
.toolbar-row{display:flex;gap:12px;justify-content:flex-end;margin:8px 0 12px;}
.readable-output, pre{
  background:var(--surface-soft);
  padding:18px;
  border-radius:12px;
  white-space:pre-wrap;
  font-size:15px;
  line-height:1.8;
  color:var(--text);
  overflow:auto;
  border:1px solid var(--border);
  font-family:Calibri,"Segoe UI",Arial,sans-serif;
}
.readable-output strong{color:#2f394d;}
.error-box{background:#fff7f1;border:1px solid #efc29b;padding:12px;border-radius:10px;margin:12px 0;color:#7d1f17;}
.success-box{background:#edf8f2;border:1px solid #b9e1c7;padding:12px;border-radius:10px;margin:12px 0;color:#1d5b33;}
.error-inline{color:var(--danger);margin-top:8px;}
.small{font-size:0.95rem;color:var(--muted);}
.code{white-space:pre-wrap;max-height:260px;overflow:auto;background:#2f2a25;color:#f8f5f0;padding:10px;border-radius:8px;}
.loading-state {margin-top:16px;padding:16px;border:1px solid var(--border);border-radius:12px;background:var(--surface-soft);}
.loading-title {font-weight:700;margin-bottom:6px;color:#2f394d;}
.loading-text {font-size:14px;color:var(--muted);line-height:1.5;margin-bottom:14px;}
.spinner {width:28px;height:28px;border:4px solid #eadfce;border-top:4px solid var(--primary);border-radius:50%;animation:spin 0.8s linear infinite;margin-bottom:10px;}
@keyframes spin {0% {transform:rotate(0deg);}100% {transform:rotate(360deg);}}
.progress-wrap {margin-top: 12px;}
.progress-bar {width: 100%;height: 12px;background: #ece4d8;border-radius: 999px;overflow: hidden;margin-bottom: 8px;}
.progress-fill {height: 100%;width: 0%;background: linear-gradient(90deg, var(--primary), var(--accent));transition: width 0.9s ease;}
.progress-text {font-size: 14px;font-weight: 700;color: #7f5627;margin-bottom: 12px;}
.client-card p{margin:4px 0;}
.executive-summary{background:var(--accent-soft);border-left:5px solid var(--primary);}
button:disabled{opacity:.7;cursor:not-allowed;}
.module-card h3{color:#2f394d;margin-bottom:12px;}
.card h2{color:#2f394d;}
@media (max-width: 1100px){
  .plans-grid{grid-template-columns:repeat(2,1fr);} 
}
@media (max-width: 768px){
  .container{padding:22px 14px 36px;}
  .brand-title,h1{font-size:38px;}
  .plans-grid,.steps-grid,.score-grid{grid-template-columns:1fr;}
  .featured{transform:none;}
  .hero-btn{font-size:18px;padding:14px 24px;}
  .toolbar-row{justify-content:stretch;}
  .toolbar-row button{width:100%;}
  .navbar{align-items:flex-start;gap:8px;flex-direction:column;}
  .nav-links a{margin-left:0;margin-right:14px;}
  .plan-premium .premium-header,
  .plan-premium .premium-price{
    margin-left:-18px;
    margin-right:-18px;
  }
}