/* Valehealth case study page — layout and styling for content from index.html */

.redesign-portfolio-landing-page {
  font-family: 'Inter', sans-serif;
  color: #0a0a0a;
  padding-top: 0;
  position: relative;
}

/* Page-load reveal (Valehealth page only) */
.vh-js .redesign-portfolio-landing-page.vh-enter {
  opacity: 0;
  transform: translateY(10px);
  transition: opacity 520ms ease, transform 520ms ease;
}

.vh-js .redesign-portfolio-landing-page.vh-enter.vh-enter--active {
  opacity: 1;
  transform: translateY(0);
}

@media (prefers-reduced-motion: reduce) {
  .vh-js .redesign-portfolio-landing-page.vh-enter {
    opacity: 1;
    transform: none;
    transition: none;
  }
}

/* Hero image — full width at top */
.redesign-portfolio-landing-page .valehealth-hero {
  position: relative;
}

.redesign-portfolio-landing-page .valehealth-hero::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 55%;
  background: linear-gradient(
    to top,
    rgba(255, 255, 255, 0.92) 0%,
    rgba(255, 255, 255, 0.55) 40%,
    rgba(255, 255, 255, 0) 100%
  );
  pointer-events: none;
}

.redesign-portfolio-landing-page .frame-1-10 {
  display: block;
  width: 100%;
  height: auto;
  max-height: 480px;
  object-fit: cover;
  object-position: center;
  background: #e8f5f0;
}

/* Hero title overlay */
.redesign-portfolio-landing-page .valehealth-hero .container71 {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 22px;
  z-index: 1;
  max-width: 1440px;
  margin: 0 auto;
  padding: 0 80px;
  text-align: left;
  background: transparent;
}

.redesign-portfolio-landing-page .heading-1 {
  margin-bottom: 8px;
}

.redesign-portfolio-landing-page .valehealth-ai-sleep-support-chatbot {
  font-weight: 700;
  font-size: 43px;
  line-height: 1.2;
  letter-spacing: -0.5px;
  color: #0a0a0a;
}

.redesign-portfolio-landing-page .paragraph48,
.redesign-portfolio-landing-page .ux-case-study-health-marketplace-ai-chatbot {
  font-size: 22px;
  font-weight: 400;
  color: rgba(10, 10, 10, 0.75);
}

@media (max-width: 900px) {
  .redesign-portfolio-landing-page .valehealth-hero .container71 {
    padding: 0 40px;
  }

  .redesign-portfolio-landing-page .back-projects-wrap {
    padding: 0 40px 40px;
  }
}

@media (max-width: 600px) {
  .redesign-portfolio-landing-page .frame-1-10 {
    max-height: 420px;
  }
  .redesign-portfolio-landing-page .valehealth-hero .container71 {
    padding: 0 24px;
    bottom: 18px;
  }

  .redesign-portfolio-landing-page .back-projects-wrap {
    padding: 0 24px 40px;
  }
}

/* App = main content wrapper (reset .container from main styles inside this page) */
.redesign-portfolio-landing-page .app .container {
  max-width: none;
  padding: 0;
  margin: 0;
}

.redesign-portfolio-landing-page .app {
  max-width: 1440px;
  margin: 0 auto;
  padding: 0 80px 60px;
}

/* Section header row (e.g. Overview + [i]) */
.redesign-portfolio-landing-page .container2 {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 16px;
}

.redesign-portfolio-landing-page .paragraph,
.redesign-portfolio-landing-page .paragraph7,
.redesign-portfolio-landing-page .paragraph12,
.redesign-portfolio-landing-page .paragraph20,
.redesign-portfolio-landing-page .paragraph36,
.redesign-portfolio-landing-page .paragraph40,
.redesign-portfolio-landing-page .paragraph42 {
  font-weight: 700;
  font-size: 24px;
}

.redesign-portfolio-landing-page .overview,
.redesign-portfolio-landing-page .problem-background,
.redesign-portfolio-landing-page .goals-success-criteria,
.redesign-portfolio-landing-page .research-discovery,
.redesign-portfolio-landing-page .decision-making-design-principles,
.redesign-portfolio-landing-page .interaction-design-prototypes,
.redesign-portfolio-landing-page .what-i-learned-next-steps {
  font-weight: 700;
}

/* Only the "Overview" label uses Georgia regular */
.redesign-portfolio-landing-page .overview,
.redesign-portfolio-landing-page .problem-background,
.redesign-portfolio-landing-page .goals-success-criteria,
.redesign-portfolio-landing-page .research-discovery,
.redesign-portfolio-landing-page .decision-making-design-principles,
.redesign-portfolio-landing-page .interaction-design-prototypes,
.redesign-portfolio-landing-page .what-i-learned-next-steps {
  font-family: "Georgia", serif;
  font-weight: 400;
}

.redesign-portfolio-landing-page .paragraph2 .i,
.redesign-portfolio-landing-page .paragraph8 .ii,
.redesign-portfolio-landing-page .paragraph13 .iii,
.redesign-portfolio-landing-page .paragraph21 .iv,
.redesign-portfolio-landing-page .paragraph37 .v,
.redesign-portfolio-landing-page .paragraph41 .vi,
.redesign-portfolio-landing-page .paragraph43 .vii {
  font-size: 22px;
  color: #717182;
}

/* Two-column layout (Overview) */
.redesign-portfolio-landing-page .container3 {
  display: flex;
  gap: 48px;
  align-items: flex-start;
  margin-bottom: 32px;
  flex-wrap: wrap;
}

.redesign-portfolio-landing-page .container4 {
  flex: 1 1 50%;
  min-width: 280px;
}

.redesign-portfolio-landing-page .heading-3 {
  margin-bottom: 12px;
}

.redesign-portfolio-landing-page .designing-an-ai-chatbot-for-sleep-support-on-valeh,
.redesign-portfolio-landing-page .designing-an-ai-chatbot-for-sleep-support-on-valeh2 {
  font-weight: 600;
  font-size: 19px;
  line-height: 1.35;
}

.redesign-portfolio-landing-page .paragraph3 {
  margin-bottom: 24px;
  color: #717182;
}

.redesign-portfolio-landing-page .helping-users-understand-and-improve-their-sleep-w,
.redesign-portfolio-landing-page .helping-users-understand-and-improve-their-sleep-w2 {
  font-size: 19px;
  line-height: 1.6;
  color: #717182;
}

/* Key details list */
.redesign-portfolio-landing-page .container6 {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.redesign-portfolio-landing-page .container7 {
  display: flex;
  align-items: flex-start;
  gap: 12px;
}

.redesign-portfolio-landing-page .container8 {
  width: 6px;
  height: 6px;
  min-width: 6px;
  margin-top: 8px;
  background: #0a0a0a;
  border-radius: 0;
}

.redesign-portfolio-landing-page .paragraph4 {
  font-weight: 600;
  font-size: 17px;
}

.redesign-portfolio-landing-page .paragraph5 {
  font-size: 17px;
  line-height: 1.5;
  color: #717182;
}

/* Overview right column image */
.redesign-portfolio-landing-page .container13 {
  flex: 0 1 45%;
  min-width: 280px;
}

.redesign-portfolio-landing-page .image-sleep-wellness {
  width: 100%;
  height: auto;
  max-height: 420px;
  object-fit: cover;
  border-radius: 8px;
  background: #f0f0f0;
}

/* Highlight bar */
.redesign-portfolio-landing-page .container14 {
  padding: 20px 24px;
  background: rgba(0, 0, 0, 0.04);
  border-radius: 6px;
}

.a-conversational-ai-assistant-integrated-into-vale-span2{
  text-transform: uppercase;
}

.redesign-portfolio-landing-page .paragraph6 {
  font-weight: 500;
  font-size: 20px;
  line-height: 1.5;
  letter-spacing: 0.02em;
  text-align: center;
}

.redesign-portfolio-landing-page .a-conversational-ai-assistant-integrated-into-vale-span3 {
  font-weight: 700;
}

/* Section block (Problem / Background, etc.) */
/* Section spacing: 40px padding bottom + 1px stroke (4% black) on bottom */
.redesign-portfolio-landing-page .app > .container,
.redesign-portfolio-landing-page .app > .container15,
.redesign-portfolio-landing-page .app > .container66 {
  padding-bottom: 40px;
  padding-top: 50px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.04);
}

.redesign-portfolio-landing-page .container15,
.redesign-portfolio-landing-page .container66 {
  margin-bottom: 0;
}

/* Remove only the What I Learned / Next Steps divider */
.redesign-portfolio-landing-page .app > .container66 {
  border-bottom: none;
}

/* Bottom-left back link */
.redesign-portfolio-landing-page .back-projects-wrap {
  max-width: 1440px;
  margin: 24px auto 0;
  padding: 0 80px 5px;
}

.redesign-portfolio-landing-page .back-to-projects {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  text-decoration: none;
  color: #0a0a0a;
  font-weight: 600;
  font-size: 18px;
  line-height: 1.3;
}

.redesign-portfolio-landing-page .back-to-projects:hover {
  opacity: 0.7;
}

.redesign-portfolio-landing-page .back-arrow {
  font-size: 20px;
  line-height: 1;
}

/* Problem / Background — 4 cards */
.redesign-portfolio-landing-page .container16 {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
  margin-top: 24px;
}

@media (max-width: 1100px) {
  .redesign-portfolio-landing-page .container16 {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 600px) {
  .redesign-portfolio-landing-page .container16 {
    grid-template-columns: 1fr;
  }
}

.redesign-portfolio-landing-page .container17,
.redesign-portfolio-landing-page .container18,
.redesign-portfolio-landing-page .container19,
.redesign-portfolio-landing-page .container20 {
  padding: 24px;
  border: 1px solid rgba(0, 0, 0, 0.08);
  border-radius: 8px;
  background: #fff;
}

.redesign-portfolio-landing-page .heading-4 {
  font-weight: 600;
  font-size: 19px;
  margin-bottom: 12px;
}

.redesign-portfolio-landing-page .paragraph9,
.redesign-portfolio-landing-page .paragraph10,
.redesign-portfolio-landing-page .paragraph11 {
  font-size: 17px;
  line-height: 1.55;
  color: #717182;
}

/* Goals / Success Criteria — two columns */
.redesign-portfolio-landing-page .container21,
.redesign-portfolio-landing-page .container25 {
  flex: 1;
  min-width: 260px;
}

.redesign-portfolio-landing-page .container22 {
  margin-top: 12px;
}

.redesign-portfolio-landing-page .container23,
.redesign-portfolio-landing-page .container24 {
  display: flex;
  gap: 12px;
  margin-bottom: 12px;
}

.redesign-portfolio-landing-page .paragraph14,
.redesign-portfolio-landing-page .paragraph15 {
  font-size: 18px;
  line-height: 1.5;
  color: #717182;
}

.redesign-portfolio-landing-page .container26 {
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin-top: 12px;
}

.redesign-portfolio-landing-page .container27,
.redesign-portfolio-landing-page .container29,
.redesign-portfolio-landing-page .container30 {
  padding: 20px;
  background: rgba(0, 0, 0, 0.04);
  border-radius: 8px;
}

.redesign-portfolio-landing-page .container28 {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 8px;
}

.redesign-portfolio-landing-page .icon,
.redesign-portfolio-landing-page .icon2,
.redesign-portfolio-landing-page .ooui-check-all {
  width: 24px;
  height: 24px;
}

.redesign-portfolio-landing-page .paragraph16,
.redesign-portfolio-landing-page .paragraph18,
.redesign-portfolio-landing-page .paragraph19 {
  font-weight: 600;
  font-size: 17px;
}

.redesign-portfolio-landing-page .paragraph17 {
  font-size: 16px;
  line-height: 1.5;
  color: #717182;
}

/* Research & Discovery */
.redesign-portfolio-landing-page .container31 {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 16px;
}

.redesign-portfolio-landing-page .container32 {
  margin-bottom: 32px;
}

.redesign-portfolio-landing-page .iframe {
  width: 100%;
  height: 400px;
  background: #f5f5f5;
  border-radius: 8px;
  margin-bottom: 16px;
  overflow: hidden;
}

.redesign-portfolio-landing-page .iframe iframe {
  width: 100%;
  height: 100%;
  min-height: 400px;
  border: none;
  border-radius: 8px;
  display: block;
}

.redesign-portfolio-landing-page .paragraph22,
.redesign-portfolio-landing-page .interactive-research-synthesis-board-replace-wit {
  font-size: 17px;
  color: #666;
}

/* Research & Discovery — 2×3 card grid under iframe */
.redesign-portfolio-landing-page .container33 {
  margin-top: 32px;
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.redesign-portfolio-landing-page .container33 .frame-5,
.redesign-portfolio-landing-page .container33 .frame-63 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
  margin-bottom: 0;
}

.redesign-portfolio-landing-page .container33 .frame-5 {
  margin-bottom: 0;
}

.redesign-portfolio-landing-page .container33 .container34,
.redesign-portfolio-landing-page .container33 .container38,
.redesign-portfolio-landing-page .container33 .container40,
.redesign-portfolio-landing-page .container33 .container48,
.redesign-portfolio-landing-page .container33 .container53 {
  background: #f5f5f5;
  border-radius: 12px;
  padding: 24px;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
  margin-bottom: 0;
}

.redesign-portfolio-landing-page .container35 {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  margin-bottom: 12px;
}

.redesign-portfolio-landing-page .container36,
.redesign-portfolio-landing-page .container41 {
  width: 28px;
  height: 28px;
  min-width: 28px;
  background: #0a0a0a;
  color: #fff;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 17px;
}

.i-went-through-the-demographic-insights-to-evaluat{
  padding-bottom: 50px;
}

.establish-why-the-current-solution-was-insufficien{
  font-weight: 500;
}

.redesign-portfolio-landing-page .heading-42,
.redesign-portfolio-landing-page .heading-43,
.redesign-portfolio-landing-page .heading-44,
.redesign-portfolio-landing-page .heading-45 {
  font-weight: 600;
  font-size: 20px;
}

.redesign-portfolio-landing-page .frame-52 {
  margin-top: 12px;
  display: flex;
  flex-direction: column;
  gap: 100px;
}

.redesign-portfolio-landing-page .frame-52 .container37 {
  margin-top: 0;
}

.redesign-portfolio-landing-page .frame-6,
.redesign-portfolio-landing-page .frame-64 {
  margin-top: 12px;
}

.redesign-portfolio-landing-page .paragraph23,
.redesign-portfolio-landing-page .paragraph26,
.redesign-portfolio-landing-page .paragraph34 {
  font-size: 18px;
  line-height: 1.55;
  margin-bottom: 12px;
  color: #717182;
}

.redesign-portfolio-landing-page .container33 .container37 {
  margin-top: 16px;
  padding: 16px 20px;
  background: #EEFAF5;
  border-left: 4px solid #2d7a5e;
  border-radius: 0 8px 8px 0;
}

.redesign-portfolio-landing-page .container33 .container37 .paragraph24,
.redesign-portfolio-landing-page .container33 .container37 .paragraph25,
.redesign-portfolio-landing-page .container33 .container37 .establish-why-the-current-solution-was-insufficien {
  color: #1a5c47;
}

.redesign-portfolio-landing-page .container33 .container37 .paragraph24 {
  font-weight: 700;
  margin-bottom: 8px;
}

/* Research bar chart (card 2) */
.redesign-portfolio-landing-page .container39.research-bar-chart {
  display: flex;
  flex-direction: column;
  margin-top: 16px;
  padding: 20px 0 12px;
  min-height: 200px;
}

.redesign-portfolio-landing-page .research-bar-chart .chart-row {
  display: flex;
  align-items: flex-end;
  gap: 8px;
  flex: 1;
  min-height: 120px;
  margin-bottom: 4px;
}

.redesign-portfolio-landing-page .research-bar-chart .chart-y-labels {
  display: flex;
  flex-direction: column-reverse;
  justify-content: space-between;
  height: 120px;
  font-size: 14px;
  color: #666;
  margin-right: 8px;
  flex-shrink: 0;
}

.redesign-portfolio-landing-page .research-bar-chart .chart-bars-wrap {
  display: flex;
  align-items: flex-end;
  gap: 8px;
  flex: 1;
  height: 120px;
}

.redesign-portfolio-landing-page .research-bar-chart .chart-bar-wrap {
  flex: 1;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: center;
}

.redesign-portfolio-landing-page .research-bar-chart .chart-bar {
  width: 100%;
  max-width: 36px;
  min-height: 6px;
  background: #d0d0d0;
  border-radius: 4px 4px 0 0;
}

.redesign-portfolio-landing-page .research-bar-chart .chart-bar-highlight {
  background: #2d7a5e;
}

.redesign-portfolio-landing-page .research-bar-chart .chart-x-labels {
  display: flex;
  justify-content: space-between;
  gap: 4px;
  font-size: 14px;
  color: #555;
  padding-top: 12px;
  margin-top: 8px;
  border-top: 1px solid #e0e0e0;
  flex-shrink: 0;
}

.redesign-portfolio-landing-page .research-bar-chart .chart-x-labels .chart-x {
  flex: 1;
  text-align: center;
  min-width: 0;
}

.redesign-portfolio-landing-page .container39.user-population-graph-wrap {
  margin-top: 16px;
}

.redesign-portfolio-landing-page .user-population-graph-wrap .user-population-graph {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 8px;
}

.redesign-portfolio-landing-page .container39:not(.user-population-graph-wrap),
.redesign-portfolio-landing-page .container42 {
  margin-top: 16px;
  display: flex;
  flex-direction: row;
  gap: 32px;
  align-items: flex-start;
  flex-wrap: wrap;
}

.redesign-portfolio-landing-page .container42 .container43,
.redesign-portfolio-landing-page .container42 .container47 {
  flex: 1;
  min-width: 200px;
  margin-top: 0;
}

.redesign-portfolio-landing-page .container47,
.redesign-portfolio-landing-page .container49,
.redesign-portfolio-landing-page .container50,
.redesign-portfolio-landing-page .container54 {
  margin-top: 16px;
}

/* AI Opportunity card — concluding note (smaller, italic, lighter grey, subtle background) */
.redesign-portfolio-landing-page .container33 .container48 .container54 {
  margin-top: 20px;
  padding: 16px 20px;
  background: white;
  border-radius: 8px;
}

.redesign-portfolio-landing-page .container33 .container48 .container54 .paragraph35,
.redesign-portfolio-landing-page .container33 .container48 .container54 .establish-why-the-current-solution-was-insufficien2 {
  font-size: 15px;
  line-height: 1.5;
  color: #666;
  font-style: italic;
  margin: 0;
}

.redesign-portfolio-landing-page .paragraph24,
.redesign-portfolio-landing-page .paragraph27 {
  font-weight: 600;
  font-size: 17px;
  margin-bottom: 8px;
}

.redesign-portfolio-landing-page .container44,
.redesign-portfolio-landing-page .container51 {
  margin-left: 0;
}

.redesign-portfolio-landing-page .container45,
.redesign-portfolio-landing-page .container52 {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 6px;
}

.redesign-portfolio-landing-page .container46 {
  width: 6px;
  height: 6px;
  min-width: 6px;
  background: #0a0a0a;
  border-radius: 0;
}

.redesign-portfolio-landing-page .paragraph28,
.redesign-portfolio-landing-page .paragraph29,
.redesign-portfolio-landing-page .paragraph30,
.redesign-portfolio-landing-page .paragraph31,
.redesign-portfolio-landing-page .paragraph32,
.redesign-portfolio-landing-page .paragraph33 {
  font-size: 17px;
  line-height: 1.45;
}

.redesign-portfolio-landing-page .paragraph25,
.redesign-portfolio-landing-page .paragraph35,
.redesign-portfolio-landing-page .establish-why-the-current-solution-was-insufficien,
.redesign-portfolio-landing-page .establish-why-the-current-solution-was-insufficien2 {
  font-size: 17px;
  line-height: 1.5;
  color: #444;
}

.redesign-portfolio-landing-page .icon3 {
  margin-top: 16px;
}

.redesign-portfolio-landing-page .icon3 img {
  max-width: 100%;
  height: auto;
}

/* Decision Making & Design Principles */
.redesign-portfolio-landing-page .container15 .container31 {
  margin-bottom: 8px;
}

.redesign-portfolio-landing-page .container55 {
  margin-top: 24px;
  margin-bottom: 20px;
  padding: 24px 28px;
  background: #F7FAFF;
  border-radius: 12px;
  border: none;
}

.redesign-portfolio-landing-page .container59 {
  margin-bottom: 20px;
  padding: 24px 28px;
  background: #F8FEFA;
  border-radius: 12px;
  border: none;
}

.redesign-portfolio-landing-page .container60 {
  margin-bottom: 20px;
  padding: 24px 28px;
  background: #FFFDF5;
  border-radius: 12px;
  border: none;
}

.redesign-portfolio-landing-page .container55 .container56,
.redesign-portfolio-landing-page .container59 .container56,
.redesign-portfolio-landing-page .container60 .container56 {
  display: flex;
  gap: 20px;
  align-items: flex-start;
}

.redesign-portfolio-landing-page .container55 .container57,
.redesign-portfolio-landing-page .container59 .container57,
.redesign-portfolio-landing-page .container60 .container57 {
  flex-shrink: 0;
}

.redesign-portfolio-landing-page .container55 .icon4,
.redesign-portfolio-landing-page .container59 .icon5 {
  width: 60px;
  height: 60px;
  color: #28a745;
}

.redesign-portfolio-landing-page .container60 .icon6 {
  width: 60px;
  height: 60px;
  color: #e6a800;
}

.redesign-portfolio-landing-page .container58 {
  flex: 1;
  min-width: 0;
}

.redesign-portfolio-landing-page .container55 .heading-4,
.redesign-portfolio-landing-page .container59 .heading-4,
.redesign-portfolio-landing-page .container60 .heading-4 {
  font-weight: 700;
  font-size: 20px;
  color: #333333;
  margin-bottom: 0;
}

.redesign-portfolio-landing-page .container55 .paragraph38,
.redesign-portfolio-landing-page .container59 .paragraph38,
.redesign-portfolio-landing-page .container60 .paragraph38 {
  font-size: 17px;
  line-height: 1.6;
  margin-top: 10px;
  color: #555555;
  font-weight: 400;
}

.redesign-portfolio-landing-page .the-chatbot-was-designed-to-feel-supportive-and-hu-span2,
.redesign-portfolio-landing-page .product-suggestions-were-always-paired-with-clear-span2 {
  font-weight: 700;
  color: #333333;
}

/* Why This Approach — no box, heading + paragraph with spacing */
.redesign-portfolio-landing-page .container61 {
  margin-top: 32px;
  padding: 0;
  background: transparent;
  border-radius: 0;
  border: none;
}

.redesign-portfolio-landing-page .container61 .heading-46,
.redesign-portfolio-landing-page .container61 .why-this-approach {
  font-weight: 700;
  font-size: 22px;
  color: #333333;
  margin-bottom: 14px;
  margin-top: 0;
}

.redesign-portfolio-landing-page .container61 .paragraph39,
.redesign-portfolio-landing-page .container61 .many-health-chatbots-fail-by-being-either-too-gene {
  font-size: 18px;
  line-height: 1.6;
  color: #717182;
  margin: 0;
}

.redesign-portfolio-landing-page .many-health-chatbots-fail-by-being-either-too-gene-span2 {
  font-weight: 700;
}

/* Interaction Design & Prototypes */
.redesign-portfolio-landing-page .container62 {
  margin-bottom: 24px;
}

.redesign-portfolio-landing-page .heading-32 {
  margin-bottom: 12px;
}

/* Interaction Design & Prototypes - Stage 1 Layout */
.redesign-portfolio-landing-page .frame-65 {
  margin-top: 32px;
  margin-bottom: 24px;
}

.redesign-portfolio-landing-page .stage-1-ai-guided-conversation-trust-building {
  font-weight: 700;
  font-size: 22px;
  color: #333333;
  margin-bottom: 12px;
}

.redesign-portfolio-landing-page .container63 {
  margin-bottom: 24px;
}

.redesign-portfolio-landing-page .container63 .heading-47,
.redesign-portfolio-landing-page .heading-47 {
  font-size: 17px;
  line-height: 1.6;
  font-weight: 400;
  color: #555555;
  margin: 0;
}

/* Stage 1 horizontal layout: large image left, two stacked images right */
.redesign-portfolio-landing-page .frame-53.stage1-layout {
  display: flex;
  flex-direction: row;
  gap: 32px;
  align-items: flex-start;
  margin-top: 0;
}

.redesign-portfolio-landing-page .frame-53.stage1-layout > img {
  width: 100%;
  max-width: 100%;
  height: auto;
  display: block;
  border-radius: 8px;
}

.redesign-portfolio-landing-page .stage1-left {
  flex: 1.2;
  min-width: 0;
}

.redesign-portfolio-landing-page .stage1-right {
  flex: 0.8;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.redesign-portfolio-landing-page .stage1-left .chat-survey-interface-start-chat-frame-2-1 {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 8px;
  background: #f5f5f5;
  margin: 0;
}

.redesign-portfolio-landing-page .stage1-right .chat-survey-interface-frame-3-1,
.redesign-portfolio-landing-page .stage1-right .chat-survey-interface-habit-1-frame-4-1 {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 8px;
  background: #f5f5f5;
  margin: 0;
}

.redesign-portfolio-landing-page .stage1-right .container64 {
  margin-top: 0;
}

.redesign-portfolio-landing-page .stage1-right .heading-48,
.redesign-portfolio-landing-page .heading-48 {
  font-size: 17px;
  line-height: 1.6;
  font-weight: 400;
  color: #555555;
  margin: 0;
}

.redesign-portfolio-landing-page .frame-7 {
  margin-top: 32px;
  margin-bottom: 24px;
}

.redesign-portfolio-landing-page .stage-2-transition-to-product-discovery {
  font-weight: 700;
  font-size: 22px;
  margin-bottom: 16px;
}

.redesign-portfolio-landing-page .frame-54 {
  margin-top: 16px;
}

.redesign-portfolio-landing-page .chat-survey-interface-start-chat-frame-2-12,
.redesign-portfolio-landing-page .chat-survey-interface-frame-3-12,
.redesign-portfolio-landing-page .chat-survey-interface-habit-1-frame-4-12 {
  max-width: 100%;
  height: auto;
  display: block;
  margin: 12px 0;
  border-radius: 8px;
  background: #f5f5f5;
}

.redesign-portfolio-landing-page .frame-68 {
  margin-bottom: 16px;
}

.redesign-portfolio-landing-page .frame-69 {
  display: flex;
  flex-wrap: wrap;
  gap: 24px;
  align-items: flex-start;
}

.redesign-portfolio-landing-page .frame-72 {
  margin-top: 16px;
}

.redesign-portfolio-landing-page .container64,
.redesign-portfolio-landing-page .container65,
.redesign-portfolio-landing-page .sleep-problems-are-common-valehealth-wanted-a-fea4,
.redesign-portfolio-landing-page .sleep-problems-are-common-valehealth-wanted-a-fea5,
.redesign-portfolio-landing-page .sleep-problems-are-common-valehealth-wanted-a-fea6 {
  font-size: 17px;
  line-height: 1.5;
}

.redesign-portfolio-landing-page .vector-1,
.redesign-portfolio-landing-page .vector-2 {
  max-width: 100%;
  height: auto;
}

/* What I Learned / Next Steps */
.redesign-portfolio-landing-page .container67,
.redesign-portfolio-landing-page .container70 {
  flex: 1;
  min-width: 260px;
}

.redesign-portfolio-landing-page .container68 {
  margin-top: 12px;
  color: #717182;
}

.redesign-portfolio-landing-page .container69 {
  display: flex;
  gap: 12px;
  margin-bottom: 10px;
}

.redesign-portfolio-landing-page .paragraph44,
.redesign-portfolio-landing-page .paragraph45,
.redesign-portfolio-landing-page .paragraph46,
.redesign-portfolio-landing-page .paragraph47 {
  font-size: 18px;
  line-height: 1.5;
}

/* Bold/emphasis spans */
.redesign-portfolio-landing-page .users-don-t-know-how-to-choose-sleep-related-produ-span2,
.redesign-portfolio-landing-page .use-an-ai-chatbot-to-ask-questions-educate-and-r-span2,
.redesign-portfolio-landing-page .the-chatbot-was-designed-to-feel-supportive-and-hu-span2,
.redesign-portfolio-landing-page .product-suggestions-were-always-paired-with-clear-span2,
.redesign-portfolio-landing-page .many-health-chatbots-fail-by-being-either-too-gene-span2,
.redesign-portfolio-landing-page .i-went-through-available-demographic-data-to-under-span2,
.redesign-portfolio-landing-page .sleep-problems-are-common-valehealth-wanted-a-fea-4-span,
.redesign-portfolio-landing-page .sleep-problems-are-common-valehealth-wanted-a-fea-5-span,
.redesign-portfolio-landing-page .sleep-problems-are-common-valehealth-wanted-a-fea-6-span {
  font-weight: 600;
}

/* Responsive */
@media (max-width: 900px) {
  .redesign-portfolio-landing-page .app {
    padding-left: 40px;
    padding-right: 40px;
  }
}

@media (max-width: 600px) {
  .redesign-portfolio-landing-page .container33 .frame-5,
  .redesign-portfolio-landing-page .container33 .frame-63 {
    grid-template-columns: 1fr;
  }

  .redesign-portfolio-landing-page .frame-53.stage1-layout {
    flex-direction: column;
    gap: 20px;
  }

  .redesign-portfolio-landing-page .stage1-left,
  .redesign-portfolio-landing-page .stage1-right {
    flex: 1;
  }

  .redesign-portfolio-landing-page .app {
    padding-left: 24px;
    padding-right: 24px;
  }

  .redesign-portfolio-landing-page .valehealth-ai-sleep-support-chatbot {
    font-size: 34px;
  }

  .redesign-portfolio-landing-page .container3 {
    flex-direction: column;
  }

  .redesign-portfolio-landing-page .container13 {
    order: -1;
  }
}