/* Services (C9), FAQ (C10), Work index (C11) and Business (C12), desktop and phone.
   Loaded after site-v3.css. pg-d shows on desktop, pg-m on a phone (<=700px). */
.pg-m{display:none}

/* ───────── blueprint header (C7b style) ───────── */
.pg-head{position:relative;overflow:hidden;color:#fff;background:radial-gradient(90% 60% at 30% 0%,#173043 0%,#0f2030 55%,#0b1822 100%)}
.pg-head-in{position:relative;z-index:2;display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:48px;align-items:center;padding:64px var(--v3-edge) 72px;min-height:410px}
.pg-eyebrow{margin:0;font:500 12px/normal var(--mono);letter-spacing:1.68px;text-transform:uppercase;color:var(--v3-blue-lite)}
.pg-head h1{margin:14px 0 0;max-width:12em;font-size:52px;line-height:1.05;letter-spacing:-1.5px;font-weight:700;color:#fff}
.pg-head h1 .accent{display:block;color:var(--v3-rust-lite)}
.pg-sub{margin:18px 0 0;max-width:620px;font-size:18px;line-height:1.5;color:#c4d0dc}
.pg-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.pg-spec{margin:0;border:1px solid rgba(91,155,213,.55);background:rgba(11,24,34,.55)}
.pg-spec>div{display:grid;grid-template-columns:96px minmax(0,1fr);border-bottom:1px solid rgba(91,155,213,.3)}
.pg-spec>div:last-child{border-bottom:0}
.pg-spec dt{padding:9px 10px;border-right:1px solid rgba(91,155,213,.3);font:500 10px/1.6 var(--mono);letter-spacing:1.2px;text-transform:uppercase;color:var(--v3-blue-lite)}
.pg-spec dd{margin:0;padding:9px 12px;font:500 12px/1.5 var(--mono);letter-spacing:.8px;text-transform:uppercase;color:#fff}
.pg-head h1 em{font-style:normal}
.pg-art{position:relative;align-self:center}
.pg-art img{display:block;width:100%;height:300px;object-fit:cover;border:1px solid rgba(91,155,213,.5);border-radius:10px;box-shadow:0 24px 50px rgba(0,0,0,.4)}
.pg-art .dim{z-index:3}
.pg-art .dim.is-rust{background:rgba(197,102,48,.92);border-color:var(--v3-rust-lite);color:#fff}
.pg-head-in:has(.pg-art){grid-template-columns:minmax(0,1fr) minmax(360px,540px)}
.bz-ledger{display:flex;margin:30px 0 0;max-width:520px;border-top:1px solid rgba(159,178,196,.24);border-bottom:1px solid rgba(159,178,196,.24)}
.bz-ledger>div{flex:1;padding:16px 0;padding-left:20px;border-left:1px solid rgba(159,178,196,.16)}
.bz-ledger>div:first-child{padding-left:0;border-left:0}
.bz-ledger dt{font:500 10.5px/normal var(--mono);letter-spacing:1.6px;text-transform:uppercase;color:var(--v3-mute-dark)}
.bz-ledger dd{margin:6px 0 0;font-size:20px;font-weight:700;color:#fff}
.bz-ledger dd.hot{color:var(--v3-blue-lite)}
.pg-m-cta,.pg-micro,.pg-camera{display:none}

/* ───────── Services ───────── */
.sv-cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;margin-top:36px;align-items:start}
.sv-card{display:flex;flex-direction:column;gap:10px;padding:12px 12px 20px;background:#fff;border:1px solid var(--v3-line);border-radius:14px;color:var(--v3-ink);text-decoration:none;transition:box-shadow .16s,transform .16s}
.sv-card:hover{box-shadow:0 12px 24px rgba(15,32,48,.1);transform:translateY(-2px)}
.sv-card img{width:100%;height:100px;object-fit:cover;border-radius:8px}
.sv-card b{padding:4px 6px 0;font-size:19px;font-weight:700}
.sv-card span{padding:0 6px;font-size:15px;line-height:1.45;color:var(--v3-muted)}
.sv-card i{padding:0 6px;font-style:normal;font-size:15px;font-weight:600;color:var(--v3-rust)}
.sv-mats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;margin-top:36px}
.sv-mats article{padding:14px 14px 22px;background:#fff;border:1px solid var(--v3-line);border-radius:14px}
.sv-mats img{display:block;width:100%;height:80px;object-fit:cover;border-radius:8px}
.sv-mats small,.sv-creds small{display:block;margin:16px 6px 0;padding-bottom:12px;border-bottom:1px solid var(--v3-line);font:600 10.5px/normal var(--mono);letter-spacing:1.6px;text-transform:uppercase;color:var(--v3-rust)}
.sv-mats h3{margin:14px 6px 8px;font-size:18px;font-weight:700;color:var(--v3-navy)}
.sv-mats p{margin:0 6px;font-size:14px;line-height:1.5;color:var(--v3-muted)}
.sv-creds{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;margin-top:36px}
.sv-creds article{padding:22px 22px 24px;background:#fff;border:1px solid var(--v3-line);border-radius:14px}
.sv-creds small{margin:0;padding:0;border:0}
.sv-creds h3{margin:10px 0 10px;font-size:19px;font-weight:700;color:var(--v3-navy)}
.sv-creds p{margin:0;font-size:15px;line-height:1.5;color:var(--v3-muted)}
.sv-bound{padding-block:48px}
.sv-bound-in{display:grid;grid-template-columns:260px minmax(0,1fr);gap:40px;align-items:center;max-width:1000px;padding:28px 32px;background:var(--v3-soft);border:1px solid var(--v3-line);border-radius:14px}
.sv-bound-in h2{margin:10px 0 0;font-size:22px;line-height:1.2;font-weight:700;color:var(--v3-navy)}
.sv-bound-in p:not(.v3-eyebrow){margin:0;font-size:16px;line-height:1.55;color:var(--v3-muted)}
.sv-three{display:grid;gap:10px;margin:20px 0 0;padding:0;list-style:none}
.sv-three li{display:flex;align-items:center;gap:14px;padding:10px;background:#fff;border-radius:12px}
.sv-three img{flex:none;width:76px;height:60px;object-fit:cover;border-radius:8px}
.sv-three small{display:block;font:500 10px/normal var(--mono);letter-spacing:1.2px;text-transform:uppercase;color:var(--v3-rust)}
.sv-three b{display:block;margin-top:3px;font-size:16px;font-weight:600}
.sv-three span{display:block;margin-top:2px;font-size:13px;line-height:1.35;color:var(--v3-muted)}
.sv-note{margin:14px 0 0;font-size:13px;color:var(--v3-muted)}

/* ───────── FAQ ───────── */
.fq{padding-block:64px 80px}
.fq-group{display:grid;grid-template-columns:230px minmax(0,1fr);gap:40px;align-items:start;max-width:1216px}
.fq-group+.fq-group{margin-top:56px}
.fq-label{position:sticky;top:96px}
.fq-cap{margin:10px 0 0;font-size:14px;line-height:1.45;color:var(--v3-muted);max-width:200px}
.fq-list{display:grid;gap:10px;max-width:790px}
.fq-list details{background:#fff;border:1px solid var(--v3-line);border-radius:12px;overflow:hidden}
.fq-list summary{display:flex;align-items:center;gap:12px;padding:18px 22px;list-style:none;font-size:17px;font-weight:700;line-height:1.3;color:var(--v3-navy);cursor:pointer}
.fq-list summary::-webkit-details-marker{display:none}
.fq-list summary .q{flex:none;font:700 13px/1 var(--mono);color:var(--v3-rust)}
.fq-list summary .plus{position:relative;flex:none;width:18px;height:18px;margin-left:auto}
.fq-list summary .plus::before,.fq-list summary .plus::after{content:"";position:absolute;background:var(--v3-muted);border-radius:2px}
.fq-list summary .plus::before{left:2px;right:2px;top:8px;height:2px}
.fq-list summary .plus::after{top:2px;bottom:2px;left:8px;width:2px}
.fq-list details[open] summary .plus::after{display:none}
.fq-list .ans{padding:0 22px 20px 47px;max-width:74ch;font-size:15px;line-height:1.6;color:var(--v3-muted)}
.fq-list .ans a{color:var(--v3-rust);font-weight:600;text-decoration:none}
.fq-list .ans a:hover{text-decoration:underline}
.fq-list summary:focus-visible{outline:3px solid var(--v3-blue-lite);outline-offset:-3px}

/* ───────── Work index ───────── */
.wk-feat .v3-h2{max-width:900px}
.wk-feat .v3-lede{max-width:700px;font-size:17px}
.wk-feat .hm-trip{margin-top:36px}
.wk-feat-one{grid-column:1/-1;aspect-ratio:16/7}
.wk-more{display:inline-block;margin-top:14px;font-size:15px;font-weight:600;color:var(--v3-rust);text-decoration:none}
.wk-grid{padding-block:64px 72px}
.wk-grid-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px}
.wk-grid .v3-h2{font-size:48px}
.wk-chips{display:flex;flex-wrap:wrap;gap:8px;padding-bottom:8px}
.wk-chips a{padding:7px 16px;border:1px solid #2a4560;border-radius:999px;font-size:14px;font-weight:500;color:#fff;text-decoration:none}
.wk-chips a[aria-current=page]{border-color:var(--v3-rust);background:var(--v3-rust)}
.wk-chips a:hover{border-color:var(--v3-blue-lite)}
.wk-grid .hm-cat-grid{margin-top:28px}
.wk-note{margin:16px 0 0;font-size:13px;color:var(--v3-mute-dark)}
.wk .pf-portfolio-notice{margin:16px 0 0;color:var(--v3-mute-dark)}
.wk .pf-portfolio-empty{margin-top:24px;color:var(--v3-mute-dark)}
/* C11 211:358 desktop spacing. portfolio.css gives .pf-portfolio-catalog its old 32px side padding and a
   flex result heading; these .wk rules win so the grid sits on the 1216px content edge with 20px gaps, the
   eyebrow stacks over the heading, and the Business and Send-a-photo cards get their own bands instead of
   touching. */
@media (min-width:701px){
  .wk .wk-grid{padding:96px var(--v3-edge)}
  .wk .wk-grid .pf-result-heading{display:block;margin:0}
  /* C11 211:537: eyebrow JetBrains Mono 13/500, tracking 1.56; heading 48/1.05 (portfolio.css's 1.15 and
     the navy-band eyebrow's 3px/700 otherwise win). */
  .wk .wk-grid .pf-result-heading .v3-eyebrow{font-size:13px;font-weight:500;letter-spacing:1.56px}
  .wk .wk-grid .pf-result-heading .v3-h2{margin:12px 0 0;line-height:1.05;letter-spacing:0}
  .wk .wk-grid .hm-cat-grid{gap:20px}
  .wk .hm-business{padding-block:72px 64px}
  .wk .hm-business-band{padding:36px 40px}
  .wk .hm-business-band h2{max-width:640px;margin-top:10px;line-height:1.1;letter-spacing:-.6px}
  .wk .hm-cta-card.pf-portfolio-cta{flex-wrap:nowrap;gap:32px;margin-top:0;padding:44px 40px;border-top:1px solid var(--v3-line)}
  .wk .hm-cta-card.pf-portfolio-cta .v3-eyebrow{letter-spacing:3px;font-weight:700}
  .wk .hm-cta-card.pf-portfolio-cta h2{margin:10px 0 0;font-size:38px;line-height:1.04;letter-spacing:-1px;color:var(--v3-navy)}
}
.wk .pf-portfolio-empty a{color:var(--v3-rust-lite)}

/* ───────── Business ───────── */
.bz-groups{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;margin-top:36px}
.bz-groups article{overflow:hidden;background:#fff;border:1px solid var(--v3-line);border-radius:14px}
.bz-groups img{display:block;width:100%;height:132px;object-fit:cover}
.bz-groups article>div{padding:16px 18px 20px}
.bz-groups h3{margin:0;font-size:17px;font-weight:700;color:var(--v3-ink)}
.bz-groups p{margin:6px 0 0;font-size:14px;line-height:1.45;color:var(--v3-muted)}
.bz-prog{padding-block:56px 64px}
.bz-prog-head{position:relative;z-index:1;display:flex;align-items:flex-end;justify-content:space-between;gap:40px}
.bz-prog-head .v3-h2{font-size:40px}
.bz-prog-head>p{margin:0;max-width:330px;font-size:18px;line-height:1.5;color:var(--v3-mute-dark)}
.bz-steps{position:relative;z-index:1;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;margin-top:32px}
.bz-steps article{padding:14px 14px 22px;border:1px solid #21384e;border-radius:14px;background:linear-gradient(180deg,rgba(23,48,67,.55),rgba(11,24,34,.6))}
.bz-steps article.is-hot{border-color:#8a5a3a}
.bz-steps img{display:block;width:100%;height:104px;object-fit:cover;border-radius:8px}
.bz-steps small{display:block;margin:14px 6px 0;font:500 11px/normal var(--mono);letter-spacing:1px;color:var(--v3-blue-lite)}
.bz-steps .is-hot small{color:var(--v3-rust-lite)}
.bz-steps h3{margin:8px 6px 0;font-size:18px;font-weight:700;color:#fff}
.bz-steps p{margin:10px 6px 0;font-size:14px;line-height:1.5;color:var(--v3-mute-dark)}
.bz-prog-ledger{position:relative;z-index:1;display:grid;grid-template-columns:repeat(3,1fr);margin:28px 0 0;border-top:1px solid rgba(159,178,196,.24);border-bottom:1px solid rgba(159,178,196,.24)}
.bz-prog-ledger>div{padding:18px 0 18px 24px;border-left:1px solid rgba(159,178,196,.16)}
.bz-prog-ledger>div:first-child{padding-left:0;border-left:0}
.bz-prog-ledger dt{font:500 10.5px/normal var(--mono);letter-spacing:1.6px;text-transform:uppercase;color:var(--v3-mute-dark)}
.bz-prog-ledger dd{margin:6px 0 0;font-size:20px;font-weight:700;color:#fff}
.bz-prog-ledger dd.hot{color:var(--v3-blue-lite)}
.bz-compare{width:100%;margin-top:36px;border-collapse:separate;border-spacing:0;border:1px solid var(--v3-line);border-radius:14px;overflow:hidden;background:#fff;text-align:left}
.bz-compare thead th{padding:14px 24px;background:var(--v3-soft);font:500 11px/normal var(--mono);letter-spacing:1.6px;text-transform:uppercase;color:var(--v3-muted)}
.bz-compare thead th.hot{color:var(--v3-rust)}
.bz-compare tbody th{width:28%;padding:17px 24px;border-top:1px solid var(--v3-line);font-size:16px;font-weight:700;color:var(--v3-ink)}
.bz-compare td{padding:17px 24px;border-top:1px solid var(--v3-line);font-size:15px;color:var(--v3-muted)}
.bz-compare td.hot{background:#fcf6f1;font-weight:700;color:var(--v3-ink)}
.bz-compare td i{display:inline-block;width:20px;font-style:normal;font-size:13px;color:#8a97a5}
.bz-compare td.hot i{color:var(--v3-rust)}
.bz-cta-sub{margin:10px 0 0;font-size:17px;color:var(--v3-muted)}
.bz-cta-act{display:grid;gap:10px;justify-items:center;text-align:center}
.bz-cta-act small{font-size:12px;color:var(--v3-muted)}

/* ───────── tablet ───────── */
@media (max-width:1100px){
  .pg-head-in{grid-template-columns:minmax(0,1fr)}
  .pg-spec,.pg-art{max-width:460px}
  .sv-cards,.sv-mats,.sv-creds,.bz-groups,.bz-steps{grid-template-columns:repeat(2,minmax(0,1fr))}
  .fq-group{grid-template-columns:minmax(0,1fr);gap:16px}
  .fq-label{position:static}
  .bz-prog-head{flex-direction:column;align-items:flex-start;gap:16px}
  .wk-grid-head{flex-direction:column;align-items:flex-start}
}

/* ───────── phone ───────── */
@media (max-width:700px){
  .pg-d{display:none!important}
  .pg-m{display:revert}
  .pg-camera{display:block}
  .pg-head-in{padding:30px 20px 28px;min-height:0;display:block}
  .pg-head h1{max-width:none;font-size:32px;line-height:1.08;letter-spacing:-.7px}
  .wk .pg-head h1 .accent,.fq-page .pg-head h1 .accent{display:inline}
  .pg-sub.pg-m{display:block;margin:14px 0 0;font-size:16px;line-height:1.45;color:#dfe7ee}
  .pg-m-cta{display:flex;align-items:center;justify-content:center;margin-top:22px;height:48px;border-radius:12px;background:var(--v3-rust);font-size:16px;font-weight:700;color:#fff;text-decoration:none}
  .pg-micro{display:block;margin:12px 0 0;font-size:12px;line-height:1.5;color:var(--v3-mute-dark)}
  .pg-art{display:none}
  .pg-eyebrow{color:var(--v3-rust-lite);letter-spacing:3px;font-size:11px}
  .sv-cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:20px}
  .sv-card{gap:6px;padding:10px 10px 12px;border-radius:12px}
  .sv-card img{height:76px}
  .sv-card b{font-size:15px;padding:4px 2px 0}
  .sv-card span{font-size:12.5px;padding:0 2px;line-height:1.3}
  .sv-mats{grid-template-columns:1fr;gap:12px;margin-top:20px}
  .sv-mats img{height:120px}
  .sv-creds{grid-template-columns:1fr;gap:10px;margin-top:20px}
  .sv-creds article{padding:16px 18px}
  .sv-bound-in{display:block;padding:0;border:0;background:none}
  .sv-bound-in p:not(.v3-eyebrow){margin-top:12px}
  .v3-band.sv-bound{background:#fff;padding-block:28px}
  .bz-groups{grid-template-columns:1fr;gap:10px;margin-top:20px}
  .bz-groups article{border-radius:12px}
  .bz-groups article>div{padding:14px 16px}
  .bz-groups small{display:block;margin-bottom:8px;font:500 10px/normal var(--mono);letter-spacing:1.5px;text-transform:uppercase;color:var(--v3-rust)}
  .bz-groups p{margin:0;font-size:17px;font-weight:700;line-height:1.3;color:var(--v3-ink)}
  .bz-prog{padding:36px 20px}
  .bz-prog-head .v3-h2{font-size:26px}
  .bz-prog-head>p{font-size:15px;max-width:none}
  .bz-steps{grid-template-columns:1fr;gap:12px}
  .bz-steps img{height:140px}
  .bz-prog-ledger{grid-template-columns:1fr;border-top:1px solid rgba(159,178,196,.24)}
  .bz-prog-ledger>div{display:flex;align-items:baseline;gap:18px;padding:10px 0;border-left:0}
  .bz-prog-ledger dt{width:70px}
  .bz-prog-ledger dd{font-size:16px}
  .fq{padding-block:28px 40px}
  .fq-group{display:block}
  .fq-group+.fq-group{margin-top:28px}
  .fq-label{margin-bottom:12px}
  .fq-list summary{padding:14px 16px;font-size:15px}
  .fq-list .ans{padding:0 16px 16px 40px;font-size:14px}
  .wk-grid{padding:24px 20px 20px}
  .wk-grid-head{display:block}
  .wk-grid .v3-h2{display:none}
  .wk-grid .pf-result-heading .v3-eyebrow{display:none}
  .wk-chips{flex-wrap:nowrap;overflow-x:auto;padding:0 20px 4px;margin:0 -20px;scrollbar-width:none}
  .wk-chips::-webkit-scrollbar{display:none}
  .wk-chips a{flex:none}
  .wk-grid .hm-cat-grid{grid-template-columns:1fr;gap:14px;margin-top:20px}
  .wk-grid .hm-cat-card{aspect-ratio:350/300}
  .pg-camera .v3-h2{font-size:24px}
  .pg-camera-sub{margin:10px 0 0;font-size:16px;color:var(--v3-mute-dark)}
}
