/* Product collection: scalable cards, selected-app panels, and soft section handoffs. */
[hidden]{display:none!important}.product-intro{align-items:start;background:linear-gradient(180deg,#f4f7fb 0%,#f1f6fb 77%,#c7e0f1 100%)}.product-intro .section-heading{max-width:560px}.app-gallery{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:14px;padding-top:8px}.app-card{appearance:none;border:1px solid rgba(9,46,85,.11);border-radius:16px;background:rgba(255,255,255,.8);color:#07172c;text-align:left;display:grid;grid-template-columns:68px 1fr auto;gap:15px;align-items:center;padding:16px;cursor:pointer;transition:transform .25s,box-shadow .25s,border-color .25s}.app-card:hover,.app-card:focus-visible{transform:translateY(-4px);border-color:#238ddd;box-shadow:0 15px 32px rgba(11,76,138,.14);outline:none}.app-card.is-selected{border-color:#087fd4;background:#fff;box-shadow:0 12px 26px rgba(11,76,138,.13)}.app-card img{width:68px;height:68px;border-radius:20%;box-shadow:0 8px 16px rgba(0,54,121,.18)}.app-card-copy b{display:block;font-size:18px;letter-spacing:-.035em}.app-card-copy small{display:block;color:#5a6c80;margin-top:3px}.guardian-card img{box-shadow:0 10px 20px rgba(6,40,108,.26)}.app-overview{color:#061126;background:linear-gradient(180deg,#c7e0f1 0%,#f8fbfe 20%,#f8fbfe 100%);display:grid;grid-template-columns:auto minmax(0,1fr);gap:38px;align-items:start;padding-top:84px;padding-bottom:84px}.app-overview-icon{padding-top:5px}.app-overview .product-icon{width:112px;height:112px}.app-overview-copy{max-width:670px}.app-overview h2{font-size:clamp(42px,5.4vw,76px);line-height:.97;letter-spacing:-.065em;font-weight:500;margin:0 0 20px}.guardian-overview{background:linear-gradient(180deg,#c7e0f1 0%,#eaf4fa 20%,#edf7fc 100%)}.showcase{background:linear-gradient(180deg,#c7e0f1 0%,#0c294b 17%,#020816 100%)}.feature-grid{background:linear-gradient(180deg,#020816 0%,#163960 9%,#eaf0f7 23%,#eaf0f7 84%,#c8e1f3 100%)}.privacy-section{background:linear-gradient(180deg,#c8e1f3 0%,#0c315a 27%,#020916 100%)}.download-section{background:linear-gradient(180deg,#020916 0%,#081934 70%,#16416d 100%)}
.guardian-showcase{display:grid;grid-template-columns:minmax(0,.85fr) minmax(340px,1.15fr);align-items:center;gap:45px;min-height:650px;background:radial-gradient(circle at 73% 53%,rgba(9,162,255,.24),transparent 32%),linear-gradient(180deg,#c7e0f1 0%,#09213f 19%,#020816 100%)}.guardian-copy{position:relative;z-index:2}.guardian-copy h2,.guardian-trust h2{font-size:clamp(42px,5.5vw,82px);line-height:.97;letter-spacing:-.06em;font-weight:500;margin:0 0 24px}.guardian-copy>p:not(.eyebrow),.guardian-trust p{color:#b8c9db;font-size:18px;max-width:500px}.guardian-device{position:relative;justify-self:center;width:min(100%,480px);will-change:transform;transform:translate3d(0,var(--parallax-offset,0),0)}.guardian-device img{display:block;width:100%;max-height:570px;object-fit:contain;filter:drop-shadow(0 30px 45px rgba(0,0,0,.46));position:relative;z-index:1}.guardian-rings{position:absolute;inset:12% -12%;border:1px solid rgba(90,193,255,.25);border-radius:50%;box-shadow:0 0 0 55px rgba(33,146,255,.045),0 0 0 112px rgba(33,146,255,.025)}.guardian-features{color:#061126;background:linear-gradient(180deg,#020816 0%,#143a63 10%,#ebf4fa 25%,#f8fbfe 100%)}.guardian-feature-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:48px}.guardian-feature-card{padding:30px;border-radius:16px;background:rgba(255,255,255,.86);border:1px solid rgba(13,66,115,.09)}.guardian-feature-card h3{font-size:26px;line-height:1.04;letter-spacing:-.04em;margin:20px 0 12px}.guardian-feature-card p{color:#52677e;margin:0}.guardian-symbol{display:grid;place-items:center;width:52px;height:52px;border-radius:50%;background:radial-gradient(circle,#fff 6%,#a8e8ff 12%,#178bea 36%,#06295c 70%);color:#fff;font-size:27px;box-shadow:0 8px 19px rgba(0,109,220,.24)}.guardian-trust{position:relative;min-height:540px;display:flex;align-items:center;padding:clamp(80px,10vw,140px) clamp(24px,10vw,160px);background:radial-gradient(circle at 22% 58%,rgba(32,171,255,.23),transparent 6%),radial-gradient(ellipse at 25% 100%,#06336b 0,transparent 43%),linear-gradient(180deg,#f8fbfe 0%,#244d77 23%,#020916 66%)}.guardian-trust-content{margin-left:auto;max-width:510px}.guardian-download{position:relative;display:flex;align-items:center;justify-content:center;min-height:570px;padding:72px 24px;text-align:center;overflow:hidden;background:linear-gradient(180deg,#020916,#071a35 70%,#16416d)}.guardian-orb{background:radial-gradient(circle at 50% 50%,rgba(120,232,255,.47) 0 .4%,rgba(18,144,255,.16) 1%,rgba(20,118,228,.14) 17%,transparent 51%)}
@media(max-width:900px){.guardian-showcase{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:24px}.guardian-device{width:100%}.guardian-feature-cards{grid-template-columns:repeat(2,minmax(0,1fr))}.guardian-feature-card:last-child{grid-column:1/-1}}@media(max-width:680px){.app-gallery{grid-template-columns:1fr}.app-overview{grid-template-columns:1fr;gap:22px;padding-top:64px;padding-bottom:64px}.app-overview-icon{padding:0}.app-overview .product-icon{width:88px;height:88px}.guardian-showcase{display:flex;flex-direction:column;min-height:0;padding-top:90px;padding-bottom:80px}.guardian-device{width:min(100%,380px)}.guardian-features{padding-top:80px}.guardian-feature-cards{grid-template-columns:1fr}.guardian-feature-card:last-child{grid-column:auto}.guardian-trust{min-height:470px;padding-top:90px;padding-bottom:90px}.guardian-trust-content{margin:0}.guardian-download{min-height:500px}}

/* Phantom Player adds a spectral, media-focused branch while retaining the collection's shared layout. */
.phantom-card img { box-shadow: 0 10px 22px rgba(80, 48, 194, .28); }
.phantom-overview { background: linear-gradient(180deg, #c7e0f1 0%, #eef0fc 20%, #f9faff 100%); }
.phantom-showcase { display: grid; grid-template-columns: minmax(0, .8fr) minmax(340px, 1.2fr); align-items: center; gap: 46px; min-height: 650px; background: radial-gradient(circle at 72% 54%, rgba(116, 69, 245, .23), transparent 31%), radial-gradient(circle at 56% 72%, rgba(0, 202, 255, .12), transparent 24%), linear-gradient(180deg, #c5ddf1 0%, #10244f 18%, #040817 100%); }
.phantom-copy { position: relative; z-index: 2; }
.phantom-copy h2, .phantom-trust h2 { font-size: clamp(42px, 5.5vw, 82px); line-height: .97; letter-spacing: -.06em; font-weight: 500; margin: 0 0 24px; }
.phantom-copy > p:not(.eyebrow), .phantom-trust p { color: #c3c9e6; font-size: 18px; max-width: 500px; }
.phantom-screen { position: relative; justify-self: center; width: min(100%, 700px); will-change: transform; transform: translate3d(0, var(--parallax-offset, 0), 0); }
.phantom-screen img { position: relative; z-index: 1; display: block; width: 100%; border-radius: 18px; box-shadow: 0 35px 66px rgba(0, 0, 0, .46); }
.phantom-rings { position: absolute; inset: -10% -5%; border: 1px solid rgba(130, 141, 255, .24); border-radius: 47%; box-shadow: 0 0 0 50px rgba(90, 67, 235, .04), 0 0 0 105px rgba(19, 178, 255, .024); }
.phantom-features { color: #061126; background: linear-gradient(180deg, #040817 0%, #182e62 10%, #eef0fc 26%, #fbfcff 100%); }
.phantom-feature-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; margin-top: 48px; }
.phantom-feature-card { padding: 30px; border: 1px solid rgba(51, 49, 131, .1); border-radius: 16px; background: rgba(255, 255, 255, .86); }
.phantom-feature-card h3 { margin: 20px 0 12px; font-size: 26px; line-height: 1.04; letter-spacing: -.04em; }
.phantom-feature-card p { margin: 0; color: #59627d; }
.phantom-symbol { display: grid; width: 52px; height: 52px; place-items: center; border-radius: 50%; background: radial-gradient(circle, #fff 6%, #d5c9ff 13%, #6b49db 38%, #15265f 70%); color: #fff; font-size: 27px; box-shadow: 0 8px 19px rgba(80, 57, 186, .24); }
.phantom-trust { position: relative; display: flex; align-items: center; min-height: 540px; padding: clamp(80px, 10vw, 140px) clamp(24px, 10vw, 160px); background: radial-gradient(circle at 78% 48%, rgba(129, 90, 245, .21), transparent 7%), radial-gradient(ellipse at 75% 100%, #17306a 0, transparent 42%), linear-gradient(180deg, #fbfcff 0%, #39477c 23%, #040817 66%); }
.phantom-trust-content { max-width: 510px; }
.phantom-download { position: relative; display: flex; align-items: center; justify-content: center; min-height: 570px; padding: 72px 24px; overflow: hidden; text-align: center; background: linear-gradient(180deg, #040817, #121d45 70%, #304a81); }
.phantom-orb { background: radial-gradient(circle at 50% 50%, rgba(218, 205, 255, .48) 0 .4%, rgba(108, 76, 240, .17) 1%, rgba(28, 166, 255, .13) 18%, transparent 51%); }
@media (max-width: 900px) { .phantom-showcase { grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: 24px; } .phantom-screen { width: 100%; } .phantom-feature-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); } .phantom-feature-card:last-child { grid-column: 1 / -1; } }
@media (max-width: 680px) { .phantom-showcase { display: flex; flex-direction: column; min-height: 0; padding-top: 90px; padding-bottom: 80px; } .phantom-screen { width: min(100%, 560px); } .phantom-features { padding-top: 80px; } .phantom-feature-cards { grid-template-columns: 1fr; } .phantom-feature-card:last-child { grid-column: auto; } .phantom-trust { min-height: 470px; padding-top: 90px; padding-bottom: 90px; } .phantom-download { min-height: 500px; } }

/* Vector-like feature symbols avoid the uneven optical centering of font glyphs. */
.guardian-location-symbol,
.phantom-speed-symbol { font-size: 0; position: relative; }
.guardian-location-symbol::before { content: ""; position: absolute; inset: 0; width: 18px; height: 18px; margin: auto; border: 2px solid #fff; border-radius: 50%; box-sizing: border-box; }
.guardian-location-symbol::after { content: ""; position: absolute; inset: 0; width: 28px; height: 28px; margin: auto; background: linear-gradient(#fff, #fff) center / 2px 28px no-repeat, linear-gradient(#fff, #fff) center / 28px 2px no-repeat; opacity: .95; }
.phantom-speed-symbol::before,
.phantom-speed-symbol::after { content: ""; position: absolute; top: 20px; width: 11px; height: 11px; border-top: 3px solid #fff; border-right: 3px solid #fff; transform: rotate(45deg); box-sizing: border-box; }
.phantom-speed-symbol::before { left: 12px; }
.phantom-speed-symbol::after { left: 27px; }

/* Product-page clarity: availability and platform information stays close to the decision point. */
.collection-copy { max-width: 470px; margin: 20px 0 0; color: #52677e; font-size: 17px; line-height: 1.55; }
.app-card-meta { display: block; margin-top: 8px; color: #61768c; font-size: 12px; font-weight: 600; letter-spacing: .01em; }
.product-facts { display: flex; flex-wrap: wrap; gap: 10px 24px; margin: 24px 0 27px; padding: 0; list-style: none; color: #52677e; font-size: 14px; }
.product-facts li { padding-left: 13px; border-left: 2px solid #38a7ec; }
.product-facts b { display: block; margin-bottom: 3px; color: #10243c; font-size: 11px; letter-spacing: .08em; text-transform: uppercase; }
@media (max-width: 680px) { .collection-copy { font-size: 16px; } .app-card-meta { margin-top: 6px; } .product-facts { display: grid; gap: 12px; margin-top: 21px; } }

/* Alternating parallax surfaces replace color-transition gradients between sections. */
.section-layer { isolation: isolate; position: relative; }
.section-layer::after { content: ''; pointer-events: none; position: absolute; z-index: 0; transition: transform .08s linear; transform: translate3d(0, var(--section-parallax, 0px), 0); }
.section-layer--foreground { margin-inline: clamp(10px, 3vw, 48px); border-radius: 24px; box-shadow: 0 28px 72px rgba(0, 9, 24, .28); overflow: hidden; z-index: 2; }
.section-layer--foreground::after { display: none; }
.section-layer--background { z-index: 1; }
.section-layer--background::after { width: min(58vw, 760px); height: min(58vw, 760px); top: 14%; right: -17%; border: 1px solid rgba(121, 202, 255, .17); border-radius: 50%; box-shadow: 0 0 0 58px rgba(42, 139, 222, .035), 0 0 0 124px rgba(42, 139, 222, .02); }
.product-intro, .showcase, .privacy-section, .guardian-showcase, .guardian-trust, .phantom-showcase, .phantom-trust { color: #061126; background: #f5f8fc; }
.app-overview, .feature-grid, .guardian-features, .phantom-features, .download-section, .guardian-download, .phantom-download { color: #f5f8ff; background: #020916; }
.app-overview .large-copy, .app-overview .product-facts, .feature-grid .eyebrow, .guardian-features .eyebrow, .phantom-features .eyebrow { color: #b8c9db; }
.app-overview h2, .app-overview .product-facts b { color: #fff; }
.app-overview .text-link { color: #8bd3ff; }
.showcase-copy h2, .privacy-copy h2, .guardian-copy h2, .guardian-trust h2, .phantom-copy h2, .phantom-trust h2 { color: #061126; }
.showcase-copy > p:not(.eyebrow), .privacy-copy > p:not(.eyebrow), .guardian-copy > p:not(.eyebrow), .guardian-trust p, .phantom-copy > p:not(.eyebrow), .phantom-trust p { color: #40546b; }
.showcase .eyebrow, .privacy-section .eyebrow, .guardian-showcase .eyebrow, .guardian-trust .eyebrow, .phantom-showcase .eyebrow, .phantom-trust .eyebrow { color: #41617f; }
.feature-grid .section-heading h2, .guardian-features .section-heading h2, .phantom-features .section-heading h2 { color: #fff; }
.feature-grid .feature-card, .guardian-feature-card, .phantom-feature-card { background: #f9fbfe; }
.privacy-star { opacity: .65; }
.download-section, .guardian-download { background: #020916; }
.phantom-download { background: #040817; }
@media (max-width: 680px) { .section-layer--foreground { margin-inline: 10px; border-radius: 18px; } .section-layer--background::after { width: 72vw; height: 72vw; right: -34%; } }

/* Layout recovery: content and artwork remain independently placed at each breakpoint. */
.product-intro { display: block; }
.app-gallery { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin-top: 42px; padding-top: 0; }
.app-card { grid-template-columns: 58px minmax(0, 1fr) auto; gap: 12px; min-height: 96px; padding: 14px 16px; border-radius: 14px; }
.app-card img { width: 58px; height: 58px; }
.app-card-copy b { font-size: 17px; }
.app-card-meta { margin-top: 4px; font-size: 11px; white-space: nowrap; }
.showcase.dark-panel { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); align-items: center; gap: clamp(28px, 5vw, 74px); min-height: 590px; }
.showcase-copy { width: auto; }
.device-stage { position: relative; right: auto; bottom: auto; justify-self: end; width: min(100%, 660px); margin: 0; }
.device-stage img, .guardian-device img, .privacy-visual img, .trust-visual img { border-radius: 18px; }
.device-stage img { width: 100%; }
.phantom-screen { width: min(100%, 560px); }
.download-section, .guardian-download, .phantom-download { justify-content: center; text-align: center; }
.download-content { width: min(100%, 700px); margin-inline: auto; }
.download-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); width: min(100%, 540px); margin-inline: auto; gap: 12px; }
.download-button { min-width: 0; width: 100%; }
.appStore-download, .googlePlay-download { background: rgba(16, 77, 142, .22); }
@media (max-width: 980px) { .app-gallery { grid-template-columns: repeat(2, minmax(0, 1fr)); } .app-card-meta { white-space: normal; } .showcase.dark-panel { grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: 24px; } .device-stage { width: min(100%, 520px); } }
@media (max-width: 680px) { .app-gallery { grid-template-columns: 1fr; margin-top: 30px; } .app-card { min-height: 84px; } .app-card-meta { white-space: normal; } .showcase.dark-panel { display: flex; min-height: 0; flex-direction: column; } .device-stage { width: min(100%, 450px); margin-top: 22px; } .download-actions { grid-template-columns: 1fr; } }

/* Editorial visuals fill the former placeholders without competing with the copy. */
.feature-art { background: #06172f; }
.feature-art img { width: 100%; max-width: none; max-height: none; height: 100%; object-fit: cover; filter: none; }
.privacy-section { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: clamp(32px, 7vw, 112px); align-items: center; }
.privacy-copy { width: auto; margin: 0; }
.privacy-visual, .trust-visual { width: min(100%, 720px); }
.privacy-visual img, .trust-visual img { display: block; width: 100%; height: auto; mix-blend-mode: multiply; }
.guardian-trust, .phantom-trust { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: clamp(32px, 7vw, 112px); align-items: center; }
.guardian-trust-content, .phantom-trust-content { max-width: 510px; margin: 0; }
@media (max-width: 760px) { .privacy-section, .guardian-trust, .phantom-trust { grid-template-columns: 1fr; gap: 36px; } .privacy-visual, .trust-visual { width: min(100%, 560px); } .privacy-section { align-items: start; } }

/* Shared image-led feature cards keep every product story visually consistent. */
.guardian-feature-cards,
.phantom-feature-cards { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; margin-top: 45px; }
.media-frame { --media-aspect-ratio: 16 / 9; position: relative; width: 100%; aspect-ratio: var(--media-aspect-ratio); overflow: hidden; border-radius: 18px; }
.media-frame > img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center; }
.guardian-image-frame { --media-aspect-ratio: 1122 / 1402; z-index: 1; width: min(100%, 456px); margin-inline: auto; box-shadow: 0 35px 66px rgba(0, 0, 0, .46); }
.guardian-device .guardian-image-frame img { height: 100%; max-height: none; object-fit: cover; object-position: center; filter: none; }
.feature-card-content { display: flex; flex: 1; flex-direction: column; justify-content: center; }
.feature-card-content .card-kicker { margin: 0 0 12px; }
.feature-card-content h3 { margin: 0 0 10px; }
.feature-card-content > p:last-child { margin: 0; color: #53667b; font-size: 14px; }
@media (max-width: 900px) { .guardian-feature-cards, .phantom-feature-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); } .guardian-feature-cards .feature-card:last-child, .phantom-feature-cards .feature-card:last-child { grid-column: 1 / -1; } }
@media (max-width: 680px) { .guardian-feature-cards, .phantom-feature-cards { grid-template-columns: 1fr; } .guardian-feature-cards .feature-card:last-child, .phantom-feature-cards .feature-card:last-child { grid-column: auto; } }
