/* ============================================================
   SI SIGNS USA — Design tokens
   Ink #000000 · Paper #FFFFFF · Red #910000 · Red-dim #6E0000 · Muted rgba(0,0,0,.62)
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Anton&family=Inter:wght@400;500;600;700;800&display=swap');

:root{
  --ink:#000000;          /* secondary color — pure black */
  --ink-soft:#141414;
  --ink-line: rgba(255,255,255,0.14);
  --paper:#FFFFFF;        /* background — white */
  --paper-line: rgba(0,0,0,0.12);
  --card:#FFFFFF;
  --amber:#910000;        /* primary color — SI Signs red */
  --amber-dim: #6E0000;   /* darker red for hover states */
  --dusk:#910000;         /* red accent bands (same primary) */
  --dusk-bright:#B31313;  /* lighter red for hover on red bands */
  --steel: rgba(0,0,0,0.62); /* muted black for secondary/body-adjacent text */
  --white:#FFFFFF;
  --off:#F7F7F7;          /* faint grey-white for alternating sections */

  --display: 'Anton', 'Arial Narrow', sans-serif;
  --body: 'Inter', -apple-system, sans-serif;

  --gap: clamp(1.25rem, 2vw, 2.5rem);
  --edge: clamp(1.5rem, 5vw, 5rem);
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:var(--body);
  font-size:16px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
ul{margin:0;padding:0;list-style:none;}
h1,h2,h3,h4{margin:0;font-family:var(--display);font-weight:400;letter-spacing:0.03em;text-transform:uppercase;}
p{margin:0;}
button{font-family:inherit;cursor:pointer;}

@media (prefers-reduced-motion: reduce){
  *{animation-duration:0.01ms !important; animation-iteration-count:1 !important; transition-duration:0.01ms !important; scroll-behavior:auto !important;}
}

:focus-visible{
  outline:2px solid var(--white);
  outline-offset:3px;
  box-shadow:0 0 0 5px rgba(0,0,0,0.55);
  border-radius:1px;
}

.eyebrow{
  font-weight:600;
  font-family:var(--body);
  font-size:0.72rem;
  letter-spacing:0.22em;
  text-transform:uppercase;
  color:var(--amber-dim);
}
.eyebrow.on-dark{ color:var(--white); }

.wrap{
  max-width:1280px;
  margin:0 auto;
  padding-left:var(--edge);
  padding-right:var(--edge);
}

/* ---------- Nav ---------- */
.site-nav{
  position:sticky; top:0; z-index:50;
  background:var(--white);
  border-bottom:1px solid var(--paper-line);
}
.site-nav .wrap{
  display:flex; align-items:center; justify-content:space-between;
  height:96px;
}
.nav-mark{
  display:flex; align-items:center; gap:0.8rem;
}
.nav-mark img{
  height:52px; width:auto; display:block;
}
.nav-mark .nav-wordmark{
  font-family:var(--display); font-size:1.44rem; letter-spacing:0.02em;
  color:var(--amber); line-height:1;
}
.nav-links{
  display:flex; align-items:center; gap:2.6rem;
}
.nav-links a{
  font-family:var(--body);
  font-weight:700;
  font-size:0.95rem;
  letter-spacing:0.1em;
  text-transform:uppercase;
  color:var(--amber);
  opacity:0.78;
  padding:0.4rem 0;
  border-bottom:1px solid transparent;
  transition:opacity .2s ease, border-color .2s ease;
}
.nav-links a:hover, .nav-links a[aria-current="page"]{ opacity:1; border-color:var(--amber); }
.nav-cta{
  font-family:var(--body);
  font-weight:700;
  font-size:0.9rem; line-height:1;
  letter-spacing:0.08em;
  text-transform:uppercase;
  color:var(--white);
  background:var(--amber);
  display:inline-flex; align-items:center; justify-content:center; min-height:50px;
  padding:0 1.7rem;
  border-radius:2px;
  white-space:nowrap;
  transition:transform .15s ease, box-shadow .15s ease;
}
.nav-cta:hover{ transform:translateY(-1px); box-shadow:0 0 16px rgba(145,0,0,0.5); }
.nav-toggle{ display:none; }

@media (max-width: 860px){
  .nav-links{ display:none; }
  .nav-toggle{
    display:flex; flex-direction:column; gap:6px;
    background:none; border:0; padding:0.5rem;
  }
  .nav-toggle span{ width:28px; height:3px; background:var(--amber); }
}

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex; align-items:center; gap:0.6rem;
  font-family:var(--body);
  font-size:0.9rem; font-weight:700; line-height:1;
  letter-spacing:0.08em;
  text-transform:uppercase;
  justify-content:center; min-height:50px;
  padding:0 1.7rem;
  border-radius:2px;
  border:1px solid transparent;
  transition:transform .15s ease, box-shadow .15s ease, background .15s ease;
}
.btn-primary{ background:var(--amber); color:var(--white); }
.btn-primary:hover{ transform:translateY(-1px); box-shadow:0 0 20px rgba(145,0,0,0.6); }
.btn-outline{ border-color:var(--ink-line); color:var(--white); }
.btn-outline:hover{ border-color:var(--white); background:rgba(255,255,255,0.08); }
.btn-outline.dark{ border-color:var(--paper-line); color:var(--ink); }
.btn-outline.dark:hover{ border-color:var(--dusk); color:var(--dusk); }

/* ---------- Hero / neon signature ---------- */
.hero{
  background:
    linear-gradient(180deg, rgba(0,0,0,0.68) 0%, rgba(0,0,0,0.82) 55%, rgba(0,0,0,0.94) 100%),
    url('assets/1.jpeg') center 38%/cover no-repeat;
  color:var(--white);
  position:relative;
  overflow:hidden;
  padding:clamp(4rem,10vw,7.5rem) 0 clamp(3rem,7vw,5rem);
}
.hero::after{
  content:"";
  position:absolute; inset:0;
  background-image:
    linear-gradient(rgba(255,255,255,0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,0.035) 1px, transparent 1px);
  background-size:56px 56px;
  pointer-events:none;
}
.hero-inner{ position:relative; z-index:1; max-width:1100px; }
.neon-sign{
  font-family:var(--display);
  font-size:clamp(1.9rem, 4.6vw, 4.2rem);
  line-height:0.98;
  letter-spacing:0.01em;
  color:var(--white);
  text-shadow:
    0 0 4px rgba(145,0,0,0.9),
    0 0 14px rgba(145,0,0,0.75),
    0 0 34px rgba(178,20,20,0.55),
    0 0 70px rgba(178,20,20,0.3);
  margin:1.1rem 0 0.6rem;
  animation: neonFlicker 5.5s ease-in-out infinite;
}
.neon-sign .accent{ color:var(--white); text-shadow:0 0 3px rgba(255,255,255,0.6), 0 0 18px rgba(255,255,255,0.25); }

@keyframes neonFlicker{
  0%, 3%, 6%, 100%{ opacity:1; }
  4%{ opacity:0.4; }
  5%{ opacity:0.85; }
  46%{ opacity:1; }
  47%{ opacity:0.5; }
  48%{ opacity:1; }
}

.hero-sub{
  font-size:clamp(1rem,1.6vw,1.2rem);
  color:rgba(255,255,255,0.72);
  max-width:52ch;
  margin-top:1.2rem;
}
.hero-actions .btn{ min-width:220px; }
.hero-actions{ display:flex; flex-wrap:wrap; gap:1rem; margin-top:2.2rem; }
.hero-contact{
  margin-top:2.6rem;
  display:flex; gap:2.2rem; flex-wrap:wrap;
  font-family:var(--body); font-size:0.82rem; color:rgba(255,255,255,0.6);
}
.hero-contact a{ color:var(--white); }
.hero-contact a:hover{ text-decoration:underline; text-underline-offset:3px; }

/* subpage hero (shorter) */
.page-hero{
  background:
    linear-gradient(180deg, rgba(15,10,10,0.75) 0%, rgba(15,10,10,0.9) 100%),
    var(--hero-img, none) center/cover no-repeat, var(--dusk);
  color:var(--white);
  padding:clamp(3rem,7vw,4.5rem) 0 clamp(2.2rem,5vw,3rem);
  position:relative; overflow:hidden;
}
.page-hero::after{
  content:""; position:absolute; inset:0;
  background-image:linear-gradient(rgba(255,255,255,0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,0.035) 1px, transparent 1px);
  background-size:56px 56px;
}
.page-hero .wrap{ position:relative; z-index:1; }
.page-hero h1{
  font-size:clamp(2.2rem,6vw,3.6rem);
  margin-top:0.6rem;
  color:var(--white);
}
.page-hero h1 .glow{
  color:var(--white);
  text-shadow:0 0 6px rgba(145,0,0,0.85), 0 0 24px rgba(178,20,20,0.5);
}
.page-hero p{ max-width:60ch; color:rgba(255,255,255,0.72); margin-top:1rem; font-size:1.05rem; }

/* ---------- Marquee (trusted by) ---------- */
.marquee-section{ background:var(--white); padding:2.6rem 0; border-top:1px solid var(--paper-line); border-bottom:1px solid var(--paper-line); overflow:hidden; }
.marquee-label{ color:var(--steel); font-family:var(--body); font-size:0.72rem; letter-spacing:0.2em; text-transform:uppercase; text-align:center; margin-bottom:1.4rem; }
.marquee-track{ display:flex; gap:1.4rem; width:max-content; animation:scroll 34s linear infinite; align-items:center; }
.marquee-track .partner-logo{
  display:flex; align-items:center; justify-content:center;
  height:80px; width:200px; padding:0.8rem 1.6rem;
  background:var(--white);
  border:1px solid var(--paper-line);
  border-radius:4px;
  box-shadow:0 1px 4px rgba(0,0,0,0.05);
}
.marquee-track .partner-logo img{ max-width:100%; max-height:100%; object-fit:contain; }
@keyframes scroll{ from{ transform:translateX(0);} to{ transform:translateX(-50%);} }

/* ---------- Sections ---------- */
section{ padding:clamp(3.5rem,7vw,6rem) 0; }
.section-head{ max-width:640px; margin-bottom:2.6rem; }
.section-head h2{ font-size:clamp(1.8rem,4vw,2.6rem); margin-top:0.5rem; color:var(--ink); }
.section-head p{ margin-top:0.9rem; color:var(--steel); font-size:1.02rem; max-width:56ch; }
.section-head.on-dark h2{ color:var(--white); }
.section-head.on-dark p{ color:rgba(255,255,255,0.78); }

.section-dusk{ background:var(--dusk); color:var(--white); }
.section-off{ background:var(--off); }

/* ---------- Services grid (chip style, echoes lit signage row) ---------- */
.services-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(230px,1fr));
  gap:1px;
  background:var(--paper-line);
  border:1px solid var(--paper-line);
}
.services-grid.grid-3col{ grid-template-columns:repeat(3,1fr); }
@media (max-width:760px){ .services-grid.grid-3col{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:480px){ .services-grid.grid-3col{ grid-template-columns:1fr; } }
.service-chip{
  background:var(--card);
  padding:1.6rem 1.5rem;
  display:flex; flex-direction:column; gap:0.9rem;
  min-height:172px;
  transition:background .2s ease;
}
.service-chip:hover{ background:var(--dusk); }
.service-chip:hover .service-name, .service-chip:hover .service-num{ color:var(--white); }
.service-num{ font-family:var(--body); font-size:0.72rem; color:var(--steel); transition:color .2s ease; }
.service-name{ font-family:var(--display); font-size:1.15rem; letter-spacing:0.01em; color:var(--ink); transition:color .2s ease; }
.service-tagline{ font-family:var(--body); font-size:0.86rem; color:var(--steel); line-height:1.45; }
.service-chip:hover .service-tagline{ color:rgba(255,255,255,0.7); }

/* ---------- Portfolio preview cards ---------- */
.preview-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:var(--gap); }
.preview-card{
  background:var(--card);
  border:1px solid var(--paper-line);
  display:flex; flex-direction:column;
}
.preview-art{
  aspect-ratio:4/3;
  background:var(--dusk);
  display:flex; align-items:center; justify-content:center;
  position:relative; overflow:hidden;
}
.preview-art svg{ width:62%; height:62%; }
.preview-art img, .gallery-art img{
  width:100%; height:100%; object-fit:cover;
  filter:grayscale(15%) contrast(1.05);
  transition:transform .5s ease;
}
.preview-card:hover .preview-art img, .gallery-card:hover .gallery-art img{ transform:scale(1.06); }
.preview-art::after, .gallery-art::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(145,0,0,0.14), rgba(15,10,10,0.35));
  mix-blend-mode:multiply;
  pointer-events:none;
}
.preview-body{ padding:1.6rem; display:flex; flex-direction:column; gap:0.6rem; flex:1; }
.preview-body h3{ font-size:1.25rem; color:var(--ink); }
.preview-body p{ color:var(--steel); font-size:0.94rem; flex:1; }
.preview-link{ font-family:var(--body); font-size:0.76rem; letter-spacing:0.1em; text-transform:uppercase; color:var(--dusk); }
.preview-link:hover{ color:var(--amber-dim); }

@media (max-width:900px){ .preview-grid{ grid-template-columns:1fr 1fr; } }
@media (max-width:600px){ .preview-grid{ grid-template-columns:1fr; } }

.preview-grid-4{ display:grid; grid-template-columns:repeat(4,1fr); gap:var(--gap); }
.preview-grid-4 .preview-art{ aspect-ratio:1/1; }
@media (max-width:900px){ .preview-grid-4{ grid-template-columns:1fr 1fr; } }
@media (max-width:520px){ .preview-grid-4{ grid-template-columns:1fr; } }

/* ---------- Split (who/what/process) ---------- */
.split{ display:grid; grid-template-columns:0.9fr 1.1fr; gap:clamp(2rem,5vw,5rem); align-items:start; }
@media (max-width:900px){ .split{ grid-template-columns:1fr; } }
.split h2, .apart h2{ font-size:clamp(1.8rem,4vw,2.6rem); margin-top:0.5rem; }
.split .reveal > p{ font-size:1.02rem; color:var(--steel); }
.apart .reveal > p{ font-size:1.02rem; color:rgba(255,255,255,0.75); }
.tab-row{ display:flex; gap:0; border-bottom:1px solid var(--paper-line); margin-bottom:1.8rem; }
.tab-row button{
  background:none;border:0;
  font-family:var(--body); font-size:0.78rem; letter-spacing:0.1em; text-transform:uppercase;
  color:var(--steel); padding:0.9rem 0; margin-right:2.2rem; position:relative;
}
.tab-row button[aria-selected="true"]{ color:var(--ink); }
.tab-row button[aria-selected="true"]::after{ content:""; position:absolute; left:0; right:0; bottom:-1px; height:2px; background:var(--amber); }
.tab-panel{ display:none; }
.tab-panel.active{ display:block; }
.tab-panel p{ color:var(--steel); font-size:1.02rem; margin-bottom:1.2rem; }
.tag-list{ display:flex; flex-wrap:wrap; gap:0.6rem; margin-top:1rem; }
.tag-list li{
  font-family:var(--body); font-size:0.78rem; padding:0.5rem 0.85rem;
  border:1px solid var(--paper-line); border-radius:2px; color:var(--ink);
}

/* ---------- Process steps ---------- */
.process-list{ counter-reset:step; display:flex; flex-direction:column; }
.process-list li{
  counter-increment:step;
  display:flex; align-items:baseline; gap:1.4rem;
  padding:1.1rem 0;
  border-top:1px solid var(--paper-line);
  font-size:1.05rem;
}
.process-list li:last-child{ border-bottom:1px solid var(--paper-line); }
.process-list li::before{
  content:counter(step,decimal-leading-zero);
  font-family:var(--body); color:var(--white); font-size:0.85rem; min-width:2ch; opacity:0.8;
}
.process-list li strong{
  display:block; font-family:var(--display); font-size:1.05rem;
  letter-spacing:0.06em; margin-bottom:0.45rem; text-transform:uppercase;
}

/* ---------- Apart / feature band ---------- */
.apart{
  display:grid; grid-template-columns:1fr 1fr; gap:clamp(2rem,5vw,4rem); align-items:center;
}
@media (max-width:860px){ .apart{ grid-template-columns:1fr; } }
.apart-visual{
  aspect-ratio:5/4; background:var(--off);
  border:1px solid var(--paper-line);
  display:flex; align-items:center; justify-content:center; overflow:hidden;
  position:relative;
}
.apart-visual svg{ width:70%; }
.apart-visual img{ width:100%; height:100%; object-fit:cover; }

.apart-visual.value-mode{
  display:grid; grid-template-columns:1fr 1fr; grid-template-rows:1fr 1fr;
  gap:1px; background:rgba(255,255,255,0.35); aspect-ratio:1/1;
}
.value-card{
  background:var(--white);
  padding:1.4rem; display:flex; flex-direction:column; justify-content:center; gap:0.5rem;
}
.value-card .value-num{ font-family:var(--display); font-size:1.5rem; color:var(--amber); line-height:1; }
.value-card .value-title{ font-family:var(--display); font-size:0.98rem; letter-spacing:0.01em; color:var(--ink); }
.value-card .value-desc{ font-family:var(--body); font-size:0.82rem; color:var(--steel); line-height:1.4; }
@media (max-width:420px){
  .value-card{ padding:1rem; }
  .value-card .value-desc{ display:none; }
}

/* ---------- Stat strip ---------- */
.stat-strip{ display:grid; grid-template-columns:repeat(4,1fr); border-top:1px solid var(--paper-line); border-bottom:1px solid var(--paper-line); }
.stat-strip div{ padding:1.8rem var(--edge); border-left:1px solid var(--paper-line); }
.stat-strip div:first-child{ border-left:0; }
.stat-num{ font-family:var(--display); font-size:2.2rem; color:var(--amber); }
.stat-label{ font-family:var(--body); font-size:0.72rem; letter-spacing:0.08em; text-transform:uppercase; color:var(--steel); margin-top:0.3rem; }
@media (max-width:760px){ .stat-strip{ grid-template-columns:1fr 1fr; } .stat-strip div{ border-top:1px solid var(--paper-line); } .stat-strip div:nth-child(2){ border-left:1px solid var(--paper-line);} .stat-strip div:nth-child(-n+2){ border-top:0; } }

/* ---------- CTA band ---------- */
.cta-band{
  background:var(--dusk); color:var(--white);
  padding:clamp(3rem,6vw,4.5rem) 0;
  display:flex; align-items:center; justify-content:space-between; gap:2rem; flex-wrap:wrap;
}
.cta-band h2{ font-size:clamp(1.6rem,3.5vw,2.3rem); max-width:20ch; }
.cta-band.slim{ padding:1.6rem 0; justify-content:center; text-align:center; }
.cta-band.slim h2{ font-size:clamp(1.15rem,2.4vw,1.6rem); max-width:none; white-space:nowrap; }
@media (max-width:640px){ .cta-band.slim h2{ white-space:normal; } }

/* ---------- Contact form ---------- */
.contact-grid{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(2rem,5vw,4rem); }
@media (max-width:900px){ .contact-grid{ grid-template-columns:1fr; } }
.field{ margin-bottom:1.3rem; display:flex; flex-direction:column; gap:0.45rem; }
.field label{ font-family:var(--body); font-size:0.72rem; letter-spacing:0.1em; text-transform:uppercase; color:var(--steel); }
.field input, .field select, .field textarea{
  font-family:var(--body); font-size:0.98rem; padding:0.85rem 0.9rem;
  border:1px solid var(--paper-line); background:var(--card); color:var(--ink);
  border-radius:2px;
}
.field input:focus, .field select:focus, .field textarea:focus{ border-color:var(--dusk); }
.field-row{ display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
@media (max-width:520px){ .field-row{ grid-template-columns:1fr; } }
.form-note{ font-family:var(--body); font-size:0.78rem; color:var(--steel); margin-top:1rem; }
.hp-field{
  position:absolute; left:-9999px; top:auto;
  width:1px; height:1px; overflow:hidden;
}
.contact-info{ display:flex; flex-direction:column; gap:1.6rem; }
.info-block h3{ font-size:1.15rem; color:var(--ink); margin-bottom:0.5rem; }
.info-block p, .info-block a{ color:var(--steel); font-size:0.98rem; }
.info-block a:hover{ color:var(--dusk); }
.map-plate{
  aspect-ratio:16/9; background:var(--off);
  border:1px solid var(--paper-line);
  display:flex; align-items:center; justify-content:center;
  color:var(--steel); font-family:var(--body); font-size:0.8rem;
}

/* ---------- Portfolio filter/gallery ---------- */
.filter-row{ display:flex; flex-wrap:wrap; gap:0.7rem; margin-bottom:2.4rem; }
.filter-row button{
  background:none; border:1px solid var(--paper-line); color:var(--steel);
  font-family:var(--body); font-size:0.75rem; letter-spacing:0.06em; text-transform:uppercase;
  padding:0.55rem 1rem; border-radius:2px; transition:all .15s ease;
}
.filter-row button[aria-pressed="true"], .filter-row button:hover{ border-color:var(--dusk); color:var(--dusk); }
.gallery-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:var(--gap); }
@media (max-width:900px){ .gallery-grid{ grid-template-columns:1fr 1fr; } }
@media (max-width:600px){ .gallery-grid{ grid-template-columns:1fr; } }
.gallery-card{ border:1px solid var(--paper-line); background:var(--card); }
.gallery-art{ aspect-ratio:1/1; background:var(--dusk); display:flex; align-items:center; justify-content:center; position:relative; overflow:hidden; }
.gallery-art svg{ width:58%; }
.gallery-cap{ padding:1.1rem 1.3rem; display:flex; flex-direction:column; gap:0.35rem; }
.gallery-cap h3{ font-size:1.05rem; color:var(--ink); }
.gallery-cap span{ font-family:var(--body); font-size:0.85rem; color:var(--steel); text-transform:none; line-height:1.4; }

/* ---------- Footer ---------- */
footer{ background:var(--white); color:var(--steel); padding:3.5rem 0 2rem; border-top:1px solid var(--paper-line); }
.foot-top{ display:flex; justify-content:space-between; gap:2rem; flex-wrap:wrap; padding-bottom:2.4rem; border-bottom:1px solid var(--paper-line); }
.foot-mark{ display:flex; align-items:center; gap:0.6rem; }
.foot-mark img{ height:30px; width:auto; display:block; }
.foot-mark .foot-wordmark{ font-family:var(--display); font-size:1.15rem; letter-spacing:0.02em; color:var(--amber); }
.foot-links{ display:flex; gap:2.4rem; flex-wrap:wrap; }
.foot-links a{ font-family:var(--body); font-size:0.78rem; letter-spacing:0.08em; text-transform:uppercase; }
.foot-links a:hover{ color:var(--amber); }
.foot-bottom{ align-items:center; display:flex; justify-content:space-between; gap:1rem; flex-wrap:wrap; padding-top:1.6rem; font-family:var(--body); font-size:0.74rem; }

/* ---------- Reveal on scroll ---------- */
.reveal{ opacity:0; transform:translateY(16px); transition:opacity .6s ease, transform .6s ease; }
.reveal.in{ opacity:1; transform:translateY(0); }

/* ---------- Single-line eyebrow ---------- */
.eyebrow.one-line{ white-space:nowrap; font-size:clamp(0.56rem,1.7vw,0.7rem); letter-spacing:0.1em; }

/* ---------- Links: bold so they stand apart from body copy ---------- */
a[href^="tel:"], a[href^="mailto:"], .hero-contact a, .contact-info a, .preview-link, .foot-bottom a, .apart .reveal > p a, .split .reveal p a{ font-weight:700; }
.contact-info a, .foot-bottom a, .apart .reveal > p a, .split .reveal p a{ text-decoration:underline; text-underline-offset:3px; }
.foot-bottom a:hover{ color:var(--amber); }

/* ---------- Icons ---------- */
.ico{ width:26px; height:26px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; flex:none; }
.step-ico{ display:inline-flex; align-items:center; justify-content:center; width:48px; height:48px; border-radius:50%; background:var(--amber); color:var(--white); flex:none; }
.step-ico.light{ background:transparent; border:1.5px solid rgba(255,255,255,0.85); color:var(--white); }
.step-head{ display:flex; align-items:center; gap:0.9rem; }
.preview-body .step-head h3{ margin:0; }
.process-list.with-icons li{ align-items:flex-start; gap:1.3rem; }
.process-list.with-icons li::before{ display:none; }

/* ---------- Unified value grid (Real expertise) ---------- */
.value-grid{ display:grid; grid-template-columns:1fr 1fr; background:var(--white); color:var(--ink); }
.value-cell{ padding:1.8rem 1.6rem; display:flex; flex-direction:column; gap:0.7rem; border-left:1px solid var(--paper-line); border-top:1px solid var(--paper-line); }
.value-cell:nth-child(odd){ border-left:0; }
.value-cell:nth-child(-n+2){ border-top:0; }
.value-cell .step-ico{ width:46px; height:46px; }
.value-cell h3{ font-size:1.05rem; color:var(--ink); }
.value-cell p{ font-size:0.88rem; color:var(--steel); line-height:1.5; }
@media (max-width:520px){ .value-grid{ grid-template-columns:1fr; } .value-cell{ border-left:0 !important; border-top:1px solid var(--paper-line) !important; } .value-cell:first-child{ border-top:0 !important; } }

/* ---------- Footer (single row) ---------- */
footer{ padding:2rem 0; }
.foot-bottom{ padding-top:0; }
@media (min-width:700px){ .neon-sign .l1{ white-space:nowrap; } }

/* ---------- Type system: Anton = headings; Inter = body / labels / actions ---------- */
.eyebrow, .marquee-label, .stat-label, .field label, .tab-row button, .preview-link, .tag-list li, .form-note, .foot-links a{
  font-family:var(--body); font-weight:600; text-transform:none; letter-spacing:0;
}
.eyebrow{ font-size:0.95rem; font-weight:700; }
.eyebrow.one-line{ font-size:clamp(0.78rem,2.3vw,0.95rem); letter-spacing:0; }
.marquee-label{ font-size:0.95rem; }
.stat-label{ font-size:0.9rem; }
.field label{ font-size:0.9rem; color:var(--ink); }
.tab-row button{ font-size:0.95rem; }
.preview-link{ font-size:0.92rem; font-weight:700; }
.tag-list li{ font-size:0.88rem; font-weight:500; }
.nav-links a{ letter-spacing:0.06em; }
.info-block h3{ font-family:var(--body); font-size:1.05rem; font-weight:700; text-transform:none; letter-spacing:0; color:var(--ink); margin-bottom:0.35rem; }
.info-block p, .info-block a{ font-size:0.98rem; line-height:1.6; }

/* ---------- Centered CTA band ---------- */
.cta-band.centered .wrap{ display:flex; flex-direction:column; align-items:center; gap:0.5rem; text-align:center; }
.cta-band.centered h2, .cta-link{ font-family:var(--display); font-size:clamp(1.4rem,3.4vw,2.2rem); line-height:1.25; letter-spacing:0.03em; text-transform:uppercase; max-width:none; }
.cta-link{ color:var(--white); font-weight:700; text-decoration:underline; text-underline-offset:6px; text-decoration-thickness:2px; }
.cta-link:hover{ text-decoration-thickness:4px; }

/* ---------- Flow chart ---------- */
.flow{ display:flex; justify-content:space-between; gap:0; margin-top:1rem; }
.flow li{ position:relative; flex:1; display:flex; flex-direction:column; align-items:center; gap:0.9rem; text-align:center; padding:0 0.4rem; }
.flow .step-ico{ width:72px; height:72px; }
.flow .step-ico .ico{ width:32px; height:32px; }
.flow strong{ font-family:var(--display); font-weight:400; font-size:1.1rem; letter-spacing:0.05em; text-transform:uppercase; color:var(--ink); }
.flow li:not(:last-child)::after{ content:""; position:absolute; top:35px; left:calc(50% + 46px); right:calc(-50% + 46px); height:2px; background:var(--amber); }
.flow li:not(:last-child)::before{ content:""; position:absolute; top:30px; right:calc(-50% + 46px); width:10px; height:10px; border-top:2px solid var(--amber); border-right:2px solid var(--amber); transform:rotate(45deg); }
@media (max-width:900px){
  .flow{ flex-direction:column; gap:2.4rem; align-items:flex-start; padding-left:0.5rem; }
  .flow li{ flex-direction:row; text-align:left; gap:1.2rem; padding:0; }
  .flow li:not(:last-child)::after{ top:76px; left:35px; right:auto; width:2px; height:calc(2.4rem - 8px); }
  .flow li:not(:last-child)::before{ top:calc(76px + 2.4rem - 14px); left:31px; right:auto; transform:rotate(135deg); }
}

.ico.ico-fill{ fill:currentColor; stroke:none; }
.step-ico .ico.ico-fill{ height:32px; width:auto; }
.value-cell .step-ico .ico.ico-fill{ height:30px; }
.flow .step-ico .ico.ico-fill{ height:46px; width:auto; }
