/* Site foundation for www.byd.com clones — fonts, tokens and base rules taken from byd.com commmon.css */

@font-face { font-family: Montserrat; src: url("../fonts/Montserrat-Light.ttf") format("truetype"); font-weight: 300; font-style: normal; font-display: swap; }
@font-face { font-family: Montserrat; src: url("../fonts/Montserrat-Regular.ttf") format("truetype"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: Montserrat; src: url("../fonts/Montserrat-Medium.ttf") format("truetype"); font-weight: 500; font-style: normal; font-display: swap; }
@font-face { font-family: Montserrat; src: url("../fonts/Montserrat-SemiBold.ttf") format("truetype"); font-weight: 600; font-style: normal; font-display: swap; }
@font-face { font-family: Montserrat; src: url("../fonts/Montserrat-Bold.ttf") format("truetype"); font-weight: 700; font-style: normal; font-display: swap; }
@font-face { font-family: icomoon; src: url("../fonts/icomoon.ttf") format("truetype"), url("../fonts/icomoon.woff") format("woff"); font-weight: normal; font-style: normal; font-display: block; }

:root {
  /* text */
  --color-text: #000;
  --color-text-strong: #252728;       /* rgb(37,39,40) — headings, nav, card titles */
  --color-text-muted: rgba(37, 39, 40, 0.6);
  --color-text-grey: #9a9a9a;         /* rgb(154,154,154) */
  --color-text-body: #333;
  --color-on-dark: #fff;
  --color-on-dark-muted: rgba(255, 255, 255, 0.55);
  /* surfaces */
  --color-bg: #fff;
  --color-surface: #f7f7f7;           /* rgb(247,247,247) */
  --color-surface-2: #f0f0f0;
  --color-surface-grey: #909399;      /* rgb(144,147,153) — technology section band */
  --color-dark: #242728;              /* rgb(36,39,40) — pill buttons */
  --color-dark-2: #222;
  --color-interior-start: #10131a;
  --color-interior-end: #252b3b;
  --color-glass: rgba(255, 255, 255, 0.45);
  /* type */
  --font-base: "Montserrat", Arial, "Helvetica Neue", Helvetica, sans-serif;
  /* layout */
  --header-offset: 88px;
}

*, *::before, *::after { box-sizing: border-box; }
* { -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }

html { scroll-behavior: auto; }

body {
  margin: 0;
  padding: 0;
  overflow-x: hidden;
  font-family: var(--font-base);
  font-size: 16px;
  font-weight: 400;
  color: var(--color-text);
  line-height: 1.5;
  background: var(--color-bg);
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

h1, h2, h3, h4, h5, h6, p, ul, ol, figure { margin: 0; padding: 0; }
ul, ol { list-style: none; }

a { text-decoration: none; color: inherit; }
a:focus, a:hover, a:active { outline: 0; }
a:focus-visible, button:focus-visible { outline: 2px solid currentColor; outline-offset: 2px; }

/* height:auto — every <img> carries width/height attributes (CLS); without it the attribute height wins over CSS width/aspect-ratio. */
img { border: 0; vertical-align: middle; max-width: 100%; height: auto; }
video { display: block; }

button, input, select, textarea { font: inherit; font-size: 100%; margin: 0; padding: 0; vertical-align: baseline; outline: 0; }
button, input { line-height: normal; }
button, input[type=button], input[type=reset], input[type=submit] { cursor: pointer; -webkit-appearance: button; border: 0; background: none; color: inherit; }
button[disabled], input[disabled] { cursor: default; }
input[type=text], input[type=email], input[type=tel], input[type=search], textarea { box-shadow: none; -webkit-appearance: none; appearance: none; }

.visually-hidden {
  position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

/* Float-up entrance used by byd.com (gsap: from opacity 0 / y 100 → 1 / 0, 0.6s power2.out on mount).
   JS in js/main.js runs it; without JS the content stays visible. */
.js-float-title { will-change: transform, opacity; }

/* Page */
main { display: block; }
section[id] { scroll-margin-top: var(--header-offset); }