/* Reset + typography + layout primitives + motion. */
*, *::before, *::after { box-sizing: border-box; }

html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  scroll-behavior: smooth;
  scroll-padding-top: calc(var(--p136-header-h) + 60px);
}

body {
  margin: 0;
  background: var(--p136-bg);
  color: var(--p136-ink);
  font-family: var(--p136-font);
  font-size: var(--p136-fs-body);
  line-height: var(--p136-lh-body);
  font-feature-settings: "ss01" 0;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  overflow-x: clip;
}

img, svg, video, picture { display: block; max-width: 100%; height: auto; }
img { border-style: none; }
button, input, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; }
a { color: var(--p136-accent); text-decoration: none; }
a:hover { text-decoration: underline; text-underline-offset: 3px; }
h1, h2, h3, h4, p, ul, ol, figure, dl, dd { margin: 0; }
ul, ol { padding: 0; list-style: none; }
table { border-collapse: collapse; width: 100%; }
hr { border: 0; border-top: 1px solid var(--p136-line-soft); margin: var(--p136-s6) 0; }
[hidden] { display: none !important; }

h1, h2, h3, h4 { line-height: var(--p136-lh-tight); font-weight: 700; letter-spacing: -0.005em; }

/* Model names, part numbers and specs stay left-to-right inside RTL text. */
bdi, .p136-ltr { unicode-bidi: isolate; }
.p136-ltr { direction: ltr; display: inline-block; }

:focus-visible {
  outline: 3px solid var(--p136-focus);
  outline-offset: 3px;
  border-radius: 4px;
}

::selection { background: rgba(234, 99, 56, 0.25); }

/* Layout */
.p136-container {
  width: min(var(--p136-page), 100% - 2 * var(--p136-gutter));
  margin-inline: auto;
}
.p136-container--wide { width: min(var(--p136-wide), 100% - 2 * var(--p136-gutter)); }
.p136-container--read { width: min(var(--p136-read), 100% - 2 * var(--p136-gutter)); }
.p136-section { padding-block: var(--p136-section); }
.p136-section--tight { padding-block: calc(var(--p136-section) / 2); }
.p136-section--surface { background: var(--p136-surface); }
.p136-section--dark { background: var(--p136-dark); color: var(--p136-on-dark); }

.screen-reader-text,
.p136-sr {
  position: absolute !important;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0, 0, 0, 0);
  white-space: nowrap; border: 0;
}

.skip-link {
  position: fixed;
  inset-block-start: 8px;
  inset-inline-start: 8px;
  z-index: 1000;
  padding: 10px 18px;
  background: var(--p136-ink);
  color: #fff;
  border-radius: var(--p136-r-pill);
  transform: translateY(-200%);
  transition: transform var(--p136-t-fast) var(--p136-ease);
}
.skip-link:focus { transform: none; text-decoration: none; }

/* Headlines: bold statement + muted continuation, as on apple.com/shop. */
.p136-headline { font-size: var(--p136-fs-h2); line-height: var(--p136-lh-display); font-weight: 800; }
.p136-headline .p136-muted,
.p136-headline em { font-style: normal; color: var(--p136-faint); font-weight: 700; }
.p136-eyebrow { font-size: var(--p136-fs-eyebrow); font-weight: 600; color: var(--p136-accent); }
.p136-lead { font-size: clamp(1.0625rem, 1rem + 0.35vw, 1.375rem); line-height: 1.6; color: var(--p136-ink-2); font-weight: 500; }
.p136-muted { color: var(--p136-muted); }
.p136-center { text-align: center; }

/* Scroll-driven reveal (progressive: content is visible without support or JS) */
@supports (animation-timeline: view()) {
  @media (prefers-reduced-motion: no-preference) {
    [data-reveal] {
      animation: p136-rise linear both;
      animation-timeline: view();
      animation-range: entry 0% entry 45%;
    }
  }
}
@keyframes p136-rise {
  from { opacity: 0; transform: translateY(32px); }
  to { opacity: 1; transform: none; }
}
/* Fallback reveal driven by core.js when scroll-driven animations are unavailable */
.p136-js-reveal [data-reveal] { opacity: 0; transform: translateY(28px); transition: opacity var(--p136-t-slow) var(--p136-ease-out), transform var(--p136-t-slow) var(--p136-ease-out); }
.p136-js-reveal [data-reveal].is-in { opacity: 1; transform: none; }

/* Cross-document view transitions: product card image morphs into the buy-page gallery. */
@view-transition { navigation: auto; }
::view-transition-old(root), ::view-transition-new(root) { animation-duration: 220ms; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
  [data-reveal] { opacity: 1 !important; transform: none !important; animation: none !important; }
  @view-transition { navigation: none; }
}

/* Never let a wide child force sideways scrolling on phones. */
.p136-scroll-x { overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch; overscroll-behavior-x: contain; }
.p136-scroll-x::-webkit-scrollbar { display: none; }

body.p136-lock { overflow: hidden; }
