/* Product information follows the same type scale and spacing as Use Cases. */
.product-hero { display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: 64px; padding-block: 65px 95px; }
.product-hero-copy { min-width: 0; }.product-hero-copy h1 { font-size: clamp(44px, 4.9vw, 74px); }
.product-hero-copy > p { margin: 27px 0 32px; max-width: 490px; font-size: 18px; line-height: 1.75; }
.product-hero-copy .actions { gap: 22px; }.product-hero-art { min-width: 0; }.product-hero-art .product-visual { aspect-ratio: 1.05; height: auto; }
.product-example-caption { display: block; font-size: 11px; letter-spacing: .08em; color: var(--muted); margin-top: 17px; }
.product-possibilities { border-top: 1px solid var(--line); }.product-workflow { background: var(--neutral-100); }.product-workflow .process-grid p { max-width: none; }
.product-brief { display: grid; grid-template-columns: 1fr 1fr; gap: 70px; align-items: start; }.product-brief > div > p { font-size: 16px; line-height: 1.8; margin-top: 25px; max-width: 470px; }
.product-brief blockquote { display: flex; flex-direction: column; position: relative; margin: 0; padding: 36px; font: 400 24px/1.5 Garet, sans-serif; letter-spacing: -.03em; background: var(--neutral-150); }
.product-brief blockquote .eyebrow { letter-spacing: .1em; margin-bottom: 24px; font-size: 11px; }.product-brief-star { font-size: 58px; align-self: end; line-height: 1; margin-top: 36px; color: #7c679f; }

.product-directory-hero { padding-block: 72px 68px; }.product-directory-hero > div:not(.actions) { display: grid; grid-template-columns: 1.3fr .7fr; gap: 70px; align-items: end; }.product-directory-hero h1 { font-size: clamp(56px, 6.1vw, 88px); }.product-directory-hero p { font-size: 18px; line-height: 1.8; max-width: 420px; padding-bottom: 6px; }.product-directory-hero .actions { margin-top: 32px; }
.product-directory { padding-top: 0; }.product-tool-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 48px 24px; }.product-tool-card { display: block; min-width: 0; }.product-tool-card > .product-visual { aspect-ratio: 1.2; height: auto; transition: transform .35s var(--ease); }.product-tool-card:hover > .product-visual { transform: translateY(-4px); }
.product-card-title { display: flex; align-items: start; justify-content: space-between; gap: 15px; margin: 22px 0 11px; }.product-card-title h3 { font-size: 22px; line-height: 1.35; letter-spacing: -.035em; }.product-card-title .arrow { width: 16px; height: 16px; margin-top: 7px; }.product-tool-card p { font-size: 16px; line-height: 1.75; }.product-related-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 30px; }.product-tools-journey { background: #e4edb5; }
.product-studio-hero { padding-top: 65px; }.product-studio-intro { display: grid; grid-template-columns: 1.15fr .85fr; gap: 80px; align-items: end; }.product-studio-intro h1 { font-size: clamp(56px, 5.9vw, 88px); }.product-studio-intro p { max-width: 465px; font-size: 18px; line-height: 1.8; }.product-studio-intro .actions { margin-top: 30px; gap: 20px; }
.product-studio-preview { position: relative; overflow: hidden; background: #c9baff; padding: 65px 5% 0; margin-top: 60px; }.product-studio-preview > img { width: 100%; box-shadow: 0 15px 60px #221b4440; border-radius: var(--radius-surface) var(--radius-surface) 0 0; }.product-preview-label { position: absolute; left: 5%; top: 25px; font-size: 11px; letter-spacing: .1em; color: #40324f; }
.product-studio-features { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 30px; }.product-studio-features article { min-width: 0; }.product-studio-features img { aspect-ratio: 1.3; object-fit: cover; width: 100%; }.product-studio-features h3 { margin-top: 25px; font-size: 26px; }.product-studio-features p { font-size: 16px; line-height: 1.8; margin-top: 16px; }.product-studio-possibilities { background: var(--neutral-100); }
@media (max-width: 1100px) {
  .product-hero { gap: 36px; }.product-tool-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 40px 28px; }.product-studio-intro { gap: 40px; }.product-studio-features { gap: 25px; }.product-studio-features h3 { font-size: 23px; }
}
@media (max-width: 800px) {
  .product-hero { grid-template-columns: 1fr; padding-block: 40px 65px; gap: 36px; }.product-hero-copy > p { max-width: 620px; }.product-hero-art { width: 100%; max-width: 600px; margin-inline: auto; }.product-hero-art .product-visual { aspect-ratio: 1.2; }.product-brief { gap: 35px; }.product-brief blockquote { padding: 27px; font-size: 22px; }.product-directory-hero > div:not(.actions) { grid-template-columns: 1fr; gap: 25px; }.product-directory-hero p { max-width: 580px; }.product-studio-intro { grid-template-columns: 1fr; gap: 25px; }.product-studio-intro p { max-width: 590px; }.product-studio-features { grid-template-columns: 1fr; gap: 42px; }.product-studio-features img { aspect-ratio: 1.8; }.product-studio-features p { max-width: 580px; }.product-related-grid { grid-template-columns: 1fr; gap: 36px; }.product-related-grid .product-visual { aspect-ratio: 1.55; }
}
@media (max-width: 600px) {
  .product-hero { padding-top: 34px; }.product-hero-copy h1 { font-size: clamp(40px, 10.6vw, 60px); }.product-hero-copy > p { margin-block: 23px 28px; }.product-hero-copy .actions { gap: 18px; }.product-example-caption { font-size: 10px; line-height: 1.6; }.product-brief { grid-template-columns: 1fr; gap: 30px; }.product-brief blockquote { padding: 28px; font-size: 22px; }.product-brief-star { font-size: 48px; margin-top: 25px; }.product-directory-hero { padding-block: 42px 40px; }.product-directory-hero h1, .product-studio-intro h1 { font-size: clamp(43px, 11vw, 65px); }.product-tool-grid { grid-template-columns: 1fr; gap: 34px; }.product-tool-card > .product-visual { aspect-ratio: 1.4; }.product-card-title { margin-top: 18px; }.product-studio-hero { padding-top: 38px; }.product-studio-preview { margin-top: 36px; padding-top: 46px; }.product-preview-label { font-size: 8px; top: 18px; }.product-studio-preview > img { min-width: 450px; width: 145%; max-width: none; }.product-studio-features img { aspect-ratio: 1.35; }.product-studio-features h3 { font-size: 24px; }.product-studio-features p { margin-top: 12px; }
}
@media (prefers-reduced-motion: reduce) { .product-tool-card > .product-visual { transition: none; } }
