/* Kim Hanelt's Grand Opening: Fenrir's look inside the site's own header and footer. Steel is Fenrir, gold is Miliare. */
@font-face{font-family:'Inter Tight';src:url(InterTight-latin.woff2) format('woff2');font-weight:400 800;font-display:swap}
@font-face{font-family:'Newsreader';src:url(Newsreader-Italic-latin.woff2) format('woff2');font-weight:400 600;font-style:italic;font-display:swap}
.kg-hero,.kg-what{--k:#07080A;--foil:linear-gradient(100deg,#7A5E1E 0%,#B8963C 18%,#E9D18A 36%,#C9A84C 52%,#8A6C24 70%,#D9BE6E 86%,#9C7F2E 100%);
  --steel:linear-gradient(176deg,#FBFBFB 0%,#D5D6D8 30%,#8E8F93 52%,#55565A 57%,#BDBEC1 74%,#F1F1F2 100%);
  --sweep:linear-gradient(100deg,transparent 42%,rgba(255,255,255,.75) 50%,transparent 58%);
  font-family:'Inter Tight',Arial,sans-serif;background:var(--k);color:#fff}
.kg-hero{--u:calc(min(1vw,1.6vh)/var(--z,1));position:relative;overflow:hidden;padding-top:var(--hdr,78px)}
.kg-grid{display:grid;grid-template-columns:calc(min(46vw,76vh)/var(--z,1)) minmax(0,1fr);grid-template-rows:1fr auto auto 1fr;grid-template-areas:"art ." "art a" "art b" "art .";column-gap:clamp(28px,5vw,84px);padding-right:clamp(24px,5vw,84px);max-width:1760px;margin-inline:auto}
.kg-a{grid-area:a;position:relative;z-index:2}
.kg-b{grid-area:b;position:relative;z-index:2}
.kg-art{grid-area:art;position:relative;aspect-ratio:1346/1800;min-width:0}
.kg-disc{position:absolute;inset:0;display:block}
.kg-disc img{display:block;width:100%;height:100%;object-fit:cover}
.kg-photo{position:absolute;left:-5%;right:-22%;top:0;bottom:0;overflow:hidden;pointer-events:none}
.kg-art::after{content:"";position:absolute;left:0;right:-24%;bottom:0;height:34%;background:linear-gradient(180deg,rgba(7,8,10,0) 0,rgba(7,8,10,.72) 46%,#07080A 92%);pointer-events:none}
.kg-photo img{position:absolute;left:3%;top:29%;width:86%;height:auto;filter:drop-shadow(12px 8px 22px rgba(0,0,0,.55))}
.kg-logos{display:flex;align-items:center;gap:clamp(12px,1.2vw,18px)}
.kg-logos .f{height:calc(var(--u)*7);width:auto}.kg-logos i{flex:none;width:1.5px;height:calc(var(--u)*4.8);background:rgba(201,168,76,.8)}.kg-logos .m{height:calc(var(--u)*3.9);width:auto}
.kg-kick{display:block;margin-top:calc(var(--u)*1.5);font-size:calc(var(--u)*1.05);font-weight:700;letter-spacing:.3em;text-transform:uppercase;color:#C9A84C}
.kg-hero h1{margin:8px 0 0;font-family:inherit;font-size:calc(var(--u)*5);font-weight:800;letter-spacing:.004em;line-height:1.06;text-transform:uppercase;white-space:nowrap}
.kg-hero h1 span{background:var(--sweep) -220% 0/240% 100% no-repeat,var(--steel);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
.kg-name{margin:2px 0 0;font-family:'Newsreader',Georgia,serif;font-style:italic;font-size:calc(var(--u)*4.6);font-weight:500;line-height:1.12;padding-bottom:6px;color:#C9A84C}
.kg-name span{background:var(--foil);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
.kg-line{margin:6px 0 0;font-size:calc(var(--u)*1.42);line-height:1.32;color:#E6E6E8;max-width:34em}
.kg-role{margin:calc(var(--u)*.8) 0 0;font-size:calc(var(--u)*1.3);font-weight:500;color:#D5D6D9}
.kg-lic{margin:5px 0 0;font-size:calc(var(--u)*.86);font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:#C9A84C}
.kg-tri{height:4px;margin:calc(var(--u)*1.1) 0;background:linear-gradient(90deg,#006091 0 33.3%,#969496 33.3% 66.6%,#A0001E 66.6%)}
.kg-when{display:flex;align-items:flex-end;flex-wrap:wrap;gap:12px clamp(20px,2.4vw,40px)}
.kg-date b{display:block;font-size:calc(var(--u)*1.25);font-weight:800;letter-spacing:.2em;text-transform:uppercase;color:#DEDDDD}
.kg-date span{display:flex;align-items:flex-end;gap:10px;font-size:calc(var(--u)*2.6);font-weight:800;line-height:1;text-transform:uppercase;padding-bottom:0;color:#DEDDDD}
.kg-date strong{font-size:calc(var(--u)*6.2);font-weight:800;line-height:.86;background:var(--steel);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;padding-right:4px}
.kg-time span{display:block;font-size:calc(var(--u)*2.05);font-weight:800;line-height:1.2;background:var(--foil);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;white-space:nowrap}
.kg-time small{display:block;margin-top:4px;font-size:calc(var(--u)*1.25);font-weight:500;color:#CFD0D3;letter-spacing:.03em}
.kg-cta{display:flex;flex-wrap:wrap;gap:12px 14px;margin-top:calc(var(--u)*1.4)}
.kg-btn{position:relative;overflow:hidden;display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:54px;padding:14px 28px;border-radius:6px;background:linear-gradient(180deg,#F1F1F2,#B9BABD);color:#07080A;font-size:18px;font-weight:800;text-decoration:none;transition:transform .2s ease,box-shadow .2s ease}
.kg-btn svg{width:18px;height:18px;flex:none}
.kg-btn:hover{transform:translateY(-2px);box-shadow:0 10px 26px rgba(222,221,221,.18)}
.kg-copy{min-height:54px;padding:14px 22px;border-radius:6px;border:1.5px solid #969496;background:transparent;color:#DEDDDD;font:600 16px/1.2 'Inter Tight',Arial,sans-serif;cursor:pointer;transition:border-color .2s ease,color .2s ease}
.kg-copy:hover{border-color:#DEDDDD;color:#fff}
.kg-copy.ok{border-color:#C9A84C;color:#E9D18A}
.kg-what{border-top:1px solid #1d1e22;padding:clamp(40px,5vw,76px) clamp(20px,5vw,84px)}
.kg-what-in{max-width:900px;margin:0 auto;text-align:center}
.kg-what p{margin:0;font-size:clamp(22px,2.3vw,36px);line-height:1.34;font-weight:500;color:#F1F1F2}
.kg-btn:focus-visible,.kg-copy:focus-visible{outline:2px solid #E9D18A;outline-offset:3px}
/* motion: the plate settles, Kim rises, the type comes up in order, light crosses the steel once */
@media (prefers-reduced-motion:no-preference){
  .kg-disc{animation:kgDisc 1.1s cubic-bezier(.2,.7,.2,1) both}
  .kg-photo img{animation:kgRise 1.2s .12s cubic-bezier(.2,.7,.2,1) both}
  .kg-a>*,.kg-b>*{animation:kgUp .7s cubic-bezier(.2,.7,.2,1) both}
  .kg-a>*:nth-child(2){animation-delay:.1s}.kg-a>*:nth-child(3){animation-delay:.18s}.kg-a>*:nth-child(4){animation-delay:.26s}.kg-a>*:nth-child(5){animation-delay:.34s}
  .kg-b>*{animation-delay:.42s}.kg-b>.kg-when{animation-delay:.5s}.kg-b>.kg-cta{animation-delay:.58s}
  .kg-hero h1 span{animation:kgSweep 1.8s 1s ease-in-out both}
  .kg-btn::after{content:"";position:absolute;inset:0;background:var(--sweep);background-size:240% 100%;background-repeat:no-repeat;background-position:-220% 0;animation:kgSweep2 1.6s 1.7s ease-in-out both;pointer-events:none}
}
@keyframes kgDisc{from{opacity:0;transform:translateX(-26px)}to{opacity:1;transform:none}}
@keyframes kgRise{from{opacity:0;transform:translateY(34px)}to{opacity:1;transform:none}}
@keyframes kgUp{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
@keyframes kgSweep{from{background-position:-220% 0,0 0}to{background-position:320% 0,0 0}}
@keyframes kgSweep2{from{background-position:-220% 0}to{background-position:320% 0}}
@media (max-width:900px){
  .kg-hero{--u:max(10.4px,1.6vw)}
  /* phone order: name, date, Register, then the photo and her title */
  .kg-grid{display:flex;flex-direction:column;padding:0;max-width:none}
  .kg-a{order:1;padding-inline:20px}
  .kg-b{display:contents}
  .kg-tri{order:2}.kg-when{order:3}.kg-cta{order:4}.kg-art{order:5}.kg-role{order:6}.kg-lic{order:7}
  .kg-tri,.kg-when,.kg-cta,.kg-role,.kg-lic{margin-inline:20px}
  .kg-lic{margin-bottom:36px}
  .kg-a{padding-top:14px}
  .kg-logos .f{height:84px}.kg-logos i{height:58px}.kg-logos .m{height:46px}
  .kg-kick{margin-top:16px;font-size:14px}
  .kg-art{width:100%;max-width:560px;margin:20px auto 0;aspect-ratio:1346/1440;overflow:hidden}
  .kg-disc img{object-position:left top}
  .kg-photo{left:-3%;right:0}
  .kg-art::after{right:0}
  .kg-photo img{left:2%;top:22%;width:98%}
  .kg-hero h1{font-size:min(11.2vw,84px)}
  .kg-name{font-size:min(12vw,78px)}
  .kg-line{font-size:18px}.kg-role{margin-top:0;font-size:18px}.kg-lic{font-size:12px;letter-spacing:.16em}
  .kg-tri{margin-block:16px}
  .kg-date b{font-size:18px}.kg-date span{font-size:36px}.kg-date strong{font-size:88px}
  .kg-time span{font-size:26px}.kg-time small{font-size:17px}
  .kg-cta{margin-top:20px;margin-bottom:0}
  .kg-btn,.kg-copy{width:100%}
}
