/* ================================================================
   BITBOX — bitbox.css
================================================================ */

/* ── tokens ── */
:root {
  /* layout */
  --header-h:     72px;
  --content-max:  1180px;
  --diagonal:     calc(100vw / 9);
  --neg-diagonal: calc(calc(100vw / -9) - 2px);
  --section-pad:  12.5vw;

  /* brand */
  --primary:       #5E94BF;
  --primary-light: #7faacc;
  --secondary:     #FFB761;
  --secondary-light: #ffc580;

  /* neutrals */
  --black-dark:   #111111;
  --black:        #1D1D1B;
  --black-light:  #555555;
  --warm-black:   #454540;
  --soft-black:   #333333;
  --generic:      #888888;
  --light-gray:   #E5E5E5;
  --lighter-gray: #F5F5F5;
  --white:        #FFFFFF;
  --off-white:    #EFECE2;

  /* btc dark section */
  --btc-dark:     #1f1f1f;
  --btc-mid:      #2d2d2d;
  --btc-light:    #dedede;

  /* status */
  --success:      #91b496;
  --danger:       #f62459;
  --success-mid:  #78bd77;  /* used in compare table header */

  /* spacing */
  --space-xxs: 4px;
  --space-xs:  8px;
  --space-sm:  16px;
  --space-md:  24px;
  --space-lg:  32px;
  --space-xl:  48px;
  --space-2xl: 96px;

  /* typography */
  --font:         'labLight', sans-serif;
  --font-heading: 'labMedium', sans-serif;
  --font-regular: 'labRegular', sans-serif;
  --font-bold:    'labBold', sans-serif;
  --font-size:    16px;
  --font-size-sm: 14px;

  /* easing */
  --ease:        cubic-bezier(.4, 0, .2, 1);
  --ease-bounce: cubic-bezier(.34, 1.56, .64, 1);
  --ease-soft:   cubic-bezier(.45, .05, .55, .95);

  /* shadows */
  --shadow-xs: 0 1px 2px rgba(0,0,0,0.04);
  --shadow-sm: 0 1px 3px rgba(0,0,0,0.05), 0 1px 2px rgba(0,0,0,0.03);
  --shadow-md: 0 4px 12px rgba(0,0,0,0.06);
  --shadow-lg: 0 8px 24px rgba(0,0,0,0.08);

  /* legacy aliases (used by flexboxgrid + original classes) */
  --headerHeight:              var(--header-h);
  --contentWidth:              var(--content-max);
  --heightDifference:          var(--diagonal);
  --negativeHeightDifference:  var(--neg-diagonal);
  --sectionPadding:            var(--section-pad);
  --spaceXXSmall:              var(--space-xxs);
  --spaceXSmall:               var(--space-xs);
  --spaceSmall:                var(--space-sm);
  --spaceMedium:               var(--space-md);
  --spaceLarge:                var(--space-lg);
  --spaceXLarge:               var(--space-xl);
  --spaceXXLarge:              var(--space-2xl);
  --softBlack:                 var(--soft-black);
  --lighterGray:               var(--lighter-gray);
  --lightGray:                 var(--light-gray);
  --defaultFontSize:           var(--font-size);
  --defaultFontSizeSmall:      var(--font-size-sm);
  --btcDarkGray:               var(--btc-dark);
  --btcLightGray:              var(--btc-mid);
  --btcLight:                  var(--btc-light);
}

@media (max-width: 768px) {
  :root {
    --section-pad:  80px;
    --space-lg:     24px;
    --space-xl:     32px;
    --space-2xl:    48px;
    --spaceLarge:   24px;
    --spaceXLarge:  32px;
    --spaceXXLarge: 48px;
  }
}

/* ── fonts ── */
@font-face {
  font-family: 'labLight';
  font-display: swap;
  src: url('../fonts/labLight-400-normal.woff2') format('woff2');
}
@font-face {
  font-family: 'labMedium';
  font-display: swap;
  src: url('../fonts/labMedium-400-normal.woff2') format('woff2');
}
@font-face {
  font-family: 'labRegular';
  font-display: swap;
  src: url('../fonts/labRegular-400-normal.woff2') format('woff2');
}
@font-face {
  font-family: 'labBold';
  font-display: swap;
  src: url('../fonts/labBold-400-normal.woff2') format('woff2');
}

/* ── reset ── */
*, *::before, *::after { box-sizing: border-box; }

html, body {
  background-color: var(--white);
  margin: 0;
  min-height: 100%;
  padding: 0;
  width: 100%;
  word-wrap: break-word;
}

body {
  font-family: var(--font);
  font-size: var(--font-size);
  color: var(--black);
  -webkit-font-smoothing: antialiased;
}

body.lock { overflow: hidden; }

img, svg { max-width: 100%; height: auto; }

a {
  color: var(--primary);
  transition: color 0.2s var(--ease);
}
a:hover { color: var(--black); }

p { margin: 0 0 var(--space-sm); line-height: 1.6; }
ul { list-style: none; margin: 0; padding: 0; }

/* ── flexbox grid ── */
.container,.container-fluid{margin-right:auto;margin-left:auto}.container-fluid{padding-right:2rem;padding-left:2rem}.row{box-sizing:border-box;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-flex:0;-ms-flex:0 1 auto;flex:0 1 auto;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-ms-flex-wrap:wrap;flex-wrap:wrap}.row.reverse{-webkit-box-orient:horizontal;-webkit-box-direction:reverse;-ms-flex-direction:row-reverse;flex-direction:row-reverse}.col.reverse{-webkit-box-orient:vertical;-webkit-box-direction:reverse;-ms-flex-direction:column-reverse;flex-direction:column-reverse}.col-xs,.col-xs-1,.col-xs-10,.col-xs-11,.col-xs-12,.col-xs-2,.col-xs-3,.col-xs-4,.col-xs-5,.col-xs-6,.col-xs-7,.col-xs-8,.col-xs-9,.col-xs-offset-0,.col-xs-offset-1,.col-xs-offset-10,.col-xs-offset-11,.col-xs-offset-12,.col-xs-offset-2,.col-xs-offset-3,.col-xs-offset-4,.col-xs-offset-5,.col-xs-offset-6,.col-xs-offset-7,.col-xs-offset-8,.col-xs-offset-9{box-sizing:border-box;-webkit-box-flex:0;-ms-flex:0 0 auto;flex:0 0 auto;padding-right:.5rem;padding-left:.5rem}.col-xs{-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;-ms-flex-preferred-size:0;flex-basis:0;max-width:100%}.col-xs-1{-ms-flex-preferred-size:8.33333333%;flex-basis:8.33333333%;max-width:8.33333333%}.col-xs-2{-ms-flex-preferred-size:16.66666667%;flex-basis:16.66666667%;max-width:16.66666667%}.col-xs-3{-ms-flex-preferred-size:25%;flex-basis:25%;max-width:25%}.col-xs-4{-ms-flex-preferred-size:33.33333333%;flex-basis:33.33333333%;max-width:33.33333333%}.col-xs-5{-ms-flex-preferred-size:41.66666667%;flex-basis:41.66666667%;max-width:41.66666667%}.col-xs-6{-ms-flex-preferred-size:50%;flex-basis:50%;max-width:50%}.col-xs-7{-ms-flex-preferred-size:58.33333333%;flex-basis:58.33333333%;max-width:58.33333333%}.col-xs-8{-ms-flex-preferred-size:66.66666667%;flex-basis:66.66666667%;max-width:66.66666667%}.col-xs-9{-ms-flex-preferred-size:75%;flex-basis:75%;max-width:75%}.col-xs-10{-ms-flex-preferred-size:83.33333333%;flex-basis:83.33333333%;max-width:83.33333333%}.col-xs-11{-ms-flex-preferred-size:91.66666667%;flex-basis:91.66666667%;max-width:91.66666667%}.col-xs-12{-ms-flex-preferred-size:100%;flex-basis:100%;max-width:100%}.col-xs-offset-0{margin-left:0}.col-xs-offset-1{margin-left:8.33333333%}.col-xs-offset-2{margin-left:16.66666667%}.col-xs-offset-3{margin-left:25%}.col-xs-offset-4{margin-left:33.33333333%}.col-xs-offset-5{margin-left:41.66666667%}.col-xs-offset-6{margin-left:50%}.col-xs-offset-7{margin-left:58.33333333%}.col-xs-offset-8{margin-left:66.66666667%}.col-xs-offset-9{margin-left:75%}.col-xs-offset-10{margin-left:83.33333333%}.col-xs-offset-11{margin-left:91.66666667%}.start-xs{-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;text-align:start}.center-xs{-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;text-align:center}.end-xs{-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end;text-align:end}.top-xs{-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start}.middle-xs{-webkit-box-align:center;-ms-flex-align:center;align-items:center}.bottom-xs{-webkit-box-align:end;-ms-flex-align:end;align-items:flex-end}.around-xs{-ms-flex-pack:distribute;justify-content:space-around}.between-xs{-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}.first-xs{-webkit-box-ordinal-group:0;-ms-flex-order:-1;order:-1}.last-xs{-webkit-box-ordinal-group:2;-ms-flex-order:1;order:1}@media only screen and (min-width:48em){.container{width:49rem}.col-sm,.col-sm-1,.col-sm-10,.col-sm-11,.col-sm-12,.col-sm-2,.col-sm-3,.col-sm-4,.col-sm-5,.col-sm-6,.col-sm-7,.col-sm-8,.col-sm-9,.col-sm-offset-0,.col-sm-offset-1,.col-sm-offset-10,.col-sm-offset-11,.col-sm-offset-12,.col-sm-offset-2,.col-sm-offset-3,.col-sm-offset-4,.col-sm-offset-5,.col-sm-offset-6,.col-sm-offset-7,.col-sm-offset-8,.col-sm-offset-9{box-sizing:border-box;-webkit-box-flex:0;-ms-flex:0 0 auto;flex:0 0 auto;padding-right:.5rem;padding-left:.5rem}.col-sm{-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;-ms-flex-preferred-size:0;flex-basis:0;max-width:100%}.col-sm-1{-ms-flex-preferred-size:8.33333333%;flex-basis:8.33333333%;max-width:8.33333333%}.col-sm-2{-ms-flex-preferred-size:16.66666667%;flex-basis:16.66666667%;max-width:16.66666667%}.col-sm-3{-ms-flex-preferred-size:25%;flex-basis:25%;max-width:25%}.col-sm-4{-ms-flex-preferred-size:33.33333333%;flex-basis:33.33333333%;max-width:33.33333333%}.col-sm-5{-ms-flex-preferred-size:41.66666667%;flex-basis:41.66666667%;max-width:41.66666667%}.col-sm-6{-ms-flex-preferred-size:50%;flex-basis:50%;max-width:50%}.col-sm-7{-ms-flex-preferred-size:58.33333333%;flex-basis:58.33333333%;max-width:58.33333333%}.col-sm-8{-ms-flex-preferred-size:66.66666667%;flex-basis:66.66666667%;max-width:66.66666667%}.col-sm-9{-ms-flex-preferred-size:75%;flex-basis:75%;max-width:75%}.col-sm-10{-ms-flex-preferred-size:83.33333333%;flex-basis:83.33333333%;max-width:83.33333333%}.col-sm-11{-ms-flex-preferred-size:91.66666667%;flex-basis:91.66666667%;max-width:91.66666667%}.col-sm-12{-ms-flex-preferred-size:100%;flex-basis:100%;max-width:100%}.col-sm-offset-0{margin-left:0}.col-sm-offset-1{margin-left:8.33333333%}.col-sm-offset-2{margin-left:16.66666667%}.col-sm-offset-3{margin-left:25%}.col-sm-offset-4{margin-left:33.33333333%}.col-sm-offset-5{margin-left:41.66666667%}.col-sm-offset-6{margin-left:50%}.col-sm-offset-7{margin-left:58.33333333%}.col-sm-offset-8{margin-left:66.66666667%}.col-sm-offset-9{margin-left:75%}.col-sm-offset-10{margin-left:83.33333333%}.col-sm-offset-11{margin-left:91.66666667%}.start-sm{justify-content:flex-start;text-align:start}.center-sm{justify-content:center;text-align:center}.end-sm{justify-content:flex-end;text-align:end}.top-sm{align-items:flex-start}.middle-sm{align-items:center}.bottom-sm{align-items:flex-end}.around-sm{justify-content:space-around}.between-sm{justify-content:space-between}.first-sm{order:-1}.last-sm{order:1}}@media only screen and (min-width:64em){.container{width:65rem}.col-md,.col-md-1,.col-md-10,.col-md-11,.col-md-12,.col-md-2,.col-md-3,.col-md-4,.col-md-5,.col-md-6,.col-md-7,.col-md-8,.col-md-9,.col-md-offset-0,.col-md-offset-1,.col-md-offset-10,.col-md-offset-11,.col-md-offset-12,.col-md-offset-2,.col-md-offset-3,.col-md-offset-4,.col-md-offset-5,.col-md-offset-6,.col-md-offset-7,.col-md-offset-8,.col-md-offset-9{box-sizing:border-box;-webkit-box-flex:0;-ms-flex:0 0 auto;flex:0 0 auto;padding-right:.5rem;padding-left:.5rem}.col-md{flex-grow:1;flex-basis:0;max-width:100%}.col-md-1{flex-basis:8.33333333%;max-width:8.33333333%}.col-md-2{flex-basis:16.66666667%;max-width:16.66666667%}.col-md-3{flex-basis:25%;max-width:25%}.col-md-4{flex-basis:33.33333333%;max-width:33.33333333%}.col-md-5{flex-basis:41.66666667%;max-width:41.66666667%}.col-md-6{flex-basis:50%;max-width:50%}.col-md-7{flex-basis:58.33333333%;max-width:58.33333333%}.col-md-8{flex-basis:66.66666667%;max-width:66.66666667%}.col-md-9{flex-basis:75%;max-width:75%}.col-md-10{flex-basis:83.33333333%;max-width:83.33333333%}.col-md-11{flex-basis:91.66666667%;max-width:91.66666667%}.col-md-12{flex-basis:100%;max-width:100%}.col-md-offset-0{margin-left:0}.col-md-offset-1{margin-left:8.33333333%}.col-md-offset-2{margin-left:16.66666667%}.col-md-offset-3{margin-left:25%}.col-md-offset-4{margin-left:33.33333333%}.col-md-offset-5{margin-left:41.66666667%}.col-md-offset-6{margin-left:50%}.col-md-offset-7{margin-left:58.33333333%}.col-md-offset-8{margin-left:66.66666667%}.col-md-offset-9{margin-left:75%}.col-md-offset-10{margin-left:83.33333333%}.col-md-offset-11{margin-left:91.66666667%}.start-md{justify-content:flex-start;text-align:start}.center-md{justify-content:center;text-align:center}.end-md{justify-content:flex-end;text-align:end}.top-md{align-items:flex-start}.middle-md{align-items:center}.bottom-md{align-items:flex-end}.around-md{justify-content:space-around}.between-md{justify-content:space-between}.first-md{order:-1}.last-md{order:1}}@media only screen and (min-width:75em){.container{width:76rem}.col-lg,.col-lg-1,.col-lg-10,.col-lg-11,.col-lg-12,.col-lg-2,.col-lg-3,.col-lg-4,.col-lg-5,.col-lg-6,.col-lg-7,.col-lg-8,.col-lg-9,.col-lg-offset-0,.col-lg-offset-1,.col-lg-offset-10,.col-lg-offset-11,.col-lg-offset-12,.col-lg-offset-2,.col-lg-offset-3,.col-lg-offset-4,.col-lg-offset-5,.col-lg-offset-6,.col-lg-offset-7,.col-lg-offset-8,.col-lg-offset-9{box-sizing:border-box;flex:0 0 auto;padding-right:.5rem;padding-left:.5rem}.col-lg{flex-grow:1;flex-basis:0;max-width:100%}.col-lg-1{flex-basis:8.33333333%;max-width:8.33333333%}.col-lg-2{flex-basis:16.66666667%;max-width:16.66666667%}.col-lg-3{flex-basis:25%;max-width:25%}.col-lg-4{flex-basis:33.33333333%;max-width:33.33333333%}.col-lg-5{flex-basis:41.66666667%;max-width:41.66666667%}.col-lg-6{flex-basis:50%;max-width:50%}.col-lg-7{flex-basis:58.33333333%;max-width:58.33333333%}.col-lg-8{flex-basis:66.66666667%;max-width:66.66666667%}.col-lg-9{flex-basis:75%;max-width:75%}.col-lg-10{flex-basis:83.33333333%;max-width:83.33333333%}.col-lg-11{flex-basis:91.66666667%;max-width:91.66666667%}.col-lg-12{flex-basis:100%;max-width:100%}.col-lg-offset-0{margin-left:0}.start-lg{justify-content:flex-start;text-align:start}.center-lg{justify-content:center;text-align:center}.end-lg{justify-content:flex-end;text-align:end}.top-lg{align-items:flex-start}.middle-lg{align-items:center}.bottom-lg{align-items:flex-end}.around-lg{justify-content:space-around}.between-lg{justify-content:space-between}.first-lg{order:-1}.last-lg{order:1}}

.row[hidden] { display: none; }
.row-fullscreen { align-items: center; min-height: 75vh; }

/* ── typography ── */
h1, h2, h3, h4, h5, h6,
.heading-1, .heading-2, .heading-3, .heading-4 {
  font-family: var(--font-heading);
  font-weight: normal;
  line-height: 1.3;
  margin: 0 0 var(--space-md);
}

h1, .heading-1 { font-size: clamp(28px, 4vw, 42px); }
h2, .heading-2 { font-size: clamp(22px, 3vw, 32px); }
h3, .heading-3 { font-size: clamp(18px, 2vw, 22px); }
h4, .heading-4 { font-size: clamp(16px, 1.5vw, 18px); }

.title {
  font-family: var(--font-heading);
  font-size: clamp(32px, 5vw, 56px);
  line-height: 1.15;
  margin-bottom: var(--space-md);
}

.info-lead {
  font-size: clamp(18px, 2vw, 22px);
  line-height: 1.5;
}

.info {
  font-size: var(--font-size);
  line-height: 1.7;
}

.meta {
  font-size: var(--font-size-sm);
  color: var(--generic);
}

.lab-bold   { font-family: var(--font-bold); }
.lab-medium { font-family: var(--font-heading); }
.lab-light  { font-family: var(--font); }

/* ── utility ── */
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0,0,0,0);
  white-space: nowrap;
  border: 0;
}

.text-center  { text-align: center; }
.text-right   { text-align: right; }
.text-left    { text-align: left; }

.white        { color: var(--white); }
.primary      { color: var(--primary); }

.relative     { position: relative; }

.flex         { display: flex; }
.inline-flex  { display: inline-flex; }
.flex-row     { flex-direction: row; }
.flex-column  { flex-direction: column; }
.flex-items-center { align-items: center; }
.flex-items-top    { align-items: flex-start; }
.flex-between { justify-content: space-between; }

.mobile-justify-center { display: flex; justify-content: center; }

.desktop-text-center { text-align: left; }

/* margin utilities */
.m-top-none    { margin-top: 0 !important; }
.m-top-xsmall  { margin-top: var(--space-xs) !important; }
.m-top         { margin-top: var(--space-sm) !important; }
.m-top-medium  { margin-top: var(--space-md) !important; }
.m-top-large   { margin-top: var(--space-lg) !important; }
.m-top-xlarge  { margin-top: var(--space-xl) !important; }
.m-top-xxlarge { margin-top: var(--space-2xl) !important; }

.m-right-none   { margin-right: 0 !important; }
.m-right        { margin-right: var(--space-sm) !important; }
.m-right-medium { margin-right: var(--space-md) !important; }
.m-right-large  { margin-right: var(--space-lg) !important; }

.m-bottom-none   { margin-bottom: 0 !important; }
.m-bottom        { margin-bottom: var(--space-sm) !important; }
.m-bottom-medium { margin-bottom: var(--space-md) !important; }
.m-bottom-large  { margin-bottom: var(--space-lg) !important; }
.m-bottom-xlarge { margin-bottom: var(--space-xl) !important; }
.m-bottom-xxlarge{ margin-bottom: var(--space-2xl) !important; }

.m-left-none   { margin-left: 0 !important; }
.m-left-xsmall { margin-left: var(--space-xs) !important; }
.m-left        { margin-left: var(--space-sm) !important; }
.m-left-medium { margin-left: var(--space-md) !important; }

.p-left-none   { padding-left: 0 !important; }
.p-right-none  { padding-right: 0 !important; }

/* width helpers */
.width-60  { width: 60%; }
.width-80  { width: 80%; }
.width-100 { width: 100% !important; }

/* inline list */
.inline {
  margin: 0 calc(var(--space-xs) * -1) calc(var(--space-xs) * -1) 0;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}
.inline > * { margin: 0 var(--space-xs) var(--space-xs) 0; }

ul.inline li { margin: 0 var(--space-xl) var(--space-sm) 0; }

/* move-left: subtle image shift on large screens */
.move-left { margin-left: -5%; }

/* ── clip-path shapes ── */
.rightup {
  clip-path: polygon(0 var(--diagonal), 100% 0, 100% calc(100% - var(--diagonal)), 0 100%);
  -webkit-clip-path: polygon(0 var(--diagonal), 100% 0, 100% calc(100% - var(--diagonal)), 0 100%);
  margin-top: var(--neg-diagonal);
}

.rightdown {
  clip-path: polygon(0 var(--diagonal), 100% 0, 100% 100%, 0 calc(100% - var(--diagonal)));
  -webkit-clip-path: polygon(0 var(--diagonal), 100% 0, 100% 100%, 0 calc(100% - var(--diagonal)));
}

.leftup {
  clip-path: polygon(0 0, 100% var(--diagonal), 100% 100%, 0 calc(100% - var(--diagonal)));
  -webkit-clip-path: polygon(0 0, 100% var(--diagonal), 100% 100%, 0 calc(100% - var(--diagonal)));
  margin-top: var(--neg-diagonal);
}

.leftdown {
  clip-path: polygon(0 0, 100% var(--diagonal), 100% calc(100% - var(--diagonal)), 0 100%);
  -webkit-clip-path: polygon(0 0, 100% var(--diagonal), 100% calc(100% - var(--diagonal)), 0 100%);
}

.rightup.bottomFlat {
  clip-path: polygon(0 var(--diagonal), 100% 0, 100% 100%, 0 100%);
  -webkit-clip-path: polygon(0 var(--diagonal), 100% 0, 100% 100%, 0 100%);
}

.leftup.bottomFlat {
  clip-path: polygon(0 0, 100% var(--diagonal), 100% 100%, 0 100%);
  -webkit-clip-path: polygon(0 0, 100% var(--diagonal), 100% 100%, 0 100%);
}

.rightup.topFlat {
  clip-path: polygon(0 0, 100% 0, 100% calc(100% - var(--diagonal)), 0 100%);
  -webkit-clip-path: polygon(0 0, 100% 0, 100% calc(100% - var(--diagonal)), 0 100%);
  margin-top: 0;
}

.topFlat.p-none { padding-top: 0 !important; }

/* ── nav ── */
.nav-container {
  position: sticky;
  top: 0;
  z-index: 20;
  width: 100%;
  background-color: var(--white);
  transition: box-shadow 0.2s var(--ease);
}

.nav-container.is-scrolled {
  box-shadow: 0 1px 3px rgba(0,0,0,0.12);
}

.nav-content {
  height: var(--header-h);
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  max-width: var(--content-max);
  margin: 0 auto;
  padding: 0 var(--space-md);
}

.logo {
  width: 72px;
  height: 100%;
  padding: 0.3em;
  display: flex;
  align-items: center;
  flex-shrink: 0;
}

.logo a { color: var(--black); display: flex; align-items: center; }
.logo svg { width: 40px; height: 40px; fill: currentColor; }

.nav-menu,
.cart-menu {
  margin: 0;
  padding: 0;
  list-style: none;
}

.nav-menu { flex-grow: 1; }

.nav-menu > li,
.cart-menu > li {
  display: inline-block;
  margin: 0;
  padding: 0;
}

.nav-menu a,
.cart-menu a {
  color: var(--black-light);
  display: inline-block;
  font-family: var(--font-regular);
  line-height: var(--header-h);
  padding: 0 var(--space-xs);
  text-decoration: none;
  transition: color 0.2s var(--ease);
}

.nav-menu a:hover,
.cart-menu a:hover { color: var(--black); }

.cart-menu { margin-right: 16px; }

.nav-dropdown { position: relative; }

.nav-dropdown > input[type="checkbox"] { display: none; }
.nav-dropdown > input[type="checkbox"]:checked ~ .nav-dropdown-content { display: block; }

.nav-dropdown-toggle {
  background: none;
  border: none;
  color: var(--black-light);
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 4px;
  font-family: var(--font-regular);
  font-size: var(--font-size);
  line-height: var(--header-h);
  padding: 0 var(--space-xs);
}

.nav-dropdown-toggle svg { vertical-align: middle; }

.nav-dropdown-content {
  background: var(--white);
  border: 1px solid var(--light-gray);
  border-radius: 4px;
  box-shadow: var(--shadow-md);
  display: none;
  min-width: 140px;
  position: absolute;
  right: 0;
  top: 100%;
  z-index: 2;
}

.nav-dropdown-content ul { padding: var(--space-xs) 0; }
.nav-dropdown-content ul li { margin: 0; }
.cart-menu .nav-dropdown-content a {
  display: block;
  line-height: 2.2;
  padding: 0 var(--space-lg);
  color: var(--black);
}

/* mobile menu toggle */
.mobile-icon {
  display: none;
  background: none;
  border: none;
  cursor: pointer;
  padding: 8px;
  margin-right: 8px;
  color: var(--black);
}

.hamburger {
  display: block;
  width: 24px;
  height: 2px;
  background: currentColor;
  position: relative;
  transition: background 0.2s var(--ease);
}
.hamburger::before, .hamburger::after {
  content: '';
  position: absolute;
  left: 0;
  width: 100%;
  height: 2px;
  background: currentColor;
  transition: transform 0.2s var(--ease), top 0.2s var(--ease);
}
.hamburger::before { top: -7px; }
.hamburger::after  { top: 7px; }

.mobile-icon.is-open .hamburger { background: transparent; }
.mobile-icon.is-open .hamburger::before { top: 0; transform: rotate(45deg); }
.mobile-icon.is-open .hamburger::after  { top: 0; transform: rotate(-45deg); }

.mobile-container {
  display: none;
  position: fixed;
  top: var(--header-h);
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0,0,0,0.5);
  z-index: 30;
  padding: var(--space-sm);
  overflow-y: auto;
}

.mobile-container.is-open { display: block; }

.mobile-menu {
  background: var(--white);
  border-radius: 4px;
  padding: var(--space-md) 0;
  list-style: none;
  margin: 0;
}

.mobile-menu > li {
  margin: 0 var(--space-sm);
  border-bottom: 1px solid var(--lighter-gray);
}
.mobile-menu > li:last-child { border-bottom: none; }

.mobile-menu a {
  color: var(--black);
  display: block;
  font-family: var(--font-regular);
  font-size: var(--font-size);
  padding: var(--space-sm) 12px;
  text-decoration: none;
}

.mobile-menu a:hover { color: var(--primary); }

/* ── hero ── */
.hero {
  position: relative;
  min-height: 600px;
  height: 90vh;
  overflow: hidden;
  background: linear-gradient(180deg, #F5F5F5, #FCFCFC, #F5F5F5) center / cover no-repeat;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
}

.device-hero-bg {
  background:
    linear-gradient(to bottom, rgba(0,0,0,0.75) 0%, rgba(0,0,0,0.45) 30%, rgba(0,0,0,0.1) 60%, rgba(0,0,0,0) 100%),
    url('../assets/hero-desktop-nova-macbook.jpg') center 55% / cover no-repeat;
  background-color: #111;
  align-items: flex-start;
}

.hero-content { position: relative; z-index: 1; }

.hero-content-top-center {
  display: flex;
  flex-direction: column;
  align-items: center;
  height: 90%;
  padding-top: clamp(60px, 8vw, 100px);
  text-align: center;
  max-width: var(--content-max);
  padding-left: var(--space-md);
  padding-right: var(--space-md);
}

.device-hero-bg .title.onHero {
  margin-top: 0;
  text-align: center;
  padding-left: 10px;
  padding-right: 10px;
  text-shadow: 0 2px 20px rgba(0,0,0,0.4);
}

.device-hero-bg .hero-cta-wrap {
  margin-top: auto;
  margin-bottom: clamp(40px, 6vw, 80px);
}

.hero-title-mobile { display: none; }
.hero-title-desktop { display: inline; }

/* ── buttons ── */
.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-xs);
  font-family: var(--font-regular);
  font-size: 16px;
  line-height: 1;
  padding: 14px 24px;
  border-radius: 4px;
  text-decoration: none;
  cursor: pointer;
  border: none;
  transition: background-color 0.2s var(--ease), color 0.2s var(--ease), box-shadow 0.2s var(--ease), transform 0.2s var(--ease);
  white-space: nowrap;
}

.button.primary {
  background-color: var(--primary);
  color: var(--white);
}
.button.primary:hover {
  background-color: #4a7fa8;
  color: var(--white);
  box-shadow: var(--shadow-sm);
  transform: translateY(-2px);
}

.button.secondary {
  background-color: transparent;
  color: var(--primary);
  border: 2px solid var(--primary);
}
.button.secondary:hover {
  background-color: var(--primary);
  color: var(--white);
  transform: translateY(-2px);
}

.button.quaternary {
  background-color: var(--white);
  color: var(--black);
}
.button.quaternary:hover {
  background-color: var(--lighter-gray);
  color: var(--black);
  transform: translateY(-2px);
}

.button.btc-button {
  background-color: var(--secondary);
  color: var(--black);
}
.button.btc-button:hover {
  background-color: var(--secondary-light);
  color: var(--black);
  transform: translateY(-2px);
  box-shadow: var(--shadow-sm);
}

.button.shadow { box-shadow: var(--shadow-md); }

.button:focus-visible {
  outline: 2px solid var(--primary);
  outline-offset: 2px;
}

/* ── sections ── */
.with-space {
  padding-top: var(--section-pad);
  padding-bottom: var(--section-pad);
}

.content-width {
  margin: 0 auto;
  max-width: var(--content-max);
  width: 100%;
  padding-left: var(--space-md);
  padding-right: var(--space-md);
}

/* ── backgrounds ── */
.bg-gray { background-color: var(--lighter-gray); }

.bg-dark {
  background-color: var(--black);
  color: var(--white);
}

/* ── editions ── */
.bg-yinyang {
  display: flex;
  flex-direction: column;
}

.yin-heading {
  text-align: center;
}

.bg-yang,
.bg-btcdark {
  background-color: var(--btc-dark);
  color: var(--btc-light);
  display: flex;
  flex-direction: column;
  text-align: right;
}

.yang-spacer {
  display: none;
}

.multi {
  color: var(--primary);
  text-decoration: none;
}

.btc-only {
  color: var(--secondary);
  text-decoration: none;
}

.bg-btcdark a {
  color: var(--btc-light);
}

.bg-btcdark .btc-only,
.bg-yang .btc-only {
  color: var(--secondary);
}

.bg-btcdark a:hover,
.bg-yang a:hover {
  color: var(--secondary);
}

.edition-card {
  min-height: 300px;
}

/* ── retailers ── */
.retailer-logo {
  max-height: 60px;
  width: auto;
  max-width: 180px;
  object-fit: contain;
}

/* newsletter mountains background */
.decorator {
  background-color: #8e8d91;
  background-size: cover;
  background-position: center 75%;
  background-attachment: fixed;
  background-image: url('../assets/mountains_2x.jpg');
  color: var(--white);
}

.h-padding {
  padding-left: var(--space-md) !important;
  padding-right: var(--space-md) !important;
}

/* ── images ── */
.image-gray {
  filter: grayscale(1);
  opacity: 0.6;
  transition: filter 0.4s var(--ease-soft), opacity 0.4s var(--ease-soft);
}
.image-gray:hover {
  filter: grayscale(0);
  opacity: 1;
}

.product-image { width: 100%; height: auto; display: block; }

picture { display: block; }

/* ── feature cards ── */
.feature {
  padding: var(--space-md);
}

/* ── rating stars ── */
.rating {
  color: var(--secondary);
  font-size: 24px;
  letter-spacing: 2px;
  margin-bottom: var(--space-sm);
}

/* ── blockquote / testimonials ── */
blockquote {
  margin: 0;
  font-style: italic;
}

blockquote p { line-height: 1.7; }

blockquote footer {
  font-style: normal;
  color: var(--generic);
  font-size: var(--font-size-sm);
  margin-top: var(--space-xs);
}

blockquote footer cite { font-style: normal; }
blockquote footer a {
  color: var(--primary);
  text-decoration: underline;
}

/* remove WP pseudo-content artifacts */
[data-synthetic] { display: none; }

/* ── trustpilot ── */
.trustpilot-widget { width: 100%; }

/* ── comparison table ── */
.compare-table table {
  color: var(--soft-black);
  width: 100%;
  border-collapse: collapse;
}

.compare-table caption { display: none; }

.compare-table thead th {
  font-family: var(--font-regular);
  font-weight: normal;
  padding: var(--space-sm) var(--space-xs);
  text-align: center;
  vertical-align: bottom;
  background-color: var(--lighter-gray);
}

.compare-table thead strong { display: block; font-family: var(--font-heading); }

.compare-table tbody tr:nth-child(odd)  { background-color: var(--white); }
.compare-table tbody tr:nth-child(even) { background-color: var(--lighter-gray); }

.compare-table td,
.compare-table th {
  padding: var(--space-sm) var(--space-xs);
  text-align: center;
  vertical-align: top;
}

.compare-table tbody th {
  padding-left: var(--space-sm);
  padding-right: 40px;
  text-align: left;
  position: relative;
}

.compare-row-header   { width: 22%; }
.compare-col-bitbox02 { width: 26%; }
.compare-col-ledger   { width: 26%; }
.compare-col-trezor   { width: 26%; }

/* highlighted BitBox column */
.compare-table thead th:nth-child(2) {
  background-color: var(--success-mid);
  color: var(--white);
  font-family: var(--font-heading);
}

.compare-table tbody td:nth-child(2) {
  border-left: 3px solid var(--success-mid);
  border-right: 3px solid var(--success-mid);
}
.compare-table tbody tr:last-child td:nth-child(2) {
  border-bottom: 3px solid var(--success-mid);
}

/* icon SVGs */
.compare-icon-checkmark,
.compare-icon-crossmark,
.compare-icon-almostmark {
  display: block;
  width: 28px;
  height: 28px;
  margin: 0 auto;
  overflow: visible;
  flex-shrink: 0;
}

.compare-icon-info {
  display: inline-block;
  width: 18px;
  height: 18px;
  opacity: 0.5;
  vertical-align: middle;
  margin-left: 4px;
  cursor: pointer;
  transition: opacity 0.2s var(--ease);
}
tr:hover .compare-icon-info { opacity: 1; }

.compare-info {
  overflow: hidden;
  max-height: 0;
  transition: max-height 0.3s var(--ease-soft);
}
.compare-info span {
  display: block;
  padding-top: var(--space-xs);
  font-size: var(--font-size-sm);
  line-height: 1.5;
  text-align: left;
}

.compare-expand .compare-info { max-height: 300px; }

.table-editlog {
  font-size: var(--font-size-sm);
  padding: 0 var(--space-sm);
  color: var(--generic);
  margin-top: var(--space-md);
}

/* ── blog ── */
.blog-teaser-feed {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-lg);
  margin-top: var(--space-xl);
}

.post-card {
  flex: 1 1 280px;
  max-width: 380px;
  display: flex;
  flex-direction: column;
  border-radius: 6px;
  overflow: hidden;
  box-shadow: var(--shadow-sm);
  transition: box-shadow 0.25s var(--ease-soft), transform 0.25s var(--ease-soft);
}

.post-card:hover {
  box-shadow: var(--shadow-md);
  transform: translateY(-3px);
}

.post-card-image-link { display: block; overflow: hidden; aspect-ratio: 16/9; }
.post-card-image { width: 100%; height: 100%; object-fit: cover; display: block; }

.post-card-content {
  padding: var(--space-md);
  display: flex;
  flex-direction: column;
  flex: 1;
}

.post-card-header { margin-bottom: var(--space-xs); }

.post-card-content-link { text-decoration: none; }
.post-card-title {
  font-family: var(--font-heading);
  font-size: var(--font-size);
  color: var(--black);
  margin: 0 0 var(--space-xs);
  line-height: 1.4;
  transition: color 0.2s var(--ease);
}
.post-card-content-link:hover .post-card-title { color: var(--primary); }

.post-card-excerpt p { font-size: var(--font-size-sm); color: var(--generic); margin: 0; line-height: 1.6; }

.post-card-read-more {
  display: none; /* replaced by card click area */
}

/* ── partners ── */
.partner-card {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: var(--space-md);
}

/* ── payment icons ── */
.payment-icon {
  display: inline-block;
  margin: 0 var(--space-xs) var(--space-xs) 0;
}

.payment-icon img {
  height: 24px;
  width: auto;
  vertical-align: middle;
  opacity: 0.7;
  transition: opacity 0.2s var(--ease);
}
.payment-icon img:hover { opacity: 1; }

/* ── footer ── */
.footer {
  background-color: var(--warm-black);
  color: var(--off-white);
}

.footer a {
  color: var(--off-white);
  opacity: 0.8;
  transition: opacity 0.2s var(--ease);
}
.footer a:hover { color: var(--white); opacity: 1; }

.footer-logo { height: 60px; width: auto; }

.footer .meta { color: rgba(239,236,226,0.5); }

.footer-subnav {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-xs);
  margin-bottom: var(--space-md);
}

.footer-label {
  font-family: var(--font-heading);
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  opacity: 0.6;
  margin-bottom: var(--space-xs);
}

.footer ul li { margin-bottom: var(--space-xs); }
.footer ul a { font-size: var(--font-size-sm); }

.footer .inline > a {
  color: rgba(239,236,226,0.7);
  transition: color 0.2s var(--ease);
}
.footer .inline > a:hover { color: var(--white); }

.footer .inline svg { fill: currentColor; }

.footer-inline-icon {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.footer-inline-icon svg {
  width: 18px;
  height: 18px;
  stroke: currentColor;
  fill: none;
}

.rss-button svg { width: 18px; height: 18px; fill: currentColor; }

/* ── yin-yang desktop layout ── */
@media (min-width: 769px) {
  .bg-yinyang { flex-direction: row; }
  .bg-yin, .bg-yang { flex: 0 0 50%; }
  .bg-yin {
    padding-left: max(calc(50% - calc(var(--content-max) * .5)), 0px);
  }
  .bg-yang,
  .bg-btcdark {
    padding-right: max(calc(50% - calc(var(--content-max) * .5)), 0px);
  }
  .yin-heading {
    padding-right: .15em;
    position: relative;
    text-align: right;
  }
  .yang-heading {
    color: var(--btc-light);
    margin-right: -100%;
    padding-left: .2em;
    position: absolute;
    right: 0;
    text-align: left;
    width: 100%;
  }
  .yang-spacer { display: block; }
  .yang-spacer::before { content: "\00a0"; }
  .desktop-text-center { text-align: center; }

  .compare-table thead th {
    position: sticky;
    top: 0;
    z-index: 1;
  }
  .compare-table td, .compare-table th { line-height: 26px; }
}

/* ── animations ── */
.reveal {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.5s var(--ease-soft), transform 0.5s var(--ease-soft);
}

.reveal.is-visible {
  opacity: 1;
  transform: none;
}

/* stagger — 100ms steps */
.reveal-stagger-1 { transition-delay: 0s; }
.reveal-stagger-2 { transition-delay: 0.1s; }
.reveal-stagger-3 { transition-delay: 0.2s; }

/* ── responsive — mobile ── */
@media (max-width: 768px) {
  .hero { height: auto; min-height: 480px; }
  .hero-content-top-center { padding-top: var(--space-2xl); height: auto; min-height: 400px; }

  .nav-menu, .cart-menu { display: none; }
  .mobile-icon { display: block; }

  .mobile-justify-center { flex-direction: column; align-items: center; }

  .hero-title-mobile { display: inline; }
  .hero-title-desktop { display: none; }

  .row-xs-reverse { flex-direction: column-reverse; }

  .m-bottom-large-on-small { margin-bottom: var(--space-lg) !important; }
  .m-bottom-xlarge-on-small { margin-bottom: var(--space-xl) !important; }
  .m-bottom-xxlarge-on-small { margin-bottom: var(--space-2xl) !important; }

  .desktop { display: none !important; }

  .blog-teaser-feed { flex-direction: column; }
  .post-card { max-width: 100%; }

  .compare-table table,
  .compare-table caption,
  .compare-table tbody,
  .compare-table tr { display: block; }
  .compare-table thead { display: none; }
  .compare-table tr { padding: var(--space-sm) 0; border-bottom: 1px solid var(--light-gray); }
  .compare-table td,
  .compare-table th {
    display: flex;
    align-items: center;
    padding: 6px var(--space-sm);
    text-align: left;
  }
  .compare-table td > .compare-icon-checkmark,
  .compare-table td > .compare-icon-crossmark,
  .compare-table td > .compare-icon-almostmark {
    flex: 0 0 28px;
    margin: 0 var(--space-sm) 0 0;
  }
  .compare-info {
    flex: 1;
    max-height: none;
  }
  .compare-info span { display: block; padding-top: 0; }
  .compare-icon-info { display: none; }
  .compare-table td:nth-child(2) .compare-info::before { content: "BitBox02 Nova"; display: block; font-family: var(--font-heading); font-size: 11px; }
  .compare-table td:nth-child(3) .compare-info::before { content: "Ledger Nano X"; display: block; font-family: var(--font-heading); font-size: 11px; }
  .compare-table td:nth-child(4) .compare-info::before { content: "Trezor Safe 5"; display: block; font-family: var(--font-heading); font-size: 11px; }

  .compare-table tbody td:nth-child(2) {
    border-left: none;
    border-right: none;
    background-color: rgba(120, 189, 119, 0.08);
  }
  .compare-table tbody tr:last-child td:nth-child(2) { border-bottom: none; }

  .decorator { background-attachment: scroll; }

  .footer-subnav { justify-content: center; }
}

/* ── reduced-motion ── */
@media (prefers-reduced-motion: reduce) {
  .reveal {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
  .image-gray,
  .post-card,
  .button,
  a { transition: none !important; }
}

/* ── print ── */
@media print {
  .nav-container, .mobile-container, .mobile-icon { display: none; }
  .hero { height: auto; min-height: 0; }
  .decorator { background-image: none; background-color: #eee; }
  a[href]::after { content: " (" attr(href) ")"; font-size: 10px; }
}
