/* oya-pages.css (2026-11-15): the segment pages (frozen, fashion, ecommerce) and the FAQ on www.oya-sc.com.
   Builds on tokens.css + oya-site.css (header, footer, buttons, colours); only the page sections live here. */
.pg-page .nav-links{justify-content:flex-start;margin-inline-start:18px}
.pg-page .nav-links a.on{color:var(--accent-ink);background:var(--accent-soft)}
.pg-page .tools .rfq{min-height:44px;padding:8px 16px;font-size:14px;white-space:nowrap}
@media (max-width:980px){.pg-page .tools .rfq{display:none}}
@media (max-width:560px){.pg-page .tools .login{display:none}}

.pg-hero{background:var(--panel);color:var(--on-panel);padding:64px 0 60px}
.pg-hero .eyebrow{color:var(--on-panel-2)}
.pg-hero h1{font-size:42px;line-height:1.22;font-weight:700;margin:14px 0 14px;max-width:780px;color:var(--white)}
.pg-hero .lead{font-size:18px;color:var(--on-panel-2);max-width:720px}
.pg-hero .acts{display:flex;flex-wrap:wrap;gap:10px;margin-top:26px}
.pg-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:24px}
.pg-chips span{display:inline-flex;align-items:center;gap:8px;min-height:36px;padding:4px 14px;border:1px solid rgba(255,255,255,.28);border-radius:999px;font-size:14px;color:var(--on-panel)}
.pg-chips .ic{width:17px;height:17px}

.pg-stats{border-bottom:1px solid var(--line)}
.pg-stats .wrap{display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}
.pg-stats div{padding:22px 12px;text-align:center}
.pg-stats div+div{border-inline-start:1px solid var(--line)}
.pg-stats b{display:block;font-size:28px;line-height:1.2;color:var(--accent-ink);font-variant-numeric:tabular-nums}
.pg-stats span{font-size:14px;color:var(--ink-2)}

.pg{padding:60px 0}
.pg.alt{background:var(--tint)}
.pg .sec-head{max-width:760px;margin-bottom:28px}
.pg .sec-title{font-size:30px}
.pg-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.pg-grid.g3{grid-template-columns:repeat(3,minmax(0,1fr))}
.pg-card{background:var(--card);border:1px solid var(--line-2);border-radius:var(--r-lg);padding:22px}
.pg-card .ico{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:var(--r);background:var(--accent-soft);color:var(--accent-ink)}
.pg-card .ico .ic{width:22px;height:22px}
.pg-card h3{font-size:17.5px;font-weight:700;margin:12px 0 6px;color:var(--ink)}
.pg-card p{color:var(--ink-2);font-size:15px}
.pg-card .pain{display:block;font-size:13.5px;color:var(--err);font-weight:700;margin-top:12px}

.pg-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 24px}
.pg-list li{display:flex;gap:10px;align-items:flex-start;font-size:15.5px;color:var(--ink)}
.pg-list li .ic{flex:none;margin-top:4px;color:var(--ok)}

.pg-steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;counter-reset:st}
.pg-steps li{background:var(--card);border:1px solid var(--line-2);border-radius:var(--r-lg);padding:20px;position:relative}
.pg-steps li::before{counter-increment:st;content:counter(st);display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:999px;background:var(--accent);color:var(--on-accent);font-weight:700;margin-bottom:10px}
.pg-steps h3{font-size:16.5px;font-weight:700;margin-bottom:4px}
.pg-steps p{color:var(--ink-2);font-size:14.5px}

.pg-note{display:flex;gap:12px;align-items:flex-start;background:var(--res-bg);border:1px solid var(--res-line);border-radius:var(--r-lg);padding:16px 18px;margin-top:22px;color:var(--ink)}
.pg-note .ic{flex:none;margin-top:3px;color:var(--accent-ink)}
.pg-offer{display:flex;gap:14px;align-items:center;flex-wrap:wrap;border:1.5px dashed var(--gold);border-radius:var(--r-lg);padding:18px 20px;margin-top:22px;background:var(--card)}
.pg-offer b{font-size:17px;color:var(--gold-ink)}
.pg-offer p{color:var(--ink-2);font-size:14.5px;flex:1 1 280px}

.pg-faq{display:grid;gap:10px;max-width:860px}
.pg-faq details{background:var(--card);border:1px solid var(--line-2);border-radius:var(--r-lg)}
.pg-faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:12px;min-height:56px;padding:12px 18px;font-weight:700;font-size:16px;color:var(--ink)}
.pg-faq summary::-webkit-details-marker{display:none}
.pg-faq summary::after{content:"";flex:none;width:9px;height:9px;border:solid var(--accent-ink);border-width:0 2px 2px 0;transform:rotate(45deg);margin-top:-4px;transition:transform 200ms}
.pg-faq details[open] summary::after{transform:rotate(-135deg);margin-top:4px}
.pg-faq .a{padding:0 18px 16px;color:var(--ink-2);font-size:15.5px}
.pg-faq .a a{text-decoration:underline;text-underline-offset:.2em}
.pg-more{margin-top:18px}
.pg-more a{font-weight:700;text-decoration:underline;text-underline-offset:.2em}

.pg-cta{background:var(--panel);color:var(--on-panel);padding:52px 0}
.pg-cta .wrap{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap}
.pg-cta h2{font-size:28px;font-weight:700;color:var(--white)}
.pg-cta p{color:var(--on-panel-2);margin-top:6px;max-width:620px}
.pg-cta .acts{display:flex;gap:10px;flex-wrap:wrap}

.pg-segs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.pg-segs a{display:block;background:var(--card);border:1px solid var(--line-2);border-radius:var(--r-lg);padding:20px;color:var(--ink)}
.pg-segs a:hover{border-color:var(--accent-ink)}
.pg-segs b{display:flex;align-items:center;gap:10px;font-size:16.5px;color:var(--accent-ink)}
.pg-segs span{display:block;color:var(--ink-2);font-size:14.5px;margin-top:6px}

@media (min-width:981px){.pg-page footer .wrap{grid-template-columns:2fr 1fr 1fr 1fr}}
@media (max-width:980px){
  .pg-steps{grid-template-columns:repeat(2,minmax(0,1fr))}
  .pg-grid.g3,.pg-segs{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:700px){
  .pg-hero{padding:40px 0 40px}
  .pg-hero h1{font-size:29px}
  .pg-hero .lead{font-size:16.5px}
  .pg-hero .acts .btn{flex:1 1 100%}
  .pg-stats .wrap{grid-template-columns:repeat(2,minmax(0,1fr))}
  .pg-stats div:nth-child(3){border-inline-start:0}
  .pg-stats div:nth-child(n+3){border-top:1px solid var(--line)}
  .pg{padding:40px 0}
  .pg .sec-title{font-size:24px}
  .pg-grid,.pg-grid.g3,.pg-list,.pg-steps,.pg-segs{grid-template-columns:minmax(0,1fr)}
  .pg-cta h2{font-size:23px}
  .pg-cta .acts,.pg-cta .acts .btn{width:100%}
}