/* ── Marquee ── */
.marquee{
  border-top:1px solid var(--line);border-bottom:1px solid var(--line);
  overflow:hidden;padding:28px 0;background:var(--bg);position:relative;
  transition:background .6s,border-color .6s;
}
.marquee-track{
  display:flex;gap:60px;animation:marquee 40s linear infinite;
  white-space:nowrap;will-change:transform;transition:transform .25s ease-out;
}
.marquee:hover .marquee-track{animation-play-state:paused}
.marquee-item{
  font-family:var(--display);font-weight:300;font-size:clamp(40px,7vw,96px);
  letter-spacing:-.03em;display:flex;align-items:center;gap:60px;
}
.marquee-item em{font-family:var(--serif);font-style:italic}
.marquee-item::after{content:'✺';font-size:.4em}
/* funky: cycle marquee item colors */
.marquee-item:nth-child(6n+1) em,.marquee-item:nth-child(6n+1)::after{color:var(--c-yellow)}
.marquee-item:nth-child(6n+2) em,.marquee-item:nth-child(6n+2)::after{color:var(--c-cyan)}
.marquee-item:nth-child(6n+3) em,.marquee-item:nth-child(6n+3)::after{color:var(--c-pink)}
.marquee-item:nth-child(6n+4) em,.marquee-item:nth-child(6n+4)::after{color:var(--c-blue)}
.marquee-item:nth-child(6n+5) em,.marquee-item:nth-child(6n+5)::after{color:var(--c-green-kryp)}
.marquee-item:nth-child(6n+6) em,.marquee-item:nth-child(6n+6)::after{color:var(--c-party)}
[data-theme="light"] .marquee-item em,[data-theme="light"] .marquee-item::after{filter:saturate(1.1) brightness(.82)}
@keyframes marquee{to{transform:translateX(-50%)}}
.marquee-reverse .marquee-track{animation:marqueeRev 50s linear infinite}
@keyframes marqueeRev{from{transform:translateX(-50%)}to{transform:translateX(0)}}

/* ── Generic section ── */
.section{padding:140px var(--pad);position:relative;transition:background .6s}
.section-label{
  font-family:var(--mono);font-size:11px;text-transform:uppercase;
  letter-spacing:.14em;color:var(--ink-dim);display:flex;align-items:center;
  gap:14px;margin-bottom:48px;
}
.section-label::before{
  content:'';width:9px;height:9px;border-radius:50%;
  background:var(--accent);box-shadow:0 0 14px var(--glow);
}
.section-title{
  font-family:var(--display);font-weight:300;font-size:clamp(40px,6vw,88px);
  line-height:1;letter-spacing:-.03em;margin-bottom:24px;max-width:14ch;
}
.section-title em{font-family:var(--serif);font-style:italic;color:var(--accent)}

/* ── Statement ── */
.statement{padding:200px var(--pad);max-width:var(--maxw);margin:0 auto;position:relative}
.statement-eyebrow{
  font-family:var(--mono);font-size:11px;text-transform:uppercase;
  letter-spacing:.14em;color:var(--ink-dim);margin-bottom:48px;
  display:flex;align-items:center;gap:14px;
}
.statement-eyebrow::before{content:'';width:9px;height:9px;border-radius:50%;background:var(--accent);box-shadow:0 0 14px var(--glow)}
.statement-text{
  font-family:var(--display);font-weight:300;font-size:clamp(36px,5.5vw,90px);
  line-height:1.1;letter-spacing:-.03em;max-width:22ch;
}
.statement-text .word{
  display:inline-block;
  color:color-mix(in srgb,var(--ink) 18%,transparent);
  transition:color .35s cubic-bezier(.2,.8,.2,1),text-shadow .35s;margin-right:.22em;
}
.statement-text .word.lit{color:var(--ink)}
.statement-text .word.accent.lit{
  color:var(--accent);font-family:var(--serif);font-style:italic;
  text-shadow:0 0 26px var(--glow);
}

/* ── About ── */
.about{padding:120px 0;background:var(--bg-2);transition:background .6s}
.about-inner{
  display:grid;grid-template-columns:1fr 1fr;gap:80px;padding:0 var(--pad);
  max-width:var(--maxw);margin:0 auto;align-items:start;
}
.about-sticky{position:sticky;top:120px}
.about-sticky h2{font-family:var(--display);font-weight:300;font-size:clamp(40px,6vw,88px);line-height:1;letter-spacing:-.03em}
.about-sticky h2 em{font-family:var(--serif);font-style:italic;color:var(--accent)}
.about-blocks{display:flex;flex-direction:column;gap:80px}
.about-block p{font-size:clamp(18px,1.7vw,24px);line-height:1.4;color:var(--ink);font-weight:300}
.about-block p:first-letter{
  font-family:var(--serif);font-style:italic;font-size:2.2em;float:left;
  line-height:.8;margin-right:.08em;margin-top:.08em;color:var(--accent);
}
.about-block .meta{
  font-family:var(--mono);font-size:11px;text-transform:uppercase;
  letter-spacing:.14em;color:var(--ink-dim);margin-bottom:16px;
}
@media(max-width:900px){.about-inner{grid-template-columns:1fr;gap:48px}.about-sticky{position:static}}

/* ── Services list ── */
.services-list{border-top:1px solid var(--line);max-width:var(--maxw);margin:0 auto}
.service{
  border-bottom:1px solid var(--line);padding:36px 0;
  display:grid;grid-template-columns:60px 1fr 2fr 200px;gap:32px;align-items:center;
  position:relative;
  transition:padding .4s cubic-bezier(.2,.8,.2,1),border-color .6s;will-change:transform;
}
.service::before{
  content:'';position:absolute;inset:0;
  background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--accent) 7%,transparent),transparent);
  opacity:0;transition:opacity .5s;pointer-events:none;
}
.service:hover{padding:56px 0}
.service:hover::before{opacity:1}
.service-num{font-family:var(--mono);font-size:11px;color:var(--accent);letter-spacing:.1em}
.service-name{
  font-family:var(--display);font-weight:300;font-size:clamp(28px,3.5vw,48px);
  letter-spacing:-.02em;transition:transform .4s cubic-bezier(.2,.8,.2,1),color .4s;
}
.service:hover .service-name{transform:translateX(20px);color:var(--accent)}
.service-name em{font-family:var(--serif);font-style:italic}
.service-desc{color:var(--ink-dim);font-size:15px;max-width:50ch}
.service-tags{display:flex;flex-wrap:wrap;gap:6px;justify-content:flex-end}
.service-tags span{
  font-family:var(--mono);font-size:10px;text-transform:uppercase;
  letter-spacing:.1em;color:var(--ink-dim);padding:5px 10px;
  border:1px solid var(--line);border-radius:999px;transition:border-color .4s,color .4s,background .4s;
}
.service:hover .service-tags span{border-color:color-mix(in srgb,var(--accent) 45%,transparent);color:var(--ink)}
@media(max-width:900px){
  .service{grid-template-columns:40px 1fr;gap:16px}
  .service-desc,.service-tags{display:none}
  .service:hover{padding:36px 0}
}

/* ── Stats ── */
.stats{
  display:grid;grid-template-columns:repeat(4,1fr);
  border-top:1px solid var(--line);border-bottom:1px solid var(--line);
  max-width:var(--maxw);margin:0 auto;
}
.stat{padding:60px 32px;border-right:1px solid var(--line);position:relative;overflow:hidden;transition:border-color .6s}
.stat:last-child{border-right:0}
.stat::after{content:'';position:absolute;bottom:0;left:0;width:0;height:3px;background:var(--grad-soft);transition:width 1.4s cubic-bezier(.2,.8,.2,1)}
.stat.lit::after{width:100%}
.stat-num{
  font-family:var(--display);font-weight:300;font-size:clamp(56px,8vw,120px);
  line-height:.9;letter-spacing:-.03em;color:var(--ink);display:flex;align-items:flex-start;gap:4px;
}
.stat:nth-child(1) .stat-num .suffix{color:var(--c-pink)}
.stat:nth-child(3) .stat-num .suffix{color:var(--c-cyan)}
.stat-num .suffix{font-family:var(--serif);font-style:italic;color:var(--accent);font-size:.5em}
.stat-label{margin-top:16px;font-family:var(--mono);font-size:11px;text-transform:uppercase;letter-spacing:.12em;color:var(--ink-dim)}
@media(max-width:900px){
  .stats{grid-template-columns:repeat(2,1fr)}
  .stat:nth-child(2){border-right:0}
  .stat:nth-child(1),.stat:nth-child(2){border-bottom:1px solid var(--line)}
}
