:root{
  --ink:#201a16;
  --muted:#6f655c;
  --paper:#f6f1e8;
  --paper2:#fffdf8;
  --brown:#4b3326;
  --brown2:#2d211b;
  --amber:#c78a35;
  --amber2:#e3b76e;
  --green:#2e6d55;
  --red:#8a3d32;
  --line:#d9cdbf;
  --shadow:0 14px 38px rgba(32,26,22,.10);
  --radius:18px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  color:var(--ink);
  background:var(--paper);
  font:16px/1.6 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}
img{max-width:100%;display:block}
a{color:inherit}
h1,h2,h3{
  font-family:"Trebuchet MS",Trebuchet,Arial,sans-serif;
  line-height:1.12;
  margin:0 0 .55em;
}

/* Intentional Tahoma exceptions */
.hero h2,
.module-card-heading h3,
details.current-module-specs h3{
  font-family:Tahoma,Verdana,"Segoe UI",sans-serif;
}
h1{font-size:clamp(2.5rem,6vw,5.2rem);letter-spacing:-.035em}
h2{font-size:clamp(2rem,4vw,3.4rem);letter-spacing:-.025em}
h3{font-size:1.35rem}
p{margin:.4em 0 1em}
small{font-size:.88rem;color:var(--muted)}
.wrap{width:min(1160px,calc(100% - 40px));margin:auto}
.kicker{
  text-transform:uppercase;
  letter-spacing:.14em;
  font-size:.78rem;
  font-weight:800;
  color:var(--amber);
}
.hero h1.kicker{
  font-family:inherit;
  line-height:1.6;
  margin:0;
}
.top{
  background:#171310;
  color:#eee7dc;
  font-size:.9rem;
}
.top .wrap{
  min-height:42px;
  padding-right:105px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
}
.top a{color:#fff;text-decoration:none}
.language-tags{
  position:fixed;
  top:7px;
  right:10px;
  z-index:100;
  display:flex;
  gap:5px;
}
.language-tag{
  display:inline-flex;
  align-items:center;
  gap:4px;
  min-height:28px;
  padding:3px 8px;
  border:1px solid rgba(255,255,255,.28);
  border-radius:999px;
  background:rgba(23,19,16,.92);
  color:#f7f0e6;
  text-decoration:none;
  font-size:.72rem;
  font-weight:850;
  letter-spacing:.03em;
  box-shadow:0 2px 8px rgba(0,0,0,.16);
}
.language-tag:hover{
  background:#2d211b;
  border-color:rgba(255,255,255,.5);
}
.language-tag.active{
  background:var(--amber);
  border-color:var(--amber2);
  color:#1d160f;
}
.site-nav{
  position:sticky;
  top:0;
  z-index:50;
  background:rgba(246,241,232,.93);
  backdrop-filter:blur(14px);
  border-bottom:1px solid rgba(75,51,38,.12);
}
.nav-inner{
  min-height:70px;
  padding-right:105px;
  display:flex;
  align-items:center;
  gap:24px;
}
.brand{
  font-family:Tahoma,Verdana,"Segoe UI",sans-serif;
  font-size:2rem;
  font-weight:1000;
  text-decoration:none;
  margin-right:auto;
}
.menu{
  display:flex;
  align-items:center;
  gap:4px;
  list-style:none;
  padding:0;
  margin:0;
}
.menu a,.menu summary{
  display:block;
  padding:10px 12px;
  border-radius:999px;
  text-decoration:none;
  font-weight:650;
  font-size:.94rem;
  cursor:pointer;
}
.menu a:hover,.menu summary:hover{background:#eadfce}
.menu details{position:relative}
.menu details>summary{list-style:none}
.menu details>summary::-webkit-details-marker{display:none}
.mobile-toggle{display:none}

.hero{
  color:#fff;
  min-height:620px;
  display:grid;
  align-items:end;
  position:relative;
  background:
    linear-gradient(90deg,rgba(20,14,11,.88) 0%,rgba(20,14,11,.63) 48%,rgba(20,14,11,.28) 100%),
    url("https://upload.wikimedia.org/wikipedia/commons/e/e7/Tube_radio_dial.jpg") center/cover no-repeat;
}
.hero:after{
  content:"";
  position:absolute;
  inset:auto 0 0;
  height:130px;
  background:linear-gradient(transparent,var(--paper));
}
.hero-content{
  position:relative;
  z-index:2;
  padding:110px 0 145px;
  max-width:800px;
}
.hero .lead{
  font-size:clamp(1.15rem,2.1vw,1.5rem);
  max-width:710px;
  color:#f5eee4;
}
.hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:48px;
  padding:0 20px;
  border-radius:999px;
  text-decoration:none;
  font-weight:800;
  border:1px solid transparent;
}
.btn.primary{background:var(--amber);color:#1d160f}
.btn.ghost{border-color:rgba(255,255,255,.55);color:#fff;background:rgba(255,255,255,.07)}
.btn.dark{background:var(--brown);color:white}
.hero-points{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:24px;
}
.hero-points span{
  border:1px solid rgba(255,255,255,.28);
  background:rgba(10,8,6,.25);
  padding:7px 11px;
  border-radius:999px;
  font-size:.9rem;
}

.section{padding:86px 0}
.section.white{background:var(--paper2)}
.section-head{margin-bottom:34px}
.section-head p{max-width:790px;font-size:1.08rem;color:var(--muted)}

.cards{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:18px;
}
.card{
  background:var(--paper2);
  border:1px solid var(--line);
  border-radius:var(--radius);
  padding:26px;
  box-shadow:0 7px 24px rgba(45,33,27,.06);
}
.card h3{margin-top:0}
.badge{
  display:inline-block;
  border-radius:999px;
  background:#eee4d4;
  color:#5b4637;
  padding:4px 9px;
  font-size:.77rem;
  font-weight:800;
  letter-spacing:.04em;
  text-transform:uppercase;
  margin-bottom:12px;
}
.badge.new{background:#e6efe9;color:var(--green)}
.checks{list-style:none;padding:0;margin:16px 0 0}
.checks li{position:relative;padding-left:1.55em;margin:.55em 0}
.checks li:before{content:"✓";position:absolute;left:0;color:var(--green);font-weight:900}
.price{font-family:"Trebuchet MS",Trebuchet,Arial,sans-serif;font-size:2rem;font-weight:700;margin:.2em 0}

.compare{
  overflow:auto;
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:var(--paper2);
  box-shadow:var(--shadow);
}
table{width:100%;border-collapse:collapse;min-width:760px}
th,td{padding:14px 16px;border-bottom:1px solid #e9dfd2;text-align:left;vertical-align:top}
th{background:#f0e7da;font-size:.9rem}
td:first-child{font-weight:700}
tr:last-child td{border-bottom:0}
.yes{color:var(--green);font-weight:800;text-align:center}
.no{color:#8b8178;text-align:center}
.best{background:#fff7e9}

.compare-wrap{
  position:relative;
}
.compare-scroll-hint{
  position:absolute;
  right:8px;
  top:50%;
  transform:translateY(-50%);
  width:30px;
  height:30px;
  border-radius:50%;
  background:rgba(255,255,255,.9);
  box-shadow:0 2px 8px rgba(0,0,0,.22);
  pointer-events:none;
  z-index:3;
}
.compare-scroll-hint:after{
  content:"";
  position:absolute;
  left:11px;
  top:8px;
  width:0;
  height:0;
  border-top:7px solid transparent;
  border-bottom:7px solid transparent;
  border-left:10px solid #111;
}
.compare-scroll-hint[hidden]{
  display:none!important;
}

.radio-carousel{
  position:relative;
  overflow:hidden;
  width:100%;
  margin:0 0 34px;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 3%,#000 97%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 3%,#000 97%,transparent);
}
.radio-carousel-track{
  display:flex;
  width:max-content;
  will-change:transform;
  animation:radio-carousel-scroll var(--carousel-duration,36s) linear infinite;
}
.radio-carousel:hover .radio-carousel-track{
  animation-play-state:paused;
}
.radio-carousel-group{
  display:flex;
  align-items:center;
  flex:0 0 auto;
  gap:14px;
  padding-right:14px;
}
.radio-carousel img{
  display:block;
  flex:0 0 auto;
  width:auto;
  height:100px;
  max-width:none;
  object-fit:contain;
  border-radius:8px;
  box-shadow:0 4px 12px rgba(45,33,27,.10);
}
@keyframes radio-carousel-scroll{
  to{transform:translateX(-50%)}
}
@media (prefers-reduced-motion:reduce){
  .radio-carousel{
    overflow-x:auto;
    -webkit-mask-image:none;
    mask-image:none;
  }
  .radio-carousel-track{
    animation:none;
    transform:none;
  }
  .radio-carousel-group[aria-hidden="true"]{
    display:none;
  }
}

.am-saver-figures{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;
  margin:18px 0;
}
.am-saver-figures figure{
  margin:0;
  background:#fff;
  border:1px solid var(--line);
  padding:10px;
  border-radius:12px;
}
.am-saver-figures img{
  display:block;
  width:70%;
  max-width:70%;
  height:auto;
  margin:0 auto;
  border-radius:10px;
}
.am-saver-figures figcaption{
  font-size:.82rem;
  color:var(--muted);
  margin-top:7px;
  text-align:center;
}

.callout{
  border-left:5px solid var(--amber);
  background:#fff8ea;
  padding:18px 20px;
  border-radius:0 12px 12px 0;
  margin:24px 0;
}
.callout strong{display:block;margin-bottom:4px}

.photo-band{
  min-height:400px;
  display:grid;
  align-items:center;
  color:#fff;
  background:
    linear-gradient(90deg,rgba(28,20,16,.84),rgba(28,20,16,.42)),
    url("https://upload.wikimedia.org/wikipedia/commons/7/79/Chassis_of_Vacuum_Tube_Radio.JPG") center/cover no-repeat;
}
.photo-band .panel{
  max-width:650px;
  background:rgba(30,22,18,.67);
  border:1px solid rgba(255,255,255,.18);
  backdrop-filter:blur(6px);
  padding:30px;
  border-radius:var(--radius);
}


details.tech{
  background:var(--paper2);
  border:1px solid var(--line);
  border-radius:14px;
  margin:12px 0;
  overflow:hidden;
}
details.tech>summary{
  cursor:pointer;
  padding:18px 20px;
  font-family:"Trebuchet MS",Trebuchet,Arial,sans-serif;
  font-weight:800;
  list-style:none;
  display:flex;
  justify-content:space-between;
  gap:12px;
}
details.tech>summary::-webkit-details-marker{display:none}
details.tech>summary:after{content:"＋";color:var(--amber);font-size:1.2rem}
details.tech[open]>summary:after{content:"−"}
.details-body{padding:0 20px 20px;border-top:1px solid #eee3d7}
.details-body h4{margin:1.2em 0 .4em}
.details-body ul{padding-left:1.25em}
.order-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}
.order-grid > .order-card:last-child:nth-child(odd){
  grid-column:1 / -1;
  width:calc((100% - 18px) / 2);
  justify-self:center;
}
.order-card{
  background:#fffaf1;
  color:var(--ink);
  padding:26px;
  border-radius:var(--radius);
}
.order-card-top{
  display:flex;
  align-items:flex-start;
  gap:.9em;
}
.order-card-media{
  flex:0 0 5.5em;
  width:5.5em;
  height:4.5em;
  display:flex;
  align-items:center;
  justify-content:center;
}
.order-card-photo{
  display:block;
  width:auto;
  height:auto;
  max-width:100%;
  max-height:4.5em;
  object-fit:contain;
  border-radius:.4em;
}
.order-card-text{
  min-width:0;
}
.order-card-text h3{
  margin:0 0 .25em;
}
.order-card-text .price{
  margin:.05em 0;
}
.order-card-text p{
  margin:.15em 0 0;
}
.order-card ul{padding-left:1.15em}
.legacy{max-width:900px;margin:auto}
.us-warning-title{
  text-align:center;
  font-size:1.5rem;
  margin:.25em 0 .8em;
}

.footer{
  background:#171310;
  color:#d8cfc5;
  padding:42px 0;
  font-size:.9rem;
}
.footer a{color:#fff}
.footer-grid{
  display:grid;
  grid-template-columns:1.2fr 1fr;
  gap:30px;
}
.credits{font-size:.78rem;color:#a99d91;margin-top:24px}

@media (max-width:900px){
  .cards,.order-grid{grid-template-columns:1fr}
  .menu{display:none}
  .mobile-toggle{display:block;margin-left:auto}
  .mobile-toggle summary{
    list-style:none;
    padding:9px 14px;
    border:1px solid var(--line);
    border-radius:999px;
    font-weight:800;
    cursor:pointer;
  }
  .mobile-toggle[open] .mobile-menu{display:grid}
  .mobile-menu{
    position:absolute;
    left:20px;right:20px;top:64px;
    background:var(--paper2);
    border:1px solid var(--line);
    border-radius:16px;
    box-shadow:var(--shadow);
    padding:10px;
  }
  .mobile-menu a{padding:11px 12px;text-decoration:none;border-radius:10px}
  .mobile-menu a:hover{background:#efe5d6}
}
@media (max-width:620px){
  .wrap{width:min(100% - 26px,1160px)}
  .top .wrap{display:block;padding:8px 100px 8px 0}
  .top .contact-hide{display:none}
  .hero{min-height:570px}
  .hero-content{padding:90px 0 120px}
  .section{padding:64px 0}
  .footer-grid{grid-template-columns:1fr}
}

.tech-copy p{margin:.7em 0}
.tech-copy ul,.tech-copy ol{margin:.7em 0 1.1em;padding-left:1.35em}
.tech-copy li{margin:.45em 0}
.tech-copy strong:first-child{color:var(--brown)}
.path-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.path-card{border:1px solid var(--line);background:var(--paper2);border-radius:var(--radius);padding:24px}
.path-card h3{margin-bottom:.3em}
.recommendation{background:#eef4ef;border-left:5px solid var(--green);padding:18px 20px;border-radius:0 12px 12px 0;margin:18px 0}
.led-step{border:1px solid var(--line);background:var(--paper2);border-radius:14px;padding:18px 20px;margin:12px 0}
.led-step h3{display:flex;align-items:center;gap:10px;margin-bottom:.35em;flex-wrap:wrap}
.led-swatch,.led-inline{display:inline-block;border-radius:50%}
.led-swatch{width:15px;height:15px;flex:0 0 15px;box-shadow:0 0 0 3px rgba(0,0,0,.05)}
.led-inline{width:12px;height:12px;flex:0 0 12px;margin-top:.25em}
.led-swatch.g,.led-inline.led-green{background:#12de61;box-shadow:0 0 10px rgba(18,222,97,.88),0 0 0 2px rgba(0,0,0,.06)}
.led-swatch.b,.led-inline.led-blue{background:#1496ff;box-shadow:0 0 10px rgba(20,150,255,.88),0 0 0 2px rgba(0,0,0,.06)}
.led-swatch.gb{background:linear-gradient(90deg,#12de61 50%,#1496ff 50%);box-shadow:0 0 10px rgba(20,150,255,.35),0 0 10px rgba(18,222,97,.35),0 0 0 2px rgba(0,0,0,.06)}
.led-swatch.off{background:#d3cec6}
.led-swatch.twinkle{background:conic-gradient(#12de61,#1496ff,#12de61);box-shadow:0 0 10px rgba(20,150,255,.35),0 0 10px rgba(18,222,97,.35),0 0 0 2px rgba(0,0,0,.06)}
.led-choice-list{list-style:none;padding-left:0;margin:.55em 0 0}
.led-choice-list li{display:flex;align-items:flex-start;gap:10px;margin:.45em 0}
.led-choice-list li > span:last-child{flex:1;min-width:0}
@media (prefers-reduced-motion: reduce){.led-inline{animation:none !important}}
.legacy-reset-separator{
  border:0;
  border-top:1px solid var(--line);
  margin:28px 0 18px;
}
.full-specs{columns:2;column-gap:34px}
.full-specs li{break-inside:avoid;margin:.5em 0}
.figure-row{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:18px 0}
.figure-row figure{margin:0;background:#fff;border:1px solid var(--line);padding:10px;border-radius:12px}
.figure-row figcaption{font-size:.82rem;color:var(--muted);margin-top:7px}

.lo-figures{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;
  margin:18px 0;
}
.lo-figures figure{
  margin:0;
  background:#fff;
  border:1px solid var(--line);
  padding:10px;
  border-radius:12px;
}
.lo-figures img{
  display:block;
  width:100%;
  height:auto;
  border-radius:8px;
}
.lo-figures figcaption{
  font-size:.82rem;
  color:var(--muted);
  margin-top:7px;
  text-align:center;
}

.big-warning{background:#fff0ed;border:1px solid #efc2bb;border-left:6px solid var(--red);padding:20px;border-radius:12px;margin:20px 0}
.small-note{background:#f4eee5;border:1px solid var(--line);padding:15px 17px;border-radius:12px;margin:14px 0}
@media (max-width:900px){
  .path-grid{grid-template-columns:1fr 1fr}
  .full-specs{columns:1}
}
@media (max-width:620px){
  .path-grid,.figure-row,.lo-figures{grid-template-columns:1fr}
  .am-saver-figures{grid-template-columns:1fr}
}

.order-warning-gate{
  background:#fff6e8;
  color:var(--ink);
  border:1px solid #e6c899;
  border-left:6px solid var(--amber);
  border-radius:14px;
  padding:20px;
  margin:0 0 24px;
}
.order-warning-gate label{
  display:flex;
  align-items:flex-start;
  gap:12px;
  font-weight:750;
  cursor:pointer;
  padding:12px 14px;
  border:1px solid var(--line);
  border-radius:12px;
  background:#fffdf8;
  margin-top:10px;
}
.order-warning-gate label:first-of-type{margin-top:0}
.order-warning-gate input[type="radio"]{
  width:20px;
  height:20px;
  margin-top:3px;
  flex:0 0 auto;
}
.order-choice-note{
  margin:.8em 0 0;
  font-size:.9rem;
  color:var(--muted);
}
.order-path[hidden]{display:none!important}


.usa-invoice{
  margin:22px 0 26px;
  background:#fffaf1;
  color:var(--ink);
  border:1px solid #e6c899;
  border-radius:16px;
  padding:22px;
}
.usa-invoice h3{margin-bottom:.35em}
.usa-invoice p{color:var(--muted)}
.invoice-table{
  width:100%;
  border-collapse:separate;
  border-spacing:0;
  overflow:hidden;
  border:1px solid var(--line);
  border-radius:12px;
  background:#fff;
  min-width:0;
}
.invoice-table th,
.invoice-table td{
  padding:12px 13px;
  border-bottom:1px solid #eee3d7;
  vertical-align:middle;
}
.invoice-table th{
  background:#f2e8da;
  font-size:.86rem;
}

.invoice-item{
  display:flex;
  align-items:center;
  gap:.7em;
}
.invoice-item-media{
  flex:0 0 5em;
  width:5em;
  height:3em;
  display:flex;
  align-items:center;
  justify-content:center;
}
.invoice-item-photo{
  display:block;
  width:auto;
  height:auto;
  max-width:100%;
  max-height:3em;
  object-fit:contain;
  border-radius:.35em;
}
.invoice-item-text{
  min-width:0;
}

/* Center quantity entry and integer calculation columns */
.invoice-table th:nth-child(n+2),
.invoice-table td:nth-child(n+2){
  text-align:center;}
.invoice-table tr:last-child td{border-bottom:0}
.invoice-table input[type="number"]{
  width:92px;
  padding:9px 10px;
  border:1px solid #cfc1b1;
  border-radius:9px;
  font:inherit;
  text-align:center;
  background:white;
}
.invoice-table input:invalid{
  border-color:var(--red);
  outline-color:var(--red);
}
.invoice-calc{
  font-variant-numeric:tabular-nums;
  white-space:nowrap;
}
.invoice-total{
  margin-top:16px;
  display:flex;
  justify-content:flex-end;
  align-items:baseline;
  gap:12px;
  font-size:1.05rem;
}
.invoice-total strong{
  font-family:Georgia,"Times New Roman",serif;
  font-size:1.65rem;
}
.invoice-summary{
  display:none;
  margin-top:18px;
  background:#f3ecdf;
  border:1px solid var(--line);
  border-radius:12px;
  padding:16px;
}
.invoice-summary.show{display:block}
.invoice-summary pre{
  margin:0;
  white-space:pre-wrap;
  font:inherit;
  color:var(--ink);
}
.invoice-actions{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:16px;
}
.invoice-hint{
  font-size:.86rem;
  color:var(--muted);
  margin-top:10px;
}
@media (max-width:760px){
  .usa-invoice{overflow-x:auto}
  .invoice-table{min-width:680px}
}


.page-panel[hidden]{display:none!important}
.page-panel{min-height:calc(100vh - 112px)}
.menu a.page-switch.active,
.mobile-menu a.page-switch.active{background:var(--brown);color:#fff}
.legacy-module-image{
  width:40%;
  max-width:420px;
  height:auto;
  margin:20px auto 28px;
  display:block;
  border-radius:12px;
}

/* Installation path selector */
.installation-choice{
  background:#fff6e8;
  border:1px solid #e6c899;
  border-left:6px solid var(--amber);
  border-radius:14px;
  padding:20px;
  margin:24px 0 10px;
}
.installation-choice h3{margin-bottom:.35em}
.installation-choice p{margin-bottom:14px;color:var(--muted)}
.installation-choice-group{margin-top:14px}
.installation-choice-title{
  font-size:.86rem;
  font-weight:800;
  color:var(--brown);
  margin-bottom:7px;
}
.installation-choice-row{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}
.installation-choice label{
  display:flex;
  align-items:center;
  gap:9px;
  padding:10px 14px;
  background:var(--paper2);
  border:1px solid var(--line);
  border-radius:12px;
  font-weight:750;
  cursor:pointer;
  margin:0;
}
.installation-choice label.disabled{
  opacity:.5;
  cursor:not-allowed;
}
.installation-choice input[type="radio"]{
  width:20px;
  height:20px;
  margin:0;
  flex:0 0 auto;
}
.installation-results[hidden],
.installation-result-title[hidden],
.installation-path[hidden],
.installation-module-block[hidden],
.installation-common-block[hidden],
.installation-module-note[hidden]{display:none!important}
.installation-result-title{margin-bottom:28px}
.installation-path-note{font-size:.9rem;color:var(--muted);margin:.8em 0 0}
.installation-intro{
  font-size:1.08rem;
  color:var(--muted);
  margin:.4em 0 34px;
}


/* Path B: subtle contrast from Path A without using a dark panel */
.section.am-saver-bg{
  background:#eee8de;
  color:var(--ink);
}
.section.am-saver-bg .section-head p{
  color:var(--muted);
}


/* Module photos inside the Start Here cards */
.module-card-intro{
  display:flex;
  justify-content:flex-start;
  align-items:flex-start;
  gap:clamp(30px,6%,50px);
  width:fit-content;
  max-width:100%;
  margin-bottom:10px;
}
.module-card-text{
  flex:0 1 auto;
  min-width:0;
}
.module-card-photo{
  flex:0 0 auto;
}
.module-card-heading{
  display:grid;
  grid-template-columns:1fr;
  row-gap:6px;
  align-items:start;
}
.module-card-heading .badge{
  justify-self:start;
  white-space:nowrap;
  margin-bottom:0;
}
.module-card-heading h3{
  margin:0;
  white-space:nowrap;
}
.module-card-description{
  margin:.55em 0 1em;
}
.module-photo{
  width:auto;
  max-width:120px;
  max-height:115px;
  height:auto;
  object-fit:contain;
  margin:0;
  border-radius:10px;
}
@media (max-width:620px){
  .module-card-intro{
    gap:clamp(12px,4%,28px);
  }
  .module-photo{
    max-width:92px;
    max-height:92px;
  }
}
@media (max-width:460px){
  .module-card-heading h3{
    white-space:normal;
  }
  .module-photo{
    max-width:82px;
    max-height:82px;
  }
}

/* SETUP LED ANIMATIONS */

:root{
  --led-step3-cycle:2s;       /* Step 3 */
  --led-step4-cycle:1s;      /* Step 4 */
  --led-step5-cycle:.96s;     /* Step 5 */
  --led-step6-cycle:.125s;    /* Step 6 */
  --led-step7-cycle:1.92s;    /* Step 7 */
}

/* Step 3: FM Band */
@keyframes led-step3-onoff{
  0%,49.999%{opacity:1}
  50%,100%{opacity:.05}
}
.led-blink-05{
  animation:led-step3-onoff var(--led-step3-cycle) steps(1,end) infinite;
}

@keyframes led-step3-green-blue{
  0%,9.999%{background:#12de61;box-shadow:0 0 10px rgba(18,222,97,.88),0 0 0 2px rgba(0,0,0,.06);opacity:1}
  10%,19.999%{background:#1496ff;box-shadow:0 0 10px rgba(20,150,255,.88),0 0 0 2px rgba(0,0,0,.06);opacity:1}
  20%,29.999%{background:#12de61;box-shadow:0 0 10px rgba(18,222,97,.88),0 0 0 2px rgba(0,0,0,.06);opacity:1}
  30%,39.999%{background:#1496ff;box-shadow:0 0 10px rgba(20,150,255,.88),0 0 0 2px rgba(0,0,0,.06);opacity:1}
  40%,49.999%{background:#12de61;box-shadow:0 0 10px rgba(18,222,97,.88),0 0 0 2px rgba(0,0,0,.06);opacity:1}
  50%,100%{background:#12de61;box-shadow:0 0 0 2px rgba(0,0,0,.06);opacity:.05}
}
.led-alt-01{
  animation:led-step3-green-blue var(--led-step3-cycle) steps(1,end) infinite;
}

/* Step 4: De-emphasis */
@keyframes led-step4-onoff{
  0%,49.999%{opacity:1}
  50%,100%{opacity:.05}
}
.led-blink-025{
  animation:led-step4-onoff var(--led-step4-cycle) steps(1,end) infinite;
}

/* Step 5: Mono / Stereo */
@keyframes led-step5-double-blink{
  0%,16.666%{opacity:1}
  16.667%,33.333%{opacity:.05}
  33.334%,50%{opacity:1}
  50.001%,100%{opacity:.05}
}
.led-double-blink{
  animation:led-step5-double-blink var(--led-step5-cycle) linear infinite;
}

/* Step 6: AFC */
@keyframes led-step6-twinkle{
  0%,49.999%{opacity:1}
  50%,100%{opacity:.05}
}
.led-fast-blink{
  animation:led-step6-twinkle var(--led-step6-cycle) steps(1,end) infinite;
}

/* Step 7: Magic Eye */
@keyframes led-step7-four-blinks{
  0%,8.333%{opacity:1}
  8.334%,16.666%{opacity:.05}
  16.667%,25%{opacity:1}
  25.001%,33.333%{opacity:.05}
  33.334%,41.666%{opacity:1}
  41.667%,50%{opacity:.05}
  50.001%,58.333%{opacity:1}
  58.334%,100%{opacity:.05}
}
.led-four-blink{
  animation:led-step7-four-blinks var(--led-step7-cycle) linear infinite;
}

/* Accessibility: disables blinking if the visitor has requested reduced motion. */
@media (prefers-reduced-motion:reduce){
  .led-inline{animation:none !important}
}

