/* Product discovery: an image-led opening, then two complete, readable showcases. */
body[data-layout="products"] { background:#081628; }
.products-skip { position:fixed; top:-80px; left:24px; z-index:100; padding:12px 18px; background:#fff; color:#10233d; }
.products-skip:focus { top:16px; }
:is(.products-hero,.product-feature,.products-contact) :is(h1,h2,h3) { font-family:"Inter",system-ui,sans-serif; font-weight:400; letter-spacing:-.05em; line-height:1.08; margin:0; text-wrap:balance; }
.products-hero { background:#061426; color:#f2f6fd; overflow:hidden; }
/* The artwork belongs to the viewport-wide stage, not the capped text grid. */
.products-hero__stage { position:relative; isolation:isolate; display:flex; align-items:center; min-height:clamp(720px,95svh,1040px); background:#061426; }
.products-hero__layout { position:relative; z-index:2; width:100%; padding-block:150px 88px; }
.products-hero__content { width:44%; min-width:0; }
.products-hero__media { position:absolute; inset:0 clamp(-120px,-6vw,-56px) 0 auto; z-index:0; width:min(78vw,1560px); height:100%; min-width:0; margin:0; pointer-events:none; mix-blend-mode:lighten; }
.products-hero__media img { display:block; width:100%; height:100%; object-fit:contain; object-position:right center; mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent); }
.products-hero__stage::after { content:""; position:absolute; inset:0; z-index:1; pointer-events:none; background:linear-gradient(90deg,#061426 0%,#061426f5 27%,#06142655 43%,transparent 58%); }
.products-hero h1 { font-size:clamp(45px,5.3vw,80px); max-width:14ch; letter-spacing:-.06em; line-height:1.04; }
.products-hero h1>span { display:block; }
.products-hero h1 em { color:#accdff; }
.products-hero__content>p { max-width:43ch; margin-top:30px; color:#c1d3ec; font-size:17px; line-height:1.7; }
.products-link { display:inline-flex; align-items:center; justify-content:space-between; gap:24px; min-height:44px; border-bottom:1px solid #7f9ec255; font-size:13px; line-height:1.5; color:inherit; }
.products-link>span { font-size:22px; transition:transform .25s ease; }
.products-link:hover { border-color:currentColor; }
.products-link:hover>span { transform:translate(2px,-2px); }
.products-hero__content>.products-link { margin-top:25px; color:#e0edff; }
.products-hero__content>.products-link:hover>span { transform:translateY(3px); }

/* A paired product sheet: embedded interfaces, with restrained focus for the half being explored. */
.products-showcase,.product-feature { scroll-margin-top:90px; }
.products-pair { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); align-items:stretch; background:#dbe6f3; color:#132d4d; transition:grid-template-columns .62s cubic-bezier(.22,.75,.18,1); }
.product-feature { --product-text:#132d4d; --product-dim:#526d8b; --product-accent:#396eaf; --product-line:#8ca6c45c; position:relative; min-width:0; padding:0; background:#eef3f8; color:var(--product-text); cursor:pointer; transition:opacity .45s ease,filter .45s ease,background-color .45s ease; }
.product-feature--seed { --product-text:#142d4b; --product-dim:#536d8c; --product-accent:#315f9c; --product-line:#829cbb61; background:#dce7f3; border-left:1px solid #829cbb80; }
.product-feature__inner { width:100%; max-width:none; margin:0; padding:clamp(48px,4.3vw,78px) clamp(30px,4vw,70px) clamp(42px,4vw,70px); }
.product-feature__heading { display:block; min-height:330px; }
.product-feature__identity { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:8px 18px; }
.product-feature__identity h2 { font-size:clamp(55px,6vw,96px); line-height:.98; letter-spacing:-.065em; }
.product-feature__identity h2 em,.product-feature__intro h3 em { color:var(--product-accent); }
.product-feature__identity>p { grid-row:2; color:var(--product-dim); font-size:15px; }
.product-status { grid-column:2; grid-row:1/3; display:inline-flex; align-items:center; gap:8px; padding:8px 11px; border:1px solid var(--product-line); color:var(--product-dim); font-size:11px; line-height:1.4; }
.product-status::before { content:""; width:5px; height:5px; flex:none; border-radius:50%; background:var(--product-accent); }
.product-feature__intro { margin-top:38px; padding-top:32px; border-top:1px solid var(--product-line); }
.product-feature__intro h3 { max-width:18ch; font-size:clamp(30px,3vw,46px); }
.product-feature__intro>p { max-width:54ch; margin-top:20px; color:var(--product-dim); font-size:15px; line-height:1.7; }
.product-feature__showcase { display:flex; flex-direction:column; gap:25px; margin-top:38px; }
.product-feature__visual,.product-feature--seed .product-feature__visual { order:0; grid-column:auto; grid-row:auto; min-width:0; margin:0; overflow:hidden; }
.product-feature__visual img { display:block; width:100%; height:auto; aspect-ratio:1.5; object-fit:contain; background:#d0ddeb; border:1px solid var(--product-line); transition:transform .62s cubic-bezier(.22,.75,.18,1); }
.product-feature--seed .product-feature__visual img { background:#10233e; }
.product-feature__visual figcaption { margin-top:10px; color:var(--product-dim); font-size:11px; line-height:1.5; }
.product-feature__capabilities,.product-feature--seed .product-feature__capabilities { order:1; grid-column:auto; grid-row:auto; min-width:0; }
.product-feature__capabilities dl { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:0 18px; }
.product-feature__capabilities dl>div { padding:18px 0; border-top:1px solid var(--product-line); }
.product-feature__capabilities dt { color:var(--product-text); font-size:17px; line-height:1.3; letter-spacing:-.02em; }
.product-feature__capabilities dd { max-width:31ch; margin:9px 0 0; color:var(--product-dim); font-size:12px; line-height:1.6; }
.product-actions { display:flex; align-items:center; flex-wrap:wrap; gap:15px 22px; margin-top:18px; }
.product-actions .btn { position:static; background:#173b67; color:#fff; }
.product-actions .btn::after { content:""; position:absolute; inset:0; z-index:1; }
.product-actions .btn:hover { background:#28558c; color:#fff; }
.product-actions .products-link { position:relative; z-index:2; color:var(--product-accent); }
.product-feature:focus-within { outline:3px solid var(--product-accent); outline-offset:-3px; }
.product-feature__flow { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin-top:30px; padding-top:20px; border-top:1px solid var(--product-line); color:var(--product-dim); font-size:12px; line-height:1.5; }
.product-feature__flow>span[aria-hidden] { display:none; }
.product-feature__flow>span:not([aria-hidden]) { position:relative; padding-right:14px; }
.product-feature__flow>span:not([aria-hidden]):not(:last-child)::after { content:"→"; position:absolute; right:0; color:var(--product-accent); }
.products-contact { padding:72px 0 78px; color:#142e4d; background:#d1deed; }
.products-contact__layout { display:grid; grid-template-columns:1fr 1fr; gap:10%; align-items:center; }
.products-contact h2 { max-width:14ch; font-size:clamp(44px,5.3vw,82px); }
.products-contact h2 em { color:#416faa; }
.products-contact p { max-width:38ch; color:#526d8b; font-size:18px; line-height:1.65; }
.products-contact .btn { margin-top:26px; color:#fff; background:#183b66; }
.products-contact .btn:hover { background:#28558c; color:#fff; }

@media(min-width:1201px) and (hover:hover) {
  .products-pair[data-active="plot"] { grid-template-columns:minmax(0,1.16fr) minmax(0,.84fr); }
  .products-pair[data-active="seed"] { grid-template-columns:minmax(0,.84fr) minmax(0,1.16fr); }
  .product-feature.is-muted { opacity:.64; filter:saturate(.72) contrast(.94); }
  .products-pair[data-active] .product-feature:not(.is-muted) .product-feature__visual img { transform:scale(1.018); }
}

@media(max-width:1200px) {
  .products-pair { grid-template-columns:minmax(0,1fr); }
  .product-feature--seed { border-left:0; border-top:1px solid #829cbb80; }
  .product-feature__inner { max-width:960px; margin-inline:auto; }
  .product-feature__heading { min-height:0; }
  .product-feature__intro h3 { max-width:24ch; }
}
@media(max-width:900px) {
  .products-hero__stage { display:block; min-height:0; }
  .products-hero__stage::after { display:none; }
  .products-hero__layout { padding-block:125px 12px; }
  .products-hero__content { width:100%; }
  .products-hero__media { position:relative; inset:auto; width:100%; height:auto; }
  .products-hero__media img { height:auto; object-position:center; }
  .products-hero h1 { max-width:17ch; }
}
@media(max-width:760px) {
  .products-hero h1 { max-width:15ch; font-size:clamp(43px,8.4vw,63px); }
  .products-hero__content>p { max-width:39ch; font-size:16px; }
  .product-feature__inner { padding:48px 24px 42px; }
  .product-feature__identity h2 { font-size:62px; }
  .product-feature__intro { margin-top:30px; padding-top:26px; }
  .product-feature__intro h3 { max-width:23ch; font-size:clamp(31px,6vw,42px); }
  .product-feature__intro>p { margin-top:17px; }
  .product-feature__showcase { margin-top:30px; }
  .product-feature__capabilities dl { grid-template-columns:minmax(0,1fr); }
  .product-feature__capabilities dl>div { padding:15px 0; }
  .product-feature__capabilities dd { max-width:none; }
  .product-feature__flow { grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px 20px; }
  .products-contact { padding:55px 0 62px; }
  .products-contact__layout { grid-template-columns:minmax(0,1fr); gap:28px; }
  .products-contact h2 { max-width:none; font-size:clamp(40px,7vw,58px); }
  .products-contact p { font-size:16px; }
}
@media(max-width:420px) {
  .products-hero h1 { font-size:clamp(35px,9.8vw,42px); }
  .product-feature__identity { grid-template-columns:minmax(0,1fr); }
  .product-feature__identity h2 { font-size:52px; }
  .product-status { grid-column:1; grid-row:3; justify-self:start; margin-top:5px; }
  .product-feature__intro h3 { font-size:31px; }
  .product-feature__flow { font-size:11px; }
}
@media(prefers-reduced-motion:reduce) {
  .products-pair,.product-feature,.product-feature__visual img,.products-link>span { transition:none; transform:none !important; }
}
@media print {
  .products-skip,.product-actions,.products-link { display:none; }
  .products-hero__stage { display:block; min-height:0; }
  .products-hero__stage::after { display:none; }
  .products-hero__layout { padding-block:35px; }
  .products-hero__content { width:100%; }
  .products-hero__media { position:relative; inset:auto; width:100%; height:auto; }
  .products-hero__media img { height:auto; }
  .products-pair { display:block; }
  .product-feature { break-inside:avoid; }
}

/* Back to Products link on product detail pages */
.product-back { display:inline-flex; align-items:center; gap:8px; margin:0 0 22px; padding:8px 14px; border:1px solid rgba(255,255,255,.28); border-radius:999px; background:rgba(0,0,0,.28); color:inherit; font-size:12px; font-weight:500; letter-spacing:.08em; text-transform:uppercase; text-decoration:none; backdrop-filter:blur(6px); transition:background .2s ease, border-color .2s ease, transform .2s ease; pointer-events:auto; }
.product-back:hover { background:rgba(0,0,0,.5); border-color:rgba(255,255,255,.55); transform:translateX(-2px); }
.product-back span { font-size:14px; }
.seed-hero .product-back { border-color:rgba(15,25,45,.18); background:rgba(255,255,255,.6); color:#0f192d; }
.seed-hero .product-back:hover { background:#fff; border-color:rgba(15,25,45,.4); }
