/*
 * AIAI_DESKTOP_HOME_TWO_COLUMNS_V1
 * Responsive enhancement only. Below 1024px, existing CSS is unchanged.
 * RTL first column = right side: title, task and examples.
 * Second column = left side: intact example recommendation.
 */
@media (min-width:1024px) {
  .lh-page .lh-header {
    max-width:1240px;
    padding:28px 32px 0;
  }
  .lh-page .lh-main {
    display:grid;
    grid-template-columns:minmax(0, .96fr) minmax(0, 1.04fr);
    grid-template-areas:
      "intro preview"
      "composer preview"
      "samples preview";
    grid-template-rows:auto auto 1fr;
    align-items:start;
    column-gap:clamp(40px, 4.8vw, 72px);
    row-gap:0;
    max-width:1240px;
    padding:42px 32px 0;
    direction:rtl;
  }
  .lh-page .lh-hero {
    grid-area:intro;
    min-width:0;
    padding-top:20px;
    text-align:right;
  }
  .lh-page .lh-hero h1 {
    font-size:clamp(36px, 3.25vw, 47px);
    line-height:1.48;
    text-align:right;
  }
  .lh-page .lh-hero p {
    margin-top:18px;
    font-size:15px;
    line-height:1.85;
    text-align:right;
  }
  .lh-page .lh-task-input {
    grid-area:composer;
    min-width:0;
    margin-top:30px;
    padding:19px;
    border-radius:18px;
  }
  .lh-page .lh-task-input textarea {
    min-height:148px;
    font-size:16px;
    line-height:1.9;
  }
  .lh-page .lh-primary-button {
    height:54px;
    border-radius:11px;
    margin-top:10px;
  }
  .lh-page .lh-chips {
    grid-area:samples;
    min-width:0;
    display:grid;
    grid-template-columns:repeat(2, minmax(0,1fr));
    gap:10px;
    margin-top:14px;
  }
  .lh-page .lh-chip {
    height:41px;
    font-size:13px!important;
    border-radius:10px;
  }
  .lh-page .lh-showcase {
    grid-area:preview;
    align-self:start;
    min-width:0;
    margin-top:0;
    padding-bottom:0;
  }
  .lh-page .lh-showcase-heading {
    justify-content:flex-start;
    min-height:30px;
    margin:0 0 16px!important;
    font-size:13px;
  }
  .lh-page .lh-result-card {
    border-radius:19px;
  }
  .lh-page .lh-card-content {
    padding:24px 26px 27px;
  }
  .lh-page .lh-footer {
    margin-top:65px;
    padding-block:26px 32px;
  }
}
@media (min-width:1600px) {
  .lh-page .lh-main {padding-top:54px;}
}
