/* ============================================================
   ICOSA LTD  ·  Contact.  Shares the homepage token system.
   The form itself is rendered by Gravity Forms; its appearance is
   mapped onto this design in assets/css/gform.css.
   ============================================================ */
:root{
  --black:      #000000;
  --ink:        #0B0B0B;
  --ink-2:      #141414;
  --ink-3:      #060606;
  --white:      #FFFFFF;
  --orange:     #FF631F;
  --orange-hi:  #FF8347;
  --burnt:      #C74906;
  --mut-dark:   #9C9C9C;
  --mut-light:  #5A5A5A;
  --line-dark:  rgba(255,255,255,.15);
  --line-light: rgba(0,0,0,.15);
  --err:        #B3261E;

  --ff-display: "Rokkitt", Georgia, serif;
  --ff-sans:    "Archivo", "Helvetica Neue", Arial, sans-serif;
  --ff-mono:    "IBM Plex Mono", ui-monospace, monospace;

  --h1:  clamp(2.6rem, 6vw, 5.6rem);
  --h2:  clamp(2.2rem, 4.6vw, 4.4rem);
  --sec: clamp(96px, 9vw, 160px);
  --ease: cubic-bezier(.16,1,.3,1);
}

/* ---------- Type scale for this template ---------- */
.h-display{ letter-spacing:-.015em; max-width:22ch; }
.lede{ max-width:78ch; font-size:1.125rem; }
.h-display + p, .h-display + .lede{ margin-top:clamp(24px, 2.6vw, 38px); }
.eyebrow + .h-display{ margin-top:clamp(20px, 2.2vw, 28px); }

/* ============================================================
   Contact screen: one frame, copy left, form right
   ============================================================ */
.screen{
  position:relative; background:var(--white); color:var(--black); overflow:hidden;
  min-height:calc(100svh - var(--nav-h, 95px));
  display:flex; align-items:center;
  padding-block:clamp(34px, 5vh, 76px);
}
.screen .shell{ position:relative; z-index:1; width:100%; }
.screen-mark{
  position:absolute; right:-14%; bottom:-34%;
  width:clamp(280px, 34vw, 560px); height:auto; fill:var(--burnt);
  opacity:.055; pointer-events:none; z-index:0;
}
.screen-grid{
  display:grid; grid-template-columns:minmax(0,44fr) minmax(0,56fr);
  gap:clamp(38px, 4.4vw, 92px); align-items:start;
}

/* ---------- Left: the invitation ---------- */
.screen h1{
  font-family:var(--ff-display); font-weight:500;
  font-size:clamp(2.1rem, 3.3vw, 3.5rem); line-height:1.05; letter-spacing:-.02em;
  max-width:21ch; margin-top:clamp(16px, 1.8vw, 24px); color:var(--black);
}
.screen h1 em{ font-style:normal; color:var(--burnt); }
.intro{
  margin-top:clamp(16px, 1.8vw, 24px); max-width:60ch;
  color:var(--mut-light); font-size:clamp(.98rem, 1.05vw, 1.08rem);
}
.steps{
  list-style:none; counter-reset:step;
  margin-top:clamp(24px, 2.8vw, 40px);
  border-top:1px solid var(--line-light); padding-top:clamp(20px, 2.2vw, 28px);
}
.steps li{
  counter-increment:step; display:flex; gap:14px;
  color:var(--mut-light); font-size:.95rem; line-height:1.55;
  padding-block:7px; max-width:68ch;
}
.steps li::before{
  content:counter(step); flex:none;
  font-family:var(--ff-mono); font-size:.72rem; color:var(--burnt);
  padding-top:3px;
}
.steps b{ color:var(--black); font-weight:600; }
.direct{
  margin-top:clamp(20px, 2.4vw, 32px);
  font-family:var(--ff-mono); font-size:.76rem; letter-spacing:.1em;
  text-transform:uppercase; color:var(--mut-light);
}
.direct a{
  text-transform:none; letter-spacing:.02em; font-size:.85rem;
  color:var(--burnt); border-bottom:1px solid rgba(199,73,6,.4);
  padding-bottom:2px; transition:border-color .3s var(--ease);
}
.direct a:hover{ border-bottom-color:var(--burnt); }

/* ---------- Right: the form column ---------- */
.form-col{ border-left:1px solid var(--line-light); padding-left:clamp(34px, 4vw, 76px); }

/* ============================================================
   Responsive
   ============================================================ */
@media (max-width: 980px){
  .screen{ min-height:0; padding-block:clamp(48px, 7vw, 76px); }
  .screen-grid{ grid-template-columns:minmax(0,1fr); gap:clamp(38px, 5vw, 56px); }
  .form-col{
    border-left:none; padding-left:0;
    border-top:1px solid var(--line-dark); padding-top:clamp(34px, 4.4vw, 48px);
  }
  .screen-mark{ opacity:.05; right:-24%; }
}