/* The combat smoke opens into Earth; the maintenance hatch follows the fields. */
.fields{background:var(--ink);padding-top:70px;overflow:clip}
.fields-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:36px;margin:0 var(--gutter) 38px}
.fields-heading h2{font-size:clamp(30px,3.3vw,50px);font-weight:600;line-height:1.5;letter-spacing:.055em;margin-top:18px}
.fields-intro{font-size:16px;line-height:2.1;color:#bacbcd;padding-bottom:5px}
.field-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;margin:0 var(--gutter);position:relative;z-index:4;border-top:1px solid var(--line)}
.field-tabs button{display:flex;align-items:center;gap:24px;min-width:0;min-height:88px;text-align:left;padding:14px 24px;border-bottom:2px solid #294143;transition:background .25s,border-color .25s,color .25s;color:#b1c0c1}
.field-tabs button+button{border-left:1px solid var(--line)}
.field-tabs button[aria-selected="true"]{color:var(--paper);background:linear-gradient(110deg,#55e4e015,transparent);border-bottom-color:var(--signal)}
.field-tabs button:hover{background:#55e4e00d;color:#fff}
.field-tab-number{font:12px var(--mono);color:var(--signal)}
.field-tabs b{display:block;font-size:17px;font-weight:500;letter-spacing:.12em}
.field-tabs small{display:block;font:10px/1.5 var(--mono);letter-spacing:.18em;margin-top:4px;color:#8fa9ab}
.field-tabs i{font-style:normal;margin-left:auto;color:var(--signal);font-size:21px}
.field-tabs button:not([aria-selected="true"]) i{opacity:.2}
.field-panels{position:relative}
.field-panel{position:relative;isolation:isolate;display:grid;align-items:end;min-height:800px;height:86svh;max-height:1120px;overflow:hidden;background:#102027}
.field-panel+.field-panel{border-top:1px solid var(--line)}
.enhanced .field-panel{border-top:0}
.field-visual{position:absolute;inset:0;z-index:-1;overflow:hidden;background:radial-gradient(ellipse at 65% 35%,#25414a,var(--ink) 75%)}
.field-picture{position:absolute;inset:0;display:block;transform-origin:center;overflow:hidden}
.field-picture img{width:100%;height:100%;object-fit:cover;object-position:center 44%;max-width:none}
.field-shade{position:absolute;inset:0;background:linear-gradient(180deg,#080e1366 0%,transparent 15%,transparent 38%,#080e1320 47%,#080e13cf 76%,#080e13 100%);pointer-events:none}
.field-scan{position:absolute;inset:0;background:linear-gradient(90deg,transparent 48%,#55e4e018 49.5%,#d9ffffc7 50%,transparent 50.15%);opacity:0;pointer-events:none;mix-blend-mode:screen}
.field-coordinate{position:absolute;top:32px;left:var(--gutter);display:flex;gap:15px;align-items:center;font-size:10px;letter-spacing:.12em;color:#e9f4f3;padding:7px 11px;background:#080e1370;border-left:1px solid #c3e8e678}
.field-coordinate i{height:1px;width:42px;background:#d4ebeb80}
.field-copy{display:grid;grid-template-columns:minmax(260px,.8fr) minmax(0,1fr);grid-template-areas:"word tagline" "name description" "link play";align-items:end;gap:18px clamp(44px,12vw,190px);margin:200px var(--gutter) 64px;position:relative;z-index:2;max-width:1500px}
.field-word{grid-area:word;font:900 clamp(52px,6.5vw,98px)/.86 Arial,Helvetica,sans-serif;letter-spacing:-.035em;color:#f3f5f4}
.field-copy h3{grid-area:name;font-size:clamp(25px,2.5vw,36px);font-weight:500;line-height:1.5;letter-spacing:.06em}
.field-copy h3>span{display:block;font-size:13px;letter-spacing:.24em;color:#a6cdcf;margin-bottom:2px}
.field-tagline{grid-area:tagline;font-size:clamp(18px,1.5vw,22px);font-weight:500;letter-spacing:.03em}
.field-description{grid-area:description;max-width:570px;font-size:16px;line-height:2.1;color:#d2ddde}
.field-play{grid-area:play;display:flex;flex-wrap:wrap;gap:10px 26px;max-width:620px;padding-top:13px;border-top:1px solid var(--line)}
.field-play>div{display:flex;align-items:baseline;gap:13px}
.field-play dt{font-size:11px;letter-spacing:.12em;color:#84b2b6;flex-shrink:0}
.field-play dd{font-size:14px;line-height:1.8;color:#d9e5e5}
.field-image-link{grid-area:link;justify-self:start;display:inline-flex;gap:27px;align-items:center;color:#d7e7e6;font-size:13px;border-color:#6d919580}
.field-image-link:focus-visible{outline-offset:2px}
.field-image-error{position:absolute;inset:28% 18px auto;text-align:center;line-height:2;color:#d7e5e5;font-size:16px}
.field-panel[data-image-unavailable] .field-picture{opacity:0}
.field-outro{position:relative;display:grid;grid-template-columns:1fr auto;gap:18px 32px;align-items:center;margin:0 var(--gutter);padding:28px 0 116px;border-top:1px solid var(--line)}
.field-outro>.technical{grid-column:1/-1;color:#78979a;font-size:9px}
.field-outro>p:not(.technical){font-size:22px;letter-spacing:.08em;line-height:1.75}
.field-outro .text-link{justify-self:end}
.field-hatch{position:absolute;bottom:-1px;left:0;right:0;height:85px;pointer-events:none;overflow:hidden;background:linear-gradient(transparent,#f3f5f4)}
.field-hatch i{position:absolute;bottom:0;width:17%;height:100%;background:linear-gradient(90deg,#727d80,#eef1ef);clip-path:polygon(0 0,30% 0,100% 100%,0 100%)}
.field-hatch i:nth-child(2){right:0;transform:scaleX(-1)}
.field-hatch span{position:absolute;bottom:0;left:17%;right:17%;height:2px;background:#b8edec;box-shadow:0 0 40px 10px #d5fffd}
html[data-motion="off"] .field-tabs button{transition:none}
html.is-background .field-scan{opacity:0!important}

@media(min-width:901px) and (max-width:1150px){
  .desktop-nav{gap:22px}
  .topbar{gap:25px}
  .fields-heading{align-items:flex-start}
  .fields-intro{max-width:300px}
  .field-copy{column-gap:60px}
}
@media(max-width:900px){
  .fields{padding-top:62px}
  .fields-heading{align-items:flex-start;flex-direction:column;gap:17px;margin-bottom:27px}
  .fields-heading h2{font-size:34px}
  .field-tabs button{gap:16px;padding:14px 16px;min-height:78px}
  .field-tabs b{font-size:16px}
  .field-panel{display:block;min-height:0;height:auto;max-height:none;background:var(--ink)}
  .field-visual{position:relative;inset:auto;z-index:0;height:clamp(370px,54svh,560px);margin-top:0}
  .field-picture img{object-position:center center}
  .field-shade{background:linear-gradient(180deg,#080e1333,transparent 20%,transparent 68%,#080e13)}
  .field-copy{display:block;margin:-35px var(--gutter) 50px;max-width:none}
  .field-word{font-size:64px;line-height:.9;margin-bottom:16px}
  .field-copy h3{font-size:28px;margin-bottom:19px}
  .field-copy h3>span{display:inline;margin:0 10px 0 0;font-size:13px}
  .field-tagline{font-size:20px;margin-bottom:13px}
  .field-description{max-width:650px}
  .field-play{margin-top:22px;max-width:none;gap:9px 30px}
  .field-image-link{margin-top:20px}
  .field-outro>p:not(.technical){font-size:20px}
}
@media(max-width:700px){
  .fields{padding-top:44px}
  .fields-heading{margin:0 22px 24px;gap:18px}
  .fields-heading h2{font-size:29px;line-height:1.6;letter-spacing:.04em}
  .fields .mobile-break{display:block}
  .fields-intro{font-size:16px;line-height:1.9}
  .field-tabs{margin:0 22px}
  .field-tabs button{display:block;padding:12px 8px;min-height:90px}
  .field-tab-number{font-size:9px;display:block;margin-bottom:5px}
  .field-tabs b{font-size:14px;letter-spacing:.07em}
  .field-tabs small{font-size:8px;letter-spacing:.08em}
  .field-tabs i{display:none}
  .field-visual{height:clamp(300px,48svh,420px)}
  .field-coordinate{left:22px;top:20px;font-size:8px;gap:10px;letter-spacing:.06em}
  .field-coordinate i{width:22px}
  .field-copy{margin:-20px 22px 36px}
  .field-word{font-size:49px;margin-bottom:15px}
  .field-copy h3{font-size:26px;letter-spacing:.03em;line-height:1.55}
  .field-copy h3>span{display:block;letter-spacing:.16em;font-size:12px;margin-bottom:3px}
  .field-tagline{font-size:18px;line-height:1.75}
  .field-description{font-size:16px;line-height:2}
  .field-play{display:grid;gap:12px;margin-top:19px;padding-top:16px}
  .field-play dd{font-size:14px}
  .field-image-link{font-size:13px;margin-top:20px}
  .field-outro{margin:0 22px;grid-template-columns:1fr;padding:25px 0 110px;gap:18px}
  .field-outro .text-link{justify-self:start;font-size:13px}
  .field-outro>.technical{font-size:8px}
  .field-outro>p:not(.technical){font-size:20px}
}
@media(max-width:360px){
  .fields-heading,.field-tabs,.field-outro{margin-left:18px;margin-right:18px}
  .field-copy{margin-left:18px;margin-right:18px}
  .field-coordinate{left:18px}
  .fields-heading h2{font-size:27px}
  .field-tabs b{font-size:13px}
  .field-word{font-size:43px}
}
@media(prefers-reduced-motion:reduce){
  .field-tabs button{transition:none}
  .field-picture,.field-copy{transform:none!important;clip-path:none!important;opacity:1!important}
  .field-scan{display:none}
}
