/* Bundlesandkits inner pages: page hero, about story, values, free resources (+ search), contact.
   Same rules as styles.css: flat fills, no resting shadows, no hairlines, surfaces separated by tone. */

/* shared */
.pg .eyebrow{display:inline-block;margin:0;font-family:var(--font-body);font-weight:800;font-size:var(--fs-small);letter-spacing:.12em;text-transform:uppercase;color:var(--accent)}
.band-ink.pg .eyebrow,.band-red.pg .eyebrow{color:var(--accent-soft)}
.pg.section-tight{padding:clamp(32px, 4vw, 48px) 0}
.pg.section-flush{padding:0}
.pg a:focus-visible,.pg button:focus-visible,.pg input:focus-visible,.pg select:focus-visible,.pg textarea:focus-visible{outline:3px solid var(--accent);outline-offset:3px}
.band-ink.pg a:focus-visible,.band-ink.pg button:focus-visible{outline-color:var(--accent-soft)}

/* page hero */
.pg-hero{padding:clamp(48px, 7vw, 104px) 0 clamp(40px, 5vw, 72px)}
.pg-hero .head{margin-bottom:0;gap:18px}
.pg-hero h1{font-size:clamp(2rem, 1.2rem + 4.6vw, 4.6rem);line-height:.98;max-width:16ch}
.pg-hero .lead{color:var(--muted)}
.band-ink.pg-hero .lead,.band-red.pg-hero .lead{color:var(--on-ink)}
.pg-hero .btn{margin-top:8px}

/* about story */
.pg-story-grid{display:grid;gap:clamp(32px, 5vw, 72px);align-items:start}
.pg-story-copy{display:grid;gap:18px;max-width:64ch}
.pg-story-copy p:not(.eyebrow){font-size:var(--fs-body);line-height:1.65}
.pg-story-copy h2{margin-bottom:6px}
.pg-stats{margin:0;display:grid;gap:8px}
.pg-stats div{background:var(--tint);padding:22px 24px}
.band-tint .pg-stats div{background:var(--card)}
.band-ink .pg-stats div{background:rgba(255,255,255,.07)}
.pg-stats dt{font-family:var(--font-display);font-weight:800;font-size:var(--fs-stat);line-height:1;letter-spacing:-.03em;color:var(--accent)}
.band-ink .pg-stats dt{color:var(--accent-soft)}
.pg-stats dd{margin:8px 0 0;font-weight:700;color:var(--muted)}
.band-ink .pg-stats dd{color:var(--on-ink)}
@media (min-width:900px){
  .pg-story-grid{grid-template-columns:minmax(0,1.6fr) minmax(0,1fr)}
}

/* values */
.pg-values-list{list-style:none;margin:0 auto;padding:0;max-width:1000px;display:grid;gap:8px;counter-reset:pgv}
.pg-values-list li{counter-increment:pgv;background:var(--card);padding:28px 26px;display:grid;gap:10px;align-content:start}
.pg-values-list li::before{content:counter(pgv, decimal-leading-zero);font-family:var(--font-display);font-weight:800;font-size:1.4rem;color:var(--accent);line-height:1}
.pg-values .lead{color:var(--muted)}
.pg-values:not(.band-tint) .pg-values-list li{background:var(--tint)}
.band-ink .pg-values-list li{background:rgba(255,255,255,.07)}
.band-ink .pg-values-list li p,.band-ink.pg-values .lead{color:var(--on-ink)}
.pg-values-list p{color:var(--muted)}
@media (min-width:640px){.pg-values-list{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* free resources: search + chips */
.pg-res-tools{max-width:860px;margin:0 auto 28px;display:grid;gap:14px;justify-items:center}
.pg-search{position:relative;width:100%}
.pg-search-ico{position:absolute;left:20px;top:50%;transform:translateY(-50%);color:var(--muted);pointer-events:none}
.pg-search input{width:100%;min-height:60px;margin:0;padding:0 22px 0 54px;border:2px solid transparent;border-radius:999px;background:var(--tint);color:var(--ink);font-family:var(--font-body);font-size:var(--fs-lead);font-weight:700;-webkit-appearance:none;appearance:none;transition:background-color 150ms ease,border-color 150ms ease}
.pg-search input::placeholder{color:var(--muted);opacity:1;font-weight:600}
.pg-search input:hover{background:var(--tint-2)}
.pg-search input:focus{outline:none}
.pg-search input:focus-visible{background:var(--card);border-color:var(--ink);outline:3px solid var(--accent);outline-offset:3px}
.pg-search input::-webkit-search-cancel-button{-webkit-appearance:none;appearance:none;width:18px;height:18px;cursor:pointer;background:var(--ink);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 6l12 12M18 6L6 18' stroke='black' stroke-width='3' stroke-linecap='round'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 6l12 12M18 6L6 18' stroke='black' stroke-width='3' stroke-linecap='round'/%3E%3C/svg%3E") center/contain no-repeat}
.band-tint .pg-search input{background:var(--card)}
.pg-res-chips{display:flex;flex-wrap:wrap;justify-content:center;gap:8px}
.pg-res-count{margin:0;font-size:var(--fs-small);font-weight:700;color:var(--muted)}
.pg-res-empty{max-width:560px;margin:8px auto 0;padding:36px 24px;background:var(--tint);text-align:center;display:grid;gap:18px;justify-items:center}
.pg-res-empty p{font-size:var(--fs-lead);font-weight:700}

/* free resources: grid */
.pg-res-grid{list-style:none;margin:0;padding:0;display:grid;gap:16px;grid-template-columns:minmax(0,1fr)}
.pg-res{background:var(--card);padding:28px 26px;display:flex;flex-direction:column;gap:12px;transition:transform 200ms var(--ease-out)}
.pg-res[hidden]{display:none!important}
.pg-resources:not(.band-tint) .pg-res{background:var(--tint)}
.pg-res-type{align-self:flex-start;margin:0;padding:4px 12px;border-radius:999px;background:var(--accent);color:var(--card);font-size:var(--fs-small);font-weight:800;letter-spacing:.04em}
.pg-res h3{font-size:1.25rem}
.pg-res-text{color:var(--muted);flex:1}
.pg-res-foot{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;margin-top:6px}
.pg-res-meta{font-size:var(--fs-small);font-weight:700;color:var(--muted)}
.pg-res .btn{min-height:46px;padding:.6em 1.3em;font-size:.95rem}
@media (hover:hover) and (pointer:fine){
  .pg-res:hover{transform:translateY(-3px)}
  .pg-res .btn-ink:hover{background:var(--accent);border-color:var(--accent)}
}
@media (min-width:640px){.pg-res-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1000px){.pg-res-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}

/* contact */
.pg-contact-grid{display:grid;gap:clamp(24px, 4vw, 48px);align-items:start}
.pg-contact-main{display:grid;gap:20px;min-width:0}
.pg-form{display:grid;gap:18px}
.pg-field-row{display:grid;gap:18px}
.pg-field{margin:0;display:grid;gap:8px}
.pg-field label{font-weight:800}
.pg-field input,.pg-field select,.pg-field textarea{width:100%;margin:0;min-height:56px;padding:14px 18px;border:2px solid transparent;border-radius:16px;background:var(--tint);color:var(--ink);font-family:var(--font-body);font-size:var(--fs-body);font-weight:600;-webkit-appearance:none;appearance:none;transition:background-color 150ms ease,border-color 150ms ease}
.pg-field textarea{min-height:160px;resize:vertical;line-height:1.55}
.pg-field select{padding-right:48px;cursor:pointer;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9'%3E%3Cpath d='M1 1l6 6 6-6' fill='none' stroke='%23141118' stroke-width='2.5' stroke-linecap='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 20px center}
.pg-field input:hover,.pg-field select:hover,.pg-field textarea:hover{background-color:var(--tint-2)}
.pg-field input:focus,.pg-field select:focus,.pg-field textarea:focus{outline:none}
.pg-field input:focus-visible,.pg-field select:focus-visible,.pg-field textarea:focus-visible{background-color:var(--card);border-color:var(--ink);outline:3px solid var(--accent);outline-offset:3px}
.band-tint .pg-field input,.band-tint .pg-field select,.band-tint .pg-field textarea{background-color:var(--card)}
.pg-form .btn{justify-self:start}
.pg-hp{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}
.pg-notice{margin:0;padding:16px 20px;border-radius:16px;font-weight:700}
.pg-notice-ok{background:var(--ink);color:var(--card)}
.pg-notice-err{background:#FBE3E6;color:#7A0E1C}
.pg-contact-side{background:var(--ink);color:var(--card);padding:clamp(24px, 3vw, 36px);display:grid;gap:22px;align-content:start}
.pg-contact-side h3{font-family:var(--font-display);font-size:1.3rem;letter-spacing:-.02em}
.pg-side-item{display:grid;gap:6px}
.pg-side-item p{color:var(--on-ink)}
.pg-side-label{margin:0;font-size:var(--fs-small);font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--accent-soft)!important}
.pg-side-mail{font-weight:800;font-size:var(--fs-lead);color:var(--card);overflow-wrap:anywhere;text-decoration-color:var(--accent-soft);text-decoration-thickness:2px;text-underline-offset:5px}
.pg-contact-side .btn-o{justify-self:start;border-color:var(--card);color:var(--card)}
.pg-contact-side a:focus-visible{outline-color:var(--accent-soft)}
@media (hover:hover) and (pointer:fine){
  .pg-side-mail:hover{color:var(--accent-soft)}
  .pg-contact-side .btn-o:hover{background:var(--card);color:var(--ink)}
}
@media (min-width:640px){.pg-field-row{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:960px){.pg-contact-grid{grid-template-columns:minmax(0,1.7fr) minmax(0,1fr)}}

/* small phones (360px) */
@media (max-width:420px){
  .pg-hero h1{font-size:1.9rem}
  .pg-res,.pg-values-list li,.pg-stats div{padding:22px 18px}
  .pg-res-foot{flex-direction:column;align-items:stretch}
  .pg-res .btn,.pg-form .btn,.pg-contact-side .btn-o,.pg-hero .btn{width:100%;justify-self:stretch}
  .pg-search input{font-size:var(--fs-body);padding-left:48px}
  .pg-search-ico{left:16px}
}

@media (prefers-reduced-motion:reduce){
  .pg-res,.pg-search input,.pg-field input,.pg-field select,.pg-field textarea{transition:none}
  .pg-res:hover{transform:none}
}