#jetty-landing{
  --ink:#16243f; --ink-deep:#0d1526; --gold:#bca06a; --gold-soft:#cdb37e;
  --ivory:#f6f1e7; --cream:#f3ede0;
  --line:rgba(188,160,106,.22); --line-soft:rgba(243,237,224,.16);
  --cream-72:rgba(243,237,224,.72); --cream-50:rgba(243,237,224,.5); --cream-38:rgba(243,237,224,.38);
  --serif:"Cormorant Garamond",Georgia,serif; --sans:"Jost","Helvetica Neue",Arial,sans-serif;
  --ease:cubic-bezier(.22,.61,.36,1);
}
#jetty-landing,#jetty-landing *{box-sizing:border-box}
#jetty-landing{
  font-family:var(--sans);font-weight:300;color:var(--cream);background:var(--ink-deep);
  height:100svh;min-height:100svh;width:100%;overflow:hidden;position:relative;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;line-height:1.6;
}
#jetty-landing p,#jetty-landing h1,#jetty-landing h2,#jetty-landing h3,#jetty-landing h4{margin:0;font-weight:inherit}
#jetty-landing a{color:inherit;text-decoration:none}
#jetty-landing svg{display:block}
#jetty-landing ::selection{background:var(--gold);color:var(--ink-deep)}

/* atmosphere */
#jetty-landing .bg{position:absolute;inset:0;z-index:0;pointer-events:none;
  background:
    radial-gradient(58% 48% at 50% 82%, rgba(188,160,106,.13), rgba(13,21,38,0) 70%),
    radial-gradient(80% 70% at 50% 18%, rgba(38,57,98,.45), rgba(13,21,38,0) 65%),
    linear-gradient(180deg,#0e1729,#0b1322);}
#jetty-landing .glow{position:absolute;left:50%;bottom:-14%;width:min(720px,120vw);height:min(720px,120vw);
  transform:translateX(-50%);z-index:0;pointer-events:none;border-radius:50%;
  background:radial-gradient(circle, rgba(188,160,106,.16), rgba(188,160,106,0) 62%);
  animation:drift 16s ease-in-out infinite;}
@keyframes drift{0%,100%{transform:translateX(-50%) translateY(0) scale(1)}
  50%{transform:translateX(-50%) translateY(-22px) scale(1.06)}}
@keyframes driftC{0%,100%{transform:translate(-50%,-50%) scale(1)}
  50%{transform:translate(-50%,-50%) scale(1.06)}}
#jetty-landing .grain{position:absolute;inset:0;z-index:1;pointer-events:none;opacity:.045;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");}

/* frame */
#jetty-landing .frame{position:absolute;inset:clamp(14px,2.3vw,30px);z-index:2;pointer-events:none;
  border:1px solid var(--line);opacity:0;animation:fade 1.6s var(--ease) .1s forwards}
#jetty-landing .frame .c{position:absolute;width:13px;height:13px;border:0 solid var(--gold-soft)}
#jetty-landing .frame .tl{top:-1px;left:-1px;border-top-width:1px;border-left-width:1px}
#jetty-landing .frame .tr{top:-1px;right:-1px;border-top-width:1px;border-right-width:1px}
#jetty-landing .frame .bl{bottom:-1px;left:-1px;border-bottom-width:1px;border-left-width:1px}
#jetty-landing .frame .br{bottom:-1px;right:-1px;border-bottom-width:1px;border-right-width:1px}

/* stage */
#jetty-landing .stage{position:relative;z-index:3;height:100svh;display:flex;flex-direction:column;
  align-items:center;justify-content:center;text-align:center;
  gap:clamp(16px,2.6vh,30px);
  padding:clamp(18px,3vh,38px) clamp(24px,6vw,56px);}
#jetty-landing .mark .ink{stroke:var(--cream)} #jetty-landing .mark .gold{stroke:var(--gold-soft)}

/* brand */
#jetty-landing .brand{display:flex;flex-direction:column;align-items:center;gap:10px}
#jetty-landing .brand .wm{font-weight:300;letter-spacing:.4em;font-size:13px;color:var(--cream);padding-left:.4em}

/* center */
#jetty-landing .center{flex:0 1 auto;display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:clamp(10px,1.6vh,18px);width:100%;padding:0}
#jetty-landing .eyebrow{font-size:10.5px;letter-spacing:.46em;text-transform:uppercase;color:var(--gold-soft);font-weight:500}
#jetty-landing h1{font-family:var(--serif);font-weight:300;line-height:1.05;letter-spacing:.005em;
  font-size:clamp(32px,5.1vw,54px);max-width:20ch}
#jetty-landing h1 em{font-style:italic;color:var(--gold-soft)}
#jetty-landing .sub{font-size:clamp(13.5px,1.4vw,15.5px);color:var(--cream-72);max-width:46ch;line-height:1.65}

/* access */
#jetty-landing .access{width:100%;max-width:380px;margin-top:2px}
#jetty-landing .toggle{display:flex;gap:28px;justify-content:center;margin-bottom:16px}
#jetty-landing .toggle button{background:none;border:0;cursor:pointer;font-family:var(--sans);
  font-size:11px;letter-spacing:.18em;text-transform:uppercase;font-weight:500;color:var(--cream-38);
  padding:0 0 9px;position:relative;transition:color .35s var(--ease)}
#jetty-landing .toggle button::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;
  background:var(--gold-soft);transform:scaleX(0);transition:transform .4s var(--ease)}
#jetty-landing .toggle button.active{color:var(--cream)}
#jetty-landing .toggle button.active::after{transform:scaleX(1)}
#jetty-landing .toggle button:focus-visible{outline:2px solid var(--gold-soft);outline-offset:4px}
#jetty-landing .field{margin-bottom:14px;text-align:left}
#jetty-landing .field label{display:block;font-size:10px;letter-spacing:.24em;text-transform:uppercase;
  color:var(--gold-soft);margin-bottom:9px;font-weight:500}
#jetty-landing .field input{width:100%;background:transparent;border:0;border-bottom:1px solid var(--line-soft);
  color:var(--cream);font-family:var(--sans);font-size:16px;font-weight:300;padding:8px 2px;
  transition:border-color .3s var(--ease)}
#jetty-landing .field input::placeholder{color:var(--cream-38)}
#jetty-landing .field input:focus{outline:none;border-bottom-color:var(--gold-soft)}
#jetty-landing .btn{width:100%;font-family:var(--sans);font-size:12px;letter-spacing:.18em;text-transform:uppercase;
  font-weight:500;cursor:pointer;border:0;background:var(--gold);color:var(--ink-deep);padding:15px;
  transition:background .35s var(--ease)}
#jetty-landing .btn:hover{background:var(--gold-soft)}
#jetty-landing .btn[disabled]{opacity:.55;cursor:default}
#jetty-landing .btn:focus-visible{outline:2px solid var(--gold-soft);outline-offset:3px}
#jetty-landing .msg{font-size:12.5px;font-weight:300;margin-top:10px;min-height:14px;color:var(--cream-50)}
#jetty-landing .msg.err{color:#e6a98c}
#jetty-landing .note{font-size:10.5px;color:var(--cream-38);margin-top:14px;letter-spacing:.02em}
#jetty-landing .success h4{font-family:var(--serif);font-weight:300;font-size:27px;margin-bottom:8px}
#jetty-landing .success p{font-size:14px;color:var(--cream-72);max-width:34ch;margin:0 auto}
#jetty-landing [hidden]{display:none}

/* footer */
/* widths are in px, not ch — the tracked-out uppercase runs far wider than
   ch units predict, and a ch-based cap wraps the credential line */
#jetty-landing .foot{font-size:10px;letter-spacing:.28em;text-transform:uppercase;color:var(--cream-38);
  display:flex;flex-direction:column;align-items:center;gap:7px;max-width:min(92vw,780px)}
#jetty-landing .foot a{color:var(--cream-50);transition:color .3s}
#jetty-landing .foot a:hover{color:var(--gold-soft)}
#jetty-landing .foot .sep{margin:0 .7em;color:rgba(188,160,106,.5);letter-spacing:0}

#jetty-landing .foot-tag{font-size:10px;letter-spacing:.34em;color:var(--gold-soft)}
#jetty-landing .foot-creds{font-size:9.5px;letter-spacing:.2em;line-height:1.9;color:var(--cream-50)}
/* the one sentence-case line down here — reads as prose, not a label */
#jetty-landing .foot-blurb{font-size:11.5px;letter-spacing:.012em;text-transform:none;line-height:1.6;
  color:var(--cream-38);max-width:min(92vw,560px);font-weight:300}
#jetty-landing .foot-legal{font-size:9.5px;letter-spacing:.24em;padding-top:9px;margin-top:1px;
  border-top:1px solid var(--line);width:100%;max-width:none}

/* entrance */
@keyframes fade{to{opacity:1}}
@keyframes rise{from{opacity:0;transform:translateY(16px);filter:blur(7px)}to{opacity:1;transform:none;filter:blur(0)}}
#jetty-landing .rise{opacity:0;animation:rise 1.05s var(--ease) forwards;animation-delay:var(--d,0s)}

@media(max-width:560px){
  #jetty-landing .toggle{gap:20px}
  #jetty-landing .toggle button{font-size:10px;letter-spacing:.14em}

  #jetty-landing .foot{gap:6px}
  #jetty-landing .foot-tag{font-size:9.5px;letter-spacing:.28em}
  #jetty-landing .foot-creds{font-size:9px;letter-spacing:.14em;line-height:1.8}
  #jetty-landing .foot .sep{margin:0 .45em}
  #jetty-landing .foot-blurb{font-size:11px;line-height:1.55;max-width:100%}
  #jetty-landing .foot-legal{font-size:9px;letter-spacing:.18em}
}

/* short portrait phones — the credential lines must never be clipped, so let
   the page scroll instead of hiding what runs past the fold */
@media(orientation:portrait) and (max-height:760px){
  #jetty-landing{height:auto;min-height:100svh;overflow-x:hidden;overflow-y:auto}
  #jetty-landing .stage{height:auto;min-height:100svh}
}

/* widescreen / large monitors — let the wording breathe and ease the footer
   away from the content (no overlap with the short-landscape tier below) */
@media(min-width:1024px) and (min-height:680px){
  #jetty-landing h1{font-size:clamp(38px,3.4vw,56px);max-width:24ch}
  #jetty-landing .sub{font-size:clamp(14.5px,1.1vw,17px);max-width:54ch}
}
@media(prefers-reduced-motion:reduce){
  #jetty-landing .rise{opacity:1;animation:none;filter:none;transform:none}
  #jetty-landing .frame{opacity:1;animation:none}
  #jetty-landing .glow{animation:none}
}

/* landscape / short viewports — keep the form centered, fit everything,
   re-anchor the atmosphere around the center instead of the bottom */
@media(orientation:landscape) and (max-height:640px){
  #jetty-landing{height:auto;min-height:100svh;overflow-x:hidden;overflow-y:auto}
  #jetty-landing .stage{height:auto;min-height:100svh;justify-content:center;
    gap:clamp(14px,3.4vh,28px);
    padding:clamp(20px,5vh,38px) clamp(24px,6vw,56px);}

  #jetty-landing .brand{gap:7px}
  #jetty-landing .brand .mark{width:38px;height:auto}
  #jetty-landing .brand .wm{font-size:11.5px;letter-spacing:.34em}

  #jetty-landing .center{flex:0 1 auto;gap:clamp(8px,1.8vh,15px);padding:0}
  #jetty-landing .eyebrow{font-size:9.5px;letter-spacing:.4em}
  #jetty-landing h1{font-size:clamp(26px,3.6vw,40px);max-width:20ch}
  #jetty-landing .sub{font-size:13px;max-width:52ch;line-height:1.55}

  #jetty-landing .toggle{margin-bottom:13px}
  #jetty-landing .field{margin-bottom:11px}
  #jetty-landing .field label{margin-bottom:7px}
  #jetty-landing .btn{padding:12px}
  #jetty-landing .note{margin-top:11px}

  #jetty-landing .foot{font-size:9px;letter-spacing:.22em;gap:5px}
  #jetty-landing .foot-tag{font-size:9px;letter-spacing:.26em}
  #jetty-landing .foot-creds{font-size:8.5px;letter-spacing:.14em;line-height:1.7}
  #jetty-landing .foot-blurb{font-size:10.5px;line-height:1.5;max-width:min(92vw,620px)}
  #jetty-landing .foot-legal{font-size:8.5px;letter-spacing:.18em;padding-top:2px}

  /* atmosphere re-centred for a wide, short frame */
  #jetty-landing .bg{background:
    radial-gradient(46% 90% at 50% 50%, rgba(38,57,98,.46), rgba(13,21,38,0) 70%),
    radial-gradient(60% 60% at 50% 108%, rgba(188,160,106,.12), rgba(13,21,38,0) 72%),
    linear-gradient(180deg,#0e1729,#0b1322);}
  #jetty-landing .glow{top:50%;bottom:auto;left:50%;
    width:min(560px,150vh);height:min(560px,150vh);
    transform:translate(-50%,-50%);
    animation:driftC 16s ease-in-out infinite;}
}

html,body{margin:0;padding:0;min-height:100%}html{scroll-behavior:smooth}

/* ---- plugin additions: OTP step, links, welcome info, honeypot ---- */
#jetty-landing .jt-hp{position:absolute!important;left:-9999px!important;top:auto!important;width:1px!important;height:1px!important;overflow:hidden!important;opacity:0!important}
#jetty-landing .otp-note{font-size:12.5px;color:var(--cream-72);margin-bottom:16px;line-height:1.6}
#jetty-landing .otp-note span{color:var(--gold-soft)}
#jetty-landing .field input.code{letter-spacing:.5em;text-align:center;font-size:19px}
#jetty-landing .subrow{display:flex;justify-content:space-between;gap:14px;margin-top:13px}
#jetty-landing .link{background:none;border:0;cursor:pointer;font-family:var(--sans);font-size:10.5px;
  letter-spacing:.12em;text-transform:uppercase;color:var(--cream-50);font-weight:500;padding:2px 0;
  transition:color .3s var(--ease)}
#jetty-landing .link:hover{color:var(--gold-soft)}
#jetty-landing .link[disabled]{opacity:.4;cursor:default}
#jetty-landing .link:focus-visible{outline:1px solid var(--gold-soft);outline-offset:3px}
#jetty-landing .welcome-info{margin-top:18px;text-align:left;border-top:1px solid var(--line-soft);padding-top:14px}
#jetty-landing .wi-row{display:flex;flex-direction:column;gap:2px;margin-bottom:11px}
#jetty-landing .wi-row span{font-size:9.5px;letter-spacing:.22em;text-transform:uppercase;color:var(--gold-soft);font-weight:500}
#jetty-landing .wi-row strong{font-weight:300;font-size:14.5px;color:var(--cream);line-height:1.5}