/* ==========================================================================
   ENGINES  —  hr-engines.css
   Needs hr-core.css + hr-catalogue.css (the dusk masthead, the horizon, the
   plate, .cat-keys, the owner-record rows) + hr-archive.css (toolbar, chips,
   chart table) — declared in that order by hrclub_enqueue_design().

   Engine pages are the CHART realm, same as the catalogue: they are reference
   material, cold facts, and they should feel a half-step cooler than a member's
   own boat page. Nothing here redefines a token; the realm does that.

   Only what is genuinely new lives here:
     .en-wall     the manufacturer logo wall
     .en-card     an engine in a list
     .en-themes   what owners keep coming back to on this engine, by sub-part
                  (boat_log_part) — NOT by entry type: this section has already
                  filtered to system=engine, so type would rank Maintenance
                  against Upgrade and say nothing
     .en-buy      the vendor line (quiet on purpose)
     .en-also     the "Also from us" band
     .en-mfr-*    a manufacturer's masthead

   ARMOUR: every rule sits inside #site { } so it out-ranks the tier-1 reset and
   anything the theme writes without !important. See §7c.
   ========================================================================== */
#site {

  /* ==========================================================================
     THE MANUFACTURER STRIP
     Was a leading wall of 132px logo cards. With 46 manufacturers on record that
     is two screens of badges before the reader reaches a single engine — and the
     club runs boats on maybe a dozen of them, so most of it was reference noise
     in the most valuable position on the page.

     Now: one compact row per tier, BELOW the engine list. A badge is still a
     badge (recognised faster than a model number), just at strip scale, and the
     count says what the reader actually cares about — boats in the club, not how
     many engines the manufacturer has ever made.
     ========================================================================== */
  .en-badges{display:flex;flex-wrap:wrap;gap:10px;margin-top:clamp(18px,2.4vw,26px)}
  .en-badge{display:flex;align-items:center;gap:12px;min-height:52px;padding:8px 16px;
      background:#fff;border:1px solid rgba(11,42,63,.11);border-radius:12px;
      box-shadow:0 4px 12px rgba(11,42,63,.05);text-decoration:none;
      transition:transform .2s,box-shadow .2s,border-color .2s}
  .en-badge:hover{transform:translateY(-2px);box-shadow:0 12px 26px rgba(11,42,63,.12);border-color:rgba(194,112,63,.45)}
  /* logos are wildly inconsistent in shape and weight, so every one is capped to
     the same box and left-aligned inside it */
  .en-badge img{max-height:22px;max-width:104px;object-fit:contain;object-position:left center}
  .en-badge-n{font-family:ui-serif,Georgia,serif;font-weight:600;font-size:15px;line-height:1.1;color:var(--ink);white-space:nowrap}
  .en-badge-c{font:700 10px/1 system-ui,sans-serif;letter-spacing:.1em;text-transform:uppercase;
      color:var(--rust);font-variant-numeric:tabular-nums;white-space:nowrap}
  /* nobody in the club runs one: still listed \u2014 it is a reference \u2014 but it does
     not compete with the makers that matter */
  .en-badge.is-muted{background:rgba(255,255,255,.6);box-shadow:none}
  .en-badge.is-muted img{filter:grayscale(1);opacity:.55}
  .en-badge.is-muted .en-badge-n{color:rgba(11,42,63,.62);font-size:14px}
  .en-badge.is-muted .en-badge-c{color:rgba(11,42,63,.42);letter-spacing:.06em}
  .en-badge.is-muted:hover img{filter:none;opacity:1}
  .en-badges-rest{display:none}
  .en-badges-rest.is-open{display:flex}
  .en-reveal{display:inline-flex;align-items:center;gap:9px;margin-top:22px;height:44px;padding:0 20px;
      border:1px solid rgba(11,42,63,.22);border-radius:99px;background:none;cursor:pointer;
      font:700 11px/1 system-ui,sans-serif;letter-spacing:.12em;text-transform:uppercase;
      text-indent:.1em;color:var(--ink);transition:border-color .2s,background .2s}
  .en-reveal:hover{border-color:var(--ink);background:rgba(11,42,63,.05)}
  .en-reveal:after{content:'\2193';font-size:13px}

  /* ==========================================================================
     AN ENGINE IN A LIST
     Deliberately NOT a boat card: no photo band, no avatar, no flag. A boat is
     a thing you look at; an engine is a thing you look UP. So it is a ruled
     record — name, maker, then the three numbers that identify it — and the
     club count is the only thing allowed to be loud, because it is the only
     thing here the manufacturer's own site does not have.
     ========================================================================== */
  .en-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(268px,1fr));gap:14px;
      padding:8px 4px 40px;margin:-8px -4px -40px}
  .en-card{position:relative;display:flex;flex-direction:column;justify-content:space-between;gap:16px;
      min-height:158px;padding:20px 22px;background:#fff;border:1px solid rgba(11,42,63,.11);border-radius:14px;
      box-shadow:0 8px 20px rgba(11,42,63,.06);text-decoration:none;
      transition:transform .22s,box-shadow .22s,border-color .22s}
  .en-card:hover{transform:translateY(-4px);box-shadow:0 18px 38px rgba(11,42,63,.13);border-color:rgba(194,112,63,.4)}
  .en-card-mfr{font:700 9.5px/1 system-ui,sans-serif;letter-spacing:.18em;text-transform:uppercase;color:rgba(11,42,63,.45);
      /* the club badge is absolutely positioned top-right; reserve its lane so a
         long maker name can never run under it at the grid's narrowest column */
      padding-right:104px}
  .en-card-name{margin-top:9px;font-family:ui-serif,Georgia,serif;font-weight:600;font-size:21px;line-height:1.15;color:var(--ink);text-wrap:pretty}
  .en-card:hover .en-card-name{color:var(--rust)}
  .en-card-specs{display:flex;flex-wrap:wrap;gap:6px 18px;padding-top:14px;border-top:1px solid rgba(11,42,63,.1)}
  .en-card-specs div{font:600 11px/1.4 system-ui,sans-serif;letter-spacing:.06em;color:rgba(11,42,63,.55);font-variant-numeric:tabular-nums}
  .en-card-specs b{display:block;margin-top:4px;font-family:ui-serif,Georgia,serif;font-weight:600;font-size:16px;letter-spacing:0;color:var(--ink)}
  .en-in-club{position:absolute;top:16px;right:16px;padding:5px 9px;border-radius:100px;
      background:rgba(194,112,63,.13);font:700 10px/1 system-ui,sans-serif;letter-spacing:.1em;
      text-transform:uppercase;color:var(--rust);font-variant-numeric:tabular-nums}
  /* an engine nobody in the club runs is still listed — it is a reference — but
     it does not pretend to be a headline */
  .en-card.is-orphan{background:rgba(255,255,255,.62);box-shadow:none}
  .en-card.is-orphan .en-card-name{color:rgba(11,42,63,.72)}

  /* ==========================================================================
     THE SINGLE ENGINE PAGE
     ========================================================================== */
  /* the plate holds a product shot on white, so it gets a paper mount rather
     than the catalogue's dark frame */
  .en-plate .cat-plate-frame{background-color:#fff;background-size:contain;background-position:center;
      background-repeat:no-repeat;border-color:rgba(255,255,255,.22)}
  .en-plate .cat-plate-frame.is-empty{background:linear-gradient(150deg,#15364b,#0A2637)}

  /* WHAT OWNERS KEEP COMING BACK TO — counted in hulls, never in entries, for
     the same reason the catalogue's record is: one meticulous owner writing
     twelve times about one impeller is one boat's experience, not twelve. */
  .en-themes{display:grid;gap:2px;margin-top:clamp(26px,3.4vw,38px);border-top:1px solid rgba(255,255,255,.12)}
  .en-theme{display:grid;grid-template-columns:minmax(150px,1.2fr) minmax(90px,1.6fr) auto;align-items:center;
      gap:clamp(14px,2.4vw,30px);padding:15px 2px;border-bottom:1px solid rgba(255,255,255,.1)}
  .en-theme-l{font:600 clamp(13.5px,1.4vw,15px)/1.35 system-ui,sans-serif;color:var(--mist);text-wrap:pretty}
  .en-theme-bar{position:relative;height:7px;border-radius:99px;background:rgba(255,255,255,.09);overflow:hidden}
  .en-theme-bar span{position:absolute;left:0;top:0;bottom:0;border-radius:99px;
      background:linear-gradient(90deg,var(--rust),var(--accent))}
  .en-theme-n{font:600 12.5px/1 system-ui,sans-serif;color:rgba(245,242,236,.75);
      font-variant-numeric:tabular-nums;white-space:nowrap;text-align:right}
  .en-theme-n em{font-style:normal;color:rgba(245,242,236,.45);font-weight:500}
  /* a part nobody has logged: dimmed IN PLACE, never removed. Same rule as the
     chart table's zero rows and the catalogue record's — an engine with three
     of ten parts written about should look like an engine with seven silences,
     not like an engine with three parts. */
  .en-theme.is-zero .en-theme-l{color:rgba(245,242,236,.42)}
  .en-theme.is-zero .en-theme-bar{background:rgba(255,255,255,.05)}

  /* THE VENDOR LINE — quiet by contract. It is a line of type with a rule under
     it, not a card, not a button, not a colour block. The club's credibility is
     the asset being sold here; a page that looks bought is worth less to the
     vendor, not more. Disclosure sits in the same breath as the link. */
  .en-buy{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px 14px;
      margin-top:clamp(26px,3.2vw,36px);padding-top:18px;border-top:1px solid rgba(11,42,63,.14)}
  .en-buy a{display:inline-flex;align-items:baseline;gap:8px;font:600 13px/1 system-ui,sans-serif;
      letter-spacing:.04em;color:var(--rust);text-decoration:none;border-bottom:1px solid rgba(194,112,63,.4);
      padding-bottom:5px;transition:color .2s,border-color .2s}
  .en-buy a:hover{color:var(--ink);border-color:var(--ink)}
  .en-buy a:after{content:'\2197';font-size:12px}
  .en-buy small{font:400 11.5px/1.5 system-ui,sans-serif;color:rgba(11,42,63,.5)}

  /* ==========================================================================
     "ALSO FROM US"
     Two live sister projects, named plainly. A band, not a takeover: it sits
     directly above the footer, reads as a colophon, and never competes with the
     page's own last section.
     ========================================================================== */
  .en-also{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:14px;margin-top:clamp(22px,3vw,30px)}
  .en-also a{display:block;padding:22px 24px;border:1px solid rgba(255,255,255,.13);border-radius:14px;
      background:rgba(255,255,255,.04);text-decoration:none;
      transition:border-color .22s,background .22s,transform .22s}
  .en-also a:hover{border-color:rgba(255,179,71,.5);background:rgba(255,255,255,.07);transform:translateY(-3px)}
  .en-also .n{display:flex;align-items:baseline;gap:9px;font-family:ui-serif,Georgia,serif;font-weight:600;
      font-size:19px;line-height:1.15;color:var(--mist)}
  .en-also a:hover .n{color:var(--accent)}
  .en-also .n:after{content:'\2197';font:600 12px/1 system-ui,sans-serif;color:rgba(245,242,236,.45)}
  .en-also .d{margin-top:10px;font:400 13.5px/1.6 system-ui,sans-serif;color:rgba(245,242,236,.66);text-wrap:pretty}

  /* The archive's .ar-open pill has no "on" state — the boats archive never
     needed one (its chart table is a door, not a toggle). Our "In the club only"
     toggle IS stateful, so it needs one, and it must match hr-archive.css's own
     weight: that file sets .ar-open colours with !important to beat theme bleed,
     so an equal-weight override is the only thing that can win. */
  .ar-open.is-on{box-shadow:inset 0 0 0 1.5px var(--rust)!important;color:#fff!important;
      background:var(--rust)!important}
  .ar-open.is-on:hover{background:var(--ink)!important;box-shadow:inset 0 0 0 1.5px var(--ink)!important;
      color:#fff!important}

  /* THE ONE WAY OUT — a manufacturer page's only lateral exit, at the foot of
     their range. Replaced a row of sister-manufacturer chips: those duplicated
     the running head's own exit, needed a "see all" as soon as the taxonomy
     grew, and put a competitor's badge on a page a manufacturer may be paying
     for. One line, on paper, no card. */
  .en-out{margin-top:clamp(30px,4vw,44px);padding-top:20px;border-top:1px solid rgba(11,42,63,.14)}
  .en-out a{display:inline-flex;align-items:baseline;gap:9px;font:600 13px/1.5 system-ui,sans-serif;
      color:var(--rust);text-decoration:none;border-bottom:1px solid rgba(194,112,63,.35);
      padding-bottom:5px;transition:color .2s,border-color .2s;text-wrap:pretty}
  .en-out a:hover{color:var(--ink);border-color:var(--ink)}
  .en-out a:after{content:'\2192';font-size:14px}

  /* the archive's search field, but on the dusk ground of the masthead rather
     than the warm band .ar-search is written for */
  .en-search{display:flex;align-items:center;gap:10px;height:48px;padding:0 18px;border-radius:100px;
      background:rgba(245,242,236,.1);border:1px solid rgba(245,242,236,.2)}
  .en-search input{flex:1;min-width:0;background:none!important;border:0!important;outline:0;
      font:400 15px/1 system-ui,sans-serif!important;color:var(--mist)!important;padding:0!important}
  .en-search input::placeholder{color:rgba(245,242,236,.5)!important;opacity:1}
  .en-search-ico{font-size:15px;color:rgba(245,242,236,.55)}

  /* ==========================================================================
     A MANUFACTURER'S MASTHEAD
     Their badge on the dusk ground, their own sentence, and the club's numbers
     next to it. The numbers are the pitch: this is the page a partnership
     conversation starts from.
     ========================================================================== */
  .en-mfr-mark{display:flex;align-items:center;min-height:56px;margin-bottom:6px}
  .en-mfr-mark img{max-height:52px;max-width:230px;object-fit:contain;object-position:left center}
  .en-mfr-nums{display:flex;flex-wrap:wrap;gap:12px 34px;margin-top:clamp(20px,2.6vw,28px)}
  .en-mfr-nums div{min-width:78px}
  .en-mfr-nums dt{font:700 9px/1 system-ui,sans-serif;letter-spacing:.18em;text-transform:uppercase;color:rgba(11,42,63,.5)}
  .en-mfr-nums dd{margin:8px 0 0;font-family:ui-serif,Georgia,serif;font-weight:600;font-size:24px;line-height:1;
      color:var(--ink);font-variant-numeric:tabular-nums}

  /* a manufacturer's own site: the same quiet treatment as the vendor line, on
     the dusk ground instead of paper */
  .en-mfr-link{display:inline-flex;align-items:baseline;gap:8px;margin-top:20px;font:600 12.5px/1 system-ui,sans-serif;
      letter-spacing:.05em;color:var(--accent);text-decoration:none;border-bottom:1px solid rgba(255,179,71,.35);
      padding-bottom:5px;transition:color .2s,border-color .2s}
  .en-mfr-link:hover{color:var(--mist);border-color:var(--mist)}
  .en-mfr-link:after{content:'\2197';font-size:12px}

  /* ---- responsive -------------------------------------------------------- */
  @media (max-width:900px){
    .en-theme{grid-template-columns:1fr auto;gap:10px 14px}
    .en-theme-bar{grid-column:1/-1;order:3}
  }
  @media (max-width:720px){
    .en-badge{min-height:46px;padding:7px 13px;gap:9px}
    .en-badge img{max-height:18px;max-width:82px}
    .en-mfr-nums{gap:12px 24px}
  }
}
