/*
Theme Name: IronMind
Theme URI: https://ironmind.ai
Author: IronMind
Description: Industrial-grade dark theme with animated ember field hero. Self-contained, no build step.
Version: 1.0.0
License: GPL-2.0-or-later
Text Domain: ironmind
*/

:root{
  --charcoal-deep:#0c0c0d;
  --charcoal-mid:#16161a;
  --ember:#e85d3a;
  --ember-bright:#ff7a52;
  --n200:#e5e5e5;
  --n300:#d4d4d4;
  --n400:#a3a3a3;
  --n500:#737373;
  --n50:#fafafa;
  --line:rgba(255,255,255,0.05);
  --line2:rgba(255,255,255,0.10);
  --line3:rgba(255,255,255,0.15);
}

*,*::before,*::after{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  background:var(--charcoal-deep);
  color:var(--n200);
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  -webkit-font-smoothing:antialiased;
  line-height:1.5;
}
::selection{background:var(--ember);color:var(--n50)}

a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}

.font-display{font-family:"Space Grotesk",Inter,system-ui,sans-serif;letter-spacing:-0.01em}
.container{max-width:80rem;margin:0 auto;padding:0 1.5rem}

/* NAV */
.im-nav{
  position:sticky;top:0;z-index:50;
  background:rgba(12,12,13,0.8);
  backdrop-filter:blur(12px);
  border-bottom:1px solid var(--line);
}
.im-nav .inner{display:flex;align-items:center;justify-content:space-between;height:4rem}
.wordmark{display:flex;align-items:center;gap:0.5rem;font-weight:600;font-size:1.125rem}
.wordmark .custom-logo{max-height:2rem;width:auto;filter:brightness(0) invert(1)}
.wordmark .mark{width:1.25rem;height:1.25rem;background:var(--ember);border-radius:2px}
.im-nav .links{display:none;gap:2rem;font-size:0.875rem;font-weight:500;color:var(--n400)}
.im-nav .links a:hover{color:var(--ember)}
@media (min-width:768px){.im-nav .links{display:flex}}
.btn{
  display:inline-flex;align-items:center;gap:0.5rem;
  font-size:0.875rem;font-weight:500;
  padding:0.5rem 1rem;border-radius:2px;
  border:1px solid transparent;cursor:pointer;
  transition:all .15s ease;
}
.btn-light{background:var(--n200);color:var(--charcoal-deep);border-color:var(--n200)}
.btn-light:hover{background:var(--n300)}
.btn-ember{background:var(--ember);color:var(--n50);border-color:var(--ember);padding:0.625rem 1rem}
.btn-ember:hover{filter:brightness(1.1)}
.btn-ghost{color:var(--n300);border-color:var(--line3);padding:0.625rem 0.75rem}
.btn-ghost:hover{color:var(--ember);border-color:var(--ember)}

/* HERO */
.hero{position:relative;padding:7rem 1.5rem 8rem;overflow:hidden}
@media (min-width:768px){.hero{padding:8rem 1.5rem 12rem}}
.hero canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.hero .grid-dots{
  position:absolute;top:0;right:0;width:50%;height:100%;opacity:0.1;pointer-events:none;
  background-image:radial-gradient(circle at 2px 2px,#4a4a4a 1px,transparent 0);
  background-size:40px 40px;
}
.hero .glow-line{position:absolute;left:0;right:0;bottom:0;height:1px;
  background:linear-gradient(to right,transparent,rgba(232,93,58,0.5),transparent)}
.hero .wrap{position:relative;z-index:1;display:flex;flex-direction:column;gap:3rem}
.eyebrow{font-family:"Space Grotesk",sans-serif;font-size:10px;font-weight:600;
  text-transform:uppercase;letter-spacing:0.25em;color:var(--ember)}
.h1{font-family:"Space Grotesk",sans-serif;font-weight:600;
  font-size:clamp(2.75rem,8vw,7.5rem);line-height:0.95;letter-spacing:-0.04em;
  max-width:18ch;margin:0}
.h1 .em{color:var(--ember);font-style:italic}
.hero-row{display:flex;flex-direction:column;gap:2rem;align-items:flex-start}
@media (min-width:768px){.hero-row{flex-direction:row;gap:3rem}}
.hero-row p{font-size:1.125rem;color:var(--n400);max-width:42ch;margin:0;line-height:1.6}
@media (min-width:768px){.hero-row p{font-size:1.25rem}}
.hero-cta{display:flex;align-items:center;gap:0.75rem}

/* SECTIONS */
section{padding:6rem 1.5rem}
.services{background:rgba(22,22,26,0.3);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.sec-head{display:flex;flex-direction:column;gap:1.5rem;margin-bottom:3rem}
@media (min-width:768px){.sec-head{flex-direction:row;justify-content:space-between;align-items:flex-end}}
.h2{font-family:"Space Grotesk",sans-serif;font-weight:600;
  font-size:clamp(2rem,5vw,3rem);line-height:1.05;letter-spacing:-0.03em;margin:0;max-width:18ch}
.tag{font-size:10px;font-weight:500;text-transform:uppercase;letter-spacing:0.25em;color:var(--n500)}

.service-grid{display:grid;grid-template-columns:1fr;gap:1px;background:var(--line);border:1px solid var(--line)}
@media (min-width:768px){.service-grid{grid-template-columns:1fr 1fr}}
@media (min-width:1024px){.service-grid{grid-template-columns:repeat(3,1fr)}}
.service{background:var(--charcoal-deep);padding:2rem;display:flex;flex-direction:column;gap:1.25rem;transition:background .15s}
.service:hover{background:rgba(22,22,26,0.6)}
.service h3{font-family:"Space Grotesk",sans-serif;font-weight:500;font-size:1.25rem;margin:0}
.service p{font-size:0.875rem;color:var(--n400);margin:0;line-height:1.6}

/* CAPABILITIES */
.cap{padding:8rem 1.5rem}
.cap-wrap{display:flex;flex-direction:column;gap:4rem}
@media (min-width:1024px){.cap-wrap{flex-direction:row;gap:6rem}}
.cap-left{flex:1}
.cap-left p{color:var(--n400);max-width:36ch;line-height:1.6}
.cap-right{flex:2;display:grid;grid-template-columns:1fr;gap:2.5rem}
@media (min-width:640px){.cap-right{grid-template-columns:1fr 1fr;gap:3rem}}
.cap-item{display:flex;flex-direction:column;gap:1rem}
.cap-item .bar{height:1px;width:3rem;background:var(--line3)}
.cap-item.first .bar{background:var(--ember)}
.cap-item h4{font-family:"Space Grotesk",sans-serif;font-weight:500;font-size:1.125rem;margin:0}
.cap-item p{font-size:0.875rem;color:var(--n500);margin:0;line-height:1.6}

/* WORK */
.work{border-top:1px solid var(--line)}
.work-grid{display:grid;grid-template-columns:1fr;gap:2rem}
@media (min-width:1024px){.work-grid{grid-template-columns:1fr 1fr}}
.case-img{position:relative;width:100%;aspect-ratio:16/10;overflow:hidden;border-radius:2px;
  border:1px solid var(--line2);margin-bottom:1.5rem;background:var(--charcoal-mid)}
.case-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .7s}
.case:hover .case-img img{transform:scale(1.03)}
.case-img .badge{position:absolute;top:0.75rem;left:0.75rem;font-size:10px;font-weight:500;
  text-transform:uppercase;letter-spacing:0.2em;color:var(--n300);
  background:rgba(12,12,13,0.7);padding:0.25rem 0.5rem;border-radius:2px}
.case h3{font-family:"Space Grotesk",sans-serif;font-weight:500;font-size:1.25rem;margin:0 0 0.5rem}
.case p{font-size:0.875rem;color:var(--n500);margin:0;line-height:1.6}

/* CTA */
.cta{padding:8rem 1.5rem}
.cta-box{background:var(--charcoal-mid);padding:2.5rem;border-radius:6px;border:1px solid var(--line2);
  display:flex;flex-direction:column;gap:2.5rem;align-items:flex-start}
@media (min-width:768px){.cta-box{flex-direction:row;justify-content:space-between;align-items:center;padding:5rem}}
.cta-box .h2{margin-top:1rem}
.cta-box p{color:var(--n400);margin-top:1rem;line-height:1.6;max-width:42ch}
.cta-mail{white-space:nowrap;background:var(--ember);color:var(--n50);font-size:0.875rem;font-weight:500;
  padding:1rem 2rem;border-radius:2px;border:1px solid var(--ember);text-transform:uppercase;letter-spacing:0.2em}
.cta-mail:hover{filter:brightness(1.1)}

/* FOOTER */
.im-footer{padding:3rem 1.5rem;border-top:1px solid var(--line)}
.im-footer .inner{display:flex;flex-direction:column;gap:2rem;justify-content:space-between;align-items:flex-start}
@media (min-width:768px){.im-footer .inner{flex-direction:row;align-items:center}}
.im-footer small{font-size:10px;text-transform:uppercase;letter-spacing:0.25em;color:var(--n500);display:block;margin-top:0.75rem}
.im-footer .social{display:flex;gap:2rem;font-size:11px;font-weight:500;
  text-transform:uppercase;letter-spacing:0.25em;color:var(--n500)}
.im-footer .social a:hover{color:var(--ember)}

/* Generic post content (for blog/page templates) */
.content-wrap{padding:6rem 1.5rem;max-width:48rem;margin:0 auto}
.content-wrap h1,.content-wrap h2,.content-wrap h3{font-family:"Space Grotesk",sans-serif;letter-spacing:-0.02em}
.content-wrap a{color:var(--ember);text-decoration:underline}