/*
  OPTIONAL — NOT PART OF THE CLAUDE DESIGN.
  The design is desktop-only (fluid vw/vh sizing, no breakpoints). Desktop (>1024px) is untouched.
  These rules keep the pinned layouts readable on tablet/mobile. The JS animations still run.
  Delete the <link> to this file in the Blade partial to reproduce the design with no additions.
*/

@media (max-width: 1024px) {
  /* 03 — stack copy above the hex cluster, larger type */
  .oe .oe-intro__head { left: 6vw; right: 6vw; margin-top: -26vh; }
  .oe .oe-intro__title { font-size: min(9vw, 7vh, 72px); }
  .oe .oe-intro__lede { font-size: 16px; }
  .oe .oe-intro__grid { left: 6vw; right: 6vw; grid-template-columns: minmax(0, 1fr); gap: 4vh; }
  .oe .oe-approvals__statement { font-size: min(5.2vw, 3.6vh, 32px); line-height: 1.25; gap: .28em; }
  .oe .oe-approvals__line { white-space: normal; }
  .oe .oe-intro__quote { font-size: 15px; }
  .oe .oe-hex-cluster { --w: min(22vw, 13vh, 150px); }

  /* 04 — heading on top, track below */
  .oe .oe-fac__pin { grid-template-columns: minmax(0, 1fr); grid-template-rows: auto minmax(0, 1fr); align-items: stretch; padding-top: 10vh; }
  .oe .oe-fac__side { padding: 0 6vw; gap: 2vh; }
  .oe .oe-fac__title-main { font-size: min(7vw, 5vh, 46px); }
  .oe .oe-fac__title-sub { font-size: 15px; }
  .oe .oe-fac__track { padding: 0 6vw; }
  .oe .oe-fcard { width: min(62vw, 420px); height: min(52vh, 520px); }
  .oe .oe-fcard__title { font-size: min(4.4vw, 26px); }
  .oe .oe-fcard__text { font-size: 14px; }

  /* 05 */
  .oe .oe-access__content { padding: 0 6vw; }
  .oe .oe-access__title { font-size: min(9vw, 6.4vh, 64px); }
  .oe .oe-access__words { font-size: min(4vw, 2.6vh, 22px); }
  .oe .oe-access__card { width: min(28vw, 200px); }
}

@media (max-width: 640px) {
  .oe .oe-intro__head { margin-top: -30vh; }
  .oe .oe-approvals__tags { gap: 12px; }
  .oe .oe-hex-cluster { --w: min(25vw, 11vh, 120px); }
  .oe .oe-hex__label { font-size: 9px; }
  .oe .oe-fcard { width: 78vw; border-radius: 24px; }
  .oe .oe-fcard__copy { left: 20px; right: 20px; bottom: 22px; }
  .oe .oe-fcard__text { display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; }
  .oe .oe-access__words { font-size: 17px; }
  .oe .oe-access__card { display: none; }
}
