:root {
  --forest: #102f2a;
  --forest-2: #0c231f;
  --moss: #2f6755;
  --lime: #cdeb58;
  --orange: #ff5a36;
  --paper: #f3f0e6;
  --cream: #fbf9f2;
  --ink: #12201d;
  --muted: #727a73;
  --line: #d7d8cf;
}

.brand-logo { width: 39px; height: 39px; border-radius: 11px; object-fit: cover; box-shadow: 0 4px 14px #0c231f2e; }
.footer-inner .brand-logo { box-shadow: 0 4px 14px #0005; }

.locale-switch {
  display: grid;
  place-items: center;
  width: 36px;
  height: 36px;
  border: 1px solid var(--line);
  border-radius: 10px;
  font: 800 11px/1 monospace;
  letter-spacing: .08em;
}

.product-ribbon { background: var(--orange); color: var(--forest-2); }
.ribbon-grid { min-height: 118px; display: grid; grid-template-columns: 1fr auto 1fr auto 1.2fr; gap: 28px; align-items: center; }
.ribbon-grid > span { font: 800 28px Manrope, sans-serif; opacity: .65; }
.ribbon-grid small,.ribbon-grid strong { display: block; }
.ribbon-grid small { font: 800 10px monospace; letter-spacing: .13em; margin-bottom: 5px; }
.ribbon-grid strong { font: 800 17px Manrope, sans-serif; }
.ribbon-result { padding: 19px 23px; border-radius: 14px; background: var(--forest-2); color: white; }
.ribbon-result small { color: var(--lime); }

.anytime { display: grid; grid-template-columns: 1fr 1fr; gap: 90px; align-items: center; }
.anytime-map { position: relative; min-height: 430px; overflow: hidden; padding: 40px; border-radius: 28px; color: white; background: repeating-radial-gradient(ellipse at 10% 90%, transparent 0 28px,#a1724c55 29px 31px),linear-gradient(145deg,#173f35,#0c231f); }
.anytime-map:after { content: ""; position: absolute; inset: 0; background: linear-gradient(116deg,transparent 46%,#ff5a36 47% 48%,transparent 49%); }
.availability { position: relative; z-index: 2; display: inline-block; padding: 8px 10px; background: var(--lime); color: var(--forest-2); font: 800 10px monospace; letter-spacing: .13em; }
.anytime-map b { position: absolute; left: 40px; bottom: 42px; z-index: 2; font: 800 44px/1.02 Manrope,sans-serif; letter-spacing: -.04em; }
.mini-controls i { position: absolute; z-index: 2; display: grid; place-items: center; width: 43px; height: 43px; border: 4px solid #d1338c; border-radius: 50%; background: #f3f0e6dd; color: #d1338c; font: normal 800 13px sans-serif; }
.mini-controls i:nth-child(1){left:23%;top:37%}.mini-controls i:nth-child(2){left:53%;top:22%}.mini-controls i:nth-child(3){right:13%;top:42%}
.anytime h2 { margin-bottom: 25px; }
.anytime p { color: var(--muted); font-size: 18px; }
.check-list { list-style: none; padding: 0; margin: 28px 0 0; }
.check-list li { padding: 12px 0 12px 30px; border-bottom: 1px solid var(--line); font-weight: 700; }
.check-list li:before { content: "↗"; float: left; margin-left: -30px; color: var(--orange); }

@media (max-width: 850px) {
  .ribbon-grid { grid-template-columns: 1fr; gap: 7px; padding-block: 25px; }
  .ribbon-grid > span { display: none; }
  .anytime { grid-template-columns: 1fr; gap: 45px; }
}

@media (max-width: 560px) {
  .locale-switch { width: 34px; height: 34px; }
  .nav-actions { gap: 8px; }
  .nav-actions .button { display: none; }
  .anytime-map { min-height: 350px; padding: 24px; }
  .anytime-map b { left: 24px; bottom: 28px; font-size: 35px; }
}
