/* iMake design system — Phase 1 foundation
   Orange is an accent. No ambient glow wash. */

:root{
  --background:#070504;
  --surface:#12100d;
  --border:rgba(255,246,236,.14);
  --border-strong:rgba(255,246,236,.28);
  --text-primary:#fff8f0;
  --text-secondary:#eadcc8;
  --text-muted:#cbb8a0;
  --text-on-accent:#1a1008;
  --text-on-light:#16110c;
  --text-accent:#ffb060;
  --chip:#fff6ec;
  --chip-ink:#16110c;
  --ink:var(--background);
  --paper:var(--text-primary);
  --muted:var(--text-muted);
  --line:var(--border);
  --line-strong:var(--border-strong);
  --accent:#ff7a00;
  --accent-2:#ff9a2a;
  --accent-soft:rgba(255,122,0,.1);
  --surface-2:rgba(255,246,236,.045);
  --header-scrolled:rgba(7, 5, 4, .86);
  --shadow-device:0 28px 64px rgba(0,0,0,.55), 0 0 0 1px rgba(255,255,255,.06), 0 0 48px rgba(255,122,0,.08);
  --device-bezel:#1a1816;
  --device-screen:#100e0c;
  --glow:rgba(255,122,0,.16);
  --display:"Instrument Serif", "Times New Roman", serif;
  --sans:"Inter", ui-sans-serif, system-ui, sans-serif;
  --container:1240px;
  --page-gutter:clamp(1rem, 4.8vw, 1.5rem);
  --header-h:72px;
  --header-offset:calc(var(--header-h) + env(safe-area-inset-top, 0px));
  --tap:44px;
  --ease:cubic-bezier(.22, 1, .36, 1);
  --motion-fast:180ms;
  --motion-mid:320ms;
  --motion-slow:460ms;
  color-scheme:dark;
}

html{
  scroll-padding-top:calc(var(--header-offset) + 1rem);
}

body{
  font-family:var(--sans);
  font-size:clamp(1rem, .25vw + .96rem, 1.0625rem);
  line-height:1.65;
  letter-spacing:-.011em;
  color:var(--text-primary);
  background:var(--background);
  padding-top:var(--header-offset);
}

body::before,
body::after{
  display:none;
}

h1, h2, .hero h1, .page-hero h1{
  font-family:var(--display);
  font-weight:400;
  letter-spacing:-.03em;
  line-height:1.05;
}

.hero h1,
.page-hero h1{
  font-size:clamp(2.35rem, 6.2vw, 5.5rem);
  max-width:16ch;
  text-wrap:pretty;
}

.page-hero{
  padding:clamp(2.6rem, 6vw, 5.5rem) 0 clamp(1.75rem, 4vw, 3rem);
}

.legal{
  max-width:42rem;
}

.legal h2{
  margin:2rem 0 .7rem;
  font-size:1.35rem;
}

.skip-link{
  position:absolute;
  left:1rem;
  top:-4rem;
  z-index:200;
  padding:.7rem 1rem;
  border-radius:999px;
  background:var(--accent);
  color:var(--text-on-accent);
  font-weight:600;
}

.skip-link:focus,
.skip-link:focus-visible{
  top:calc(env(safe-area-inset-top, 0px) + .75rem);
}

.page-hero::before,
.page-hero::after,
.hero::before,
.hero::after{
  display:none;
}

h2{
  font-size:clamp(1.85rem, 4.2vw, 3.4rem);
  letter-spacing:-.04em;
  line-height:1.02;
  text-wrap:pretty;
}

h3{
  font-family:var(--sans);
  font-size:clamp(1.15rem, 1.4vw, 1.35rem);
  font-weight:600;
  letter-spacing:-.02em;
}

.eyebrow,
.kicker{
  font-family:var(--sans);
  font-size:.72rem;
  font-weight:600;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--muted);
}

.lead,
.hero p{
  color:var(--muted);
  max-width:38rem;
}

.container{
  width:min(var(--container), 100%);
  margin-inline:auto;
  padding-left:max(var(--page-gutter), env(safe-area-inset-left, 0px));
  padding-right:max(var(--page-gutter), env(safe-area-inset-right, 0px));
}

.btn,
.btn-ghost,
a.btn,
a.btn-ghost{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:var(--tap);
  min-width:var(--tap);
  padding:.85rem 1.25rem;
  touch-action:manipulation;
  border-radius:999px;
  font-family:var(--sans);
  font-size:.92rem;
  font-weight:600;
  letter-spacing:-.01em;
  text-decoration:none;
  transition:transform .25s var(--ease), background .25s var(--ease), color .25s var(--ease);
}

.btn{
  background:var(--accent);
  color:var(--text-on-accent);
  border:0;
  box-shadow:0 8px 22px rgba(255,122,0,.18);
}

.btn:hover{
  background:var(--accent-2);
  box-shadow:0 10px 26px rgba(255,122,0,.26);
}

@media(hover:hover) and (pointer:fine){
  .btn:hover{
    transform:translateY(-2px);
  }
}

.btn-ghost{
  background:transparent;
  color:var(--paper);
  border:1px solid var(--line-strong);
}

.btn-ghost:hover{
  border-color:var(--accent);
  color:var(--paper);
  background:var(--accent-soft);
}

@media(hover:hover) and (pointer:fine){
  .btn-ghost:hover{
    transform:translateY(-2px);
  }
}

.btn--sm{
  min-height:var(--tap);
  padding:.55rem 1.05rem;
  font-size:.82rem;
}

/* Header */
.site-header{
  position:fixed;
  inset:0 0 auto;
  z-index:100;
  height:var(--header-offset);
  padding-top:env(safe-area-inset-top, 0px);
  padding-left:max(var(--page-gutter), env(safe-area-inset-left, 0px));
  padding-right:max(var(--page-gutter), env(safe-area-inset-right, 0px));
  border-bottom:1px solid transparent;
  background:transparent;
  transition:background .3s var(--ease), border-color .3s var(--ease);
}

.site-header.is-scrolled{
  background:var(--header-scrolled);
  border-bottom-color:var(--line);
  backdrop-filter:blur(18px);
}

.site-header__inner{
  width:min(var(--container), 100%);
  height:100%;
  margin-inline:auto;
  display:grid;
  grid-template-columns:max-content minmax(0, 1fr) max-content;
  align-items:center;
  column-gap:clamp(1rem, 2.2vw, 1.75rem);
}

.wordmark{
  display:inline-flex;
  align-items:center;
  gap:.65rem;
  flex-shrink:0;
  color:var(--paper);
  text-decoration:none;
  font-weight:600;
  letter-spacing:-.03em;
  border-radius:8px;
}

.wordmark:focus-visible{
  outline:2px solid var(--accent);
  outline-offset:3px;
}

.brand-lockup{
  display:inline-grid;
  align-items:center;
  justify-items:start;
  height:32px;
}

.brand-lockup__img{
  grid-area:1 / 1;
  display:block;
  width:auto;
  height:32px;
  border-radius:0;
  flex-shrink:0;
}

.site-nav{
  display:flex;
  align-items:center;
  justify-content:center;
  flex-wrap:nowrap;
  min-width:0;
  gap:clamp(.05rem, .35vw, .2rem);
}

.site-nav > a,
.site-nav__group > a{
  display:inline-flex;
  align-items:center;
  flex:0 0 auto;
  min-height:var(--tap);
  padding:.55rem clamp(.55rem, 1.1vw, .8rem);
  color:var(--text-muted);
  text-decoration:none;
  font-size:.88rem;
  font-weight:500;
  white-space:nowrap;
}

.site-nav > a:hover,
.site-nav__group > a:hover,
.site-nav [aria-current="page"]{
  color:var(--paper);
}

.site-nav > a.site-nav__cta,
.site-nav > a.site-nav__cta:hover,
.site-nav [aria-current="page"].site-nav__cta,
.site-nav__cta{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex:0 0 auto;
  margin-left:.25rem;
  min-height:var(--tap);
  padding:.5rem 1.05rem;
  border:0;
  border-radius:999px;
  background:var(--accent);
  color:var(--text-on-accent);
  box-shadow:0 8px 20px rgba(255,122,0,.2);
  transform:none;
  text-decoration:none;
  font-size:.82rem;
  font-weight:600;
  letter-spacing:-.01em;
  white-space:nowrap;
}

.site-nav__cta:hover{
  background:var(--accent-2);
  box-shadow:0 10px 24px rgba(255,122,0,.28);
}

@media(hover:hover) and (pointer:fine){
  .site-nav__cta:hover{
    transform:translateY(-1px);
  }
}

.site-nav__cta:focus-visible{
  outline:2px solid var(--accent);
  outline-offset:3px;
}

.site-nav__group{
  position:relative;
  flex:0 0 auto;
}

.site-nav__sub{
  display:none;
  position:absolute;
  top:calc(100% + .35rem);
  left:0;
  z-index:120;
  min-width:13rem;
  padding:.4rem;
  border:1px solid var(--line);
  background:var(--surface);
  border-radius:12px;
}

.site-nav__group:hover .site-nav__sub,
.site-nav__group:focus-within .site-nav__sub{
  display:grid;
}

.site-nav__sub a{
  display:flex;
  align-items:center;
  min-height:var(--tap);
  padding:.55rem .7rem;
  color:var(--muted);
  text-decoration:none;
  border-radius:8px;
  font-size:.86rem;
  white-space:nowrap;
}

.site-nav__sub a:hover{
  color:var(--paper);
  background:var(--surface-2);
}

.site-header__tools{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  justify-self:end;
  flex-wrap:nowrap;
  gap:.8rem;
  padding-left:.2rem;
}

.theme-toggle{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:var(--tap);
  height:var(--tap);
  min-width:var(--tap);
  min-height:var(--tap);
  padding:0;
  border:1px solid var(--line);
  border-radius:999px;
  background:transparent;
  color:var(--paper);
  cursor:pointer;
  touch-action:manipulation;
}

.theme-toggle:hover{
  border-color:var(--line-strong);
}

.theme-toggle:focus-visible{
  outline:2px solid var(--accent);
  outline-offset:3px;
}

.theme-toggle svg{
  display:none;
  width:18px;
  height:18px;
}

.theme-toggle__name{
  display:none;
}

html[data-theme="dark"] .theme-toggle .theme-toggle__sun,
html:not([data-theme]) .theme-toggle .theme-toggle__sun{
  display:block;
}

html[data-theme="light"] .theme-toggle .theme-toggle__moon{
  display:block;
}

.menu-toggle{
  display:none;
  align-items:center;
  justify-content:center;
  gap:.65rem;
  min-width:var(--tap);
  min-height:var(--tap);
  padding:.2rem .35rem;
  border:0;
  background:transparent;
  color:var(--paper);
  font:inherit;
  font-size:.82rem;
  font-weight:600;
  letter-spacing:.08em;
  text-transform:uppercase;
  touch-action:manipulation;
}

.menu-toggle__icon{
  width:18px;
  display:grid;
  gap:5px;
}

.menu-toggle__icon i{
  display:block;
  height:1px;
  background:currentColor;
}

.nav-screen,
.nav-backdrop,
.nav-screen__actions{
  display:none;
}

@media(min-width:1120px) and (max-width:1279px){
  .site-nav > a,
  .site-nav__group > a{
    padding:.5rem .58rem;
    font-size:.84rem;
  }

  .site-nav__cta{
    padding:.45rem .85rem;
  }
}

@media(min-width:1120px){
  .menu-toggle{ display:none; }
}

@media(max-width:1119px){
  .site-nav{ display:none; }
  .site-header__tools .theme-toggle{ display:none; }
  .menu-toggle{ display:inline-flex; }
  .nav-screen__actions{ display:block; }

  .nav-backdrop.is-open{
    display:block;
    position:fixed;
    inset:0;
    z-index:70;
    background:rgba(0,0,0,.45);
  }

  .nav-screen.is-open{
    display:flex;
    flex-direction:column;
    align-items:stretch;
    position:fixed;
    inset:0;
    z-index:90;
    background:var(--ink);
    padding:
      calc(var(--header-offset) + 1rem)
      max(1.25rem, env(safe-area-inset-right, 0px))
      max(2rem, env(safe-area-inset-bottom, 0px))
      max(1.25rem, env(safe-area-inset-left, 0px));
    overflow:auto;
    -webkit-overflow-scrolling:touch;
  }

  .nav-screen__inner{
    width:min(36rem, 100%);
  }

  .nav-screen__kicker{
    margin:0 0 1.5rem;
    letter-spacing:.18em;
    text-transform:uppercase;
    font-size:.72rem;
    color:var(--muted);
  }

  .nav-screen__links{
    display:grid;
    gap:.15rem;
  }

  .nav-screen__links a{
    display:inline-flex;
    align-items:center;
    min-height:var(--tap);
    color:var(--paper);
    text-decoration:none;
    font-family:var(--display);
    font-size:clamp(1.85rem, 7vw, 3.1rem);
    line-height:1.12;
  }

  .nav-screen__links a[aria-current="page"]{
    color:var(--accent-2);
  }

  .nav-screen__sub{
    font-family:var(--sans) !important;
    font-size:1rem !important;
    color:var(--muted) !important;
    padding-left:.15rem;
  }

  .theme-toggle--menu{
    width:auto;
    min-height:var(--tap);
    padding:.65rem 1rem;
    gap:.65rem;
    margin:1.5rem 0 0;
  }

  .theme-toggle--menu .theme-toggle__name{
    display:inline;
    font-size:.92rem;
    font-weight:600;
    letter-spacing:-.01em;
  }

  .nav-screen__cta{
    display:flex;
    margin-top:1.25rem;
    width:100%;
  }

  .nav-screen__tag{
    margin:2rem 0 0;
    color:var(--muted);
    font-family:var(--display);
    font-style:italic;
  }

  body.nav-open{
    overflow:hidden;
  }
}

/* Footer */
.site-footer{
  margin-top:clamp(2.5rem, 6vw, 4rem);
  padding:clamp(2.5rem, 6vw, 4rem) 0 calc(1.5rem + env(safe-area-inset-bottom, 0px));
  border-top:1px solid var(--line);
}

.site-footer__grid{
  display:grid;
  grid-template-columns:1.4fr repeat(3, 1fr);
  gap:2.5rem;
}

.site-footer__line{
  margin:1.1rem 0 .4rem;
  font-family:var(--display);
  font-style:italic;
  font-size:1.45rem;
}

.site-footer h2{
  margin:0 0 .85rem;
  font-family:var(--sans);
  font-size:.72rem;
  font-weight:600;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--muted);
}

.site-footer ul{
  margin:0;
  padding:0;
  list-style:none;
}

.site-footer li + li{ margin-top:.45rem; }

.site-footer a{
  display:inline-flex;
  align-items:center;
  min-height:var(--tap);
  color:var(--paper);
  text-decoration:none;
  overflow-wrap:anywhere;
}

.site-footer a:hover{ color:var(--accent-2); }

.site-footer__bottom{
  display:flex;
  justify-content:space-between;
  gap:1rem;
  margin-top:3rem;
  padding-top:1.25rem;
  border-top:1px solid var(--line);
  color:var(--muted);
  font-size:.85rem;
}

.site-footer__bottom nav{
  display:flex;
  gap:1.1rem;
}

.site-footer__bottom a{ color:var(--muted); min-height:var(--tap); }

@media(max-width:1099px){
  .site-footer__grid{
    grid-template-columns:1fr 1fr;
    gap:2rem 1.5rem;
  }
}

@media(max-width:639px){
  .site-footer__grid,
  .site-footer__bottom{
    grid-template-columns:1fr;
    display:grid;
  }

  .site-footer__bottom nav{
    flex-wrap:wrap;
  }
}

/* Quiet the old orange glow cards a little */
.offer-card,
.plan-card,
.price-card,
.project-card,
.banner{
  background:var(--surface-2);
  border-color:var(--line);
  box-shadow:none;
}

.plan-card.is-featured,
.price-card.highlight{
  border-color:rgba(255,122,0,.35);
  background:rgba(255,122,0,.06);
}

@media(prefers-reduced-motion:reduce){
  *,
  *::before,
  *::after{
    animation:none !important;
    transition:none !important;
  }
}