:root { --navy:#06182f; --blue:#1974ed; --cyan:#39ccec; --white:#fff; --muted:#a9bfd8; }
* { box-sizing:border-box; }
html,body { max-width:100%; overflow-x:hidden; overflow-x:clip; }
html { scroll-behavior:smooth; }
body { margin:0; color:#ecf7ff; background:var(--navy); font-family:Inter,"Segoe UI Variable","Segoe UI",Arial,sans-serif; }
a { color:inherit; text-decoration:none; }
.container { width:min(1180px,calc(100% - 40px)); margin-inline:auto; }
.skip-link { position:fixed; z-index:100; top:10px; left:10px; padding:12px 16px; color:#04172c; background:#fff; border-radius:8px; transform:translateY(-150%); }
.skip-link:focus { transform:none; }
.back-to-top { position:fixed; z-index:80; right:max(18px,env(safe-area-inset-right)); bottom:max(18px,env(safe-area-inset-bottom)); display:grid; place-items:center; width:48px; height:48px; color:#fff; border:1px solid rgba(255,255,255,.52); border-radius:14px; background:linear-gradient(145deg,#0c70d8,#39ccec); box-shadow:0 12px 30px rgba(2,28,58,.32); font-size:1.45rem; font-weight:800; line-height:1; opacity:0; visibility:hidden; pointer-events:none; transform:translateY(12px); transition:opacity .25s ease,visibility .25s ease,transform .25s ease,box-shadow .25s ease; }
.back-to-top.is-visible { opacity:1; visibility:visible; pointer-events:auto; transform:none; }
.back-to-top:hover { transform:translateY(-3px); box-shadow:0 16px 34px rgba(2,28,58,.42); }
.back-to-top:focus-visible { outline:3px solid #b8f3ff; outline-offset:3px; }
.site-header { position:absolute; z-index:20; top:0; left:0; width:100%; border-bottom:1px solid rgba(255,255,255,.1); }
.site-header-integrated { border-bottom:0; background:transparent; box-shadow:none; }
.header-inner { width:100%; max-width:none; height:68px; padding-inline:clamp(18px,3vw,52px); display:flex; align-items:center; justify-content:space-between; gap:24px; }
.brand { display:flex; align-items:center; gap:10px; }
.brand-mark { display:grid; place-items:center; width:36px; height:36px; border-radius:10px; color:#04182e; background:linear-gradient(145deg,#7ce8f7,#39ccec); font-size:.88rem; font-weight:900; letter-spacing:-.06em; box-shadow:0 8px 24px rgba(57,204,236,.2); }
.brand strong,.brand small { display:block; }
.brand strong { font-size:1rem; letter-spacing:.01em; }
.brand small { color:#9fb8d0; font-size:.66rem; margin-top:1px; }
.main-nav { display:flex; align-items:center; gap:22px; font-size:.86rem; font-weight:650; }
.main-nav .button { min-height:40px; padding-inline:17px; border-radius:10px; }
.main-nav>a:not(.button):hover { color:#6fe2f4; }
.button { display:inline-flex; justify-content:center; align-items:center; min-height:50px; padding:0 23px; border:1px solid var(--cyan); border-radius:12px; color:#04182e; background:var(--cyan); font-weight:800; box-shadow:0 14px 40px rgba(57,204,236,.18); transition:color .2s ease,background-color .2s ease,border-color .2s ease,transform .2s ease; }
.button:hover { background:#79e7f6; border-color:#79e7f6; transform:translateY(-2px); }
.button:focus-visible,.main-nav>a:focus-visible,.breadcrumb a:focus-visible,.text-link:focus-visible,.product-copy-source a:focus-visible { outline:3px solid #7ce8f7; outline-offset:4px; }
.button-small { min-height:42px; padding-inline:18px; }
.button-secondary { color:#ecf7ff; border-color:rgba(255,255,255,.35); background:rgba(255,255,255,.04); box-shadow:none; }
.button-secondary:hover { color:#fff; background:rgba(255,255,255,.12); border-color:rgba(255,255,255,.5); }
.hero { position:relative; min-height:680px; padding:112px 0 74px; overflow:hidden; background:radial-gradient(circle at 78% 35%,rgba(25,116,237,.28),transparent 30%),radial-gradient(circle at 60% 80%,rgba(57,204,236,.09),transparent 27%),linear-gradient(145deg,#06182f 0%,#071c38 55%,#06162b 100%); }
.hero::before { content:""; position:absolute; inset:0; opacity:.18; background-image:linear-gradient(rgba(117,210,255,.14) 1px,transparent 1px),linear-gradient(90deg,rgba(117,210,255,.14) 1px,transparent 1px); background-size:64px 64px; -webkit-mask-image:linear-gradient(to right,transparent 20%,black 80%); mask-image:linear-gradient(to right,transparent 20%,black 80%); }
.hero-grid { position:relative; display:grid; grid-template-columns:1.02fr .98fr; align-items:center; gap:72px; }
.eyebrow { margin:0 0 17px; color:#75e4f5; font-size:.78rem; font-weight:800; letter-spacing:.13em; text-transform:uppercase; }
h1 { max-width:none; margin:0; font-size:clamp(2.2rem,3.15vw,3.2rem); line-height:1; letter-spacing:-.045em; white-space:nowrap; }
.lead { max-width:650px; margin:28px 0 0; color:#b7cbe0; font-size:1.16rem; line-height:1.7; }
.hero-actions { display:flex; flex-wrap:wrap; gap:12px; margin:34px 0 30px; }
.hero-points { display:flex; flex-wrap:wrap; gap:12px 24px; margin:0; padding:0; list-style:none; color:#d3e3f0; font-size:.88rem; font-weight:650; }
.hero-points li::before { content:"✓"; margin-right:8px; color:#52d9ed; }
.product-stage { position:relative; perspective:1100px; }
.trust-strip { position:relative; z-index:5; margin-top:-46px; padding-bottom:6px; color:#102f4e; background:linear-gradient(to bottom,transparent 46px,#f4f8fc 46px); }
.trust-grid { display:grid; grid-template-columns:repeat(4,1fr); overflow:hidden; border:1px solid rgba(170,199,218,.76); border-radius:18px; background:rgba(255,255,255,.98); box-shadow:0 18px 48px rgba(1,24,49,.18); }
.trust-grid>div { display:flex; align-items:center; gap:13px; min-height:82px; padding:14px 24px; border-right:1px solid #dbe8f0; }
.trust-grid>div:last-child { border:0; }
.trust-grid strong { color:#1267cf; font-size:1.3rem; }
.trust-grid span,.trust-grid small { display:block; }
.trust-grid span { font-size:.8rem; font-weight:800; }
.trust-grid small { margin-top:3px; color:#6e8395; font-size:.66rem; font-weight:550; }
.mobile-nav { display:none; position:relative; }
.section { padding:clamp(56px,6vw,82px) 0; }
.section-light { color:#102f4e; background:#f4f8fc; }
.section-dark { color:#edf7ff; background:linear-gradient(145deg,#06182f,#0a2140); }
.section-blue { color:#edf7ff; background:linear-gradient(135deg,#082b57,#0b3f78); }
.section-heading { display:grid; grid-template-columns:1.08fr .92fr; gap:60px; align-items:end; margin-bottom:36px; }
.section-heading.compact { margin-bottom:28px; }
.section h2,.legal-content h2 { margin:0; font-size:clamp(1.65rem,2.2vw,2.15rem); line-height:1.06; letter-spacing:-.035em; white-space:nowrap; }
.section h3 { margin:0; letter-spacing:-.02em; }
.section-lead { margin:0; color:#5e768c; font-size:1.05rem; line-height:1.75; }
.section-dark .section-lead,.section-blue .section-lead,.contact-section .section-lead,.faq-section .section-lead { color:#a9bfd8; }
.eyebrow.dark { color:#087ca8; }
.benefit-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:18px; }
.benefit-card { position:relative; min-height:360px; overflow:hidden; isolation:isolate; color:#fff; border:1px solid rgba(8,51,86,.13); border-radius:20px; background:#061a33; box-shadow:0 20px 48px rgba(18,61,93,.14); transition:transform .35s ease,box-shadow .35s ease; }
.benefit-card::before { content:""; position:absolute; z-index:1; inset:0; background:linear-gradient(180deg,rgba(3,17,34,.03) 15%,rgba(3,17,34,.34) 50%,rgba(3,17,34,.96) 100%); }
.benefit-card::after { content:""; position:absolute; z-index:2; right:24px; bottom:0; left:24px; height:3px; border-radius:999px 999px 0 0; background:linear-gradient(90deg,#42d6ed,#1974ed); transform:scaleX(.32); transform-origin:left; transition:transform .35s ease; }
.benefit-card:hover { transform:translateY(-6px); box-shadow:0 28px 65px rgba(18,61,93,.22); }
.benefit-card:hover::after { transform:scaleX(1); }
.benefit-image { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform .7s cubic-bezier(.2,.75,.2,1); }
.benefit-card:hover .benefit-image { transform:scale(1.045); }
.benefit-content { position:absolute; z-index:3; right:0; bottom:0; left:0; padding:26px; }
.benefit-card h3 { color:#fff; font-size:1.24rem; text-shadow:0 2px 18px rgba(0,10,26,.55); }
.benefit-card p { color:#d8e8f4; text-shadow:0 2px 16px rgba(0,10,26,.75); }
.benefit-card p,.function-card p,.module-card p,.news-grid p { margin:12px 0 0; font-size:.94rem; line-height:1.65; }
.news-grid p { color:#60778b; }
.function-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.function-card { position:relative; isolation:isolate; min-height:360px; overflow:hidden; border:1px solid rgba(103,191,255,.22); border-radius:18px; background:#0b243d; box-shadow:0 18px 45px rgba(0,8,24,.2); }
.function-card::after { position:absolute; z-index:1; inset:0; content:""; background:linear-gradient(180deg,rgba(2,15,31,.02) 24%,rgba(2,15,31,.25) 48%,rgba(2,15,31,.96) 100%); pointer-events:none; }
.function-image { position:absolute; z-index:0; inset:0; width:100%; height:100%; object-fit:cover; object-position:center 39%; transition:transform .55s ease; }
.function-card:nth-child(2) .function-image,.function-card:nth-child(5) .function-image { object-position:center 48%; }
.function-card:nth-child(3) .function-image,.function-card:nth-child(4) .function-image { object-position:center 34%; }
.function-image-data { object-position:center 88%; }
.function-card:hover .function-image { transform:scale(1.035); }
.function-content { position:absolute; z-index:2; inset:0; display:flex; flex-direction:column; justify-content:flex-end; padding:24px; }
.function-card h3 { color:#fff; font-size:1.15rem; white-space:nowrap; text-shadow:0 2px 18px rgba(0,10,26,.65); }
.function-card p { color:#d8e8f4; text-shadow:0 2px 16px rgba(0,10,26,.8); }
.split { display:grid; grid-template-columns:1fr 1fr; gap:clamp(50px,8vw,100px); align-items:center; }
.split-section h2,.details-section h2,.contact-section h2 { margin-bottom:24px; }
.check-list { display:grid; gap:13px; margin:28px 0; padding:0; list-style:none; color:#34556f; }
.check-list li::before { content:"✓"; display:inline-grid; place-items:center; width:24px; height:24px; margin-right:10px; color:#08765c; border-radius:50%; background:#d9f4e8; font-size:.72rem; font-weight:900; }
.text-link { color:#087ca8; font-weight:850; }
.text-link span { margin-left:6px; }
.module-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }
.module-card { --module-accent:#52d9ed; position:relative; isolation:isolate; min-height:350px; overflow:hidden; border:1px solid rgba(136,209,255,.28); border-radius:17px; background:#071d36; box-shadow:0 18px 42px rgba(0,9,28,.2); transition:transform .35s ease,box-shadow .35s ease; }
.module-card:nth-child(4n+2) { --module-accent:#4e9df3; }
.module-card:nth-child(4n+3) { --module-accent:#6f87ed; }
.module-card:nth-child(4n+4) { --module-accent:#64c5b2; }
.module-card::before { position:absolute; z-index:3; right:22px; bottom:0; left:22px; height:3px; content:""; border-radius:999px 999px 0 0; background:linear-gradient(90deg,var(--module-accent),transparent); opacity:.9; pointer-events:none; }
.module-card::after { position:absolute; z-index:1; inset:0; content:""; background:linear-gradient(180deg,rgba(2,15,31,.02) 22%,rgba(2,15,31,.32) 49%,rgba(2,15,31,.97) 100%); pointer-events:none; }
.module-card:hover { transform:translateY(-5px); box-shadow:0 26px 58px rgba(0,9,28,.3); }
.module-image { position:absolute; z-index:0; inset:0; width:100%; height:100%; object-fit:cover; object-position:center 58%; transition:transform .6s ease; }
.module-card:nth-child(2) .module-image { object-position:center 95%; }
.module-card:nth-child(3) .module-image { object-position:center 100%; transform:scale(1.1); transform-origin:center bottom; }
.module-card:nth-child(5) .module-image { object-position:center 32%; }
.module-card:nth-child(6) .module-image { object-position:center 27%; }
.module-card:nth-child(7) .module-image { object-position:center 100%; }
.module-image-gis { object-position:center 68%; }
.module-card:hover .module-image { transform:scale(1.04); }
.module-card:nth-child(3):hover .module-image { transform:scale(1.14); }
.module-content { position:absolute; z-index:2; right:0; bottom:0; left:0; padding:24px; }
.module-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:8px; }
.module-card h3 { color:#fff; font-size:1.05rem; white-space:nowrap; text-shadow:0 2px 16px rgba(0,10,26,.7); }
.module-card span { flex:0 0 auto; padding:5px 8px; color:#0c3156; border:1px solid rgba(255,255,255,.45); border-radius:999px; background:#7ae4f3; font-size:.55rem; font-weight:900; text-transform:uppercase; }
.module-card p { color:#d3e5f2; font-size:.88rem; text-shadow:0 2px 14px rgba(0,10,26,.82); }
.value-proposition { display:grid; grid-template-columns:.86fr 1.14fr; gap:18px 34px; align-items:center; margin:0 0 22px; padding:22px 24px; color:#eaf7ff; border:1px solid rgba(52,143,225,.35); border-radius:17px; background:linear-gradient(135deg,#082b57,#0b4b83); box-shadow:0 14px 38px rgba(24,78,118,.13); }
.value-proposition div span,.value-proposition div strong { display:block; }
.value-proposition div span { margin-bottom:5px; color:#72dbea; font-size:clamp(.48rem,2.2vw,.66rem); font-weight:900; letter-spacing:.02em; white-space:nowrap; }
.value-proposition div strong { font-size:1.15rem; line-height:1.35; }
.value-proposition p { margin:0; color:#c7ddeb; font-size:.88rem; line-height:1.6; }
.value-proposition ul { display:flex; grid-column:1/-1; flex-wrap:wrap; gap:8px; margin:0; padding:0; list-style:none; }
.value-proposition li { padding:7px 10px; color:#dff8ff; border:1px solid rgba(127,220,236,.24); border-radius:999px; background:rgba(255,255,255,.07); font-size:.7rem; font-weight:800; }
.value-proposition li::before { content:"✓"; margin-right:6px; color:#67e0c0; }
.price-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }
.price-card { --price-tint:#ecfbfd; --price-accent:#52c9d8; position:relative; isolation:isolate; overflow:hidden; padding:22px; border:1px solid #d8e5ee; border-radius:17px; background:linear-gradient(148deg,var(--price-tint) 0,rgba(255,255,255,.98) 148px,#fff 100%); box-shadow:0 12px 36px rgba(27,72,104,.06); transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease; }
.price-card:nth-child(2) { --price-tint:#e8f7ff; --price-accent:#37addd; }
.price-card:nth-child(3) { --price-tint:#e7f1ff; --price-accent:#2c88eb; }
.price-card:nth-child(4) { --price-tint:#e9efff; --price-accent:#4d74e0; }
.price-card:nth-child(5) { --price-tint:#eceeff; --price-accent:#5865ce; }
.price-card:nth-child(6) { --price-tint:#e7ebf8; --price-accent:#294a99; }
.price-card::before { content:""; position:absolute; z-index:0; top:18px; right:14px; width:96px; height:70px; opacity:.14; background:linear-gradient(145deg,var(--price-accent),rgba(255,255,255,.2)); clip-path:polygon(0 100%,0 83%,17% 83%,17% 68%,34% 68%,34% 53%,51% 53%,51% 38%,68% 38%,68% 23%,85% 23%,85% 8%,100% 8%,100% 100%); }
.price-card>p,.price-card>h3,.price-card>strong,.price-card>small,.price-card>div,.price-card>ul,.price-card>.price-button { position:relative; z-index:2; }
.price-card:hover { transform:translateY(-3px); border-color:color-mix(in srgb,var(--price-accent) 40%,#d8e5ee); box-shadow:0 18px 44px rgba(27,72,104,.12); }
.price-card.is-featured { border:2px solid #1984e8; box-shadow:0 20px 55px rgba(18,111,199,.16); }
.recommendation { position:absolute; z-index:3; top:0; right:18px; padding:6px 9px; color:#fff; border-radius:0 0 7px 7px; background:#1974ed; font-size:.56rem; font-weight:900; letter-spacing:.07em; text-transform:uppercase; }
.price-card>p { margin:0; color:#70889a; font-size:.72rem; font-weight:750; }
.price-card h3 { margin:2px 0 16px; color:#0c3356; font-size:1.3rem; }
.price-card>strong { display:block; color:#0f65c5; font-size:2.05rem; line-height:1; }
.price-card>small { color:#758b9e; font-size:.68rem; }
.price-card>div { margin:16px -4px 14px; padding:11px 4px; border-block:1px solid #e3ebf1; }
.price-card>div b,.price-card>div span { display:block; }
.price-card>div b { font-size:.87rem; }
.price-card>div span { margin-top:3px; color:#768b9c; font-size:.7rem; }
.price-card ul { display:grid; gap:5px; min-height:72px; margin:0 0 18px; padding:0; list-style:none; color:#425f76; font-size:.79rem; line-height:1.32; }
.price-card li::before { content:"✓"; margin-right:8px; color:#118664; font-weight:900; }
.price-card .upgrade-item { color:#0f65c5; font-weight:850; }
.price-card .upgrade-item::before { content:"↗"; color:#1974ed; }
.price-button { width:100%; min-height:48px; padding-inline:19px; border-color:#32c7df; border-radius:11px; background:linear-gradient(135deg,#35cce8,#5addec); box-shadow:0 10px 24px rgba(20,150,184,.2); font-size:.9rem; font-weight:850; letter-spacing:.01em; }
.price-button::after { content:"→"; margin-left:9px; font-size:1.05rem; line-height:1; transition:transform .2s ease; }
.price-button:hover { border-color:#71e5f3; background:linear-gradient(135deg,#55daee,#7ceaf6); box-shadow:0 14px 30px rgba(20,150,184,.27); }
.price-button:hover::after { transform:translateX(3px); }
.price-button:focus-visible { outline:3px solid rgba(25,116,237,.3); outline-offset:3px; }
.price-toggle,.mobile-more-button { display:none; }
.price-note { margin:18px 0 0; padding:13px 16px; color:#526d82; border:1px solid #d5e4ed; border-radius:11px; background:#fff; font-size:.8rem; line-height:1.55; text-align:center; }
.price-note strong { color:#173f5e; }
.support-points { display:grid; gap:15px; margin-top:30px; }
.support-points>div { padding-left:18px; border-left:2px solid #39ccec; }
.support-points strong,.support-points span { display:block; }
.support-points span { margin-top:4px; color:#91abc3; font-size:.83rem; }
.support-visual { position:relative; min-height:390px; margin:0; overflow:hidden; border:1px solid rgba(103,191,255,.24); border-radius:22px; background:#10233a; box-shadow:0 24px 65px rgba(0,5,20,.32); }
.support-visual::after { content:""; position:absolute; inset:0; pointer-events:none; background:linear-gradient(180deg,transparent 62%,rgba(3,17,36,.28)); }
.support-visual img { display:block; width:100%; height:100%; min-height:390px; object-fit:cover; object-position:center; }
.news-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.news-grid article { padding:28px; border:1px solid #dae7ef; border-radius:17px; background:#fff; }
.news-grid time { display:block; margin-bottom:24px; color:#1186b6; font-size:.67rem; font-weight:900; letter-spacing:.08em; text-transform:uppercase; }
.news-grid h3 { font-size:1.15rem; }
.faq-section { background:#081d38; }
.faq-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.faq-grid details { padding:0 22px; border:1px solid rgba(102,191,247,.18); border-radius:13px; background:rgba(255,255,255,.045); }
.faq-grid summary { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:20px 0; cursor:pointer; font-weight:750; list-style:none; }
.faq-grid summary::-webkit-details-marker { display:none; }
.faq-grid summary span { color:#54d9ee; font-size:1.5rem; font-weight:400; }
.faq-grid details[open] summary span { transform:rotate(45deg); }
.faq-grid details p { margin:0 0 20px; color:#adc1d3; font-size:.91rem; line-height:1.65; }
.contact-section { color:#edf7ff; background:radial-gradient(circle at 15% 75%,rgba(57,204,236,.11),transparent 28%),linear-gradient(135deg,#0b2d58,#071b35); }
.contact-grid { display:grid; grid-template-columns:.8fr 1.2fr; gap:clamp(55px,8vw,100px); align-items:start; }
.contact-details { display:grid; gap:18px; margin-top:34px; }
.contact-details>a,.contact-details>p { margin:0; }
.contact-details span,.contact-details strong { display:block; }
.contact-details span { margin-bottom:5px; color:#7fdcec; font-size:.67rem; font-weight:900; letter-spacing:.08em; text-transform:uppercase; }
.contact-details strong { color:#e6f3ff; font-size:.94rem; line-height:1.55; }
.contact-card { display:grid; gap:17px; padding:34px; color:#173550; border-radius:22px; background:#fff; box-shadow:0 30px 75px rgba(0,5,20,.3); }
.field-row { display:grid; grid-template-columns:1fr 1fr; gap:15px; }
.contact-card label { color:#4b667b; font-size:.76rem; font-weight:800; }
.contact-card input,.contact-card select,.contact-card textarea { width:100%; margin-top:7px; padding:13px 14px; color:#173550; border:1px solid #cfdde7; border-radius:9px; background:#f8fbfd; font:inherit; font-weight:500; }
.contact-card input:focus,.contact-card select:focus,.contact-card textarea:focus { outline:3px solid rgba(57,204,236,.25); border-color:#249ec5; }
.consent { display:grid!important; grid-template-columns:18px 1fr; gap:9px; align-items:start; font-weight:500!important; line-height:1.5; }
.consent input { width:17px; margin:2px 0 0; }
.consent a { color:#0c72c8; text-decoration:underline; }
.contact-card .button { border:0; cursor:pointer; }
.form-note { margin:0; color:#73899a; font-size:.68rem; text-align:center; }
.contact-form>h3 { margin:0; color:#173550; }
.contact-form>p { margin:0; color:#647d91; font-size:.82rem; line-height:1.55; }
.choice-group { margin:0; padding:0; border:0; }
.choice-group legend { margin-bottom:8px; color:#536c81; font-size:.72rem; font-weight:800; }
.choice-options { display:grid; grid-template-columns:repeat(3,1fr); gap:9px; }
.contact-card .choice-options label { display:flex; align-items:center; gap:8px; min-height:58px; margin:0; padding:10px; border:1px solid #cfdde7; border-radius:9px; background:#f8fbfd; cursor:pointer; line-height:1.3; }
.contact-card .choice-options label:has(input:checked) { color:#075f88; border-color:#249ec5; background:#e5f8fb; box-shadow:0 0 0 2px rgba(57,204,236,.12); }
.contact-card .choice-options input { width:17px; height:17px; flex:0 0 17px; margin:0; padding:0; accent-color:#168fb5; }
.optional-fields { margin:0; overflow:hidden; color:#173550; border:1px solid #d5e2ea; border-radius:11px; background:#f8fbfd; box-shadow:none; }
.optional-fields summary { padding:14px 42px 14px 16px; color:#35536b; cursor:pointer; font-size:.78rem; font-weight:800; }
.optional-fields summary span { margin-left:5px; color:#7b91a2; font-size:.68rem; font-weight:600; }
.optional-fields-content { padding:2px 16px 16px; }
.optional-fields-content label:last-child { margin-bottom:0; }
.contact-trap { position:absolute; left:-10000px; width:1px; height:1px; overflow:hidden; }
.contact-actions { display:flex; flex-wrap:wrap; gap:11px; }
.contact-actions .button { min-width:190px; justify-content:center; }
.contact-actions .button:disabled { cursor:wait; opacity:.62; transform:none; }
.contact-captcha { display:grid; grid-template-columns:minmax(0,1fr) 140px; gap:7px 18px; align-items:end; padding:14px 16px; border:1px solid #cfe1ea; border-radius:12px; background:#f2f8fb; }
.contact-captcha-question span,.contact-captcha-question strong { display:block; }
.contact-captcha-question span { margin-bottom:4px; color:#315068; font-size:.78rem; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
.contact-captcha-question strong { color:#071c34; font-size:1.3rem; }
.contact-captcha label { margin:0; }
.contact-captcha small { grid-column:1/-1; color:#526a7d; font-size:.79rem; }
.contact-card .button-secondary { color:#14577a; border:1px solid #b9d7e4; background:#eef7fa; }
.contact-card .button-secondary:hover { color:#0b4463; border-color:#70bad2; background:#dff3f7; }
.form-status { padding:13px 15px; border:1px solid #a9d6e4; border-radius:9px; background:#edf8fb; color:#22566c; font-size:.76rem; font-weight:750; line-height:1.45; }
.form-status.is-success { border-color:#89c69a; background:#edf9f0; color:#216235; }
.form-status.is-error { border-color:#dda1a1; background:#fff1f1; color:#8a2929; }
.contact-form .form-note { line-height:1.55; text-align:left; }
.contact-form .form-note a { color:#0c72c8; text-decoration:underline; }
.site-footer { padding:70px 0 28px; color:#abc1d5; background:#041326; border-top:1px solid rgba(107,190,242,.13); }
.footer-grid { display:grid; grid-template-columns:1.4fr .6fr .75fr; gap:70px; }
.footer-grid>div:first-child>p { max-width:430px; margin:22px 0 0; font-size:.86rem; line-height:1.7; }
.footer-links { display:flex; flex-direction:column; gap:11px; font-size:.82rem; }
.footer-links strong { margin-bottom:7px; color:#eff8ff; font-size:.9rem; }
.footer-links a:hover { color:#62dbee; }
.footer-bottom { display:flex; justify-content:space-between; margin-top:55px; padding-top:23px; border-top:1px solid rgba(107,190,242,.12); font-size:.7rem; }
.legal-hero { padding:132px 0 66px; background:radial-gradient(circle at 80% 50%,rgba(41,128,230,.28),transparent 28%),linear-gradient(145deg,#06182f,#0a284d); }
.legal-hero h1 { font-size:clamp(2.5rem,4.5vw,4rem); white-space:nowrap; }
.legal-content { padding:75px 20px 100px; color:#23415b; background:#f3f8fb; }
.legal-card { width:min(820px,100%); margin:auto; padding:clamp(28px,5vw,60px); border:1px solid #d9e7ef; border-radius:22px; background:#fff; box-shadow:0 22px 65px rgba(29,72,103,.08); }
.legal-intro { color:#567187; font-size:1.06rem!important; }
.legal-content h2 { margin:42px 0 14px; font-size:1.5rem; letter-spacing:-.02em; }
.legal-content h2:first-of-type { margin-top:28px; }
.legal-content h3 { margin:26px 0 8px; font-size:1rem; }
.legal-content p { margin:0 0 14px; color:#536d81; font-size:.9rem; line-height:1.75; }
.legal-content a { color:#0b70c4; text-decoration:underline; }
.legal-hero-gender { position:relative; overflow:hidden; background:#06182f; }
.legal-hero-background { position:absolute; z-index:0; inset:0; width:100%; height:100%; object-fit:cover; object-position:center 64%; }
.legal-hero-gender::before { content:""; position:absolute; z-index:1; inset:0; background:linear-gradient(90deg,rgba(3,18,39,.98) 0%,rgba(4,24,51,.9) 30%,rgba(4,25,55,.58) 58%,rgba(3,16,35,.28) 100%); pointer-events:none; }
.legal-hero-gender .container { position:relative; z-index:2; }
.gender-content { min-height:430px; }
.gender-card { position:relative; overflow:hidden; }
.gender-card::before { content:""; position:absolute; top:0; left:0; width:100%; height:5px; background:linear-gradient(90deg,#1674d8,#59dbea); }
.gender-card .legal-intro { color:#244b69; font-weight:650; }
@media (max-width:600px) { .legal-hero-background { object-position:61% 64%; } }
@media (max-width:1000px) { .benefit-grid,.module-grid { grid-template-columns:repeat(2,1fr); } .price-grid { grid-template-columns:repeat(2,1fr); } .module-card:nth-child(1) .module-image { object-position:center 35%; } .module-card:nth-child(2) .module-image { object-position:center 39%; } .module-card:nth-child(3) .module-image { object-position:center 63%; transform:none; } .module-card:nth-child(4) .module-image { object-position:center 44%; } .module-card:nth-child(5) .module-image { object-position:center 39%; } .module-card:nth-child(6) .module-image { object-position:center 39%; } .module-card:nth-child(7) .module-image { object-position:center 63%; } .module-card:nth-child(8) .module-image { object-position:center 48%; } .module-card:nth-child(3):hover .module-image { transform:scale(1.04); } }
@media (max-width:900px) { .main-nav { display:none; } .mobile-nav { display:block; } .mobile-nav summary { display:grid; width:42px; height:42px; padding:10px; cursor:pointer; list-style:none; border:1px solid rgba(255,255,255,.24); border-radius:9px; } .mobile-nav summary::-webkit-details-marker { display:none; } .mobile-nav summary span { display:block; width:100%; height:2px; margin:auto; background:#dff5ff; } .mobile-nav>div { position:absolute; top:52px; right:0; display:flex; flex-direction:column; min-width:220px; padding:10px; color:#123453; border:1px solid #d9e7ef; border-radius:13px; background:#fff; box-shadow:0 20px 50px rgba(0,7,22,.25); } .mobile-nav>div a { padding:12px; border-radius:8px; font-weight:750; } .mobile-nav>div a:hover { background:#eef6fc; } .hero { min-height:auto; padding-top:140px; } .hero-grid,.split,.contact-grid,.section-heading { grid-template-columns:1fr; gap:38px; } .product-stage { width:min(620px,96%); margin-inline:auto; } .trust-grid { grid-template-columns:1fr 1fr; } .trust-grid>div:nth-child(2) { border-right:0; } .function-grid { grid-template-columns:1fr 1fr; } .section-heading { align-items:start; } .footer-grid { grid-template-columns:1fr 1fr; } .footer-grid>div:first-child { grid-column:1/-1; } }
@media (max-width:600px) { .container { width:min(100% - 28px,1180px); } .header-inner { width:100%; height:62px; padding-inline:14px; } .hero { padding:88px 0 50px; } h1 { font-size:clamp(1.35rem,6vw,1.9rem); } .section h2,.legal-content h2 { font-size:clamp(.9rem,4vw,1.18rem); letter-spacing:-.025em; } .legal-hero h1 { font-size:clamp(2rem,11vw,3rem); } .lead { font-size:1rem; } .hero-actions { margin:25px 0 24px; } .hero-actions .button { width:100%; } .hero-points { display:grid; gap:9px; } .trust-grid,.benefit-grid,.function-grid,.module-grid,.price-grid,.news-grid,.faq-grid,.footer-grid,.field-row,.choice-options { grid-template-columns:1fr; } .trust-grid>div { min-height:78px; border-right:0; border-bottom:1px solid #dbe8f0; } .section { padding:42px 0; } .section-heading { gap:18px; margin-bottom:25px; } .section-lead { font-size:.96rem; line-height:1.62; } .benefit-card { min-height:230px; } .function-card { min-height:305px; } .function-content { padding:20px; } .module-card { min-height:330px; } .module-content { padding:21px; } .benefit-card p,.function-card p,.module-card p { font-size:.94rem; line-height:1.55; } .module-card p { font-size:.9rem; } .contact-card { padding:22px 16px; } .contact-captcha { grid-template-columns:1fr; } .contact-captcha small { grid-column:auto; } .contact-actions .button { width:100%; } .footer-grid { gap:34px; } .footer-grid>div:first-child { grid-column:auto; } .footer-bottom { display:grid; gap:8px; } }
@media (max-width:900px) { .hero { padding-top:112px; padding-bottom:68px; } .hero-grid { gap:30px; } .trust-strip { margin-top:-36px; background:linear-gradient(to bottom,transparent 36px,#f4f8fc 36px); } .trust-grid>div { border-bottom:1px solid #dbe8f0; } .trust-grid>div:nth-child(2n) { border-right:0; } .trust-grid>div:nth-last-child(-n+2) { border-bottom:0; } }
@media (max-width:600px) { .hero { padding:88px 0 50px; } .trust-strip { margin-top:-28px; padding-bottom:4px; background:linear-gradient(to bottom,transparent 28px,#f4f8fc 28px); } .trust-grid { grid-template-columns:1fr 1fr; border-radius:14px; } .trust-grid>div { min-height:68px; padding:11px 12px; border-right:1px solid #dbe8f0; border-bottom:1px solid #dbe8f0; } .trust-grid>div:nth-child(2n) { border-right:0; } .trust-grid>div:nth-last-child(-n+2) { border-bottom:0; } .trust-grid strong { font-size:1.05rem; } .trust-grid span { font-size:.7rem; } .trust-grid small { font-size:.58rem; } }
@media (max-width:600px) {
  .value-proposition { grid-template-columns:1fr; gap:12px; margin-bottom:18px; padding:19px 17px; }
  .value-proposition div strong { font-size:1.03rem; }
  .value-proposition p { font-size:.9rem; }
  .value-proposition ul { grid-column:auto; display:grid; gap:7px; }
  .value-proposition li { width:max-content; max-width:100%; }
  .mobile-more-button { display:flex; align-items:center; justify-content:center; gap:9px; width:100%; min-height:48px; margin-top:16px; padding:12px 16px; color:#eaf9ff; border:1px solid rgba(112,209,244,.42); border-radius:11px; background:rgba(255,255,255,.07); cursor:pointer; font:inherit; font-size:.9rem; font-weight:800; }
  .section-light .mobile-more-button { color:#145c86; border-color:#b9d8e8; background:#fff; box-shadow:0 8px 24px rgba(33,83,117,.07); }
  .mobile-more-button span { font-size:1.05rem; transition:transform .25s ease; }
  .mobile-more-button[aria-expanded="true"] span { transform:rotate(180deg); }
  .price-grid { gap:10px; }
  .price-card { padding:17px 18px; border-radius:14px; }
  .price-card h3 { margin:1px 0 9px; font-size:1.15rem; }
  .price-card>strong { font-size:1.7rem; }
  .price-card>small { font-size:.74rem; }
  .price-card>div { margin:14px -2px 12px; padding:10px 2px; }
  .price-card ul { min-height:0; margin-bottom:15px; font-size:.86rem; line-height:1.38; }
  .price-card.is-mobile-collapsed>div,.price-card.is-mobile-collapsed>ul,.price-card.is-mobile-collapsed>.price-button { display:none; }
  .price-card.is-mobile-collapsed { min-height:128px; }
  .price-toggle { position:absolute; z-index:4; right:16px; bottom:16px; display:flex; align-items:center; gap:7px; min-height:40px; padding:8px 11px; color:#135f93; border:1px solid #b9d8e8; border-radius:9px; background:rgba(255,255,255,.9); cursor:pointer; font:inherit; font-size:.76rem; font-weight:850; }
  .price-card:not(.is-mobile-collapsed) .price-toggle { position:relative; right:auto; bottom:auto; width:100%; justify-content:center; margin-top:10px; }
  .price-toggle span { font-size:1rem; transition:transform .25s ease; }
  .price-toggle[aria-expanded="true"] span { transform:rotate(180deg); }
  .price-note { margin-top:14px; padding:14px; color:#526d82; border:1px solid #d5e4ed; border-radius:11px; background:#fff; font-size:.84rem; line-height:1.55; text-align:left; }
  .price-note strong { display:block; margin-top:7px; color:#173f5e; }
}
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } *,*::before,*::after { scroll-behavior:auto!important; animation-duration:.01ms!important; animation-iteration-count:1!important; transition-duration:.01ms!important; } }

/* Animierte Originalansichten im Startbereich */
.screenshot-stage { position:relative; isolation:isolate; width:min(510px,100%); aspect-ratio:1; margin-left:auto; perspective:none; }
.gis-slider-stage .screenshot-slide { object-position:center 40%; }
.screenshot-stage::before,.screenshot-stage::after { content:""; position:absolute; z-index:0; pointer-events:none; }
.screenshot-stage::before { top:50%; left:50%; width:76%; aspect-ratio:1; border:2px solid rgba(95,222,242,.46); border-top-color:rgba(157,243,255,.92); border-right-color:rgba(95,222,242,.76); border-radius:10px; background:linear-gradient(145deg,rgba(57,204,236,.12),transparent 44%); box-shadow:0 0 40px rgba(57,204,236,.24),inset 0 0 28px rgba(57,204,236,.1); transform:translate(-50%,-50%) rotate(12deg); transform-origin:center; animation:square-spin 16s linear infinite; }
.screenshot-stage::after { top:50%; left:50%; width:96%; aspect-ratio:1; border:2px solid rgba(103,149,255,.38); border-bottom-color:rgba(140,176,255,.86); border-left-color:rgba(103,149,255,.72); border-radius:10px; background:linear-gradient(315deg,rgba(25,116,237,.11),transparent 48%); box-shadow:0 0 52px rgba(25,116,237,.22); transform:translate(-50%,-50%) rotate(-21deg); transform-origin:center; animation:square-spin-reverse 23s linear infinite; }
.gis-slider-stage::before { border:0; border-radius:0; background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cpolygon points='50,3 97,95 3,95' fill='%2339ccec' fill-opacity='.06' stroke='%235fdef2' stroke-opacity='.72' stroke-width='.7'/%3E%3C/svg%3E") center/contain no-repeat; box-shadow:none; filter:drop-shadow(0 0 18px rgba(57,204,236,.28)); animation:square-spin-reverse 16s linear infinite; }
.gis-slider-stage::after { border:0; border-radius:0; background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cpolygon points='50,3 97,95 3,95' fill='%231974ed' fill-opacity='.05' stroke='%236795ff' stroke-opacity='.62' stroke-width='.6'/%3E%3C/svg%3E") center/contain no-repeat; box-shadow:none; filter:drop-shadow(0 0 22px rgba(25,116,237,.25)); animation:square-spin 23s linear infinite; }
.screenshot-window { position:absolute; z-index:2; top:50%; left:0; width:100%; overflow:hidden; border:1px solid rgba(142,221,255,.38); border-radius:20px; background:#05182f; box-shadow:0 38px 90px rgba(0,5,19,.52),0 0 0 8px rgba(255,255,255,.045),inset 0 0 50px rgba(30,151,225,.16); transform:translateY(-50%) rotateY(-3deg) rotateX(1deg); }
.screenshot-slides { position:relative; aspect-ratio:1.25; overflow:hidden; background:#10233a; }
.screenshot-slide { position:absolute; inset:0; z-index:1; width:100%; height:100%; object-fit:cover; object-position:center 42%; opacity:0; clip-path:inset(0 0 100% 0); transform:scale(1.025); filter:saturate(.94) contrast(1.02); transition:clip-path 1.25s cubic-bezier(.22,.72,.18,1),opacity .9s ease,transform 5.2s ease; }
.screenshot-slide.is-active { z-index:3; opacity:1; clip-path:inset(0 0 0 0); transform:scale(1); }
.screenshot-slide.is-exiting { z-index:2; opacity:0; clip-path:inset(0 0 0 0); transform:scale(1.012); transition:opacity 1.1s ease,transform 1.25s ease; }
.screenshot-stage:not(.gis-slider-stage) .screenshot-slide { transform:none!important; transition:none!important; }
.gis-slider-stage .screenshot-slide { opacity:1; clip-path:inset(0 0 100% 0); transform:scale(1.006); transition:clip-path 4s cubic-bezier(.42,0,.18,1),transform 4s ease; }
.gis-slider-stage .screenshot-slide.is-active { z-index:3; opacity:1; clip-path:inset(0); transform:scale(1); will-change:clip-path,transform; }
.gis-slider-stage .screenshot-slide.is-exiting { z-index:2; opacity:1; clip-path:inset(100% 0 0 0); transform:scale(1); transition:clip-path 4s cubic-bezier(.42,0,.18,1); will-change:clip-path; }
.slider-overlay { position:absolute; z-index:6; right:0; bottom:0; left:0; display:grid; align-items:end; min-height:66px; padding:26px 18px 16px; color:#edfaff; background:linear-gradient(180deg,transparent,rgba(2,13,31,.92) 55%); text-align:center; pointer-events:none; }
.screenshot-caption { margin:0; font-size:.75rem; font-weight:800; line-height:1.35; text-shadow:0 2px 9px #00132c; }
@keyframes square-spin { from { transform:translate(-50%,-50%) rotate(12deg); } to { transform:translate(-50%,-50%) rotate(372deg); } }
@keyframes square-spin-reverse { from { transform:translate(-50%,-50%) rotate(-21deg); } to { transform:translate(-50%,-50%) rotate(-381deg); } }
@media (max-width:900px) { .screenshot-stage { width:min(700px,96%); margin-inline:auto; } }
@media (max-width:600px) { .screenshot-stage { width:100%; } .screenshot-stage::before { width:74%; } .screenshot-stage::after { width:94%; } .screenshot-window { border-radius:14px; transform:translateY(-50%); } .slider-overlay { min-height:58px; padding:22px 13px 12px; } .screenshot-caption { font-size:.65rem; } }
@media (max-width:600px) { .back-to-top { right:max(14px,env(safe-area-inset-right)); bottom:max(14px,env(safe-area-inset-bottom)); width:44px; height:44px; border-radius:12px; font-size:1.3rem; } }
@media (max-width:600px) { .module-card:nth-child(1) .module-image { object-position:center 20%; } .module-card:nth-child(2) .module-image,.module-card:nth-child(6) .module-image { object-position:center 0; } .module-card:nth-child(3) .module-image,.module-card:nth-child(7) .module-image { object-position:center 60%; } .module-card:nth-child(4) .module-image,.module-card:nth-child(5) .module-image { object-position:center 35%; } .module-card:nth-child(8) .module-image { object-position:center 40%; } }
@media (prefers-reduced-motion:reduce) { .screenshot-stage:not(.gis-slider-stage)::before { animation:square-spin 16s linear infinite!important; } .screenshot-stage:not(.gis-slider-stage)::after { animation:square-spin-reverse 23s linear infinite!important; } .gis-slider-stage::before { animation:square-spin-reverse 16s linear infinite!important; } .gis-slider-stage::after { animation:square-spin 23s linear infinite!important; } .screenshot-slide,.gis-slider-stage .screenshot-slide { transform:none!important; transition:none!important; will-change:auto; } .gis-slider-stage .screenshot-slide { opacity:0; clip-path:inset(0)!important; } .gis-slider-stage .screenshot-slide.is-active { opacity:1; } .gis-slider-stage .screenshot-slide.is-exiting { opacity:0; } }

/* Eigenständige Produkt- und SEO-Seiten */
.product-page-hero { position:relative; overflow:hidden; padding:126px 0 76px; background:radial-gradient(circle at 82% 32%,rgba(25,116,237,.3),transparent 28%),radial-gradient(circle at 62% 85%,rgba(57,204,236,.1),transparent 24%),linear-gradient(145deg,#06182f,#08274b); }
.product-page-hero::before { position:absolute; inset:0; content:""; opacity:.16; background-image:linear-gradient(rgba(117,210,255,.14) 1px,transparent 1px),linear-gradient(90deg,rgba(117,210,255,.14) 1px,transparent 1px); background-size:64px 64px; -webkit-mask-image:linear-gradient(to right,transparent 12%,black 88%); mask-image:linear-gradient(to right,transparent 12%,black 88%); }
.product-page-hero-grid { position:relative; display:grid; grid-template-columns:minmax(0,1fr) 360px; align-items:center; gap:clamp(34px,4vw,50px); }
.product-page-hero h1 { max-width:820px; font-size:clamp(2rem,2.7vw,2.55rem); white-space:normal; text-wrap:balance; }
.product-page-hero .lead { max-width:680px; }
.breadcrumb { display:flex; align-items:center; gap:9px; margin-bottom:28px; color:#9eb7cf; font-size:.73rem; font-weight:700; }
.breadcrumb a:hover { color:#6fe2f4; }
.product-page-visual { position:relative; width:min(100%,360px); aspect-ratio:1.22; justify-self:end; margin:0; overflow:hidden; border:1px solid rgba(139,216,255,.3); border-radius:22px; background:#09213e; box-shadow:0 28px 58px rgba(0,5,20,.36); }
.product-page-visual::after { position:absolute; inset:0; content:""; background:linear-gradient(180deg,transparent 48%,rgba(2,15,31,.35)); pointer-events:none; }
.product-page-visual img { display:block; width:100%; height:100%; object-fit:cover; object-position:center 35%; }
.price-page-hero { padding-bottom:88px; }
.price-page-hero>.container { position:relative; }
.price-page-hero .lead { max-width:830px; }
.product-page-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.product-copy-section { border-top:1px solid #d9e6ee; background:linear-gradient(180deg,#f7fbfd 0%,#eef6fa 100%); }
.product-copy-intro { margin-bottom:32px; }
.product-copy-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; }
.product-copy-card { padding:clamp(24px,3vw,34px); border:1px solid #d6e4ec; border-radius:18px; background:#fff; box-shadow:0 14px 38px rgba(9,35,60,.07); }
.product-copy-card.is-wide { grid-column:1/-1; }
.product-copy-card h3 { margin:0 0 15px; color:#123c5d; font-size:clamp(1.12rem,1.6vw,1.35rem); line-height:1.2; }
.product-copy-card p { margin:0 0 14px; color:#526d82; line-height:1.72; }
.product-copy-card ul { display:grid; gap:8px; margin:18px 0 0; padding-left:1.2rem; color:#294e69; line-height:1.55; }
.product-copy-source { margin-top:18px!important; padding-top:14px; border-top:1px solid #e0eaf0; }
.product-copy-source a { color:#086f91; font-weight:750; text-decoration-thickness:1px; text-underline-offset:3px; }
.product-page-card { overflow:hidden; color:#173a56; border:1px solid #d7e6ef; border-radius:18px; background:#fff; box-shadow:0 16px 42px rgba(24,72,104,.08); }
.product-page-card>img { display:block; width:100%; height:148px; object-fit:cover; object-position:center 36%; }
.product-page-card>div { padding:25px; }
.product-page-card h3 { color:#123c5d; font-size:1.13rem; }
.product-page-card p { margin:10px 0 0; color:#5c7488; font-size:.91rem; line-height:1.65; }
.product-page-detail { display:grid; grid-template-columns:1fr 1fr; align-items:center; gap:clamp(48px,8vw,100px); }
.product-page-detail h2 { margin-bottom:22px; }
.product-page-checks { display:grid; gap:12px; margin:0; padding:0; list-style:none; }
.product-page-checks li { padding:16px 18px; color:#d8e9f6; border:1px solid rgba(122,197,240,.2); border-radius:11px; background:rgba(255,255,255,.045); font-size:.92rem; font-weight:700; }
.product-page-checks li::before { content:"✓"; margin-right:10px; color:#5ce0ef; font-weight:900; }
.product-page-cta { color:#edf8ff; background:linear-gradient(135deg,#0a3567,#0b4e86); }
.product-page-cta>.container { display:flex; align-items:center; justify-content:space-between; gap:40px; }
.product-page-cta h2 { margin:0 0 12px; }
.product-page-cta p:not(.eyebrow) { max-width:760px; margin:0; color:#b9d0e3; line-height:1.65; }
.product-page-cta .button { flex:0 0 auto; }
.section-more { display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:24px; margin-top:28px; }
.text-link.light { color:#75e4f5; }
@media (max-width:1100px) { .product-page-hero-grid { grid-template-columns:1fr; } .product-page-visual { width:min(400px,72vw); justify-self:center; } }
@media (max-width:900px) { .product-page-hero-grid,.product-page-detail { grid-template-columns:1fr; } .product-page-visual { width:min(400px,78vw); justify-self:center; } .product-page-grid { grid-template-columns:repeat(2,1fr); } .product-page-card>img { height:155px; } }
@media (max-width:760px) { .product-copy-grid { grid-template-columns:1fr; } .product-copy-card.is-wide { grid-column:auto; } .product-copy-card { padding:23px 21px; } }
@media (max-width:600px) { .product-page-hero { padding:96px 0 52px; } .product-page-hero h1 { font-size:clamp(1.35rem,6.2vw,1.75rem); letter-spacing:-.035em; white-space:normal; } .product-page-hero .lead { margin-top:20px; } .breadcrumb { margin-bottom:20px; } .product-page-visual { width:min(320px,84vw); } .product-page-grid { grid-template-columns:1fr; } .product-page-card>img { height:145px; } .product-page-card>div { padding:21px; } .product-page-detail { gap:28px; } .product-page-cta>.container { display:grid; gap:24px; } .product-page-cta .button { width:100%; } .section-more { align-items:stretch; flex-direction:column; text-align:center; } }