/* =========================================================
   V8.12 — Menu-only Services + disciplined numberless grids
   Final visual pass for E-00 / E02 / E03 references
   ========================================================= */

/* Services is a pure menu trigger: balanced two-column mega menu. */
@media (min-width:921px){
  .site-header .nav-mega-menu > .nav-dropdown-menu{
    width:520px!important;
    max-width:calc(100vw - 32px)!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    column-gap:4px!important;
    row-gap:3px!important;
    padding:10px!important;
    justify-items:stretch!important;
  }
  .site-header .main-nav .nav-mega-menu > .nav-dropdown-menu > a{
    width:100%!important;
    min-width:0!important;
    min-height:44px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    padding:8px 10px!important;
    text-align:center!important;
    white-space:nowrap!important;
    line-height:1.55!important;
  }
}
@media (min-width:921px) and (max-width:1080px){
  .site-header .nav-mega-menu > .nav-dropdown-menu{width:500px!important}
  .site-header .main-nav .nav-mega-menu > .nav-dropdown-menu > a{font-size:11.6px!important;padding-inline:7px!important}
}

/* No visual ordinals anywhere. CMS-bound legacy fields remain technical only. */
.v811-number-marker,.v812-legacy-number,.p810-index,.p810-mini-index,.svc804-num{display:none!important}

/* Replace numbered consultation steps with restrained line icons. */
.v808-unified-main .detail-process-step > .v812-process-icon{
  width:34px;height:34px;display:grid;place-items:center;margin:0 0 11px!important;
  border:1px solid rgba(120,159,218,.22);border-radius:10px;
  background:rgba(67,108,168,.07);color:#79a7e8;
}
.v808-unified-main .detail-process-step > .v812-process-icon svg{
  width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.55;stroke-linecap:round;stroke-linejoin:round;
}

/* E02: service matrices — symmetric cells and safe distance from the vertical divider. */
main.service-clean-v804 .svc804-items-grid,
main.service-clean-v804 .svc804-items-strip,
main.service-clean-v804 .svc804-items-steps{
  gap:0!important;
  border-top:1px solid var(--svc-line)!important;
  border-bottom:1px solid var(--svc-line)!important;
}
main.service-clean-v804 .svc804-items-grid .svc804-item,
main.service-clean-v804 .svc804-items-strip .svc804-item,
main.service-clean-v804 .svc804-items-steps .svc804-item{
  box-sizing:border-box!important;
  display:grid!important;
  grid-template-columns:36px minmax(0,1fr)!important;
  grid-template-rows:auto auto!important;
  column-gap:14px!important;
  row-gap:2px!important;
  align-content:start!important;
  min-width:0!important;
  min-height:128px!important;
  padding:20px 28px!important;
  background:transparent!important;
}
main.service-clean-v804 .svc804-items-grid .svc804-item-icon,
main.service-clean-v804 .svc804-items-strip .svc804-item-icon,
main.service-clean-v804 .svc804-items-steps .svc804-item-icon{
  grid-row:1/3!important;
  width:34px!important;height:34px!important;
  margin:2px 0 0!important;
  justify-self:start!important;
}
main.service-clean-v804 .svc804-items-grid .svc804-item h3,
main.service-clean-v804 .svc804-items-strip .svc804-item h3,
main.service-clean-v804 .svc804-items-steps .svc804-item h3{
  grid-column:2!important;margin:0 0 5px!important;align-self:start!important;
}
main.service-clean-v804 .svc804-items-grid .svc804-item p,
main.service-clean-v804 .svc804-items-strip .svc804-item p,
main.service-clean-v804 .svc804-items-steps .svc804-item p{
  grid-column:2!important;margin:0!important;max-width:none!important;align-self:start!important;
}

/* E03: product content as an actual equal-column matrix, not loose cards. */
body.v810-product-page .p810-principles,
body.v810-product-page .p810-flow-grid{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:0!important;
  margin-top:18px!important;
  border-top:1px solid var(--p810-line)!important;
  border-bottom:1px solid var(--p810-line)!important;
  border-inline-start:0!important;
}
body.v810-product-page .p810-principles article,
body.v810-product-page .p810-flow-grid article{
  box-sizing:border-box!important;
  display:grid!important;
  grid-template-columns:36px minmax(0,1fr)!important;
  grid-template-rows:auto auto!important;
  column-gap:14px!important;
  row-gap:2px!important;
  align-content:start!important;
  min-width:0!important;
  min-height:136px!important;
  padding:20px 26px!important;
  border-bottom:0!important;
  border-inline-end:1px solid var(--p810-line)!important;
  background:transparent!important;
}
html[dir="rtl"] body.v810-product-page .p810-principles article:last-child,
html[dir="rtl"] body.v810-product-page .p810-flow-grid article:last-child,
html[dir="ltr"] body.v810-product-page .p810-principles article:last-child,
html[dir="ltr"] body.v810-product-page .p810-flow-grid article:last-child{border-inline-end:0!important}
body.v810-product-page .p811-feature-icon{
  grid-row:1/3!important;
  width:34px!important;height:34px!important;
  margin:2px 0 0!important;
  justify-self:start!important;
  border-radius:10px!important;
}
body.v810-product-page .p810-principles h3,
body.v810-product-page .p810-flow-grid h3{
  grid-column:2!important;min-height:0!important;margin:0 0 5px!important;align-self:start!important;
}
body.v810-product-page .p810-principles p,
body.v810-product-page .p810-flow-grid p{
  grid-column:2!important;max-width:none!important;margin:0!important;align-self:start!important;
}
/* A small typographic cue replaces section numbers. */
body.v810-product-page .p810-section h2::before{
  content:"";display:inline-block;width:18px;height:2px;margin-inline-end:9px;
  border-radius:99px;background:#78a6e8;vertical-align:middle;opacity:.9;
}
body.v810-product-page .p810-faq h2::before,
body.v810-product-page .p810-cta h2::before{display:none}

@media(max-width:900px){
  body.v810-product-page .p810-principles,
  body.v810-product-page .p810-flow-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  body.v810-product-page .p810-principles article:nth-child(2n),
  body.v810-product-page .p810-flow-grid article:nth-child(2n){border-inline-end:0!important}
  main.service-clean-v804 .svc804-items-grid .svc804-item,
  main.service-clean-v804 .svc804-items-strip .svc804-item,
  main.service-clean-v804 .svc804-items-steps .svc804-item{padding-inline:22px!important}
}
@media(max-width:560px){
  body.v810-product-page .p810-principles,
  body.v810-product-page .p810-flow-grid{grid-template-columns:1fr!important}
  body.v810-product-page .p810-principles article,
  body.v810-product-page .p810-flow-grid article{border-inline-end:0!important;min-height:0!important;padding:17px 2px!important}
  main.service-clean-v804 .svc804-items-grid .svc804-item,
  main.service-clean-v804 .svc804-items-strip .svc804-item,
  main.service-clean-v804 .svc804-items-steps .svc804-item{min-height:0!important;padding:17px 2px!important}
}

/* Specificity guard against the approved V8.07 alignment layer. */
main.detail-page-main.service-clean-v804 .svc804-items.svc804-items-grid .svc804-item,
main.detail-page-main.service-clean-v804 .svc804-items.svc804-items-strip .svc804-item,
main.detail-page-main.service-clean-v804 .svc804-items.svc804-items-steps .svc804-item{
  grid-template-columns:36px minmax(0,1fr)!important;
  grid-template-rows:auto auto!important;
  column-gap:14px!important;
  row-gap:2px!important;
  min-height:128px!important;
  padding:20px 30px!important;
}
main.detail-page-main.service-clean-v804 .svc804-items .svc804-item > .svc804-item-icon{
  grid-row:1/3!important;
  width:34px!important;height:34px!important;
  margin:2px 0 0!important;
}
main.detail-page-main.service-clean-v804 .svc804-items .svc804-item > h3{grid-column:2!important;margin:0 0 5px!important}
main.detail-page-main.service-clean-v804 .svc804-items .svc804-item > p{grid-column:2!important;margin:0!important;max-width:none!important}
@media(max-width:900px){
  main.detail-page-main.service-clean-v804 .svc804-items.svc804-items-grid .svc804-item,
  main.detail-page-main.service-clean-v804 .svc804-items.svc804-items-strip .svc804-item,
  main.detail-page-main.service-clean-v804 .svc804-items.svc804-items-steps .svc804-item{padding-inline:22px!important}
}
@media(max-width:560px){
  main.detail-page-main.service-clean-v804 .svc804-items.svc804-items-grid .svc804-item,
  main.detail-page-main.service-clean-v804 .svc804-items.svc804-items-strip .svc804-item,
  main.detail-page-main.service-clean-v804 .svc804-items.svc804-items-steps .svc804-item{min-height:0!important;padding:17px 2px!important}
}
/* =========================================================
   V8.12.2 — targeted frame alignment fixes
   - Ecommerce: remove legacy vertical offset that breaks the matrix frame.
   - Custom system: remove legacy outer inline frame and restore internal dividers.
   ========================================================= */

/* Ecommerce — the second benefit cell must sit on the same top/bottom axis as its siblings. */
main.detail-page-main.service-clean-v804.svc804-commerce
  .svc804-benefits .svc804-items-strip .svc804-item:nth-child(2){
  transform:none!important;
}

/* Custom system — no L-shaped/outer side frame; only internal column dividers. */
main.detail-page-main.service-clean-v804.svc804-system
  .svc804-process .svc804-items.svc804-items-steps{
  border-inline-start:0!important;
  border-inline-end:0!important;
  border-top:1px solid var(--svc-line)!important;
  border-bottom:1px solid var(--svc-line)!important;
}
main.detail-page-main.service-clean-v804.svc804-system
  .svc804-process .svc804-items.svc804-items-steps .svc804-item{
  border-inline-start:0!important;
  border-inline-end:1px solid var(--svc-line)!important;
}
main.detail-page-main.service-clean-v804.svc804-system
  .svc804-process .svc804-items.svc804-items-steps .svc804-item:last-child{
  border-inline-end:0!important;
}

@media(max-width:900px){
  main.detail-page-main.service-clean-v804.svc804-system
    .svc804-process .svc804-items.svc804-items-steps .svc804-item{
    border-inline-end:0!important;
  }
  main.detail-page-main.service-clean-v804.svc804-system
    .svc804-process .svc804-items.svc804-items-steps .svc804-item:nth-child(odd){
    border-inline-end:1px solid var(--svc-line)!important;
  }
}
@media(max-width:560px){
  main.detail-page-main.service-clean-v804.svc804-system
    .svc804-process .svc804-items.svc804-items-steps .svc804-item{
    border-inline-end:0!important;
  }
}

