/* AK Enquiries — public form
   Colour tokens are injected inline from the admin panel as --ake-g1/g2/g3. */

.ake-app{
  --ake-text:#12201D;
  --ake-muted:#5A6B66;
  --ake-border:#DCE5E2;
  --ake-danger:#A32C15;
  --ake-r:12px;
  --ake-grad:linear-gradient(120deg,var(--ake-g1),var(--ake-g2) 52%,var(--ake-g3));
  --ake-ease:cubic-bezier(.22,.61,.36,1);

  max-width:820px; margin:0 auto; padding:56px 16px 96px;
  color:var(--ake-text);
  font:400 17px/1.55 "Instrument Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  box-sizing:border-box;
}
.ake-app *,.ake-app *::before,.ake-app *::after{box-sizing:border-box}
.ake-app h1,.ake-app h2{margin:0; line-height:1.12; letter-spacing:-.02em; text-wrap:balance; font-weight:700}
.ake-app p{margin:0}
.ake-app :focus-visible{outline:2px solid var(--ake-g1); outline-offset:2px; border-radius:6px}

/* ---------- intro curtain ---------- */
.ake-curtain[hidden]{display:none}
.ake-curtain{
  position:fixed; inset:0; z-index:99999;
  background:var(--ake-bg);
  display:grid; place-items:center; padding:24px; overflow:hidden;
  animation:ake-curtain-out .6s var(--ake-ease) var(--ake-out,2.5s) forwards;
}
.ake-curtain__glow{
  position:absolute; width:min(880px,150vw); aspect-ratio:1; border-radius:50%;
  background:var(--ake-grad); filter:blur(90px); opacity:.22;
  transform:scale(.6); animation:ake-bloom 1.6s var(--ake-ease) forwards;
}
.ake-curtain__inner{position:relative; text-align:center; max-width:640px}
.ake-mark{
  width:80px; height:80px; margin:0 auto 24px; border-radius:16px;
  background:var(--ake-grad); display:grid; place-items:center;
  opacity:0; animation:ake-rise .55s var(--ake-ease) .34s forwards;
  box-shadow:0 14px 34px -14px var(--ake-g1);
}
.ake-mark span{
  font-weight:700; font-size:26px; letter-spacing:.04em; color:#fff;
}
.ake-rule{
  width:min(420px,78vw); height:2px; margin:0 auto 24px; border-radius:2px;
  background:var(--ake-grad);
  transform:scaleX(0); animation:ake-draw .7s var(--ake-ease) .1s forwards;
}
.ake-wordmark{
  font-size:clamp(36px,9vw,60px);
  background:var(--ake-grad); -webkit-background-clip:text; background-clip:text; color:transparent;
  opacity:0; animation:ake-rise .6s var(--ake-ease) .68s forwards;
}
.ake-greeting{
  margin-top:14px; font-size:20px; color:var(--ake-muted);
  opacity:0; animation:ake-rise .6s var(--ake-ease) .96s forwards;
}
.ake-tagline{
  margin-top:8px; font-size:13px; letter-spacing:.16em; text-transform:uppercase; color:var(--ake-deep);
  opacity:0; animation:ake-rise .6s var(--ake-ease) 1.2s forwards;
}
.ake-skip{
  position:fixed; top:16px; right:16px; min-height:44px; padding:8px 18px;
  background:transparent; border:1px solid var(--ake-border); border-radius:999px;
  font:500 14px/1 inherit; color:var(--ake-muted); cursor:pointer;
  transition:color .16s var(--ake-ease),border-color .16s var(--ake-ease);
}
.ake-skip:hover{color:var(--ake-text); border-color:var(--ake-muted)}

@keyframes ake-draw{to{transform:scaleX(1)}}
@keyframes ake-rise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@keyframes ake-bloom{to{transform:scale(1);opacity:.22}}
@keyframes ake-curtain-out{to{opacity:0;transform:translateY(-16px);visibility:hidden}}

/* ---------- masthead + lede ---------- */
.ake-masthead{display:flex; align-items:center; gap:12px; margin-bottom:48px}
.ake-badge{
  width:44px; height:44px; flex:none; border-radius:12px; background:var(--ake-grad);
  display:grid; place-items:center; color:#fff; font-weight:700; font-size:15px;
}
.ake-masthead__text b{display:block; font-size:20px; font-weight:700; letter-spacing:-.01em}
.ake-masthead__text > span{display:block; font-size:14px; color:var(--ake-muted)}
.ake-lede h1{font-size:clamp(30px,6vw,42px); max-width:18ch}
.ake-lede p{margin-top:16px; color:var(--ake-muted); max-width:62ch}

/* ---------- panel + progress rail (the signature) ---------- */
.ake-panel{
  position:relative; margin-top:48px; background:var(--ake-surface);
  border:1px solid var(--ake-border); border-radius:var(--ake-r);
  padding:32px 24px;
  box-shadow:0 1px 2px rgba(18,32,29,.04),0 24px 48px -28px rgba(18,32,29,.30);
}
@media (min-width:768px){.ake-panel{padding:48px}}
.ake-rail{position:absolute; left:0; top:0; bottom:0; width:4px; overflow:hidden; border-radius:var(--ake-r) 0 0 var(--ake-r); background:var(--ake-border)}
.ake-rail__fill{position:absolute; inset:0; background:var(--ake-grad); transform:scaleY(0); transform-origin:50% 0; transition:transform .45s var(--ake-ease)}
.ake-rail__label{
  margin-bottom:24px; font-size:12px; letter-spacing:.14em; text-transform:uppercase;
  color:var(--ake-muted); font-weight:600;
}

/* ---------- fields ---------- */
.ake-field{margin-bottom:24px}
.ake-app label,.ake-legend{display:block; font-weight:600; font-size:14px; margin-bottom:8px}
.ake-opt{color:var(--ake-muted); font-weight:400}
.ake-hint{font-size:14px; color:var(--ake-muted); margin-top:8px}
.ake-app input[type=text],.ake-app input[type=email],.ake-app input[type=tel],
.ake-app select,.ake-app textarea{
  width:100%; min-height:48px; padding:12px 16px;
  font:400 17px/1.5 inherit; color:var(--ake-text); background:#fff;
  border:1px solid var(--ake-border); border-radius:var(--ake-r);
  transition:border-color .16s var(--ake-ease),box-shadow .16s var(--ake-ease);
}
.ake-app textarea{min-height:136px; resize:vertical}
.ake-app select{appearance:none; padding-right:44px;
  background-image:linear-gradient(45deg,transparent 50%,var(--ake-muted) 50%),linear-gradient(135deg,var(--ake-muted) 50%,transparent 50%);
  background-position:calc(100% - 20px) 22px,calc(100% - 14px) 22px; background-size:6px 6px; background-repeat:no-repeat}
.ake-app input:hover,.ake-app select:hover,.ake-app textarea:hover{border-color:var(--ake-muted)}
.ake-app input:focus,.ake-app select:focus,.ake-app textarea:focus{outline:none; border-color:var(--ake-g1); box-shadow:0 0 0 3px color-mix(in srgb,var(--ake-g2) 22%,transparent)}
.ake-app [aria-invalid=true]{border-color:var(--ake-danger)}
.ake-err{display:none; margin-top:8px; font-size:14px; color:var(--ake-danger)}
.ake-err.is-on{display:block}
.ake-err--consent{margin-top:-16px; margin-bottom:16px}
.ake-tel{display:flex; gap:8px}
.ake-tel select{width:136px; flex:none}
.ake-hp{position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden}

/* ---------- project cards ---------- */
.ake-fieldset{border:0; margin:0 0 24px; padding:0; min-width:0}
.ake-cards{display:grid; gap:8px}
@media (min-width:600px){.ake-cards{grid-template-columns:1fr 1fr}}
.ake-card{
  position:relative; display:block; cursor:pointer; margin:0;
  border:1px solid var(--ake-border); border-radius:var(--ake-r);
  padding:16px 16px 16px 48px; font-weight:400;
  transition:border-color .16s var(--ake-ease),transform .16s var(--ake-ease);
}
.ake-card:hover{border-color:var(--ake-muted); transform:translateY(-1px)}
.ake-card input{position:absolute; opacity:0; width:1px; height:1px}
.ake-dot{position:absolute; left:16px; top:20px; width:18px; height:18px; border:1.5px solid var(--ake-border); border-radius:50%; transition:border-color .16s var(--ake-ease)}
.ake-dot::after{content:""; position:absolute; inset:3px; border-radius:50%; background:var(--ake-grad); transform:scale(0); transition:transform .16s var(--ake-ease)}
.ake-card strong{display:block; font-weight:600; font-size:17px}
.ake-card small{display:block; color:var(--ake-muted); font-size:14px; margin-top:2px}
.ake-card.is-checked{border-color:var(--ake-g1); background:color-mix(in srgb,var(--ake-g2) 6%,transparent)}
.ake-card.is-checked .ake-dot{border-color:var(--ake-g1)}
.ake-card.is-checked .ake-dot::after{transform:scale(1)}

/* ---------- consent, buttons ---------- */
.ake-consent{display:flex; gap:12px; align-items:flex-start; margin-bottom:24px}
.ake-consent input{width:20px; height:20px; margin:3px 0 0; flex:none; accent-color:var(--ake-g1)}
.ake-consent label{font-size:14px; color:var(--ake-muted); font-weight:400; margin:0}
.ake-consent a{color:var(--ake-g1); text-underline-offset:3px}
.ake-actions{display:flex; flex-wrap:wrap; align-items:center; gap:16px}
.ake-note{font-size:14px; color:var(--ake-muted)}
.ake-btn{
  display:inline-flex; align-items:center; justify-content:center; min-height:50px; padding:12px 32px;
  font:600 17px/1 inherit; color:#fff; border:0; border-radius:var(--ake-r); cursor:pointer;
  background:var(--ake-grad); background-size:160% 100%; background-position:0% 0%;
  box-shadow:0 10px 26px -12px var(--ake-g1);
  transition:background-position .3s var(--ake-ease),transform .16s var(--ake-ease),box-shadow .16s var(--ake-ease);
}
.ake-btn:hover{background-position:100% 0%; transform:translateY(-1px)}
.ake-btn:active{transform:none}
.ake-btn[disabled]{opacity:.6; cursor:not-allowed; transform:none}
.ake-btn--ghost{background:transparent; color:var(--ake-g1); border:1px solid var(--ake-border); box-shadow:none}
.ake-btn--ghost:hover{border-color:var(--ake-g1)}

/* ---------- success ---------- */
.ake-done[hidden]{display:none}
.ake-done h2{font-size:clamp(24px,4vw,30px); margin-bottom:12px}
.ake-done > p{color:var(--ake-muted); max-width:56ch}
.ake-tick{width:52px; height:52px; border-radius:50%; background:var(--ake-grad); display:grid; place-items:center; margin-bottom:24px}
.ake-tick svg{width:22px; height:22px; stroke:#fff; stroke-width:2.4; fill:none; stroke-linecap:round; stroke-linejoin:round}
.ake-summary{margin:24px 0; padding-top:24px; border-top:1px solid var(--ake-border); font-size:14px; color:var(--ake-muted)}
.ake-summary dt{font-weight:600; color:var(--ake-text); float:left; clear:left; width:96px}
.ake-summary dd{margin:0 0 8px 104px}

@media (prefers-reduced-motion:reduce){
  .ake-app *,.ake-app *::before,.ake-app *::after{
    animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important;
  }
  .ake-curtain{animation-delay:1.2s}
  .ake-mark,.ake-wordmark,.ake-greeting,.ake-tagline{opacity:1}
  .ake-rule{transform:scaleX(1)}
}
