/* ianireland.com — Modern Maverick */

@font-face{font-family:"Jost";font-style:normal;font-weight:300;font-display:swap;src:url("fonts/jost-latin-300-normal.woff2") format("woff2")}
@font-face{font-family:"Jost";font-style:normal;font-weight:400;font-display:swap;src:url("fonts/jost-latin-400-normal.woff2") format("woff2")}
@font-face{font-family:"Jost";font-style:normal;font-weight:500;font-display:swap;src:url("fonts/jost-latin-500-normal.woff2") format("woff2")}

:root{
  --purple:#6B2BD9;
  --purple-light:#B98CFF;
  --charcoal:#1A1A1A;
  --grey:#E6E6E6;
  --white:#FFFFFF;
  --aubergine:#100C18;

  --bg:var(--white);
  --fg:var(--charcoal);
  --muted:#555555;
  --accent:var(--purple);
  --rule:var(--grey);
  --btn-bg:var(--purple);
  --btn-fg:var(--white);
  --icon:var(--charcoal);
  --icon-hover:var(--purple);

  --font:"Jost",Arial,Helvetica,sans-serif;
  --max:1200px;
  --gutter:24px;
  color-scheme:light dark;
}
@media (prefers-color-scheme:dark){
  :root{
    --bg:var(--aubergine);
    --fg:#EDEAF2;
    --muted:#B5AFC2;
    --accent:var(--purple-light);
    --rule:#2C2438;
    --btn-bg:var(--purple-light);
    --btn-fg:var(--aubergine);
    --icon:var(--purple-light);
    --icon-hover:#FFFFFF;
  }
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:16px}
body{margin:0;background:var(--bg);color:var(--fg);font-family:var(--font);font-size:18px;line-height:1.6;font-weight:400;text-rendering:optimizeLegibility}
img,svg{display:block;max-width:100%;height:auto}
a{color:inherit;text-underline-offset:3px}
a:focus-visible,button:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:2px}
h1,h2,h3,h4,p,ol,ul,dl,dd,blockquote{margin:0}
ol,ul{padding:0;list-style:none}

.skip{position:absolute;left:-9999px;top:8px;background:var(--btn-bg);color:var(--btn-fg);padding:10px 16px;z-index:10}
.skip:focus{left:8px}
.sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

.wrap{max-width:var(--max);margin:0 auto;padding:0 var(--gutter)}
.section{border-top:1px solid var(--rule)}
.section > .wrap{padding-top:96px;padding-bottom:96px;display:flex;flex-direction:column;gap:48px}
.section--plain{border-top:0}
@media (max-width:720px){.section > .wrap{padding-top:64px;padding-bottom:64px;gap:36px}}

.eyebrow{font-size:13px;letter-spacing:.28em;color:var(--accent);font-weight:500;text-transform:uppercase}
.label{font-size:12px;letter-spacing:.24em;color:var(--muted);text-transform:uppercase}
.label--accent{color:var(--accent);font-weight:500}
.h2{font-size:clamp(30px,3.6vw,48px);line-height:1.12;font-weight:400}
.intro{display:flex;flex-direction:column;gap:14px;max-width:760px}
.muted{color:var(--muted)}
.tracked{letter-spacing:.32em}
.tagline{font-size:14px;letter-spacing:.28em;color:var(--muted)}
.pipe{color:var(--accent)}

/* Header */
.site-head{border-bottom:1px solid var(--rule)}
.site-head nav{display:flex;align-items:center;justify-content:space-between;gap:24px;padding-top:16px;padding-bottom:16px}
.brand{display:flex;align-items:center;gap:14px;text-decoration:none}
.brand img{width:64px}
.brand span{font-size:17px;letter-spacing:.32em;white-space:nowrap}
.navlinks{display:flex;gap:28px;font-size:15px;align-items:center}
.navlinks a{text-decoration:none}
.navlinks a:hover{color:var(--accent)}
@media (max-width:960px){.navlinks{display:none}}

.btn{background:var(--btn-bg);color:var(--btn-fg);text-decoration:none;padding:12px 22px;min-height:44px;display:inline-flex;align-items:center;font-size:15px;font-weight:500;letter-spacing:.02em;white-space:nowrap;border:0}
.btn--lg{padding:14px 28px;min-height:48px;font-size:17px}
.btn:hover{filter:brightness(1.1)}

/* Contact icons — no boxes */
.icons{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.ico{color:var(--icon);width:44px;height:44px;display:inline-flex;align-items:center;justify-content:center;text-decoration:none;transition:color .15s}
.ico svg{width:28px;height:28px}
.ico:hover,.ico:focus-visible{color:var(--icon-hover)}
.icons--sm .ico svg{width:24px;height:24px}

/* Hero */
.hero{display:flex;flex-wrap:wrap;align-items:center;gap:48px;padding-top:72px;padding-bottom:56px}
.hero__text{flex:1 1 520px;min-width:0;display:flex;flex-direction:column;gap:28px}
.hero__name{font-size:22px;letter-spacing:.32em;font-weight:300}
.hero__desc{font-size:17px;color:var(--muted)}
.hero h1{font-size:clamp(40px,5.6vw,76px);line-height:1.04;font-weight:400;letter-spacing:-.015em}
.hero__lede{max-width:34em;font-size:20px;color:var(--muted)}
.hero__cta{display:flex;flex-wrap:wrap;gap:16px 28px;align-items:center}
.hero__fig{flex:0 1 420px;max-width:420px;margin:0 auto}
@media (max-width:720px){.hero{padding-top:40px;gap:32px}.hero__fig{order:-1;max-width:220px}}

/* Brush divider */
.brush{display:block;width:100%;height:28px}
.brush path{fill:var(--accent)}
.brush .faint{opacity:.55}

/* Lists and grids */
.signs{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,340px),1fr));gap:0 48px}
.signs li{border-top:1px solid var(--rule);padding:24px 0;display:flex;gap:20px}
.num{color:var(--accent);font-size:15px;letter-spacing:.1em;padding-top:3px}
.grid4{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:40px}
.grid3{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:24px}
.stack{display:flex;flex-direction:column;gap:12px}
.h3{font-size:22px;font-weight:500;line-height:1.25}
.engaged{display:flex;flex-wrap:wrap;gap:12px 32px;align-items:baseline;border-top:1px solid var(--rule);padding-top:24px;font-size:16px}

.steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:40px}
.steps li{display:flex;flex-direction:column;gap:12px;border-top:2px solid var(--accent);padding-top:20px}
.steps h3{font-size:28px;font-weight:400}
.signature{max-width:900px;font-size:clamp(22px,2.4vw,30px);line-height:1.35;font-weight:300}

.timeline li{display:flex;flex-wrap:wrap;gap:4px 32px;padding:18px 0;border-top:1px solid var(--rule)}
.timeline li:last-child{border-bottom:1px solid var(--rule)}
.timeline .when{flex:0 0 200px;color:var(--muted);font-size:16px}
.timeline .what{flex:1 1 420px}
strong{font-weight:500}

.card{border:1px solid var(--rule);padding:28px;display:flex;flex-direction:column;gap:16px}
.card h4{font-size:20px;font-weight:500;line-height:1.3}
.card dl{display:flex;flex-direction:column;gap:12px;font-size:16px}
.card dt{font-size:12px;letter-spacing:.24em;color:var(--accent);font-weight:500}
.card dd{margin-top:4px}

.build{border-top:1px solid var(--rule);padding-top:20px;display:flex;flex-direction:column;gap:10px}
.build--feature{border-top:2px solid var(--accent)}

.arc{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));border-top:1px solid var(--rule)}
.arc li{padding:18px 20px 18px 0;display:flex;flex-direction:column;gap:4px}
.post{text-decoration:none;border:1px solid var(--rule);padding:28px;display:flex;flex-direction:column;gap:14px;min-height:220px;transition:border-color .15s}
.post:hover{border-color:var(--accent)}
.post__title{font-size:22px;line-height:1.3}
.post__line{font-size:16px;color:var(--muted)}
.post__more{margin-top:auto;color:var(--accent);font-size:16px}
.link-quiet{align-self:flex-start;text-decoration:underline;text-decoration-color:var(--accent);min-height:44px;display:inline-flex;align-items:center}

.section > .wrap.about{flex-direction:row;flex-wrap:wrap;gap:40px 80px}
.about__head{flex:1 1 280px;display:flex;flex-direction:column;gap:14px}
.about__body{flex:2 1 520px;display:flex;flex-direction:column;gap:18px;max-width:680px}

.contact h2{font-size:clamp(36px,5vw,64px);line-height:1.06;font-weight:400;max-width:14em}
.contact .icons{gap:20px;margin-left:-8px}
.contact__plain{font-size:16px;color:var(--muted);display:flex;flex-wrap:wrap;gap:4px 28px}

/* Footer */
.site-foot{border-top:1px solid var(--rule)}
.site-foot .wrap{padding-top:40px;padding-bottom:40px;display:flex;flex-wrap:wrap;gap:24px 48px;align-items:center;justify-content:space-between;font-size:15px;color:var(--muted)}
.foot-brand{display:flex;align-items:center;gap:16px}
.foot-brand img{width:64px}
.foot-brand .name{color:var(--fg);letter-spacing:.32em}
.foot-brand .tag{font-size:12px;letter-spacing:.24em}
.foot-nav{display:flex;flex-wrap:wrap;gap:0 24px;align-items:center}
.foot-nav a{text-decoration:none;padding:10px 0}
.foot-nav a:hover{color:var(--accent)}
.site-foot .icons{gap:8px}

/* Motion: once, never looping */
@media (prefers-reduced-motion:no-preference){
  .js .reveal{opacity:0;transform:translateY(16px);transition:opacity .7s ease,transform .7s ease}
  .js .reveal.is-in{opacity:1;transform:none}
  .js .brush{clip-path:inset(0 100% 0 0);transition:clip-path 1.2s cubic-bezier(.65,0,.35,1)}
  .js .brush.is-in{clip-path:inset(0 0 0 0)}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .ico,.post{transition:none}
}

/* Simple text pages (cv, privacy) */
.page{max-width:960px}
.page main{padding-top:64px;padding-bottom:96px;display:flex;flex-direction:column;gap:56px}
.page h1{font-size:clamp(32px,4vw,48px);font-weight:400}
.rule-accent{border-top:2px solid var(--accent);padding-top:24px}
.cv-role{display:flex;flex-wrap:wrap;gap:4px 32px;border-top:1px solid var(--rule);padding:20px 0}
.cv-role .when{flex:0 0 180px;font-size:15px;color:var(--muted)}
.cv-role .body{flex:1 1 480px;display:flex;flex-direction:column;gap:6px}
.cv-role h3{font-size:19px;font-weight:500}
.cv-role ul{list-style:disc;padding-left:20px}
.caps{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,380px),1fr));gap:10px 32px}
.caps li{border-top:1px solid var(--rule);padding-top:10px}
.prose{display:flex;flex-direction:column;gap:16px;max-width:42em}
.prose h2{font-size:22px;font-weight:500;margin-top:16px}
.prose ul{list-style:disc;padding-left:22px}

@media print{
  .site-head nav .btn,.site-foot,.skip,.no-print{display:none !important}
  body{font-size:11pt}
}
