/* Editee feature redesign. This layer deliberately reuses the source page's
   typeface, color tokens, radii and dark surfaces. */

.urgency .timer,
.final .timer-big {
  display: none !important;
}

.urgency {
  gap: 12px;
}

.urgency .u-label {
  color: rgba(255,255,255,.88);
  font-weight: 800;
}

.urgency .u-proof {
  padding: 4px 10px;
  border: 1px solid rgba(237,113,249,.24);
  border-radius: 999px;
  background: rgba(237,113,249,.08);
  color: rgba(255,255,255,.72);
  font-size: 11px;
  font-weight: 700;
}

.urgency[data-phase="deadline"] .timer,
.urgency[data-phase="final"] .timer,
body[data-urgency-phase="deadline"] .final .timer-big,
body[data-urgency-phase="final"] .final .timer-big {
  display: inline-flex !important;
}

.urgency[data-phase="final"] .u-label {
  color: #fff;
}

.urgency[data-phase="final"] .u-proof {
  border-color: rgba(237,113,249,.42);
  background: rgba(237,113,249,.14);
  color: #fff;
}

.features-section {
  position: relative;
  overflow: hidden;
  padding: 104px 0 112px;
  background:
    radial-gradient(circle at 18% 8%, rgba(131,107,243,.13), transparent 28%),
    radial-gradient(circle at 88% 43%, rgba(237,113,249,.08), transparent 24%),
    var(--bg-soft) !important;
}

.features-section::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: .18;
  background-image:
    linear-gradient(rgba(255,255,255,.022) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.022) 1px, transparent 1px);
  background-size: 54px 54px;
  mask-image: linear-gradient(to bottom, #000, transparent 48%);
}

.features-section .wrap {
  position: relative;
  z-index: 1;
}

.features-section .section-head {
  max-width: 860px;
  margin-bottom: 48px;
}

.features-section .section-head h2 {
  max-width: 840px;
  margin-inline: auto;
}

.features-section .section-head p {
  max-width: 760px;
  margin-inline: auto;
  line-height: 1.58;
}

.feature-showcase {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 16px;
}

.feature-card {
  --accent-rgb: 131,107,243;
  position: relative;
  min-width: 0;
  overflow: hidden;
  padding: 24px;
  border: 1px solid rgba(255,255,255,.105);
  border-radius: 22px;
  background:
    radial-gradient(circle at 94% 6%, rgba(var(--accent-rgb),.16), transparent 32%),
    linear-gradient(180deg, rgba(27,22,50,.98), rgba(12,11,24,.99));
  box-shadow:
    inset 0 1px 0 rgba(var(--accent-rgb),.34),
    0 18px 46px rgba(0,0,0,.18);
  transition: transform .24s ease, border-color .24s ease, box-shadow .24s ease;
  isolation: isolate;
}

.feature-card::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
  background: linear-gradient(135deg, rgba(255,255,255,.035), transparent 32%);
}

.feature-card:hover {
  transform: translateY(-4px);
  border-color: rgba(var(--accent-rgb),.48);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.07),
    0 24px 58px rgba(0,0,0,.30),
    0 0 0 1px rgba(131,107,243,.06);
}

.card-chat { --accent-rgb: 237,113,249; }
.card-project { --accent-rgb: 131,107,243; }
.card-research { --accent-rgb: 56,189,248; }
.card-copy { --accent-rgb: 168,85,247; }
.card-graphics { --accent-rgb: 237,113,249; }
.card-agent { --accent-rgb: 16,185,129; }
.card-social { --accent-rgb: 96,165,250; }
.card-translate { --accent-rgb: 245,158,11; }
.card-upscale { --accent-rgb: 237,113,249; }
.card-audio { --accent-rgb: 168,85,247; }
.card-docs { --accent-rgb: 131,107,243; }
.card-converter { --accent-rgb: 14,165,233; }
.card-ocr { --accent-rgb: 16,185,129; }

.bento-span-4 { grid-column: span 4; }
.bento-span-5 { grid-column: span 5; }
.bento-span-6 { grid-column: span 6; }
.bento-span-7 { grid-column: span 7; }
.bento-span-8 { grid-column: span 8; }

.feature-card .fc-icon {
  width: 40px;
  height: 40px;
  margin-bottom: 13px;
  border: 1px solid rgba(var(--accent-rgb),.30);
  border-radius: 12px;
  background: linear-gradient(135deg, rgba(var(--accent-rgb),.24), rgba(var(--accent-rgb),.09));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.10);
}

.feature-card .fc-icon svg {
  width: 20px;
  height: 20px;
}

.feature-label {
  display: block;
  margin-bottom: 7px;
  color: rgb(var(--accent-rgb));
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .1em;
  line-height: 1.2;
  text-transform: uppercase;
}

.feature-card h4,
.features-section .feature-hero h3 {
  max-width: 630px;
  margin: 0 0 9px;
  color: #fff;
  font-size: 22px;
  font-weight: 900;
  letter-spacing: -.55px;
  line-height: 1.13;
}

.feature-card > p,
.features-section .feature-hero > div > p {
  max-width: 650px;
  margin: 0 0 12px;
  color: var(--ink-3);
  font-size: 14px;
  font-weight: 500;
  line-height: 1.5;
}

.feature-card > p strong,
.features-section .feature-hero p strong {
  color: rgba(255,255,255,.92);
  font-weight: 750;
}

.feature-card .fc-pills,
.features-section .feature-hero .tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  min-height: 23px;
  margin: 0 0 16px !important;
}

.feature-card .fc-pills span,
.features-section .feature-hero .tag {
  padding: 4px 8px;
  border: 1px solid rgba(var(--accent-rgb),.20);
  border-radius: 999px;
  background: rgba(var(--accent-rgb),.10) !important;
  color: #D8D1F0 !important;
  font-size: 10px;
  font-weight: 750;
  line-height: 1.1;
}

.feature-visual {
  position: relative;
  min-height: 182px;
  margin-top: auto;
  overflow: hidden;
  border: 1px solid rgba(var(--accent-rgb),.17);
  border-radius: 15px;
  background:
    radial-gradient(circle at 90% 10%, rgba(var(--accent-rgb),.08), transparent 38%),
    rgba(8,7,18,.78);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.045), 0 16px 34px rgba(0,0,0,.22);
}

.mini-window {
  min-height: 182px;
}

.window-bar {
  height: 36px;
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 0 11px;
  border-bottom: 1px solid rgba(255,255,255,.065);
  color: var(--ink-4);
  font-size: 8.7px;
  font-weight: 750;
}

.window-bar > i {
  width: 5px;
  height: 5px;
  flex: 0 0 auto;
  border-radius: 50%;
  background: #ED71F9;
  box-shadow: 9px 0 #836BF3, 18px 0 #42C98B;
}

.window-bar > span {
  margin-left: 18px;
}

.window-bar > b {
  margin-left: auto;
  padding: 3px 7px;
  border-radius: 999px;
  background: rgba(16,185,129,.10);
  color: #74E5B5;
  font-size: 7.7px;
  font-weight: 850;
}

.brand-icon {
  min-width: 38px;
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 5px;
  color: var(--ink-3);
  font-size: 7px;
  font-weight: 750;
  line-height: 1;
  text-align: center;
}

.brand-icon img {
  width: 26px;
  height: 26px;
  display: block;
  object-fit: contain;
}

.brand-icon.logo-mono img {
  filter: invert(1);
}

/* Chat / routing -------------------------------------------------------- */
.features-section .feature-hero {
  min-height: 428px;
  display: grid;
  grid-template-columns: .92fr 1.08fr;
  align-items: center;
  gap: 28px;
  padding: 30px;
  background:
    radial-gradient(circle at 95% 4%, rgba(237,113,249,.32), transparent 36%),
    radial-gradient(circle at 3% 95%, rgba(131,107,243,.22), transparent 35%),
    linear-gradient(145deg, #231748 0%, #15102F 46%, #0C0B19 100%);
}

.features-section .feature-hero::after {
  width: 250px;
  height: 250px;
  top: -120px;
  right: -90px;
  opacity: .28;
}

.features-section .feature-hero h3 {
  font-size: 27px;
  letter-spacing: -.85px;
}

.features-section .feature-hero .icon-wrap {
  width: 44px;
  height: 44px;
  margin-bottom: 15px;
  border: 1px solid rgba(255,255,255,.13);
  border-radius: 13px;
  background: rgba(255,255,255,.075) !important;
}

.features-section .feature-hero .feature-visual {
  min-height: 338px;
  margin: 0;
  border-color: rgba(255,255,255,.12);
  background: rgba(9,8,21,.76);
  backdrop-filter: blur(18px);
}

.chat-product .model-dock {
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 10px 12px 0;
}

.chat-product .model-dock .brand-icon {
  min-width: 30px;
  padding: 5px 7px;
  border: 1px solid rgba(255,255,255,.075);
  border-radius: 9px;
  background: rgba(255,255,255,.035);
}

.chat-product .model-dock .brand-icon img {
  width: 18px;
  height: 18px;
}

.chat-product .model-dock .brand-icon span {
  display: none;
}

.model-more {
  width: 28px;
  height: 28px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(255,255,255,.09);
  border-radius: 9px;
  background: rgba(255,255,255,.035);
  color: var(--ink-3);
  font-size: 8px;
  font-weight: 850;
}

.prompt-bubble {
  width: calc(100% - 50px);
  margin: 9px 12px 0 auto;
  padding: 9px 11px;
  border: 1px solid rgba(131,107,243,.26);
  border-radius: 11px 11px 4px 11px;
  background: rgba(131,107,243,.13);
  color: #F4F1FC;
  font-size: 9px;
  line-height: 1.35;
}

.prompt-bubble small {
  display: block;
  margin-bottom: 4px;
  color: #C7BAFF;
  font-size: 6px;
  font-weight: 900;
  letter-spacing: .1em;
}

.routing-row {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 8px 12px;
  padding: 7px 9px;
  border: 1px solid rgba(237,113,249,.16);
  border-radius: 9px;
  background: rgba(237,113,249,.06);
  color: var(--ink-4);
  font-size: 7.5px;
}

.routing-row > b {
  margin-left: auto;
  display: flex;
  align-items: center;
  color: #E5DFF5;
}

.routing-row .brand-icon {
  min-width: 22px;
  flex-direction: row;
  gap: 4px;
  color: inherit;
}

.routing-row .brand-icon img {
  width: 15px;
  height: 15px;
}

.result-panel {
  margin: 0 12px 12px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.075);
  border-radius: 11px;
  background: rgba(255,255,255,.028);
}

.result-head,
.result-line,
.result-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 10px;
  border-bottom: 1px solid rgba(255,255,255,.055);
  color: var(--ink-3);
  font-size: 8px;
}

.result-head {
  color: #fff;
  font-size: 9px;
  font-weight: 850;
}

.result-head b,
.result-line b {
  margin-left: auto;
  color: #74E5B5;
  font-size: 7px;
}

.result-line i {
  width: 12px;
  height: 12px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: rgba(16,185,129,.13);
}

.result-line i::after {
  content: "✓";
  color: #74E5B5;
  font-size: 7px;
  font-style: normal;
}

.result-actions {
  border: 0;
  justify-content: flex-end;
}

.result-actions span,
.result-actions strong {
  padding: 5px 7px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 6px;
  background: rgba(255,255,255,.035);
  color: var(--ink-3);
  font-size: 7px;
}

.result-actions strong {
  border-color: transparent;
  background: var(--brand-grad);
  color: #fff;
}

/* Projects ------------------------------------------------------------- */
.card-project {
  min-height: 428px;
}

.project-window {
  padding-bottom: 10px;
}

.project-heading {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 8px 10px 0;
  padding: 8px;
  border: 1px solid rgba(255,255,255,.065);
  border-radius: 9px;
  background: rgba(255,255,255,.028);
}

.project-mark {
  width: 30px;
  height: 30px;
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  border-radius: 9px;
  background: var(--brand-grad);
  color: #fff;
  box-shadow: 0 8px 18px rgba(131,107,243,.24);
  font-size: 7px;
  font-weight: 900;
}

.project-heading > div {
  min-width: 0;
  display: flex;
  flex: 1;
  flex-direction: column;
}

.project-heading strong {
  overflow: hidden;
  color: #F5F2FB;
  font-size: 8.5px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.project-heading small {
  margin-top: 2px;
  color: var(--ink-4);
  font-size: 6.5px;
}

.project-heading > i {
  color: var(--ink-4);
  font-size: 8px;
  font-style: normal;
  letter-spacing: 2px;
}

.file-token {
  width: 28px;
  height: 28px;
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  border-radius: 8px;
  background: rgba(131,107,243,.18);
  color: #E7E2F7;
  font-size: 7px;
  font-weight: 900;
}

.file-token.web {
  background: rgba(237,113,249,.13);
}

.file-token.note {
  background: rgba(16,185,129,.12);
  color: #83E7BA;
}

.context-sources {
  display: grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 6px;
  margin: 7px 10px;
}

.context-sources > div {
  position: relative;
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 7px 4px;
  border: 1px solid rgba(255,255,255,.065);
  border-radius: 8px;
  background: rgba(255,255,255,.025);
  text-align: center;
}

.context-sources > div > b {
  margin-top: 4px;
  color: #EDE8F6;
  font-size: 6.7px;
}

.context-sources > div > small {
  margin-top: 2px;
  color: var(--ink-4);
  font-size: 5.7px;
}

.context-sources > div > i {
  position: absolute;
  top: 5px;
  right: 5px;
  color: #74E5B5;
  font-size: 6px;
  font-style: normal;
}

.context-result {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  margin: 0 10px 7px;
  padding: 6px 7px;
  border-radius: 7px;
  background: rgba(131,107,243,.07);
  color: var(--ink-4);
  font-size: 6.2px;
}

.context-result i {
  color: #ED71F9;
  font-style: normal;
}

.context-result strong {
  color: #D9D1FF;
  font-weight: 800;
}

.project-output {
  display: flex;
  align-items: center;
  gap: 6px;
  margin: 0 10px;
  padding: 7px 8px;
  border: 1px solid rgba(131,107,243,.18);
  border-radius: 8px;
  background: rgba(131,107,243,.08);
  color: var(--ink-3);
  font-size: 7px;
}

.project-output i {
  color: #ED71F9;
  font-style: normal;
}

.project-output span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.project-output b {
  margin-left: auto;
  color: #74E5B5;
  font-size: 6.5px;
}

/* Research + text ------------------------------------------------------ */
.card-research,
.card-copy {
  min-height: 370px;
}

.search-prompt {
  display: flex;
  align-items: center;
  gap: 7px;
  margin: 10px;
  padding: 9px 10px;
  border: 1px solid rgba(131,107,243,.22);
  border-radius: 9px;
  background: rgba(131,107,243,.07);
  color: var(--ink-3);
  font-size: 8.2px;
}

.search-prompt b {
  color: #E9E5F6;
  font-weight: 750;
}

.search-prompt i {
  margin-left: auto;
  color: #ED71F9;
  font-size: 6.5px;
  font-style: normal;
}

.research-results {
  padding: 0 10px 10px;
}

.research-results > div {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 7px 0;
  border-bottom: 1px solid rgba(255,255,255,.055);
}

.research-results > div > b {
  width: 22px;
  color: #836BF3;
  font-size: 7px;
}

.research-results > div > span {
  display: flex;
  flex: 1;
  flex-direction: column;
}

.research-results strong {
  color: #EDE9F7;
  font-size: 8px;
}

.research-results small {
  margin-top: 2px;
  color: var(--ink-4);
  font-size: 7px;
}

.research-results > div > i {
  width: 16px;
  height: 16px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: rgba(16,185,129,.10);
  color: #74E5B5;
  font-size: 7px;
  font-style: normal;
}

.editor-layout {
  min-height: 174px;
  display: grid;
  grid-template-columns: 104px 1fr;
}

.outline-panel {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 12px 10px;
  border-right: 1px solid rgba(255,255,255,.06);
  background: rgba(255,255,255,.016);
}

.outline-panel small {
  color: var(--ink-4);
  font-size: 6.5px;
  letter-spacing: .12em;
}

.outline-panel b {
  color: var(--ink-3);
  font-size: 7px;
  font-weight: 650;
}

.outline-panel b:nth-child(3) {
  color: #C7BAFF;
}

.article-panel {
  position: relative;
  padding: 10px 12px;
}

.editor-tools {
  display: flex;
  align-items: center;
  gap: 5px;
  padding-bottom: 8px;
  border-bottom: 1px solid rgba(255,255,255,.055);
}

.editor-tools span {
  min-width: 20px;
  padding: 3px 5px;
  border-radius: 5px;
  background: rgba(255,255,255,.04);
  color: var(--ink-4);
  font-size: 6.5px;
  text-align: center;
}

.editor-tools b {
  margin-left: auto;
  padding: 4px 7px;
  border-radius: 999px;
  background: rgba(16,185,129,.10);
  color: #74E5B5;
  font-size: 6.5px;
}

.article-panel h5 {
  margin: 10px 0 4px;
  color: #fff;
  font-size: 9px;
}

.article-panel > i,
.doc-canvas > i,
.doc-compare > div > i {
  display: block;
  width: 100%;
  height: 4px;
  margin-top: 7px;
  border-radius: 99px;
  background: rgba(255,255,255,.07);
}

.article-panel > i.w88 { width: 88%; }
.article-panel > i.w72 { width: 72%; }

.article-panel button {
  position: absolute;
  right: 10px;
  bottom: 9px;
  padding: 5px 7px;
  border: 1px solid rgba(131,107,243,.22);
  border-radius: 6px;
  background: #211A3D;
  color: #EDE9F7;
  font: inherit;
  font-size: 6.5px;
  font-weight: 750;
}

/* Graphics + agent ----------------------------------------------------- */
.card-graphics,
.card-agent {
  min-height: 398px;
}

.graphics-window {
  position: relative;
  min-height: 198px;
  overflow: hidden;
  background: #080711;
}

.graphics-window > img {
  width: 100%;
  height: 198px;
  display: block;
  object-fit: cover;
  opacity: .93;
}

.graphics-window::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(to top, rgba(8,7,17,.98), transparent 55%);
}

.graphics-prompt {
  position: absolute;
  z-index: 2;
  right: 9px;
  bottom: 36px;
  left: 9px;
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 7px 8px;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 9px;
  background: rgba(10,9,21,.74);
  backdrop-filter: blur(12px);
}

.graphics-prompt > span {
  color: #ED71F9;
}

.graphics-prompt p {
  overflow: hidden;
  flex: 1;
  margin: 0;
  color: #EDE9F7;
  font-size: 7px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.graphics-prompt b {
  color: #74E5B5;
  font-size: 6.5px;
}

.model-chips {
  position: absolute;
  z-index: 2;
  right: 9px;
  bottom: 9px;
  left: 9px;
  display: flex;
  gap: 5px;
}

.model-chips span {
  padding: 4px 6px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 6px;
  background: rgba(255,255,255,.035);
  color: var(--ink-3);
  font-size: 6px;
}

.agent-window {
  min-height: 198px;
}

.agent-command {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  margin: 10px;
  padding: 9px 10px;
  border: 1px solid rgba(131,107,243,.24);
  border-radius: 9px;
  background: rgba(131,107,243,.08);
  color: #E7E2F4;
  font-size: 8.2px;
  line-height: 1.35;
}

.agent-command i {
  color: #ED71F9;
  font-style: normal;
}

.agent-steps {
  display: grid;
  grid-template-columns: 1fr 18px 1fr 18px 1fr;
  align-items: center;
  gap: 3px;
  padding: 0 12px;
}

.agent-steps > .brand-icon {
  min-height: 56px;
  padding: 7px;
  border: 1px solid rgba(255,255,255,.075);
  border-radius: 10px;
  background: rgba(255,255,255,.03);
}

.agent-steps > i {
  height: 1px;
  background: linear-gradient(90deg, #836BF3, #ED71F9);
}

.agent-status {
  display: flex;
  align-items: center;
  margin: 9px 12px 0;
  padding: 6px 8px;
  border-radius: 7px;
  background: rgba(16,185,129,.08);
  color: #74E5B5;
  font-size: 7px;
}

.agent-status small {
  margin-left: auto;
  color: rgba(116,229,181,.68);
  font-size: 6px;
}

.works-with {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 6px 12px 0;
}

.works-with > small {
  margin-right: auto;
  color: var(--ink-4);
  font-size: 6px;
}

.works-with .brand-icon {
  min-width: 22px;
  flex-direction: row;
}

.works-with .brand-icon img {
  width: 15px;
  height: 15px;
}

.works-with .brand-icon span {
  display: none;
}

/* Social + translation ------------------------------------------------- */
.card-social,
.card-translate {
  min-height: 386px;
}

.social-window {
  min-height: 190px;
}

.social-dock {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 3px;
  padding: 9px 8px 7px;
  border-bottom: 1px solid rgba(255,255,255,.055);
}

.social-dock .brand-icon {
  min-width: 36px;
}

.social-dock .brand-icon img {
  width: 21px;
  height: 21px;
}

.social-dock .brand-icon span {
  display: none;
}

.social-toolbar {
  display: flex;
  align-items: center;
  padding: 8px 10px;
  color: var(--ink-3);
  font-size: 7.7px;
  font-weight: 750;
}

.social-toolbar b {
  margin-left: auto;
  padding: 4px 6px;
  border-radius: 6px;
  background: var(--brand-grad);
  color: #fff;
  font-size: 6px;
}

.calendar-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  margin: 0 9px 9px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.055);
  border-radius: 8px;
}

.calendar-grid > div {
  position: relative;
  min-height: 84px;
  padding: 6px;
  border-right: 1px solid rgba(255,255,255,.05);
}

.calendar-grid > div:last-child { border: 0; }

.calendar-grid small {
  color: var(--ink-4);
  font-size: 5.5px;
}

.post {
  position: absolute;
  right: 4px;
  left: 4px;
  top: 28px;
  padding: 5px;
  border-radius: 5px;
  background: rgba(228,64,95,.13);
  color: #F1EBF7;
  font-size: 5.5px;
  font-weight: 750;
}

.post em {
  display: block;
  margin-top: 3px;
  color: var(--ink-4);
  font-size: 5px;
  font-style: normal;
}

.post.li { top: 43px; background: rgba(10,102,194,.16); }
.post.tt { top: 34px; background: rgba(255,255,255,.07); }
.post.yt { top: 20px; background: rgba(255,0,0,.12); }

.translate-window {
  min-height: 190px;
  padding-bottom: 9px;
}

.language-switch {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 8px;
}

.language-switch span {
  padding: 5px 7px;
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 7px;
  background: rgba(255,255,255,.028);
  color: var(--ink-3);
  font-size: 6.5px;
}

.language-switch i {
  color: #836BF3;
  font-size: 8px;
  font-style: normal;
}

.doc-compare {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 7px;
  padding: 0 9px;
}

.doc-compare > div {
  min-height: 76px;
  padding: 8px;
  border: 1px solid rgba(255,255,255,.06);
  border-radius: 8px;
  background: rgba(255,255,255,.025);
}

.doc-compare b {
  color: #ECE8F6;
  font-size: 7.7px;
}

.doc-compare > div > i.short { width: 62%; }

.doc-compare span {
  display: block;
  margin-top: 9px;
  color: var(--ink-4);
  font-size: 5.5px;
}

.success-note {
  margin: 7px 9px 0;
  color: #74E5B5;
  font-size: 6.2px;
  text-align: center;
}

/* Three compact utilities --------------------------------------------- */
.card-upscale,
.card-audio,
.card-docs {
  min-height: 354px;
}

.upscale-window {
  position: relative;
  min-height: 174px;
  display: grid;
  grid-template-columns: 1fr 1fr;
}

.upscale-window > div {
  position: relative;
  overflow: hidden;
}

.upscale-window > div + div {
  border-left: 1px solid rgba(255,255,255,.11);
}

.upscale-window img {
  width: 100%;
  height: 174px;
  display: block;
  object-fit: cover;
}

.image-before img {
  filter: blur(3px) saturate(.7);
  transform: scale(1.06);
  opacity: .55;
}

.upscale-window div > b {
  position: absolute;
  top: 8px;
  left: 8px;
  padding: 4px 6px;
  border-radius: 6px;
  background: rgba(10,9,21,.72);
  color: var(--ink-3);
  font-size: 6px;
}

.upscale-window > span {
  position: absolute;
  z-index: 2;
  top: 50%;
  left: 50%;
  width: 36px;
  height: 36px;
  display: grid;
  place-items: center;
  transform: translate(-50%, -50%);
  border: 3px solid #0A0915;
  border-radius: 50%;
  background: var(--brand-grad);
  color: #fff;
  font-size: 8px;
  font-weight: 900;
}

.voice-person {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 9px 10px 0;
}

.voice-person > span {
  width: 30px;
  height: 30px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: var(--brand-grad);
  color: #fff;
  font-size: 7px;
  font-weight: 900;
}

.voice-person > div {
  display: flex;
  flex: 1;
  flex-direction: column;
}

.voice-person b {
  color: #EFEAF8;
  font-size: 7.5px;
}

.voice-person small {
  margin-top: 2px;
  color: var(--ink-4);
  font-size: 6px;
}

.voice-person > i {
  width: 25px;
  height: 25px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: rgba(131,107,243,.17);
  color: #fff;
  font-size: 7px;
  font-style: normal;
}

.waveform {
  height: 52px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 2px;
  margin: 6px 10px 0;
}

.waveform i {
  width: 2px;
  height: var(--wave);
  border-radius: 99px;
  background: linear-gradient(to top, #836BF3, #ED71F9);
  opacity: .85;
}

.audio-progress {
  display: flex;
  align-items: center;
  gap: 7px;
  margin: 0 10px 9px;
}

.audio-progress b {
  height: 3px;
  flex: 1;
  border-radius: 99px;
  background: linear-gradient(90deg, #ED71F9 42%, rgba(255,255,255,.08) 42%);
}

.audio-progress span {
  color: var(--ink-4);
  font-size: 5.5px;
}

.doc-tools {
  display: flex;
  gap: 5px;
  padding: 8px 10px;
  border-bottom: 1px solid rgba(255,255,255,.055);
}

.doc-tools span {
  min-width: 21px;
  padding: 3px;
  border-radius: 5px;
  background: rgba(255,255,255,.035);
  color: var(--ink-4);
  font-size: 6px;
  text-align: center;
}

.doc-canvas {
  position: relative;
  min-height: 113px;
  margin: 8px 10px 10px;
  padding: 10px;
  border-radius: 7px;
  background: rgba(255,255,255,.028);
}

.doc-canvas > b {
  color: #F1EDF8;
  font-size: 8px;
}

.doc-canvas > i.short { width: 64%; }

.doc-canvas > div {
  position: absolute;
  right: 7px;
  bottom: 7px;
  display: flex;
  gap: 4px;
}

.doc-canvas > div span,
.doc-canvas > div strong {
  padding: 4px 5px;
  border: 1px solid rgba(255,255,255,.065);
  border-radius: 5px;
  background: #17132B;
  color: var(--ink-4);
  font-size: 5.5px;
}

.doc-canvas > div strong {
  border-color: rgba(131,107,243,.28);
  color: #D8D0FF;
}

/* Conversion + OCR ----------------------------------------------------- */
.card-converter,
.card-ocr {
  min-height: 352px;
}

.converter-window,
.ocr-window {
  min-height: 178px;
}

.conversion-flow {
  display: grid;
  grid-template-columns: 1fr 32px 1fr;
  align-items: center;
  gap: 7px;
  padding: 14px 12px 8px;
}

.conversion-flow > div {
  min-height: 72px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 4px;
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 9px;
  background: rgba(255,255,255,.028);
}

.conversion-flow > div > span {
  color: #CBBFFF;
  font-size: 13px;
  font-weight: 900;
}

.conversion-flow > div > b {
  color: #EAE6F5;
  font-size: 7px;
}

.conversion-flow > div > small {
  color: var(--ink-4);
  font-size: 5.5px;
}

.conversion-flow > i {
  width: 30px;
  height: 30px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: var(--brand-grad);
  color: #fff;
  font-size: 10px;
  font-style: normal;
}

.conversion-result {
  display: flex;
  align-items: center;
  margin: 0 12px 10px;
  color: #74E5B5;
  font-size: 6.5px;
}

.conversion-result b {
  margin-left: auto;
  padding: 5px 7px;
  border-radius: 6px;
  background: rgba(131,107,243,.15);
  color: #E8E3F6;
  font-size: 6px;
}

.ocr-window {
  display: grid;
  grid-template-columns: .78fr 24px 1.22fr;
  align-items: center;
  gap: 8px;
  padding: 10px;
}

.receipt-card {
  position: relative;
  min-height: 155px;
  padding: 12px;
  overflow: hidden;
  border-radius: 8px;
  background: #EEEAF7;
  box-shadow: 0 10px 22px rgba(0,0,0,.28);
}

.receipt-card strong {
  color: #161227;
  font-size: 7px;
}

.receipt-card i {
  display: block;
  height: 3px;
  margin-top: 11px;
  border-radius: 99px;
  background: rgba(22,18,39,.17);
}

.receipt-card i:nth-of-type(2) { width: 74%; }
.receipt-card i:nth-of-type(3) { width: 88%; }

.receipt-card span {
  position: absolute;
  right: 6px;
  left: 6px;
  top: 51%;
  height: 2px;
  background: #ED71F9;
  box-shadow: 0 0 12px #ED71F9;
}

.scan-arrow {
  width: 24px;
  height: 24px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: var(--brand-grad);
  color: #fff;
  font-size: 8px;
}

.extracted-data {
  min-width: 0;
}

.extracted-data > small {
  color: #AFA5CA;
  font-size: 5.5px;
  letter-spacing: .1em;
}

.extracted-data > div {
  display: flex;
  gap: 6px;
  padding: 8px 0;
  border-bottom: 1px solid rgba(255,255,255,.055);
  color: var(--ink-4);
  font-size: 6.5px;
}

.extracted-data > div b {
  margin-left: auto;
  overflow: hidden;
  color: #E9E4F5;
  font-size: 6.5px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.extracted-data em {
  display: inline-block;
  margin-top: 9px;
  color: #74E5B5;
  font-size: 6.5px;
  font-style: normal;
}

/* Conversion handoff --------------------------------------------------- */
.feature-conversion {
  display: flex;
  align-items: center;
  gap: 28px;
  margin: 18px 0 0;
  padding: 22px 24px;
  border: 1px solid rgba(131,107,243,.24);
  border-radius: 18px;
  background:
    radial-gradient(circle at 84% 50%, rgba(237,113,249,.16), transparent 28%),
    linear-gradient(135deg, rgba(131,107,243,.13), rgba(255,255,255,.025));
}

.feature-conversion > div {
  display: flex;
  flex-direction: column;
}

.feature-conversion > div span {
  margin-bottom: 3px;
  color: #C8BDFF;
  font-size: 11px;
  font-weight: 850;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.feature-conversion > div strong {
  color: #fff;
  font-size: 16px;
  line-height: 1.3;
}

.feature-conversion > a {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-left: auto;
  padding: 13px 17px;
  border-radius: 10px;
  background: var(--brand-grad);
  color: #fff;
  box-shadow: 0 12px 28px rgba(131,107,243,.26);
  font-size: 13px;
  font-weight: 850;
  white-space: nowrap;
}

.features-section .value-strip {
  margin-top: 32px;
  border-color: rgba(255,255,255,.10);
  background:
    radial-gradient(circle at 85% 35%, rgba(131,107,243,.12), transparent 35%),
    rgba(10,9,21,.72);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.035);
}

/* Keep all later sections recognizably original, but tighten the rhythm. */
.comparison-section,
.pricing-section,
.reviews-section,
.faq-section {
  scroll-margin-top: calc(var(--urgency-h, 0px) + 76px);
}

.final p {
  max-width: 650px;
  margin-inline: auto;
  margin-bottom: 30px;
}

@media (max-width: 1020px) {
  .feature-showcase {
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }

  .bento-span-4,
  .bento-span-5,
  .bento-span-6,
  .bento-span-7,
  .bento-span-8 {
    grid-column: span 3;
  }

  .features-section .feature-hero {
    grid-column: span 6;
  }

  .card-project {
    grid-column: span 6;
    min-height: 360px;
  }

  .brand-icon {
    min-width: 32px;
  }
}

@media (max-width: 760px) {
  .urgency .u-proof {
    display: none;
  }

  .features-section {
    padding: 76px 0 84px;
  }

  .features-section .section-head {
    margin-bottom: 34px;
  }

  .features-section .section-head p {
    font-size: 16px;
  }

  .feature-showcase {
    grid-template-columns: 1fr;
    gap: 12px;
  }

  .bento-span-4,
  .bento-span-5,
  .bento-span-6,
  .bento-span-7,
  .bento-span-8,
  .features-section .feature-hero,
  .card-project {
    grid-column: 1;
    min-height: 0;
  }

  .feature-card {
    padding: 19px;
    border-radius: 18px;
  }

  .features-section .feature-hero {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 20px;
    padding: 22px;
  }

  .features-section .feature-hero h3 {
    font-size: 24px;
  }

  .feature-card h4 {
    font-size: 19px;
  }

  .feature-visual,
  .mini-window {
    min-height: 182px;
  }

  .features-section .feature-hero .feature-visual {
    min-height: 306px;
  }

  .graphics-window,
  .graphics-window > img {
    min-height: 218px;
    height: 218px;
  }

  .feature-conversion {
    align-items: stretch;
    flex-direction: column;
    gap: 16px;
  }

  .feature-conversion > a {
    justify-content: center;
    margin-left: 0;
  }

  .feature-card .fc-pills,
  .features-section .feature-hero .tags {
    flex-wrap: nowrap;
    overflow-x: auto;
    padding-bottom: 2px;
    scrollbar-width: none;
  }

  .feature-card .fc-pills::-webkit-scrollbar,
  .features-section .feature-hero .tags::-webkit-scrollbar {
    display: none;
  }

  .feature-card .fc-pills span,
  .features-section .feature-hero .tag {
    flex: 0 0 auto;
  }
}

@media (max-width: 460px) {
  .features-section {
    padding: 64px 0 72px;
  }

  .features-section .wrap {
    width: calc(100% - 28px);
  }

  .feature-card {
    padding: 18px;
  }

  .features-section .feature-hero {
    gap: 15px;
    padding: 18px;
  }

  .features-section .feature-hero h3 {
    font-size: 23px;
  }

  .feature-card .fc-icon,
  .features-section .feature-hero .icon-wrap {
    width: 37px;
    height: 37px;
    margin-bottom: 11px;
  }

  .feature-label {
    margin-bottom: 6px;
    font-size: 9px;
  }

  .feature-card > p,
  .features-section .feature-hero > div > p {
    margin-bottom: 11px;
    font-size: 14px;
    line-height: 1.46;
  }

  .feature-card .fc-pills span,
  .features-section .feature-hero .tag {
    padding: 4px 6px;
    font-size: 8.7px;
  }

  .features-section .feature-hero .feature-visual {
    min-height: 286px;
    max-height: 286px;
  }

  .chat-product .model-dock {
    gap: 5px;
    padding: 7px 9px 0;
  }

  .chat-product .model-dock .brand-icon {
    padding: 4px 6px;
  }

  .prompt-bubble {
    margin-top: 6px;
    padding: 7px 9px;
  }

  .routing-row {
    margin: 6px 9px;
    padding: 6px 8px;
  }

  .result-panel {
    margin: 0 9px 9px;
  }

  .result-head,
  .result-line {
    padding: 6px 8px;
  }

  .result-actions {
    display: none;
  }

  .feature-visual {
    border-radius: 13px;
  }

  .feature-showcase {
    gap: 10px;
  }

  .social-dock {
    justify-content: space-between;
  }

  .social-dock .brand-icon {
    min-width: 30px;
  }

  .social-dock .brand-icon img {
    width: 19px;
    height: 19px;
  }

  .editor-layout {
    grid-template-columns: 82px 1fr;
  }

  .agent-steps {
    padding: 0 7px;
  }

  .agent-steps > .brand-icon {
    min-width: 0;
    padding: 6px 3px;
  }

  .feature-conversion {
    padding: 19px;
  }

  .context-sources {
    gap: 4px;
    margin-inline: 8px;
  }

  .project-heading,
  .project-output,
  .context-result {
    margin-inline: 8px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .feature-card {
    transition: none;
  }
}