@charset "utf-8";

/* =========================================================================
   Space Lens order – call to action + popup
   ========================================================================= */

/* ---------- Call to action in the Order section ------------------------- */
.order-brand{
  width:min(16rem,70%);
  height:auto;
  filter:brightness(0) invert(1);
}
.order-claim{
  font-size:clamp(1rem,.95rem + .35vw,1.2rem);
  font-weight:500;line-height:1.4;
  color:var(--white);
}
.order-claim span{display:inline-block;margin-top:.35rem;font-size:.875rem;font-weight:400;color:rgba(255,255,255,.7);}

.order-cta{
  display:flex;flex-direction:column;align-items:flex-start;gap:1rem;
  align-self:end;
}
.order-cta__price{
  font-size:clamp(1rem,.95rem + .3vw,1.2rem);
  color:rgba(255,255,255,.8);
}
.order-cta__price strong{font-weight:600;color:var(--white);}
.order-cta__button{
  display:inline-flex;align-items:center;gap:.75rem;
  padding:1rem 1.75rem;
  border-radius:999px;
  background:var(--white);color:var(--black);
  font-size:clamp(1rem,.95rem + .25vw,1.125rem);font-weight:600;
  transition:background-color .25s var(--ease),color .25s var(--ease),transform .25s var(--ease);
}
.order-cta__button svg{width:1.1em;height:1.1em;fill:none;stroke:currentColor;stroke-width:2;transition:transform .25s var(--ease);}
.order-cta__button:hover{background:var(--green-accent);}
.order-cta__button:hover svg{transform:translateX(3px);}
.order-cta__note{font-size:.875rem;color:rgba(255,255,255,.6);}
.order-cta__legal{max-width:26rem;font-size:.78rem;line-height:1.5;color:rgba(255,255,255,.5);}

body.order-open{overflow:hidden;}

/* ---------- Dialog shell ------------------------------------------------ */
.order-dialog{
  --o-line:rgba(0,0,0,.12);
  --o-muted:#6b6b6b;
  --o-soft:#f4f6f5;
  --o-radius:14px;

  width:min(1080px,calc(100vw - 2rem));
  max-width:none;
  max-height:90vh;
  max-height:90dvh;
  margin:auto;
  padding:0;
  border:0;
  border-radius:20px;
  background:var(--white);
  color:#111;
  font-family:var(--font);
  font-size:1rem;
  line-height:1.5;
  box-shadow:0 30px 90px rgba(0,0,0,.35);
  overflow:hidden;
}
.order-dialog[open]{
  display:flex;flex-direction:column;
  animation:order-in .35s var(--ease);
}
.order-dialog.is-success{width:min(560px,calc(100vw - 2rem));}
.order-dialog [hidden]{display:none!important;}
.order-dialog::backdrop{
  background:rgba(0,0,0,.55);
  -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);
}
@keyframes order-in{
  from{opacity:0;transform:translateY(12px) scale(.985);}
  to{opacity:1;transform:none;}
}

.order-dialog__head{
  flex:0 0 auto;
  display:flex;align-items:center;justify-content:space-between;gap:1rem;
  padding:1.1rem clamp(1.1rem,3vw,2rem);
  border-bottom:1px solid var(--o-line);
}
.order-dialog__logo{height:1.3rem;width:auto;margin-bottom:.45rem;}
.order-dialog__kicker{
  font-size:.75rem;letter-spacing:.14em;text-transform:uppercase;
  color:var(--teal);font-weight:500;
}
.order-dialog__title{
  font-size:clamp(1.3rem,1.1rem + .9vw,1.75rem);
  font-weight:600;letter-spacing:-.015em;line-height:1.2;
}
.order-dialog__close{
  flex:0 0 auto;
  display:grid;place-items:center;
  width:2.5rem;height:2.5rem;border-radius:50%;
  border:1px solid var(--o-line);
  transition:background-color .2s var(--ease);
}
.order-dialog__close:hover{background:var(--o-soft);}
.order-dialog__close svg{width:1.1rem;height:1.1rem;stroke:currentColor;stroke-width:1.8;fill:none;}

.order-dialog__body{
  flex:0 1 auto;
  min-height:0;
  overflow-y:auto;
  overscroll-behavior:contain;
  padding:clamp(1.1rem,3vw,2rem);
}

/* ---------- Form layout ------------------------------------------------- */
.order-layout{display:grid;gap:clamp(1.5rem,3vw,2.5rem);}
@media (min-width:900px){
  .order-layout{grid-template-columns:minmax(0,1fr) 300px;align-items:start;}
  .order-summary{position:sticky;top:0;}
}

.order-step{padding-block:0 1.75rem;}
.order-step + .order-step{padding-top:1.75rem;border-top:1px solid var(--o-line);}
.order-step:last-child{padding-bottom:0;}
.order-step__title{
  display:flex;align-items:baseline;gap:.75rem;
  margin-bottom:1rem;
  font-size:1.05rem;font-weight:600;letter-spacing:-.005em;
}
.order-step__no{
  font-size:.75rem;font-weight:500;letter-spacing:.1em;
  color:var(--teal);
  font-variant-numeric:tabular-nums;
}

.order-grid{display:grid;gap:1rem 1.25rem;}
@media (min-width:640px){.order-grid{grid-template-columns:1fr 1fr;}}
.order-grid + .order-field,.order-grid + .order-grid{margin-top:1rem;}

.order-field label,.order-label{
  display:block;margin-bottom:.35rem;
  font-size:.82rem;font-weight:500;color:#333;
}
.order-field label.is-required::after{content:" *";color:var(--teal);}

.order-field input,.order-field textarea{
  width:100%;
  padding:.7rem .85rem;
  border:1px solid rgba(0,0,0,.18);
  border-radius:10px;
  background:var(--white);
  font:inherit;font-size:.95rem;color:#111;
  transition:border-color .2s var(--ease),box-shadow .2s var(--ease);
}
.order-field textarea{min-height:4.5rem;resize:vertical;}
.order-field input:focus,.order-field textarea:focus{
  outline:none;
  border-color:var(--teal);
  box-shadow:0 0 0 3px rgba(0,84,95,.15);
}
.order-static{padding:.7rem 0;font-size:.95rem;}
.order-help{margin-top:.35rem;font-size:.8rem;line-height:1.45;color:var(--o-muted);}

/* file upload */
.order-file-input{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none;}
.order-dropzone{
  display:block;width:100%;
  padding:1.25rem;
  border:1.5px dashed rgba(0,0,0,.22);
  border-radius:var(--o-radius);
  background:var(--o-soft);
  text-align:left;
  transition:border-color .2s var(--ease),background-color .2s var(--ease);
}
.order-dropzone:hover,.order-dropzone.is-drag{border-color:var(--teal);background:rgba(0,84,95,.05);}
.order-dropzone strong{display:block;font-weight:500;}
.order-dropzone span{font-size:.85rem;color:var(--o-muted);}

.order-guide{margin-top:1rem;font-size:.875rem;line-height:1.55;color:#333;}
.order-guide p + p{margin-top:.5rem;}
.order-guide__links{display:flex;flex-wrap:wrap;gap:.5rem 1.5rem;margin-top:.75rem;}
.order-link{
  color:var(--teal);font-weight:500;text-decoration:none;
  border-bottom:1px solid rgba(0,84,95,.35);
  transition:border-color .2s var(--ease);
}
.order-link:hover{border-color:var(--teal);}
.order-template summary{cursor:pointer;list-style:none;display:inline;}
.order-template summary::-webkit-details-marker{display:none;}
.order-template[open] summary{margin-bottom:.75rem;}
.order-template__table{
  width:100%;max-width:26rem;border-collapse:collapse;
  font-size:.8rem;
}
.order-template__table th,.order-template__table td{
  padding:.3rem .6rem;border-bottom:1px solid var(--o-line);text-align:left;white-space:nowrap;
}
.order-template__table th{font-weight:500;background:var(--o-soft);}

.order-validation{margin-top:1rem;padding:.9rem 1rem;border-radius:12px;font-size:.875rem;line-height:1.5;}
.order-validation strong{font-weight:500;}
.order-validation ul{margin-top:.4rem;padding-left:1.1rem;list-style:disc;}
.order-validation.is-ok{background:#ebf6ee;color:#1d6b3b;}
.order-validation.is-warning{background:#fff5df;color:#7d5300;}
.order-validation.is-error{background:#fdeceb;color:#a3261c;}
.order-validation__groups{margin-top:.5rem;}
.order-validation__group{display:flex;justify-content:space-between;gap:1rem;padding:.25rem 0;border-top:1px solid rgba(0,0,0,.08);}

.order-check{display:flex;gap:.75rem;align-items:flex-start;font-size:.875rem;line-height:1.5;color:#333;}
.order-check input{flex:0 0 auto;width:1.1rem;height:1.1rem;margin-top:.15rem;accent-color:var(--teal);}
.order-check--inline{margin-top:.25rem;font-size:.85rem;}

/* ---------- Summary ----------------------------------------------------- */
.order-summary{
  border:1px solid var(--o-line);
  border-radius:var(--o-radius);
  overflow:hidden;
}
.order-summary__price{padding:1.25rem;background:var(--o-soft);}
.order-summary__label{font-size:.75rem;letter-spacing:.12em;text-transform:uppercase;color:var(--o-muted);}
.order-summary__total{
  margin-top:.25rem;
  font-size:2rem;font-weight:600;letter-spacing:-.02em;line-height:1.1;
  color:var(--teal);
  font-variant-numeric:tabular-nums;
}
.order-summary__note{margin-top:.25rem;font-size:.85rem;color:var(--o-muted);}
.order-summary__list{padding:.5rem 1.25rem;}
.order-summary__row{
  display:flex;justify-content:space-between;gap:1rem;
  padding:.55rem 0;
  font-size:.85rem;
}
.order-summary__row + .order-summary__row{border-top:1px solid var(--o-line);}
.order-summary__row dt{color:var(--o-muted);}
.order-summary__row dd{margin:0;text-align:right;font-weight:500;overflow-wrap:anywhere;}
.order-summary__actions{padding:1.25rem;border-top:1px solid var(--o-line);display:grid;gap:.75rem;}

.order-btn{
  display:inline-flex;align-items:center;justify-content:center;
  padding:.85rem 1.25rem;
  border-radius:999px;
  font-size:.95rem;font-weight:600;
  transition:background-color .2s var(--ease),opacity .2s var(--ease);
}
.order-btn--primary{background:var(--teal);color:var(--white);}
.order-btn--primary:hover{background:#003e46;}
.order-btn--primary:disabled{opacity:.5;cursor:not-allowed;}

.order-status{font-size:.85rem;line-height:1.45;color:var(--o-muted);}
.order-status:empty{display:none;}
.order-status.is-error{color:#a3261c;}
.order-secure{font-size:.78rem;line-height:1.45;color:var(--o-muted);}
.order-legal{
  padding-top:.75rem;border-top:1px solid var(--o-line);
  font-size:.75rem;line-height:1.5;color:var(--o-muted);
}

/* ---------- Success ----------------------------------------------------- */
.order-success{text-align:center;padding:clamp(1rem,4vw,2.5rem) 0;}
.order-success__icon{
  display:grid;place-items:center;
  width:3.5rem;height:3.5rem;margin:0 auto 1.25rem;
  border-radius:50%;
  background:rgba(93,234,46,.18);color:var(--teal);
}
.order-success__icon svg{width:1.6rem;height:1.6rem;fill:none;stroke:currentColor;stroke-width:2.2;}
.order-success__title{font-size:1.5rem;font-weight:600;letter-spacing:-.015em;}
.order-success__text{max-width:30rem;margin:.75rem auto 1.75rem;color:#444;}

@media (max-width:639px){
  .order-dialog{width:calc(100vw - 1rem);border-radius:16px;}
}