/* GraSiTi-only showcase. The cards use React Bits SpotlightCard's spotlight interaction. */
.grasiti-showcase, .grasiti-film { position:relative; color:#eff5fb; isolation:isolate; }
.grasiti-showcase { overflow:hidden; padding:clamp(78px,8vw,140px) clamp(22px,6vw,96px) clamp(70px,7vw,112px); background:radial-gradient(ellipse 60% 65% at 84% 6%,rgba(27,96,132,.17),transparent 70%),linear-gradient(180deg,#040b12 0%,#09151e 56%,#050d14 100%); border-top:1px solid rgba(142,204,242,.14); }
.grasiti-showcase:before{content:"";position:absolute;inset:0;opacity:.22;z-index:-1;pointer-events:none;background-image:linear-gradient(rgba(130,187,218,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(130,187,218,.07) 1px,transparent 1px);background-size:74px 74px;mask-image:linear-gradient(to bottom,#000,transparent 85%)}
.grasiti-showcase-inner,.grasiti-film-inner{max-width:1380px;margin:0 auto;}
.grasiti-showcase-heading{display:flex;justify-content:space-between;align-items:end;gap:46px;margin-bottom:52px;}
.grasiti-section-kicker{display:flex;align-items:center;gap:14px;margin:0 0 24px;color:#71c8ee;font:700 10px/1.6 Arial,sans-serif;letter-spacing:.16em;text-transform:uppercase;}
.grasiti-kicker-line{width:30px;height:1px;background:#4bbde9;flex:none;}
.grasiti-showcase-heading h2,.grasiti-film h2{font:600 clamp(35px,4.2vw,69px)/1.07 Arial,Helvetica,sans-serif;letter-spacing:-.055em;margin:0;}
.grasiti-showcase-heading h2 span{color:#91aebf;font-weight:400;}
.grasiti-section-lede{flex:0 1 325px;color:#a1b3be;font-size:clamp(14px,1.06vw,17px);line-height:1.75;margin:0 0 7px;}
.grasiti-product-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:19px;align-items:stretch;}
.grasiti-spotlight-card{--mouse-x:50%;--mouse-y:50%;--spotlight-color:rgba(54,184,242,.18);position:relative;overflow:hidden;background:linear-gradient(158deg,#152531,#0b151d 75%);border:1px solid rgba(155,204,235,.20);border-radius:17px;box-shadow:0 18px 38px rgba(0,0,0,.18);transition:transform .32s ease,border-color .3s ease,box-shadow .3s ease;}
.grasiti-spotlight-card::before{position:absolute;content:"";z-index:2;inset:0;border-radius:inherit;pointer-events:none;opacity:0;background:radial-gradient(520px circle at var(--mouse-x) var(--mouse-y),var(--spotlight-color),transparent 68%);transition:opacity .25s ease;}
@media(hover:hover) and (pointer:fine){.grasiti-spotlight-card:hover{transform:translateY(-7px);border-color:rgba(100,190,242,.52);box-shadow:0 28px 60px rgba(0,0,0,.30),0 0 36px rgba(42,153,221,.08)}.grasiti-spotlight-card:hover::before{opacity:1;}}
.grasiti-card-media{height:clamp(190px,19vw,264px);position:relative;overflow:hidden;background:linear-gradient(155deg,#e9f1f4,#d7e2e9);isolation:isolate;}
.grasiti-card-media:after{content:"";position:absolute;z-index:1;inset:auto 0 0;height:44px;background:linear-gradient(0deg,rgba(10,21,30,.17),transparent);pointer-events:none;}
.grasiti-card-media img{display:block;width:100%;height:100%;object-fit:contain;object-position:center;transition:transform .6s cubic-bezier(.2,.8,.25,1);}
.grasiti-product-card:nth-child(2) .grasiti-card-media{background:linear-gradient(160deg,#e7ecef,#d8e1e6)}
.grasiti-product-card:nth-child(3) .grasiti-card-media{background:linear-gradient(160deg,#e3eef3,#dae3e8)}
@media(hover:hover) and (pointer:fine){.grasiti-spotlight-card:hover .grasiti-card-media img{transform:scale(1.045)}}
.grasiti-card-index{position:absolute;z-index:2;top:17px;left:17px;color:#e4f6ff;font-size:10px;letter-spacing:.16em;font-weight:800;background:rgba(5,25,38,.83);border:1px solid rgba(205,233,247,.30);border-radius:20px;padding:9px 12px;backdrop-filter:blur(8px)}
.grasiti-card-copy{padding:clamp(24px,2.4vw,37px);display:flex;flex-direction:column;min-height:380px;}
.grasiti-card-kind{color:#6ac0eb;font-size:10px;font-weight:800;letter-spacing:.18em;margin:0 0 14px;}
.grasiti-card-copy h3{font-size:clamp(22px,2vw,30px);line-height:1.12;font-weight:650;letter-spacing:-.045em;margin:0 0 11px;max-width:335px;}
.grasiti-card-short{margin:0 0 17px;color:#b7d3e2;font-size:13px;font-weight:600;line-height:1.5;}
.grasiti-card-description{font-size:13px;line-height:1.7;color:#a3b3be;margin:0 0 19px;}
.grasiti-card-tags{display:flex;gap:7px;flex-wrap:wrap;margin:auto 0 25px;align-content:start;}
.grasiti-card-tags span{border:1px solid #24475b;background:#102332;color:#b0cee1;border-radius:4px;padding:7px 9px;font-size:10px;white-space:nowrap;}
.grasiti-card-link{position:relative;z-index:3;display:flex;justify-content:space-between;gap:15px;align-items:center;padding:18px 0 0;border-top:1px solid #29404f;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.12em;color:#e3f4ff;text-decoration:none;transition:color .2s;}
.grasiti-card-link span{font-size:23px;font-weight:400;line-height:1;color:#71c8ee;transition:transform .2s;}
.grasiti-card-link:hover{color:#6ccfff;}.grasiti-card-link:hover span{transform:translate(3px,-3px)}
.grasiti-card-link:focus-visible,.grasiti-video-poster:focus-visible,.grasiti-film-youtube:focus-visible{outline:2px solid #8dd6f9;outline-offset:5px;}
.grasiti-product-notice{margin:23px 0 0;color:#839aa9;font-size:12px;letter-spacing:.012em;}
.grasiti-film{padding:clamp(66px,7vw,115px) clamp(22px,6vw,96px);background:linear-gradient(115deg,#050e16,#081a25 52%,#07111a);border-block:1px solid rgba(150,215,243,.13)}
.grasiti-film-inner{display:grid;grid-template-columns:minmax(260px,.72fr) minmax(0,1.28fr);gap:clamp(45px,7vw,110px);align-items:center;}
.grasiti-film h2{max-width:520px;font-size:clamp(34px,4vw,64px);}
.grasiti-film h2 em{font-style:normal;color:#83c4e6;}
.grasiti-film-copy>p:not(.grasiti-section-kicker){max-width:380px;color:#9ab0bf;font-size:16px;line-height:1.76;margin:26px 0 36px;}
.grasiti-film-meta{display:flex;flex-wrap:wrap;gap:16px 26px;font-size:10px;font-weight:700;letter-spacing:.13em;color:#7b9bad;}
.grasiti-film-meta span:first-child{display:flex;align-items:center;gap:9px}.grasiti-film-meta i{height:6px;width:6px;border-radius:50%;background:#58c2f3;box-shadow:0 0 0 4px #58c2f31d;}
.grasiti-film-youtube{display:inline-flex;gap:25px;align-items:center;margin-top:33px;text-transform:uppercase;letter-spacing:.1em;font-size:11px;font-weight:700;color:#c6eafb;text-decoration:none;}
.grasiti-film-youtube:hover{color:#72c9f7;}
.grasiti-video-frame{position:relative;aspect-ratio:16/9;border-radius:17px;overflow:hidden;background:#02080f;box-shadow:0 25px 55px rgba(0,0,0,.42),0 0 0 1px rgba(129,200,236,.23);}
.grasiti-video-poster{display:block;position:relative;width:100%;height:100%;border:0;background:#08131d;padding:0;color:#fff;cursor:pointer;text-align:left;}
.grasiti-video-poster>img{width:100%;height:100%;object-fit:cover;display:block;filter:brightness(.72);transition:filter .35s ease,transform .6s ease;}
.grasiti-video-poster:hover>img{filter:brightness(.9);transform:scale(1.035)}
.grasiti-video-wash{position:absolute;inset:0;background:linear-gradient(180deg,transparent 50%,rgba(2,9,16,.75))}
.grasiti-play-ring{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:90px;height:90px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.78);border-radius:50%;background:rgba(8,27,40,.3);backdrop-filter:blur(8px);box-shadow:0 0 0 12px rgba(255,255,255,.09);transition:background .25s,scale .25s;}
.grasiti-video-poster:hover .grasiti-play-ring{scale:1.075;background:rgba(21,109,151,.62)}
.grasiti-play-triangle{width:0;height:0;border-top:13px solid transparent;border-bottom:13px solid transparent;border-left:20px solid #fff;margin-left:7px;}
.grasiti-video-label{position:absolute;bottom:29px;left:30px;font-size:11px;font-weight:700;letter-spacing:.16em;}
.grasiti-video-label small{display:block;font-size:9px;font-weight:400;letter-spacing:.13em;color:#a8dcf3;margin-top:8px;}
.grasiti-video-frame iframe{width:100%;height:100%;border:0;display:block;}
@media(max-width:1050px){.grasiti-showcase-heading{align-items:start;}.grasiti-product-grid{gap:12px;}.grasiti-card-copy{padding:21px;min-height:410px;}.grasiti-card-tags span{font-size:9px}}
@media(max-width:800px){.grasiti-showcase-heading{display:block;}.grasiti-section-lede{margin-top:24px;max-width:600px;}.grasiti-product-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;}.grasiti-card-copy{min-height:365px;}.grasiti-film-inner{grid-template-columns:1fr;gap:35px}.grasiti-film-copy>p:not(.grasiti-section-kicker){max-width:610px}.grasiti-film-meta{margin-bottom:5px}}
@media(max-width:560px){.grasiti-showcase{padding:72px 18px 60px}.grasiti-film{padding:72px 18px}.grasiti-showcase-heading{margin-bottom:34px}.grasiti-showcase-heading h2{font-size:clamp(34px,9vw,52px)}.grasiti-product-grid{grid-template-columns:1fr}.grasiti-card-media{height:220px}.grasiti-card-copy{min-height:0;padding:25px}.grasiti-card-tags{margin-top:3px}.grasiti-card-link{margin-top:7px}.grasiti-film h2{font-size:clamp(34px,9vw,52px)}.grasiti-play-ring{width:68px;height:68px}.grasiti-play-triangle{border-top-width:10px;border-bottom-width:10px;border-left-width:16px}.grasiti-video-label{left:18px;bottom:18px}}
@media(prefers-reduced-motion:reduce){.grasiti-spotlight-card,.grasiti-card-media img,.grasiti-play-ring,.grasiti-video-poster>img,.grasiti-card-link span{transition:none!important}.grasiti-spotlight-card:hover{transform:none}.grasiti-video-poster:hover>img{transform:none}}

.grasiti-react-grid {display:contents;}

/* GraSiTi product details side drawer. Scope all styles to the showcase. */
.grasiti-product-card{cursor:pointer}
.grasiti-card-link{width:100%;background:transparent;border:0;border-top:1px solid #29404f;text-align:left;font-family:inherit;cursor:pointer}
.grasiti-card-link span{transform:rotate(45deg)}
.grasiti-card-link:hover span{transform:rotate(45deg) translate(3px,-3px)}
.grasiti-film-instruction{margin-top:26px!important;color:#b5cad7!important;font-size:12px!important;letter-spacing:.04em}
.grasiti-drawer-overlay[hidden]{display:none!important}
.grasiti-drawer-overlay{position:fixed;z-index:2147482500;inset:0;display:flex;justify-content:flex-end;font-family:Arial,Helvetica,sans-serif;color:#e8f3fa;isolation:isolate}
.grasiti-drawer-backdrop{position:absolute;inset:0;background:rgba(2,9,15,.74);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);cursor:default}
body.grasiti-panel-open{overflow:hidden!important}
.grasiti-drawer{position:relative;z-index:2;height:100%;width:min(700px,100%);display:flex;flex-direction:column;overflow:hidden;background:#08131c;border-left:1px solid rgba(125,206,250,.23);box-shadow:-40px 0 80px rgba(0,0,0,.5);animation:grasiti-slidein .38s cubic-bezier(.22,.75,.18,1)}
@keyframes grasiti-slidein{from{transform:translateX(60px);opacity:.76}to{transform:translateX(0);opacity:1}}
.grasiti-drawer-topbar{min-height:83px;display:flex;align-items:center;justify-content:space-between;gap:15px;padding:17px clamp(21px,5vw,43px);flex:0 0 auto;border-bottom:1px solid rgba(115,192,232,.16);background:#08131c}
.grasiti-drawer-brand{color:#8bc6e5;letter-spacing:.2em;font-size:10px;font-weight:750;display:flex;align-items:center;gap:10px}
.grasiti-drawer-divider{margin:0 5px;color:#416a80}
.grasiti-drawer-dot{width:7px;height:7px;display:inline-block;border-radius:50%;background:#67c6f9;box-shadow:0 0 0 5px rgba(103,198,249,.09)}
.grasiti-drawer-close{display:grid;place-items:center;flex:none;width:43px;height:43px;border-radius:50%;border:1px solid rgba(135,194,224,.25);background:#152633;color:#eef8fc;font-size:32px;font-weight:300;line-height:1;cursor:pointer;transition:border-color .2s,background .2s}
.grasiti-drawer-close:hover{background:#1a3d54;border-color:#60b9e6}
.grasiti-drawer-close:focus-visible,.grasiti-drawer:focus-visible,.grasiti-card-link:focus-visible{outline:2px solid #7dd5ff;outline-offset:3px}
.grasiti-drawer-scroll{overflow-y:auto;overscroll-behavior:contain;min-height:0;padding:0 clamp(21px,5vw,44px) 44px;scrollbar-color:#315a70 #0b1a24;scrollbar-width:thin}
.grasiti-drawer-image{height:clamp(320px,42vh,420px);margin:30px 0 33px;border-radius:13px;overflow:hidden;background:linear-gradient(130deg,#e3eef4,#c9dce7);display:grid;place-items:center}
.grasiti-drawer-image img{height:100%;width:100%;object-fit:contain}
.grasiti-drawer-intro{padding-bottom:33px;border-bottom:1px solid rgba(127,188,220,.2)}
.grasiti-drawer-eyebrow{font-size:10px;font-weight:800;letter-spacing:.19em;color:#65bce6;margin:0 0 15px!important;text-transform:uppercase}
.grasiti-drawer-title{font-size:clamp(37px,4vw,59px);line-height:1.02;letter-spacing:-.055em;color:#f5fbff;font-weight:700;margin:0 0 20px}
.grasiti-drawer-lead{font-size:19px;line-height:1.45;color:#b9e2f4;font-weight:550;margin:0 0 14px}
.grasiti-drawer-description{font-size:14px;line-height:1.8;color:#a5bdca;margin:0}
.grasiti-drawer-section{padding:33px 0 35px;border-bottom:1px solid rgba(127,188,220,.17)}
.grasiti-drawer-section-title{font-size:clamp(22px,2.4vw,29px);letter-spacing:-.04em;margin:0 0 20px;font-weight:650;color:#f1f7fa}
.grasiti-drawer-feature-list{display:grid;grid-template-columns:1fr;list-style:none;gap:12px;padding:0;margin:0}
.grasiti-drawer-feature-list li{position:relative;padding:10px 0 10px 26px;color:#bfd0da;font-size:14px;line-height:1.58}
.grasiti-drawer-feature-list li:before{content:'✓';position:absolute;left:0;color:#64cef9;font-size:16px}
.grasiti-drawer-body{color:#a9bfcd;font-size:14px;line-height:1.9;margin:0}
.grasiti-drawer-applications{display:flex;flex-wrap:wrap;gap:9px}
.grasiti-drawer-applications span{padding:11px 13px;border-radius:5px;border:1px solid #28546d;background:#102735;color:#d4edf9;font-size:12px;line-height:1.4}
.grasiti-drawer-steps{list-style:decimal;padding-left:23px;display:grid;gap:13px;color:#adc4d2;font-size:14px;line-height:1.7;margin:0}
.grasiti-drawer-steps li{padding-left:6px}
.grasiti-drawer-steps li::marker{color:#6cc7f3;font-weight:800}
.grasiti-drawer-specs{margin:0;padding:0;display:grid;gap:0;border-top:1px solid #224053}
.grasiti-drawer-spec{display:grid;grid-template-columns:35% 1fr;gap:17px;padding:16px 0;border-bottom:1px solid #224053;color:#a8c4d6;font-size:13px;line-height:1.55}
.grasiti-drawer-spec dt{font-weight:650;color:#8acde9}.grasiti-drawer-spec dd{margin:0;color:#d8e8ee}
.grasiti-drawer-footnote{margin:18px 0 0;font-size:11px;line-height:1.6;color:#7893a4}
.grasiti-drawer-ending{padding:33px 0 18px;text-align:center;font-size:10px;color:#64849a;letter-spacing:.16em}
@media(max-width:600px){.grasiti-drawer{width:100%;border:0}.grasiti-drawer-topbar{min-height:69px;padding:12px 19px}.grasiti-drawer-brand{font-size:8.5px;letter-spacing:.15em}.grasiti-drawer-close{width:39px;height:39px}.grasiti-drawer-scroll{padding:0 20px 34px}.grasiti-drawer-image{height:clamp(260px,36vh,320px);margin:19px 0 27px}.grasiti-drawer-title{font-size:40px}.grasiti-drawer-lead{font-size:17px}.grasiti-drawer-section{padding:28px 0}.grasiti-drawer-spec{grid-template-columns:1fr;gap:5px}.grasiti-drawer-spec dt{font-size:12px}.grasiti-drawer-feature-list li{font-size:13px}}
@media(prefers-reduced-motion:reduce){.grasiti-drawer{animation:none!important}.grasiti-drawer-close{transition:none!important}}