:root{color-scheme:light;--ivory:#f4f1e9;--charcoal:#292b29;--gold:#b6a27c}
*{box-sizing:border-box}
html{background:var(--ivory)}
body{margin:0;color:var(--charcoal);min-height:100svh;display:flex;flex-direction:column;-webkit-font-smoothing:antialiased}
.masthead{display:grid;place-items:center;padding:29px 24px 28px;flex-shrink:0}
.wordmark{width:160px;text-align:center;display:flex;align-items:center;flex-direction:column}
.initials{font-family:Georgia,'Times New Roman',serif;font-weight:400;font-size:56px;line-height:1;letter-spacing:.1em;padding-left:.1em}
.gold-rule{height:1px;background:var(--gold);width:138px;margin:12px 0 11px}
.trust{font:400 10px/1.2 Arial,Helvetica,sans-serif;letter-spacing:.52em;padding-left:.52em}
main{display:flex;flex:1;padding:0 28px}
.hero{width:100%;position:relative;isolation:isolate;min-height:470px;overflow:hidden;background:#586d7e}
.scene,.shade{position:absolute;inset:0;z-index:-1;overflow:hidden}
.still{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 0%}
.clouds{position:absolute;pointer-events:none;overflow:hidden;inset:0}
.clouds[hidden]{display:none}
.cloud{position:absolute;left:-30%;width:160%;height:62%;top:44%;object-fit:fill;opacity:0;will-change:transform,opacity;animation:cloud-drift 96s linear infinite both}
.cloud-two{top:41%;left:-42%;width:180%;height:65%;animation-name:cloud-drift-secondary;animation-duration:128s;animation-delay:-64s}
.hero.is-paused .cloud{animation-play-state:paused}
@keyframes cloud-drift{0%{transform:translate3d(-8%,0,0);opacity:0}12%{opacity:.32}88%{opacity:.32}100%{transform:translate3d(8%,-1%,0);opacity:0}}
@keyframes cloud-drift-secondary{0%{transform:translate3d(-9%,0,0);opacity:0}15%{opacity:.20}85%{opacity:.20}100%{transform:translate3d(9%,1%,0);opacity:0}}
.shade{background:linear-gradient(90deg,rgba(16,23,29,.34),transparent 58%),linear-gradient(180deg,transparent 40%,rgba(16,23,29,.03) 58%,rgba(16,23,29,.48) 100%)}
h1{position:absolute;bottom:56px;left:6%;right:24px;margin:0;color:var(--ivory);font:400 clamp(42px,4.6vw,76px)/1.11 Georgia,'Times New Roman',serif;letter-spacing:-.035em;text-wrap:balance;text-shadow:0 1px 10px rgba(16,23,29,.14)}
footer{padding:25px 24px;text-align:center;flex-shrink:0}
footer small{font:400 9px/1.5 Arial,Helvetica,sans-serif;letter-spacing:.13em;color:#66675f}
.motion-control{position:absolute;right:22px;bottom:21px;display:flex;align-items:center;gap:8px;border:0;padding:10px 11px;background:rgba(16,23,29,.46);color:var(--ivory);font:400 10px/1.2 Arial,Helvetica,sans-serif;letter-spacing:.06em;cursor:pointer;border-radius:2px;min-height:32px}
.motion-control[hidden]{display:none}
.motion-control svg{fill:none;stroke:currentColor;stroke-width:1.2}
.play-icon{display:none}
.is-paused .play-icon{display:block}
.is-paused .pause-icon{display:none}
.motion-control:hover{background:rgba(16,23,29,.72)}
.motion-control:focus-visible{outline:2px solid var(--ivory);outline-offset:4px}
@media(min-width:1600px){.masthead{padding:36px 24px 34px}main{padding:0 36px}footer{padding:28px}}
@media(max-width:600px){.masthead{padding:28px 20px 25px}.initials{font-size:46px}.gold-rule{width:118px;margin:11px 0}.trust{font-size:9px}main{padding:0 12px}.hero{min-height:510px}.still{object-position:49% 0%}h1{left:25px;bottom:87px;right:18px;font-size:clamp(36px,9.3vw,54px)}.motion-control{right:15px;bottom:17px;min-height:40px}.cloud-one{width:225%;left:-62%}.cloud-two{width:250%;left:-75%}footer{padding:22px 16px}}
@media(prefers-reduced-motion:reduce){.clouds,.motion-control{display:none!important}.cloud{animation:none;will-change:auto}}
