/* Opening art direction: a slow, diffused colour field and an editorial type grid. */
.hero-scene{--hero-ink-main:#173E56;--hero-ink-top:#173E56;--hero-ink-subject:#173E56;--hero-ink-bottom:#173E56;--hero-shadow-main:none;--hero-shadow-top:none;--hero-shadow-subject:none;--hero-shadow-bottom:none;background:#0d1122;font-family:MiSans,sans-serif}
#light-field{background:radial-gradient(ellipse 80% 85% at 78% 42%,#365588 0%,#6a536e 38%,#1a253d 70%,#0d1122 100%)}
.hero-vignette{background:linear-gradient(90deg,rgba(5,9,20,.74) 0%,rgba(6,10,22,.45) 39%,rgba(6,10,22,.04) 72%),linear-gradient(0deg,rgba(5,8,16,.64),transparent 27%,transparent 72%,rgba(5,8,16,.24))}
.hero-scene::after{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;opacity:.14;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.7' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.32'/%3E%3C/svg%3E")}
.hero-index,.hero-subject,.hero-identity,.hero-disciplines,.hero-baseline{z-index:1}
.hero-index{top:clamp(100px,13vh,145px);left:6.2%;right:6.2%;font-size:10px;letter-spacing:.18em;color:rgba(244,244,241,.76)}
.hero-index i{font-style:normal;opacity:1;margin:0 12px;color:inherit}
.hero-subject{left:auto;right:8.5%;top:30%;margin:0;font-family:Georgia,'Times New Roman',serif;font-size:clamp(20px,2.1vw,34px);font-style:italic;line-height:1.23;letter-spacing:-.03em;color:rgba(255,248,242,.82)}
.hero-identity{left:11%;top:34%;transform:none;max-width:760px}
.hero-identity .micro{font-size:11px;letter-spacing:.27em;color:#dfdce2}
.hero-identity h1{font-size:clamp(54px,6.4vw,112px);line-height:1.22;letter-spacing:-.055em;font-weight:400;margin:24px 0 28px;text-shadow:0 8px 36px rgba(0,0,0,.16)}
.hero-identity h1 em{font-style:normal;font-weight:300;color:inherit}
.hero-school{font-size:12px;letter-spacing:.13em;color:rgba(244,241,239,.77)}
.hero-school span{margin:0 12px;color:inherit}
.hero-disciplines{right:6.5%;bottom:16%;display:flex;align-items:baseline;gap:9px;opacity:.65;font-family:Georgia,'Times New Roman',serif;font-style:italic;font-size:clamp(14px,1.6vw,25px);letter-spacing:-.02em;color:#fff}
.hero-disciplines__amp{font-size:1.5em;font-weight:300}
.hero-baseline{left:6.2%;right:6.2%;bottom:35px;padding-top:19px;border-color:rgba(255,255,255,.28);font-size:10px;letter-spacing:.16em;color:rgba(245,244,241,.68)}
.hero-baseline>span{margin-left:auto}
.hero-poem{color:rgba(245,244,241,.75);font-size:10px;letter-spacing:.18em}
.enter-profile{font-size:11px;letter-spacing:.14em;gap:16px}
.down-arrow{display:block;width:20px;height:26px;overflow:visible}
@media(max-width:1000px){.hero-identity{left:8%;top:39%}.hero-identity h1{font-size:clamp(50px,7vw,78px)}.hero-subject{right:8%;top:25%}}
@media(max-width:800px){
  .hero-index{top:104px;left:24px;right:24px;font-size:8px;letter-spacing:.11em}
  .hero-index span:last-child{font-size:7px}
  .hero-subject{top:23%;right:25px;font-size:19px;text-align:right}
  .hero-identity{left:24px;right:22px;top:39%;max-width:none}
  .hero-identity h1{font-size:clamp(46px,10vw,76px);line-height:1.27;margin:19px 0 24px}
  .hero-identity .micro{font-size:9px;letter-spacing:.2em}
  .hero-school{font-size:10px;letter-spacing:.08em}
  .hero-disciplines{right:26px;bottom:18%;font-size:16px}
  .hero-baseline{left:24px;right:24px;bottom:27px}
  .hero-baseline>span{display:none}
  .enter-profile{right:0;left:auto;transform:none}
}
@media(max-width:430px){
  .hero-index span:last-child{max-width:105px;text-align:right;line-height:1.6}
  .hero-subject{top:24%;font-size:17px}
  .hero-identity{top:40%}
  .hero-identity h1{font-size:clamp(44px,11vw,56px)}
  .hero-disciplines{bottom:16%}
}

/* Restore the personal name as the primary identity. */
.hero-identity h1{font-size:clamp(90px,12vw,188px);letter-spacing:-.045em;line-height:1.08}
@media(max-width:800px){.hero-identity h1{font-size:clamp(76px,20vw,132px)}}

/* Selected FeralUI motion studies: Lagoon and Poolside. */
#light-field{display:none}
#feralui-home,.feralui-field{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden}
#feralui-home{
  background:
    radial-gradient(ellipse 66% 92% at 17% 48%,rgba(238,246,248,.96) 0 22%,rgba(167,210,220,.82) 48%,transparent 72%),
    radial-gradient(ellipse 76% 88% at 82% 36%,rgba(68,183,202,.88) 0 28%,rgba(45,134,166,.72) 55%,transparent 78%),
    linear-gradient(135deg,#dcebed 0%,#78cbd3 55%,#315e84 100%);
}
.feralui-field>div{width:100%!important;height:100%!important}
.hero-scene::after{z-index:0;opacity:.075}
.hero-vignette{z-index:0;background:linear-gradient(0deg,rgba(4,15,25,.18),transparent 25%,transparent 82%,rgba(255,255,255,.04))}
.hero-index,.hero-subject,.hero-identity,.hero-disciplines,.hero-baseline{z-index:2}
.hero-index{color:var(--hero-ink-top);text-shadow:var(--hero-shadow-top)}
.hero-subject{color:var(--hero-ink-subject);right:10%;top:28%;font-size:clamp(19px,2vw,30px);text-shadow:var(--hero-shadow-subject)}
.hero-identity{left:10%;top:50%;transform:translateY(-50%);max-width:none}
.hero-identity .micro{color:var(--hero-ink-main);text-shadow:var(--hero-shadow-main)}
.hero-identity h1{color:var(--hero-ink-main);font-family:'Songti SC','STSong','Noto Serif CJK SC','Source Han Serif SC',SimSun,serif;font-size:clamp(88px,12.8vw,196px);font-weight:500;line-height:1.05;letter-spacing:-.045em;margin:12px 0 16px;text-shadow:var(--hero-shadow-main)}
.hero-school{color:var(--hero-ink-main);text-shadow:var(--hero-shadow-main)}
.hero-disciplines{color:var(--hero-ink-bottom);text-shadow:var(--hero-shadow-bottom)}
.hero-baseline{color:var(--hero-ink-bottom);border-color:color-mix(in srgb,var(--hero-ink-bottom) 28%,transparent);text-shadow:var(--hero-shadow-bottom)}
.hero-poem{color:var(--hero-ink-bottom);text-shadow:var(--hero-shadow-bottom)}
.preset-control{position:absolute;z-index:3;right:5.5%;bottom:92px;pointer-events:auto;display:flex;align-items:center;gap:9px;padding:8px 11px;border:1px solid color-mix(in srgb,var(--hero-ink-bottom) 22%,transparent);border-radius:24px;color:var(--hero-ink-bottom);background:rgba(255,255,255,.36);backdrop-filter:blur(12px);font-family:MiSans,sans-serif;font-size:9px;letter-spacing:.12em;text-shadow:var(--hero-shadow-bottom);transition:background .25s,transform .25s,color .25s,border-color .25s}
.preset-control:hover{background:rgba(255,255,255,.65);transform:translateY(-2px)}
.preset-control i{width:7px;height:7px;border-radius:50%;background:var(--preset-dot,#607f86);box-shadow:0 0 0 3px rgba(72,107,114,.12)}
.preset-control b{font-size:13px;font-weight:400;margin-left:5px}
.hero-scene[data-feralui="poolside"] .preset-control i{box-shadow:0 0 0 3px rgba(78,111,116,.12)}
.hero-scene[data-feralui="poolside"] .hero-vignette{background:linear-gradient(0deg,rgba(5,24,38,.16),transparent 25%,transparent 84%,rgba(255,255,255,.03))}
.hero-scene[data-feralui="deep-sea"] .preset-control,.hero-scene[data-feralui="storm-light"] .preset-control{background:rgba(20,26,34,.34)}
.hero-scene[data-feralui="deep-sea"] .preset-control:hover,.hero-scene[data-feralui="storm-light"] .preset-control:hover{background:rgba(20,26,34,.52)}
.hero-scene .enter-profile{color:var(--hero-ink-bottom);text-shadow:var(--hero-shadow-bottom)}
.hero-scene .down-arrow{color:inherit;text-shadow:inherit}
.award-entry p+p{margin-top:10px}
@media(max-width:800px){
 .hero-identity{left:7%;right:5%;top:50%}
 .hero-identity h1{font-size:clamp(68px,18vw,112px);margin:12px 0}
 .hero-subject{top:26%;right:7%;font-size:17px}
 .preset-control{right:22px;bottom:82px;padding:7px 9px;font-size:8px}
}
@media(max-width:430px){.hero-identity h1{font-size:clamp(62px,18vw,84px)}.hero-identity{top:48%}.hero-subject{top:25%;font-size:16px}.preset-control{bottom:78px}}

/* Keep the opening composition clean: contrast comes from ink and the local veil, not shadows. */
.hero-subject,
.hero-identity .micro,
.hero-identity h1,
.hero-school,
.hero-baseline,
.hero-poem,
.hero-scene .enter-profile{ text-shadow:none!important; }