/*
Theme Name: Good Parts Store
Theme URI: https://goodpartsstore.com
Author: Good Parts Store
Author URI: https://goodpartsstore.com
Description: A parts-sourcing landing theme with a specialist order-desk aesthetic. Two-color letterpress palette, slab + editorial serif type, and a one-page request flow. Built for the "we can source any part you need" pitch.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.5
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: good-parts-store
*/

:root{
    --paper:#E7E3D6;
    --paper-2:#F2EEE2;
    --ink:#211D17;
    --ink-2:#544D42;
    --ox:#8C2E20;
    --ox-deep:#6C2216;
    --rule:rgba(33,29,23,.30);
    --rule-soft:rgba(33,29,23,.14);
    --wrap:1140px;
  }
  *{box-sizing:border-box;margin:0;padding:0}
  html{scroll-behavior:smooth}
  body{
    font-family:"Newsreader",Georgia,serif;
    background:var(--paper);color:var(--ink);
    font-size:18px;line-height:1.62;-webkit-font-smoothing:antialiased;
  }
  .top-rule{height:5px;background:var(--ox)}
  a{color:inherit;text-decoration:none}
  .wrap{max-width:var(--wrap);margin:0 auto;padding:0 26px}

  .kicker{
    font-family:"Courier Prime",monospace;font-size:.72rem;font-weight:700;
    letter-spacing:.24em;text-transform:uppercase;color:var(--ox);
  }
  .kicker.light{color:#E9C9BF}
  h1,h2,h3{font-family:"Zilla Slab",serif;font-weight:700;line-height:1.05;letter-spacing:-.01em}

  /* header */
  header{position:sticky;top:0;z-index:60;background:rgba(231,227,214,.92);backdrop-filter:blur(6px);border-bottom:1px solid var(--rule)}
  .bar{display:flex;align-items:center;justify-content:space-between;height:70px}
  .word{display:flex;align-items:baseline;gap:12px}
  .word b{font-family:"Zilla Slab";font-weight:700;font-size:1.24rem;letter-spacing:-.01em}
  .word .no{font-family:"Courier Prime";font-size:.7rem;color:var(--ink-2);letter-spacing:.1em}
  nav.links{display:flex;gap:30px}
  nav.links a{font-family:"Zilla Slab";font-weight:500;font-size:.98rem;color:var(--ink-2);transition:color .15s}
  nav.links a:hover{color:var(--ox)}
  .req-btn{
    font-family:"Zilla Slab";font-weight:600;font-size:.95rem;
    background:var(--ox);color:var(--paper-2);padding:10px 20px;border:0;border-radius:2px;cursor:pointer;
    box-shadow:2px 2px 0 var(--ox-deep);transition:transform .1s, box-shadow .1s, background .15s;
  }
  .req-btn:hover{background:var(--ox-deep);transform:translate(1px,1px);box-shadow:1px 1px 0 var(--ox-deep)}

  /* hero */
  .hero{padding:70px 0 84px}
  .hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:60px;align-items:center}
  .hero h1{font-size:clamp(2.7rem,6vw,4.6rem);margin:16px 0 0}
  .hero h1 .ox{color:var(--ox)}
  .hero .sub{margin-top:22px;max-width:44ch;font-size:1.22rem;color:var(--ink-2)}
  .hero .sub em{font-style:italic;color:var(--ink)}

  .req{margin-top:34px;max-width:480px}
  .req .label{font-family:"Courier Prime";font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-2)}
  .req .line{display:flex;align-items:center;border-bottom:2px solid var(--ink);margin-top:6px}
  .req input{flex:1;border:0;outline:0;background:transparent;font-family:"Newsreader";font-size:1.08rem;color:var(--ink);padding:8px 2px}
  .req input::placeholder{color:#9a9282;font-style:italic}
  .req .go{margin-top:20px;display:flex;align-items:center;gap:16px}
  .req .go .note{font-family:"Courier Prime";font-size:.74rem;color:var(--ink-2);line-height:1.4}
  .send{
    font-family:"Zilla Slab";font-weight:600;font-size:1rem;background:var(--ink);color:var(--paper-2);
    padding:12px 24px;border:0;border-radius:2px;cursor:pointer;white-space:nowrap;
    box-shadow:3px 3px 0 rgba(33,29,23,.35);transition:transform .1s, box-shadow .1s, background .15s;
  }
  .send:hover{background:#000;transform:translate(1px,1px);box-shadow:2px 2px 0 rgba(33,29,23,.35)}

  /* order card */
  .card-wrap{display:flex;justify-content:center;perspective:1000px}
  .card{
    position:relative;width:100%;max-width:430px;background:var(--paper-2);
    border:1px solid var(--rule);border-radius:3px;padding:26px 28px 40px;
    transform:rotate(1.4deg);
    box-shadow:10px 12px 0 rgba(33,29,23,.07), 0 34px 54px -30px rgba(33,29,23,.55);
  }
  .card .head{display:flex;justify-content:space-between;align-items:baseline;border-bottom:2px solid var(--ink);padding-bottom:10px}
  .card .head b{font-family:"Zilla Slab";font-weight:700;font-size:1.02rem;letter-spacing:.02em;text-transform:uppercase}
  .card .head span{font-family:"Courier Prime";font-size:.72rem;color:var(--ink-2)}
  .field{margin-top:16px}
  .field .k{font-family:"Courier Prime";font-size:.6rem;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-2)}
  .field .v{font-family:"Courier Prime";font-size:.94rem;color:var(--ink);border-bottom:1px solid var(--rule-soft);padding:4px 2px 6px;margin-top:3px}
  .stamp{
    position:absolute;right:16px;bottom:18px;transform:rotate(-11deg);
    color:var(--ox);border:3px solid var(--ox);border-radius:7px;padding:8px 14px 9px;
    text-align:center;opacity:.85;mix-blend-mode:multiply;box-shadow:inset 0 0 0 1.5px var(--ox);
  }
  .stamp b{display:block;font-family:"Zilla Slab";font-weight:700;font-size:1.5rem;letter-spacing:.16em;line-height:1}
  .stamp small{display:block;font-family:"Courier Prime";font-size:.52rem;letter-spacing:.28em;margin-top:4px}

  /* sections */
  section{padding:90px 0}
  h2.sec{font-size:clamp(2rem,4vw,3rem);margin-top:12px}

  /* what we do */
  .do-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:64px}
  .do-intro h2{font-size:clamp(1.9rem,3.5vw,2.7rem);margin-top:14px}
  .do-intro .lead{margin-top:20px;color:var(--ink-2);font-size:1.12rem}
  .do-item{display:grid;grid-template-columns:52px 1fr;gap:20px;padding:26px 0;border-top:1px solid var(--rule)}
  .do-item:first-child{border-top:2px solid var(--ink)}
  .do-item .ref{font-family:"Zilla Slab";font-weight:700;font-size:2rem;color:var(--ox);line-height:1}
  .do-item h3{font-size:1.4rem;margin-bottom:6px}
  .do-item p{color:var(--ink-2);font-size:1.04rem}

  /* how it works — order sheet */
  .how{background:var(--paper-2);border-top:1px solid var(--rule);border-bottom:1px solid var(--rule)}
  .sheet{width:100%;border-collapse:collapse;margin-top:40px}
  .sheet th{
    font-family:"Courier Prime";font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;
    color:var(--ink-2);text-align:left;padding:0 18px 14px;border-bottom:2px solid var(--ink)
  }
  .sheet td{padding:24px 18px;border-bottom:1px solid var(--rule);vertical-align:top}
  .sheet tr{transition:background .12s}
  .sheet tbody tr:hover{background:rgba(140,46,32,.05)}
  .sheet .no{font-family:"Courier Prime";font-weight:700;color:var(--ox);font-size:1.05rem;width:70px}
  .sheet .st{font-family:"Zilla Slab";font-weight:600;font-size:1.22rem;width:32%}
  .sheet .wh{color:var(--ink-2);font-size:1.04rem}

  /* categories — catalog index */
  .cat-note{margin-top:16px;color:var(--ink-2);max-width:52ch;font-size:1.1rem}
  .index{display:grid;grid-template-columns:1fr 1fr;gap:0 56px;margin-top:44px}
  .idx{display:flex;align-items:baseline;gap:12px;padding:15px 0;border-bottom:1px solid var(--rule-soft)}
  .idx:hover .idx-name{color:var(--ox)}
  .idx-name{font-family:"Zilla Slab";font-weight:600;font-size:1.16rem;transition:color .12s}
  .idx-dots{flex:1;border-bottom:2px dotted var(--rule);transform:translateY(-5px)}
  .idx-code{font-family:"Courier Prime";font-size:.82rem;color:var(--ink-2)}

  /* vow band */
  .vow{background:var(--ox);color:#F4E7E3}
  .vow-grid{display:grid;grid-template-columns:1.3fr .7fr;gap:60px;align-items:center}
  .vow h2{color:#fff;font-size:clamp(2rem,4vw,3rem);margin-top:14px}
  .vow p{margin-top:20px;font-size:1.16rem;color:#F0D8D2;max-width:50ch}
  .vow p b{color:#fff;font-weight:600}
  .vows{list-style:none;margin-top:26px;display:flex;flex-direction:column;gap:12px}
  .vows li{font-family:"Zilla Slab";font-weight:500;font-size:1.06rem;display:flex;align-items:baseline;gap:12px;color:#fff}
  .vows li::before{content:"✓";color:#F4C9BF;font-weight:700}
  .vow-stamp{display:flex;justify-content:center}
  .stamp.big{position:static;transform:rotate(-8deg);color:#F4E7E3;border-color:#F4E7E3;box-shadow:inset 0 0 0 1.5px #F4E7E3;opacity:.92;mix-blend-mode:normal;padding:16px 22px 18px}
  .stamp.big b{font-size:2.3rem}
  .stamp.big small{font-size:.62rem}

  /* start / request form */
  .start{background:var(--paper-2);border-bottom:1px solid var(--rule)}
  .start-card{max-width:720px;margin:0 auto;text-align:center}
  .start h2{font-size:clamp(2rem,4.5vw,3.2rem);margin-top:12px}
  .start .blurb{margin:18px auto 0;max-width:46ch;color:var(--ink-2);font-size:1.12rem}
  .form3{display:grid;grid-template-columns:1fr 1fr;gap:22px 34px;margin:38px auto 0;max-width:600px;text-align:left}
  .form3 .f-wide{grid-column:1 / -1}
  .form3 .label{font-family:"Courier Prime";font-size:.64rem;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-2)}
  .form3 .line{border-bottom:2px solid var(--ink);margin-top:6px}
  .form3 input{width:100%;border:0;outline:0;background:transparent;font-family:"Newsreader";font-size:1.06rem;padding:8px 2px}
  .form3 input::placeholder{color:#9a9282;font-style:italic}
  .start .send{margin-top:34px}
  .confirm{display:none;margin:22px auto 0;max-width:600px;background:var(--ink);color:var(--paper-2);border-left:4px solid var(--ox);padding:14px 18px;font-family:"Courier Prime";font-size:.86rem;text-align:left}

  /* footer */
  footer{background:var(--ink);color:#b8b1a4;padding:64px 0 30px}
  .foot{display:grid;grid-template-columns:1.7fr 1fr 1fr 1fr;gap:40px}
  footer .word b{color:#fff}
  footer .word .no{color:#8a8272}
  footer .blurb{margin-top:14px;max-width:32ch;color:#8f887b;font-size:1rem}
  footer h4{font-family:"Courier Prime";font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;color:#E9C9BF;margin-bottom:15px}
  footer ul{list-style:none}
  footer li{margin-bottom:9px}
  footer li a{color:#b8b1a4;font-size:1rem;transition:color .12s}
  footer li a:hover{color:#fff}
  .colophon{margin-top:46px;padding-top:22px;border-top:1px solid rgba(255,255,255,.12);display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;font-family:"Courier Prime";font-size:.76rem;color:#7d7669}

  :focus-visible{outline:3px solid var(--ox);outline-offset:2px;border-radius:2px}

  @media(max-width:900px){
    nav.links{display:none}
    .hero-grid{grid-template-columns:1fr;gap:48px}
    .card{transform:rotate(1deg);max-width:400px;margin:0 auto}
    .do-grid{grid-template-columns:1fr;gap:36px}
    .vow-grid{grid-template-columns:1fr;gap:40px}
    .index{grid-template-columns:1fr}
  }
  @media(max-width:560px){
    body{font-size:17px}
    section{padding:64px 0}
    .form3{grid-template-columns:1fr}
    .sheet .st{width:auto}
    .foot{grid-template-columns:1fr 1fr}
    .req .go{flex-direction:column;align-items:flex-start;gap:12px}
  }
  @media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}}