/* ============================================================
   herzingstudent.com — contact layer
   Doctrine: direct-text channels bottom-LEFT (WhatsApp + SMS,
   distinct colours), live chat bottom-RIGHT. They never stack.
   Seasonal offer is a CENTRE modal, never a corner toast, and it
   sits above the left-hand buttons on mobile rather than over them.
   Avatar art style for this site: SQUIRCLE frame, vertical
   gradient ground, bust with a scrub V-neck, no accent ring —
   deliberately unlike the circular portraits its siblings use.
   ============================================================ */

.wa-stack {
  position: fixed; left: 18px; bottom: 18px; z-index: 90;
  display: flex; flex-direction: column; gap: .6rem;
}
.wa-btn {
  display: inline-flex; align-items: center; gap: .6rem;
  height: 52px; padding: 0 1.05rem 0 .8rem; border-radius: 999px;
  font-family: var(--disp, system-ui); font-weight: 700; font-size: .93rem;
  color: #fff; text-decoration: none; border: 0; cursor: pointer;
  box-shadow: 0 4px 10px rgba(6,32,58,.18), 0 14px 30px -12px rgba(6,32,58,.45);
  transition: transform .16s ease, filter .16s ease;
}
.wa-btn:hover { transform: translateY(-2px); filter: brightness(1.06); }
.wa-btn svg { width: 22px; height: 22px; flex: none; }
.wa-whatsapp { background: #1FA855; }
.wa-sms { background: #0E3A66; }
@media (max-width: 560px) {
  .wa-stack { left: 12px; bottom: 12px; gap: .5rem; }
  .wa-btn { height: 48px; padding: 0 .95rem 0 .7rem; font-size: .88rem; }
  .wa-btn .wa-label { display: none; }
  .wa-btn { padding: 0; width: 48px; justify-content: center; }
}

/* ---------------- live chat, bottom right ---------------- */

.lc-launch {
  position: fixed; right: 18px; bottom: 18px; z-index: 90;
  display: flex; align-items: center; gap: .65rem;
  background: #fff; border: 1px solid #DCE4EC; border-radius: 999px;
  padding: .4rem 1.1rem .4rem .4rem; cursor: pointer;
  box-shadow: 0 4px 10px rgba(6,32,58,.14), 0 16px 34px -14px rgba(6,32,58,.42);
  transition: transform .16s ease;
}
.lc-launch:hover { transform: translateY(-2px); }
.lc-launch img, .lc-launch svg.av { width: 44px; height: 44px; flex: none; display: block; }
.lc-launch .lc-who { text-align: left; line-height: 1.15; }
.lc-launch .lc-who b { display: block; font-family: var(--disp, system-ui); font-weight: 700; font-size: .92rem; color: #14222F; }
.lc-launch .lc-who span { font-size: .76rem; color: #5B6E82; }
.lc-launch .lc-dot { width: 9px; height: 9px; border-radius: 50%; background: #34B988; flex: none; }
@media (max-width: 560px) {
  .lc-launch { right: 12px; bottom: 12px; padding: .35rem; }
  .lc-launch .lc-who, .lc-launch .lc-dot { display: none; }
}

.lc-panel {
  position: fixed; right: 18px; bottom: 18px; z-index: 95;
  width: min(370px, calc(100vw - 36px));
  height: clamp(460px, 72vh, 580px);
  background: #fff; border: 1px solid #DCE4EC; border-radius: 16px;
  box-shadow: 0 30px 70px -24px rgba(6,32,58,.5);
  display: none; flex-direction: column; overflow: hidden;
}
.lc-panel[data-open="1"] { display: flex; }
.lc-head { background: #0A2C4D; color: #fff; padding: .9rem 1rem; display: flex; align-items: center; gap: .7rem; }
.lc-head svg.av { width: 40px; height: 40px; flex: none; }
.lc-head b { display: block; font-family: var(--disp, system-ui); font-weight: 700; font-size: .98rem; }
.lc-head span { font-size: .76rem; color: rgba(255,255,255,.72); }
.lc-head .lc-x { margin-left: auto; background: none; border: 0; color: rgba(255,255,255,.8); font-size: 1.4rem; line-height: 1; cursor: pointer; padding: .2rem .4rem; }
.lc-head .lc-x:hover { color: #fff; }
.lc-log { flex: 1; overflow-y: auto; padding: 1rem; display: flex; flex-direction: column; gap: .7rem; background: #F7F9FB; }
.lc-msg { max-width: 84%; padding: .7rem .9rem; border-radius: 12px; font-size: .93rem; line-height: 1.5; }
.lc-them { background: #fff; border: 1px solid #E4EAF0; align-self: flex-start; color: #14222F; }
.lc-you { background: #0A2C4D; color: #fff; align-self: flex-end; }
.lc-note { font-size: .78rem; color: #5B6E82; text-align: center; }
.lc-form { display: flex; gap: .5rem; padding: .75rem; border-top: 1px solid #E4EAF0; background: #fff; }
.lc-form input { flex: 1; font: inherit; font-size: 16px; padding: .65rem .8rem; border: 1px solid #C2CEDA; border-radius: 10px; color: #14222F; }
.lc-form button { background: #0A2C4D; color: #fff; border: 0; border-radius: 10px; padding: 0 1rem; min-height: 44px; font-weight: 700; cursor: pointer; }
@media (max-width: 560px) {
  .lc-panel { right: 0; bottom: 0; width: 100vw; height: 100dvh; border-radius: 0; border: 0; }
}
body[data-chat="1"] .wa-stack, body[data-chat="1"] .lc-launch { display: none; }
@media (min-width: 561px) { body[data-chat="1"] .wa-stack { display: flex; } }

/* ---------------- seasonal offer: CENTRE modal ---------------- */

.sm-veil {
  position: fixed; inset: 0; z-index: 120; background: rgba(6,32,58,.55);
  display: none; align-items: center; justify-content: center; padding: 1.25rem;
}
.sm-veil[data-open="1"] { display: flex; }
.sm-card {
  background: #fff; border-radius: 16px; width: min(460px, 100%);
  max-height: 90vh; overflow-y: auto; padding: clamp(1.5rem, 4vw, 2.15rem);
  box-shadow: 0 40px 90px -30px rgba(6,32,58,.6);
}
.sm-card h2 { font-family: var(--disp, system-ui); font-weight: 800; font-size: 1.5rem; letter-spacing: -.03em; margin: 0; color: #14222F; }
.sm-season { font-size: .82rem; font-weight: 700; color: #157049; margin-bottom: .5rem; }
.sm-card p { margin-top: .8rem; font-size: 1rem; line-height: 1.6; color: #33475C; }
.sm-card form { margin-top: 1.15rem; display: grid; gap: .65rem; }
.sm-card label { font-size: .88rem; color: #33475C; }
.sm-card input, .sm-card select { font: inherit; font-size: 16px; padding: .75rem .85rem; border: 1px solid #C2CEDA; border-radius: 8px; width: 100%; color: #14222F; }
.sm-card button.sm-go { background: #0A2C4D; color: #fff; border: 0; border-radius: 8px; min-height: 50px; font-family: var(--disp, system-ui); font-weight: 700; font-size: 1rem; cursor: pointer; }
.sm-card button.sm-go:hover { background: #06203A; }
.sm-x { float: right; background: none; border: 0; font-size: 1.5rem; line-height: 1; color: #8393A5; cursor: pointer; padding: 0 0 0 .5rem; }
.sm-x:hover { color: #14222F; }
.sm-small { font-size: .8rem; color: #5B6E82; line-height: 1.5; }
.sm-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

@media (prefers-reduced-motion: reduce) { .wa-btn, .lc-launch { transition: none !important; } }