:root{
    --bg:#ffffff;
    --ink:#000000;
    --hair: 1px solid #000000;
    --gap: 0px;
    --header-h: 84px;
  }
  *{box-sizing:border-box; margin:0; padding:0;}
  html{scroll-behavior:smooth;}
  body{
    background:var(--bg);
    color:var(--ink);
    font-family:'Inter', sans-serif;
    -webkit-font-smoothing:antialiased;
    overflow-x:hidden;
  }
  a{color:inherit; text-decoration:none;}
  img{display:block; max-width:100%;}

  /* ---------- Header ---------- */
  header{
    position:fixed;
    top:0; left:0; right:0;
    height:var(--header-h);
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:0 28px;
    background:var(--bg);
    z-index:100;
    border-bottom:var(--hair);
  }
  .brand{
    display:flex;
    align-items:center;
    min-width:0;
  }
  .wordmark{
    font-family:'Anton', sans-serif;
    font-size:clamp(18px, 2.6vw, 26px);
    letter-spacing:0.01em;
    line-height:1.05;
    text-transform:uppercase;
    white-space:nowrap;
  }
  .wordmark span{
    display:block;
    font-family:'Space Mono', monospace;
    font-size:9px;
    font-weight:700;
    letter-spacing:0.24em;
    margin-top:5px;
    color:var(--ink);
  }

  nav.primary-nav{
    display:flex;
    align-items:center;
    gap:clamp(18px, 2.6vw, 40px);
  }
  nav.primary-nav a{
    font-family:'Anton', sans-serif;
    font-weight:400;
    font-size:15px;
    letter-spacing:0.03em;
    text-transform:uppercase;
    position:relative;
    padding-bottom:4px;
  }
  nav.primary-nav a::after{
    content:"";
    position:absolute;
    left:0; right:100%;
    bottom:0;
    height:3px;
    background:var(--ink);
    transition:right 0.22s cubic-bezier(.4,0,.2,1);
  }
  nav.primary-nav a:hover::after,
  nav.primary-nav a:focus-visible::after{
    right:0;
  }
  nav.primary-nav a:focus-visible,
  .hamburger:focus-visible,
  .mobile-nav a:focus-visible{
    outline:2px solid var(--ink);
    outline-offset:3px;
  }

  /* Hamburger */
  .hamburger{
    display:none;
    flex-direction:column;
    justify-content:center;
    gap:6px;
    width:34px;
    height:34px;
    background:none;
    border:none;
    cursor:pointer;
    z-index:200;
  }
  .hamburger span{
    display:block;
    height:3px;
    width:100%;
    background:var(--ink);
    transition:transform 0.25s ease, opacity 0.2s ease;
  }
  body.menu-open .hamburger span:nth-child(1){ transform:translateY(9px) rotate(45deg); }
  body.menu-open .hamburger span:nth-child(2){ opacity:0; }
  body.menu-open .hamburger span:nth-child(3){ transform:translateY(-9px) rotate(-45deg); }

  .mobile-nav{
    position:fixed;
    inset:0;
    background:var(--bg);
    z-index:150;
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    justify-content:center;
    gap:22px;
    padding:0 32px;
    transform:translateY(-100%);
    transition:transform 0.35s cubic-bezier(.4,0,.2,1);
  }
  body.menu-open .mobile-nav{
    transform:translateY(0);
  }
  .mobile-nav a{
    font-family:'Anton', sans-serif;
    font-size:clamp(32px, 11vw, 56px);
    text-transform:uppercase;
    letter-spacing:0.01em;
  }
  .mobile-nav .mobile-nav-foot{
    position:absolute;
    bottom:28px;
    left:32px;
    font-family:'Space Mono', monospace;
    font-size:11px;
    letter-spacing:0.15em;
    text-transform:uppercase;
  }

  /* ---------- Hero ---------- */
  main{ margin-top:var(--header-h); }

  .hero{
    display:grid;
    grid-template-columns:repeat(3, 1fr);
    gap:var(--gap);
    width:100%;
    border-bottom:var(--hair);
  }
  .hero-piece{
    position:relative;
    overflow:hidden;
    height:calc(100vh - var(--header-h));
    background:#ffffff;
    border-right:var(--hair);
  }
  .hero-piece:last-child{ border-right:none; }
  .hero-piece img{
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:center;
    mix-blend-mode:multiply;
    filter:contrast(1.05);
  }
  .hero-tag{
    position:absolute;
    left:14px;
    bottom:14px;
    font-family:'Space Mono', monospace;
    font-size:10px;
    letter-spacing:0.14em;
    text-transform:uppercase;
    background:var(--bg);
    padding:3px 8px;
    border:1px solid var(--ink);
  }

  /* ---------- Below hero placeholder ---------- */
  .below-hero{
    padding:64px 28px 96px;
    text-align:center;
  }
  .below-hero p{
    font-family:'Space Mono', monospace;
    font-size:12px;
    letter-spacing:0.2em;
    text-transform:uppercase;
  }

  /* ---------- Zine grid ---------- */
  .zine{
    padding:56px 0 96px;
    border-top:var(--hair);
  }
  .zine-head{
    padding:0 28px;
    margin-bottom:32px;
  }
  .zine-eyebrow{
    font-family:'Space Mono', monospace;
    font-size:11px;
    letter-spacing:0.2em;
    text-transform:uppercase;
  }

  .zine-board{
    display:grid;
    grid-template-columns:repeat(12, 1fr);
    grid-auto-rows:56px;
    grid-auto-flow:dense;
    gap:26px 22px;
    padding:20px 40px 40px;
    background-image:radial-gradient(rgba(0,0,0,0.14) 1px, transparent 1.4px);
    background-size:18px 18px;
  }
  .tile{
    position:relative;
    border:1px solid var(--ink);
    background:var(--bg);
    padding:8px 8px 30px;
    transition:transform 0.25s cubic-bezier(.4,0,.2,1), box-shadow 0.25s ease;
    will-change:transform;
  }
  @media (hover:hover) and (pointer:fine){
    .tile:hover{
      transform:rotate(0deg) scale(1.035) !important;
      box-shadow:0 16px 30px rgba(0,0,0,0.2);
      z-index:20;
    }
  }
  .tile:focus-visible{
    transform:rotate(0deg) scale(1.035) !important;
    box-shadow:0 16px 30px rgba(0,0,0,0.2);
    z-index:20;
  }
  .tile::before{
    content:"";
    position:absolute;
    top:-8px;
    left:50%;
    transform:translateX(-50%);
    width:13px;
    height:13px;
    border-radius:50%;
    background:var(--ink);
    box-shadow:0 2px 3px rgba(0,0,0,0.35);
  }
  .tile img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
    -webkit-user-drag:none;
    pointer-events:none;
  }
  .tile figcaption{
    position:absolute;
    left:9px;
    bottom:9px;
    font-family:'Space Mono', monospace;
    font-size:10px;
    letter-spacing:0.14em;
    text-transform:uppercase;
  }

  .tile:nth-child(1){ grid-column:span 5; grid-row:span 5; transform:rotate(-2.5deg); }
  .tile:nth-child(2){ grid-column:span 4; grid-row:span 6; transform:rotate(1.5deg); }
  .tile:nth-child(3){ grid-column:span 3; grid-row:span 4; transform:rotate(-1deg); }
  .tile:nth-child(4){ grid-column:span 4; grid-row:span 4; transform:rotate(2deg); }
  .tile:nth-child(5){ grid-column:span 5; grid-row:span 6; transform:rotate(-1.5deg); }
  .tile:nth-child(6){ grid-column:span 3; grid-row:span 4; transform:rotate(1.2deg); }

  @media (min-width: 901px){
    .mobile-nav{ display:none !important; }
  }

  /* ---------- Studio ---------- */
  .studio{
    padding:80px 0 96px;
    border-top:var(--hair);
  }
  .studio-inner{
    display:grid;
    grid-template-columns:260px 1fr;
    gap:56px;
    padding:0 28px;
    align-items:start;
  }
  .studio-title{
    font-family:'Anton', sans-serif;
    font-size:clamp(34px, 4.2vw, 54px);
    text-transform:uppercase;
    line-height:1;
  }
  .studio-sub{
    font-family:'Space Mono', monospace;
    font-size:11px;
    letter-spacing:0.18em;
    text-transform:uppercase;
    margin-top:14px;
  }
  .studio-grid{
    display:grid;
    grid-template-columns:repeat(2, 1fr);
    grid-auto-rows:230px;
    gap:20px;
  }
  .studio-tile{
    position:relative;
    border:1px solid var(--ink);
    overflow:hidden;
  }
  .studio-tile img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
  }
  .studio-tile figcaption{
    position:absolute;
    left:10px;
    bottom:10px;
    font-family:'Space Mono', monospace;
    font-size:10px;
    letter-spacing:0.14em;
    text-transform:uppercase;
    background:var(--bg);
    padding:2px 7px;
    border:1px solid var(--ink);
  }
  .studio-tile--tall{ grid-row:span 2; }
  .studio-tile--wide{ grid-column:span 2; }

  /* ---------- Journal ---------- */
  .journal-section{
    padding:80px 0 96px;
    border-top:var(--hair);
  }
  .journal-head{
    padding:0 28px;
    max-width:640px;
    margin:0 auto 40px;
  }
  .journal-list{
    display:flex;
    flex-direction:column;
    gap:26px;
    max-width:640px;
    margin:0 auto;
    padding:0 28px;
  }
  .entry-card{
    position:relative;
    border:1px solid var(--ink);
    background:var(--bg);
    padding:26px 28px;
  }
  .entry-card::before{
    content:"";
    position:absolute;
    top:-1px;
    right:-1px;
    width:0;
    height:0;
    border-top:24px solid var(--ink);
    border-left:24px solid transparent;
  }
  .entry-card::after{
    content:"";
    position:absolute;
    top:0;
    right:0;
    width:0;
    height:0;
    border-top:21px solid var(--bg);
    border-left:21px solid transparent;
  }
  .entry-date{
    font-family:'Space Mono', monospace;
    font-size:10px;
    letter-spacing:0.14em;
    text-transform:uppercase;
    opacity:0.6;
  }
  .entry-title{
    font-family:'Anton', sans-serif;
    font-size:clamp(20px, 2.6vw, 27px);
    text-transform:uppercase;
    margin:8px 0 12px;
    line-height:1.1;
  }
  .entry-body{
    font-family:'Inter', sans-serif;
    font-size:15px;
    line-height:1.65;
  }
  .entry-body em{
    font-style:italic;
  }

  /* ---------- The Artist ---------- */
  .artist-section{
    padding:80px 0 96px;
    border-top:var(--hair);
  }
  .artist-grid{
    display:grid;
    grid-template-columns:repeat(4, 1fr);
    gap:20px;
  }
  .artist-tile{
    position:relative;
    border:1px solid var(--ink);
    aspect-ratio:3/4;
    overflow:hidden;
  }
  .artist-tile img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
  }
  .artist-tile figcaption{
    position:absolute;
    left:9px;
    bottom:9px;
    font-family:'Space Mono', monospace;
    font-size:10px;
    letter-spacing:0.14em;
    text-transform:uppercase;
    color:#fff;
    text-shadow:0 1px 3px rgba(0,0,0,0.6);
  }

  /* ---------- Sketchbook ---------- */
  .sketchbook-section{
    padding:88px 0 100px;
    border-top:var(--hair);
  }
  .sketchbook-inner{
    display:grid;
    grid-template-columns:320px 1fr;
    gap:72px;
    padding:0 28px;
    align-items:start;
  }

  .book-mock{
    display:flex;
    justify-content:center;
    padding:20px 0 40px;
  }
  .book-cover{
    position:relative;
    width:260px;
    aspect-ratio:3/4;
    background:var(--bg);
    border:2px solid var(--ink);
    padding:20px;
    display:flex;
    flex-direction:column;
    transform:rotate(-3deg);
    box-shadow:
      7px 7px 0 var(--bg),
      7px 7px 0 2px var(--ink),
      13px 13px 0 var(--bg),
      13px 13px 0 2px var(--ink);
  }
  .book-stamp{
    position:absolute;
    top:-14px;
    right:-18px;
    transform:rotate(9deg);
    background:var(--bg);
    border:2px solid var(--ink);
    border-radius:50%;
    width:74px;
    height:74px;
    display:flex;
    align-items:center;
    justify-content:center;
    text-align:center;
    font-family:'Space Mono', monospace;
    font-size:9px;
    font-weight:700;
    letter-spacing:0.06em;
    text-transform:uppercase;
    line-height:1.25;
    padding:4px;
    z-index:2;
  }
  .book-art{
    width:100%;
    aspect-ratio:1;
    border:1px solid var(--ink);
    overflow:hidden;
    margin-bottom:16px;
  }
  .book-art img{
    width:100%;
    height:100%;
    object-fit:cover;
    mix-blend-mode:multiply;
  }
  .book-kicker{
    font-family:'Space Mono', monospace;
    font-size:9px;
    letter-spacing:0.16em;
    text-transform:uppercase;
    opacity:0.7;
  }
  .book-title{
    font-family:'Anton', sans-serif;
    font-size:clamp(24px, 3vw, 30px);
    text-transform:uppercase;
    line-height:1.05;
    margin-top:6px;
  }

  .sketchbook-copy{ max-width:560px; }
  .sketchbook-text{
    font-family:'Inter', sans-serif;
    font-size:16px;
    line-height:1.65;
    margin:18px 0 34px;
  }

  .notify-form{ display:flex; flex-direction:column; gap:20px; max-width:440px; }
  .form-row{ display:flex; gap:18px; }
  .form-field{ flex:1; display:flex; flex-direction:column; gap:6px; }
  .form-field label{
    font-family:'Space Mono', monospace;
    font-size:10px;
    letter-spacing:0.12em;
    text-transform:uppercase;
    opacity:0.75;
  }
  .form-field input{
    font-family:'Inter', sans-serif;
    font-size:15px;
    color:var(--ink);
    background:transparent;
    border:none;
    border-bottom:2px solid var(--ink);
    padding:8px 2px;
    outline:none;
  }
  .form-field input:focus-visible{
    border-bottom-color:var(--ink);
    background:rgba(0,0,0,0.03);
  }
  .form-field input:invalid:not(:placeholder-shown){
    border-bottom-color:#b00020;
  }
  .notify-submit{
    align-self:flex-start;
    font-family:'Anton', sans-serif;
    font-size:14px;
    letter-spacing:0.04em;
    text-transform:uppercase;
    background:var(--ink);
    color:var(--bg);
    border:2px solid var(--ink);
    padding:14px 30px;
    cursor:pointer;
    transition:background 0.15s ease, color 0.15s ease;
    margin-top:6px;
  }
  .notify-submit:hover,
  .notify-submit:focus-visible{
    background:var(--bg);
    color:var(--ink);
  }
  .notify-submit:disabled{
    opacity:0.5;
    cursor:default;
  }
  .notify-note{
    font-family:'Space Mono', monospace;
    font-size:10px;
    letter-spacing:0.08em;
    text-transform:uppercase;
    opacity:0.55;
  }
  .notify-status{
    font-family:'Space Mono', monospace;
    font-size:12px;
    letter-spacing:0.04em;
    min-height:16px;
  }
  .notify-status.is-success{ opacity:1; }
  .notify-status.is-error{ color:#b00020; }

  /* ---------- Footer ---------- */
  .site-footer{
    background:var(--ink);
    color:var(--bg);
    padding:56px 28px 28px;

  }
  .footer-top{
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    justify-content:space-between;
    gap:24px;
    padding-bottom:40px;
    border-bottom:1px solid rgba(255,255,255,0.25);
  }
  .footer-word{
    font-family:'Anton', sans-serif;
    font-size:clamp(22px, 3vw, 30px);
    text-transform:uppercase;
  }
  .footer-nav{
    display:flex;
    flex-wrap:wrap;
    gap:clamp(16px, 2.4vw, 32px);
  }
  .footer-nav a{
    font-family:'Anton', sans-serif;
    font-size:14px;
    letter-spacing:0.03em;
    text-transform:uppercase;
    color:var(--bg);
    padding-bottom:3px;
    border-bottom:2px solid transparent;
    transition:border-color 0.2s ease;
  }
  .footer-nav a:hover,
  .footer-nav a:focus-visible{
    border-color:var(--bg);
  }
  .footer-bottom{
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    justify-content:space-between;
    gap:14px;
    padding-top:22px;
  }
  .footer-bottom p{
    font-family:'Space Mono', monospace;
    font-size:11px;
    letter-spacing:0.08em;
    opacity:0.75;
  }
  .footer-top-link{
    font-family:'Space Mono', monospace;
    font-size:11px;
    letter-spacing:0.12em;
    text-transform:uppercase;
    color:var(--bg);
    border-bottom:1px solid rgba(255,255,255,0.5);
  }

  @media (max-width: 900px){
    nav.primary-nav{ display:none; }
    .hamburger{ display:flex; }
    .hero{
      grid-template-columns:1fr;
    }
    .hero-piece{
      height:auto;
      aspect-ratio:4/5;
      border-right:none;
      border-bottom:var(--hair);
    }
    .hero-piece:last-child{ border-bottom:none; }
    .zine-board{
      grid-template-columns:1fr;
      grid-auto-rows:auto;
      padding:16px 22px 30px;
      gap:34px;
    }
    .tile{
      grid-column:auto !important;
      grid-row:auto !important;
      aspect-ratio:4/5;
      height:auto;
    }
    .tile:nth-child(odd){ transform:rotate(-1.2deg); }
    .tile:nth-child(even){ transform:rotate(1.2deg); }

    .studio-inner{
      grid-template-columns:1fr;
      gap:32px;
    }
    .studio-grid{
      grid-template-columns:1fr;
      grid-auto-rows:auto;
    }
    .studio-tile{ aspect-ratio:4/5; }
    .studio-tile--tall{ grid-row:auto; }
    .studio-tile--wide{ grid-column:auto; }

    .artist-grid{
      grid-template-columns:repeat(2, 1fr);
      gap:14px;
    }

    .sketchbook-inner{
      grid-template-columns:1fr;
      gap:20px;
    }
    .form-row{
      flex-direction:column;
      gap:20px;
    }
  }

  @media (prefers-reduced-motion: reduce){
    *{ transition:none !important; scroll-behavior:auto !important; }
  }