/* Fields orbit: image-led system navigation. */
.fields-intro { display:grid; grid-template-columns:minmax(330px,.72fr) minmax(620px,1.28fr); gap:clamp(40px,6vw,110px); align-items:center; min-height:930px; padding:55px 0 100px; }
.fields-intro>header { align-self:center; }
.fields-intro h1 { max-width:650px; margin:28px 0 34px; font-size:clamp(64px,7.5vw,118px); line-height:.83; letter-spacing:-.075em; }
.fields-intro h1 em { display:inline-block; color:var(--cobalt); font-style:italic; }
.fields-intro>header>p:not(.label) { max-width:590px; color:var(--muted); font-size:19px; line-height:1.55; }
.fields-intro .fields-intro__note { max-width:460px; margin-top:34px; padding-top:20px; border-top:1px solid var(--ink); color:var(--ink); font:700 10px/1.6 var(--mono); letter-spacing:.06em; text-transform:uppercase; }
.fields-orbit { position:relative; width:min(100%,820px); aspect-ratio:1; justify-self:end; }
.fields-orbit__geometry { position:absolute; inset:0; width:100%; height:100%; fill:none; stroke:var(--line); stroke-width:1; overflow:visible; animation:fields-rings 28s linear infinite; transform-origin:center; }
.fields-orbit__geometry path { stroke:var(--cobalt); stroke-dasharray:3 7; }
.fields-orbit__geometry circle:nth-of-type(n+4) { fill:var(--acid); stroke:var(--ink); }
.fields-orbit__core { position:absolute; left:50%; top:50%; z-index:2; display:flex; width:210px; aspect-ratio:1; padding:30px; border:1px solid var(--ink); border-radius:50%; background:#fff; transform:translate(-50%,-50%); flex-direction:column; justify-content:center; text-align:center; }
.fields-orbit__core small,.fields-orbit__core span { font:700 8px var(--mono); letter-spacing:.08em; }
.fields-orbit__core small { margin-bottom:15px; color:var(--cobalt); }
.fields-orbit__core strong { font:400 21px/1.15 var(--serif); letter-spacing:-.03em; }
.fields-orbit__core span { margin-top:15px; color:var(--muted); }
.field-orbit-node { position:absolute; z-index:3; display:block; width:224px; }
.field-orbit-node--1 { left:50%; top:0; transform:translateX(-50%); }
.field-orbit-node--2 { right:-1%; top:47%; transform:translateY(-50%); }
.field-orbit-node--3 { left:50%; bottom:-5%; transform:translateX(-50%); }
.field-orbit-node--4 { left:-1%; top:47%; transform:translateY(-50%); }
.field-orbit-node__image { display:block; width:174px; aspect-ratio:1; margin:0 auto; overflow:hidden; border:1px solid var(--ink); border-radius:50%; background:var(--ink); }
.field-orbit-node__image img { display:block; width:100%; height:100%; object-fit:cover; filter:saturate(.9) contrast(1.05); transition:transform .55s cubic-bezier(.32,.72,0,1),filter .35s ease; }
.field-orbit-node__copy { position:relative; display:grid; grid-template-columns:1fr auto; gap:5px 12px; margin-top:-13px; padding:15px 17px; border:1px solid var(--ink); background:#fff; transition:background .25s ease,color .25s ease,transform .35s cubic-bezier(.32,.72,0,1); }
.field-orbit-node__copy small { grid-column:1/-1; color:var(--cobalt); font:700 8px var(--mono); letter-spacing:.08em; text-transform:uppercase; }
.field-orbit-node__copy strong { font:400 23px/1 var(--serif); letter-spacing:-.035em; }
.field-orbit-node__copy em { grid-column:1/-1; color:var(--muted); font:normal 8px var(--mono); letter-spacing:.04em; text-transform:uppercase; }
.field-orbit-node__copy i { grid-column:2; grid-row:2; font:normal 18px var(--sans); }
.field-orbit-node:hover .field-orbit-node__image img,.field-orbit-node:focus-visible .field-orbit-node__image img { filter:saturate(1) contrast(1.06); transform:scale(1.07); }
.field-orbit-node:hover .field-orbit-node__copy,.field-orbit-node:focus-visible .field-orbit-node__copy { background:var(--ink); color:#fff; transform:translateY(-4px); }
.field-orbit-node:hover .field-orbit-node__copy small,.field-orbit-node:focus-visible .field-orbit-node__copy small { color:var(--acid); }
.field-orbit-node:hover .field-orbit-node__copy em,.field-orbit-node:focus-visible .field-orbit-node__copy em { color:#bfc2ca; }
@keyframes fields-rings { to { transform:rotate(360deg); } }

.fields-motion { position:relative; min-height:680px; margin:0 calc(var(--gutter)*-1); overflow:hidden; border-block:1px solid var(--ink); background:var(--ink); color:#fff; }
.fields-motion__slides,.fields-motion__slide { position:absolute; inset:0; width:100%; height:100%; }
.fields-motion__slide { object-fit:cover; opacity:0; filter:saturate(.88) brightness(.67); animation:fields-film 24s infinite both; }
.fields-motion__slide:nth-child(2) { animation-delay:6s; }
.fields-motion__slide:nth-child(3) { animation-delay:12s; }
.fields-motion__slide:nth-child(4) { animation-delay:18s; }
@keyframes fields-film { 0%,21% { opacity:1; transform:scale(1.025); } 25%,100% { opacity:0; transform:scale(1.09); } }
.fields-motion figcaption { position:relative; z-index:2; display:grid; grid-template-columns:.7fr 1.3fr; gap:30px 70px; width:min(720px,calc(100% - 2*var(--gutter))); min-height:680px; padding:70px var(--gutter); align-content:end; background:rgba(13,14,18,.9); border-right:1px solid rgba(255,255,255,.24); }
.fields-motion figcaption .label { grid-column:1/-1; color:#fff; }
.fields-motion figcaption .label span { color:var(--acid); }
.fields-motion h2 { grid-column:1/-1; margin:0; font-size:clamp(48px,6vw,88px); line-height:.92; }
.fields-motion figcaption>p { margin:0; color:#c6c8cf; font-size:15px; line-height:1.6; }
.fields-motion ol { margin:0; padding:0; list-style:none; }
.fields-motion li { display:grid; grid-template-columns:38px 1fr; padding:12px 0; border-top:1px solid rgba(255,255,255,.24); font:700 10px var(--mono); text-transform:uppercase; }
.fields-motion li span { color:var(--acid); }
.fields-method { padding:110px 0 130px; }
.fields-method>p { color:var(--cobalt); font:700 9px var(--mono); letter-spacing:.1em; }
.fields-method ol { display:grid; grid-template-columns:repeat(3,1fr); margin:35px 0 0; padding:0; border-top:1px solid var(--ink); list-style:none; }
.fields-method li { display:grid; min-height:220px; padding:26px; border-right:1px solid var(--ink); align-content:space-between; }
.fields-method li:last-child { border-right:0; }
.fields-method li span { color:var(--cobalt); font:700 10px var(--mono); }
.fields-method li strong { font:400 clamp(28px,3vw,42px)/1 var(--serif); letter-spacing:-.04em; }
.fields-method li small { max-width:280px; color:var(--muted); font-size:13px; line-height:1.45; }

@media (max-width:1100px) {
  .fields-intro { grid-template-columns:1fr; min-height:auto; padding-top:75px; }
  .fields-intro>header { display:grid; grid-template-columns:1fr 1fr; gap:0 45px; }
  .fields-intro>header .label,.fields-intro>header h1 { grid-column:1; }
  .fields-intro>header>p:not(.label) { grid-column:2; }
  .fields-orbit { justify-self:center; width:min(100%,760px); }
}
@media (max-width:700px) {
  .fields-intro { gap:35px; padding:65px 0 80px; }
  .fields-intro>header { display:block; }
  .fields-intro h1 { font-size:clamp(58px,18vw,82px); }
  .fields-orbit { display:grid; gap:18px; width:100%; min-height:0; aspect-ratio:auto; }
  .fields-orbit__geometry,.fields-orbit__core { display:none; }
  .fields-orbit__core { top:52%; width:132px; padding:15px; }
  .fields-orbit__core small,.fields-orbit__core span { font-size:6px; }
  .fields-orbit__core small { margin-bottom:9px; }
  .fields-orbit__core strong { font-size:14px; }
  .fields-orbit__core span { margin-top:9px; }
  .field-orbit-node { position:static; display:grid; grid-template-columns:88px minmax(0,1fr); align-items:center; width:100%; transform:none; }
  .field-orbit-node__image { width:88px; }
  .field-orbit-node__copy { gap:6px; margin:0 0 0 -4px; padding:14px; }
  .field-orbit-node__copy small { font-size:8px; }
  .field-orbit-node__copy strong { font-size:24px; }
  .field-orbit-node__copy em { display:block; }
  .field-orbit-node__copy i { font-size:12px; }
  .fields-motion { min-height:690px; }
  .fields-motion figcaption { grid-template-columns:1fr; gap:25px; width:calc(100% - 36px); min-height:690px; padding:48px 24px; }
  .fields-motion figcaption>p { max-width:340px; }
  .fields-method { padding-block:80px; }
  .fields-method ol { grid-template-columns:1fr; }
  .fields-method li { min-height:170px; border-right:0; border-bottom:1px solid var(--ink); }
  .fields-method li:last-child { border-bottom:0; }
}
@media (prefers-reduced-motion:reduce) {
  .fields-orbit__geometry,.fields-motion__slide { animation:none!important; }
  .fields-motion__slide { opacity:0; }
  .fields-motion__slide:first-child { opacity:1; }
}
