/* Layout redesign: compact editorial intro, clear shopping grid and useful footer. */
.products.shell { width:min(100% - 48px,1240px)!important; padding:54px 0 96px!important; }
.products .section-head { display:grid!important; grid-template-columns:minmax(0,1.1fr) minmax(280px,.9fr); align-items:end!important; gap:24px 70px!important; margin:0 0 30px!important; padding:0 0 34px!important; border-bottom:1px solid rgba(200,255,61,.25)!important; }
.products .section-head>div>span { display:inline-flex; margin:0 0 15px; font-size:11px!important; letter-spacing:.16em; }
.products .section-head h1 { max-width:760px!important; margin:0!important; font-size:clamp(3.1rem,5.6vw,5.6rem)!important; line-height:1.02!important; letter-spacing:-.065em!important; text-wrap:balance; }
.products .section-head>p { max-width:470px!important; margin:0 0 4px!important; font-size:clamp(15px,1.25vw,17px)!important; line-height:1.65!important; }
.products .store-steps { grid-column:1/-1; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; margin:4px 0 0; }
.products .store-steps article { min-height:76px; padding:14px 16px!important; border-radius:14px; }
.products .store-steps b { font-size:14px!important; }
.products .store-steps small { font-size:12px!important; }
.products .shop { display:grid!important; grid-template-columns:minmax(0,1.05fr) minmax(350px,.95fr)!important; gap:24px!important; align-items:start!important; }
.products .product-list { gap:12px!important; }
.products .product-card { min-height:105px!important; padding:16px 20px!important; border-radius:16px!important; }
.products .product-card--active { animation:none!important; }
.products .calculator { top:96px!important; border-radius:18px!important; }
.ft-how { width:min(100% - 48px,1240px)!important; padding:72px 0 48px!important; }
.ft-how-head { max-width:650px!important; margin-bottom:30px!important; }
.ft-how-head h2 { font-size:clamp(2.2rem,3.5vw,3.5rem)!important; }
.ft-how-card { min-height:170px; padding:24px!important; }
.ft-mini-faq { width:min(100% - 48px,1240px)!important; padding:82px 0 30px!important; }
.ft-mini-faq-head { max-width:680px!important; margin-bottom:30px!important; }
.ft-mini-faq-head h2 { font-size:clamp(2.2rem,4vw,4rem)!important; line-height:1.08!important; letter-spacing:-.06em; }
.ft-mini-faq-list { max-width:860px!important; gap:10px!important; }
.ft-faq-item { border-radius:14px!important; }
.ft-contact-bar { display:grid!important; grid-template-columns:1fr auto; align-items:center; gap:16px 28px; max-width:860px!important; margin:36px auto 0!important; padding:24px!important; border:1px solid rgba(200,255,61,.18); border-radius:18px; background:rgba(22,32,22,.76); }
.ft-contact-actions { justify-content:flex-end; flex-wrap:wrap; }
.ft-contact-btn { min-height:42px; }
.footer.shell { width:min(100% - 48px,1240px)!important; margin-top:50px!important; padding:36px 0 50px!important; display:grid!important; grid-template-columns:1.3fr 1fr 1.5fr; gap:18px 28px; align-items:start; }
.footer.shell .brand { grid-row:span 2; }
.footer.shell p { margin:0; line-height:1.6; }
.footer-legal { display:flex!important; flex-wrap:wrap; gap:10px 18px!important; }
.footer.shell a { font-size:13px!important; }
.footer-support { justify-self:end; }
@media(max-width:900px){.products .section-head{grid-template-columns:1fr!important}.products .section-head>p{max-width:700px!important}.products .shop{grid-template-columns:1fr!important}.products .calculator{position:static!important}.ft-contact-bar{grid-template-columns:1fr!important}.ft-contact-actions{justify-content:flex-start}.footer.shell{grid-template-columns:1fr 1fr!important}.footer.shell .brand{grid-row:auto}.footer-support{justify-self:start}}
@media(max-width:620px){.products.shell,.ft-how,.ft-mini-faq,.footer.shell{width:min(100% - 28px,1240px)!important}.products.shell{padding-top:30px!important}.products .section-head h1{font-size:clamp(2.75rem,10vw,4rem)!important}.products .section-head>p{font-size:14px!important}.products .store-steps{grid-template-columns:1fr!important}.products .store-steps article{min-height:0}.products .product-card{padding:13px!important}.ft-how,.ft-mini-faq{padding-top:54px!important}.footer.shell{grid-template-columns:1fr!important}.footer-legal{gap:12px 20px!important}}

/* Header redesign: brand/actions above a full-width navigation row. */
html body :is(main > nav.nav.shell, div.docs > nav.nav.shell, nav.ft-docs-nav, nav.ft-buy-nav, nav.ft-reseller-nav) {
  display:grid!important; grid-template-columns:minmax(0,1fr) auto!important; grid-template-rows:auto auto!important;
  align-items:center!important; gap:8px 24px!important; min-height:0!important;
  padding:13px clamp(16px,4vw,54px) 0!important;
  background:rgba(9,14,16,.97)!important; border-bottom:1px solid rgba(200,255,61,.18)!important;
  box-shadow:0 12px 28px rgba(0,0,0,.23)!important;
}
html body :is(main > nav.nav.shell, div.docs > nav.nav.shell, nav.ft-docs-nav, nav.ft-buy-nav, nav.ft-reseller-nav) .brand { grid-column:1; grid-row:1; justify-self:start; max-width:none!important; margin:0!important; transform:none!important; }
html body :is(main > nav.nav.shell, div.docs > nav.nav.shell, nav.ft-docs-nav, nav.ft-buy-nav, nav.ft-reseller-nav) .ft-nav-tools { grid-column:2; grid-row:1; justify-self:end; margin:0!important; }
html body :is(main > nav.nav.shell, div.docs > nav.nav.shell, nav.ft-docs-nav, nav.ft-buy-nav, nav.ft-reseller-nav) .nav-actions:not(#ft-nav-actions) {
  display:block!important; position:static!important; grid-column:1/-1; grid-row:2; width:100%!important; max-width:none!important;
  left:auto!important; top:auto!important; transform:none!important; margin:0!important; padding:0!important;
  pointer-events:auto!important;
}
html body .nav-rail--dock { display:flex!important; width:100%!important; max-width:none!important; gap:clamp(14px,3vw,34px)!important; padding:0!important; border:0!important; border-radius:0!important; background:transparent!important; box-shadow:none!important; overflow-x:auto; }
html body .nav-rail--dock::before,html body .nav-rail--dock::after,html body .nav-rail-glider { display:none!important; }
html body .nav-rail--dock .nav-pill--tab { flex:0 0 auto!important; min-height:45px!important; height:45px!important; padding:0 2px!important; border:0!important; border-radius:0!important; background:transparent!important; color:#aab5ac!important; box-shadow:none!important; }
html body .nav-rail--dock .nav-pill--tab:hover { color:#f3f8ed!important; background:transparent!important; }
html body .nav-rail--dock .nav-pill--tab.nav-pill--active { color:#f7f9f3!important; background:transparent!important; border:0!important; box-shadow:inset 0 -3px #c8ff3d!important; }
html body .nav-rail--dock .nav-pill--tab.nav-pill--active::after { display:none!important; }
html body .ft-contacts-btn,html body .ft-lang-picker { border-radius:10px!important; }
@media(max-width:620px){
 html body :is(main > nav.nav.shell, div.docs > nav.nav.shell, nav.ft-docs-nav, nav.ft-buy-nav, nav.ft-reseller-nav){padding:9px 12px 0!important;gap:4px 8px!important}
 html body .nav-rail--dock{gap:18px!important}
 html body .nav-rail--dock .nav-pill--tab{min-height:42px!important;height:42px!important}
 html body .nav-rail--dock .nav-tab-label{font-size:12px!important}
}

/* Compact header: logo and navigation together, actions on the right. */
html body :is(main > nav.nav.shell, div.docs > nav.nav.shell, nav.ft-docs-nav, nav.ft-buy-nav, nav.ft-reseller-nav) {
  display:flex!important; flex-wrap:nowrap!important; align-items:center!important;
  gap:clamp(16px,2.5vw,38px)!important; min-height:72px!important;
  padding:10px clamp(16px,3vw,42px)!important;
  background:rgba(8,13,16,.96)!important;
}
html body :is(main > nav.nav.shell, div.docs > nav.nav.shell, nav.ft-docs-nav, nav.ft-buy-nav, nav.ft-reseller-nav) .brand { flex:0 0 auto!important; order:0!important; grid-column:auto!important; grid-row:auto!important; }
html body :is(main > nav.nav.shell, div.docs > nav.nav.shell, nav.ft-docs-nav, nav.ft-buy-nav, nav.ft-reseller-nav) .nav-actions:not(#ft-nav-actions) {
  flex:0 1 auto!important; order:1!important; grid-column:auto!important; grid-row:auto!important;
  width:auto!important; max-width:min(52vw,650px)!important; margin:0!important;
  position:static!important; left:auto!important; top:auto!important; transform:none!important;
}
html body :is(main > nav.nav.shell, div.docs > nav.nav.shell, nav.ft-docs-nav, nav.ft-buy-nav, nav.ft-reseller-nav) .ft-nav-tools { flex:0 0 auto!important; order:2!important; grid-column:auto!important; grid-row:auto!important; margin-left:auto!important; }
html body .nav-rail--dock { width:auto!important; max-width:100%!important; gap:clamp(8px,1.5vw,24px)!important; background:transparent!important; border:0!important; box-shadow:none!important; overflow-x:auto; }
html body .nav-rail--dock .nav-pill--tab { height:40px!important; min-height:40px!important; padding:0 5px!important; color:#aab6ad!important; }
html body .nav-rail--dock .nav-pill--tab.nav-pill--active { color:#f7f9f3!important; box-shadow:inset 0 -2px #c8ff3d!important; }
html body .ft-contacts-btn,html body .ft-lang-picker { background:transparent!important; border-color:rgba(255,255,255,.14)!important; }
@media(max-width:1050px){
 html body :is(main > nav.nav.shell, div.docs > nav.nav.shell, nav.ft-docs-nav, nav.ft-buy-nav, nav.ft-reseller-nav){gap:14px!important}
 html body .nav-rail--dock{gap:8px!important}
 html body .nav-rail--dock .nav-pill--tab{padding:0 3px!important}
}
@media(max-width:800px){
 html body :is(main > nav.nav.shell, div.docs > nav.nav.shell, nav.ft-docs-nav, nav.ft-buy-nav, nav.ft-reseller-nav){flex-wrap:wrap!important;gap:4px 10px!important;padding:8px 14px 0!important}
 html body :is(main > nav.nav.shell, div.docs > nav.nav.shell, nav.ft-docs-nav, nav.ft-buy-nav, nav.ft-reseller-nav) .brand{order:0!important}
 html body :is(main > nav.nav.shell, div.docs > nav.nav.shell, nav.ft-docs-nav, nav.ft-buy-nav, nav.ft-reseller-nav) .ft-nav-tools{order:1!important;margin-left:auto!important}
 html body :is(main > nav.nav.shell, div.docs > nav.nav.shell, nav.ft-docs-nav, nav.ft-buy-nav, nav.ft-reseller-nav) .nav-actions:not(#ft-nav-actions){order:2!important;flex:1 1 100%!important;width:100%!important;max-width:100%!important}
 html body .nav-rail--dock{width:100%!important;justify-content:flex-start!important;gap:18px!important}
}

/* Legacy page fill — Layered Tide uses #ft-tide-gradient instead. */
html:not(.ft-tide-bg) body { background-image:
  radial-gradient(ellipse 80% 52% at 50% -12%, rgba(88,130,220,.12), transparent 62%),
  radial-gradient(circle at 83% 17%, rgba(200,255,61,.08), transparent 38%),
  linear-gradient(180deg,#0b1116 0%,#080d11 62%,#090e12 100%) !important;
  background-size:cover!important;
  background-repeat:no-repeat!important;
}
/* Contacts and language belong to the same visual navigation system. */
html body .ft-nav-tools { gap:10px!important; }
html body .ft-contacts-btn,html body .ft-lang-picker {
  min-height:40px!important; height:40px!important; padding:0 5px!important;
  border:0!important; border-radius:0!important; background:transparent!important;
  box-shadow:none!important; color:#aab6ad!important; font-size:12px!important;
  font-weight:650!important; letter-spacing:.01em!important;
}
html body .ft-lang-picker { min-width:0!important; padding-inline:5px!important; }
html body .ft-contacts-btn:hover,html body .ft-lang-picker:hover,
html body .ft-nav-tools--open .ft-contacts-btn,html body .ft-lang-bar--open .ft-lang-picker {
  transform:none!important; background:transparent!important; color:#f7f9f3!important;
  border:0!important; box-shadow:inset 0 -2px #c8ff3d!important;
}
html body .ft-contacts-btn-icon,html body .ft-lang-picker-chevron { color:#aab6ad!important; }
html body .ft-contacts-btn:hover .ft-contacts-btn-icon,html body .ft-lang-picker:hover .ft-lang-picker-chevron { color:#c8ff3d!important; }
@media(max-width:800px){html body .ft-contacts-btn,html body .ft-lang-picker{height:38px!important;min-height:38px!important}}

/* Checkout and address modal in the storefront design system. */
html body .modal-backdrop { background:rgba(3,8,11,.78)!important; backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); padding:18px; }
html body .checkout-modal { width:min(560px,100%)!important; max-width:min(560px,100%)!important; max-height:min(92vh,900px); overflow-y:auto; padding:clamp(24px,4vw,38px)!important; border-radius:22px!important; border:1px solid rgba(200,255,61,.28)!important; background:linear-gradient(160deg,#1b271d 0%,#111b1b 47%,#0b1217 100%)!important; box-shadow:0 36px 100px rgba(0,0,0,.62),inset 0 1px 0 rgba(255,255,255,.08)!important; }
html body .checkout-modal::before { content:""; display:block; position:absolute; top:0; left:34px; right:34px; height:2px; background:linear-gradient(90deg,transparent,#c8ff3d,transparent); opacity:.8; }
html body .checkout-modal>small { color:#c8ff3d!important; font-size:10px!important; letter-spacing:.16em!important; }
html body .checkout-modal h2 { margin:11px 38px 8px 0!important; font-size:clamp(28px,5vw,38px)!important; font-weight:760; letter-spacing:-.055em!important; line-height:1.1; }
html body .checkout-modal>p { margin:0 0 27px!important; color:#b4c1b7!important; font-size:13px!important; line-height:1.55!important; }
html body .checkout-modal label { color:#dce6d8!important; font-size:12px!important; font-weight:700!important; gap:9px!important; }
html body .checkout-modal input { height:58px!important; padding:0 18px!important; color:#f7fbf4!important; font-size:15px!important; background:#101b1a!important; border:1px solid rgba(209,235,205,.25)!important; border-radius:13px!important; box-shadow:inset 0 2px 8px rgba(0,0,0,.18); }
html body .checkout-modal input::placeholder { color:#819188!important; }
html body .checkout-modal input:focus { border-color:#c8ff3d!important; box-shadow:0 0 0 4px rgba(200,255,61,.13),inset 0 2px 8px rgba(0,0,0,.18)!important; }
html body .checkout-modal .payment-network-label { margin-top:22px; }
html body .checkout-modal .payment-network-label>span { color:#b9c8b7!important; font-size:11px!important; font-weight:800; letter-spacing:.12em!important; }
html body .checkout-modal .payment-tabs { display:grid!important; grid-template-columns:1fr 1fr; padding:4px; gap:4px!important; margin-top:10px; border:1px solid rgba(214,239,209,.15); border-radius:14px; background:#0d1718; }
html body .checkout-modal .payment-tabs button { min-height:43px!important; border:0!important; border-radius:10px!important; background:transparent!important; color:#aebbb0!important; font-weight:700!important; }
html body .checkout-modal .payment-tabs button.active { background:#263b25!important; color:#eaffd7!important; box-shadow:inset 0 0 0 1px rgba(200,255,61,.3)!important; }
html body .checkout-modal .payment-assets { gap:7px!important; margin-top:13px; }
html body .checkout-modal .payment-assets button { min-height:39px!important; padding:0 12px!important; border-radius:10px!important; background:#111c1b!important; color:#b9c5ba!important; border:1px solid rgba(255,255,255,.13)!important; font-size:11px!important; }
html body .checkout-modal .payment-assets button.active { background:#c8ff3d!important; color:#121b12!important; border-color:#c8ff3d!important; }
html body .checkout-modal .payment-network-grid { margin-top:10px; }
html body .checkout-modal .payment-network-grid>button { background:#15211e!important; border:1px solid rgba(255,255,255,.14)!important; }
html body .checkout-modal .payment-network-grid>button.active { background:#21331f!important; border-color:#c8ff3d!important; box-shadow:0 0 0 3px rgba(200,255,61,.1)!important; }
html body .checkout-modal .modal-action { height:auto!important; min-height:56px!important; margin-top:19px!important; padding:12px 18px!important; border-radius:13px!important; background:linear-gradient(110deg,#dfff79,#b6ef36)!important; color:#13200d!important; font-size:14px!important; font-weight:800!important; box-shadow:0 12px 26px rgba(185,239,56,.18)!important; }
html body .checkout-modal .modal-action:hover:not(:disabled) { background:#e7ff9a!important; }
html body .checkout-modal .modal-close { top:21px; right:21px; width:36px; height:36px; background:rgba(255,255,255,.08)!important; border:1px solid rgba(255,255,255,.1)!important; }
@media(max-width:520px){html body .modal-backdrop{padding:10px!important}html body .checkout-modal{max-height:96vh;padding:24px 18px!important;border-radius:18px!important}html body .checkout-modal h2{font-size:29px!important}}
