/* Page stylesheet entry point. Shared visual rules remain in styles.css to keep every page consistent. */
@import url('styles.css');

/* Keep this page's italic gradient headings inside their paintable boxes. */
body[data-page="receptionist"] h1,
body[data-page="receptionist"] h2,
body[data-page="receptionist"] h3,
body[data-page="receptionist"] h4{
  line-height:1.08;
  padding-top:0;
  overflow:visible;
  padding-inline:0;
  margin-inline:0;
  max-width:100%;
  overflow-wrap:break-word;
}
body[data-page="receptionist"] .grad-text{
  display:inline;
  padding-inline:.08em;
  margin-inline:-.08em;
  overflow:visible;
  vertical-align:baseline;
}
body[data-page="receptionist"] .hero{overflow:visible}

/* The receptionist hero is a phone call, not a chatbot conversation. */
body[data-page="receptionist"] .voice-demo .voice-call{display:flex;flex-direction:column;gap:18px;min-height:300px;padding:14px 8px 4px}
body[data-page="receptionist"] .voice-call__identity{display:flex;align-items:center;gap:13px}
body[data-page="receptionist"] .voice-call__identity>div:last-child{display:flex;flex-direction:column;gap:4px;min-width:0}
body[data-page="receptionist"] .voice-call__avatar{width:52px;height:52px;border-radius:50%;display:grid;place-items:center;background:var(--grad);font-size:1.35rem;box-shadow:0 10px 26px -10px rgba(134,104,242,.9);animation:ringpulse 1.9s infinite}
body[data-page="receptionist"] .voice-call__identity strong{display:block;font-family:Sora;font-size:.95rem}
body[data-page="receptionist"] .voice-call__identity span{display:block;margin-top:4px;color:var(--green);font-size:.76rem}
body[data-page="receptionist"] .voice-call__actions{display:flex;justify-content:center;gap:10px;margin-top:-4px}
body[data-page="receptionist"] .voice-call__actions button{width:46px;height:46px;padding:0;border:0;border-radius:50%;display:grid;place-items:center;color:#fff;font:700 1.2rem Inter,sans-serif;cursor:pointer}
body[data-page="receptionist"] .voice-call__actions .phone-icon{width:1.45em;height:1.45em;display:block;fill:currentColor}
body[data-page="receptionist"] .voice-call__answer{background:#56bd34;box-shadow:0 8px 18px -10px #56bd34}
body[data-page="receptionist"] .voice-call__hangup{background:#d5222a;box-shadow:0 8px 18px -10px #d5222a}
body[data-page="receptionist"] .voice-call__hangup span{transform:rotate(135deg)}
body[data-page="receptionist"] .voice-call__hangup .phone-icon{transform:rotate(135deg)}
body[data-page="receptionist"] .voice-call__wave{height:76px;display:flex;align-items:center;padding:0 8px;border-block:1px solid var(--line-2)}
body[data-page="receptionist"] .voice-call__bars{display:flex;align-items:center;justify-content:center;gap:4px;width:100%;height:56px}
body[data-page="receptionist"] .voice-call__bars i{width:4px;height:28%;background:linear-gradient(180deg,var(--purple),var(--green));border-radius:4px;animation:eq 1s ease-in-out infinite}
body[data-page="receptionist"] .voice-demo.is-playing .voice-call__bars i{animation:none}
body[data-page="receptionist"] .voice-demo.is-paused .voice-call__bars i{animation:none}
body[data-page="receptionist"] .voice-call__caption{display:flex;flex-direction:column;gap:7px;padding:12px 14px;background:rgba(255,255,255,.06);border:1px solid var(--line);border-radius:14px}
body[data-page="receptionist"] .voice-call__caption span{font-size:.72rem;color:var(--grey-2);text-transform:uppercase;letter-spacing:.12em;font-weight:700}
body[data-page="receptionist"] .voice-call__caption b{font-size:.88rem;line-height:1.4;font-weight:500}
body[data-page="receptionist"] .voice-call__status{align-self:center;color:var(--green);background:rgba(117,233,191,.12);border:1px solid rgba(117,233,191,.35);border-radius:999px;padding:8px 14px;font-size:.76rem;font-weight:700}
body[data-page="receptionist"] .voice-call__hack{display:flex;flex-direction:column;gap:8px;padding:14px 16px;border:1px solid rgba(134,104,242,.6);border-radius:12px;background:linear-gradient(135deg,rgba(134,104,242,.14),rgba(117,233,191,.07));box-shadow:0 0 22px -12px var(--purple);text-align:left}
body[data-page="receptionist"] .voice-call__hack[hidden]{display:none}
body[data-page="receptionist"] .voice-call__hack-label{color:var(--green);font:700 .62rem Inter,sans-serif;letter-spacing:.12em}
body[data-page="receptionist"] .voice-call__hack strong{font:800 .92rem Sora,sans-serif;color:#fff}
body[data-page="receptionist"] .voice-call__hack p{margin:0;color:var(--grey-2);font-size:.76rem}
body[data-page="receptionist"] .voice-call__real-call{align-self:flex-start;padding:8px 12px;border-radius:999px;background:var(--purple);color:#fff;font:700 .68rem Inter,sans-serif;text-decoration:none}
body[data-page="receptionist"] .voice-audio{display:flex;flex-direction:column;gap:8px;margin-top:auto;padding-top:4px}
body[data-page="receptionist"] .voice-audio audio{display:none}
body[data-page="receptionist"] .voice-audio__controls{display:flex;align-items:center;gap:8px}
body[data-page="receptionist"] .voice-audio button{border:1px solid var(--line);background:rgba(255,255,255,.06);color:#fff;border-radius:999px;padding:7px 11px;font:600 .72rem Inter,sans-serif;cursor:pointer}
body[data-page="receptionist"] .voice-audio__play{background:var(--purple)!important;border-color:transparent!important;min-width:78px}
body[data-page="receptionist"] .voice-audio__time{margin-left:auto;color:var(--grey-2);font-size:.7rem;font-variant-numeric:tabular-nums}
body[data-page="receptionist"] .voice-audio__progress{height:4px;border-radius:99px;background:rgba(255,255,255,.12);overflow:hidden}
body[data-page="receptionist"] .voice-audio__progress span{display:block;width:0;height:100%;background:var(--grad);transition:width .12s linear}
body[data-page="receptionist"] .voice-audio__hold-controls{display:flex;align-items:center;justify-content:flex-end;color:var(--grey-3);font-size:.7rem}
body[data-page="receptionist"] .voice-audio__hold-controls[hidden]{display:none}
body[data-page="receptionist"] .voice-audio__hold-toggle{width:28px;height:28px;padding:0!important;border-radius:50%!important;display:grid;place-items:center;background:rgba(255,255,255,.04)!important}
body[data-page="receptionist"] .voice-script-demo{display:flex;flex-direction:column;gap:8px;margin-top:4px;padding:12px 14px;border:1px solid rgba(134,104,242,.42);border-radius:12px;background:rgba(134,104,242,.08)}
body[data-page="receptionist"] .voice-script-demo[hidden]{display:none}
body[data-page="receptionist"] .voice-script-demo__label{color:var(--green);font:700 .6rem Inter,sans-serif;letter-spacing:.12em}
body[data-page="receptionist"] .voice-script-demo__face{height:300px;min-height:300px;width:100%;margin:0;display:flex;align-items:center;justify-content:center;overflow:hidden;color:#8cffb0;background:transparent;border:0;border-radius:0;font:500 clamp(2px,.42vw,5px)/1.02 monospace;white-space:pre;letter-spacing:0;transform:none}
body[data-page="receptionist"] .voice-script-demo__line{min-height:2.6em;margin:0;color:#8cffb0;font:500 .78rem/1.5 ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono",monospace;letter-spacing:.015em}
body[data-page="receptionist"] .voice-script-demo__ending{display:flex;flex-direction:column;gap:12px;padding:14px 0 0;color:#8cffb0;font:500 .72rem/1.45 ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono",monospace}
body[data-page="receptionist"] .voice-script-demo__ending[hidden]{display:none}
body[data-page="receptionist"] .voice-script-demo__ending-label{letter-spacing:.08em}
body[data-page="receptionist"] .voice-script-demo__ending-actions{display:flex;flex-wrap:wrap;gap:8px}
body[data-page="receptionist"] .voice-script-demo__ending-actions a,
body[data-page="receptionist"] .voice-script-demo__ending-actions button{padding:8px 11px;border:1px solid rgba(140,255,176,.35);border-radius:8px;background:rgba(140,255,176,.08);color:#8cffb0;font:600 .7rem ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono",monospace;text-decoration:none;cursor:pointer}
body[data-page="receptionist"] .voice-script-demo__ending-actions button{background:rgba(255,255,255,.06);border-color:var(--line);color:#fff}
body[data-page="receptionist"] .voice-script-demo__real-voice{display:none}
body[data-page="receptionist"] .voice-script-demo__controls{display:flex;gap:8px}
body[data-page="receptionist"] .voice-script-demo button{border:1px solid var(--line);background:rgba(255,255,255,.06);color:#fff;border-radius:999px;padding:7px 10px;font:600 .68rem Inter,sans-serif;cursor:pointer}
body[data-page="receptionist"] .voice-script-demo__play{background:var(--purple)!important;border-color:transparent!important}
body[data-page="receptionist"] .voice-script-demo__stop{width:30px;padding:0!important;color:var(--grey-2)!important}
body[data-page="receptionist"] .voice-demo.is-self-aware .bar,
body[data-page="receptionist"] .voice-demo.is-self-aware .voice-call__identity,
body[data-page="receptionist"] .voice-demo.is-self-aware .voice-call__actions,
body[data-page="receptionist"] .voice-demo.is-self-aware .voice-call__wave,
body[data-page="receptionist"] .voice-demo.is-self-aware .voice-call__status,
body[data-page="receptionist"] .voice-demo.is-self-aware .voice-call__hack,
body[data-page="receptionist"] .voice-demo.is-self-aware .voice-audio__controls,
body[data-page="receptionist"] .voice-demo.is-self-aware .voice-audio__progress{display:none}
body[data-page="receptionist"] .voice-demo.is-self-aware .voice-call{padding:18px;background:#030806;border-radius:12px}
body[data-page="receptionist"] .voice-demo.is-self-aware .voice-call__top,
body[data-page="receptionist"] .voice-demo.is-self-aware .voice-call__identity,
body[data-page="receptionist"] .voice-demo.is-self-aware .voice-call__actions,
body[data-page="receptionist"] .voice-demo.is-self-aware .voice-audio__controls{display:none!important}
body[data-page="receptionist"] .voice-demo.is-self-aware .voice-audio{display:block;margin:0;padding:0;border:0;background:transparent}
body[data-page="receptionist"] .voice-demo.is-self-aware .voice-script-demo{display:flex;margin:0;border:0;padding:0;background:transparent}
body[data-page="receptionist"] .voice-demo.is-self-aware .voice-script-demo__controls{display:none!important}
body[data-page="receptionist"] .voice-demo.is-self-aware .voice-script-demo__label,
body[data-page="receptionist"] .voice-demo.is-self-aware .voice-script-demo__line{color:#8cffb0}
body[data-page="receptionist"] .hold-disc{display:block;width:12px;height:12px;border:2px solid var(--purple-2);border-radius:50%;position:relative;animation:holdspin 1.4s linear infinite}
body[data-page="receptionist"] .hold-disc::after{content:"";position:absolute;inset:3px;border-radius:50%;background:var(--purple-2)}
body[data-page="receptionist"] .voice-demo.hold-paused .hold-disc{filter:grayscale(1);animation-play-state:paused}
@keyframes holdspin{to{transform:rotate(360deg)}}
body[data-page="receptionist"] .voice-demo.is-hung-up .voice-call__avatar{filter:grayscale(.8);opacity:.65;animation:none}
body[data-page="receptionist"] .voice-demo.is-hung-up .voice-call__status{color:var(--grey-2);border-color:var(--line);background:rgba(255,255,255,.05)}
body[data-page="receptionist"] .voice-demo.is-hung-up .live{color:#ff7777}
body[data-page="receptionist"] .voice-demo.is-hung-up .live::before{background:#ff7777;box-shadow:0 0 8px #ff7777}
body[data-page="receptionist"] .voice-demo.is-follow-up .voice-call__avatar{background:var(--grad);animation:ringpulse 1.9s infinite}
body[data-page="receptionist"] .voice-demo.is-follow-up .voice-call__status{color:var(--green);border-color:rgba(117,233,191,.35);background:rgba(117,233,191,.12)}
body[data-page="receptionist"] .voice-demo.is-follow-up .live{color:var(--green)}
body[data-page="receptionist"] .voice-demo.is-paused .live{color:var(--grey-2)}
body[data-page="receptionist"] .voice-demo.is-paused .live::before{background:var(--grey-2);box-shadow:none}
body[data-page="receptionist"] .voice-demo.is-paused .voice-call__identity,
body[data-page="receptionist"] .voice-demo.is-paused .voice-call__wave,
body[data-page="receptionist"] .voice-demo.is-paused .voice-call__status{filter:grayscale(1);opacity:.72}
body[data-page="receptionist"] .voice-demo.is-paused .voice-call__avatar{animation-play-state:paused}
body[data-page="receptionist"] .voice-demo.is-paused .voice-audio__play{background:rgba(255,255,255,.08)!important;border-color:var(--line)!important;color:var(--grey-2)}
body[data-page="receptionist"] .voice-widget-toggle{display:none;position:absolute;right:10px;bottom:10px;z-index:5;width:52px;height:52px;border-radius:12px;border:1px solid var(--line);background:rgba(15,15,25,.9);color:var(--purple-2);font:700 .95rem Inter,sans-serif;cursor:pointer}
body[data-page="receptionist"] .voice-widget-toggle{font-size:1.55rem;line-height:1}
body[data-page="receptionist"] .voice-widget-toggle.is-record{font-size:0}
body[data-page="receptionist"] .voice-widget-toggle.is-record::before{content:"";display:block;width:27px;height:27px;border:2px solid #a78bfa;border-radius:50%;background:radial-gradient(circle,#090912 0 3px,#a78bfa 3.5px 4.5px,#171322 5px 8px,#51417f 8.5px 9.5px,#0b0b14 10px);box-shadow:inset 0 0 0 3px #11111c,0 0 8px -2px var(--purple-2);animation:recordspin 2s linear infinite}
body[data-page="receptionist"] .voice-widget-toggle.is-record::after{content:"";position:absolute;width:7px;height:7px;border-radius:50%;background:var(--purple-2)}
body[data-page="receptionist"] .voice-widget-toggle.is-record-paused::before{filter:grayscale(1);animation-play-state:paused}
@keyframes recordspin{to{transform:rotate(360deg)}}
body[data-page="receptionist"] .viz-wrap.is-docked{position:fixed;right:24px;bottom:92px;width:min(360px,calc(100vw - 48px));z-index:20}
body[data-page="receptionist"] .viz-wrap.is-docked .voice-demo{width:100%;transform:none}
body[data-page="receptionist"] .viz-wrap.is-docked{width:30px!important;height:30px;overflow:visible}
body[data-page="receptionist"] .viz-wrap.is-docked .voice-demo{width:30px;height:30px;min-height:30px;padding:0;border-radius:8px;overflow:visible}
body[data-page="receptionist"] .viz-wrap.is-docked .voice-demo>*:not(.voice-widget-toggle){display:none}
body[data-page="receptionist"] .viz-wrap.is-docked .voice-widget-toggle{position:static;width:30px;height:30px;border-radius:8px;background:rgba(15,15,25,.96);color:var(--purple-2)}
body[data-page="receptionist"] .viz-wrap.is-minimized{width:54px!important;height:54px;right:24px;bottom:92px;overflow:visible}
body[data-page="receptionist"] .viz-wrap.is-minimized .voice-demo{width:54px;height:54px;min-height:54px;padding:0;border-radius:8px;overflow:hidden}
body[data-page="receptionist"] .viz-wrap.is-minimized .voice-demo>*:not(.voice-widget-toggle){display:none}
body[data-page="receptionist"] .viz-wrap.is-minimized .voice-widget-toggle{position:static;width:54px;height:54px;border:0;border-radius:8px;background:var(--purple);color:#fff;font-size:1rem}
@media(max-width:700px){body[data-page="receptionist"] .viz-wrap.is-docked{right:14px;bottom:86px;width:30px!important}body[data-page="receptionist"] .viz-wrap.is-minimized{right:14px;bottom:86px}}

/* The pause control must remain visible after the call card has scrolled away. */
body[data-page="receptionist"].receptionist-call-docked .voice-widget-toggle{
  position:fixed!important;
  right:24px!important;
  bottom:92px!important;
  z-index:9999!important;
  display:grid!important;
  place-items:center;
  width:52px!important;
  height:52px!important;
  padding:0!important;
  border-radius:12px!important;
  background:rgba(15,15,25,.96)!important;
  color:var(--purple-2)!important;
}
@media(max-width:700px){
  body[data-page="receptionist"].receptionist-call-docked .voice-widget-toggle{right:14px!important;bottom:86px!important;width:52px!important;height:52px!important}
}

/* Incoming-call screen: the demo starts as a real phone-call prompt. */
body[data-page="receptionist"] .voice-demo.is-incoming .bar{display:none}
body[data-page="receptionist"] .voice-demo.is-incoming .voice-call{min-height:540px;align-items:center;justify-content:center;text-align:center;padding:42px 24px;gap:28px}
body[data-page="receptionist"] .voice-demo.is-incoming .voice-call__identity{flex-direction:column;align-items:center;gap:30px}
body[data-page="receptionist"] .voice-demo.is-incoming .voice-call__identity>div:last-child{align-items:center}
body[data-page="receptionist"] .voice-demo.is-incoming .voice-call__avatar{width:150px;height:150px;font-size:3.7rem;box-shadow:0 0 0 24px rgba(117,233,191,.22),0 0 48px rgba(117,233,191,.25)}
body[data-page="receptionist"] .voice-demo.is-incoming .voice-call__identity strong{font-size:2.25rem;line-height:1.1}
body[data-page="receptionist"] .voice-demo.is-incoming .voice-call__identity span{display:none}
body[data-page="receptionist"] .voice-demo.is-incoming .voice-call__actions{gap:90px;margin-top:8px;align-items:flex-start}
body[data-page="receptionist"] .voice-demo.is-incoming .voice-call__action{display:flex;flex-direction:column;align-items:center;gap:12px}
body[data-page="receptionist"] .voice-demo.is-incoming .voice-call__actions button{width:112px;height:112px;font-size:2.3rem}
body[data-page="receptionist"] .voice-demo.is-incoming .voice-call__action>span{font:700 1.05rem Inter,sans-serif}
body[data-page="receptionist"] .voice-demo.is-incoming .voice-call__action--answer>span{color:#69e6b1}
body[data-page="receptionist"] .voice-demo.is-incoming .voice-call__action--hangup>span{color:#ff6068}
body[data-page="receptionist"] .voice-demo.is-incoming .voice-call__wave,
body[data-page="receptionist"] .voice-demo.is-incoming .voice-call__status,
body[data-page="receptionist"] .voice-demo.is-incoming .voice-audio,
body[data-page="receptionist"] .voice-demo.is-incoming .voice-call__hack,
body[data-page="receptionist"] .voice-demo.is-incoming .voice-widget-toggle{display:none!important}
body[data-page="receptionist"] .viz-wrap:has(.voice-demo.is-incoming) .f-chip{display:none}
@media(max-width:700px){
  body[data-page="receptionist"] .voice-demo.is-incoming .voice-call{min-height:500px;padding:30px 16px;gap:24px}
  body[data-page="receptionist"] .voice-demo.is-incoming .voice-call__avatar{width:116px;height:116px;font-size:2.9rem;box-shadow:0 0 0 18px rgba(117,233,191,.22),0 0 36px rgba(117,233,191,.25)}
  body[data-page="receptionist"] .voice-demo.is-incoming .voice-call__identity strong{font-size:1.75rem}
  body[data-page="receptionist"] .voice-demo.is-incoming .voice-call__actions{gap:46px}
  body[data-page="receptionist"] .voice-demo.is-incoming .voice-call__actions button{width:88px;height:88px;font-size:1.9rem}
}

/* Keep the headphone decoration clear of the call controls. */
body[data-page="receptionist"] .f-chip.c3{left:auto;right:-8%;bottom:-4%}

/* Preserve the original visual metrics after the semantic heading pass. */
body[data-page="receptionist"] h1,
body[data-page="receptionist"] h2,
body[data-page="receptionist"] h3,
body[data-page="receptionist"] h4{line-height:1.08;padding:0;margin-inline:0;overflow:visible}
body[data-page="receptionist"] .grad-text{display:inline;padding-inline:.08em;margin-inline:-.08em;overflow:visible}

/* Keep the phone-call demo's italic/gradient paint from being sheared at the edges. */
body[data-page="receptionist"] .hero h1 .grad-text.grad-text,
body[data-page="receptionist"] .section .grad-text.grad-text{padding:.3em .35em!important;margin-inline:-.35em!important;-webkit-box-decoration-break:clone!important;box-decoration-break:clone!important}

@media(max-width:700px){
  body[data-page="receptionist"] #products .vals{
    grid-template-columns:1fr!important;
  }
  body[data-page="receptionist"] #products .val{
    padding:24px;
  }
  body[data-page="receptionist"] #products .val p{
    font-size:.96rem;
    line-height:1.6;
  }
}
