/* AGGRO v31.21 — premium contact modal with safe header clearance */
:root{
  --modal-safe-top:104px;
  --modal-safe-bottom:18px;
}

body.modal-open .header{
  z-index:1700!important;
  opacity:1!important;
  visibility:visible!important;
  pointer-events:auto!important;
}

.modal{
  z-index:1600!important;
  display:grid!important;
  align-items:start!important;
  justify-items:center!important;
  padding:
    var(--modal-safe-top)
    clamp(12px,3vw,28px)
    var(--modal-safe-bottom)!important;
  background:
    radial-gradient(circle at 18% 12%,rgba(105,199,190,.18),transparent 29%),
    radial-gradient(circle at 85% 78%,rgba(180,31,52,.13),transparent 31%),
    rgba(35,23,16,.60)!important;
  backdrop-filter:blur(16px) saturate(1.08)!important;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .32s ease,visibility .32s ease;
  overflow:hidden;
}
.modal.is-open{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
}

.modal-panel{
  width:min(700px,100%)!important;
  max-height:calc(100dvh - var(--modal-safe-top) - var(--modal-safe-bottom))!important;
  margin:0!important;
  padding:0 42px 38px!important;
  overflow-x:hidden!important;
  overflow-y:auto!important;
  overscroll-behavior:contain;
  scrollbar-width:thin;
  scrollbar-color:rgba(88,184,174,.62) transparent;
  background:
    linear-gradient(135deg,rgba(255,251,246,.98),rgba(244,224,202,.97))!important;
  border:1px solid rgba(255,255,255,.64)!important;
  border-radius:30px!important;
  box-shadow:
    0 34px 90px rgba(22,13,8,.30),
    inset 0 0 0 1px rgba(88,184,174,.12)!important;
  transform:translate3d(0,24px,0) scale(.975);
  opacity:0;
  transition:transform .46s cubic-bezier(.18,.82,.22,1),opacity .34s ease!important;
}
.modal.is-open .modal-panel{
  transform:none;
  opacity:1;
}
.modal-panel::-webkit-scrollbar{width:7px}
.modal-panel::-webkit-scrollbar-track{background:transparent}
.modal-panel::-webkit-scrollbar-thumb{
  background:linear-gradient(180deg,var(--brand-mint),rgba(180,31,52,.72));
  border-radius:99px;
}

.modal-panel::before{
  content:""!important;
  position:absolute!important;
  left:0!important;
  right:0!important;
  top:0!important;
  height:6px!important;
  background:linear-gradient(90deg,var(--brand-mint),#9bded7 42%,#d5b894 68%,var(--red))!important;
  border-radius:30px 30px 0 0!important;
}
.modal-panel::after{
  content:"";
  position:absolute;
  width:220px;
  height:220px;
  right:-110px;
  top:-95px;
  border-radius:50%;
  border:1px solid rgba(88,184,174,.18);
  box-shadow:0 0 0 30px rgba(88,184,174,.035),0 0 0 62px rgba(180,31,52,.018);
  pointer-events:none;
}

.modal-brand{
  position:sticky;
  top:0;
  z-index:4;
  display:flex;
  align-items:center;
  gap:14px;
  margin:0 -42px 28px;
  padding:24px 92px 19px 42px;
  background:linear-gradient(180deg,rgba(255,250,244,.99) 0%,rgba(255,250,244,.95) 78%,rgba(255,250,244,0) 100%);
  backdrop-filter:blur(12px);
}
.modal-brand__mark{
  width:54px;
  height:54px;
  flex:0 0 54px;
  display:grid;
  place-items:center;
  border-radius:18px;
  background:linear-gradient(145deg,rgba(159,222,215,.76),rgba(244,226,202,.78));
  border:1px solid rgba(88,184,174,.30);
  box-shadow:0 10px 24px rgba(88,184,174,.14);
}
.modal-brand__mark img{
  width:38px;
  height:38px;
  object-fit:contain;
}
.modal-brand__copy{
  min-width:0;
  display:grid;
  gap:3px;
}
.modal-brand__copy strong{
  font-family:var(--serif);
  color:var(--red);
  font-size:20px;
  line-height:1.1;
}
.modal-brand__copy span{
  color:var(--muted);
  font-size:12px;
  line-height:1.35;
}

.modal-close{
  position:sticky!important;
  float:right;
  top:16px!important;
  right:0!important;
  z-index:8!important;
  width:46px!important;
  height:46px!important;
  margin:17px 0 -63px auto!important;
  display:grid!important;
  place-items:center!important;
  border:1px solid rgba(88,184,174,.30)!important;
  border-radius:15px!important;
  background:rgba(255,250,244,.92)!important;
  color:var(--red)!important;
  box-shadow:0 9px 22px rgba(78,47,25,.10)!important;
  font:400 31px/1 var(--sans)!important;
  cursor:pointer;
  transition:transform .25s ease,background .25s ease,box-shadow .25s ease!important;
}
.modal-close:hover{
  transform:rotate(5deg) scale(1.04);
  background:#fff!important;
  box-shadow:0 13px 28px rgba(78,47,25,.15)!important;
}

.modal .kicker{display:none!important}
.modal h2{
  position:relative;
  z-index:1;
  max-width:560px;
  margin:0!important;
  color:var(--ink)!important;
  font-size:clamp(38px,5vw,54px)!important;
  line-height:1.04!important;
  letter-spacing:-.025em!important;
  text-wrap:balance;
}
.modal-panel > p{
  position:relative;
  z-index:1;
  max-width:590px;
  margin:16px 0 27px!important;
  color:var(--muted)!important;
  font-size:15px!important;
  line-height:1.65!important;
}

.modal .form-grid{
  position:relative;
  z-index:2;
  gap:16px!important;
}
.modal .field{gap:8px!important}
.modal .field label{
  color:#694d39!important;
  font-size:11px!important;
  letter-spacing:.11em!important;
}
.modal .field input,
.modal .field textarea,
.modal .field select{
  min-height:52px;
  border:1px solid rgba(92,60,35,.16)!important;
  border-radius:16px!important;
  background:rgba(255,255,255,.66)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.68)!important;
  padding:15px 16px!important;
}
.modal .field textarea{
  min-height:116px!important;
}
.modal .field input:focus,
.modal .field textarea:focus,
.modal .field select:focus{
  border-color:rgba(88,184,174,.78)!important;
  background:#fff!important;
  box-shadow:0 0 0 4px rgba(88,184,174,.12),0 10px 24px rgba(88,184,174,.08)!important;
}
.modal .form-consent{
  grid-column:1/-1;
  margin:0!important;
  padding:3px 2px 0;
  font-size:11px!important;
  line-height:1.55!important;
  color:var(--muted)!important;
}
.modal .form-consent a{
  color:var(--red);
  text-decoration:underline;
  text-underline-offset:3px;
}
.modal .field .btn,
.modal .field--wide .btn{
  width:100%;
  min-height:56px;
  margin-top:2px;
  border-radius:17px!important;
  font-size:13px!important;
  letter-spacing:.06em;
  box-shadow:0 17px 32px rgba(180,31,52,.20)!important;
}

@media(max-width:900px){
  :root{--modal-safe-top:94px;--modal-safe-bottom:10px}
  body.modal-open .header{z-index:1700!important}
  .modal-panel{
    width:min(650px,100%)!important;
    border-radius:26px!important;
  }
}

@media(max-width:560px){
  :root{--modal-safe-top:86px;--modal-safe-bottom:8px}
  .modal{
    padding-left:8px!important;
    padding-right:8px!important;
  }
  .modal-panel{
    width:100%!important;
    padding:0 19px 24px!important;
    border-radius:24px!important;
  }
  .modal-panel::before{border-radius:24px 24px 0 0!important}
  .modal-brand{
    margin:0 -19px 22px;
    padding:18px 68px 16px 19px;
  }
  .modal-brand__mark{
    width:48px;
    height:48px;
    flex-basis:48px;
    border-radius:16px;
  }
  .modal-brand__mark img{width:34px;height:34px}
  .modal-brand__copy strong{font-size:18px}
  .modal-brand__copy span{font-size:10px}
  .modal-close{
    top:11px!important;
    width:42px!important;
    height:42px!important;
    margin:12px 0 -54px auto!important;
    border-radius:14px!important;
  }
  .modal h2{
    font-size:clamp(34px,11vw,44px)!important;
    line-height:1.06!important;
  }
  .modal-panel > p{
    margin-top:13px!important;
    margin-bottom:22px!important;
    font-size:13px!important;
  }
  .modal .form-grid{grid-template-columns:1fr!important;gap:13px!important}
  .modal .field--wide,.modal .form-consent{grid-column:auto!important}
  .modal .field input,
  .modal .field textarea,
  .modal .field select{
    min-height:50px;
    border-radius:14px!important;
  }
}

@media(prefers-reduced-motion:reduce){
  .modal,.modal-panel,.modal-close{transition:none!important}
}
