/* ================= page extensions: contact / faq / factory =================
   Scoped with cp- (contact), fq- (faq), fx- (factory). Loaded after theme-spec.css.
   ============================================================================ */

/* ---------- shared ---------- */
.pg-sec{padding:clamp(56px,6.5vw,92px) 0;background:var(--paper)}
.pg-sec--soft{background:var(--gray)}
.pg-head{display:flex;align-items:flex-end;justify-content:space-between;gap:28px;flex-wrap:wrap;margin:0 0 40px}
.pg-head h2{font-size:clamp(26px,3vw,38px);line-height:1.12;margin:10px 0 0}
.pg-head p{margin:10px 0 0;color:var(--muted);max-width:62ch;font-size:15px;line-height:1.7}
.pg-eyebrow{display:inline-block;font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--accent);font-weight:700}

/* ============================================================
   CONTACT
   ============================================================ */
.cp-map{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(0,.85fr);gap:24px;align-items:stretch}
.cp-map-frame{position:relative;border:1px solid var(--line);border-radius:14px;overflow:hidden;background:var(--gray);min-height:430px;box-shadow:var(--shadow)}
.cp-map-frame iframe{display:block;width:100%;height:100%;min-height:430px;border:0}
.cp-map-frame .cp-map-tag{position:absolute;left:14px;bottom:14px;z-index:2;background:rgba(23,23,23,.82);color:#fff;font-size:11px;letter-spacing:.1em;text-transform:uppercase;font-weight:600;padding:7px 12px;border-radius:6px;pointer-events:none}
.cp-info{display:flex;flex-direction:column;gap:18px;background:#fff;border:1px solid var(--line);border-radius:14px;padding:28px;box-shadow:var(--shadow)}
.cp-row{display:flex;gap:13px;align-items:flex-start}
.cp-row .ic{width:38px;height:38px;border-radius:9px;display:grid;place-items:center;background:var(--gray);color:var(--accent);flex:none}
.cp-row .ic svg{width:18px;height:18px}
.cp-row .k{display:block;font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-faint);font-weight:700;margin-bottom:3px}
.cp-row .v{font-size:14.5px;line-height:1.6;color:var(--ink-soft)}
.cp-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:auto;padding-top:6px}
.cp-actions .btn{padding:11px 18px;font-size:13.5px}

.cp-send{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.cp-send-item{background:#fff;border:1px solid var(--line);border-radius:14px;padding:22px;box-shadow:var(--shadow);transition:transform var(--tr),border-color var(--tr)}
.cp-send-item:hover{transform:translateY(-2px);border-color:var(--accent)}
.cp-send-item .no{font-size:11px;letter-spacing:.14em;color:var(--accent);font-weight:700}
.cp-send-item h3{font-size:16.5px;margin:8px 0 6px}
.cp-send-item p{margin:0;font-size:13.5px;line-height:1.6;color:var(--muted)}

.cp-steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid var(--line)}
.cp-step{padding:26px 24px;border-right:1px solid var(--line)}
.cp-step:last-child{border-right:0}
.cp-step .n{font-size:11px;letter-spacing:.14em;color:var(--accent);font-weight:700}
.cp-step h3{font-size:17px;margin:8px 0 6px}
.cp-step p{margin:0;font-size:13.5px;line-height:1.6;color:var(--muted)}
.cp-step .t{display:inline-block;margin-top:12px;font-size:11.5px;font-weight:700;color:var(--ink);background:var(--gray);padding:4px 9px;border-radius:999px}

/* ============================================================
   FAQ
   ============================================================ */
.fq-toolbar{position:sticky;top:100px;z-index:30;background:rgba(250,249,247,.95);backdrop-filter:blur(10px);border-bottom:1px solid var(--line);padding:12px 0}
.fq-tb{display:grid;grid-template-columns:1fr auto;grid-template-areas:"search acts" "chips chips";gap:10px 14px;align-items:center}
.fq-search{position:relative;flex:1 1 320px;min-width:0;grid-area:search}
.fq-search input{width:100%;border:1px solid var(--line);background:#fff;border-radius:999px;padding:12px 18px 12px 42px;font-size:15px;color:var(--ink);outline:none;font-family:inherit}
.fq-search input:focus{border-color:var(--accent)}
.fq-search svg{position:absolute;left:15px;top:50%;transform:translateY(-50%);color:var(--muted)}
.fq-chips{display:flex;gap:7px;overflow-x:auto;padding:2px 0;max-width:100%;scrollbar-width:none;grid-area:chips}
.fq-chips::-webkit-scrollbar{display:none}
.fq-chip{white-space:nowrap;border:1px solid var(--line);background:#fff;color:var(--ink-soft);font:inherit;font-size:12.5px;font-weight:600;padding:8px 13px;border-radius:999px;cursor:pointer;transition:background var(--tr),color var(--tr),border-color var(--tr)}
.fq-chip:hover{border-color:var(--accent);color:var(--accent)}
.fq-chip.on{background:var(--ink);border-color:var(--ink);color:#fff}
.fq-acts{display:flex;gap:8px;grid-area:acts}
.fq-btn{border:1px solid var(--line);background:#fff;color:var(--ink);font:inherit;font-size:12.5px;font-weight:600;padding:8px 13px;border-radius:999px;cursor:pointer}
.fq-btn:hover{border-color:var(--accent);color:var(--accent)}

.fq-layout{display:grid;grid-template-columns:210px minmax(0,1fr);gap:48px;align-items:start}
.fq-nav{position:sticky;top:186px;display:flex;flex-direction:column;gap:2px;border-left:1px solid var(--line)}
.fq-nav a{font-size:13px;color:var(--muted);text-decoration:none;padding:7px 0 7px 14px;border-left:2px solid transparent;margin-left:-1px;line-height:1.35;transition:color var(--tr),border-color var(--tr)}
.fq-nav a:hover,.fq-nav a.on{color:var(--ink);border-color:var(--accent)}
.fq-group{margin:0 0 48px;scroll-margin-top:186px}
.fq-group>h2{font-size:clamp(21px,2.3vw,27px);margin:0 0 16px;display:flex;align-items:center;gap:10px}
.fq-count{font-size:11.5px;font-weight:600;color:var(--muted);background:var(--gray);border-radius:999px;padding:3px 9px}
.fq-list{display:flex;flex-direction:column;gap:10px}
.fq-list .faq-item{background:#fff;border:1px solid var(--line);border-radius:12px;overflow:hidden}
.fq-list .faq-q{padding:18px 22px;font-size:16px}
.fq-list .faq-a{padding:0 22px 20px;font-size:14.5px;line-height:1.75;color:var(--muted)}
.fq-empty{display:none;text-align:center;padding:64px 20px;color:var(--muted)}
.fq-empty.show{display:block}

/* anchor offset under the sticky header */
#visit,section[id^="fx-"]{scroll-margin-top:120px}

/* ============================================================
   FACTORY
   ============================================================ */
.fx-nav{position:sticky;top:100px;z-index:30;background:rgba(250,249,247,.95);backdrop-filter:blur(10px);border-bottom:1px solid var(--line);padding:10px 0}
.fx-nav-in{display:flex;gap:4px;overflow-x:auto;scrollbar-width:none}
.fx-nav-in::-webkit-scrollbar{display:none}
.fx-nav a{white-space:nowrap;font-size:12.5px;font-weight:600;color:var(--muted);text-decoration:none;padding:7px 11px;border-radius:999px;transition:background var(--tr),color var(--tr)}
.fx-nav a:hover,.fx-nav a.on{background:var(--gray);color:var(--ink)}

.qz-kiln-item .thumb{aspect-ratio:4/3;border:1px solid var(--line);border-radius:10px;overflow:hidden;margin-bottom:16px;background:var(--gray)}
.qz-kiln-item .thumb img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s ease}
.qz-kiln-item .thumb:hover img{transform:scale(1.04)}

.fx-gallery{grid-template-columns:repeat(2,minmax(0,1fr))}
.fx-gallery img{cursor:zoom-in;border-radius:10px;transition:transform var(--tr)}
.fx-gallery img:hover{transform:scale(1.015)}

.fx-lightbox{position:fixed;inset:0;z-index:200;background:rgba(20,18,16,.88);display:none;align-items:center;justify-content:center;padding:5vw;cursor:zoom-out}
.fx-lightbox.on{display:flex}
.fx-lightbox img{max-width:90vw;max-height:88vh;border-radius:8px;box-shadow:0 20px 60px rgba(0,0,0,.5)}
.fx-lb-x{position:absolute;top:18px;right:22px;background:none;border:0;color:#fff;font-size:34px;line-height:1;cursor:pointer}

.fx-doc{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.fx-doc-card{background:#fff;border:1px solid var(--line);border-radius:14px;padding:28px;box-shadow:var(--shadow)}
.fx-doc-card h3{font-size:18px;margin:0 0 14px}
.fx-doc-card .checklist li{font-size:14px}
.fx-note{font-size:13px;color:var(--muted);margin:18px 0 0;max-width:70ch;line-height:1.7}

/* ---------- responsive ---------- */
@media(max-width:1080px){
  .fq-layout{grid-template-columns:1fr;gap:28px}
  .fq-nav{position:static;flex-direction:row;flex-wrap:wrap;border-left:0;gap:6px}
  .fq-nav a{border:1px solid var(--line);border-radius:999px;padding:6px 11px;margin:0}
  .fq-nav a:hover,.fq-nav a.on{border-color:var(--accent)}
}
@media(max-width:960px){
  .cp-map{grid-template-columns:1fr}
  .cp-send{grid-template-columns:repeat(2,minmax(0,1fr))}
  .cp-steps{grid-template-columns:repeat(2,minmax(0,1fr))}
  .cp-step:nth-child(2){border-right:0}
  .cp-step:nth-child(-n+2){border-bottom:1px solid var(--line)}
  .fx-doc{grid-template-columns:1fr}
}
@media(max-width:720px){
  .fq-toolbar,.fx-nav{top:64px}
  #visit,section[id^="fx-"]{scroll-margin-top:76px}
  .cp-send{grid-template-columns:1fr}
  .cp-steps{grid-template-columns:1fr}
  .cp-step{border-right:0;border-bottom:1px solid var(--line)}
  .cp-step:last-child{border-bottom:0}
  .cp-map-frame,.cp-map-frame iframe{min-height:320px}
  .fx-gallery{grid-template-columns:1fr}
  .fq-acts{width:auto}
  .fq-group>h2{font-size:20px}
  .fq-nav{display:none}
  .fq-group{scroll-margin-top:150px}
}
