/* EconomicalHelpDesk.com — marketing site theme (loads after bootstrap.min.css) */
:root{
  --hd-navy-900:#0a1626; --hd-navy-700:#12294a; --hd-navy-500:#1d3350;
  --hd-ink:#16283f; --hd-muted:#5c7189; --hd-soft:#7186a0;
  --hd-orange:#ea7a1f; --hd-orange-dark:#c96410; --hd-orange-light:#f2a25c;
  --hd-tint:#fdeedd; --hd-bg:#f6f8fb; --hd-border:#e4eaf2;
}
body{margin:0;background:var(--hd-bg);color:var(--hd-ink);font-family:'Manrope',system-ui,-apple-system,sans-serif;-webkit-font-smoothing:antialiased;min-height:100vh;display:flex;flex-direction:column}
main{flex:1}
.sora{font-family:'Sora',sans-serif}
a{color:var(--hd-orange);text-decoration:none}
a:hover{color:var(--hd-orange-dark)}

/* Layout */
.hd-wrap{max-width:1240px;width:100%;margin:0 auto;padding-left:40px;padding-right:40px}
.hd-section{padding:64px 0 0}
.hd-section-last{padding-bottom:96px}

/* Type */
.hd-eyebrow{font-size:11.5px;letter-spacing:.18em;font-weight:700;color:var(--hd-orange);margin-bottom:14px;text-transform:uppercase}
.hd-hero .hd-eyebrow{color:var(--hd-orange-light)}
.hd-h1{font-family:'Sora',sans-serif;font-weight:800;font-size:clamp(30px,4vw,48px);margin:0 0 16px;letter-spacing:-.02em;line-height:1.1;max-width:880px;text-wrap:balance}
.hd-h2{font-family:'Sora',sans-serif;font-weight:700;font-size:clamp(24px,3vw,36px);margin:0 0 12px;letter-spacing:-.02em;line-height:1.16}
.hd-h3{font-family:'Sora',sans-serif;font-weight:700;font-size:17px;margin:0 0 8px}
.hd-lead{font-size:16px;color:#c2cfdf;max-width:700px;line-height:1.7;margin:0}
.hd-sub{font-size:15.5px;color:var(--hd-muted);max-width:700px;margin:0 0 32px;line-height:1.7;text-wrap:pretty}
.hd-body{font-size:13.5px;line-height:1.65;color:var(--hd-muted);margin:0}

/* Bands */
.hd-hero{background:linear-gradient(112deg,#0a1626 0%,#12294a 55%,#0e2038 100%);color:#fff;padding:64px 0 72px}
.hd-hero-home{padding:78px 0 92px}
.hd-band-dark{background:linear-gradient(112deg,#12294a 0%,#0e2038 100%);border-radius:20px;color:#fff;padding:52px 44px}
.hd-cta{background:var(--hd-navy-900);border-radius:20px;padding:56px 44px;text-align:center;color:#fff}

/* Cards */
.hd-card{background:#fff;border:1px solid var(--hd-border);border-radius:16px;padding:28px 30px;height:100%}
.hd-card-hover{transition:border-color .18s ease,box-shadow .18s ease}
.hd-card-hover:hover{border-color:var(--hd-orange);box-shadow:0 12px 30px rgba(10,22,38,.09)}
.hd-ic{width:44px;height:44px;border-radius:11px;background:var(--hd-tint);display:grid;place-items:center;font-size:19px;flex:0 0 auto}
.hd-ic-sm{width:38px;height:38px;border-radius:10px;font-size:17px}
.hd-tag{display:inline-block;font-size:11.5px;font-weight:600;color:#3d5573;background:var(--hd-bg);border:1px solid var(--hd-border);padding:5px 10px;border-radius:999px}
.hd-tick{color:var(--hd-orange);font-weight:700;flex:0 0 auto}
.hd-li{display:flex;gap:9px;align-items:flex-start;font-size:13.5px;color:#3d5573;line-height:1.55}
.hd-note{background:var(--hd-bg);border-left:3px solid var(--hd-orange);border-radius:0 12px 12px 0;padding:16px 18px}

/* Buttons */
.hd-btn{display:inline-block;font-weight:700;font-size:15px;padding:14px 28px;border-radius:9px;border:0;cursor:pointer;text-align:center}
.hd-btn-primary{background:var(--hd-orange);color:#fff !important}
.hd-btn-primary:hover{background:var(--hd-orange-dark);color:#fff !important}
.hd-btn-dark{background:var(--hd-navy-700);color:#fff !important}
.hd-btn-dark:hover{background:var(--hd-navy-900);color:#fff !important}
.hd-btn-line{border:1.5px solid rgba(255,255,255,.3);color:#fff !important;font-weight:600}
.hd-btn-line:hover{border-color:var(--hd-orange-light);color:#fff !important}
.hd-btn-ghost{background:#fff;border:1.5px solid #cdd8e6;color:var(--hd-ink) !important}
.hd-btn-ghost:hover{border-color:var(--hd-orange);color:var(--hd-ink) !important}
.hd-btn-sm{font-size:13.5px;padding:11px 18px}

/* Forms */
.hd-label{display:block;font-size:12px;font-weight:700;letter-spacing:.05em;color:#3d5573;margin-bottom:7px}
.hd-input{width:100%;font-family:'Manrope',sans-serif;font-size:14px;color:var(--hd-ink);padding:12px 14px;border:1.5px solid #dde5ef;border-radius:9px;outline:none;background:#fbfcfe}
.hd-input:focus{border-color:var(--hd-orange)}
.hd-chip{cursor:pointer;font-family:'Manrope',sans-serif;font-size:13px;font-weight:600;padding:10px 17px;border-radius:999px;border:1.5px solid #dde5ef;background:#fff;color:var(--hd-muted)}
.hd-chip.active,.hd-chip:hover{border-color:var(--hd-orange);background:var(--hd-tint);color:var(--hd-ink)}

/* Guide */
.hd-guide-grid{display:grid;grid-template-columns:minmax(240px,300px) minmax(0,1fr);gap:24px;align-items:start}
.hd-guide-link{display:block;font-size:13.5px;font-weight:600;padding:8px 11px;border-radius:8px;color:#3d5573}
.hd-guide-link:hover{background:var(--hd-bg);color:var(--hd-ink)}
.hd-guide-link.active{background:var(--hd-tint);color:var(--hd-orange-dark)}
.hd-step-n{width:24px;height:24px;border-radius:7px;background:var(--hd-tint);color:var(--hd-orange-dark);display:grid;place-items:center;font-size:12px;font-weight:800;flex:0 0 auto}

/* FAQ accordion (Bootstrap override) */
.accordion-item{background:#fff;border:1px solid var(--hd-border) !important;border-radius:13px !important;margin-bottom:10px;overflow:hidden}
.accordion-button{font-family:'Manrope',sans-serif;font-weight:700;font-size:15px;color:var(--hd-ink);padding:19px 22px;background:#fff !important;box-shadow:none !important}
.accordion-button:not(.collapsed){color:var(--hd-orange-dark)}
.accordion-button::after{filter:hue-rotate(-15deg) saturate(4)}
.accordion-body{padding:0 22px 20px;font-size:14px;line-height:1.75;color:var(--hd-muted)}

/* Pricing */
.hd-plan{background:#fff;border:1.5px solid var(--hd-border);border-radius:18px;padding:28px 26px;height:100%;display:flex;flex-direction:column;position:relative}
.hd-plan-featured{border-color:var(--hd-orange);box-shadow:0 18px 44px rgba(234,122,31,.16)}
.hd-plan-badge{position:absolute;top:-13px;left:24px;font-size:10.5px;letter-spacing:.1em;font-weight:700;color:#fff;background:var(--hd-orange);padding:6px 12px;border-radius:6px}
.hd-price{font-family:'Sora',sans-serif;font-weight:800;font-size:38px;letter-spacing:-.03em}

/* Compare table */
.hd-table{width:100%;border-collapse:collapse;background:#fff}
.hd-table th{background:var(--hd-bg);font-family:'Sora',sans-serif;font-weight:700;font-size:13.5px;padding:18px 20px;text-align:left;border-bottom:1px solid var(--hd-border);white-space:nowrap}
.hd-table td{padding:16px 20px;font-size:13px;color:var(--hd-muted);border-bottom:1px solid #f0f4f9}
.hd-table td:first-child{font-weight:700;color:var(--hd-ink);font-size:13.5px}
.hd-table td.hd-us{background:#fffaf4;color:var(--hd-ink);font-weight:600}

/* Screenshot placeholder */
.hd-shot{width:100%;background:#eef2f8;border:1px dashed #c3d0e0;border-radius:10px;display:grid;place-items:center;color:var(--hd-soft);font-size:13px;font-weight:600;text-align:center;padding:20px;min-height:200px;background-size:cover;background-position:center}

@media (max-width:960px){
  .hd-wrap{padding-left:20px;padding-right:20px}
  .hd-band-dark,.hd-cta{padding:36px 24px}
  .hd-card{padding:24px 22px}
  .hd-guide-grid{grid-template-columns:minmax(0,1fr)}
  .hd-hero{padding:48px 0 54px}
  .hd-hero-home{padding:54px 0 64px}
  .hd-section{padding:48px 0 0}
}


/* ===== Mobile hardening: no horizontal wobble, breathing room at the edges ===== */
html, body { max-width: 100%; overflow-x: hidden; }
img, svg, video, iframe { max-width: 100%; height: auto; }
.row > * { min-width: 0; }
code, pre, .hd-table td, .accordion-body { overflow-wrap: anywhere; }
.hd-card, .hd-plan, .hd-band-dark, .hd-cta { min-width: 0; }

@media (max-width: 576px) {
  .hd-wrap { padding-left: 18px; padding-right: 18px; }
  .hd-hero { padding: 38px 0 44px; }
  .hd-hero-home { padding: 44px 0 52px; }
  .hd-h1 { font-size: clamp(25px, 7.6vw, 32px); }
  .hd-h2 { font-size: clamp(20px, 6vw, 26px); }
  .hd-lead { font-size: 14.5px; }
  .hd-sub { font-size: 14px; }
  .hd-card { padding: 20px 18px; border-radius: 14px; }
  .hd-plan { padding: 22px 18px; }
  .hd-band-dark, .hd-cta { padding: 26px 18px; border-radius: 14px; }
  .hd-btn { padding: 13px 20px; font-size: 14px; }
  .hd-section { padding: 40px 0 0; }
  .hd-table th, .hd-table td { padding: 11px 12px; font-size: 12.5px; }
  .hd-price { font-size: 32px; }
  .hd-guide-grid { gap: 16px; }
  .hd-shot { min-height: 150px; }
}
/* Sections that overlap the hero must never exceed the viewport */
.hd-wrap > div[style*="margin-top:-42px"] { margin-left: 0; margin-right: 0; }