/*
Theme Name: Greg Schwartz 2026
Theme URI: https://gregschwartz.net
Author: Greg Schwartz
Description: Dark instrument panel theme for gregschwartz.net. Mobile first.
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: gregschwartz
*/

/* base */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:#07090B;color:#E6E9EE;font-family:'IBM Plex Sans',system-ui,sans-serif;font-size:16px;line-height:1.5;-webkit-font-smoothing:antialiased}
a{color:#7CF2C4;text-decoration:none}
a:hover{text-decoration:underline}
a.tile:hover,a.box:hover,a.row:hover,a.btn:hover,a.btn-o:hover,a.btn-f:hover,a.nolink:hover{text-decoration:none}
h1,h2,h3,h4{font-family:Archivo,sans-serif;letter-spacing:-0.02em;margin:0;color:#FFFFFF;line-height:1.1}
p{margin:0}
img{max-width:100%;height:auto}
.mono{font-family:'JetBrains Mono',monospace}
.wrap{max-width:1200px;margin:0 auto}
.pad{padding-left:28px;padding-right:28px}
.screen-reader-text{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}

/* site header */
.site-header{width:100%;padding:18px 28px;border-bottom:1px solid #22272E}
.site-header .nav-row{max-width:1200px;margin:0 auto;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px}
.site-header .brand{font-family:'JetBrains Mono',monospace;font-size:14px;color:#E6E9EE}
.site-header .brand span{color:#7CF2C4}
.nav{display:flex;flex-wrap:wrap;gap:26px;font-size:15px;font-weight:500}
.nav a{color:#E6E9EE}
.nav a.on{color:#7CF2C4}

/* site footer */
.site-footer{width:100%;padding:56px 28px;border-top:1px solid #22272E;margin-top:auto;background:#0F1216}
.site-footer .inner{max-width:1200px;margin:0 auto;display:flex;flex-wrap:wrap;justify-content:space-between;gap:24px}
.site-footer .who{display:flex;flex-direction:column;gap:8px}
.site-footer .name{font-family:Archivo,sans-serif;font-weight:700;font-size:22px;color:#FFFFFF}
.site-footer .links{display:flex;flex-wrap:wrap;gap:24px;font-size:13px;align-self:flex-end;font-family:'JetBrains Mono',monospace}
.site-footer .links a{color:#E6E9EE}
.site-footer .off{font-family:'JetBrains Mono',monospace;font-size:12px;color:#6F7886;margin-top:8px}

/* generic pages (contact, press, old portfolio) */
.site{min-height:100vh;display:flex;flex-direction:column}
.prose-head{padding:72px 28px 24px}
.prose-head .wrap{max-width:760px}
.prose-head h1{font-size:56px;font-weight:900;line-height:1}
.prose{padding:0 28px 96px;flex:1}
.prose .wrap{max-width:760px}
.prose p,.prose li{font-size:17px;line-height:1.65;color:#AEB5C0;margin:0 0 1.1em}
.prose h2{font-size:28px;font-weight:700;margin:2em 0 .6em}
.prose h3{font-size:21px;font-weight:700;margin:1.6em 0 .5em}
.prose h4{font-size:17px;font-weight:700;margin:1.4em 0 .4em}
.prose ul,.prose ol{padding-left:1.3em;margin:0 0 1.2em}
.prose hr{border:0;border-top:1px solid #22272E;margin:2.5em 0}
.prose blockquote{margin:1.5em 0;padding:16px 24px;border-left:3px solid #7CF2C4;background:#0F1216;border-radius:0 6px 6px 0}
.prose figure{margin:1.5em 0}
.prose figcaption{font-family:'JetBrains Mono',monospace;font-size:12px;color:#6F7886;margin-top:8px}
.prose img{border-radius:6px}
.prose table{border-collapse:collapse;width:100%;margin:0 0 1.5em;font-size:15px}
.prose th,.prose td{border:1px solid #22272E;padding:10px 12px;text-align:left;color:#AEB5C0}
.prose th{color:#E6E9EE}
.prose code{font-family:'JetBrains Mono',monospace;font-size:.9em;background:#121519;padding:2px 6px;border-radius:3px}
.prose pre{background:#121519;border:1px solid #22272E;border-radius:6px;padding:16px;overflow:auto;font-size:14px}
.prose .wp-block-buttons a,.prose .wp-block-button__link,.prose .wp-element-button{display:inline-flex;align-items:center;min-height:48px;padding:0 22px;background:#7CF2C4;color:#07090B;border-radius:3px;font-weight:700;font-size:15px;text-decoration:none;border:0}
.prose .wp-block-file{margin:0 0 1.5em}
.prose .wp-block-file object{width:100%;height:90vh;min-height:600px;border:1px solid #22272E;border-radius:6px;background:#0F1216}
.prose .wp-block-file a:not(.wp-block-file__button){display:block;margin:0 0 12px}
.prose .wp-block-file__button{margin-top:8px}
.prose .gutentor-text,.prose .gutentor-element p{color:#AEB5C0}
.prose .wp-block-columns{gap:24px}
.prose .alignwide,.prose .alignfull{max-width:none}

/* forms (WPForms and core) */
.prose input[type=text],.prose input[type=email],.prose input[type=url],.prose input[type=tel],.prose input[type=number],.prose textarea,.prose select{width:100%;background:#0F1216;color:#E6E9EE;border:1px solid #3A4150;border-radius:3px;padding:12px 14px;font:inherit;font-size:16px}
.prose input:focus,.prose textarea:focus{outline:2px solid #7CF2C4;outline-offset:1px;border-color:#7CF2C4}
.prose label,.prose .wpforms-field-label{display:block;font-family:'JetBrains Mono',monospace;font-size:13px;color:#AEB5C0;margin-bottom:6px}
.prose .wpforms-field{margin-bottom:18px}
.prose .wpforms-field-sublabel{font-size:12px;color:#6F7886}
.prose button,.prose input[type=submit],.prose .wpforms-submit{display:inline-flex;align-items:center;min-height:50px;padding:0 24px;background:#7CF2C4;color:#07090B;border:0;border-radius:3px;font:inherit;font-weight:700;font-size:16px;cursor:pointer}
.prose .wpforms-confirmation-container-full{background:#0F1216;border:1px solid #7CF2C4;color:#E6E9EE;padding:20px;border-radius:6px}
.prose .wpforms-error{color:#FF8A5B}

/* full bleed pages: home, case study, public work, resume */
.full{display:flex;flex-direction:column;flex:1}

/* shared components used by the page markup */
.box{padding:22px;border-right:3px solid #D7DEE5;border-bottom:3px solid #D7DEE5;display:flex;flex-direction:column;justify-content:space-between;gap:12px;color:#E6E9EE;min-height:230px}
.box:hover{background:#0F1216}
.hero{display:grid;grid-template-columns:repeat(12,minmax(0,1fr))}
.hero-main{grid-column:span 8}
.hero-side{grid-column:span 4}
.six{display:grid;grid-template-columns:repeat(6,minmax(0,1fr))}
.bento{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:16px}
.span7{grid-column:span 7}.span5{grid-column:span 5}.span4{grid-column:span 4}
.two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.split{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:32px}
.s4{grid-column:span 4}.s8{grid-column:span 8}.s12{grid-column:span 12}
.quotes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:48px}
.h1{font-size:clamp(40px,10.5vw,168px);line-height:.9;font-weight:900;letter-spacing:-0.04em;white-space:nowrap}
.h3{font-size:clamp(17px,4.6vw,34px);line-height:1.15;font-weight:500;color:#7CF2C4;white-space:nowrap}
.big{font-size:44px;font-weight:900}
.huge{font-size:72px}
.mid{font-size:36px;font-weight:900}
.btn-o{display:inline-flex;align-items:center;justify-content:center;min-height:36px;padding:0 16px;border:1px solid #7CF2C4;border-radius:3px;color:#7CF2C4;font-family:'JetBrains Mono',monospace;font-size:13px;font-weight:500;transition:background .15s,color .15s}
a:hover .btn-o,a.btn-o:hover{background:#7CF2C4;color:#07090B}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:50px;padding:0 24px;border-radius:3px;font-weight:700;font-size:16px}
.btn-f{background:#7CF2C4;color:#07090B}
.btn.btn-o{font-size:14px}
.tile{background:#121519;border:1px solid #22272E;transition:border-color .2s,transform .2s;color:#E6E9EE}
.tile:hover{border-color:#7CF2C4;transform:translateY(-2px)}
.row{display:flex;flex-wrap:wrap;gap:8px 24px;align-items:center;padding:14px 0;border-top:1px solid #22272E;color:#E6E9EE;transition:padding-left .2s}
.row:hover{padding-left:8px}
.row:hover .t{color:#7CF2C4}
.rowt{font-family:Archivo,sans-serif;font-weight:700;font-size:20px;flex:1 1 240px}
.stats{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:1px;background:#22272E;border:1px solid #22272E;border-radius:6px;overflow:hidden}
.stat{padding:22px 20px;background:#07090B;display:flex;flex-direction:column;justify-content:space-between;gap:8px}
.embed{width:100%;height:90vh;min-height:600px;border:1px solid #22272E;border-radius:6px;background:#0F1216}
.phone-note{display:none}

/* animations */
@keyframes marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.marquee{display:flex;width:max-content;animation:marquee 38s linear infinite}
@keyframes flip{0%{background:var(--s)}100%{background:var(--c)}}
.cell{display:block;aspect-ratio:1/1;border-radius:1px;background:var(--s);animation:flip .4s ease-out both}
@keyframes draw{from{stroke-dashoffset:400}to{stroke-dashoffset:0}}
.line{stroke-dasharray:400;stroke-dashoffset:400;animation:draw 1.6s ease-out .4s forwards}
@keyframes slide{0%{left:-8%;opacity:0}8%{opacity:1}100%{left:var(--end);opacity:1}}
.dot{position:absolute;top:var(--lane);width:10px;height:10px;border-radius:50%;background:#AEB5C0;animation:slide 2.2s linear var(--d) both}
.dot.ai{background:#7CF2C4}
@keyframes tick{0%,60%{opacity:0;transform:scale(.4)}70%,100%{opacity:1;transform:scale(1)}}
.dot.ai::after{content:'';position:absolute;left:1px;top:-9px;width:5px;height:9px;border:solid #7CF2C4;border-width:0 2px 2px 0;transform:rotate(45deg);opacity:0;animation:tick 4.2s linear var(--d) both}
@keyframes typein{from{width:0}to{width:100%}}
.field{display:block;height:8px;border-radius:2px;background:#7CF2C4;width:0;animation:typein .5s steps(8) var(--d) forwards}
@keyframes shrink{from{width:100%}to{width:74.1%}}
.tok{height:10px;border-radius:2px;background:#FF8A5B;animation:shrink 1.4s ease-in-out 1s forwards}
@keyframes wave{0%,100%{transform:scaleY(.25)}50%{transform:scaleY(1)}}
.wv{width:4px;height:40px;background:#7CF2C4;border-radius:2px;transform-origin:bottom;animation:wave 1.1s ease-in-out infinite}
@keyframes grow{from{width:0}to{width:var(--w)}}
.bar{height:14px;background:#7CF2C4;border-radius:2px;width:var(--w);animation:grow 1.2s ease-out}
.bar.dim{background:#3A4150}

/* phone */
@media (max-width:760px){
  .pad{padding-left:16px!important;padding-right:16px!important}
  .site-header,.site-footer,.prose-head,.prose{padding-left:16px;padding-right:16px}
  .site-header{padding-top:14px;padding-bottom:14px}
  .nav{gap:14px;font-size:14px}
  .hero-main,.hero-side,.span7,.span5,.span4,.s4,.s8{grid-column:span 12}
  .hero-main{padding:28px 20px 24px!important;min-height:0!important}
  .hero-side{padding:22px 20px!important}
  .six{grid-template-columns:repeat(2,minmax(0,1fr))}
  .two,.quotes{grid-template-columns:1fr}
  .split{gap:20px}
  .sec{padding-top:40px!important;padding-bottom:40px!important}
  .big{font-size:36px}
  .huge{font-size:44px}
  .mid{font-size:28px}
  .rowt{font-size:17px}
  .stats{grid-template-columns:repeat(2,minmax(0,1fr))}
  .stats .pie{grid-column:span 2}
  .ttl{font-size:30px!important}
  .lead{font-size:17px!important}
  .prose-head{padding-top:40px}
  .prose-head h1{font-size:40px}
  .embed{display:none}
  .phone-note{display:block}
  .site-footer{padding-top:40px;padding-bottom:40px}
}