/* V5.4.5 — fixes only: kinetic word, translations, solution design, and modal behavior. */

/* 1) Kinetic word: allocate generous line box so accented/descender glyphs are never clipped. */
.hero h1{overflow:visible!important;padding-bottom:.08em!important}
.rotating-slot{
  display:block!important;
  width:max-content!important;
  max-width:100%!important;
  min-height:1.34em!important;
  line-height:1.18!important;
  overflow:visible!important;
  padding:.02em .40em .28em .015em!important;
}
.rotating-word{
  display:inline-block!important;
  min-width:0!important;
  width:auto!important;
  max-width:none!important;
  line-height:1.10!important;
  white-space:nowrap!important;
  overflow:visible!important;
  padding:0 .12em .18em 0!important;
  transform-origin:left center;
  transition:opacity .52s cubic-bezier(.22,.8,.25,1),transform .52s cubic-bezier(.22,.8,.25,1),filter .52s ease!important;
}
.rotating-word.word-out{
  transform:translateY(-8px) scale(.995)!important;
  filter:blur(1px)!important;
}
@media(max-width:680px){
  .rotating-slot{width:100%!important;min-height:1.38em!important;padding-bottom:.32em!important}
  .rotating-word{white-space:normal!important;line-height:1.08!important;font-size:.90em!important}
}

/* 2) Solutions — replace the old card wall with a modern editorial solution list. */
.solutions{background:linear-gradient(180deg,var(--soft) 0%,var(--soft2) 100%)}
.solutions-head{max-width:780px!important;margin-bottom:44px!important}
.solutions-grid{
  display:grid!important;
  grid-template-columns:1fr!important;
  gap:0!important;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
  background:transparent!important;
}
.solution-card,
.solution-card:nth-child(1),
.solution-card:nth-child(2),
.solution-card:nth-child(n+3){
  flex:none!important;
  width:100%!important;
  min-height:0!important;
  display:grid!important;
  grid-template-columns:92px 58px minmax(220px,.78fr) minmax(300px,1.18fr) auto!important;
  align-items:center!important;
  gap:24px!important;
  padding:30px 20px!important;
  border:0!important;
  border-bottom:1px solid var(--line)!important;
  border-radius:0!important;
  background:transparent!important;
  overflow:visible!important;
  box-shadow:none!important;
  text-align:left;
  transition:none!important;
}
.solution-card:last-child{border-bottom:0!important}
.solution-card:before,.solution-card:after{display:none!important}
.solution-card:hover,
.solution-card:focus-within{
  transform:none!important;
  background:transparent!important;
  padding:30px 20px!important;
  border-color:var(--line)!important;
  box-shadow:none!important;
}
.solution-card:hover h3,.solution-card:focus-within h3{color:var(--text)!important}
.solution-card:hover p,.solution-card:focus-within p{color:var(--muted)!important}
.solution-card:hover .solution-number,.solution-card:focus-within .solution-number{color:var(--pink)!important;opacity:.96!important}
.solution-card:hover .solution-icon,.solution-card:focus-within .solution-icon{transform:none!important;background:var(--surface)!important}
.solution-number{
  font-size:48px;
  line-height:1;
  letter-spacing:-.055em;
  font-weight:820;
  color:var(--pink);
  opacity:.96;
}
.solution-icon{
  width:52px!important;height:52px!important;border-radius:16px!important;
  background:var(--surface)!important;
  box-shadow:0 8px 28px rgba(34,18,71,.08);
}
.solution-card h3{
  margin:0!important;
  min-height:0!important;
  font-size:24px!important;
  line-height:1.12!important;
  letter-spacing:-.035em!important;
}
.solution-card p{
  margin:0!important;
  font-size:14px!important;
  line-height:1.62!important;
  max-width:620px!important;
  color:var(--muted)!important;
}
.solution-card .more{
  margin:0!important;
  padding:10px 0 10px 12px;
  font-size:13px!important;
  font-weight:780!important;
  color:var(--pink)!important;
  white-space:nowrap;
}
.solution-card .more:hover{text-decoration:underline}
@media(max-width:980px){
  .solution-card,.solution-card:nth-child(n){
    grid-template-columns:74px 50px 1fr auto!important;
    gap:18px!important;
  }
  .solution-card p{grid-column:3/5;margin-top:-6px!important}
  .solution-number{font-size:40px}
}
@media(max-width:680px){
  .solutions-head{margin-bottom:28px!important}
  .solution-card,.solution-card:nth-child(n){
    grid-template-columns:62px 48px 1fr!important;
    gap:14px!important;
    padding:24px 4px!important;
  }
  .solution-card:hover,.solution-card:focus-within{padding:24px 4px!important}
  .solution-number{font-size:34px}
  .solution-card h3{font-size:20px!important}
  .solution-card p{grid-column:1/-1!important;margin-top:4px!important}
  .solution-card .more{grid-column:1/-1!important;padding-left:0}
}

/* 3) Modals — a single scrolling layer, no nested clipping. */
body.modal-open{overflow:hidden}
.modal{
  align-items:flex-start!important;
  justify-content:center!important;
  overflow-y:auto!important;
  overscroll-behavior:contain;
  padding:24px!important;
}
.modal.open{display:flex!important}
.modal-panel{
  width:min(1120px,100%)!important;
  max-height:none!important;
  overflow:visible!important;
  margin:auto!important;
  border-radius:30px!important;
}
.modal-close{
  position:sticky!important;
  float:none!important;
  top:14px!important;
  right:auto!important;
  margin:14px 14px -56px auto!important;
  display:grid!important;
  place-items:center!important;
  z-index:20!important;
  box-shadow:0 8px 28px rgba(0,0,0,.12);
}
.solution-detail{
  min-height:0!important;
  grid-template-columns:minmax(300px,.78fr) minmax(0,1.22fr)!important;
  align-items:stretch!important;
}
.solution-visual{
  min-height:620px!important;
  padding:52px 44px!important;
  border-radius:30px 0 0 30px;
}
.solution-visual h3{font-size:42px!important;line-height:1.02!important;max-width:390px}
.solution-detail-copy{padding:64px 56px 48px!important}
.detail-section:first-child{padding-top:0}
.detail-section:last-of-type{border-bottom:0}
@media(max-width:820px){
  .modal{padding:12px!important}
  .solution-detail{grid-template-columns:1fr!important}
  .solution-visual{min-height:320px!important;border-radius:26px 26px 0 0;padding:42px 30px!important}
  .solution-detail-copy{padding:42px 28px 36px!important}
}

/* Governance modal uses the same safe scrolling strategy. */
.governance-panel{
  width:min(920px,100%)!important;
  max-height:none!important;
  overflow:visible!important;
  margin:auto!important;
  padding:0!important;
  border-radius:30px!important;
}
.governance-panel .modal-close{margin:14px 14px -56px auto!important}
.governance-modal-top{padding:56px 58px 10px!important}
.governance-modal-body{padding:0 58px 16px!important;margin-top:18px!important}
.governance-policy-block{padding:22px 24px!important}
.governance-sac-form{margin:18px 58px 52px!important;padding-top:26px!important}
@media(max-width:680px){
  .governance-modal-top{padding:48px 24px 8px!important}
  .governance-modal-body{padding:0 24px 12px!important}
  .governance-sac-form{margin:16px 24px 34px!important}
}
