/* Existing page layout, scoped to the v2 preview. */
.landing .v2-page *{box-sizing: border-box;}
.landing .v2-page a{color: inherit;
      text-decoration: none;}
.landing .v2-page .wrap{width: min(1340px, calc(100% - 48px));
      margin: 0 auto;}
.landing .v2-page .hero{display: grid;
      grid-template-columns: minmax(0, 0.82fr) minmax(420px, 0.58fr);
      gap: 56px;
      align-items: end;
      padding: 72px 0 56px;}
.landing .v2-page .kicker{margin-bottom: 16px;
      color: rgb(var(--accent));
      font-size: 14px;
      font-weight: 760;
      letter-spacing: 0.08em;
      text-transform: uppercase;}
.landing .v2-page h1,
.landing .v2-page h2,
.landing .v2-page h3,
.landing .v2-page p{margin-top: 0;}
.landing .v2-page h1{max-width: 860px;
      margin-bottom: 22px;
      color: rgb(var(--text));
      font-size: calc(clamp(40px, 4.7vw, 52px) + 1px);
      line-height: 1.05;
      font-weight: 600;
      letter-spacing: 0;}
.landing .v2-page .lead{max-width: 820px;
      margin-bottom: 0;
      color: rgb(var(--muted));
      font-size: 20px;
      line-height: 1.62;}
.landing .v2-page .hero-actions{display: flex;
      flex-wrap: wrap;
      gap: 12px;
      margin-top: 30px;}
.landing .v2-page .hero-action-note{max-width: 620px;
      margin-top: 14px;
      margin-bottom: 0;
      color: rgb(var(--muted));
      font-size: 15px;
      line-height: 1.55;}
.landing .v2-page .button{display: inline-flex;
      align-items: center;
      justify-content: center;
      min-height: 38px;
      padding: 0 16px;
      border: 1px solid #0f172a;
      border-radius: 4px;
      background: #0f172a;
      color: #ffffff;
      font-size: 15px;
      font-weight: 560;
      white-space: nowrap;
      transition: background 180ms ease, color 180ms ease, border-color 180ms ease;}
.landing .v2-page .hero-actions .button::after{content: "->";
      margin-left: 10px;
      transition: transform 180ms ease;}
.landing .v2-page .button:hover,
.landing .v2-page .button:focus-visible{background: #ffffff;
      color: #0f172a;}
.landing .v2-page .hero-actions .button:hover::after,
.landing .v2-page .hero-actions .button:focus-visible::after{transform: translateX(3px);}
.landing .v2-page .button.secondary{background: transparent;
      color: rgb(var(--text));
      border-color: rgb(var(--line-neutral));}
.landing .v2-page .button.secondary:hover,
.landing .v2-page .button.secondary:focus-visible{border-color: #0f172a;
      background: #ffffff;
      color: #0f172a;}
.landing .v2-page .hero-card,
.landing .v2-page .surface-card,
.landing .v2-page .step-card,
.landing .v2-page .use-card,
.landing .v2-page .auth-card,
.landing .v2-page .skill-strip,
.landing .v2-page .metric-card,
.landing .v2-page .visual-card{border: 1px solid rgb(var(--line));
      border-radius: 4px;
      background: rgb(var(--surface));}
.landing .v2-page .hero-card{min-width: 0;
      padding: 24px;
      background: linear-gradient(180deg, rgb(var(--surface-soft)) 0%, rgb(var(--surface)) 100%);}
.landing .v2-page .metric-grid{display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 10px;
      margin-bottom: 18px;}
.landing .v2-page .metric-card{padding: 18px;
      background: rgb(var(--surface));
      border-color: rgb(var(--line));}
.landing .v2-page .metric-card strong{display: block;
      color: rgb(var(--text));
      font-size: 31px;
      line-height: 1;
      font-weight: 760;}
.landing .v2-page .metric-card span{display: block;
      margin-top: 8px;
      color: rgb(var(--muted));
      font-size: 14px;
      line-height: 1.35;}
.landing .v2-page .endpoint-box{padding: 18px;
      border-radius: 4px;
      background: rgb(var(--code));
      color: #dbeafe;
      overflow-x: auto;}
.landing .v2-page .endpoint-box pre{margin: 0;}
.landing .v2-page .endpoint-box code{font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
      font-size: 14px;
      line-height: 1.7;
      color: inherit;}
.landing .v2-page .copy-row{display: flex;
      flex-wrap: wrap;
      gap: 10px;
      margin-top: 12px;}
.landing .v2-page .copy-button{appearance: none;
      border: 1px solid rgb(var(--line-neutral));
      border-radius: 4px;
      background: rgb(var(--surface));
      color: rgb(var(--text));
      padding: 9px 12px;
      font: inherit;
      font-size: 13px;
      font-weight: 720;
      letter-spacing: 0.04em;
      text-transform: uppercase;
      cursor: pointer;
      transition: border-color 0.18s ease, background 0.18s ease, color 0.18s ease;}
.landing .v2-page .copy-button:hover,
.landing .v2-page .copy-button:focus-visible{border-color: rgb(var(--accent));
      background: rgb(var(--surface-soft));
      outline: none;}
.landing .v2-page .section{padding: 64px 0;
      scroll-margin-top: 92px;}
.landing .v2-page .section-head{display: grid;
      grid-template-columns: minmax(0, 0.72fr) minmax(0, 1fr);
      gap: 44px;
      align-items: start;
      margin-bottom: 30px;}
.landing .v2-page .section-title{margin: 0;
      color: rgb(var(--text));
      font-size: calc(clamp(30px, 3.4vw, 38px) + 1px);
      line-height: 1.08;
      font-weight: 560;
      letter-spacing: 0;}
.landing .v2-page .section-copy{margin: 0;
      max-width: 820px;
      color: rgb(var(--muted));
      font-size: 17px;
      line-height: 1.68;}
.landing .v2-page .surface-grid{display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 18px;}
.landing .v2-page .surface-card{padding: 26px;
      background: rgb(var(--surface-muted));
      border-color: rgb(var(--line-neutral));}
.landing .v2-page .surface-card .label,
.landing .v2-page .step-card .label,
.landing .v2-page .use-card .label,
.landing .v2-page .auth-card .label{display: inline-flex;
      margin-bottom: 12px;
      color: rgb(var(--accent));
      font-size: 13px;
      font-weight: 760;
      letter-spacing: 0.08em;
      text-transform: uppercase;}
.landing .v2-page .surface-card h3,
.landing .v2-page .step-card h3,
.landing .v2-page .use-card h3,
.landing .v2-page .auth-card h3,
.landing .v2-page .skill-strip h3{margin: 0 0 10px;
      color: rgb(var(--text));
      font-size: 21px;
      line-height: 1.25;
      font-weight: 620;}
.landing .v2-page .surface-card p,
.landing .v2-page .step-card p,
.landing .v2-page .use-card p,
.landing .v2-page .auth-card p,
.landing .v2-page .skill-strip p{margin: 0;
      color: rgb(var(--muted));
      font-size: 15px;
      line-height: 1.64;}
.landing .v2-page .steps{display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 18px;}
.landing .v2-page .step-card{padding: 22px;
      min-width: 0;
      background: rgb(var(--surface));}
.landing .v2-page .step-card .step-note{margin-top: 14px;}
.landing .v2-page .step-number{display: inline-grid;
      place-items: center;
      width: 30px;
      height: 30px;
      margin-bottom: 18px;
      border-radius: 4px;
      background: #0f172a;
      color: #ffffff;
      font-size: 14px;
      font-weight: 650;}
.landing .v2-page .config-block{margin-top: 16px;
      padding: 14px;
      border-radius: 4px;
      background: rgb(var(--code));
      color: #dbeafe;
      overflow-x: auto;}
.landing .v2-page .config-block pre{margin: 0;}
.landing .v2-page .config-block code{font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
      font-size: 13px;
      line-height: 1.62;
      color: inherit;}
.landing .v2-page .manual-grid{display: grid;
      grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
      gap: 18px;
      margin-top: 18px;}
.landing .v2-page .manual-panel{border: 1px solid rgb(var(--line-neutral));
      border-radius: 4px;
      background: rgb(var(--surface-muted));
      padding: 22px;
      min-width: 0;}
.landing .v2-page .manual-panel h3{margin: 0 0 10px;
      color: rgb(var(--text));
      font-size: 21px;
      line-height: 1.25;
      font-weight: 620;}
.landing .v2-page .manual-panel p,
.landing .v2-page .manual-panel li{color: rgb(var(--muted));
      font-size: 15px;
      line-height: 1.64;}
.landing .v2-page .manual-panel ol{margin: 14px 0 0 18px;
      padding: 0;}
.landing .v2-page .manual-code-head{display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      margin-bottom: 10px;}
.landing .v2-page .manual-code-title{color: rgb(var(--text));
      font-size: 13px;
      font-weight: 760;
      letter-spacing: 0.08em;
      text-transform: uppercase;}
.landing .v2-page .visual-grid{display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 18px;}
.landing .v2-page .visual-card{overflow: hidden;
      background: rgb(var(--surface));
      border-color: rgb(var(--line-neutral));}
.landing .v2-page .visual-card img{display: block;
      width: 100%;
      height: auto;
      background: rgb(var(--surface-muted));
      border-bottom: 1px solid rgb(var(--line-neutral));}
.landing .v2-page .visual-card figcaption{margin: 0;
      padding: 16px 18px 18px;
      color: rgb(var(--muted));
      font-size: 15px;
      line-height: 1.56;}
.landing .v2-page .use-grid{display: grid;
      grid-template-columns: repeat(4, minmax(0, 1fr));
      gap: 16px;}
.landing .v2-page .use-card,
.landing .v2-page .auth-card{padding: 22px;
      background: rgb(var(--surface));
      border-color: rgb(var(--line-neutral));}
.landing .v2-page .prompt{margin-top: 14px;
      padding: 12px;
      border-radius: 4px;
      background: rgb(var(--surface-soft));
      color: rgb(var(--muted));
      font-size: 14px;
      line-height: 1.52;}
.landing .v2-page .skill-strip{display: grid;
      grid-template-columns: minmax(0, 1fr) auto;
      gap: 24px;
      align-items: center;
      padding: 28px;
      background: rgb(var(--surface-soft));}
.landing .v2-page .auth-grid{display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 18px;}
@media (max-width: 1100px) {
.landing .v2-page .hero,
.landing .v2-page .section-head,
.landing .v2-page .skill-strip{grid-template-columns: 1fr;}
.landing .v2-page .use-grid{grid-template-columns: repeat(2, minmax(0, 1fr));}
}
@media (max-width: 760px) {
.landing .v2-page .wrap{width: min(100% - 32px, 1340px);}
.landing .v2-page .hero{padding: 58px 0 40px;
        gap: 30px;}
.landing .v2-page .section{padding: 48px 0;}
.landing .v2-page .metric-grid,
.landing .v2-page .surface-grid,
.landing .v2-page .steps,
.landing .v2-page .visual-grid,
.landing .v2-page .use-grid,
.landing .v2-page .manual-grid,
.landing .v2-page .auth-grid{grid-template-columns: 1fr;}
}
