/* ===== HORIZONPACK · Factory sub-pages ===== */

/* header on sub-pages: solid + in normal flow (no scroll dependency) */
.header.header-static{position:relative;background:#16233f;box-shadow:0 4px 24px rgba(0,0,0,.28)}
.header.header-static .header-inner{padding-top:2px;padding-bottom:2px}

/* mobile nav dropdown */
@media (max-width:880px){
  .header.header-static .nav{position:absolute;top:100%;left:0;right:0;flex-direction:column;gap:0;
    background:#16233f;padding:6px 0 16px;display:none;box-shadow:0 14px 28px rgba(0,0,0,.35)}
  .header.header-static.nav-open .nav{display:flex}
  .header.header-static .nav a{padding:13px 24px;width:100%}
  .header.header-static .nav a::after{display:none}
  .header.header-static .header-cta{display:none}
}

/* page hero */
.fac-hero{background:linear-gradient(135deg,#16233f 0%,#1f3358 100%);color:#fff;padding:70px 0 76px;text-align:center}
.fac-hero .kicker{color:var(--accent)}
.fac-hero h1{font-size:clamp(30px,4.2vw,50px);font-weight:800;letter-spacing:-.02em;margin:14px 0 16px;color:#fff;line-height:1.15}
.fac-hero p{color:#A9B8D2;font-size:17px;max-width:660px;margin:0 auto;line-height:1.6}

.fac-section{padding:74px 0}
.fac-section.alt{background:var(--paper,#F6F4EF)}

/* overview category cards */
.cat-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;margin-top:8px}
.cat-card{display:block;background:#fff;border:1px solid var(--line);border-radius:16px;overflow:hidden;text-decoration:none;color:var(--ink);
  transition:transform .3s var(--ease),box-shadow .3s var(--ease),border-color .3s}
.cat-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-lg);border-color:transparent}
.cat-thumb{aspect-ratio:4/3;overflow:hidden;background:var(--paper-2,#EFEAE1)}
.cat-thumb img{width:100%;height:100%;object-fit:cover;transition:transform .5s var(--ease)}
.cat-card:hover .cat-thumb img{transform:scale(1.06)}
.cat-body{padding:16px 18px 18px}
.cat-body b{font-size:16px;font-weight:800;display:block;line-height:1.35}
.cat-body span{font-size:13px;color:var(--muted);margin-top:5px;display:block;line-height:1.5}
.cat-arrow{color:var(--accent);font-weight:800;margin-top:10px;display:inline-block;font-size:14px}
.cat-arrow::after{content:' →';transition:margin-left .25s var(--ease)}
.cat-card:hover .cat-arrow::after{margin-left:6px}

/* factory gallery grid (moved from style.css) */
.fac-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.fac-card{position:relative;background:#fff;border:1px solid var(--line);border-radius:14px;overflow:hidden;cursor:zoom-in;
  opacity:0;transform:translateY(20px);animation:galIn .5s var(--ease) forwards}
.fac-card:hover{box-shadow:var(--shadow-lg);border-color:transparent}
.fac-thumb{aspect-ratio:3/2;overflow:hidden;background:var(--paper-2,#EFEAE1)}
.fac-thumb img{width:100%;height:100%;object-fit:cover;transition:transform .5s var(--ease)}
.fac-card:hover .fac-thumb img{transform:scale(1.06)}
.fac-info{padding:11px 14px 13px;display:flex;align-items:center;justify-content:space-between;gap:10px}
.fac-info b{font-size:13.5px;font-weight:700;color:var(--ink);line-height:1.35}
.fac-tag{flex:none;font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--accent);
  background:rgba(255,90,45,.09);padding:3px 9px;border-radius:999px}
.fac-more-badge{position:absolute;top:10px;left:10px;background:rgba(15,27,45,.72);color:#fff;font-size:11px;font-weight:700;
  padding:4px 10px;border-radius:999px;backdrop-filter:blur(4px);opacity:0;transition:opacity .25s}
.fac-card:hover .fac-more-badge{opacity:1}

/* back-to-overview link */
.fac-back{display:inline-flex;align-items:center;gap:7px;color:var(--accent);font-weight:700;font-size:14px;margin-bottom:22px}
.fac-back::before{content:'←'}

@media (max-width:1024px){
  .cat-cards{grid-template-columns:repeat(2,1fr)}
  .fac-grid{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:680px){
  .cat-cards{grid-template-columns:1fr;gap:14px}
  .fac-grid{grid-template-columns:repeat(2,1fr);gap:12px}
  .fac-info b{font-size:12px}
  .fac-tag{display:none}
  .fac-hero{padding:52px 0 56px}
  .fac-section{padding:54px 0}
}
@media (hover:none){
  .fac-card:hover .fac-thumb img{transform:none}
  .cat-card:hover .cat-thumb img{transform:none}
}