/* Editable feature layouts matching the Scheduling design reference. */
.mie-feature-block {
  --feature-cyan: var(--mie-cyan, #00D9FF);
  --feature-ink: var(--mie-ink, #17304d);
  --feature-red: var(--mie-red, #cf2030);
  box-sizing: border-box;
  min-width: 0;
  position: relative;
}
.feature-page { overflow: clip; }
.mie-feature-block h1 { font-size: clamp(36px, 3.8vw, 70px); }
.mie-feature-block h2 { font-size: clamp(30px, 3.25vw, 58px); }
.mie-feature-block h3 { font-size: clamp(24px, 2.5vw, 44px); }
.mie-feature-block p { margin-block: 0 1.5em; }
.mie-feature-block img { display: block; max-width: 100%; height: auto; }
.mie-feature-block .mie-feature-copy { min-width: 0; position: relative; z-index: 1; }
.mie-feature-block .mie-feature-richtext { line-height: 1.5; }
.mie-feature-block .mie-feature-richtext > :last-child { margin-bottom: 0; }
.mie-feature-block .mie-feature-richtext li { margin-block: 1em; }
.mie-feature-block .mie-feature-richtext > ul { padding-left: 1.5em; }
.mie-feature-block .mie-feature-richtext > ul > li::marker { color: var(--feature-cyan); }
.mie-feature-block.feature-section { margin-block: clamp(80px, 10vw, 190px); }
.mie-feature-block.mie-feature-hero { padding-block: clamp(75px, 8vw, 145px) 0; text-align: center; }
.mie-feature-hero .mie-feature-copy { max-width: 1500px; margin-inline: auto; }
.mie-feature-hero .mie-feature-richtext { max-width: 1000px; margin-inline: auto; font-size: clamp(18px, 1.7vw, 30px); line-height: 1.3; }
.mie-feature-hero .mie-feature-richtext p { max-width: none; font-size: inherit; }
.mie-feature-hero .mie-feature-media { max-width: 1000px; margin: 60px auto 0; }
.mie-feature-block .feature-eyebrow { color: var(--feature-cyan); text-transform: uppercase; letter-spacing: .18em; font-size: 14px; font-weight: 700; }
.mie-feature-actions { display: flex; flex-wrap: wrap; gap: 18px; margin-top: 32px; }
.mie-feature-hero .mie-feature-actions { justify-content: center; }
.mie-feature-block .mie-feature-button-solid { background: var(--feature-red); color: #fff; border-color: var(--feature-red); }
.mie-feature-hero .mie-feature-button-solid::after { content:''; display:inline-block; flex:none; width:32px; height:13px; margin-left:22px; background:currentColor; -webkit-mask:url('../images/arrow-long.svg') center / contain no-repeat; mask:url('../images/arrow-long.svg') center / contain no-repeat; }
.mie-feature-nav { display: flex; flex-wrap: wrap; gap: 12px 24px; align-items: center; font-size: clamp(14px, 1.15vw, 20px); font-weight: 600; }
.mie-feature-nav a { text-decoration: none; padding-block: 10px; border-bottom: 3px solid transparent; color: #aab8c9; white-space: nowrap; }
.mie-feature-nav a:hover { color: inherit; }
.mie-feature-nav a.is-active, .mie-feature-nav a[aria-current] { color: inherit; border-bottom-color: var(--feature-red); }
.mie-feature-top-nav { justify-content: center; margin: clamp(90px, 10vw, 180px) auto 0; }
.mie-menu-row { justify-content: center; margin-block: clamp(40px, 6vw, 100px); }
.mie-menu-row-label { font-weight: 400; white-space: nowrap; flex-shrink: 0; }
.mie-menu-row a:focus-visible { outline: 2px solid currentColor; outline-offset: 4px; }
.feature-page > .mie-feature-hero + .mie-feature-content { margin-top: 30px; }
.feature-page > .mie-feature-hero:not(:has(.mie-feature-top-nav)) + .mie-feature-content { margin-top: clamp(80px, 10vw, 180px); }
/* Text/media sections own their shell, including inside Gutenberg Groups. */
:is(.site-content, .editor-styles-wrapper) .mie-feature-content {
  width: calc(100% - var(--mie-gutter, 32px) * 2);
  max-width: 1760px;
  margin-inline: auto;
}
.mie-feature-content, .mie-feature-cta { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(36px, 7vw, 125px); align-items: center; }
.mie-feature-content:not(:has(.mie-feature-media)), .mie-feature-cta:not(:has(.mie-feature-meeting)) { grid-template-columns: 1fr; }
.mie-feature-content > *, .mie-feature-cta > * { min-width: 0; }
.mie-feature-media { position: relative; z-index: 1; }
.mie-feature-image-left .mie-feature-media { order: -1; }
.mie-feature-media img { width: 100%; object-fit: contain; }
.mie-feature-media-oversized .mie-feature-media { align-self: end; margin-bottom: clamp(-155px, -8vw, -50px); }
.mie-feature-media-oversized .mie-feature-media img { width: 148%; max-width: none; }
.mie-feature-image-left.mie-feature-media-oversized .mie-feature-media img { transform: translateX(-30%); }
.mie-feature-media-tilted .mie-feature-media { transform: rotate(-6deg); }
.mie-feature-content.mie-feature-media-oversized .mie-feature-media { margin-bottom: 0; align-self: center; }
.mie-feature-connected { isolation: isolate; min-height: clamp(500px, 40vw, 750px); }
.mie-feature-checklist .mie-feature-richtext > ul { list-style: none; padding: 0; }
.mie-feature-checklist .mie-feature-richtext > ul > li { position: relative; padding-left: 2em; }
.mie-feature-checklist .mie-feature-richtext > ul > li::before { content: ''; display: block; position: absolute; left: 0; top: .15em; width: 1.15em; height: 1.15em; color: var(--feature-cyan); font-size: max(14px, .9em); background-color: currentColor; -webkit-mask: url('../images/checkbox.svg') center / contain no-repeat; mask: url('../images/checkbox.svg') center / contain no-repeat; }
.mie-feature-checklist.feature-card .mie-feature-richtext > ul > li::before { color: var(--feature-ink); }
.mie-feature-checklist .mie-feature-richtext { font-weight: 600; font-size: clamp(16px, 1.2vw, 21px); }
.mie-feature-checklist .mie-feature-richtext ul ul { padding-left: 1.2em; list-style: disc; }
/* Keep each hero marker beside its own text, including wrapped mobile lines. */
.mie-feature-hero .mie-feature-richtext > :is(ul, ol) { padding-inline: 1.5em; }
.mie-feature-hero .mie-feature-richtext > :is(ul, ol) > li {
  box-sizing: border-box;
  width: fit-content;
  max-width: 100%;
  margin-inline: auto;
  text-align: left;
  overflow-wrap: anywhere;
}
.mie-feature-hero.mie-feature-checklist .mie-feature-richtext > ul { padding-inline: 0; }
/* The icon option changes markers, not the hero's text size or weight. */
.mie-feature-hero.mie-feature-checklist .mie-feature-richtext { font-size: clamp(18px, 1.7vw, 30px); font-weight: inherit; }
.mie-feature-cta.feature-section { margin-block: clamp(120px, 16vw, 300px); }
.mie-feature-accent-title { display: block; white-space: pre-line; color: var(--feature-cyan); font-family: 'aptos', Arial, sans-serif; font-size: 1.25em; line-height: 1.02; margin-bottom: .1em; }
.mie-feature-cta .mie-feature-richtext { max-width: 560px; margin-block: 50px 32px; }
.mie-feature-cta .feature-expert img { flex-shrink: 0; }
.mie-feature-meeting { border: clamp(7px, .8vw, 15px) solid var(--feature-red); border-radius: clamp(24px, 2.6vw, 48px); background: #fff; overflow: hidden; color: var(--feature-ink); min-width: 0; }
.mie-feature-meeting iframe { display: block; width: 100%; height: 680px; border: 0; background: #fff; }
.mie-feature-meeting-fallback { display: block; padding: 12px 16px; font-size: 14px; text-align: center; }
.mie-feature-meeting-preview { min-height: 600px; display: grid; place-items: center; padding: 40px; text-align: center; background: linear-gradient(90deg, #cf2030 45%, #fff 45%); }
.mie-feature-meeting-preview p { padding: 24px; background: #fff; border-radius: 12px; }
.feature-page > .mie-feature-resource { max-width: 1760px; width: calc(100% - var(--mie-gutter) * 2); }
.mie-feature-resource { display: flex; justify-content: flex-end; align-items: center; min-height: clamp(580px, 46vw, 850px); padding: clamp(35px, 5vw, 85px); isolation: isolate; border-radius: clamp(24px, 2.6vw, 48px); background: #e9eef0; color: var(--feature-ink); }
.mie-feature-resource.feature-section { margin-top: clamp(66.67px, 6.667vw, 123.33px); margin-bottom: 0; }
.mie-feature-resource-background { position: absolute; inset: 0; width: 100%; height: 100% !important; object-fit: cover; border-radius: inherit; z-index: -1; }
.mie-feature-resource .mie-feature-copy { width: 51%; padding: clamp(32px, 4vw, 70px); border-radius: 26px; background: #fff; }
.mie-feature-resource-cover .mie-feature-copy { padding-top: clamp(220px, 17vw, 330px); }
.mie-feature-resource .mie-feature-resource-book { position: absolute; width: clamp(240px, 20vw, 370px); height: clamp(280px, 24vw, 440px); object-fit: contain; object-position: left center; top: clamp(-130px, -7vw, -80px); left: clamp(32px, 4vw, 70px); }
.mie-feature-resource h2 { font-size: clamp(28px, 2.4vw, 44px); }
.mie-feature-resource .mie-feature-richtext { font-size: clamp(16px, 1.1vw, 20px); margin-bottom: 20px; }
.mie-feature-resource:not(.mie-feature-resource-photo) .mie-feature-copy { width: min(100%, 900px); margin-inline: auto; }
.mie-feature-related.feature-section { background: #fff; color: var(--feature-ink); padding: 100px 0 50px; margin-block: 0; }
.mie-feature-related > .mie-feature-copy, .mie-feature-related > .mie-feature-nav { width: calc(100% - var(--mie-gutter) * 2); max-width: 1760px; margin-inline: auto; }
.mie-feature-related > .mie-feature-copy { margin-bottom: 30px; }
.mie-feature-related > .mie-feature-copy h2 { max-width: 940px; white-space: pre-line; }
.mie-feature-carousel-nav { margin-bottom: 40px; }
.mie-feature-carousel-nav a { color: #65758a; }
.mie-feature-carousel { display: flex; gap: clamp(24px, 3vw, 56px); overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory; width: calc(100% - clamp(16px, 2vw, 40px)); margin-left: clamp(16px, 2vw, 40px); padding-block: 4px 24px; scrollbar-width: none; }
.mie-feature-carousel::after { content: ''; flex: 0 0 clamp(16px, 2vw, 40px); }
.mie-feature-carousel { cursor: grab; }
.mie-feature-carousel::-webkit-scrollbar { display: none; }
.mie-feature-carousel.swiper-initialized { display: block; overflow: hidden; scroll-snap-type: none; touch-action: pan-y; }
.mie-feature-carousel.swiper-initialized::after { display: none; }
.mie-feature-carousel .swiper-wrapper { align-items: stretch; }
.mie-feature-carousel.swiper-initialized .swiper-slide { flex: 0 0 auto; width: 80%; scroll-snap-align: none; }
.mie-feature-related-card.feature-card { flex: 0 0 80%; scroll-snap-align: start; display: grid; grid-template-columns: .85fr 1.15fr; gap: 35px; align-items: center; min-width: 0; min-height: clamp(520px, 48vw, 870px); height: auto; padding: clamp(35px, 5vw, 90px) 0 clamp(35px, 5vw, 90px) clamp(35px, 5vw, 90px); overflow: hidden; background: #f2eeeb; }
.mie-feature-related-card:last-child { margin-right: 20%; }
.mie-feature-card-copy { min-width: 0; }
.mie-feature-card-copy p { font-size: clamp(16px, 1.1vw, 20px); }
.mie-feature-related-card .mie-feature-card-image { width: 150%; max-width: none; }
.mie-feature-related-card:not(:has(.mie-feature-card-image)) { grid-template-columns: 1fr; padding-right: clamp(35px, 5vw, 90px); }
.mie-feature-related-card .mie-feature-related-icon { width: 40px; height: 40px; object-fit: contain; margin-bottom: 20px; }
.mie-feature-related.mie-feature-related-dark { background: transparent; color: #fff; }
.mie-feature-related-dark .mie-feature-related-card { background: var(--mie-deep-navy, #051323); color: #fff; }
.mie-feature-related-dark :is(h2, h3, .mie-button-outline) { color: #fff; }
.mie-feature-related-dark .mie-feature-carousel-nav a { color: #aab8c9; }
.mie-feature-related-dark .mie-feature-carousel-nav a:is(:hover, [aria-current]) { color: #fff; }
.mie-feature-related-dark a:focus-visible { outline: 2px solid #fff; outline-offset: 4px; }
.mie-feature-placeholder { padding: 24px; border: 1px dashed currentColor; }
.mie-feature-block a:focus-visible, .mie-feature-block summary:focus-visible, .mie-feature-carousel:focus-visible { outline: 3px solid var(--feature-cyan); outline-offset: 5px; }
@media (max-width: 1100px) {
  .mie-feature-meeting iframe { height: 720px; }
  .mie-feature-related-card.feature-card { min-height: 580px; }
  .mie-feature-resource .mie-feature-copy { width: 58%; }
}
@media (max-width: 781px) {
  .mie-feature-block.feature-section { margin-block: 80px; }
  .mie-feature-block.mie-feature-hero { padding-top: 65px; }
  .mie-feature-nav { flex-wrap: nowrap; overflow-x: auto; justify-content: flex-start; gap: 20px; }
  .mie-feature-top-nav { margin-top: 70px; }
  .mie-menu-row { justify-content: flex-start; }
  .mie-feature-content, .mie-feature-cta { grid-template-columns: 1fr; gap: 36px; min-height: 0; }
  .mie-feature-image-left .mie-feature-media { order: initial; }
  .mie-feature-media { max-width: 580px; margin-inline: auto; }
  .mie-feature-media-tilted .mie-feature-media { transform: none; }
  .mie-feature-media-oversized .mie-feature-media { margin-bottom: -45px; }
  .mie-feature-media-oversized .mie-feature-media img { width: 115%; }
  .mie-feature-image-left.mie-feature-media-oversized .mie-feature-media img { transform: none; }
  .mie-feature-accent-title { font-size: 1.16em; }
  .mie-feature-cta .mie-feature-richtext { margin-top: 28px; }
  .mie-feature-cta .feature-expert img { width: 95px; height: 95px; }
  .mie-feature-cta .feature-expert strong { font-size: 24px; }
  .mie-feature-meeting iframe { height: 740px; }
  .mie-feature-meeting-preview { min-height: 480px; }
  .mie-feature-resource.feature-section { margin-top: 63.33px; margin-bottom: 0; }
  .mie-feature-resource { min-height: 0; padding: 220px 18px 18px; }
  .mie-feature-resource .mie-feature-copy { width: 100%; padding: 28px 24px; }
  .mie-feature-resource-cover .mie-feature-copy { padding-top: 170px; }
  .mie-feature-resource .mie-feature-resource-book { width: 230px; height: 260px; top: -90px; left: 24px; }
  .mie-feature-resource-background { object-position: 30% center; }
  .mie-feature-related.feature-section { margin-block: 0; padding-top: 90px; }
  .mie-feature-carousel.swiper-initialized .swiper-slide { width: 90%; }
  .mie-feature-related-card.feature-card { flex-basis: 90%; min-height: 0; grid-template-columns: 1fr; gap: 25px; padding: 32px 24px 0; }
  .mie-feature-related-card .mie-feature-card-image { width: 115%; max-height: 460px; object-fit: contain; margin-bottom: -35px; }
  .mie-feature-related-card:last-child { margin-right: 10%; }
  .mie-feature-related-card:not(:has(.mie-feature-card-image)) { padding: 32px 24px; }
}
/* Keep oversized assets from determining the grid row's height. */
@media (min-width: 782px) {
  .mie-feature-related-card .mie-feature-card-image { height: clamp(480px, 44vw, 830px); object-fit: contain; object-position: left center; }
}
@media (min-width: 1101px) {
}

.mie-feature-connected { position:relative; }
.mie-feature-connected > .mie-text-media-flow { position:absolute; inset:auto 0 calc(-1 * clamp(80px, 10vw, 190px)); width:100%; height:auto; aspect-ratio:2; z-index:-1; fill:none; stroke:var(--mie-cyan,#00D9FF); stroke-width:1; opacity:1; pointer-events:none; }
.mie-text-media-flow :is(path,circle) { vector-effect:non-scaling-stroke; }
.mie-feature-image-left > .mie-text-media-flow { transform:scaleX(-1); }
@media(max-width:781px) { .mie-feature-connected > .mie-text-media-flow { opacity:.4; } }

/* Temporarily hide the optional icons in related feature panels. */
.mie-feature-related-card .mie-feature-related-icon { display:none; }

/* A section-wide homepage connector already owns the rhythm. */
:has(> .home-product-line) .mie-text-media-flow { display:none; }

/* Optional images retained when converting a Default Hero. */
.mie-feature-hero > img.mie-feature-hero-background { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: .3; pointer-events: none; }
.mie-feature-hero .mie-feature-hero-content-image { display: block; width: auto; max-width: 100%; max-height: 320px; object-fit: contain; margin: 24px auto 0; }

/* Use the same short-viewport spacing rule as native Columns and Groups. */
@media (max-height:900px) {
 :is(.site-content, .editor-styles-wrapper) .mie-feature-content.feature-section { margin-block:clamp(40px,5vw,95px); }
 .mie-feature-content.mie-feature-connected { min-height:clamp(250px,20vw,375px); }
 .feature-page > .mie-feature-hero + .mie-feature-content { margin-top:15px; }
 .feature-page > .mie-feature-hero:not(:has(.mie-feature-top-nav)) + .mie-feature-content { margin-top:clamp(40px,5vw,90px); }
}

/* Panel navigation follows the section theme and stays outside the clipped track. */
.mie-feature-related { --panel-control-ink:var(--feature-ink, #17304d); --panel-control-bg:#fff; --panel-control-active:var(--mie-red, #cf2030); --panel-dot:#65758a; }
.mie-feature-related-dark { --panel-control-ink:#fff; --panel-control-bg:#17304d; --panel-control-active:var(--mie-cyan, #00d9ff); --panel-dot:#aab8c9; }
.mie-feature-carousel-stage { position:relative; }
.mie-feature-carousel-arrow { position:absolute; z-index:2; top:calc(50% - 10px); transform:translateY(-50%); display:grid; place-items:center; width:52px; height:52px; padding:12px; border:0; border-radius:50%; background:var(--panel-control-bg); color:var(--panel-control-ink); box-shadow:0 4px 20px #0002; cursor:pointer; opacity:0; pointer-events:none; transition:opacity 180ms, color 180ms; }
.mie-feature-carousel-prev { left:clamp(8px, 1vw, 20px); }
.mie-feature-carousel-next { right:clamp(8px, 1vw, 20px); }
.mie-feature-carousel-arrow svg { width:24px; height:24px; fill:none; stroke:currentColor; stroke-width:2.5; stroke-linecap:round; stroke-linejoin:round; }
.mie-feature-carousel-stage:is(:hover, :focus-within) .mie-feature-carousel-arrow { opacity:1; pointer-events:auto; }
.mie-feature-carousel-arrow:hover:not(:disabled) { color:var(--panel-control-active); }
.mie-feature-carousel-stage:is(:hover, :focus-within) .mie-feature-carousel-arrow:disabled { opacity:.35; cursor:default; }
.mie-feature-carousel-pagination { display:flex; flex-wrap:wrap; justify-content:center; gap:0; width:calc(100% - var(--mie-gutter, 32px) * 2); max-width:1760px; margin:0 auto; }
.mie-feature-carousel-bullet { display:grid; place-items:center; flex:0 0 44px; width:44px; height:44px; padding:0; border:0; border-radius:50%; background:transparent; color:var(--panel-dot); cursor:pointer; transition:color 180ms; }
.mie-feature-carousel-bullet::before { content:''; width:10px; height:10px; border-radius:50%; background:currentColor; }
.mie-feature-carousel-bullet[aria-current] { color:var(--panel-control-active); }
.mie-feature-carousel-bullet:hover { color:var(--panel-control-ink); }
.mie-feature-related :is(.mie-feature-carousel-arrow, .mie-feature-carousel-bullet):focus-visible { outline:3px solid var(--panel-control-active); outline-offset:3px; }
.mie-feature-related :is(.mie-feature-carousel-arrow, .mie-feature-carousel-pagination)[hidden] { display:none; }
@media (hover:none) { .mie-feature-carousel-stage .mie-feature-carousel-arrow { opacity:1; pointer-events:auto; } .mie-feature-carousel-stage .mie-feature-carousel-arrow:disabled { opacity:.35; } }
@media (prefers-reduced-motion:reduce) { .mie-feature-carousel-arrow, .mie-feature-carousel-bullet { transition:none; } }