/* Lens uses the final 2026-10-14 Main/Vision component hierarchy.
   Native DOM replaces DCLogic templates; source content remains unchanged. */
:root{--section-gap:clamp(160px,18vw,260px);--content-gutter:clamp(36px,5.6vw,80px)}
.wrap,.footer-inner{width:min(1046px,calc(100% - var(--content-gutter)))}
main h1,main h2,main h3{font-weight:400;letter-spacing:-.02em;color:#323232}
main h2{font-size:clamp(26px,2.6vw,32px);line-height:1.5}
main h3{font-size:clamp(17px,1.7vw,20px);line-height:1.55}
main p{color:#323232;line-height:1.85}.section-heading p{font-size:clamp(14px,1.4vw,16px)}
.section{padding-block:0;margin-top:var(--section-gap)}#definition{margin-top:clamp(64px,7vw,104px)}
.section-heading{margin-bottom:40px}.section-heading>h2{margin-bottom:12px}.section-heading p+p{margin-top:4px}
.site-footer{margin-top:clamp(140px,16vw,220px)}
.cover{background:#fff;min-height:calc(clamp(520px,42vw,620px) + 106px + clamp(16px,2vw,28px));padding-top:144px;padding-bottom:56px}
.cover h1{font-size:clamp(28px,3vw,38px);line-height:1.45}.cover .eyebrow{font-size:17px;font-weight:700;line-height:1;color:#0fdfdd}
.cover-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center;gap:40px}.cover-description p{font-size:17px;line-height:1.8}.hero-image{height:340px}.breadcrumb{margin-bottom:40px}
.split h3{font-size:clamp(17px,1.7vw,20px);line-height:1.55;margin-bottom:18px}.split p{font-size:clamp(15px,1.4vw,17px);line-height:1.85}.split p+p{margin-top:18px}.definition h3{font-size:clamp(16px,1.6vw,19px);font-weight:500}.definition p{font-weight:400}.definition h2{margin-bottom:14px}
.cards{gap:24px}.card h3{font-size:clamp(17px,1.7vw,20px);line-height:1.55;font-weight:400}.card p{font-size:14px;line-height:1.75}.card .step{display:inline-grid;place-items:center;min-width:28px;height:28px;padding:0 6px;margin:0 0 10px;background:#fff;font-size:13px;font-weight:600;color:#111110}
/* Same ordered-step treatment as Vision's process cards. */
#principle .cards{gap:16px}#principle .card{min-height:0;padding:clamp(24px,2.4vw,32px);position:relative}#principle .card-image{height:150px;margin-bottom:24px}#principle .card h3{margin-bottom:8px}#principle .card:last-child{background:#0fdfdd}#principle .card:last-child p{color:#0b4544}
/* Same surgical-option card construction: heading and 28px navigation square. */
.products{align-items:stretch}.products .card{padding:28px;position:relative;display:flex;flex-direction:column}.products h3{margin-bottom:14px}.products p{font-size:14px;line-height:1.75}.products .card-image{height:185px;margin-bottom:24px}.product-link h3{padding-right:40px;position:relative}.product-link h3::after{content:'→';position:absolute;right:0;top:0;width:28px;height:28px;display:grid;place-items:center;border:1px solid #111110;font-size:14px;font-weight:400}
/* Semantic comparison rows; transparent cells and caption + two cells on mobile. */
.comparison-table{position:relative}.comparison-row{display:grid;grid-template-columns:150px repeat(2,minmax(0,1fr));column-gap:24px}.comparison-row>*{padding:18px 28px;font-size:clamp(13px,1.3vw,15px);line-height:1.7;font-weight:400;color:#323232;word-break:keep-all;overflow-wrap:anywhere}.comparison-row>:first-child{padding:18px 0;font-size:13px;color:#6f6e69;align-self:center}.comparison-row>:not(:first-child){background:transparent;box-shadow:inset 0 -1px 0 #e5e5e5}.comparison-head>:not(:first-child){padding-top:24px;padding-bottom:14px;font-size:clamp(15px,1.5vw,18px);font-weight:500}.comparison-row:last-child>:not(:first-child){box-shadow:none;padding-bottom:28px}
/* Vision criteria: compact illustration, centred title and helper text, no decorative card. */
.criteria{gap:8px}.criteria .card{min-height:0;padding:28px 22px;text-align:center;display:flex;flex-direction:column;align-items:center;background:transparent}.criteria .card-image{width:56px;height:56px;margin:0 0 20px;object-fit:contain}.criteria .step{display:none}.criteria .card h3{margin:0 0 6px;font-size:clamp(17px,1.7vw,20px)}.criteria .card p{font-size:13px;line-height:1.7;color:#6f6e69}.subheading{margin-top:clamp(56px,7vw,88px)}.subheading .section-heading{text-align:center;margin-bottom:clamp(40px,5vw,64px)}
/* Vision two-column system cards, white label, square plus and collapsible supporting content. */
#planning>.wrap{max-width:960px}#planning>.wrap>.section-heading{text-align:center;margin-bottom:clamp(40px,5vw,64px)}
.system-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;align-items:start}.system-card{padding:clamp(28px,3.2vw,44px) clamp(24px,3vw,40px);background:#f5f5f5;min-width:0}.system-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px}.system-label{display:inline-block;background:white;padding:6px 10px;font-size:13px;font-weight:500;line-height:1.15}.system-card h3{font-size:clamp(20px,2vw,26px);font-weight:500;line-height:1.45;letter-spacing:-.03em;min-height:2.9em}.square-toggle,.square-more{display:grid;place-items:center;flex:none;width:28px;height:28px;padding:0;border:1px solid #111110;background:transparent;color:#111110}.plus-bars{position:relative;display:block;width:11px;height:11px;transition:transform .4s cubic-bezier(.2,.8,.2,1)}.plus-bars::before,.plus-bars::after{content:'';position:absolute;left:50%;top:50%;width:11px;height:1.5px;background:currentColor;transform:translate(-50%,-50%)}.plus-bars::after{transform:translate(-50%,-50%) rotate(90deg)}.square-toggle[aria-expanded=true] .plus-bars{transform:rotate(45deg)}.system-fold,.faq-fold{display:grid;grid-template-rows:0fr;transition:grid-template-rows .4s cubic-bezier(.2,.8,.2,1)}.system-fold>div,.faq-fold>div{overflow:hidden;min-height:0}.system-fold.is-open,.faq-fold.is-open{grid-template-rows:1fr}.system-body{padding-top:14px}.system-body p{font-size:15px;line-height:1.85}.system-body p+p{margin-top:14px}.system-image{width:100%;height:auto;max-height:230px;object-fit:contain;margin:20px 0}.system-image:first-child{margin-top:4px}.system-body .flow{grid-template-columns:1fr;gap:12px;margin-top:24px}.flow .card{background:#fff;padding:16px;display:grid;grid-template-columns:28px 1fr;gap:8px 12px}.flow .card .step{grid-row:1/3;background:#f5f5f5;margin:0}.flow .card h3{font-size:17px;min-height:0;margin:0}.flow .card p{grid-column:2;margin:0;font-size:14px}
/* Vision FAQ: Q/A badges, one open answer, and an explicit list expansion. */
.faqs{display:block;position:relative}.faqs.is-collapsed{max-height:430px;overflow:hidden}.faqs.is-collapsed::after{content:'';position:absolute;left:0;right:0;bottom:0;height:160px;background:linear-gradient(180deg,#ffffff00,#ffffffd9 55%,#fff);pointer-events:none}.faq-item{background:#f5f5f5;margin-bottom:16px;overflow:hidden}.faq-question{width:100%;display:grid;grid-template-columns:28px minmax(0,1fr) 16px;align-items:center;gap:16px;text-align:left;padding:26px 32px;background:transparent}.faq-question>span:nth-child(2){font-size:clamp(17px,1.7vw,20px);line-height:1.55;letter-spacing:-.02em;text-wrap:pretty}.q,.faq-answer>b{width:28px;height:28px;display:grid;place-items:center;background:white;font-size:15px;line-height:1;font-weight:600;color:#111110}.faq-question .chevron{margin:0;transition:transform .25s}.faq-question[aria-expanded=true] .chevron{transform:rotate(180deg)}.faq-answer{display:grid;grid-template-columns:28px minmax(0,1fr);gap:16px;padding:0 32px 30px}.faq-answer>b{color:#0fdfdd;margin-top:1px}.faq-answer p{font-size:15px;line-height:1.93}.faq-more-wrap{text-align:center;margin-top:28px}.faq-more{display:inline-flex;align-items:center;gap:10px;height:46px;padding:0 22px 0 24px;border:1px solid #111110;background:#fff;color:#111110;font-size:14px;font-weight:600;letter-spacing:-.01em}.faq-more i{width:9px;height:9px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg) translate(-2px,-2px)}.faq-more[aria-expanded=true] i{transform:rotate(225deg) translate(-2px,-2px)}
/* Vision related-story carousel, bounded to content width. */
.carousel-heading{display:flex;align-items:flex-end;justify-content:space-between;flex-wrap:wrap;gap:16px 28px;margin-bottom:40px}.carousel-heading .section-heading{margin:0}.carousel-heading .section-heading h2{margin:0}.carousel-tools{display:flex;align-items:center;gap:24px}.more-link{display:inline-flex;align-items:center;gap:10px;font-size:14px;white-space:nowrap;padding:0}.carousel-arrows{display:flex;gap:6px}.carousel-arrows button{width:40px;height:40px;border:1px solid #111110;background:transparent;display:grid;place-items:center;padding:0}.carousel-arrows i{width:8px;height:8px;border-top:1.5px solid currentColor;border-right:1.5px solid currentColor;transform:translateX(-1.5px) rotate(45deg)}.carousel-arrows [data-carousel=previous] i{transform:translateX(1.5px) rotate(-135deg)}.related-track{display:flex;gap:clamp(16px,2.6vw,32px);overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;scrollbar-width:none;overscroll-behavior-x:contain;width:100%}.related-card{display:block;flex:0 0 calc((100% - 2 * clamp(16px,2.6vw,32px)) / 3);padding:0;min-width:0;scroll-snap-align:start;text-align:left;align-self:start}.related-image{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;background:#f0efec}.related-card h3{margin:20px 0 0;min-height:3em;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:clamp(15px,1.6vw,20px);line-height:1.5;font-weight:400}.medical-review{font-size:13px;color:#6f6e69}
.button{height:56px;min-height:56px;padding:0 32px;font-size:16px;font-weight:500}.button.secondary{height:52px;min-height:52px;font-weight:400;background:#f0f0ee}.booking-box{padding:clamp(28px,3.2vw,44px) clamp(24px,3vw,40px);display:block}.booking-box .button{margin-top:28px}.booking-box h2{font-size:clamp(26px,2.6vw,32px)}.consult-form{padding:30px 56px;margin-top:clamp(40px,5vw,64px);grid-template-columns:1fr auto;gap:24px;background:linear-gradient(180deg,rgba(255,255,255,.58),rgba(255,255,255,.4));box-shadow:0 18px 44px rgba(17,17,16,.14),0 2px 6px rgba(17,17,16,.06),inset 0 1px 1px rgba(255,255,255,.9),inset 0 -10px 24px rgba(255,255,255,.25);backdrop-filter:blur(18px) saturate(1.4)}.consult-form h2{font-size:26px}.fields{gap:24px;grid-template-columns:repeat(4,minmax(0,1fr))}.fields label{padding-bottom:6px;border-bottom:1px solid #c9c8c3}.fields input,.fields select{border-bottom:0;padding:0;height:42px;line-height:42px;font-size:16px;letter-spacing:-.01em}.fields select{padding-right:22px}.consult-form>.button{height:52px;min-height:52px;padding:0 30px;font-size:17px;font-weight:600;align-self:end;box-shadow:0 12px 30px #11111052,0 3px 8px #11111033}.fields input::placeholder,.fields select:invalid{color:#8a8984}
.dock{width:min(1046px,calc(100% - 24px));background:linear-gradient(180deg,rgba(255,255,255,.34),rgba(255,255,255,.18));backdrop-filter:blur(16px) saturate(1.5)}.brand{padding:11.5px 30px 11.5px 24px}.tools{gap:2px}.tools button{padding-inline:10px}.section-progress a::after{transition:transform .4s cubic-bezier(.2,.8,.2,1)}
@media(max-width:1190px){.brand{padding-inline:16px}.main-nav a{padding-inline:16px}.consult-form{grid-template-columns:1fr auto}.fields{gap:16px}.consult-form>.button{padding-inline:20px}}
@media(max-width:960px){.main-nav{display:none}.consult-form{padding:24px 20px 20px}.fields{gap:16px}.consult-form>.button{font-size:15px;padding-inline:18px}.criteria{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:799px){.wrap,.footer-inner{width:calc(100% - var(--content-gutter))}.site-header{top:16px}.dock{width:calc(100% - 20px);padding:6px}.brand{padding:0 14px 0 16px;height:44px;display:flex;align-items:center}.brand img{height:24px;width:auto}.tools button{height:44px;padding:0 14px}.tools .login{display:none}.tools .language{padding-inline:14px}.tools .menu-button{padding-right:14px}.tools{margin-left:auto}.cover{min-height:0;padding-top:116px;padding-bottom:0}.cover-grid{grid-template-columns:1fr;gap:24px}.cover h1{font-size:clamp(28px,3vw,38px)}.cover .eyebrow{font-size:17px}.cover-description p{font-size:17px}.hero-image{height:285px}.breadcrumb{margin-bottom:32px}.section-heading{margin-bottom:32px}.split{gap:24px}.split h3{font-size:clamp(17px,1.7vw,20px)}.split p{font-size:15px}.three{grid-template-columns:1fr}#principle .cards{gap:14px}#principle .card{display:grid;grid-template-columns:76px minmax(0,1fr);gap:8px 16px;padding:20px}#principle .card-image{width:76px;height:76px;grid-row:1/4;margin:0}#principle .card .step{justify-self:start;margin:0}#principle .card h3{margin:0;font-size:17px}#principle .card p{grid-column:2;font-size:14px}.products{gap:12px}.products .card{padding:24px 20px}.products .card h3{font-size:20px}.products .card-image{height:220px}.criteria{gap:8px}.criteria .card{padding:20px 16px}.criteria .card h3{font-size:17px}.criteria .card-image{width:56px;height:56px}.system-grid{grid-template-columns:1fr;gap:12px}.system-card{padding:24px 20px}.system-card h3{font-size:19px}.system-body p{font-size:14px}.faq-question{gap:12px;padding:18px 20px}.faq-question>span:nth-child(2){font-size:17px}.faq-answer{gap:12px;padding:0 20px 22px}.faq-answer p{font-size:15px}.carousel-heading{margin-bottom:32px}.carousel-tools{width:100%;justify-content:flex-end}.carousel-arrows{display:none!important}.related-track{gap:12px;padding-bottom:4px}.related-card{flex-basis:calc((100% - 12px) / 1.2)}.related-card h3{font-size:17px}.booking-box{padding:24px 20px}.booking-box .button{width:100%;margin-top:24px}.booking-box h2{font-size:26px}.consult-form{grid-template-columns:1fr;padding:24px 20px 20px;gap:24px}.consult-form h2{font-size:26px}.fields{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}.fields input,.fields select{font-size:16px}.consult-form>.button{width:100%;height:52px;font-size:17px}.preparation-links{gap:16px}.footer-inner{width:calc(100% - var(--content-gutter))}}
@media(max-width:360px){.brand{padding-left:12px;padding-right:10px}.tools button{padding-inline:10px}.fields{gap:20px 16px}.fields input,.fields select{font-size:14px}.consult-form{padding-inline:18px}}
@media(prefers-reduced-motion:reduce){.system-fold,.faq-fold,.plus-bars,.section-progress a::after{transition:none}.related-track{scroll-behavior:auto}}

/* Desktop select mirrors Vision; mobile retains the native OS picker. */
.fields .select-field img{display:none}.select-field::after{content:'';position:absolute;right:6px;top:15px;width:9px;height:9px;border-right:1.5px solid #111110;border-bottom:1.5px solid #111110;transform:rotate(45deg);pointer-events:none}
.bv-sel-btn{display:none;width:100%;height:42px;padding:0 28px 0 0;background:transparent;border:0;text-align:left;font-size:16px;line-height:42px;letter-spacing:-.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#8a8984}.bv-sel-btn.has-value{color:#111110}.bv-sel-panel{position:absolute;left:-18px;top:calc(100% + 6px);z-index:80;min-width:calc(100% + 36px);background:#fff;border:1px solid #e5e5e5;box-shadow:0 16px 40px #11111024,0 2px 6px #1111100f;padding:6px 0}.bv-sel-opt{display:flex;align-items:center;justify-content:space-between;gap:16px;width:100%;padding:11px 18px;font-size:15px;letter-spacing:-.01em;white-space:nowrap;text-align:left}.bv-sel-opt[aria-selected=true]::after{content:'';width:6px;height:6px;background:currentColor}.bv-sel-opt:focus-visible{outline:1px solid #111110;outline-offset:-4px}.select-field.is-open::after{transform:rotate(225deg);top:19px}.fields label.bv-err{border-color:#d9442f}.bv-err-msg{font-size:12px;color:#d9442f;position:absolute;top:100%;left:0;margin-top:5px;white-space:nowrap}.fields .bv-err input,.fields .bv-err .bv-sel-btn{color:#d9442f}
@media(min-width:800px){.select-field.is-enhanced select{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}.select-field.is-enhanced .bv-sel-btn{display:block}}
.fields>.select-field{border-bottom:1px solid #c9c8c3;position:relative;min-width:0;padding-bottom:6px}
.fields>.select-field.bv-err{border-color:#d9442f}.fields:has(.bv-err){row-gap:38px}.fields .bv-err{margin-bottom:14px}
.fields label{position:relative}.select-field select{background:none}.bv-sel-opt{background:transparent;color:#111110}.bv-sel-btn{font-family:inherit}.bv-err-msg{line-height:1.4}
@media(max-width:799px){.bv-sel-btn,.bv-sel-panel{display:none}}

/* Equal process cards, each with a complete independent 3:2 illustration. */
#principle .cards{align-items:stretch;grid-auto-rows:1fr}
#principle .card{height:100%;display:flex;flex-direction:column;align-items:flex-start}
#principle .principle-visual{position:relative;overflow:hidden;aspect-ratio:3/2;width:100%;margin:0 auto 24px;background:#fff;flex:none}
#principle .principle-visual .card-image{display:block;width:100%;height:100%;margin:0;object-fit:contain}


#principle .card h3{min-height:1.55em}
.products .card{height:100%}.products .card-image{object-fit:contain}
@media(max-width:799px){
 #principle .card{display:grid;grid-template-columns:96px minmax(0,1fr);grid-template-rows:auto auto 1fr;column-gap:16px}
 #principle .principle-visual{grid-row:1/4;width:96px;align-self:center;margin:0}
 #principle .card .step{justify-self:start}
 #principle .card h3{min-height:0}
}
/* Approved audit implementation, 2026-10-17. */
.product-visual{display:flex;align-items:center;justify-content:center;aspect-ratio:3/2;width:100%;overflow:hidden;background:#f7f8fa;margin-bottom:24px}
.products .product-visual .card-image{width:100%;height:100%;margin:0;object-fit:contain}
.products .product-kpl .card-image{width:100%;height:100%}
.products .product-echo .card-image{width:100%;height:100%}
.products .card>p:first-of-type{min-height:3.5em}
.products .card>h3{min-height:1.55em}
.image-caption,.clinical-figure figcaption{margin:16px 0 0;font-size:13px;line-height:1.7;color:#6f6e69;font-weight:400}
.clinical-figure{margin:0;min-width:0}.clinical-figure .split-image{width:100%;height:auto;object-fit:contain}
.image-source-link{display:inline-flex;align-items:center;gap:8px;margin-top:8px;font-size:13px;color:#323232;text-decoration:underline;text-underline-offset:4px}
.criteria .criterion-icon{width:56px;height:56px;flex:none}
#principle .principle-visual.placement{aspect-ratio:3/2}






.square-toggle .plus-bars{transition:transform .45s cubic-bezier(.2,.8,.2,1)}
.faq-question .chevron{transition:transform .25s cubic-bezier(.16,1,.3,1)}
@media(max-width:799px){
 #principle .card{display:flex;flex-direction:column;align-items:flex-start;padding:24px 20px;gap:0}
 #principle .principle-visual{width:100%;max-width:440px;aspect-ratio:3/2;align-self:center;margin:0 0 24px}
 #principle .card .step{margin-bottom:12px}#principle .card h3{margin-bottom:8px}
 #principle .card p{margin:0}#principle .cards{gap:24px}
 .products .card>p:first-of-type{min-height:0}
 
 
 
}

@media(prefers-reduced-motion:reduce){.faq-question .chevron,.square-toggle .plus-bars,.section-progress a::after,.reveal{transition:none!important;animation:none!important}.reveal{opacity:1!important;transform:none!important}html{scroll-behavior:auto}}

/* Keep each card's absolutely positioned screen-reader label inside its scrollport
   before the track's reveal animation creates a temporary containing block. */
.related-card{position:relative}

/* Shared comparison breakpoint; other page components retain 799px. */
@media(max-width:720px){.comparison-row{grid-template-columns:repeat(2,minmax(0,1fr));gap:0 20px;padding:16px 0 18px;border-bottom:1px solid #e5e5e5}.comparison-row>:first-child{grid-column:1/-1;padding:0 0 8px;font-size:12px;color:#8a8984}.comparison-row>:not(:first-child){background:transparent;box-shadow:none;padding:0;font-size:15px;line-height:1.6;color:#111110}.comparison-head{padding:0 0 12px}.comparison-head>:first-child{display:none}.comparison-head>:not(:first-child){font-size:17px;padding:0}.comparison-row:last-child{border:0}.comparison-row:last-child>:not(:first-child){padding:0}}
