/* 201.20 - gelijkwaardige login/account-tegels met subtiele houtachtergronden */
.customer-page:not(.customer-is-authenticated) .customer-account-shell{max-width:1320px!important}
.customer-page:not(.customer-is-authenticated) .customer-hero--account{
  grid-template-columns:minmax(0,1fr)!important;grid-template-areas:"copy"!important;
  gap:0!important;padding:24px 30px!important;border-radius:20px!important;
  background:linear-gradient(120deg,#fff 0%,#f6fafc 72%,#eef7fb 100%)!important;
  box-shadow:0 12px 34px rgba(18,62,84,.05)!important
}
.customer-page:not(.customer-is-authenticated) .customer-hero__brandmark,
.customer-page:not(.customer-is-authenticated) .customer-hero__trust{display:none!important}
.customer-page:not(.customer-is-authenticated) .customer-hero-copy{grid-area:copy!important;max-width:820px}
.customer-page:not(.customer-is-authenticated) .customer-hero-copy span{font-size:.72rem!important;letter-spacing:.14em!important}
.customer-page:not(.customer-is-authenticated) .customer-hero-copy h1{margin:4px 0 7px!important;font-size:clamp(1.8rem,3vw,2.35rem)!important}
.customer-page:not(.customer-is-authenticated) .customer-hero-copy p{max-width:720px!important;margin:0!important;color:#637d8c!important}

.customer-auth-showcase--20120{margin-top:18px}
.customer-auth-showcase__intro{max-width:860px;margin:0 0 18px}
.customer-auth-showcase__intro h2{margin:4px 0 7px;color:#0b4263;font-size:clamp(1.45rem,2.6vw,2rem);line-height:1.12}
.customer-auth-showcase__intro p{margin:0;color:#698290;font-size:.92rem;line-height:1.55}
.customer-auth-grid--20120{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;align-items:stretch}
.customer-auth-tile{position:relative;overflow:hidden;display:flex;flex-direction:column;min-height:100%;padding:24px 24px 22px;border:1px solid #d4e4eb;border-radius:22px;background:#fff;box-shadow:0 12px 28px rgba(16,60,82,.05)}
.customer-auth-tile>*{position:relative;z-index:1}
.customer-auth-tile::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(255,255,255,.99) 0%,rgba(255,255,255,.98) 56%,rgba(255,255,255,.92) 73%,rgba(255,255,255,.62) 100%);z-index:0}
.customer-auth-tile::after{content:"";position:absolute;inset:0;background-image:var(--customer-tile-image);background-size:cover;background-position:center right;opacity:.36;z-index:0}
.customer-auth-tile--login{--customer-tile-image:url('../img/customer-portal-workfloor.jpg');border-top:4px solid #004b87}
.customer-auth-tile--private{--customer-tile-image:url('../img/van-hameren-houtvoorraad-201.19.jpg');border-top:4px solid #0789cb}
.customer-auth-tile--business{--customer-tile-image:url('../img/van-hameren-balken-201.19.jpg');border-top:4px solid #0b6f9e}
.customer-auth-tile__label{display:inline-flex;align-items:center;gap:8px;margin-bottom:10px;color:#007fbc;font-size:.69rem;font-weight:950;letter-spacing:.12em}
.customer-auth-tile__label::before{content:"";width:9px;height:9px;border-radius:50%;background:#efb56c;box-shadow:0 0 0 5px rgba(239,181,108,.18)}
.customer-auth-tile--login .customer-auth-tile__label{color:#004b87}
.customer-auth-tile h3{margin:0 0 9px;color:#0a3e61;font-size:1.34rem;line-height:1.18}
.customer-auth-tile p{margin:0;color:#667f8e;font-size:.86rem;line-height:1.53}
.customer-auth-form--20120{display:grid;gap:12px;margin-top:16px}
.customer-auth-form--20120 label{display:grid;gap:7px;margin:0!important;color:#254d63;font-size:.82rem;font-weight:850}
.customer-auth-form--20120 input{width:100%;min-height:48px;border:1px solid #c9dbe4;border-radius:14px;padding:0 14px;background:rgba(255,255,255,.96);box-shadow:inset 0 1px 0 rgba(255,255,255,.85)}
.customer-auth-form--20120 input:focus{outline:none;border-color:#43a7d6;box-shadow:0 0 0 4px rgba(9,135,200,.09)}
.customer-login-fields--stack{display:grid;gap:12px}
.customer-login-actions--20120{display:grid;gap:12px;margin-top:4px}
.customer-login-submit{width:100%;justify-content:center;min-height:48px}
.customer-login-secondary{display:flex;flex-wrap:wrap;gap:10px}
.customer-login-pill{appearance:none;display:inline-flex;align-items:center;justify-content:center;min-height:40px;padding:0 16px;border-radius:999px;border:1px solid #b8cfdb;background:#fff;color:#0a5b83;text-decoration:none;font:inherit;font-size:.78rem;font-weight:900;cursor:pointer;box-shadow:0 4px 12px rgba(18,62,84,.04)}
.customer-login-pill:hover,.customer-login-pill:focus-visible{background:#f2f8fb;border-color:#6faed0;color:#084e70}
.customer-auth-tile__list{display:grid;gap:9px;margin:16px 0 0;padding:0;list-style:none}
.customer-auth-tile__list li{position:relative;padding-left:25px;color:#345568;font-size:.79rem;font-weight:760;line-height:1.42}
.customer-auth-tile__list li::before{content:"✓";position:absolute;left:0;top:0;display:grid;place-items:center;width:18px;height:18px;border-radius:50%;background:#eaf7ef;color:#197646;font-size:.64rem;font-weight:950}
.customer-auth-tile__actions{margin-top:auto;padding-top:20px}
.customer-auth-tile__button{width:100%;justify-content:center;min-height:46px}
.customer-button--secondary{display:inline-flex;align-items:center;justify-content:center;border:1px solid #9dbccc!important;background:#fff!important;color:#064f75!important}
.customer-button--secondary:hover,.customer-button--secondary:focus-visible{background:#f3f9fc!important;border-color:#5da9cb!important}
.customer-auth-tile__button.active{box-shadow:0 0 0 3px rgba(0,138,203,.15)}
.customer-activate-panel--20120{margin-top:20px}
.customer-activate-panel--20120 .customer-inline-form{max-width:820px;margin:0 auto;border:1px solid #cfdee5!important;border-radius:20px!important;box-shadow:0 12px 32px rgba(18,62,84,.06)!important;background:linear-gradient(180deg,#fff 0%,#fbfdfe 100%)!important}
.customer-activate-panel--20120 .customer-inline-form__head p{max-width:62ch}

@media(max-width:1120px){
  .customer-auth-grid--20120{grid-template-columns:1fr}
}
@media(max-width:720px){
  .customer-page:not(.customer-is-authenticated) .customer-hero--account{padding:18px!important;border-radius:16px!important}
  .customer-auth-tile{padding:19px 17px 18px;border-radius:18px}
  .customer-auth-showcase__intro{margin-bottom:14px}
  .customer-login-secondary{flex-direction:column}
  .customer-login-pill{width:100%}
}