/* Owner portal entry. The landscape, sign-in form, and club keep distinct surfaces. */
.access-screen {
  --access-brass:#e7cf94;
  --access-ink:#214235;
  display:grid;
  grid-template:"hero login" auto "details details" auto "club club" auto /
    minmax(0,1.25fr) minmax(300px, .9fr);
  align-items:center;
  gap:clamp(16px,2.4vw,28px) clamp(6px,2vw,22px);
  min-height:0;
  padding:0;
  border-radius:0;
  overflow:visible;
  background:none;
  box-shadow:none;
}
.access-screen::before,.access-screen::after {
  position:absolute;
  grid-area:1 / 1 / 2 / -1;
  inset:0;
  width:auto;
  height:auto;
  border-radius:clamp(18px,3vw,30px);
  pointer-events:none;
}
.access-screen::before {
  background:
    linear-gradient(92deg,#102f25f2 2%,#16392bd9 44%,#1d413395 100%),
    linear-gradient(0deg,#132e24a8,transparent 78%),
    url('green-assets/woodland-panorama-v1.png') center 55% / cover no-repeat;
  box-shadow:0 16px 36px -24px #19392d99;
}
.access-screen::after {
  content:"";
  z-index:-1;
  border:1px solid #eddeb323;
  background:repeating-radial-gradient(ellipse at 98% -45%,transparent 0 36px,#e1cb9528 37px 38px,transparent 39px 48px);
  mask-image:linear-gradient(102deg,transparent 38%,#0009 80%,#000);
}
.access-screen .access-copy {
  grid-area:hero;
  padding:clamp(26px,4.5vw,60px) 0 clamp(28px,4.7vw,63px) clamp(26px,4.8vw,65px);
  color:#fffdf0;
}
.access-screen .hero-mark {
  display:grid;
  place-items:center;
  width:clamp(47px,5vw,64px);
  height:clamp(47px,5vw,64px);
  margin-bottom:23px;
  padding:8px;
  border:1px solid #eddbab61;
  border-radius:16px;
  background:#102e2866;
}
.access-screen .hero-mark svg {stroke:var(--access-brass);stroke-width:1.1}
.access-screen .access-copy .eyebrow {
  display:flex;
  align-items:center;
  gap:10px;
  color:var(--access-brass);
}
.access-screen .access-copy .eyebrow::before {
  content:"";
  flex:0 0 19px;
  height:1px;
  background:currentColor;
}
.access-screen .access-copy h1 {
  margin:15px 0 17px;
  font-size:clamp(38px,5.1vw,70px);
  line-height:1.15;
  letter-spacing:-.045em;
  overflow-wrap:break-word;
}
.access-screen .access-intro {
  color:#e9eee4;
  font-size:clamp(13px,1.25vw,16px);
  line-height:1.72;
  max-width:47ch;
  margin:0 0 23px;
}
.access-screen .access-copy .button {
  background:#f4e7c5;
  border-color:#f4e7c5;
  color:#203b2f;
  font-weight:650;
  box-shadow:0 8px 19px -10px #112b21;
}
.access-screen .access-copy .button:hover {background:#fff2d1;border-color:#fff2d1}
.access-screen .access-copy .quiet-note {color:#ccd9c9;font-size:11px;line-height:1.65;margin-top:13px;max-width:48ch}
.access-screen .demo-login-form {
  grid-area:login;
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:clamp(16px,2vw,23px);
  min-width:0;
  margin:clamp(20px,4vw,52px) clamp(20px,4.4vw,58px) clamp(20px,4vw,52px) 0;
  padding:clamp(22px,3vw,35px);
  border:1px solid #f4e8c9;
  border-radius:20px;
  background:linear-gradient(135deg,#fffdf5,#f5f2e8);
  color:var(--access-ink);
  box-shadow:0 18px 36px -19px #071f16dd;
}
.access-screen .demo-login-heading h2 {font-size:clamp(23px,2.9vw,35px);line-height:1.19;letter-spacing:-.035em}
.access-screen .demo-login-heading::after {content:"";display:block;width:34px;height:1px;background:#b29255;margin-top:14px}
.access-screen .demo-login-fields {grid-template-columns:minmax(0,1fr);gap:16px}
.access-screen .login-field label {color:#435b4f;font-size:12px;font-weight:650}
.access-screen .login-field input,.access-screen .login-password-field {
  border-color:#d3decf;
  border-radius:12px;
  background:#fffefa;
  box-shadow:none;
}
.access-screen .login-password-field input {background:transparent}
.access-screen .login-password-field button {color:#3f5b4c;border-radius:0 11px 11px 0}
.access-screen .login-field input[aria-invalid=true],.access-screen .login-password-field:has(input[aria-invalid=true]) {border-color:#a14e42}
.access-screen .login-actions {display:grid;grid-template-columns:minmax(0,1fr);gap:9px}
.access-screen .login-actions .button {width:100%;min-height:49px;font-weight:650;background:#214a39;border-color:#214a39}
.access-screen .login-actions .button:hover {background:#305f4b;border-color:#305f4b}

.access-screen .access-card,.access-screen .demo-accounts {
  color:var(--access-ink);
  padding:clamp(19px,3.3vw,40px);
  border:1px solid #dfe5d8;
  border-radius:clamp(16px,2.5vw,24px);
  background:#fffef8;
  box-shadow:0 12px 30px -26px #2444338f;
}
.access-screen .access-card {grid-area:details}
.access-screen .access-card-top .eyebrow {color:#7d6741}
.access-screen .access-card-top .icon {color:#9a804b}
.access-screen .access-card h2,.access-screen .demo-accounts-heading h2 {
  margin:6px 0 0;
  font-size:clamp(25px,3vw,37px);
  line-height:1.2;
  letter-spacing:-.03em;
}
.access-screen .access-features {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:12px;
  margin:19px 0 16px;
}
.access-screen .access-features li {
  display:flex;
  align-items:flex-start;
  gap:11px;
  min-width:0;
  margin:0;
  padding:14px 13px;
  border:1px solid #e5e9dc;
  border-radius:12px;
  background:#f5f6ef;
}
.access-screen .access-features li .feature-number {color:#7d6741}
.access-screen .access-features li strong {color:#2c4839;line-height:1.35}
.access-screen .access-features li p {margin:4px 0 0;color:#51665a;font-size:12px;line-height:1.55}
.access-screen .access-tier-row {margin-top:0}
.access-screen .access-tier-row .tier-pill {border:1px solid #dce3d8;background:#eff2eb;color:#41584b}
.access-screen .access-tier-row .gold {border-color:#e4d5a8;background:#f5ebd0;color:#665022}
.access-screen .access-tier-row .platinum {border-color:#cedad8;background:#eaf0ee;color:#395755}

.access-screen .demo-accounts {grid-area:club;min-width:0}
.access-screen .demo-accounts-heading {color:var(--access-ink);margin:0 0 clamp(16px,2.5vw,25px)}
.access-screen .demo-accounts-heading p {max-width:64ch;margin:7px 0 0;font-size:13px;line-height:1.65;color:#53665a}
.access-screen .demo-accounts-grid {
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:clamp(12px,1.7vw,22px);
  max-width:none;
  padding:0;
}
.access-screen .demo-accounts-grid .demo-account-card {
  display:flex;
  flex-direction:column;
  grid-column:auto;
  justify-self:stretch;
  width:100%;
  max-width:none;
  padding:clamp(9px,1.35vw,16px);
  border:1px solid #e0e6dc;
  border-radius:16px;
  background:linear-gradient(155deg,#f8f9f1,#f3f4ed);
  color:#294638;
}
.access-screen .demo-account-card .demo-account-art {
  min-height:152px;
  padding:clamp(13px,1.7vw,21px);
  border-radius:12px;
}
.access-screen .demo-account-card .demo-account-art.silver {
  --art-ink:#314a3e;--art-soft:#486055;--art-edge:#becabf;--art-rule:#fff9;
  background:radial-gradient(ellipse at 16% 5%,#ffffff9c,transparent 72%),linear-gradient(138deg,#bac9bf,#f0f4ed 48%,#cbd7cf 80%,#e1e9e1);
}
.access-screen .demo-account-card .demo-account-art.gold {
  --art-ink:#f1dba6;--art-soft:#dfd2a8;--art-edge:#a58b54;--art-rule:#ecd09855;
  background:radial-gradient(ellipse at 16% 4%,#66836379,transparent 72%),linear-gradient(145deg,#285141,#17372b);
}
.access-screen .demo-account-card .demo-account-art.platinum {
  --art-ink:#edf3f1;--art-soft:#becfcb;--art-edge:#8baca9;--art-rule:#ccdeda54;
  background:radial-gradient(ellipse at 90% 2%,#72908e69,transparent 64%),linear-gradient(146deg,#294c4a,#142f31);
}
.access-screen .demo-account-card .demo-account-tier {font-size:clamp(23px,2.7vw,35px);line-height:1.15}
.access-screen .demo-account-card .demo-account-art.gold .demo-account-tier {text-shadow:0 1px 0 #0b291d}
.access-screen .demo-account-card .demo-account-art.platinum .demo-account-tier {text-shadow:0 1px 0 #102727}
.access-screen .demo-account-card .demo-art-brand {font-size:8px;letter-spacing:1.25px}
.access-screen .demo-account-card .demo-art-emblem {width:23px;height:23px}
.access-screen .demo-account-card .demo-art-title {padding-block:5px}
.access-screen .demo-account-card .demo-art-label {font-size:9px;min-height:0;margin-top:5px}
.access-screen .demo-account-card .club-benefits {
  --club-ink:#294638;--club-muted:#52695c;--club-accent:#638875;
  margin:14px 0 0;
  padding:0 3px 2px;
  border:0;
  border-radius:0;
  background:none;
  box-shadow:none;
}
.access-screen .demo-account-card.gold .club-benefits {--club-accent:#9a783b}
.access-screen .demo-account-card.platinum .club-benefits {--club-accent:#668f8c}
.access-screen .demo-account-card .club-terms {grid-template-columns:1.1fr 1fr;gap:8px;padding-bottom:13px}
.access-screen .demo-account-card .club-terms>div {display:block;min-width:0}
.access-screen .demo-account-card .club-terms dt {margin:0 0 4px;font-size:10px;line-height:1.45}
.access-screen .demo-account-card .club-terms dd {font-size:clamp(15px,1.55vw,20px);white-space:normal;line-height:1.3}
.access-screen .demo-account-card .club-benefits h4 {margin:12px 0 8px}
.access-screen .demo-account-card .club-perks {gap:7px}
.access-screen .demo-account-card .club-perks li {font-size:12px;line-height:1.5}

@media(max-width:860px) {
  .access-screen {grid-template-columns:minmax(0,1.14fr) minmax(260px,1fr)}
  .access-screen .access-copy h1 {font-size:clamp(33px,5.25vw,46px)}
  .access-screen .demo-accounts-grid {grid-template-columns:repeat(2,minmax(0,1fr))}
  .access-screen .demo-accounts-grid .demo-account-card.platinum {grid-column:1/-1;width:calc((100% - 12px)/2);justify-self:center}
}
@media(max-width:680px) {
  .access-screen {
    grid-template:"hero" auto "login" auto "details" auto "club" auto / minmax(0,1fr);
    gap:16px;
  }
  .access-screen::before,.access-screen::after {grid-area:1 / 1 / 3 / 2}
  .access-screen::before {
    background:linear-gradient(180deg,#123629c4 0%,#153a2de5 54%,#14362b 100%),url('green-assets/woodland-panorama-v1.png') center 26% / cover no-repeat;
  }
  .access-screen .access-copy {padding:27px 22px 0}
  .access-screen .access-copy h1 {font-size:clamp(34px,7.5vw,48px);line-height:1.18}
  .access-screen .hero-mark {margin-bottom:17px}
  .access-screen .access-copy .button {width:auto}
  .access-screen .demo-login-form {margin:0 17px 19px;padding:21px}
  .access-screen .login-field input {font-size:16px}
  .access-screen .access-features {grid-template-columns:minmax(0,1fr);gap:7px;margin-block:15px}
  .access-screen .access-features li {padding:11px 12px}
}
@media(max-width:520px) {
  .access-screen .demo-accounts-grid {grid-template-columns:minmax(0,1fr);gap:13px}
  .access-screen .demo-accounts-grid .demo-account-card.platinum {grid-column:auto;width:100%;justify-self:stretch}
  .access-screen .demo-account-card .demo-account-art {padding:18px 19px}
  .access-screen .demo-account-card .demo-account-tier {font-size:clamp(26px,7.9vw,35px)}
}

.access-screen #openDemo [aria-hidden=true] {transform:rotate(90deg)}
@media(max-width:680px) {
  .access-screen #openDemo [aria-hidden=true] {transform:rotate(180deg)}
}
