/* Shared page and interaction styles for sitemap sections. */
.main-nav{gap:clamp(12px,1.45vw,22px)}
.nav-link{font-size:9px}
.site-footer{display:grid;grid-template-columns:150px 210px 1fr auto;column-gap:20px;row-gap:17px;align-items:center}
.footer-nav{justify-content:flex-end;flex-wrap:wrap}
.copyright{text-align:right}
.product-more{display:flex;align-items:center;gap:7px;margin:0 0 9px;padding:0;border:0;background:none;color:#c1c5d1;font-size:8px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;cursor:pointer}
.product-more span{color:var(--blue-bright);font-size:14px}
.product-more:hover{color:#fff}
.product-detail-layout{display:grid;grid-template-columns:.9fr 1.1fr;gap:28px;align-items:center}
.product-dialog{width:min(900px,calc(100vw - 36px));max-width:none;padding:30px}
.product-detail-visual{height:420px;position:relative;display:grid;place-items:center;background:radial-gradient(ellipse,#202b55,#11131a 72%);border:1px solid #ffffff12}
.product-detail-visual img{width:94%;height:94%;object-fit:contain}
.product-detail-tag{position:absolute;top:14px;left:14px;padding:7px 9px;background:var(--blue);font-size:8px;font-weight:800;letter-spacing:.12em}
.product-detail-copy{padding:24px 14px 24px 0}
.product-detail-copy h2{font:800 48px/.88 var(--display);text-transform:uppercase;margin:16px 0}
.product-detail-price{display:block;color:var(--blue-bright);font:800 22px var(--display)}
.product-detail-copy>p{font-size:12px;line-height:1.8;color:#b9bbc4}
.product-detail-note{padding:12px;background:#ffffff08;border-left:2px solid var(--yellow);font-size:10px!important}
.product-detail-copy .add-button{margin-top:19px}
.contact-section{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(40px,8vw,120px);align-items:center;padding-top:105px;padding-bottom:110px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);position:relative;overflow:hidden}
.contact-section:before{content:"";position:absolute;width:360px;height:360px;right:9%;top:15%;border-radius:50%;background:#2457ff15;filter:blur(90px);pointer-events:none}
.contact-copy,.contact-form{position:relative;z-index:1}
.contact-copy h2{font:800 clamp(64px,8vw,104px)/.82 var(--display);letter-spacing:-.02em;margin:25px 0}
.contact-copy h2 em{color:var(--blue-bright);font-style:normal}
.contact-copy>p{max-width:470px;color:#a6a8b1;font-size:12px;line-height:1.9}
.contact-note{display:flex;gap:13px;align-items:flex-start;margin-top:30px;padding:16px 18px;border:1px solid #ffffff18;background:#ffffff05;max-width:440px}
.contact-note>span{color:var(--blue-bright);font-size:20px}
.contact-note b,.contact-note small{display:block}
.contact-note b{font-size:9px;letter-spacing:.1em}
.contact-note small{margin-top:6px;color:#91939c;font-size:9px;line-height:1.6}
.contact-form{display:grid;gap:9px;padding:27px;background:#101116;border:1px solid #ffffff18}
.contact-form>label:not(.contact-consent){font-size:9px;font-weight:700;color:#d9dae0}
.contact-form input:not([type=checkbox]),.contact-form textarea{width:100%;border:1px solid #353843;background:#090a0e;color:#fff;padding:12px;font:inherit;font-size:11px;outline:none}
.contact-form input:not([type=checkbox]){height:43px}
.contact-form textarea{resize:vertical;min-height:115px}
.contact-form input:focus,.contact-form textarea:focus{border-color:var(--blue-bright)}
.contact-consent{display:flex;align-items:flex-start;gap:9px;margin:5px 0;color:#9fa1aa;font-size:9px;line-height:1.6}
.contact-consent input{accent-color:var(--blue);margin:2px 0 0}
.contact-consent a{color:#fff;text-decoration:underline;text-decoration-color:var(--blue-bright);text-underline-offset:3px}
.contact-form .button{justify-self:start}
.contact-status{min-height:17px;margin:0;color:#91a7ff;font-size:10px;line-height:1.6}
.footer-legal{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:10px 22px;padding-top:13px;border-top:1px solid #ffffff13}
.footer-legal a{font-size:8px;color:#7f828c}
.footer-legal a:hover{color:#fff}
.lp-footer{flex-wrap:wrap}
.lp-legal-nav{width:100%;display:flex;flex-wrap:wrap;gap:9px 18px;padding-top:12px;border-top:1px solid #17191d20}
.lp-legal-nav a{font-size:8px;color:#5c5d64}
.lp-legal-nav a:hover{color:#111}

/* Shared layouts for checkout, legal information and the demo order confirmation. */
.commerce-page{min-height:100vh;background:var(--black);color:var(--white)}
.simple-header{height:78px;padding:0 5vw;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #ffffff14;background:#07080bf5}
.simple-header .brand{width:150px;height:58px}
.simple-header nav{display:flex;align-items:center;gap:22px}
.simple-header nav a{font-size:9px;color:#b9bbc4;font-weight:700;text-transform:uppercase;letter-spacing:.08em}
.simple-header nav a:hover{color:#fff}
.page-main{width:min(1160px,calc(100% - 44px));margin:0 auto;padding:55px 0 90px}
.page-kicker{display:flex;align-items:center;gap:9px;color:#9da2b1;font-size:9px;font-weight:800;letter-spacing:.15em;text-transform:uppercase}
.page-kicker i{width:7px;height:7px;border-radius:50%;background:var(--blue-bright);box-shadow:0 0 12px var(--blue)}
.page-title{font:800 clamp(44px,7vw,76px)/.88 var(--display);text-transform:uppercase;margin:18px 0 12px}
.page-title em{color:var(--blue-bright);font-style:normal}
.page-intro{max-width:700px;color:#a6a8b1;font-size:12px;line-height:1.8}
.page-footer{min-height:105px;padding:22px 5vw;border-top:1px solid #ffffff14;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:14px 18px;color:#858792;font-size:8px}
.page-footer a{color:#dfe0e4}
.legal-sections{display:grid;gap:13px;margin-top:35px}
.legal-card{padding:23px 25px;background:#101116;border:1px solid #ffffff16;border-left:3px solid var(--blue)}
.legal-card h2{font:700 25px var(--display);text-transform:uppercase;margin:0 0 10px}
.legal-card p{max-width:920px;margin:0;color:#aeb0b8;font-size:11px;line-height:1.8}
.legal-placeholder{display:inline-flex;margin-top:12px;padding:6px 9px;background:#f5d54718;color:#f5d547;font-size:8px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.checkout-layout{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(280px,.75fr);gap:28px;margin-top:34px;align-items:start}
.checkout-card,.order-summary{background:#101116;border:1px solid #ffffff18;padding:26px}
.checkout-card h2,.order-summary h2{font:700 27px var(--display);text-transform:uppercase;margin:0 0 19px}
.checkout-fields{display:grid;grid-template-columns:1fr 1fr;gap:13px}
.checkout-fields label{display:grid;gap:7px;color:#d2d4da;font-size:9px;font-weight:700}
.checkout-fields .field-wide{grid-column:1/-1}
.checkout-fields input{height:43px;width:100%;border:1px solid #383b46;background:#090a0e;color:white;padding:0 11px;font:inherit;font-size:11px;outline:none}
.checkout-fields input:focus{border-color:var(--blue-bright)}
.checkout-demo{margin:17px 0;padding:13px 15px;background:#f5d54712;border-left:2px solid var(--yellow);color:#d6d1b0;font-size:9px;line-height:1.7}
.checkout-card .button{width:100%;margin-top:10px}
.checkout-error{min-height:17px;color:#f1a5a5;font-size:10px}
.summary-item{display:grid;grid-template-columns:52px 1fr auto;gap:10px;align-items:center;padding:12px 0;border-bottom:1px solid #ffffff14}
.summary-item img{width:52px;height:58px;object-fit:contain;background:#171a24}
.summary-item strong,.summary-item small{display:block}
.summary-item strong{font-size:10px}
.summary-item small{margin-top:5px;color:#9598a2;font-size:9px}
.summary-item>span{font-size:10px}
.summary-total{display:flex;justify-content:space-between;gap:15px;padding-top:17px;font-size:12px;font-weight:800}
.summary-note{margin-top:9px;color:#858892;font-size:9px;line-height:1.6}
.empty-checkout{padding:18px 0;color:#a7a9b1;font-size:11px;line-height:1.7}
.success-panel{max-width:820px;margin:65px auto;padding:48px;background:#101116;border:1px solid #ffffff18;text-align:center}
.success-mark{width:64px;height:64px;margin:0 auto 20px;border:1px solid var(--blue-bright);border-radius:50%;display:grid;place-items:center;color:var(--blue-bright);font-size:28px}
.success-panel h1{font:800 clamp(47px,7vw,76px)/.83 var(--display);margin:18px 0}
.success-panel h1 em{color:var(--blue-bright);font-style:normal}
.success-panel>p{max-width:570px;margin:0 auto 17px;color:#afb1ba;font-size:11px;line-height:1.8}
.demo-reference{display:inline-block;margin:12px 0 20px;padding:8px 13px;border:1px solid #3b4154;color:#cbd2e8;font-size:10px;letter-spacing:.1em}
.success-summary{max-width:430px;margin:0 auto 24px;text-align:left}
.success-summary .summary-item{grid-template-columns:42px 1fr auto}
.success-summary .summary-item img{width:42px;height:46px}
.success-actions{display:flex;justify-content:center;gap:12px;flex-wrap:wrap}
.success-actions .button{min-width:190px}
.account-dialog{width:min(540px,calc(100% - 30px));max-width:none}
.account-dialog [hidden]{display:none!important}
.account-dialog>p{color:#a6a8b1;font-size:11px;line-height:1.7}
.account-tabs{display:flex;gap:5px;margin:23px 0 0;padding-bottom:8px;border-bottom:1px solid #ffffff18}
.account-tabs button{flex:1;min-height:37px;padding:7px 9px;border:1px solid transparent;background:transparent;color:#9699a4;font-size:9px;font-weight:800;cursor:pointer}
.account-tabs button.is-active{border-color:#3768ff66;background:#2457ff18;color:#fff}
.account-form{display:grid;gap:9px;margin-top:16px}
.account-form label{font-size:9px;font-weight:700;color:#d9dae0}
.account-form input{width:100%;height:43px;padding:0 11px;border:1px solid #383b46;background:#090a0e;color:#fff;font:inherit;font-size:11px;outline:none}
.account-form input:focus{border-color:var(--blue-bright)}
.account-form .button{width:100%;margin-top:4px}
.account-demo-note{margin:17px 0 0!important;padding:11px 13px;border-left:2px solid var(--yellow);background:#f5d54712;color:#d6d1b0!important;font-size:8px!important;line-height:1.7!important}
.account-dashboard h2{font:800 58px/.85 var(--display);margin:25px 0 12px}
.account-dashboard h2 em{color:var(--blue-bright);font-style:normal}
.account-status{margin:0;color:#a6a8b1;font-size:10px;line-height:1.7}
.account-view-tabs{margin-top:19px}
.account-view-panel{min-height:120px;padding:18px 4px 10px}
.account-view-panel h3{margin:0 0 8px;font:700 24px var(--display);text-transform:uppercase}
.account-view-panel p{margin:0;color:#a6a8b1;font-size:10px;line-height:1.7}
.account-exit{padding:8px 0;border:0;background:transparent;color:#b8c5ff;font-size:9px;font-weight:700;text-decoration:underline;text-underline-offset:3px;cursor:pointer}

@media(max-width:900px){
  .main-nav{gap:12px}
  .nav-link{font-size:8px}
  .nav-create{font-size:7px;padding:0 8px}
  .contact-section{grid-template-columns:1fr;gap:34px;padding-top:75px;padding-bottom:75px}
  .contact-copy h2{font-size:72px}
  .footer-legal{gap:9px 14px}
  .checkout-layout{grid-template-columns:1fr}
}
@media(max-width:680px){
  .main-nav{gap:0}
  .nav-link{font-size:10px}
  .nav-create{font-size:8px;padding:0 10px}
  .contact-section{padding-top:65px;padding-bottom:65px}
  .contact-copy h2{font-size:60px;margin:20px 0}
  .contact-copy>p{font-size:10px}
  .contact-form{padding:19px}
  .site-footer{grid-template-columns:1fr 1fr;align-items:center}
  .footer-legal{grid-column:1/-1;justify-content:flex-start}
  .footer-legal a{font-size:7px}
  .product-detail-layout{grid-template-columns:1fr;gap:8px}
  .product-detail-visual{height:270px}
  .product-detail-copy{padding:14px 4px 4px}
  .product-detail-copy h2{font-size:38px}
  .simple-header{height:66px;padding:0 17px}
  .simple-header .brand{width:115px;height:48px}
  .simple-header nav{gap:12px}
  .simple-header nav a{font-size:7px}
  .page-main{width:calc(100% - 34px);padding:38px 0 60px}
  .page-title{font-size:48px}
  .legal-card{padding:18px}
  .legal-card h2{font-size:22px}
  .checkout-card,.order-summary{padding:19px}
  .checkout-fields{grid-template-columns:1fr}
  .checkout-fields .field-wide{grid-column:auto}
  .success-panel{margin:34px auto;padding:28px 19px}
  .page-footer{padding:20px 17px;flex-wrap:wrap}
  .account-dashboard h2{font-size:49px}
  .account-tabs button{font-size:8px;padding:7px 4px}
}
