/*
Theme Name: Colin Nekritz Consulting
Theme URI: https://example.com
Author: Colin Nekritz
Author URI: https://example.com
Description: A custom one-page theme for Colin Nekritz Strategic Consulting. Dark hero, gold accent, condensed headline type.
Version: 1.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: colin-nekritz
*/

  :root{
    --ink:#0e0e0e;
    --paper:#ffffff;
    --gold:#e0a52c;
    --gold-dark:#c78f22;
    --text-dim:#c9c9c9;
    --off-white:#f7f6f4;
    --card-bg:#f2f1ee;
    --max:1440px;
  }

  *{box-sizing:border-box; margin:0; padding:0;}

  body{
    font-family:'Inter', sans-serif;
    color:var(--ink);
    background:var(--paper);
    line-height:1.5;
  }

  h1, h2, h3, .brand, nav a, .btn{
    font-family:'Oswald', sans-serif;
    letter-spacing:0.02em;
  }

  a{ text-decoration:none; color:inherit; }

  /* ---------- Header ---------- */
  header{
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:22px clamp(20px, 5vw, 64px);
    background:var(--paper);
    border-bottom:1px solid #eee;
  }

  .brand{
    font-size:1.15rem;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:0.03em;
  }
  .brand span{ color:var(--gold); }

  nav{
    display:flex;
    gap:40px;
  }
  nav a{
    font-size:0.85rem;
    font-weight:600;
    text-transform:uppercase;
    letter-spacing:0.06em;
    color:var(--ink);
    transition:color .15s ease;
  }
  nav a:hover, nav a:focus-visible{ color:var(--gold-dark); }

  .btn{
    display:inline-block;
    background:var(--gold);
    color:var(--ink);
    font-size:0.8rem;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:0.05em;
    padding:14px 26px;
    border:none;
    cursor:pointer;
    transition:background .15s ease, transform .15s ease;
  }
  .btn:hover, .btn:focus-visible{
    background:var(--gold-dark);
    transform:translateY(-1px);
  }

  .header-cta{ flex-shrink:0; }

  /* mobile nav toggle (simple, no-js fallback hides on small screens) */
  .nav-wrap{ display:flex; align-items:center; gap:40px; }

  /* ---------- Hero ---------- */
  .hero{
    display:grid;
    grid-template-columns:1fr 1fr;
    background:var(--ink);
    min-height:calc(100vh - 73px);
  }

  .hero-copy{
    display:flex;
    flex-direction:column;
    justify-content:center;
    padding:clamp(32px, 6vw, 90px);
    color:var(--paper);
  }

  .eyebrow{
    color:var(--gold);
    font-family:'Oswald', sans-serif;
    font-size:0.8rem;
    font-weight:600;
    letter-spacing:0.14em;
    text-transform:uppercase;
    margin-bottom:22px;
  }

  .headline{
    font-size:clamp(2.6rem, 5.2vw, 4.6rem);
    font-weight:700;
    text-transform:uppercase;
    line-height:1.02;
    margin-bottom:28px;
  }
  .headline .accent{ color:var(--gold); }

  .sub{
    font-family:'Inter', sans-serif;
    font-size:1.05rem;
    font-weight:400;
    color:var(--text-dim);
    max-width:34ch;
    margin-bottom:36px;
  }

  .hero-image{
    background-size:cover;
    background-position:center;
    min-height:320px;
  }

  /* ---------- Responsive ---------- */
  @media (max-width: 900px){
    nav{ display:none; }
    .hero{ grid-template-columns:1fr; }
    .hero-image{ min-height:280px; order:-1; }
    header{ padding:18px 20px; }
  }

  :focus-visible{ outline:2px solid var(--gold); outline-offset:2px; }

  /* ---------- Transition band ---------- */
  .transition-band{
    display:grid;
    grid-template-columns:1fr 1fr;
    height:90px;
  }
  .transition-band .black{ background:var(--ink); }
  .transition-band .band-image{
    background-size:cover;
    background-position:center;
  }

  /* ---------- Identity ---------- */
  .identity{
    background:var(--off-white);
    padding:clamp(60px,8vw,110px) clamp(20px,5vw,64px);
    display:grid;
    grid-template-columns:minmax(260px,420px) 1fr;
    gap:clamp(40px,6vw,90px);
    align-items:start;
  }
  .identity-photo{ position:relative; }
  .identity-photo::before{
    content:"";
    position:absolute;
    left:24px; top:24px;
    width:100%; height:100%;
    background:var(--gold);
    z-index:0;
  }
  .identity-photo .photo-frame{
    position:relative;
    z-index:1;
    width:100%;
    aspect-ratio:4/5;
    background:#d9d9d9;
    display:flex;
    align-items:center;
    justify-content:center;
    overflow:hidden;
  }
  .identity-photo .photo-frame img{
    width:100%; height:100%;
    object-fit:cover;
    display:block;
  }
  .identity-photo .placeholder-label{
    font-family:'Inter', sans-serif;
    font-size:0.8rem;
    color:#888;
    text-align:center;
    padding:0 20px;
  }

  .identity-copy h2{
    font-size:clamp(2.2rem,4vw,3.2rem);
    font-weight:700;
    text-transform:uppercase;
    margin-bottom:10px;
  }
  .identity-copy .role{
    font-family:'Inter', sans-serif;
    font-size:1.1rem;
    font-weight:500;
    color:#555;
    margin-bottom:26px;
  }
  .identity-copy p.body-text{
    font-size:1rem;
    color:#333;
    max-width:56ch;
    margin-bottom:30px;
  }
  blockquote{
    border-left:4px solid var(--gold);
    padding-left:24px;
    font-family:'Oswald', sans-serif;
    font-size:1.15rem;
    font-weight:500;
    text-transform:uppercase;
    line-height:1.4;
    margin-bottom:34px;
    max-width:56ch;
  }
  .btn-outline{
    display:inline-block;
    border:2px solid var(--ink);
    color:var(--ink);
    background:transparent;
    font-family:'Oswald', sans-serif;
    font-size:0.8rem;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:0.05em;
    padding:14px 28px;
    transition:background .15s ease, color .15s ease;
  }
  .btn-outline:hover, .btn-outline:focus-visible{
    background:var(--ink);
    color:var(--paper);
  }

  /* ---------- Values bar ---------- */
  .values-bar{
    background:var(--ink);
    border-top:4px solid var(--gold);
    padding:34px 20px;
  }
  .values-list{
    list-style:none;
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
    gap:14px 34px;
    max-width:var(--max);
    margin:0 auto;
  }
  .values-list li{
    display:flex;
    align-items:center;
    gap:10px;
    color:var(--paper);
    font-family:'Oswald', sans-serif;
    font-size:0.85rem;
    font-weight:600;
    letter-spacing:0.06em;
    text-transform:uppercase;
  }
  .values-list li::before{
    content:"";
    width:8px; height:8px;
    background:var(--gold);
    display:inline-block;
    flex-shrink:0;
  }

  /* ---------- Expertise ---------- */
  .expertise{
    padding:clamp(60px,8vw,110px) clamp(20px,5vw,64px);
    background:var(--paper);
  }
  .expertise h2{
    font-size:clamp(2.2rem,4.5vw,3.4rem);
    font-weight:700;
    text-transform:uppercase;
    margin-bottom:16px;
  }
  .expertise .lede{
    font-size:1rem;
    color:#555;
    max-width:60ch;
    margin-bottom:50px;
  }
  .card-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:24px;
  }
  .card{
    background:var(--card-bg);
    padding:34px 28px;
    border-top:3px solid transparent;
    transition:border-color .15s ease, transform .15s ease;
  }
  .card:hover{ border-top-color:var(--gold); transform:translateY(-3px); }
  .card .icon{ font-size:1.8rem; margin-bottom:18px; display:block; }
  .card h3{
    font-size:1.1rem;
    font-weight:600;
    text-transform:uppercase;
    margin-bottom:14px;
    line-height:1.25;
  }
  .card p{
    font-family:'Inter', sans-serif;
    font-size:0.92rem;
    color:#555;
  }

  /* ---------- Approach CTA ---------- */
  .approach-cta{
    background:
      linear-gradient(180deg, rgba(14,14,14,.93), rgba(14,14,14,.97)),
      radial-gradient(circle at 30% 20%, #2a2a2a, #0e0e0e 60%);
    color:var(--paper);
    text-align:center;
    padding:clamp(70px,10vw,120px) 20px;
  }
  .approach-cta .eyebrow{ justify-content:center; display:flex; }
  .approach-cta h2{
    font-size:clamp(2.2rem,5vw,3.8rem);
    font-weight:700;
    text-transform:uppercase;
    margin-bottom:20px;
  }
  .approach-cta p{
    font-family:'Inter', sans-serif;
    color:var(--text-dim);
    font-size:1.05rem;
    margin-bottom:38px;
  }

  /* ---------- Footer ---------- */
  footer{
    background:var(--ink);
    color:var(--paper);
    padding:clamp(50px,7vw,80px) clamp(20px,5vw,64px) 0;
  }
  .footer-grid{
    display:grid;
    grid-template-columns:1.4fr 1fr 1fr;
    gap:40px;
    padding-bottom:50px;
    border-bottom:1px solid #2a2a2a;
    max-width:var(--max);
    margin:0 auto;
  }
  .footer-brand p{
    font-family:'Inter', sans-serif;
    color:var(--text-dim);
    font-size:0.95rem;
    max-width:36ch;
    margin:16px 0 20px;
  }
  .social-icon{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:36px; height:36px;
    border:1px solid #444;
    border-radius:50%;
    transition:border-color .15s ease, background .15s ease;
  }
  .social-icon:hover{ background:var(--gold); border-color:var(--gold); }
  .social-icon svg{ width:16px; height:16px; fill:var(--paper); }

  .footer-col h4{
    font-family:'Oswald', sans-serif;
    color:var(--gold);
    font-size:0.85rem;
    font-weight:600;
    letter-spacing:0.08em;
    text-transform:uppercase;
    margin-bottom:18px;
  }
  .footer-col .row{
    display:flex;
    gap:12px;
    margin-bottom:14px;
    font-family:'Inter', sans-serif;
    font-size:0.92rem;
    color:var(--text-dim);
  }
  .footer-col .row span.label{
    color:#8a8a8a;
    min-width:70px;
    flex-shrink:0;
  }

  .footer-bottom{
    text-align:center;
    padding:26px 0;
    font-family:'Inter', sans-serif;
    font-size:0.82rem;
    color:#777;
  }

  /* ---------- Responsive additions ---------- */
  @media (max-width: 900px){
    .card-grid{ grid-template-columns:1fr 1fr; }
  }
  @media (max-width: 800px){
    .identity{ grid-template-columns:1fr; }
    .identity-photo{ max-width:320px; margin:0 auto 20px; }
    .footer-grid{ grid-template-columns:1fr; }
    .transition-band{ grid-template-columns:1fr; height:auto; }
    .transition-band .black{ height:40px; }
    .transition-band .band-image{ height:60px; }
  }
  @media (max-width: 600px){
    .card-grid{ grid-template-columns:1fr; }
  }