{"id":11,"date":"2026-09-08T08:23:14","date_gmt":"2026-09-08T08:23:14","guid":{"rendered":"https:\/\/laminasmile.com\/?page_id=11"},"modified":"2026-09-14T19:34:45","modified_gmt":"2026-09-14T19:34:45","slug":"homepage","status":"publish","type":"page","link":"https:\/\/laminasmile.com\/fr\/","title":{"rendered":"Homepage"},"content":{"rendered":"\t\t
\n\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t\r\n\r\n\r\n \r\n \r\n \r\n Lamina Clinic \u2014 Section 1 Hero v7<\/title>\r\n <meta name=\"description\" content=\"Premium split hero for Lamina Clinic Hair Restoration and Dental Aesthetics.\" \/>\r\n\r\n <link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\r\n <link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin>\r\n <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Cormorant+Garamond:ital,wght@0,400;0,500;1,400;1,500&family=Manrope:wght@400;500;600&display=swap\" rel=\"stylesheet\">\r\n\r\n <style>\r\n :root{\r\n --aubergine:#2B142F;\r\n --plum:#5F2468;\r\n --orchid:#94709A;\r\n --lilac:#C5B2C8;\r\n --ivory:#F7F2EA;\r\n --champagne:#D8C4A1;\r\n --ink:#171317;\r\n --stone:#E8E1E4;\r\n --ease-lux:cubic-bezier(.16,.70,.18,1);\r\n --ease-soft:cubic-bezier(.22,.61,.36,1);\r\n --side-pad:clamp(26px,5vw,92px);\r\n }\r\n\r\n *{box-sizing:border-box}\r\n html{background:var(--aubergine);scroll-behavior:auto}\r\n body{\r\n margin:0;\r\n background:var(--ivory);\r\n color:var(--ivory);\r\n font-family:\"Manrope\",system-ui,-apple-system,BlinkMacSystemFont,\"Segoe UI\",sans-serif;\r\n -webkit-font-smoothing:antialiased;\r\n text-rendering:optimizeLegibility;\r\n overflow-x:hidden;\r\n }\r\n a{color:inherit;text-decoration:none}\r\n img{display:block;max-width:100%}\r\n\r\n .hero{\r\n position:relative;\r\n min-height:100svh;\r\n overflow:hidden;\r\n isolation:isolate;\r\n background:var(--aubergine);\r\n }\r\n\r\n \/* restrained ambience: very slow, almost imperceptible *\/\r\n .hero-ambient{\r\n position:absolute;\r\n inset:-12%;\r\n z-index:1;\r\n pointer-events:none;\r\n opacity:.42;\r\n background:\r\n radial-gradient(38% 32% at 50% 16%, rgba(247,242,234,.12), transparent 68%),\r\n radial-gradient(32% 28% at 49% 80%, rgba(197,178,200,.09), transparent 72%);\r\n transform:translate3d(0,0,0) scale(1.02);\r\n animation:ambient 18s ease-in-out infinite alternate;\r\n }\r\n @keyframes ambient{\r\n to{transform:translate3d(1.1%,-.8%,0) scale(1.045)}\r\n }\r\n\r\n .hero-header{\r\n position:absolute;\r\n z-index:40;\r\n inset:0 0 auto 0;\r\n min-height:84px;\r\n padding:22px clamp(22px,4vw,72px);\r\n display:grid;\r\n grid-template-columns:1fr auto 1fr;\r\n align-items:center;\r\n gap:16px;\r\n }\r\n .header-left,.header-right{\r\n font-size:11px;\r\n line-height:1;\r\n letter-spacing:.16em;\r\n text-transform:uppercase;\r\n color:rgba(247,242,234,.76);\r\n }\r\n .header-left{justify-self:start}\r\n .header-right{justify-self:end;display:flex;align-items:center;gap:22px}\r\n .header-link{position:relative;padding:8px 0}\r\n .header-link::after{\r\n content:\"\";\r\n position:absolute;\r\n left:0;right:100%;bottom:2px;height:1px;\r\n background:var(--champagne);\r\n transition:right 1.05s var(--ease-lux);\r\n }\r\n .header-link:hover::after,.header-link:focus-visible::after{right:0}\r\n\r\n .brand{grid-column:2;display:flex;align-items:center;justify-content:center;min-width:190px}\r\n .brand img{width:min(180px,28vw);height:auto;object-fit:contain;filter:drop-shadow(0 8px 22px rgba(23,19,23,.12))}\r\n .brand-fallback{display:flex;align-items:center;gap:10px;letter-spacing:.23em;text-transform:uppercase;font-size:12px;font-weight:600}\r\n .brand-fallback__mark{\r\n width:36px;aspect-ratio:1;border:1px solid rgba(216,196,161,.58);border-radius:50%;\r\n display:grid;place-items:center;font-family:\"Cormorant Garamond\",serif;font-size:22px;font-style:italic;\r\n color:var(--champagne);background:rgba(247,242,234,.05)\r\n }\r\n\r\n \/* IMPORTANT: panels stay geometrically fixed 50\/50. No hover-boundary movement = no shake. *\/\r\n .split{position:absolute;inset:0;z-index:5;display:grid;grid-template-columns:1fr 1fr}\r\n .panel{position:relative;min-width:0;overflow:hidden;isolation:isolate;outline:none;cursor:pointer}\r\n .panel:focus-visible{box-shadow:inset 0 0 0 2px rgba(216,196,161,.72)}\r\n\r\n \/* original palette restored *\/\r\n .panel-bg{position:absolute;inset:0;z-index:-10}\r\n .panel--dental .panel-bg{\r\n background:\r\n radial-gradient(80% 70% at 24% 34%, rgba(247,242,234,.24), transparent 55%),\r\n radial-gradient(48% 55% at 68% 38%, rgba(197,178,200,.22), transparent 62%),\r\n linear-gradient(145deg,#7a497d 0%,#5f2468 46%,#2b142f 100%);\r\n }\r\n .panel--hair .panel-bg{\r\n background:\r\n radial-gradient(70% 65% at 72% 24%, rgba(148,112,154,.18), transparent 56%),\r\n linear-gradient(150deg,#432047 0%,#2b142f 56%,#171317 100%);\r\n }\r\n\r\n .panel-shade{\r\n position:absolute;inset:0;z-index:-5;pointer-events:none;\r\n transition:opacity 1.45s var(--ease-lux), background 1.45s var(--ease-lux), filter 1.45s var(--ease-lux)\r\n }\r\n .panel--dental .panel-shade{\r\n background:\r\n linear-gradient(90deg, rgba(43,20,47,.20) 0%, rgba(43,20,47,.08) 50%, rgba(43,20,47,.34) 100%),\r\n linear-gradient(0deg, rgba(23,19,23,.38), transparent 56%);\r\n }\r\n .panel--hair .panel-shade{\r\n background:\r\n linear-gradient(270deg, rgba(23,19,23,.20) 0%, rgba(43,20,47,.08) 50%, rgba(23,19,23,.42) 100%),\r\n linear-gradient(0deg, rgba(23,19,23,.44), transparent 56%);\r\n }\r\n\r\n .figure-wrap{position:absolute;inset:0;z-index:-7;pointer-events:none;overflow:hidden}\r\n .figure{\r\n position:absolute;\r\n bottom:0;\r\n width:min(72%,620px);\r\n max-height:91%;\r\n height:auto;\r\n object-fit:contain;\r\n object-position:bottom center;\r\n transform:translate3d(0,0,0) scale(1);\r\n transform-origin:50% 100%;\r\n filter:blur(0px) drop-shadow(0 22px 45px rgba(23,19,23,.26));\r\n opacity:1;\r\n transition:transform 1.65s var(--ease-lux), filter 1.55s var(--ease-lux), opacity 1.4s var(--ease-lux);\r\n will-change:transform,filter;\r\n }\r\n .panel--dental .figure{left:-2%; width:min(80%,700px); max-height:92%}\r\n .panel--hair .figure{right:1%; width:min(66%,560px); max-height:89%}\r\n\r\n \/* soft optical bloom behind subjects *\/\r\n .subject-bloom{\r\n position:absolute;\r\n z-index:-8;\r\n width:58%;\r\n aspect-ratio:1;\r\n bottom:8%;\r\n border-radius:50%;\r\n filter:blur(46px);\r\n opacity:.24;\r\n transition:opacity 1.7s var(--ease-lux), transform 1.8s var(--ease-lux);\r\n pointer-events:none;\r\n }\r\n .panel--dental .subject-bloom{left:2%;background:radial-gradient(circle,rgba(247,242,234,.52),rgba(197,178,200,.18) 45%,transparent 72%)}\r\n .panel--hair .subject-bloom{right:2%;background:radial-gradient(circle,rgba(216,196,161,.22),rgba(148,112,154,.16) 44%,transparent 72%)}\r\n\r\n \/* restrained metallic sheen:\r\n dim, slow and silky \u2014 no bright white flash *\/\r\n .water-sheen{\r\n position:absolute;\r\n z-index:-4;\r\n inset:-24%;\r\n pointer-events:none;\r\n opacity:0;\r\n filter:blur(28px);\r\n transform:translate3d(-34%,10%,0) rotate(-11deg) scale(.88);\r\n background:\r\n linear-gradient(\r\n 108deg,\r\n transparent 0%,\r\n transparent 36%,\r\n rgba(216,196,161,.035) 43%,\r\n rgba(197,178,200,.075) 48%,\r\n rgba(247,242,234,.095) 50%,\r\n rgba(197,178,200,.065) 53%,\r\n rgba(95,36,104,.035) 58%,\r\n transparent 66%,\r\n transparent 100%\r\n );\r\n mix-blend-mode:soft-light;\r\n will-change:transform,opacity;\r\n }\r\n\r\n .panel:hover .water-sheen,\r\n .panel:focus-visible .water-sheen{\r\n animation:metalSheenHover 3.35s cubic-bezier(.22,.61,.36,1) both;\r\n }\r\n\r\n @keyframes metalSheenHover{\r\n 0%{\r\n opacity:0;\r\n transform:translate3d(-34%,10%,0) rotate(-11deg) scale(.88);\r\n }\r\n 18%{\r\n opacity:.035;\r\n }\r\n 42%{\r\n opacity:.16;\r\n }\r\n 68%{\r\n opacity:.11;\r\n }\r\n 88%{\r\n opacity:.035;\r\n }\r\n 100%{\r\n opacity:0;\r\n transform:translate3d(34%,-5%,0) rotate(-4deg) scale(1.08);\r\n }\r\n }\r\n\r\n .panel-lines{position:absolute;pointer-events:none;z-index:-3;opacity:.24;filter:blur(1px);transition:opacity 1.6s var(--ease-lux),filter 1.6s var(--ease-lux)}\r\n .panel--dental .panel-lines{right:-7%;top:16%;width:min(36vw,420px)}\r\n .panel--hair .panel-lines{left:-10%;bottom:12%;width:min(34vw,400px);transform:rotate(180deg)}\r\n .panel-lines svg{width:100%;height:auto;display:block}\r\n .panel-lines path{fill:none;stroke:rgba(247,242,234,.22);stroke-width:1.05;vector-effect:non-scaling-stroke}\r\n\r\n \/* ALL copy is visible by default. Nothing waits for remote images or JS. *\/\r\n .panel-content{\r\n position:absolute;\r\n inset:auto 0 clamp(54px,8vh,102px) 0;\r\n z-index:12;\r\n padding-inline:var(--side-pad);\r\n opacity:1;\r\n filter:blur(0);\r\n transform:translate3d(0,0,0);\r\n transition:transform 1.35s var(--ease-lux),filter 1.35s var(--ease-lux),opacity 1.35s var(--ease-lux);\r\n animation:textSettle 1.85s .18s var(--ease-lux) both;\r\n }\r\n @keyframes textSettle{\r\n 0%{opacity:.05;filter:blur(10px);transform:translate3d(0,16px,0)}\r\n 100%{opacity:1;filter:blur(0);transform:translate3d(0,0,0)}\r\n }\r\n .panel--dental .panel-content{left:auto; right:clamp(34px,4.5vw,76px); width:min(42%,360px); padding-inline:0; text-align:left}\r\n .panel--hair .panel-content{left:clamp(34px,4.5vw,76px); right:auto; width:min(40%,360px); padding-inline:0; text-align:left; display:flex; flex-direction:column; align-items:flex-start}\r\n\r\n .eyebrow{display:flex;align-items:center;gap:12px;margin-bottom:16px;color:rgba(247,242,234,.76);letter-spacing:.22em;text-transform:uppercase;font-size:10px;font-weight:600}\r\n .eyebrow::before{content:\"\";width:34px;height:1px;background:rgba(216,196,161,.72);flex:0 0 auto}\r\n .panel--hair .eyebrow{flex-direction:row}\r\n\r\n .headline{margin:0;max-width:7.8ch;font-family:\"Cormorant Garamond\",Georgia,serif;font-size:clamp(58px,6.4vw,112px);line-height:.82;font-weight:400;letter-spacing:-.045em;text-wrap:balance;color:var(--ivory);text-shadow:0 4px 20px rgba(23,19,23,.16)}\r\n .headline em{font-style:italic;font-weight:400;color:var(--champagne)}\r\n .sub{max-width:40ch;margin:24px 0 0;color:rgba(247,242,234,.84);line-height:1.7;font-size:clamp(12px,1vw,15px);text-shadow:0 2px 14px rgba(23,19,23,.14)}\r\n\r\n .treatment-list{\r\n display:flex;flex-wrap:wrap;gap:8px 16px;margin-top:25px;\r\n color:rgba(247,242,234,.86);font-size:9px;line-height:1;letter-spacing:.17em;text-transform:uppercase;\r\n opacity:.88;filter:blur(0);transform:translateY(0);\r\n transition:opacity 1.3s var(--ease-lux),filter 1.3s var(--ease-lux)\r\n }\r\n .panel--hair .treatment-list{justify-content:flex-start}\r\n\r\n .enter-link{margin-top:30px;width:max-content;display:inline-flex;align-items:center;gap:14px;color:var(--ivory);text-transform:uppercase;letter-spacing:.18em;font-size:10px;font-weight:600;text-shadow:0 2px 10px rgba(23,19,23,.12)}\r\n .enter-link__disc{\r\n width:42px;height:42px;border-radius:50%;border:1px solid rgba(216,196,161,.48);display:grid;place-items:center;\r\n background:rgba(247,242,234,.04);transition:background 1.25s var(--ease-lux),color 1.25s var(--ease-lux),border-color 1.25s var(--ease-lux)\r\n }\r\n\r\n \/* Stable hover: selected side becomes clearer, other side recedes. No panel resizing. *\/\r\n .split:hover .panel:not(:hover) .figure{filter:blur(1.6px) drop-shadow(0 18px 36px rgba(23,19,23,.18));opacity:.84}\r\n .split:hover .panel:not(:hover) .panel-shade{opacity:1;background:rgba(43,20,47,.28);filter:none}\r\n .split:hover .panel:not(:hover) .panel-content{opacity:.86;filter:blur(.4px)}\r\n .split:hover .panel:not(:hover) .headline{color:rgba(247,242,234,.92)}\r\n .split:hover .panel:not(:hover) .sub,.split:hover .panel:not(:hover) .treatment-list,.split:hover .panel:not(:hover) .enter-link,.split:hover .panel:not(:hover) .eyebrow{color:rgba(247,242,234,.80)}\r\n .split:hover .panel:not(:hover) .panel-lines{opacity:.14;filter:blur(2px)}\r\n\r\n .panel:hover .figure,.panel:focus-visible .figure{transform:translate3d(0,-3px,0) scale(1.014);filter:blur(0) drop-shadow(0 26px 50px rgba(23,19,23,.30))}\r\n .panel:hover .subject-bloom,.panel:focus-visible .subject-bloom{opacity:.34;transform:scale(1.055)}\r\n .panel:hover .panel-content,.panel:focus-visible .panel-content{transform:translate3d(0,-4px,0)}\r\n .panel:hover .treatment-list,.panel:focus-visible .treatment-list{opacity:1}\r\n .panel:hover .panel-lines,.panel:focus-visible .panel-lines{opacity:.34;filter:blur(0)}\r\n .panel:hover .enter-link__disc,.panel:focus-visible .enter-link__disc{background:var(--champagne);color:var(--aubergine);border-color:var(--champagne)}\r\n .panel:hover .headline,.panel:focus-visible .headline,.panel:hover .sub,.panel:focus-visible .sub,.panel:hover .treatment-list,.panel:focus-visible .treatment-list,.panel:hover .enter-link,.panel:focus-visible .enter-link,.panel:hover .eyebrow,.panel:focus-visible .eyebrow{color:var(--ivory)}\r\n .panel:hover .eyebrow,.panel:focus-visible .eyebrow{opacity:1}\r\n\r\n\r\n \/* Quiet fluid seam between the two worlds.\r\n No metallic\/golden divider: the seam is pearl\/lilac and intentionally low-contrast. *\/\r\n .curve{\r\n position:absolute;\r\n z-index:20;\r\n top:-2%;\r\n bottom:-2%;\r\n left:50%;\r\n width:42px;\r\n transform:translateX(-50%);\r\n pointer-events:none;\r\n opacity:.62;\r\n transition:opacity 1.6s var(--ease-lux), filter 1.6s var(--ease-lux);\r\n filter:drop-shadow(0 0 12px rgba(197,178,200,.08));\r\n }\r\n .curve::before{\r\n content:\"\";\r\n position:absolute;\r\n top:1%;\r\n bottom:1%;\r\n left:50%;\r\n width:18px;\r\n transform:translateX(-50%);\r\n background:linear-gradient(90deg,transparent,rgba(247,242,234,.035),rgba(197,178,200,.06),rgba(247,242,234,.025),transparent);\r\n filter:blur(7px);\r\n opacity:.58;\r\n }\r\n .curve svg{width:100%;height:100%;overflow:visible;display:block}\r\n .curve .seam-soft{fill:none;stroke:rgba(197,178,200,.20);stroke-width:2.6;vector-effect:non-scaling-stroke;filter:blur(2px)}\r\n .curve .seam-line{fill:none;stroke:rgba(247,242,234,.34);stroke-width:.72;vector-effect:non-scaling-stroke}\r\n .split:hover + .curve{opacity:.72;filter:drop-shadow(0 0 16px rgba(197,178,200,.10))}\r\n\r\n .curve-mobile{display:none}\r\n\r\n .scroll-cue{position:absolute;z-index:22;bottom:28px;left:50%;transform:translateX(-50%);font-size:9px;letter-spacing:.2em;text-transform:uppercase;color:rgba(247,242,234,.46);display:flex;align-items:center;gap:12px}\r\n .scroll-cue::before{content:\"\";display:block;width:44px;height:1px;background:rgba(247,242,234,.26)}\r\n\r\n \/* click transition: blur out + soft liquid membrane + deliberate scroll *\/\r\n .click-veil{\r\n position:absolute;z-index:32;inset:-20%;pointer-events:none;opacity:0;filter:blur(18px);\r\n transform:translate3d(-18%,14%,0) scale(.78) rotate(-8deg);\r\n background:radial-gradient(ellipse at 42% 50%,rgba(247,242,234,.90) 0 10%,rgba(197,178,200,.58) 24%,rgba(95,36,104,.46) 42%,rgba(43,20,47,.12) 63%,transparent 73%);\r\n mix-blend-mode:screen\r\n }\r\n .hero.is-transitioning .click-veil{animation:clickWater 1.95s var(--ease-lux) both}\r\n @keyframes clickWater{\r\n 0%{opacity:0;transform:translate3d(-18%,14%,0) scale(.78) rotate(-8deg)}\r\n 28%{opacity:.70}\r\n 65%{opacity:.34}\r\n 100%{opacity:0;transform:translate3d(38%,-10%,0) scale(1.55) rotate(4deg)}\r\n }\r\n .hero.is-transitioning .panel-content,.hero.is-transitioning .hero-header,.hero.is-transitioning .curve,.hero.is-transitioning .curve-mobile,.hero.is-transitioning .scroll-cue{\r\n opacity:.16;filter:blur(11px);transition:opacity .9s var(--ease-lux),filter .9s var(--ease-lux)\r\n }\r\n .hero.is-transitioning .figure{filter:blur(5px) drop-shadow(0 18px 34px rgba(23,19,23,.18));transform:scale(1.01);transition:filter 1s var(--ease-lux),transform 1s var(--ease-lux)}\r\n\r\n .load-curtain{\r\n position:absolute;z-index:80;inset:0;pointer-events:none;\r\n background:radial-gradient(75% 66% at 50% 55%,rgba(95,36,104,.84),rgba(43,20,47,.98) 70%),var(--aubergine);\r\n transform-origin:50% 0;animation:curtain 1.9s .05s var(--ease-lux) forwards\r\n }\r\n @keyframes curtain{0%{opacity:1;transform:scaleY(1)}58%{opacity:.98}100%{opacity:0;transform:scaleY(.02)}}\r\n\r\n @media (max-width:900px){\r\n .headline{font-size:clamp(48px,6.5vw,84px)}\r\n .figure{width:min(76%,530px)}\r\n }\r\n\r\n @media (max-width:800px){\r\n \/* MOBILE IS ART-DIRECTED, NOT A SHRUNK DESKTOP LAYOUT. *\/\r\n .hero{\r\n min-height:100svh;\r\n }\r\n\r\n .hero-header{\r\n min-height:68px;\r\n padding:15px 16px;\r\n grid-template-columns:1fr auto 1fr;\r\n }\r\n .header-left{display:none}\r\n .header-right{gap:10px}\r\n .header-right .header-link:first-child{display:none}\r\n .header-right{font-size:10px;letter-spacing:.14em}\r\n .brand{min-width:0}\r\n .brand img{width:min(132px,38vw)}\r\n .brand-fallback{font-size:11px}\r\n .brand-fallback__mark{width:33px;font-size:19px}\r\n\r\n \/* Keep both choices visible in the first viewport. *\/\r\n .split{\r\n grid-template-columns:1fr;\r\n grid-template-rows:1fr 1fr;\r\n }\r\n\r\n .panel{\r\n min-height:0;\r\n overflow:hidden;\r\n }\r\n\r\n \/* Mobile subjects are intentionally pushed to opposite outer edges\r\n to reserve a clean typographic column inside each half. *\/\r\n .figure{\r\n bottom:0;\r\n max-height:91%;\r\n height:auto;\r\n filter:blur(0) drop-shadow(0 14px 28px rgba(23,19,23,.22));\r\n }\r\n .panel--dental .figure{\r\n left:-13%;\r\n right:auto;\r\n width:min(72%,340px);\r\n max-height:91%;\r\n }\r\n .panel--hair .figure{\r\n right:-9%;\r\n left:auto;\r\n width:min(67%,320px);\r\n max-height:91%;\r\n }\r\n\r\n .subject-bloom{\r\n width:56%;\r\n bottom:10%;\r\n filter:blur(34px);\r\n opacity:.18;\r\n }\r\n .panel--dental .subject-bloom{left:-4%}\r\n .panel--hair .subject-bloom{right:-2%}\r\n\r\n \/* Two clean mirrored text columns. Dental = right, Hair = left. *\/\r\n .panel-content{\r\n top:50%;\r\n bottom:auto;\r\n width:47%;\r\n padding:0;\r\n transform:translateY(-44%);\r\n animation:none;\r\n transition:opacity 1.15s var(--ease-lux),filter 1.15s var(--ease-lux);\r\n }\r\n .panel--dental .panel-content{\r\n left:auto;\r\n right:16px;\r\n width:47%;\r\n text-align:left;\r\n }\r\n .panel--hair .panel-content{\r\n left:18px;\r\n right:auto;\r\n width:47%;\r\n text-align:left;\r\n align-items:flex-start;\r\n }\r\n\r\n .eyebrow{\r\n gap:8px;\r\n margin-bottom:8px;\r\n font-size:8px;\r\n line-height:1.25;\r\n letter-spacing:.16em;\r\n }\r\n .eyebrow::before{width:22px}\r\n .panel--hair .eyebrow{flex-direction:row}\r\n\r\n .headline{\r\n font-size:clamp(37px,10.2vw,48px);\r\n line-height:.80;\r\n letter-spacing:-.05em;\r\n max-width:6.1ch;\r\n text-shadow:0 3px 15px rgba(23,19,23,.18);\r\n }\r\n\r\n .sub{display:none}\r\n\r\n .treatment-list{\r\n margin-top:12px;\r\n gap:5px 9px;\r\n max-width:100%;\r\n opacity:.90;\r\n font-size:7px;\r\n line-height:1.35;\r\n letter-spacing:.12em;\r\n }\r\n .panel--hair .treatment-list{justify-content:flex-start}\r\n\r\n .enter-link{\r\n margin-top:13px;\r\n gap:8px;\r\n font-size:8px;\r\n letter-spacing:.13em;\r\n }\r\n .enter-link__disc{\r\n width:31px;\r\n height:31px;\r\n font-size:10px;\r\n }\r\n\r\n .panel-lines{\r\n opacity:.10;\r\n filter:blur(1px);\r\n }\r\n .panel--dental .panel-lines{right:-20%;top:5%;width:60vw}\r\n .panel--hair .panel-lines{left:-22%;bottom:4%;width:58vw}\r\n\r\n \/* Mobile uses its own horizontal seam instead of rotating\/compressing the desktop SVG. *\/\r\n .curve{display:none}\r\n .curve-mobile{\r\n display:block;\r\n position:absolute;\r\n z-index:20;\r\n left:-2%;\r\n top:50%;\r\n width:104%;\r\n height:54px;\r\n transform:translateY(-50%);\r\n pointer-events:none;\r\n opacity:.56;\r\n filter:drop-shadow(0 0 10px rgba(197,178,200,.07));\r\n }\r\n .curve-mobile::before{\r\n content:\"\";\r\n position:absolute;\r\n left:1.5%;\r\n right:1.5%;\r\n top:50%;\r\n height:16px;\r\n transform:translateY(-50%);\r\n background:linear-gradient(180deg,transparent,rgba(247,242,234,.03),rgba(197,178,200,.05),rgba(247,242,234,.02),transparent);\r\n filter:blur(6px);\r\n }\r\n .curve-mobile svg{width:100%;height:100%;display:block;overflow:visible}\r\n .curve-mobile .seam-soft{fill:none;stroke:rgba(197,178,200,.18);stroke-width:2.2;vector-effect:non-scaling-stroke;filter:blur(2px)}\r\n .curve-mobile .seam-line{fill:none;stroke:rgba(247,242,234,.30);stroke-width:.66;vector-effect:non-scaling-stroke}\r\n .scroll-cue{display:none}\r\n\r\n \/* Hover effects are disabled on touch-sized layouts; no accidental faded state. *\/\r\n .split:hover .panel:not(:hover) .figure{\r\n filter:blur(0) drop-shadow(0 14px 28px rgba(23,19,23,.22));\r\n opacity:1;\r\n }\r\n .split:hover .panel:not(:hover) .panel-content{opacity:1;filter:blur(0)}\r\n .split:hover .panel:not(:hover) .panel-shade{opacity:1;filter:none}\r\n .split:hover .panel:not(:hover) .headline{color:var(--ivory)}\r\n .split:hover .panel:not(:hover) .sub,\r\n .split:hover .panel:not(:hover) .treatment-list,\r\n .split:hover .panel:not(:hover) .enter-link,\r\n .split:hover .panel:not(:hover) .eyebrow{color:inherit}\r\n\r\n .panel:hover .figure,\r\n .panel:focus-visible .figure{transform:none}\r\n .panel:hover .panel-content,\r\n .panel:focus-visible .panel-content{transform:translateY(-44%)}\r\n .water-sheen{display:none}\r\n }\r\n\r\n @media (max-width:430px){\r\n .hero-header{padding:13px 12px}\r\n .brand img{width:min(118px,37vw)}\r\n\r\n .panel--dental .figure{\r\n left:-17%;\r\n width:76%;\r\n }\r\n .panel--hair .figure{\r\n right:-13%;\r\n width:71%;\r\n }\r\n\r\n .panel--dental .panel-content{right:12px;width:49%}\r\n .panel--hair .panel-content{left:14px;width:49%}\r\n\r\n .headline{\r\n font-size:clamp(34px,9.8vw,42px);\r\n max-width:6.25ch;\r\n }\r\n .eyebrow{font-size:7.5px}\r\n .treatment-list{font-size:6.7px;gap:4px 8px}\r\n .enter-link{font-size:7.6px}\r\n .enter-link__disc{width:29px;height:29px}\r\n }\r\n\r\n @media (prefers-reduced-motion:reduce){\r\n *,*::before,*::after{animation-duration:.001ms !important;animation-iteration-count:1 !important;transition-duration:.001ms !important}\r\n .water-sheen,.click-veil{display:none}.hero-ambient{animation:none}\r\n }\r\n <\/style>\r\n<\/head>\r\n<body>\r\n <section class=\"hero\" id=\"top\" aria-label=\"Lamina Clinic treatment areas\">\r\n <div class=\"hero-ambient\" aria-hidden=\"true\"><\/div>\r\n <div class=\"load-curtain\" aria-hidden=\"true\"><\/div>\r\n <div class=\"click-veil\" aria-hidden=\"true\"><\/div>\r\n\r\n <header class=\"hero-header\">\r\n <div class=\"header-left\">Istanbul \u00b7 T\u00fcrkiye<\/div>\r\n <a class=\"brand\" href=\"#top\" aria-label=\"Lamina Clinic home\">\r\n <img fetchpriority=\"high\" decoding=\"async\" src=\"assets\/lamina-logo-light.png\" width=\"420\" height=\"140\" alt=\"Lamina Clinic\" onerror=\"this.style.display='none';this.nextElementSibling.style.display='flex';\" \/>\r\n <span class=\"brand-fallback\" style=\"display:none;\"><span class=\"brand-fallback__mark\">L<\/span><span>Lamina<\/span><\/span>\r\n <\/a>\r\n <nav class=\"header-right\" aria-label=\"Primary\">\r\n <a class=\"header-link\" href=\"#consultation\">Consultation<\/a>\r\n <a class=\"header-link\" href=\"#\" lang=\"en\">EN<\/a>\r\n <\/nav>\r\n <\/header>\r\n\r\n <div class=\"split\" id=\"splitHero\">\r\n <a class=\"panel panel--dental\" href=\"#dental\" data-target=\"dental\" aria-label=\"Explore Dental Aesthetics\">\r\n <div class=\"panel-bg\"><\/div>\r\n <div class=\"panel-shade\"><\/div>\r\n <div class=\"subject-bloom\"><\/div>\r\n <div class=\"water-sheen\"><\/div>\r\n <div class=\"figure-wrap\" aria-hidden=\"true\">\r\n <img fetchpriority=\"high\" class=\"figure\"\r\n src=\"https:\/\/yellowgreen-woodcock-240696.hostingersite.com\/wp-content\/uploads\/2026\/09\/smiling-woman-posing-with-hands-near-face-2026-03-27-01-44-11-utc-scaled.webp\"\r\n width=\"1707\" height=\"2560\" alt=\"\" loading=\"eager\" decoding=\"async\" fetchpriority=\"high\" \/>\r\n <\/div>\r\n <div class=\"panel-lines\" aria-hidden=\"true\">\r\n <svg viewBox=\"0 0 520 260\"><path d=\"M8 182C84 132 122 114 185 112C258 110 290 144 356 142C416 140 463 102 514 48\"\/><path d=\"M12 208C92 160 134 142 195 141C268 140 302 172 364 171C426 169 470 132 517 82\"\/><path d=\"M18 233C103 187 144 170 207 169C280 168 319 199 381 198C440 198 482 162 520 115\"\/><\/svg>\r\n <\/div>\r\n <div class=\"panel-content\">\r\n <div class=\"eyebrow\"><span>Dental Aesthetics<\/span><\/div>\r\n <h1 class=\"headline\">A smile, <em>refined.<\/em><\/h1>\r\n <p class=\"sub\">Personalised dental aesthetics shaped around proportion, expression and natural confidence.<\/p>\r\n <div class=\"treatment-list\"><span>Veneers<\/span><span>Implants<\/span><span>Smile Design<\/span><span>Zirconium<\/span><\/div>\r\n <span class=\"enter-link\">Explore dental <span class=\"enter-link__disc\" aria-hidden=\"true\">\u2198<\/span><\/span>\r\n <\/div>\r\n <\/a>\r\n\r\n <a class=\"panel panel--hair\" href=\"#hair\" data-target=\"hair\" aria-label=\"Explore Hair Restoration\">\r\n <div class=\"panel-bg\"><\/div>\r\n <div class=\"panel-shade\"><\/div>\r\n <div class=\"subject-bloom\"><\/div>\r\n <div class=\"water-sheen\"><\/div>\r\n <div class=\"figure-wrap\" aria-hidden=\"true\">\r\n <img fetchpriority=\"high\" class=\"figure\"\r\n src=\"https:\/\/laminasmile.com\/wp-content\/uploads\/2026\/09\/smiling-man-in-a-blue-shirt-posing-2026-03-25-03-58-07-utc-scaled-e1788953885406.webp\"\r\n width=\"1707\" height=\"2560\" alt=\"\" loading=\"eager\" decoding=\"async\" fetchpriority=\"high\" \/>\r\n <\/div>\r\n <div class=\"panel-lines\" aria-hidden=\"true\">\r\n <svg viewBox=\"0 0 520 260\"><path d=\"M6 170C70 136 110 120 166 118C231 116 277 146 335 145C398 144 446 112 510 46\"\/><path d=\"M8 192C77 157 118 142 178 140C244 138 288 166 344 165C408 164 456 132 516 70\"\/><path d=\"M12 218C84 181 128 164 189 162C254 160 297 188 352 188C416 188 464 158 520 96\"\/><\/svg>\r\n <\/div>\r\n <div class=\"panel-content\">\r\n <div class=\"eyebrow\"><span>Hair Restoration<\/span><\/div>\r\n <h2 class=\"headline\">Restore <em>naturally.<\/em><\/h2>\r\n <p class=\"sub\">A considered approach to hair restoration, from medical assessment to natural-looking design.<\/p>\r\n <div class=\"treatment-list\"><span>DHI<\/span><span>Sapphire FUE<\/span><span>FUE<\/span><\/div>\r\n <span class=\"enter-link\">Explore hair <span class=\"enter-link__disc\" aria-hidden=\"true\">\u2199<\/span><\/span>\r\n <\/div>\r\n <\/a>\r\n <\/div>\r\n\r\n <div class=\"curve\" aria-hidden=\"true\">\r\n <svg viewBox=\"0 0 42 1000\" preserveAspectRatio=\"none\">\r\n <path class=\"seam-soft\" d=\"M21,-20 C15,145 28,308 20,500 C13,690 28,845 21,1020\"\/>\r\n <path class=\"seam-line\" d=\"M21,-20 C15,145 28,308 20,500 C13,690 28,845 21,1020\"\/>\r\n <\/svg>\r\n <\/div>\r\n <div class=\"curve-mobile\" aria-hidden=\"true\">\r\n <svg viewBox=\"0 0 1000 54\" preserveAspectRatio=\"none\">\r\n <path class=\"seam-soft\" d=\"M-20,28 C160,18 328,38 500,27 C676,16 838,37 1020,27\"\/>\r\n <path class=\"seam-line\" d=\"M-20,28 C160,18 328,38 500,27 C676,16 838,37 1020,27\"\/>\r\n <\/svg>\r\n <\/div>\r\n <div class=\"scroll-cue\" aria-hidden=\"true\">Choose your path<\/div>\r\n <\/section>\r\n\r\n <script>\r\n (()=>{\r\n const hero=document.querySelector('.hero');\r\n const panels=document.querySelectorAll('.panel[data-target]');\r\n const reduceMotion=window.matchMedia('(prefers-reduced-motion: reduce)');\r\n let raf=null;\r\n\r\n const ease=t=>t<.5?8*t*t*t*t:1-Math.pow(-2*t+2,4)\/2;\r\n function luxuryScrollTo(targetY,duration=1550){\r\n const startY=window.scrollY||window.pageYOffset;\r\n const delta=targetY-startY;\r\n const start=performance.now();\r\n if(raf)cancelAnimationFrame(raf);\r\n const step=now=>{\r\n const p=Math.min((now-start)\/duration,1);\r\n window.scrollTo(0,startY+delta*ease(p));\r\n if(p<1)raf=requestAnimationFrame(step);else raf=null;\r\n };\r\n raf=requestAnimationFrame(step);\r\n }\r\n\r\n panels.forEach(panel=>{\r\n panel.addEventListener('click',e=>{\r\n e.preventDefault();\r\n const target=document.getElementById(panel.dataset.target);\r\n if(!target)return;\r\n if(reduceMotion.matches){target.scrollIntoView({behavior:'auto',block:'start'});return;}\r\n hero.classList.add('is-transitioning');\r\n const y=target.getBoundingClientRect().top+window.pageYOffset;\r\n setTimeout(()=>luxuryScrollTo(y,1550),520);\r\n setTimeout(()=>hero.classList.remove('is-transitioning'),2050);\r\n });\r\n });\r\n })();\r\n <\/script>\r\n<\/body>\r\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-e908d63 e-con-full e-flex e-con e-parent\" data-id=\"e908d63\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-f1ee7b6 elementor-widget elementor-widget-html\" data-id=\"f1ee7b6\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- =========================================================\r\nLAMINA CLINIC \u2014 SECTION 02\r\nINTERNATIONAL CARE \u2014 THE CARE INDEX\r\nProduction-oriented implementation from the supplied master brief.\r\n\r\nFactual capabilities used:\r\n01 Personalised Planning\r\n02 International Patient Support\r\n03 VIP Transfer\r\n04 Partner Hotel Options\r\n05 Multilingual Support\r\n\r\nNo statistics, borrowed accreditations, hotel logos, unverified\r\nlanguages, guarantees, partner claims, or decorative photography.\r\n========================================================= -->\r\n\r\n<style>\r\n@import url('https:\/\/fonts.googleapis.com\/css2?family=Cormorant+Garamond:ital,wght@0,400;0,500&family=Manrope:wght@400;500;600&display=swap');\r\n\r\n#lamina-care-index{\r\n --lci-ivory:#F7F2EA;\r\n --lci-ivory-soft:#F2EBE8;\r\n --lci-stone:#E8E1E4;\r\n --lci-aubergine:#2B142F;\r\n --lci-plum:#5F2468;\r\n --lci-orchid:#94709A;\r\n --lci-lilac:#C5B2C8;\r\n --lci-champagne:#D8C4A1;\r\n --lci-ease:cubic-bezier(.16,.70,.18,1);\r\n\r\n position:relative;\r\n width:100%;\r\n overflow:hidden;\r\n color:var(--lci-aubergine);\r\n\r\n background:\r\n radial-gradient(\r\n 70% 54% at 94% 0%,\r\n rgba(216,196,161,.07),\r\n transparent 74%\r\n ),\r\n linear-gradient(\r\n 180deg,\r\n var(--lci-ivory) 0%,\r\n #F5EFE9 100%\r\n );\r\n\r\n font-family:\"Manrope\",system-ui,-apple-system,BlinkMacSystemFont,\"Segoe UI\",sans-serif;\r\n}\r\n\r\n#lamina-care-index *,\r\n#lamina-care-index *::before,\r\n#lamina-care-index *::after{\r\n box-sizing:border-box;\r\n}\r\n\r\n#lamina-care-index ::selection{\r\n background:var(--lci-plum);\r\n color:var(--lci-ivory);\r\n}\r\n\r\n.lci__shell{\r\n width:min(100%,1580px);\r\n margin-inline:auto;\r\n padding:\r\n clamp(68px,7.4vh,100px)\r\n clamp(20px,4.2vw,72px)\r\n clamp(70px,7.7vh,106px);\r\n}\r\n\r\n\/* =========================================================\r\n HEADER\r\n ========================================================= *\/\r\n\r\n.lci__header{\r\n display:grid;\r\n grid-template-columns:minmax(0,.60fr) minmax(290px,.40fr);\r\n gap:clamp(52px,7.8vw,128px);\r\n align-items:end;\r\n margin-block-end:clamp(50px,6.6vh,76px);\r\n}\r\n\r\n.lci__eyebrow{\r\n margin:0 0 16px;\r\n color:rgba(95,36,104,.86);\r\n font-size:clamp(11px,.72vw,13px);\r\n line-height:1.2;\r\n font-weight:600;\r\n letter-spacing:.17em;\r\n text-transform:uppercase;\r\n}\r\n\r\n.lci__title{\r\n margin:0;\r\n max-width:9.3ch;\r\n color:var(--lci-aubergine);\r\n font-family:\"Cormorant Garamond\",Georgia,serif;\r\n font-size:clamp(62px,6vw,108px);\r\n line-height:.90;\r\n font-weight:400;\r\n letter-spacing:-.048em;\r\n}\r\n\r\n.lci__title-line{\r\n display:block;\r\n}\r\n\r\n.lci__intro{\r\n margin:0 0 clamp(6px,1vh,12px);\r\n max-width:39ch;\r\n color:rgba(43,20,47,.66);\r\n font-size:clamp(16px,1.02vw,18px);\r\n line-height:1.72;\r\n}\r\n\r\n\/* =========================================================\r\n FIVE-PART CARE INDEX\r\n One continuous information canvas \u2014 not cards.\r\n ========================================================= *\/\r\n\r\n.lci__index{\r\n position:relative;\r\n display:grid;\r\n grid-template-columns:repeat(5,minmax(0,1fr));\r\n border-block:\r\n 1px solid rgba(43,20,47,.11);\r\n}\r\n\r\n\/* One shared tonal field only. Constant geometry; translate only. *\/\r\n.lci__focus-field{\r\n position:absolute;\r\n z-index:0;\r\n inset-block:14px;\r\n inset-inline-start:0;\r\n inline-size:20%;\r\n opacity:0;\r\n pointer-events:none;\r\n\r\n background:rgba(95,36,104,.045);\r\n\r\n transform:\r\n translate3d(\r\n var(--lci-focus-x,0px),\r\n 0,\r\n 0\r\n );\r\n\r\n transition:\r\n transform .76s var(--lci-ease),\r\n opacity .60s ease;\r\n}\r\n\r\n.lci__item{\r\n position:relative;\r\n z-index:1;\r\n min-width:0;\r\n padding:\r\n clamp(28px,3.1vh,40px)\r\n clamp(18px,1.7vw,28px)\r\n clamp(32px,3.8vh,47px);\r\n\r\n background:transparent;\r\n}\r\n\r\n.lci__item + .lci__item::before{\r\n content:\"\";\r\n position:absolute;\r\n inset-block:22px;\r\n inset-inline-start:0;\r\n inline-size:1px;\r\n background:rgba(43,20,47,.12);\r\n}\r\n\r\n.lci__item-inner{\r\n display:flex;\r\n min-height:clamp(232px,27vh,316px);\r\n flex-direction:column;\r\n}\r\n\r\n.lci__number{\r\n display:block;\r\n margin-block-end:clamp(32px,4vh,52px);\r\n color:rgba(95,36,104,.64);\r\n font-size:clamp(11px,.69vw,12px);\r\n line-height:1;\r\n font-weight:600;\r\n letter-spacing:.15em;\r\n transition:\r\n color .34s ease,\r\n opacity .34s ease;\r\n}\r\n\r\n.lci__item-title{\r\n margin:0;\r\n max-width:16ch;\r\n color:rgba(43,20,47,.80);\r\n font-size:clamp(15px,1.02vw,18px);\r\n line-height:1.34;\r\n font-weight:600;\r\n letter-spacing:.065em;\r\n text-transform:uppercase;\r\n transition:\r\n color .34s ease,\r\n opacity .34s ease;\r\n}\r\n\r\n.lci__description{\r\n margin:auto 0 0;\r\n padding-block-start:clamp(33px,4vh,50px);\r\n max-width:25ch;\r\n color:rgba(43,20,47,.62);\r\n font-size:clamp(14.5px,.92vw,16px);\r\n line-height:1.62;\r\n transition:\r\n color .34s ease,\r\n opacity .34s ease;\r\n}\r\n\r\n\/* Desktop fine-pointer focus treatment.\r\n Geometry never changes. No text movement. *\/\r\n@media (hover:hover) and (pointer:fine) and (min-width:1180px){\r\n\r\n .lci__index.has-focus .lci__item:not(.is-focused) .lci__number{\r\n color:rgba(95,36,104,.44);\r\n }\r\n\r\n .lci__index.has-focus .lci__item:not(.is-focused) .lci__item-title{\r\n color:rgba(43,20,47,.60);\r\n }\r\n\r\n .lci__index.has-focus .lci__item:not(.is-focused) .lci__description{\r\n color:rgba(43,20,47,.48);\r\n }\r\n\r\n .lci__item.is-focused .lci__number{\r\n color:var(--lci-plum);\r\n }\r\n\r\n .lci__item.is-focused .lci__item-title{\r\n color:var(--lci-aubergine);\r\n }\r\n\r\n .lci__item.is-focused .lci__description{\r\n color:rgba(43,20,47,.77);\r\n }\r\n\r\n}\r\n\r\n\/* =========================================================\r\n ENTRANCE COMPOSITION ENHANCEMENT\r\n Content remains visible without JS.\r\n ========================================================= *\/\r\n\r\n#lamina-care-index.has-entry-enhancement .lci__entry{\r\n --lci-entry-opacity:1;\r\n --lci-entry-y:0px;\r\n\r\n opacity:var(--lci-entry-opacity);\r\n transform:translate3d(0,var(--lci-entry-y),0);\r\n}\r\n\r\n#lamina-care-index.has-entry-enhancement .lci__item::before{\r\n transform:scaleY(var(--lci-separator-scale,1));\r\n transform-origin:50% 100%;\r\n}\r\n\r\n\/* =========================================================\r\n REUSABLE LAMINA FOCUS-DEPTH LAYERS\r\n Entrance: SOFT -> SHARP\r\n Departure: SHARP -> SOFT\r\n ========================================================= *\/\r\n\r\n#lamina-care-index [data-focus-layer]{\r\n --lci-depth-blur:0px;\r\n --lci-depth-opacity:1;\r\n --lci-depth-y:0px;\r\n\r\n filter:blur(var(--lci-depth-blur));\r\n opacity:var(--lci-depth-opacity);\r\n translate:0 var(--lci-depth-y);\r\n}\r\n\r\n\/* While the pointer is actively using a still-relevant item,\r\n that item remains sharp. *\/\r\n#lamina-care-index[data-lci-pointer-active=\"true\"]\r\n.lci__item.is-focused [data-focus-layer]{\r\n filter:none !important;\r\n opacity:1 !important;\r\n translate:0 0 !important;\r\n}\r\n\r\n\/* =========================================================\r\n TABLET \u2014 deliberate 3 + 2 editorial grid\r\n ========================================================= *\/\r\n\r\n@media (min-width:761px) and (max-width:1179px){\r\n\r\n .lci__header{\r\n grid-template-columns:minmax(0,.58fr) minmax(260px,.42fr);\r\n gap:44px;\r\n }\r\n\r\n .lci__index{\r\n grid-template-columns:repeat(6,minmax(0,1fr));\r\n }\r\n\r\n .lci__item{\r\n grid-column:span 2;\r\n }\r\n\r\n .lci__item:nth-of-type(4){\r\n grid-column:1 \/ span 3;\r\n border-block-start:1px solid rgba(43,20,47,.11);\r\n }\r\n\r\n .lci__item:nth-of-type(5){\r\n grid-column:4 \/ span 3;\r\n border-block-start:1px solid rgba(43,20,47,.11);\r\n }\r\n\r\n .lci__item:nth-of-type(4)::before{\r\n display:none;\r\n }\r\n\r\n .lci__focus-field{\r\n display:none;\r\n }\r\n\r\n}\r\n\r\n\/* =========================================================\r\n MOBILE \u2014 five full editorial rows\r\n ========================================================= *\/\r\n\r\n@media (max-width:760px){\r\n\r\n .lci__shell{\r\n padding:70px 20px 78px;\r\n }\r\n\r\n .lci__header{\r\n display:block;\r\n margin-block-end:40px;\r\n }\r\n\r\n .lci__title{\r\n max-width:8.5ch;\r\n font-size:clamp(48px,14vw,68px);\r\n line-height:.91;\r\n }\r\n\r\n .lci__intro{\r\n margin-block-start:24px;\r\n max-width:35ch;\r\n font-size:15px;\r\n line-height:1.66;\r\n }\r\n\r\n .lci__index{\r\n display:block;\r\n border-block:\r\n 1px solid rgba(43,20,47,.12);\r\n }\r\n\r\n .lci__focus-field{\r\n display:none;\r\n }\r\n\r\n .lci__item{\r\n padding:27px 2px 30px;\r\n }\r\n\r\n .lci__item + .lci__item{\r\n border-block-start:1px solid rgba(43,20,47,.12);\r\n }\r\n\r\n .lci__item + .lci__item::before{\r\n display:none;\r\n }\r\n\r\n .lci__item-inner{\r\n min-height:0;\r\n }\r\n\r\n .lci__number{\r\n margin-block-end:17px;\r\n font-size:11px;\r\n }\r\n\r\n .lci__item-title{\r\n max-width:24ch;\r\n font-size:14px;\r\n line-height:1.32;\r\n }\r\n\r\n .lci__description{\r\n margin-block-start:17px;\r\n padding-block-start:0;\r\n max-width:36ch;\r\n font-size:14px;\r\n line-height:1.62;\r\n }\r\n\r\n}\r\n\r\n\/* =========================================================\r\n REDUCED MOTION\r\n ========================================================= *\/\r\n\r\n@media (prefers-reduced-motion:reduce){\r\n\r\n #lamina-care-index [data-focus-layer]{\r\n filter:none !important;\r\n translate:0 0 !important;\r\n }\r\n\r\n #lamina-care-index.has-entry-enhancement .lci__entry{\r\n transform:none !important;\r\n }\r\n\r\n .lci__focus-field,\r\n .lci__number,\r\n .lci__item-title,\r\n .lci__description{\r\n transition:none !important;\r\n }\r\n\r\n}\r\n<\/style>\r\n\r\n\r\n<section\r\n id=\"lamina-care-index\"\r\n aria-labelledby=\"lamina-care-index-title\"\r\n data-lamina-focus-section\r\n data-lamina-exit-focus\r\n data-focus-profile=\"international-care\"\r\n>\r\n\r\n <div class=\"lci__shell\">\r\n\r\n <header class=\"lci__header\">\r\n\r\n <div>\r\n\r\n <p\r\n class=\"lci__eyebrow lci__entry\"\r\n data-focus-layer=\"heading\"\r\n data-entry-order=\"0\"\r\n >\r\n 02 \u2014 INTERNATIONAL CARE\r\n <\/p>\r\n\r\n <h2\r\n class=\"lci__title\"\r\n id=\"lamina-care-index-title\"\r\n >\r\n <span\r\n class=\"lci__title-line lci__entry\"\r\n data-focus-layer=\"heading\"\r\n data-entry-order=\"1\"\r\n >\r\n Care that starts\r\n <\/span>\r\n\r\n <span\r\n class=\"lci__title-line lci__entry\"\r\n data-focus-layer=\"heading\"\r\n data-entry-order=\"2\"\r\n >\r\n before you arrive.\r\n <\/span>\r\n <\/h2>\r\n\r\n <\/div>\r\n\r\n\r\n <p\r\n class=\"lci__intro lci__entry\"\r\n data-focus-layer=\"copy\"\r\n data-entry-order=\"3\"\r\n >\r\n Personalised planning, international-patient assistance, VIP transfer,\r\n partner hotel options and multilingual support\u2014coordinated around your\r\n visit to Istanbul.\r\n <\/p>\r\n\r\n <\/header>\r\n\r\n\r\n <div\r\n class=\"lci__index\"\r\n data-care-index\r\n aria-label=\"International care capabilities\"\r\n >\r\n\r\n <div\r\n class=\"lci__focus-field\"\r\n aria-hidden=\"true\"\r\n ><\/div>\r\n\r\n\r\n <article\r\n class=\"lci__item lci__entry\"\r\n data-care-item\r\n data-entry-order=\"4\"\r\n >\r\n <div\r\n class=\"lci__item-inner\"\r\n data-focus-layer=\"metadata\"\r\n >\r\n <span class=\"lci__number\">01<\/span>\r\n\r\n <h3 class=\"lci__item-title\">\r\n Personalised<br>\r\n Planning\r\n <\/h3>\r\n\r\n <p class=\"lci__description\">\r\n Your case is considered individually so the next steps can be planned around your treatment needs.\r\n <\/p>\r\n <\/div>\r\n <\/article>\r\n\r\n\r\n <article\r\n class=\"lci__item lci__entry\"\r\n data-care-item\r\n data-entry-order=\"5\"\r\n >\r\n <div\r\n class=\"lci__item-inner\"\r\n data-focus-layer=\"metadata\"\r\n >\r\n <span class=\"lci__number\">02<\/span>\r\n\r\n <h3 class=\"lci__item-title\">\r\n International<br>\r\n Patient Support\r\n <\/h3>\r\n\r\n <p class=\"lci__description\">\r\n Support for coordinating the practical steps around travelling to Istanbul for treatment.\r\n <\/p>\r\n <\/div>\r\n <\/article>\r\n\r\n\r\n <article\r\n class=\"lci__item lci__entry\"\r\n data-care-item\r\n data-entry-order=\"6\"\r\n >\r\n <div\r\n class=\"lci__item-inner\"\r\n data-focus-layer=\"metadata\"\r\n >\r\n <span class=\"lci__number\">03<\/span>\r\n\r\n <h3 class=\"lci__item-title\">\r\n VIP<br>\r\n Transfer\r\n <\/h3>\r\n\r\n <p class=\"lci__description\">\r\n Transfer coordination between the airport, your accommodation and the clinic where applicable.\r\n <\/p>\r\n <\/div>\r\n <\/article>\r\n\r\n\r\n <article\r\n class=\"lci__item lci__entry\"\r\n data-care-item\r\n data-entry-order=\"7\"\r\n >\r\n <div\r\n class=\"lci__item-inner\"\r\n data-focus-layer=\"media\"\r\n >\r\n <span class=\"lci__number\">04<\/span>\r\n\r\n <h3 class=\"lci__item-title\">\r\n Partner Hotel<br>\r\n Options\r\n <\/h3>\r\n\r\n <p class=\"lci__description\">\r\n Accommodation options through Lamina\u2019s partner hotel network in Istanbul.\r\n <\/p>\r\n <\/div>\r\n <\/article>\r\n\r\n\r\n <article\r\n class=\"lci__item lci__entry\"\r\n data-care-item\r\n data-entry-order=\"8\"\r\n >\r\n <div\r\n class=\"lci__item-inner\"\r\n data-focus-layer=\"media\"\r\n >\r\n <span class=\"lci__number\">05<\/span>\r\n\r\n <h3 class=\"lci__item-title\">\r\n Multilingual<br>\r\n Support\r\n <\/h3>\r\n\r\n <p class=\"lci__description\">\r\n Communication support designed to make the treatment journey clearer for international patients.\r\n <\/p>\r\n <\/div>\r\n <\/article>\r\n\r\n <\/div>\r\n\r\n <\/div>\r\n\r\n<\/section>\r\n\r\n\r\n<script>\r\n(() => {\r\n\r\n const root =\r\n document.getElementById(\r\n 'lamina-care-index'\r\n );\r\n\r\n\r\n if (\r\n !root ||\r\n root.dataset.careIndexReady ===\r\n 'true'\r\n ) return;\r\n\r\n\r\n root.dataset.careIndexReady =\r\n 'true';\r\n\r\n\r\n const index =\r\n root.querySelector(\r\n '[data-care-index]'\r\n );\r\n\r\n\r\n const items =\r\n [\r\n ...root.querySelectorAll(\r\n '[data-care-item]'\r\n )\r\n ];\r\n\r\n\r\n const focusField =\r\n root.querySelector(\r\n '.lci__focus-field'\r\n );\r\n\r\n\r\n const entryElements =\r\n [\r\n ...root.querySelectorAll(\r\n '[data-entry-order]'\r\n )\r\n ];\r\n\r\n\r\n if (\r\n !index ||\r\n !items.length\r\n ) return;\r\n\r\n\r\n const finePointer =\r\n window.matchMedia(\r\n '(hover:hover) and (pointer:fine)'\r\n );\r\n\r\n\r\n const reducedMotion =\r\n window.matchMedia(\r\n '(prefers-reduced-motion: reduce)'\r\n );\r\n\r\n\r\n \/* =======================================================\r\n DESKTOP MOVING FOCUS FIELD\r\n ======================================================= *\/\r\n\r\n function clearFocusField(){\r\n\r\n index.classList.remove(\r\n 'has-focus'\r\n );\r\n\r\n\r\n items.forEach(\r\n item =>\r\n item.classList.remove(\r\n 'is-focused'\r\n )\r\n );\r\n\r\n\r\n delete root.dataset.lciPointerActive;\r\n\r\n\r\n if (\r\n focusField\r\n ){\r\n\r\n focusField.style.opacity =\r\n '0';\r\n\r\n }\r\n\r\n }\r\n\r\n\r\n function focusItem(\r\n item\r\n ){\r\n\r\n if (\r\n !finePointer.matches ||\r\n window.innerWidth <\r\n 1180\r\n ) return;\r\n\r\n\r\n const indexRect =\r\n index.getBoundingClientRect();\r\n\r\n\r\n const itemRect =\r\n item.getBoundingClientRect();\r\n\r\n\r\n \/*\r\n Actual geometry is used so the focus field also behaves\r\n correctly in RTL layouts.\r\n *\/\r\n const x =\r\n itemRect.left -\r\n indexRect.left;\r\n\r\n\r\n root.dataset.lciPointerActive =\r\n 'true';\r\n\r\n\r\n index.classList.add(\r\n 'has-focus'\r\n );\r\n\r\n\r\n items.forEach(\r\n candidate => {\r\n\r\n candidate.classList.toggle(\r\n 'is-focused',\r\n candidate ===\r\n item\r\n );\r\n\r\n }\r\n );\r\n\r\n\r\n if (\r\n focusField\r\n ){\r\n\r\n focusField.style.setProperty(\r\n '--lci-focus-x',\r\n x.toFixed(\r\n 2\r\n ) +\r\n 'px'\r\n );\r\n\r\n\r\n focusField.style.opacity =\r\n '1';\r\n\r\n }\r\n\r\n }\r\n\r\n\r\n items.forEach(\r\n item => {\r\n\r\n item.addEventListener(\r\n 'pointerenter',\r\n () => {\r\n\r\n focusItem(\r\n item\r\n );\r\n\r\n },\r\n {\r\n passive:true\r\n }\r\n );\r\n\r\n }\r\n );\r\n\r\n\r\n index.addEventListener(\r\n 'pointerleave',\r\n clearFocusField,\r\n {\r\n passive:true\r\n }\r\n );\r\n\r\n\r\n \/* =======================================================\r\n ENTRY COMPOSITION\r\n Progressive enhancement only \u2014 content starts readable.\r\n ======================================================= *\/\r\n\r\n function prepareEntry(){\r\n\r\n if (\r\n reducedMotion.matches\r\n ) return;\r\n\r\n\r\n root.classList.add(\r\n 'has-entry-enhancement'\r\n );\r\n\r\n\r\n entryElements.forEach(\r\n element => {\r\n\r\n element.style.setProperty(\r\n '--lci-entry-opacity',\r\n '0'\r\n );\r\n\r\n\r\n element.style.setProperty(\r\n '--lci-entry-y',\r\n '10px'\r\n );\r\n\r\n }\r\n );\r\n\r\n\r\n items.forEach(\r\n item => {\r\n\r\n item.style.setProperty(\r\n '--lci-separator-scale',\r\n '0'\r\n );\r\n\r\n }\r\n );\r\n\r\n }\r\n\r\n\r\n function resolveEntry(){\r\n\r\n entryElements.forEach(\r\n element => {\r\n\r\n const order =\r\n Number(\r\n element.dataset.entryOrder ||\r\n 0\r\n );\r\n\r\n\r\n element.animate(\r\n [\r\n {\r\n opacity:0,\r\n transform:'translate3d(0,10px,0)'\r\n },\r\n {\r\n opacity:1,\r\n transform:'translate3d(0,0,0)'\r\n }\r\n ],\r\n {\r\n duration:\r\n 880 +\r\n Math.min(\r\n order,\r\n 8\r\n ) *\r\n 42,\r\n delay:\r\n order *\r\n 58,\r\n easing:\r\n 'cubic-bezier(.16,.70,.18,1)',\r\n fill:'forwards'\r\n }\r\n );\r\n\r\n }\r\n );\r\n\r\n\r\n items.forEach(\r\n (\r\n item,\r\n index\r\n ) => {\r\n\r\n window.setTimeout(\r\n () => {\r\n\r\n item.style.setProperty(\r\n '--lci-separator-scale',\r\n '1'\r\n );\r\n\r\n },\r\n 210 +\r\n index *\r\n 62\r\n );\r\n\r\n }\r\n );\r\n\r\n }\r\n\r\n\r\n prepareEntry();\r\n\r\n\r\n if (\r\n root.classList.contains(\r\n 'has-entry-enhancement'\r\n ) &&\r\n 'IntersectionObserver' in window\r\n ){\r\n\r\n const entryObserver =\r\n new IntersectionObserver(\r\n entries => {\r\n\r\n entries.forEach(\r\n entry => {\r\n\r\n if (\r\n !entry.isIntersecting\r\n ) return;\r\n\r\n\r\n resolveEntry();\r\n\r\n\r\n entryObserver.disconnect();\r\n\r\n }\r\n );\r\n\r\n },\r\n {\r\n rootMargin:'0px 0px -12% 0px',\r\n threshold:.14\r\n }\r\n );\r\n\r\n\r\n entryObserver.observe(\r\n root\r\n );\r\n\r\n }else if(\r\n root.classList.contains(\r\n 'has-entry-enhancement'\r\n )\r\n ){\r\n\r\n resolveEntry();\r\n\r\n }\r\n\r\n\r\n \/* =======================================================\r\n PROJECT-WIDE LAMINA FOCUS-DEPTH CONTROLLER\r\n Reusable singleton contract:\r\n registerProfile(name, config)\r\n register(section)\r\n requestUpdate()\r\n remeasure()\r\n ======================================================= *\/\r\n\r\n if (\r\n !window.LaminaFocusDepth ||\r\n typeof window.LaminaFocusDepth.registerProfile !==\r\n 'function'\r\n ){\r\n\r\n window.LaminaFocusDepth =\r\n (() => {\r\n\r\n const states =\r\n new Set();\r\n\r\n\r\n const profiles =\r\n new Map();\r\n\r\n\r\n const reducedQuery =\r\n window.matchMedia(\r\n '(prefers-reduced-motion: reduce)'\r\n );\r\n\r\n\r\n let ticking =\r\n false;\r\n\r\n\r\n let previousScrollY =\r\n window.scrollY;\r\n\r\n\r\n let direction =\r\n 0;\r\n\r\n\r\n const directionThreshold =\r\n 3;\r\n\r\n\r\n function clamp(\r\n value,\r\n min,\r\n max\r\n ){\r\n\r\n return Math.min(\r\n max,\r\n Math.max(\r\n min,\r\n value\r\n )\r\n );\r\n\r\n }\r\n\r\n\r\n function smootherstep(\r\n value\r\n ){\r\n\r\n const t =\r\n clamp(\r\n value,\r\n 0,\r\n 1\r\n );\r\n\r\n\r\n return (\r\n t *\r\n t *\r\n t *\r\n (\r\n t *\r\n (\r\n t *\r\n 6 -\r\n 15\r\n ) +\r\n 10\r\n )\r\n );\r\n\r\n }\r\n\r\n\r\n function registerProfile(\r\n name,\r\n config\r\n ){\r\n\r\n if (\r\n !name ||\r\n !config\r\n ) return;\r\n\r\n\r\n profiles.set(\r\n name,\r\n config\r\n );\r\n\r\n }\r\n\r\n\r\n function measure(\r\n state\r\n ){\r\n\r\n const sectionRect =\r\n state.section.getBoundingClientRect();\r\n\r\n\r\n state.layers =\r\n [\r\n ...state.section.querySelectorAll(\r\n '[data-focus-layer]'\r\n )\r\n ].map(\r\n element => {\r\n\r\n const rect =\r\n element.getBoundingClientRect();\r\n\r\n\r\n return {\r\n element,\r\n type:\r\n element.dataset.focusLayer ||\r\n 'copy',\r\n centerOffset:\r\n rect.top -\r\n sectionRect.top +\r\n rect.height *\r\n .5\r\n };\r\n\r\n }\r\n );\r\n\r\n }\r\n\r\n\r\n function applyLayer(\r\n item,\r\n entryProgress,\r\n exitProgress,\r\n layerConfig,\r\n reduced\r\n ){\r\n\r\n const depth =\r\n Math.max(\r\n entryProgress,\r\n exitProgress\r\n );\r\n\r\n\r\n let blur =\r\n entryProgress >=\r\n exitProgress\r\n ? (\r\n layerConfig.entryBlur *\r\n entryProgress\r\n )\r\n : (\r\n layerConfig.exitBlur *\r\n exitProgress\r\n );\r\n\r\n\r\n let opacity =\r\n 1 -\r\n (\r\n 1 -\r\n layerConfig.opacityMin\r\n ) *\r\n depth;\r\n\r\n\r\n let shift =\r\n entryProgress >=\r\n exitProgress\r\n ? (\r\n layerConfig.entryShift *\r\n entryProgress\r\n )\r\n : (\r\n layerConfig.exitShift *\r\n exitProgress\r\n );\r\n\r\n\r\n if (\r\n reduced\r\n ){\r\n\r\n blur =\r\n 0;\r\n\r\n\r\n shift =\r\n 0;\r\n\r\n\r\n opacity =\r\n 1 -\r\n .12 *\r\n depth;\r\n\r\n }\r\n\r\n\r\n item.element.style.setProperty(\r\n '--lci-depth-blur',\r\n blur.toFixed(\r\n 2\r\n ) +\r\n 'px'\r\n );\r\n\r\n\r\n item.element.style.setProperty(\r\n '--lci-depth-opacity',\r\n opacity.toFixed(\r\n 3\r\n )\r\n );\r\n\r\n\r\n item.element.style.setProperty(\r\n '--lci-depth-y',\r\n shift.toFixed(\r\n 2\r\n ) +\r\n 'px'\r\n );\r\n\r\n }\r\n\r\n\r\n function updateSection(\r\n state,\r\n viewportHeight,\r\n compact\r\n ){\r\n\r\n if (\r\n !state.near\r\n ) return;\r\n\r\n\r\n const profile =\r\n profiles.get(\r\n state.profileName\r\n );\r\n\r\n\r\n if (\r\n !profile\r\n ) return;\r\n\r\n\r\n const config =\r\n compact\r\n ? profile.mobile\r\n : profile.desktop;\r\n\r\n\r\n const sectionRect =\r\n state.section.getBoundingClientRect();\r\n\r\n\r\n const focalTop =\r\n viewportHeight *\r\n config.focalTop;\r\n\r\n\r\n const focalBottom =\r\n viewportHeight *\r\n config.focalBottom;\r\n\r\n\r\n const entryFar =\r\n viewportHeight *\r\n config.entryFar;\r\n\r\n\r\n const exitFar =\r\n viewportHeight *\r\n config.exitFar;\r\n\r\n\r\n state.layers.forEach(\r\n item => {\r\n\r\n const layerConfig =\r\n config[\r\n item.type\r\n ] ||\r\n config.copy;\r\n\r\n\r\n const centerY =\r\n sectionRect.top +\r\n item.centerOffset;\r\n\r\n\r\n \/*\r\n Approaching content remains slightly soft until\r\n it enters the lower portion of the active focal zone.\r\n *\/\r\n const entryProgress =\r\n centerY >\r\n focalBottom\r\n ? smootherstep(\r\n (\r\n centerY -\r\n focalBottom\r\n ) \/\r\n Math.max(\r\n 1,\r\n entryFar -\r\n focalBottom\r\n )\r\n )\r\n : 0;\r\n\r\n\r\n \/*\r\n Leaving content stays sharp while still useful.\r\n Only content above the upper focal boundary softens.\r\n *\/\r\n const exitProgress =\r\n centerY <\r\n focalTop\r\n ? smootherstep(\r\n (\r\n focalTop -\r\n centerY\r\n ) \/\r\n Math.max(\r\n 1,\r\n focalTop -\r\n exitFar\r\n )\r\n )\r\n : 0;\r\n\r\n\r\n applyLayer(\r\n item,\r\n entryProgress,\r\n exitProgress,\r\n layerConfig,\r\n reducedQuery.matches\r\n );\r\n\r\n }\r\n );\r\n\r\n }\r\n\r\n\r\n function update(){\r\n\r\n ticking =\r\n false;\r\n\r\n\r\n const currentY =\r\n window.scrollY;\r\n\r\n\r\n const delta =\r\n currentY -\r\n previousScrollY;\r\n\r\n\r\n if (\r\n delta >\r\n directionThreshold\r\n ){\r\n\r\n direction =\r\n 1;\r\n\r\n }else if(\r\n delta <\r\n -directionThreshold\r\n ){\r\n\r\n direction =\r\n -1;\r\n\r\n }\r\n\r\n\r\n previousScrollY =\r\n currentY;\r\n\r\n\r\n const viewportHeight =\r\n Math.max(\r\n 1,\r\n window.innerHeight ||\r\n document.documentElement.clientHeight\r\n );\r\n\r\n\r\n const compact =\r\n window.innerWidth <=\r\n 760;\r\n\r\n\r\n states.forEach(\r\n state => {\r\n\r\n state.direction =\r\n direction;\r\n\r\n\r\n updateSection(\r\n state,\r\n viewportHeight,\r\n compact\r\n );\r\n\r\n }\r\n );\r\n\r\n }\r\n\r\n\r\n function requestUpdate(){\r\n\r\n if (\r\n ticking\r\n ) return;\r\n\r\n\r\n ticking =\r\n true;\r\n\r\n\r\n requestAnimationFrame(\r\n update\r\n );\r\n\r\n }\r\n\r\n\r\n const intersectionObserver =\r\n 'IntersectionObserver' in window\r\n ? new IntersectionObserver(\r\n entries => {\r\n\r\n entries.forEach(\r\n entry => {\r\n\r\n const state =\r\n entry.target.__laminaFocusDepthState;\r\n\r\n\r\n if (\r\n !state\r\n ) return;\r\n\r\n\r\n state.near =\r\n entry.isIntersecting;\r\n\r\n\r\n if (\r\n state.near\r\n ){\r\n\r\n measure(\r\n state\r\n );\r\n\r\n\r\n requestUpdate();\r\n\r\n }\r\n\r\n }\r\n );\r\n\r\n },\r\n {\r\n rootMargin:'100% 0px 100% 0px',\r\n threshold:0\r\n }\r\n )\r\n : null;\r\n\r\n\r\n const resizeObserver =\r\n 'ResizeObserver' in window\r\n ? new ResizeObserver(\r\n entries => {\r\n\r\n entries.forEach(\r\n entry => {\r\n\r\n const state =\r\n entry.target.__laminaFocusDepthState;\r\n\r\n\r\n if (\r\n state\r\n ){\r\n\r\n measure(\r\n state\r\n );\r\n\r\n }\r\n\r\n }\r\n );\r\n\r\n\r\n requestUpdate();\r\n\r\n }\r\n )\r\n : null;\r\n\r\n\r\n function register(\r\n section\r\n ){\r\n\r\n if (\r\n !section ||\r\n section.__laminaFocusDepthState\r\n ) return;\r\n\r\n\r\n const state =\r\n {\r\n section,\r\n profileName:\r\n section.dataset.focusProfile ||\r\n 'default',\r\n near:true,\r\n direction:0,\r\n layers:[]\r\n };\r\n\r\n\r\n section.__laminaFocusDepthState =\r\n state;\r\n\r\n\r\n states.add(\r\n state\r\n );\r\n\r\n\r\n measure(\r\n state\r\n );\r\n\r\n\r\n intersectionObserver?.observe(\r\n section\r\n );\r\n\r\n\r\n resizeObserver?.observe(\r\n section\r\n );\r\n\r\n\r\n requestUpdate();\r\n\r\n }\r\n\r\n\r\n function remeasure(){\r\n\r\n states.forEach(\r\n state => {\r\n\r\n measure(\r\n state\r\n );\r\n\r\n }\r\n );\r\n\r\n\r\n requestUpdate();\r\n\r\n }\r\n\r\n\r\n window.addEventListener(\r\n 'scroll',\r\n requestUpdate,\r\n {\r\n passive:true\r\n }\r\n );\r\n\r\n\r\n let resizeTimer =\r\n null;\r\n\r\n\r\n window.addEventListener(\r\n 'resize',\r\n () => {\r\n\r\n window.clearTimeout(\r\n resizeTimer\r\n );\r\n\r\n\r\n resizeTimer =\r\n window.setTimeout(\r\n remeasure,\r\n 120\r\n );\r\n\r\n },\r\n {\r\n passive:true\r\n }\r\n );\r\n\r\n\r\n return {\r\n registerProfile,\r\n register,\r\n requestUpdate,\r\n remeasure\r\n };\r\n\r\n })();\r\n\r\n }\r\n\r\n\r\n window.LaminaFocusDepth.registerProfile(\r\n 'international-care',\r\n {\r\n\r\n desktop:{\r\n focalTop:.20,\r\n focalBottom:.72,\r\n entryFar:.90,\r\n exitFar:-.15,\r\n\r\n heading:{\r\n entryBlur:3.4,\r\n exitBlur:3.8,\r\n opacityMin:.82,\r\n entryShift:4,\r\n exitShift:-2\r\n },\r\n\r\n copy:{\r\n entryBlur:2.2,\r\n exitBlur:2.6,\r\n opacityMin:.87,\r\n entryShift:3,\r\n exitShift:-1\r\n },\r\n\r\n ui:{\r\n entryBlur:1.4,\r\n exitBlur:1.7,\r\n opacityMin:.91,\r\n entryShift:2,\r\n exitShift:0\r\n },\r\n\r\n metadata:{\r\n entryBlur:1.5,\r\n exitBlur:2.1,\r\n opacityMin:.88,\r\n entryShift:2,\r\n exitShift:-1\r\n },\r\n\r\n media:{\r\n entryBlur:1.3,\r\n exitBlur:1.8,\r\n opacityMin:.89,\r\n entryShift:2,\r\n exitShift:-1\r\n }\r\n\r\n },\r\n\r\n mobile:{\r\n focalTop:.12,\r\n focalBottom:.80,\r\n entryFar:.94,\r\n exitFar:-.18,\r\n\r\n heading:{\r\n entryBlur:2.5,\r\n exitBlur:3,\r\n opacityMin:.86,\r\n entryShift:3,\r\n exitShift:-1\r\n },\r\n\r\n copy:{\r\n entryBlur:1.5,\r\n exitBlur:1.9,\r\n opacityMin:.91,\r\n entryShift:2,\r\n exitShift:0\r\n },\r\n\r\n ui:{\r\n entryBlur:.9,\r\n exitBlur:1.1,\r\n opacityMin:.93,\r\n entryShift:1,\r\n exitShift:0\r\n },\r\n\r\n metadata:{\r\n entryBlur:1.1,\r\n exitBlur:1.6,\r\n opacityMin:.91,\r\n entryShift:1,\r\n exitShift:0\r\n },\r\n\r\n media:{\r\n entryBlur:1,\r\n exitBlur:1.45,\r\n opacityMin:.92,\r\n entryShift:1,\r\n exitShift:0\r\n }\r\n\r\n }\r\n\r\n }\r\n );\r\n\r\n\r\n window.LaminaFocusDepth.register(\r\n root\r\n );\r\n\r\n\r\n \/* =======================================================\r\n RESIZE \/ RTL \/ BREAKPOINT RE-MEASURE\r\n ======================================================= *\/\r\n\r\n let localResizeTimer =\r\n null;\r\n\r\n\r\n window.addEventListener(\r\n 'resize',\r\n () => {\r\n\r\n window.clearTimeout(\r\n localResizeTimer\r\n );\r\n\r\n\r\n localResizeTimer =\r\n window.setTimeout(\r\n () => {\r\n\r\n clearFocusField();\r\n\r\n\r\n window.LaminaFocusDepth?.remeasure?.();\r\n\r\n },\r\n 130\r\n );\r\n\r\n },\r\n {\r\n passive:true\r\n }\r\n );\r\n\r\n})();\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-ca63f3b elementor-widget elementor-widget-html\" data-id=\"ca63f3b\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t\n<style id=\"lamina-form-choice-mobile-alignment\">\n@media(max-width:767px){\nbody.elementor-page-11 #lamina-case-submission .s09__choice{box-sizing:border-box!important;width:100%!important;min-width:0!important;padding:22px 20px 23px!important;align-items:flex-start!important;justify-content:center!important;overflow:hidden!important;text-align:left!important;}\nbody.elementor-page-11 #lamina-case-submission .s09__choice-name{display:block!important;width:100%!important;max-width:100%!important;min-width:0!important;margin:0!important;padding:0!important;font-size:clamp(28px,8.2vw,31px)!important;line-height:1.08!important;letter-spacing:-.015em!important;white-space:normal!important;overflow-wrap:anywhere!important;word-break:normal!important;}\nbody.elementor-page-11 #lamina-case-submission .s09__choice-copy{display:block!important;width:100%!important;max-width:100%!important;min-width:0!important;margin:10px 0 0!important;padding:0!important;line-height:1.5!important;white-space:normal!important;overflow-wrap:anywhere!important;}\n}\n<\/style>\n<style id=\"lamina-faq-state-finish\">\n@media(max-width:767px){body.elementor-page-11 #lamina-decision-faq .df__faq-row:not(.is-open) .df__question-button:hover .df__disclosure,body.elementor-page-11 #lamina-decision-faq .df__faq-row:not(.is-open) .df__question-button:focus-visible .df__disclosure{background:rgba(255,255,255,.92)!important;border-color:rgba(59,13,44,.42)!important;}body.elementor-page-11 #lamina-decision-faq .df__faq-row .df__question-button .df__disclosure::before{background:transparent!important;background-color:transparent!important;background-image:none!important;box-shadow:none!important;}body.elementor-page-11 #lamina-decision-faq .df__faq-row.is-open .df__question-button .df__disclosure{background:rgba(59,13,44,.96)!important;border-color:#3b0d2c!important;}body.elementor-page-11 #lamina-decision-faq .df__faq-row.is-open .df__question-button .df__disclosure::before{background:transparent!important;background-color:transparent!important;border-color:#fff!important;transform:translate(-50%,-38%) rotate(225deg)!important;}}\n<\/style>\n<style id=\"lamina-faq-chevron-finish\">\n@media(max-width:767px){body.elementor-page-11 #lamina-decision-faq .df__disclosure::before{background-color:transparent!important;background-image:none!important;box-shadow:none!important;}body.elementor-page-11 #lamina-decision-faq .df__faq-row.is-open .df__disclosure::before{background-color:transparent!important;background-image:none!important;}}\n<\/style>\n<style id=\"lamina-faq-mobile-polish\">\n@media(max-width:767px){\n#lamina-decision-faq .df__faq-list,#lamina-decision-faq .df__faq-row{min-width:0!important;max-width:100%!important;}\n#lamina-decision-faq .df__question-button{grid-template-columns:minmax(0,1fr) 36px!important;grid-template-areas:\"number control\" \"question control\"!important;column-gap:18px!important;row-gap:10px!important;align-items:center!important;width:100%!important;min-width:0!important;padding:22px 0 23px!important;overflow:visible!important;text-align:left!important;}\n#lamina-decision-faq .df__number{grid-area:number!important;width:auto!important;min-width:0!important;}\n#lamina-decision-faq .df__question-text{grid-area:question!important;width:auto!important;max-width:none!important;min-width:0!important;white-space:normal!important;overflow:visible!important;overflow-wrap:anywhere!important;word-break:normal!important;font-size:clamp(23px,7.2vw,28px)!important;line-height:1.08!important;letter-spacing:-.018em!important;padding-right:2px!important;text-align:left!important;}\n#lamina-decision-faq .df__disclosure{grid-area:control!important;align-self:center!important;justify-self:end!important;width:34px!important;height:34px!important;border:1px solid rgba(59,13,44,.24)!important;border-radius:999px!important;background:rgba(255,255,255,.64)!important;box-shadow:0 8px 24px rgba(59,13,44,.08)!important;position:relative!important;transition:background-color .25s ease,border-color .25s ease,transform .25s ease!important;}\n#lamina-decision-faq .df__disclosure::before{content:\"\"!important;display:block!important;width:8px!important;height:8px!important;border:0!important;border-right:1.5px solid #3b0d2c!important;border-bottom:1.5px solid #3b0d2c!important;background:none!important;position:absolute!important;left:50%!important;top:50%!important;transform:translate(-50%,-62%) rotate(45deg)!important;transform-origin:center!important;transition:transform .25s ease!important;}\n#lamina-decision-faq .df__disclosure::after{content:none!important;display:none!important;}\n#lamina-decision-faq .df__faq-row.is-open .df__disclosure{background:rgba(59,13,44,.96)!important;border-color:#3b0d2c!important;box-shadow:0 10px 28px rgba(59,13,44,.18)!important;}\n#lamina-decision-faq .df__faq-row.is-open .df__disclosure::before{border-color:#fff!important;transform:translate(-50%,-38%) rotate(225deg)!important;}\n#lamina-decision-faq .df__question-button:focus-visible{outline:2px solid #a86186!important;outline-offset:6px!important;border-radius:2px!important;}\n}\n<\/style>\n<style id=\"lamina-phone-blur-hard-stop\">\n@media(max-width:767px){\n#lamina-care-index [data-focus-layer],\n#lamina-service-track .lc-st__intro-head,\n#lamina-service-track .lc-st__tiles,\n#lamina-service-track .lc-st__service .lc-st__visual,\n#lamina-service-track .lc-st__service .lc-st__content,\n#lamina-real-cases .lc-case__exit-blur,\n#lamina-doctor-gallery [data-focus-layer],\n#lamina-treatment-path-tree [data-exit-layer],\n#lamina-istanbul-stay [data-lis-depth],\n#lamina-decision-faq [data-df-depth],\n#lamina-case-submission [data-s09-depth]{\nfilter:none!important;\ntranslate:none!important;\nwill-change:auto!important;\n}\n}\n<\/style>\n<!-- LAMINA HOMEPAGE PHONE QA REPAIR \u2014 2026-09-10 -->\n<style id=\"lamina-homepage-phone-repair\">\n@media (max-width:767px){\n html,\n body{\n max-width:100%;\n }\n\n body.elementor-page-11{\n overflow-x:clip;\n }\n\n body.elementor-page-11 .e-con,\n body.elementor-page-11 .elementor-widget-html{\n min-width:0 !important;\n max-width:100% !important;\n }\n\n #top,\n #lamina-care-index,\n #lamina-service-track,\n #lamina-real-cases,\n #lamina-doctor-gallery,\n #lamina-treatment-path-tree,\n #lamina-istanbul-stay,\n #lamina-decision-faq,\n #lamina-case-submission{\n width:100%;\n max-width:100%;\n min-width:0;\n --e-global-color-accent:#5F2468 !important;\n }\n\n #top img,\n #lamina-care-index img,\n #lamina-service-track img,\n #lamina-real-cases img,\n #lamina-doctor-gallery img,\n #lamina-treatment-path-tree img,\n #lamina-istanbul-stay img,\n #lamina-decision-faq img,\n #lamina-case-submission img,\n #top video,\n #lamina-service-track video,\n #lamina-case-submission video,\n #lamina-case-submission iframe{\n display:block;\n max-width:100%;\n }\n\n #lamina-real-cases{\n overflow-x:clip !important;\n }\n\n #lamina-real-cases .lc-case__stage,\n #lamina-real-cases .lc-case__stage-inner,\n #lamina-real-cases .lc-case__layout,\n #lamina-real-cases .lc-case__visual{\n width:100% !important;\n max-width:100% !important;\n min-width:0 !important;\n }\n\n #lamina-real-cases .lc-case__layout{\n display:block !important;\n }\n\n #lamina-real-cases .lc-case__visual{\n flex:none !important;\n overflow:hidden !important;\n }\n\n #lamina-real-cases .lc-case__case-list{\n display:flex !important;\n width:100% !important;\n max-width:100% !important;\n min-width:0 !important;\n overflow-x:auto !important;\n overflow-y:hidden !important;\n overscroll-behavior-inline:contain;\n -webkit-overflow-scrolling:touch;\n touch-action:pan-x pan-y;\n }\n\n #lamina-real-cases .lc-case__card{\n max-width:calc(100vw - 40px);\n }\n\n #lamina-doctor-gallery .ldg__shell,\n #lamina-doctor-gallery .ldg__bleed,\n #lamina-doctor-gallery .ldg__ribbon-stage,\n #lamina-doctor-gallery .ldg__viewport{\n min-width:0 !important;\n max-width:100% !important;\n }\n\n #lamina-doctor-gallery .ldg__bleed{\n width:calc(100% - 40px) !important;\n margin-inline:20px !important;\n }\n\n #lamina-doctor-gallery .ldg__viewport{\n width:100% !important;\n margin-inline:0 !important;\n overflow:hidden !important;\n }\n\n #lamina-care-index [data-focus-layer]{\n --lci-depth-blur:0px !important;\n --lci-depth-opacity:1 !important;\n --lci-depth-y:0px !important;\n }\n\n #lamina-service-track .lc-st__intro-head,\n #lamina-service-track .lc-st__tiles,\n #lamina-service-track .lc-st__service .lc-st__visual,\n #lamina-service-track .lc-st__service .lc-st__content{\n --lc-mobile-depth-blur:0px !important;\n --lc-mobile-depth-opacity:1 !important;\n --lc-mobile-depth-y:0px !important;\n }\n\n #lamina-real-cases .lc-case__exit-blur{\n --lc-section-exit-blur:0px !important;\n }\n\n #lamina-doctor-gallery [data-focus-layer]{\n --lamina-focus-blur:0px !important;\n --lamina-focus-opacity:1 !important;\n --lamina-focus-y:0px !important;\n }\n\n #lamina-treatment-path-tree [data-exit-layer]{\n --pt-entry-blur:0px !important;\n --pt-passed-blur:0px !important;\n --pt-passed-opacity:1 !important;\n }\n\n #lamina-istanbul-stay [data-lis-depth]{\n --lis-entry-blur:0px !important;\n --lis-passed-blur:0px !important;\n --lis-depth-opacity:1 !important;\n }\n\n #lamina-decision-faq [data-df-depth]{\n --df-entry-blur:0px !important;\n --df-passed-blur:0px !important;\n --df-depth-opacity:1 !important;\n }\n\n #lamina-case-submission [data-s09-depth]{\n --s09-entry-blur:0px !important;\n --s09-passed-blur:0px !important;\n --s09-depth-opacity:1 !important;\n }\n\n #lamina-service-track a:focus-visible,\n #lamina-service-track button:focus-visible,\n #lamina-real-cases a:focus-visible,\n #lamina-real-cases button:focus-visible,\n #lamina-doctor-gallery a:focus-visible,\n #lamina-doctor-gallery button:focus-visible,\n #lamina-treatment-path-tree a:focus-visible,\n #lamina-treatment-path-tree button:focus-visible,\n #lamina-istanbul-stay a:focus-visible,\n #lamina-istanbul-stay button:focus-visible,\n #lamina-decision-faq a:focus-visible,\n #lamina-decision-faq button:focus-visible,\n #lamina-case-submission a:focus-visible,\n #lamina-case-submission button:focus-visible,\n #lamina-case-submission input:focus-visible,\n #lamina-case-submission select:focus-visible,\n #lamina-case-submission textarea:focus-visible{\n outline-color:#94709A !important;\n text-decoration-color:#94709A !important;\n }\n\n #lamina-case-submission input[type=\"checkbox\"],\n #lamina-case-submission input[type=\"radio\"]{\n accent-color:#5F2468;\n }\n}\n<\/style>\n\n<style id=\"lamina-phone-repair-footprint\">body:not(.elementor-editor-active) .elementor-element-ca63f3b{display:none !important}<\/style>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-fb6fce4 e-con-full e-flex e-con e-parent\" data-id=\"fb6fce4\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-fcb304d elementor-widget elementor-widget-html\" data-id=\"fcb304d\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- =========================================================\r\nLAMINA CLINIC \u2014 SECTION 03\r\nSERVICES \u2014 DESKTOP MASTER TRACK + PHONE EDITORIAL FLOW\r\n\r\nThis implementation is written from scratch around one simple method:\r\n\r\n- A tall master wrapper creates the scroll distance.\r\n- A 100svh sticky camera pins itself only AFTER the section reaches\r\n the top of the viewport.\r\n- Six full-viewport slides are stacked inside that camera.\r\n- Page scroll progress through the master wrapper selects the active slide.\r\n- The active slide change triggers a fixed-duration blur\/crossfade.\r\n- The animation is NOT continuously tied to the user's wheel delta.\r\n Once a threshold is crossed, the transition finishes on its own.\r\n- The opening selector is slide 00.\r\n- Five service slides follow it.\r\n- Clicking one of the five selector images jumps directly to the chosen\r\n service segment behind a short neutral blur veil.\r\n- Phone uses a separate normal-flow editorial experience with no sticky camera.\r\n\r\nReplace all sample image paths with real clinic-approved photography.\r\n\r\nExpected assets:\r\nassets\/services\/hair-restoration.webp\r\nassets\/services\/brow-beard.webp\r\nassets\/services\/smile-design.webp\r\nassets\/services\/crowns.webp\r\nassets\/services\/implants.webp\r\n========================================================= -->\r\n\r\n<style>\r\n@import url('https:\/\/fonts.googleapis.com\/css2?family=Cormorant+Garamond:ital,wght@0,400;0,500;1,400&family=Manrope:wght@400;500;600&display=swap');\r\n\r\n#lamina-service-track{\r\n --aubergine:#2B142F;\r\n --aubergine-deep:#150717;\r\n --plum:#5F2468;\r\n --plum-deep:#32123A;\r\n --plum-accent:#7A3F86;\r\n --orchid:#94709A;\r\n --lilac:#C5B2C8;\r\n --ivory:#F7F2EA;\r\n --champagne:#D8C4A1;\r\n --ink:#171317;\r\n\r\n --motion:cubic-bezier(.22,1,.36,1);\r\n --panel-time:1.28s;\r\n\r\n --e-global-color-accent:#5F2468 !important;\r\n --e-global-color-primary:#2B142F !important;\r\n --e-global-color-secondary:#94709A !important;\r\n --e-global-color-text:#171317 !important;\r\n\r\n position:relative;\r\n width:100%;\r\n\r\n \/*\r\n Six slides inside a 100svh sticky camera.\r\n The extra master height is the actual narrative scroll distance.\r\n *\/\r\n height:610vh;\r\n\r\n background:var(--aubergine-deep);\r\n\r\n font-family:\"Manrope\",system-ui,-apple-system,BlinkMacSystemFont,\"Segoe UI\",sans-serif;\r\n}\r\n\r\n#lamina-service-track *,\r\n#lamina-service-track *::before,\r\n#lamina-service-track *::after{\r\n box-sizing:border-box;\r\n}\r\n\r\n#lamina-service-track button,\r\n#lamina-service-track a{\r\n font:inherit;\r\n}\r\n\r\n#lamina-service-track button:hover,\r\n#lamina-service-track button:focus,\r\n#lamina-service-track button:focus-visible,\r\n#lamina-service-track a:hover,\r\n#lamina-service-track a:focus,\r\n#lamina-service-track a:focus-visible{\r\n color:inherit !important;\r\n outline-color:var(--plum) !important;\r\n}\r\n\r\n#lamina-service-track ::selection{\r\n background:var(--plum);\r\n color:var(--ivory);\r\n}\r\n\r\n\r\n\/* =========================================================\r\n STICKY CAMERA\r\n This is the core behavior:\r\n it does not pin until the section itself reaches the viewport top.\r\n ========================================================= *\/\r\n\r\n.lc-st__camera{\r\n position:sticky;\r\n top:0;\r\n\r\n width:100%;\r\n height:100vh;\r\n height:100svh;\r\n\r\n overflow:hidden;\r\n isolation:isolate;\r\n\r\n background:var(--aubergine-deep);\r\n}\r\n\r\n\r\n\/* =========================================================\r\n STACKED SLIDES\r\n ========================================================= *\/\r\n\r\n.lc-st__slide{\r\n position:absolute;\r\n inset:0;\r\n\r\n width:100%;\r\n height:100%;\r\n\r\n opacity:0;\r\n visibility:hidden;\r\n\r\n \/*\r\n Heavy dreamy transition lives here.\r\n Both image and text are inside the SAME filtered slide.\r\n *\/\r\n filter:blur(24px);\r\n\r\n transform:\r\n translate3d(0,10px,0)\r\n scale(1.012);\r\n\r\n pointer-events:none;\r\n\r\n backface-visibility:hidden;\r\n -webkit-backface-visibility:hidden;\r\n\r\n contain:paint;\r\n\r\n will-change:\r\n opacity,\r\n filter,\r\n transform;\r\n\r\n transition:\r\n opacity var(--panel-time) var(--motion),\r\n filter calc(var(--panel-time) + .12s) var(--motion),\r\n transform calc(var(--panel-time) + .08s) var(--motion),\r\n visibility 0s linear calc(var(--panel-time) + .12s);\r\n\r\n z-index:1;\r\n}\r\n\r\n.lc-st__slide.is-active{\r\n opacity:1;\r\n visibility:visible;\r\n\r\n filter:blur(0);\r\n\r\n transform:\r\n translate3d(0,0,0)\r\n scale(1);\r\n\r\n pointer-events:auto;\r\n\r\n transition-delay:0s;\r\n\r\n z-index:5;\r\n}\r\n\r\n\r\n\/*\r\n During a class swap the old slide needs time to blur away.\r\n Keeping every non-active slide visible for the CSS transition duration\r\n is what gives us a complete crossfade instead of an instant cut.\r\n*\/\r\n.lc-st__slide.is-transitioning-out{\r\n visibility:visible;\r\n z-index:4;\r\n}\r\n\r\n\r\n\/* =========================================================\r\n PANEL 01 \u2014 NORMAL SCROLL \/ SERVICE SELECTOR\r\n ========================================================= *\/\r\n\r\n.lc-st__intro{\r\n position:absolute;\r\n inset:0;\r\n z-index:3;\r\n\r\n min-height:100svh;\r\n height:100svh;\r\n\r\n padding:\r\n clamp(94px,10vh,132px)\r\n clamp(24px,5.4vw,96px)\r\n clamp(72px,8vh,100px);\r\n\r\n display:flex;\r\n flex-direction:column;\r\n justify-content:center;\r\n\r\n color:var(--ivory);\r\n\r\n background:\r\n radial-gradient(\r\n 58% 44% at 92% 6%,\r\n rgba(148,112,154,.16),\r\n transparent 70%\r\n ),\r\n radial-gradient(\r\n 42% 36% at 8% 92%,\r\n rgba(95,36,104,.18),\r\n transparent 72%\r\n ),\r\n linear-gradient(\r\n 145deg,\r\n #2B142F 0%,\r\n #35183B 48%,\r\n #241027 100%\r\n );\r\n}\r\n\r\n.lc-st__intro-inner{\r\n width:min(100%,1600px);\r\n margin:0 auto;\r\n}\r\n\r\n.lc-st__intro-head{\r\n display:grid;\r\n grid-template-columns:minmax(0,1fr) minmax(300px,.56fr);\r\n gap:clamp(44px,6vw,108px);\r\n align-items:end;\r\n\r\n margin-bottom:clamp(38px,5vh,62px);\r\n}\r\n\r\n.lc-st__eyebrow{\r\n margin:0 0 16px;\r\n\r\n color:rgba(216,196,161,.78);\r\n\r\n font-size:9px;\r\n line-height:1;\r\n font-weight:600;\r\n letter-spacing:.21em;\r\n text-transform:uppercase;\r\n}\r\n\r\n.lc-st__intro-title{\r\n margin:0;\r\n max-width:9ch;\r\n\r\n color:var(--ivory);\r\n\r\n font-family:\"Cormorant Garamond\",Georgia,serif;\r\n font-size:clamp(64px,5.8vw,108px);\r\n line-height:.84;\r\n font-weight:400;\r\n letter-spacing:-.052em;\r\n}\r\n\r\n.lc-st__intro-title em{\r\n color:var(--lilac);\r\n font-style:italic;\r\n font-weight:400;\r\n}\r\n\r\n.lc-st__intro-copy{\r\n margin:0 0 8px;\r\n max-width:38ch;\r\n\r\n color:rgba(23,19,23,.66);\r\n\r\n font-size:clamp(14px,1vw,17px);\r\n line-height:1.72;\r\n}\r\n\r\n\r\n\/* five-image editorial strip *\/\r\n\r\n.lc-st__tiles{\r\n display:grid;\r\n grid-template-columns:1.18fr .92fr .92fr .92fr 1.18fr;\r\n gap:clamp(8px,.9vw,16px);\r\n\r\n height:clamp(330px,42vh,470px);\r\n}\r\n\r\n.lc-st__tile{\r\n --tile-shift:0px;\r\n\r\n position:relative;\r\n overflow:hidden;\r\n\r\n appearance:none;\r\n border:0 !important;\r\n border-radius:0 !important;\r\n\r\n width:100%;\r\n min-width:0;\r\n height:100%;\r\n\r\n padding:0;\r\n\r\n color:var(--ivory) !important;\r\n background:var(--dusty-lilac,#C5B2C8) !important;\r\n\r\n text-align:left;\r\n cursor:pointer;\r\n\r\n \/*\r\n The stagger is part of the static composition.\r\n Hover NEVER changes card geometry.\r\n *\/\r\n transform:translateY(var(--tile-shift));\r\n\r\n box-shadow:\r\n inset 0 0 0 1px rgba(43,20,47,.06);\r\n\r\n transition:\r\n box-shadow .65s ease;\r\n}\r\n\r\n.lc-st__tile:nth-child(2){\r\n --tile-shift:20px;\r\n}\r\n\r\n.lc-st__tile:nth-child(4){\r\n --tile-shift:20px;\r\n}\r\n\r\n.lc-st__tile-media,\r\n.lc-st__tile-media img{\r\n position:absolute;\r\n inset:0;\r\n\r\n width:100%;\r\n height:100%;\r\n}\r\n\r\n.lc-st__tile-media{\r\n background:\r\n linear-gradient(\r\n 145deg,\r\n #E8E1E4 0%,\r\n #C5B2C8 48%,\r\n #94709A 100%\r\n );\r\n\r\n overflow:hidden;\r\n\r\n will-change:transform;\r\n transform:translate3d(0,0,0);\r\n\r\n transition:\r\n transform 1.9s cubic-bezier(.22,1,.36,1);\r\n}\r\n\r\n.lc-st__tile-media img{\r\n object-fit:cover;\r\n object-position:center;\r\n\r\n filter:\r\n saturate(.90)\r\n contrast(.99)\r\n brightness(.92);\r\n\r\n transform:\r\n scale(1.015)\r\n translate3d(0,0,0);\r\n\r\n \/*\r\n First-panel hover must be visible and smooth.\r\n *\/\r\n transform-origin:center center;\r\n will-change:transform,filter;\r\n\r\n transition:\r\n transform 1.9s cubic-bezier(.22,1,.36,1),\r\n filter 1.6s ease;\r\n}\r\n\r\n.lc-st__tile::after{\r\n content:\"\";\r\n\r\n position:absolute;\r\n z-index:1;\r\n inset:0;\r\n\r\n background:\r\n linear-gradient(\r\n 180deg,\r\n rgba(43,20,47,.02) 20%,\r\n rgba(43,20,47,.10) 57%,\r\n rgba(43,20,47,.62) 100%\r\n );\r\n\r\n opacity:1;\r\n\r\n pointer-events:none;\r\n\r\n transition:\r\n opacity 1.35s ease;\r\n}\r\n\r\n\/*\r\n Removed permanently.\r\n No blooming blobs, blur patches, moving light shapes or hover veils.\r\n*\/\r\n.lc-st__tile-shade{\r\n display:none !important;\r\n}\r\n\r\n.lc-st__tile-copy{\r\n position:absolute;\r\n z-index:3;\r\n\r\n left:clamp(16px,1.5vw,24px);\r\n right:clamp(16px,1.5vw,24px);\r\n bottom:clamp(16px,1.6vw,24px);\r\n\r\n pointer-events:none;\r\n}\r\n\r\n.lc-st__tile-index{\r\n display:block;\r\n\r\n margin-bottom:9px;\r\n\r\n color:rgba(247,242,234,.68);\r\n\r\n font-size:7px;\r\n line-height:1;\r\n font-weight:600;\r\n letter-spacing:.15em;\r\n text-transform:uppercase;\r\n}\r\n\r\n.lc-st__tile-name{\r\n display:block;\r\n\r\n max-width:11ch;\r\n\r\n color:var(--ivory);\r\n\r\n font-family:\"Cormorant Garamond\",Georgia,serif;\r\n font-size:clamp(25px,2vw,36px);\r\n line-height:.92;\r\n font-weight:500;\r\n letter-spacing:-.03em;\r\n}\r\n\r\n.lc-st__tile-open{\r\n display:block;\r\n\r\n margin-top:13px;\r\n\r\n color:rgba(247,242,234,.72);\r\n\r\n font-size:8px;\r\n line-height:1;\r\n font-weight:600;\r\n letter-spacing:.13em;\r\n text-transform:uppercase;\r\n\r\n transition:\r\n color 1.20s ease;\r\n}\r\n\r\n@media (hover:hover){\r\n\r\n \/*\r\n STRICT SITE-WIDE INTERACTION DIRECTION:\r\n no jumping cards, no moving text, no blobs.\r\n Only a restrained image push-in and tonal lift.\r\n *\/\r\n .lc-st__tile:hover .lc-st__tile-media,\r\n .lc-st__tile:focus-visible .lc-st__tile-media{\r\n transform:translate3d(0,-4px,0);\r\n }\r\n\r\n .lc-st__tile:hover .lc-st__tile-media img,\r\n .lc-st__tile:focus-visible .lc-st__tile-media img{\r\n transform:\r\n scale(1.09)\r\n translate3d(0,-1.2%,0);\r\n\r\n filter:\r\n saturate(1.03)\r\n contrast(1.01)\r\n brightness(1);\r\n }\r\n\r\n .lc-st__tile:hover::after,\r\n .lc-st__tile:focus-visible::after{\r\n opacity:.82;\r\n }\r\n\r\n .lc-st__tile:hover .lc-st__tile-open,\r\n .lc-st__tile:focus-visible .lc-st__tile-open{\r\n color:var(--champagne);\r\n }\r\n\r\n .lc-st__tile:focus-visible{\r\n outline:1px solid rgba(122,63,134,.76) !important;\r\n outline-offset:-1px;\r\n }\r\n\r\n}\r\n\r\n\r\n\r\n\r\n\/* First-panel image hover fallback for embedded\/Elementor previews. *\/\r\n#lamina-service-track .lc-st__tile:hover .lc-st__tile-media,\r\n#lamina-service-track .lc-st__tile:focus-visible .lc-st__tile-media{\r\n transform:translate3d(0,-4px,0);\r\n}\r\n\r\n#lamina-service-track .lc-st__tile:hover .lc-st__tile-media img,\r\n#lamina-service-track .lc-st__tile:focus-visible .lc-st__tile-media img{\r\n transform:\r\n scale(1.09)\r\n translate3d(0,-1.2%,0);\r\n\r\n filter:\r\n saturate(1.03)\r\n contrast(1.01)\r\n brightness(1);\r\n}\r\n\r\n\r\n\/* =========================================================\r\n SERVICE SLIDES\r\n ========================================================= *\/\r\n\r\n.lc-st__service{\r\n display:grid;\r\n grid-template-columns:minmax(0,1.18fr) minmax(340px,.82fr);\r\n\r\n background:var(--aubergine-deep);\r\n}\r\n\r\n\r\n\/* image half *\/\r\n\r\n.lc-st__visual{\r\n position:relative;\r\n overflow:hidden;\r\n\r\n min-width:0;\r\n\r\n background:\r\n linear-gradient(\r\n 145deg,\r\n #150717,\r\n #25102A\r\n );\r\n}\r\n\r\n.lc-st__visual img{\r\n position:absolute;\r\n inset:0;\r\n\r\n width:100%;\r\n height:100%;\r\n\r\n object-fit:cover;\r\n object-position:center;\r\n\r\n filter:\r\n saturate(.91)\r\n brightness(.86)\r\n contrast(1.02);\r\n\r\n transform:scale(1.025);\r\n\r\n transition:\r\n transform 6.5s cubic-bezier(.2,.6,.2,1),\r\n filter 1.1s ease;\r\n\r\n pointer-events:none;\r\n user-select:none;\r\n}\r\n\r\n.lc-st__slide.is-active .lc-st__visual img{\r\n transform:scale(1.075);\r\n\r\n filter:\r\n saturate(1)\r\n brightness(.94)\r\n contrast(1.02);\r\n}\r\n\r\n.lc-st__visual::after{\r\n content:\"\";\r\n\r\n position:absolute;\r\n z-index:1;\r\n inset:0;\r\n\r\n background:\r\n linear-gradient(\r\n 90deg,\r\n rgba(13,5,15,.18) 0%,\r\n rgba(21,7,23,.04) 56%,\r\n rgba(50,18,58,.46) 100%\r\n );\r\n\r\n pointer-events:none;\r\n}\r\n\r\n\r\n\/* text half *\/\r\n\r\n.lc-st__content{\r\n position:relative;\r\n\r\n padding:\r\n clamp(72px,8.5vh,108px)\r\n clamp(34px,4.2vw,74px);\r\n\r\n display:flex;\r\n flex-direction:column;\r\n justify-content:center;\r\n\r\n color:var(--ink);\r\n\r\n background:\r\n radial-gradient(\r\n 78% 62% at 95% 4%,\r\n rgba(216,196,161,.18),\r\n transparent 64%\r\n ),\r\n radial-gradient(\r\n 54% 50% at 4% 96%,\r\n rgba(197,178,200,.11),\r\n transparent 72%\r\n ),\r\n linear-gradient(\r\n 145deg,\r\n #F7F2EA 0%,\r\n #F4EEE6 58%,\r\n #EFE5D7 100%\r\n );\r\n\r\n box-shadow:\r\n inset 28px 0 64px rgba(43,20,47,.045);\r\n}\r\n\r\n.lc-st__panel-number{\r\n margin:0 0 19px;\r\n\r\n color:rgba(95,36,104,.72);\r\n\r\n font-size:8px;\r\n line-height:1;\r\n font-weight:600;\r\n letter-spacing:.18em;\r\n text-transform:uppercase;\r\n}\r\n\r\n.lc-st__panel-title{\r\n margin:0;\r\n\r\n max-width:8.2ch;\r\n\r\n color:var(--aubergine);\r\n\r\n font-family:\"Cormorant Garamond\",Georgia,serif;\r\n font-size:clamp(58px,5vw,96px);\r\n line-height:.84;\r\n font-weight:400;\r\n letter-spacing:-.05em;\r\n}\r\n\r\n.lc-st__panel-title em{\r\n color:#7A3F86;\r\n\r\n font-style:italic;\r\n font-weight:400;\r\n}\r\n\r\n.lc-st__panel-desc{\r\n margin:\r\n clamp(25px,3vh,34px)\r\n 0\r\n 0;\r\n\r\n max-width:38ch;\r\n\r\n color:rgba(247,242,234,.72);\r\n\r\n font-size:clamp(13px,.94vw,16px);\r\n line-height:1.72;\r\n}\r\n\r\n.lc-st__services{\r\n margin-top:clamp(28px,3.5vh,42px);\r\n\r\n display:grid;\r\n grid-template-columns:repeat(2,minmax(0,1fr));\r\n\r\n border-top:1px solid rgba(216,196,161,.62);\r\n}\r\n\r\n.lc-st__service-name{\r\n min-width:0;\r\n\r\n padding:\r\n 12px\r\n 10px\r\n 12px\r\n 0;\r\n\r\n border-bottom:1px solid rgba(216,196,161,.48);\r\n\r\n color:rgba(43,20,47,.78);\r\n\r\n font-size:8px;\r\n line-height:1.45;\r\n font-weight:500;\r\n letter-spacing:.07em;\r\n text-transform:uppercase;\r\n}\r\n\r\n.lc-st__service-name:nth-child(2n){\r\n padding-left:10px;\r\n border-left:1px solid rgba(216,196,161,.48);\r\n}\r\n\r\n\r\n\/* =========================================================\r\n TRANSITION DETAIL\r\n Only small text children receive staggered movement.\r\n The heavy blur stays on the WHOLE slide.\r\n ========================================================= *\/\r\n\r\n.lc-st__service .lc-st__content > *{\r\n opacity:0;\r\n\r\n transform:translate3d(0,18px,0);\r\n\r\n transition:\r\n opacity .62s ease,\r\n transform .86s var(--motion);\r\n}\r\n\r\n.lc-st__service.is-active .lc-st__content > *{\r\n opacity:1;\r\n\r\n transform:translate3d(0,0,0);\r\n}\r\n\r\n.lc-st__service.is-active .lc-st__content > :nth-child(1){\r\n transition-delay:.12s;\r\n}\r\n\r\n.lc-st__service.is-active .lc-st__content > :nth-child(2){\r\n transition-delay:.18s;\r\n}\r\n\r\n.lc-st__service.is-active .lc-st__content > :nth-child(3){\r\n transition-delay:.25s;\r\n}\r\n\r\n.lc-st__service.is-active .lc-st__content > :nth-child(4){\r\n transition-delay:.32s;\r\n}\r\n\r\n\r\n\/* =========================================================\r\n PROGRESS\r\n ========================================================= *\/\r\n\r\n.lc-st__progress{\r\n position:absolute;\r\n z-index:30;\r\n\r\n right:clamp(16px,2vw,30px);\r\n top:50%;\r\n\r\n display:grid;\r\n gap:9px;\r\n\r\n transform:translateY(-50%);\r\n\r\n pointer-events:none;\r\n}\r\n\r\n.lc-st__dot{\r\n width:5px;\r\n height:24px;\r\n\r\n border-radius:999px;\r\n\r\n background:rgba(216,196,161,.34);\r\n\r\n transform:scaleY(.22);\r\n\r\n transition:\r\n transform .46s var(--motion),\r\n background-color .36s ease;\r\n}\r\n\r\n.lc-st__dot.is-active{\r\n transform:scaleY(1);\r\n\r\n background:var(--plum);\r\n}\r\n\r\n\r\n\/* =========================================================\r\n DIRECT-CLICK BLUR VEIL\r\n ========================================================= *\/\r\n\r\n.lc-st__jumpveil{\r\n position:fixed;\r\n z-index:99999;\r\n inset:0;\r\n\r\n pointer-events:none;\r\n\r\n opacity:0;\r\n visibility:hidden;\r\n\r\n background:rgba(23,19,23,.07);\r\n\r\n backdrop-filter:blur(0);\r\n -webkit-backdrop-filter:blur(0);\r\n\r\n transition:\r\n opacity .40s var(--motion),\r\n backdrop-filter .52s var(--motion),\r\n -webkit-backdrop-filter .52s var(--motion),\r\n visibility 0s linear .62s;\r\n}\r\n\r\n.lc-st__jumpveil.is-active{\r\n opacity:1;\r\n visibility:visible;\r\n\r\n backdrop-filter:blur(24px);\r\n -webkit-backdrop-filter:blur(24px);\r\n\r\n transition:\r\n opacity .40s var(--motion),\r\n backdrop-filter .52s var(--motion),\r\n -webkit-backdrop-filter .52s var(--motion),\r\n visibility 0s;\r\n}\r\n\r\n\r\n\/* =========================================================\r\n TABLET\r\n Desktop master-track behavior remains intact.\r\n ========================================================= *\/\r\n\r\n@media (max-width:1024px) and (min-width:701px){\r\n #lamina-service-track{height:590vh;}\r\n .lc-st__service{grid-template-columns:1fr 1fr;}\r\n .lc-st__content{padding:68px clamp(28px,4vw,44px);}\r\n}\r\n\r\n\/* =========================================================\r\n V19 \u2014 PHONE-ONLY REBUILD\r\n COMPLETELY DIFFERENT MOBILE EXPERIENCE\r\n\r\n No 560vh master track.\r\n No sticky 100svh camera.\r\n No slide replacement.\r\n No jump veil.\r\n\r\n Phone becomes a normal editorial document:\r\n intro + horizontal chooser + five service chapters.\r\n ========================================================= *\/\r\n\r\n@media (max-width:700px){\r\n #lamina-service-track{\r\n height:auto !important;\r\n min-height:0;\r\n overflow:visible;\r\n background:#F7F2EA;\r\n }\r\n\r\n .lc-st__camera{\r\n position:relative !important;\r\n top:auto !important;\r\n width:100%;\r\n height:auto !important;\r\n overflow:visible !important;\r\n background:transparent;\r\n }\r\n\r\n .lc-st__slide,\r\n .lc-st__slide.is-active,\r\n .lc-st__slide.is-transitioning-out{\r\n position:relative !important;\r\n inset:auto !important;\r\n width:100%;\r\n height:auto !important;\r\n min-height:0;\r\n opacity:1 !important;\r\n visibility:visible !important;\r\n filter:none !important;\r\n transform:none !important;\r\n pointer-events:auto !important;\r\n transition:none !important;\r\n contain:none;\r\n will-change:auto;\r\n }\r\n\r\n \/* ---------- intro ---------- *\/\r\n .lc-st__intro{\r\n position:relative;\r\n inset:auto;\r\n min-height:100svh;\r\n height:auto;\r\n padding:max(82px,calc(62px + env(safe-area-inset-top))) 18px 46px;\r\n display:block;\r\n color:var(--lc-ivory);\r\n background:\r\n radial-gradient(78% 54% at 96% 2%,rgba(148,112,154,.19),transparent 66%),\r\n radial-gradient(65% 48% at 0% 92%,rgba(95,36,104,.24),transparent 72%),\r\n linear-gradient(155deg,#3A183F 0%,#2B142F 54%,#211023 100%) !important;\r\n }\r\n\r\n .lc-st__intro-inner{width:100%;margin:0;}\r\n .lc-st__intro-head{display:block;margin:0 0 34px;}\r\n .lc-st__eyebrow{margin-bottom:14px;font-size:11px !important;line-height:1.2 !important;letter-spacing:.16em !important;}\r\n .lc-st__intro-title{max-width:7.8ch;font-size:clamp(54px,15.4vw,70px);line-height:.88;letter-spacing:-.05em;}\r\n .lc-st__intro-copy{margin:22px 0 0;max-width:34ch;color:rgba(247,242,234,.72) !important;font-size:15px !important;line-height:1.62 !important;}\r\n\r\n \/* horizontal treatment chooser \u2014 intentionally shows the next card *\/\r\n .lc-st__tiles{\r\n display:grid;\r\n grid-auto-flow:column;\r\n grid-template-columns:none;\r\n grid-auto-columns:min(78vw,330px);\r\n gap:14px;\r\n width:calc(100% + 18px);\r\n height:auto;\r\n margin-right:-18px;\r\n padding:2px 18px 16px 0;\r\n overflow-x:auto;\r\n overflow-y:hidden;\r\n scroll-snap-type:x proximity;\r\n scroll-padding-left:0;\r\n overscroll-behavior-x:contain;\r\n -webkit-overflow-scrolling:touch;\r\n scrollbar-width:none;\r\n touch-action:pan-x pan-y;\r\n }\r\n .lc-st__tiles::-webkit-scrollbar{display:none;}\r\n\r\n .lc-st__tile,\r\n .lc-st__tile:nth-child(2),\r\n .lc-st__tile:nth-child(4){\r\n --tile-shift:0px;\r\n position:relative;\r\n width:100%;\r\n height:clamp(390px,53svh,480px);\r\n transform:none !important;\r\n scroll-snap-align:start;\r\n border-radius:10px !important;\r\n box-shadow:inset 0 0 0 1px rgba(247,242,234,.09),0 18px 44px rgba(15,5,17,.17) !important;\r\n }\r\n\r\n .lc-st__tile-media,\r\n #lamina-service-track .lc-st__tile:hover .lc-st__tile-media,\r\n #lamina-service-track .lc-st__tile:focus-visible .lc-st__tile-media{transform:none !important;transition:none;}\r\n\r\n .lc-st__tile-media img,\r\n #lamina-service-track .lc-st__tile:hover .lc-st__tile-media img,\r\n #lamina-service-track .lc-st__tile:focus-visible .lc-st__tile-media img{\r\n transform:scale(1.035) !important;\r\n filter:saturate(.96) contrast(1) brightness(.93) !important;\r\n transition:none;\r\n }\r\n\r\n .lc-st__tile-copy{left:18px;right:18px;bottom:18px;}\r\n .lc-st__tile-index{margin-bottom:8px;font-size:10.5px !important;line-height:1.15 !important;}\r\n .lc-st__tile-name{max-width:9.5ch;font-size:clamp(31px,9.5vw,40px) !important;line-height:.95 !important;}\r\n .lc-st__tile-open{margin-top:12px;font-size:10.5px !important;}\r\n\r\n \/* ---------- service chapters ---------- *\/\r\n .lc-st__service{\r\n display:block !important;\r\n min-height:0;\r\n padding:0 0 34px;\r\n background:#F7F2EA !important;\r\n border-top:1px solid rgba(95,36,104,.10);\r\n }\r\n\r\n .lc-st__visual{\r\n position:relative !important;\r\n inset:auto !important;\r\n width:100%;\r\n height:clamp(360px,54svh,520px);\r\n overflow:hidden;\r\n background:linear-gradient(145deg,#171317,#2B142F) !important;\r\n }\r\n\r\n .lc-st__visual img{\r\n position:absolute;\r\n inset:0;\r\n width:100%;\r\n height:100%;\r\n object-fit:cover;\r\n transform:scale(1.035);\r\n filter:saturate(.96) brightness(.90) contrast(1.01);\r\n transition:transform 1.2s var(--motion),filter .9s ease;\r\n }\r\n\r\n .lc-st__service.is-mobile-current .lc-st__visual img{\r\n transform:scale(1.065);\r\n filter:saturate(1) brightness(.95) contrast(1.01);\r\n }\r\n\r\n .lc-st__visual::after{\r\n background:linear-gradient(180deg,rgba(23,19,23,.03) 0%,rgba(43,20,47,.05) 58%,rgba(43,20,47,.44) 100%) !important;\r\n }\r\n\r\n .lc-st__content{\r\n position:relative !important;\r\n inset:auto !important;\r\n z-index:3;\r\n width:calc(100% - 24px);\r\n margin:-30px 12px 0;\r\n padding:29px 18px 26px;\r\n display:block;\r\n overflow:visible;\r\n color:var(--lc-ink) !important;\r\n background:\r\n radial-gradient(86% 54% at 100% 0%,rgba(216,196,161,.14),transparent 66%),\r\n linear-gradient(145deg,#F7F2EA 0%,#F4ECE2 100%) !important;\r\n box-shadow:0 -16px 42px rgba(43,20,47,.08) !important;\r\n }\r\n\r\n .lc-st__service .lc-st__content > *,\r\n .lc-st__service.is-active .lc-st__content > *{\r\n opacity:1 !important;\r\n transform:none !important;\r\n transition:none !important;\r\n }\r\n\r\n .lc-st__panel-number{margin:0 0 11px;font-size:11px !important;line-height:1.2 !important;letter-spacing:.14em !important;}\r\n .lc-st__panel-title{max-width:8.2ch;font-size:clamp(47px,13.8vw,61px);line-height:.86;}\r\n .lc-st__panel-desc{margin-top:19px;max-width:34ch;color:rgba(23,19,23,.70) !important;font-size:15px !important;line-height:1.60 !important;}\r\n\r\n .lc-st__services{margin-top:23px;display:block;border-top:1px solid rgba(216,196,161,.78) !important;}\r\n .lc-st__service-name,\r\n .lc-st__service-name:nth-child(2n){\r\n display:block;\r\n min-height:0;\r\n padding:12px 0 !important;\r\n border-left:0 !important;\r\n border-bottom:1px solid rgba(216,196,161,.56) !important;\r\n color:rgba(43,20,47,.82) !important;\r\n font-size:12.5px !important;\r\n line-height:1.42 !important;\r\n letter-spacing:.045em !important;\r\n }\r\n\r\n .lc-st__progress,.lc-st__jumpveil{display:none !important;}\r\n\r\n \/* phone-specific focal depth; driven by the existing single rAF scroll loop *\/\r\n .lc-st__intro-head,\r\n .lc-st__tiles,\r\n .lc-st__service .lc-st__visual,\r\n .lc-st__service .lc-st__content{\r\n --lc-mobile-depth-blur:0px;\r\n --lc-mobile-depth-opacity:1;\r\n --lc-mobile-depth-y:0px;\r\n filter:blur(var(--lc-mobile-depth-blur));\r\n opacity:var(--lc-mobile-depth-opacity);\r\n translate:0 var(--lc-mobile-depth-y);\r\n }\r\n}\r\n\r\n@media (max-width:390px){\r\n .lc-st__intro{padding-left:16px;padding-right:16px;}\r\n .lc-st__tiles{width:calc(100% + 16px);margin-right:-16px;padding-right:16px;grid-auto-columns:min(82vw,312px);}\r\n .lc-st__tile{height:clamp(372px,51svh,452px);}\r\n .lc-st__content{width:calc(100% - 20px);margin-left:10px;margin-right:10px;padding-left:16px;padding-right:16px;}\r\n .lc-st__panel-title{font-size:clamp(44px,13.2vw,56px);}\r\n}\r\n\r\n\/* =========================================================\r\n REDUCED MOTION\r\n ========================================================= *\/\r\n\r\n@media (prefers-reduced-motion:reduce){\r\n\r\n #lamina-service-track{\r\n height:auto;\r\n }\r\n\r\n .lc-st__camera{\r\n position:relative;\r\n\r\n height:auto;\r\n\r\n overflow:visible;\r\n }\r\n\r\n .lc-st__slide{\r\n position:relative;\r\n\r\n min-height:100svh;\r\n\r\n opacity:1 !important;\r\n visibility:visible !important;\r\n\r\n filter:none !important;\r\n transform:none !important;\r\n\r\n pointer-events:auto !important;\r\n\r\n transition:none !important;\r\n }\r\n\r\n .lc-st__service .lc-st__content > *{\r\n opacity:1 !important;\r\n transform:none !important;\r\n transition:none !important;\r\n }\r\n\r\n .lc-st__progress,\r\n .lc-st__jumpveil{\r\n display:none !important;\r\n }\r\n\r\n}\r\n\r\n\r\n\/* =========================================================\r\n V17 \u2014 FINAL LAMINA COLOR SYSTEM\r\n Scoped overrides only. No layout, motion, scroll or JS changes.\r\n ========================================================= *\/\r\n\r\n#lamina-service-track{\r\n --lc-aubergine:#2B142F;\r\n --lc-plum:#5F2468;\r\n --lc-title-purple:#7A3F86;\r\n --lc-orchid:#94709A;\r\n --lc-lilac:#C5B2C8;\r\n --lc-ivory:#F7F2EA;\r\n --lc-champagne:#D8C4A1;\r\n --lc-ink:#171317;\r\n --lc-stone:#E8E1E4;\r\n}\r\n\r\n\r\n\/* ---------- FIRST PANEL ---------- *\/\r\n\r\n#lamina-service-track .lc-st__intro{\r\n color:var(--lc-ivory);\r\n\r\n background:\r\n radial-gradient(\r\n 50% 42% at 88% 8%,\r\n rgba(148,112,154,.16),\r\n transparent 72%\r\n ),\r\n radial-gradient(\r\n 42% 34% at 10% 92%,\r\n rgba(216,196,161,.08),\r\n transparent 74%\r\n ),\r\n linear-gradient(\r\n 145deg,\r\n #3A183F 0%,\r\n #2B142F 54%,\r\n #241027 100%\r\n ) !important;\r\n}\r\n\r\n#lamina-service-track .lc-st__eyebrow{\r\n color:var(--lc-champagne) !important;\r\n}\r\n\r\n#lamina-service-track .lc-st__intro-title{\r\n color:var(--lc-ivory) !important;\r\n}\r\n\r\n#lamina-service-track .lc-st__intro-title em{\r\n color:var(--lc-lilac) !important;\r\n}\r\n\r\n#lamina-service-track .lc-st__intro-copy{\r\n color:rgba(247,242,234,.72) !important;\r\n}\r\n\r\n\r\n\/* first-panel image cards \/ placeholders *\/\r\n\r\n#lamina-service-track .lc-st__tile{\r\n color:var(--lc-ivory) !important;\r\n background:var(--lc-stone) !important;\r\n box-shadow:\r\n inset 0 0 0 1px rgba(247,242,234,.08) !important;\r\n}\r\n\r\n#lamina-service-track .lc-st__tile-media{\r\n background:\r\n linear-gradient(\r\n 145deg,\r\n #E8E1E4 0%,\r\n #C5B2C8 48%,\r\n #94709A 100%\r\n ) !important;\r\n}\r\n\r\n#lamina-service-track .lc-st__tile::after{\r\n background:\r\n linear-gradient(\r\n 180deg,\r\n rgba(43,20,47,.02) 18%,\r\n rgba(43,20,47,.10) 54%,\r\n rgba(43,20,47,.68) 100%\r\n ) !important;\r\n}\r\n\r\n#lamina-service-track .lc-st__tile-index{\r\n color:var(--lc-champagne) !important;\r\n}\r\n\r\n#lamina-service-track .lc-st__tile-name{\r\n color:var(--lc-ivory) !important;\r\n}\r\n\r\n#lamina-service-track .lc-st__tile-open{\r\n color:rgba(247,242,234,.68) !important;\r\n}\r\n\r\n#lamina-service-track .lc-st__tile:hover .lc-st__tile-open,\r\n#lamina-service-track .lc-st__tile:focus-visible .lc-st__tile-open{\r\n color:var(--lc-champagne) !important;\r\n}\r\n\r\n\r\n\/* ---------- SERVICE PANELS ---------- *\/\r\n\r\n\/* left\/image side *\/\r\n\r\n#lamina-service-track .lc-st__service{\r\n background:var(--lc-aubergine) !important;\r\n}\r\n\r\n#lamina-service-track .lc-st__visual{\r\n background:\r\n linear-gradient(\r\n 145deg,\r\n #171317 0%,\r\n #241027 50%,\r\n #2B142F 100%\r\n ) !important;\r\n}\r\n\r\n#lamina-service-track .lc-st__visual::after{\r\n background:\r\n linear-gradient(\r\n 90deg,\r\n rgba(23,19,23,.18) 0%,\r\n rgba(43,20,47,.05) 56%,\r\n rgba(43,20,47,.42) 100%\r\n ) !important;\r\n}\r\n\r\n\r\n\/* right\/content side *\/\r\n\r\n#lamina-service-track .lc-st__content{\r\n color:var(--lc-ink) !important;\r\n\r\n background:\r\n radial-gradient(\r\n 72% 58% at 94% 4%,\r\n rgba(216,196,161,.14),\r\n transparent 64%\r\n ),\r\n radial-gradient(\r\n 52% 46% at 6% 96%,\r\n rgba(197,178,200,.10),\r\n transparent 72%\r\n ),\r\n linear-gradient(\r\n 145deg,\r\n #F7F2EA 0%,\r\n #F6F0E8 64%,\r\n #F1E7DA 100%\r\n ) !important;\r\n\r\n box-shadow:\r\n inset 28px 0 64px rgba(43,20,47,.035) !important;\r\n}\r\n\r\n#lamina-service-track .lc-st__panel-number{\r\n color:var(--lc-plum) !important;\r\n}\r\n\r\n#lamina-service-track .lc-st__panel-title{\r\n color:var(--lc-ink) !important;\r\n}\r\n\r\n#lamina-service-track .lc-st__panel-title em{\r\n color:var(--lc-title-purple) !important;\r\n}\r\n\r\n#lamina-service-track .lc-st__panel-desc{\r\n color:rgba(23,19,23,.68) !important;\r\n}\r\n\r\n#lamina-service-track .lc-st__services{\r\n border-top-color:rgba(216,196,161,.74) !important;\r\n}\r\n\r\n#lamina-service-track .lc-st__service-name{\r\n color:rgba(43,20,47,.82) !important;\r\n border-bottom-color:rgba(216,196,161,.56) !important;\r\n}\r\n\r\n#lamina-service-track .lc-st__service-name:nth-child(2n){\r\n border-left-color:rgba(216,196,161,.56) !important;\r\n}\r\n\r\n\r\n\/* progress *\/\r\n\r\n#lamina-service-track .lc-st__dot{\r\n background:rgba(148,112,154,.34) !important;\r\n}\r\n\r\n#lamina-service-track .lc-st__dot.is-active{\r\n background:var(--lc-plum) !important;\r\n}\r\n\r\n\r\n\/* direct-jump transition stays neutral, never purple *\/\r\n\r\n#lamina-service-track .lc-st__jumpveil{\r\n background:rgba(23,19,23,.07) !important;\r\n}\r\n\r\n\r\n\/* mobile color system follows the same Lamina palette *\/\r\n@media (max-width:700px){\r\n #lamina-service-track .lc-st__content{color:var(--lc-ink) !important;}\r\n #lamina-service-track .lc-st__panel-title{color:var(--lc-ink) !important;}\r\n #lamina-service-track .lc-st__panel-title em{color:var(--lc-title-purple) !important;}\r\n #lamina-service-track .lc-st__panel-desc{color:rgba(23,19,23,.70) !important;}\r\n}\r\n\r\n\/* =========================================================\r\n V18 \u2014 READABILITY TYPOGRAPHY PASS\r\n General Lamina rule:\r\n - no decorative\/UI text below ~11px\r\n - body\/supporting copy stays comfortably readable\r\n - mobile text is never compressed into tiny 7\u20139px labels\r\n ========================================================= *\/\r\n\r\n\/* First-panel supporting text *\/\r\n#lamina-service-track .lc-st__eyebrow{\r\n font-size:clamp(11px,.72vw,13px) !important;\r\n line-height:1.2 !important;\r\n letter-spacing:.17em !important;\r\n}\r\n\r\n#lamina-service-track .lc-st__intro-copy{\r\n font-size:clamp(16px,1.05vw,18px) !important;\r\n line-height:1.72 !important;\r\n}\r\n\r\n\/* First-panel image-card text *\/\r\n#lamina-service-track .lc-st__tile-index{\r\n font-size:clamp(10px,.68vw,12px) !important;\r\n line-height:1.15 !important;\r\n letter-spacing:.12em !important;\r\n}\r\n\r\n#lamina-service-track .lc-st__tile-name{\r\n font-size:clamp(27px,2.05vw,38px) !important;\r\n line-height:.96 !important;\r\n}\r\n\r\n#lamina-service-track .lc-st__tile-open{\r\n font-size:clamp(10px,.68vw,12px) !important;\r\n line-height:1.2 !important;\r\n letter-spacing:.11em !important;\r\n}\r\n\r\n\/* Service-panel metadata + body *\/\r\n#lamina-service-track .lc-st__panel-number{\r\n font-size:clamp(11px,.72vw,13px) !important;\r\n line-height:1.2 !important;\r\n letter-spacing:.15em !important;\r\n}\r\n\r\n#lamina-service-track .lc-st__panel-desc{\r\n font-size:clamp(16px,1.02vw,18px) !important;\r\n line-height:1.68 !important;\r\n}\r\n\r\n#lamina-service-track .lc-st__service-name{\r\n font-size:clamp(11px,.76vw,13px) !important;\r\n line-height:1.45 !important;\r\n letter-spacing:.055em !important;\r\n}\r\n\r\n\/* Tablet *\/\r\n@media (max-width:1024px){\r\n\r\n #lamina-service-track .lc-st__eyebrow{\r\n font-size:11px !important;\r\n }\r\n\r\n #lamina-service-track .lc-st__intro-copy{\r\n font-size:16px !important;\r\n }\r\n\r\n #lamina-service-track .lc-st__tile-index,\r\n #lamina-service-track .lc-st__tile-open{\r\n font-size:10px !important;\r\n }\r\n\r\n #lamina-service-track .lc-st__panel-number{\r\n font-size:11px !important;\r\n }\r\n\r\n #lamina-service-track .lc-st__panel-desc{\r\n font-size:16px !important;\r\n }\r\n\r\n #lamina-service-track .lc-st__service-name{\r\n font-size:11px !important;\r\n }\r\n\r\n}\r\n\r\n\/* Mobile \u2014 explicit readability floor for the rebuilt phone layout *\/\r\n@media (max-width:700px){\r\n #lamina-service-track .lc-st__eyebrow{font-size:11px !important;line-height:1.25 !important;}\r\n #lamina-service-track .lc-st__intro-copy{font-size:15px !important;line-height:1.62 !important;}\r\n #lamina-service-track .lc-st__tile-index,#lamina-service-track .lc-st__tile-open{font-size:10.5px !important;}\r\n #lamina-service-track .lc-st__tile-name{font-size:clamp(31px,9.5vw,40px) !important;line-height:.95 !important;}\r\n #lamina-service-track .lc-st__panel-number{font-size:11px !important;}\r\n #lamina-service-track .lc-st__panel-desc{font-size:15px !important;line-height:1.60 !important;}\r\n #lamina-service-track .lc-st__service-name{font-size:12.5px !important;line-height:1.42 !important;}\r\n}\r\n<\/style>\r\n\r\n\r\n<section\r\n id=\"lamina-service-track\"\r\n aria-label=\"Lamina treatment services\"\r\n>\r\n\r\n\r\n <div class=\"lc-st__camera\">\r\n\r\n\r\n <!-- ===================================================\r\n SLIDE 00 \u2014 SERVICE SELECTOR\r\n =================================================== -->\r\n\r\n <article\r\n class=\"lc-st__slide lc-st__intro is-active\"\r\n data-slide=\"0\"\r\n aria-hidden=\"false\"\r\n >\r\n\r\n <div class=\"lc-st__intro-inner\">\r\n\r\n <header class=\"lc-st__intro-head\">\r\n\r\n <div>\r\n\r\n <p class=\"lc-st__eyebrow\">\r\n Hair \u00b7 Dental \u00b7 Istanbul\r\n <\/p>\r\n\r\n <h2 class=\"lc-st__intro-title\">\r\n Choose what\r\n <em>matters to you.<\/em>\r\n <\/h2>\r\n\r\n <\/div>\r\n\r\n <p class=\"lc-st__intro-copy\">\r\n Explore Lamina by treatment area. Scroll naturally to continue,\r\n or choose a service below to move directly into its treatment panel.\r\n <\/p>\r\n\r\n <\/header>\r\n\r\n\r\n <div\r\n class=\"lc-st__tiles\"\r\n aria-label=\"Choose a treatment area\"\r\n >\r\n\r\n <button\r\n class=\"lc-st__tile\"\r\n type=\"button\"\r\n data-target-slide=\"1\"\r\n aria-label=\"Open Hair Restoration\"\r\n >\r\n <span class=\"lc-st__tile-media\">\r\n <img decoding=\"async\"\r\n src=\"assets\/services\/hair-restoration.webp\"\r\n width=\"1200\"\r\n height=\"1600\"\r\n alt=\"\"\r\n aria-hidden=\"true\"\r\n onerror=\"this.style.display='none'\"\r\n >\r\n <\/span>\r\n\r\n <span class=\"lc-st__tile-shade\" aria-hidden=\"true\"><\/span>\r\n\r\n <span class=\"lc-st__tile-copy\">\r\n <span class=\"lc-st__tile-index\">01 \u00b7 Hair<\/span>\r\n <strong class=\"lc-st__tile-name\">Hair Restoration<\/strong>\r\n <span class=\"lc-st__tile-open\">Explore \u2192<\/span>\r\n <\/span>\r\n <\/button>\r\n\r\n\r\n <button\r\n class=\"lc-st__tile\"\r\n type=\"button\"\r\n data-target-slide=\"2\"\r\n aria-label=\"Open Brow and Beard Restoration\"\r\n >\r\n <span class=\"lc-st__tile-media\">\r\n <img decoding=\"async\"\r\n src=\"assets\/services\/brow-beard.webp\"\r\n width=\"1200\"\r\n height=\"1600\"\r\n alt=\"\"\r\n aria-hidden=\"true\"\r\n onerror=\"this.style.display='none'\"\r\n >\r\n <\/span>\r\n\r\n <span class=\"lc-st__tile-shade\" aria-hidden=\"true\"><\/span>\r\n\r\n <span class=\"lc-st__tile-copy\">\r\n <span class=\"lc-st__tile-index\">02 \u00b7 Hair<\/span>\r\n <strong class=\"lc-st__tile-name\">Brow & Beard<\/strong>\r\n <span class=\"lc-st__tile-open\">Explore \u2192<\/span>\r\n <\/span>\r\n <\/button>\r\n\r\n\r\n <button\r\n class=\"lc-st__tile\"\r\n type=\"button\"\r\n data-target-slide=\"3\"\r\n aria-label=\"Open Smile Aesthetics\"\r\n >\r\n <span class=\"lc-st__tile-media\">\r\n <img loading=\"lazy\" decoding=\"async\"\r\n src=\"assets\/services\/smile-design.webp\"\r\n width=\"1200\"\r\n height=\"1600\"\r\n alt=\"\"\r\n aria-hidden=\"true\"\r\n onerror=\"this.style.display='none'\"\r\n >\r\n <\/span>\r\n\r\n <span class=\"lc-st__tile-shade\" aria-hidden=\"true\"><\/span>\r\n\r\n <span class=\"lc-st__tile-copy\">\r\n <span class=\"lc-st__tile-index\">03 \u00b7 Dental<\/span>\r\n <strong class=\"lc-st__tile-name\">Smile Design<\/strong>\r\n <span class=\"lc-st__tile-open\">Explore \u2192<\/span>\r\n <\/span>\r\n <\/button>\r\n\r\n\r\n <button\r\n class=\"lc-st__tile\"\r\n type=\"button\"\r\n data-target-slide=\"4\"\r\n aria-label=\"Open Crowns and Dental Care\"\r\n >\r\n <span class=\"lc-st__tile-media\">\r\n <img loading=\"lazy\" decoding=\"async\"\r\n src=\"assets\/services\/crowns.webp\"\r\n width=\"1200\"\r\n height=\"1600\"\r\n alt=\"\"\r\n aria-hidden=\"true\"\r\n onerror=\"this.style.display='none'\"\r\n >\r\n <\/span>\r\n\r\n <span class=\"lc-st__tile-shade\" aria-hidden=\"true\"><\/span>\r\n\r\n <span class=\"lc-st__tile-copy\">\r\n <span class=\"lc-st__tile-index\">04 \u00b7 Dental<\/span>\r\n <strong class=\"lc-st__tile-name\">Crowns & Care<\/strong>\r\n <span class=\"lc-st__tile-open\">Explore \u2192<\/span>\r\n <\/span>\r\n <\/button>\r\n\r\n\r\n <button\r\n class=\"lc-st__tile\"\r\n type=\"button\"\r\n data-target-slide=\"5\"\r\n aria-label=\"Open Dental Implants\"\r\n >\r\n <span class=\"lc-st__tile-media\">\r\n <img loading=\"lazy\" decoding=\"async\"\r\n src=\"assets\/services\/implants.webp\"\r\n width=\"1200\"\r\n height=\"1600\"\r\n alt=\"\"\r\n aria-hidden=\"true\"\r\n onerror=\"this.style.display='none'\"\r\n >\r\n <\/span>\r\n\r\n <span class=\"lc-st__tile-shade\" aria-hidden=\"true\"><\/span>\r\n\r\n <span class=\"lc-st__tile-copy\">\r\n <span class=\"lc-st__tile-index\">05 \u00b7 Dental<\/span>\r\n <strong class=\"lc-st__tile-name\">Dental Implants<\/strong>\r\n <span class=\"lc-st__tile-open\">Explore \u2192<\/span>\r\n <\/span>\r\n <\/button>\r\n\r\n <\/div>\r\n\r\n <\/div>\r\n\r\n <\/article>\r\n\r\n\r\n <!-- ===================================================\r\n SLIDE 01 \u2014 HAIR RESTORATION\r\n =================================================== -->\r\n\r\n <article\r\n class=\"lc-st__slide lc-st__service\"\r\n data-slide=\"1\"\r\n aria-hidden=\"true\"\r\n >\r\n\r\n <div class=\"lc-st__visual\">\r\n <img loading=\"lazy\" decoding=\"async\"\r\n src=\"assets\/services\/hair-restoration.webp\"\r\n width=\"1600\"\r\n height=\"2000\"\r\n alt=\"\"\r\n aria-hidden=\"true\"\r\n onerror=\"this.style.display='none'\"\r\n >\r\n <\/div>\r\n\r\n\r\n <div class=\"lc-st__content\">\r\n\r\n <p class=\"lc-st__panel-number\">\r\n 01 \/ 05 \u00b7 Hair\r\n <\/p>\r\n\r\n\r\n <h3 class=\"lc-st__panel-title\">\r\n Hair <em>Restoration.<\/em>\r\n <\/h3>\r\n\r\n\r\n <p class=\"lc-st__panel-desc\">\r\n Hair-transplant techniques selected around donor area,\r\n hair characteristics, treatment goals and medical assessment.\r\n <\/p>\r\n\r\n\r\n <div class=\"lc-st__services\">\r\n <span class=\"lc-st__service-name\">Sapphire FUE<\/span>\r\n <span class=\"lc-st__service-name\">DHI<\/span>\r\n <span class=\"lc-st__service-name\">FUE<\/span>\r\n <span class=\"lc-st__service-name\">Unshaven Hair Transplant<\/span>\r\n <span class=\"lc-st__service-name\">Female Hair Transplant<\/span>\r\n <\/div>\r\n\r\n <\/div>\r\n\r\n <\/article>\r\n\r\n\r\n\r\n <!-- ===================================================\r\n SLIDE 02 \u2014 BROW & BEARD\r\n =================================================== -->\r\n\r\n <article\r\n class=\"lc-st__slide lc-st__service\"\r\n data-slide=\"2\"\r\n aria-hidden=\"true\"\r\n >\r\n\r\n <div class=\"lc-st__visual\">\r\n <img loading=\"lazy\" decoding=\"async\"\r\n src=\"assets\/services\/brow-beard.webp\"\r\n width=\"1600\"\r\n height=\"2000\"\r\n alt=\"\"\r\n aria-hidden=\"true\"\r\n onerror=\"this.style.display='none'\"\r\n >\r\n <\/div>\r\n\r\n\r\n <div class=\"lc-st__content\">\r\n\r\n <p class=\"lc-st__panel-number\">\r\n 02 \/ 05 \u00b7 Hair\r\n <\/p>\r\n\r\n\r\n <h3 class=\"lc-st__panel-title\">\r\n Brow & <em>Beard.<\/em>\r\n <\/h3>\r\n\r\n\r\n <p class=\"lc-st__panel-desc\">\r\n Focused restoration for facial-hair areas where direction,\r\n shape and density require detailed planning.\r\n <\/p>\r\n\r\n\r\n <div class=\"lc-st__services\">\r\n <span class=\"lc-st__service-name\">Eyebrow Transplant<\/span>\r\n <span class=\"lc-st__service-name\">Beard Transplant<\/span>\r\n <\/div>\r\n\r\n <\/div>\r\n\r\n <\/article>\r\n\r\n\r\n\r\n <!-- ===================================================\r\n SLIDE 03 \u2014 SMILE AESTHETICS\r\n =================================================== -->\r\n\r\n <article\r\n class=\"lc-st__slide lc-st__service\"\r\n data-slide=\"3\"\r\n aria-hidden=\"true\"\r\n >\r\n\r\n <div class=\"lc-st__visual\">\r\n <img loading=\"lazy\" decoding=\"async\"\r\n src=\"assets\/services\/smile-design.webp\"\r\n width=\"1600\"\r\n height=\"2000\"\r\n alt=\"\"\r\n aria-hidden=\"true\"\r\n onerror=\"this.style.display='none'\"\r\n >\r\n <\/div>\r\n\r\n\r\n <div class=\"lc-st__content\">\r\n\r\n <p class=\"lc-st__panel-number\">\r\n 03 \/ 05 \u00b7 Dental\r\n <\/p>\r\n\r\n\r\n <h3 class=\"lc-st__panel-title\">\r\n Smile <em>Aesthetics.<\/em>\r\n <\/h3>\r\n\r\n\r\n <p class=\"lc-st__panel-desc\">\r\n Cosmetic dental treatments focused on tooth shape,\r\n shade and overall smile proportion.\r\n <\/p>\r\n\r\n\r\n <div class=\"lc-st__services\">\r\n <span class=\"lc-st__service-name\">Digital Smile Design<\/span>\r\n <span class=\"lc-st__service-name\">Hollywood Smile<\/span>\r\n <span class=\"lc-st__service-name\">Emax Veneers<\/span>\r\n <span class=\"lc-st__service-name\">Lamine Veneers<\/span>\r\n <span class=\"lc-st__service-name\">Porcelain Veneers<\/span>\r\n <span class=\"lc-st__service-name\">Teeth Whitening<\/span>\r\n <span class=\"lc-st__service-name\">Gum Contouring<\/span>\r\n <\/div>\r\n\r\n <\/div>\r\n\r\n <\/article>\r\n\r\n\r\n\r\n <!-- ===================================================\r\n SLIDE 04 \u2014 CROWNS & DENTAL CARE\r\n =================================================== -->\r\n\r\n <article\r\n class=\"lc-st__slide lc-st__service\"\r\n data-slide=\"4\"\r\n aria-hidden=\"true\"\r\n >\r\n\r\n <div class=\"lc-st__visual\">\r\n <img loading=\"lazy\" decoding=\"async\"\r\n src=\"assets\/services\/crowns.webp\"\r\n width=\"1600\"\r\n height=\"2000\"\r\n alt=\"\"\r\n aria-hidden=\"true\"\r\n onerror=\"this.style.display='none'\"\r\n >\r\n <\/div>\r\n\r\n\r\n <div class=\"lc-st__content\">\r\n\r\n <p class=\"lc-st__panel-number\">\r\n 04 \/ 05 \u00b7 Dental\r\n <\/p>\r\n\r\n\r\n <h3 class=\"lc-st__panel-title\">\r\n Crowns & <em>Dental Care.<\/em>\r\n <\/h3>\r\n\r\n\r\n <p class=\"lc-st__panel-desc\">\r\n Restorative options selected according to tooth condition,\r\n structure and the wider treatment plan.\r\n <\/p>\r\n\r\n\r\n <div class=\"lc-st__services\">\r\n <span class=\"lc-st__service-name\">Zirconium Crowns<\/span>\r\n <span class=\"lc-st__service-name\">Dental Crowns<\/span>\r\n <span class=\"lc-st__service-name\">Endodontics<\/span>\r\n <span class=\"lc-st__service-name\">Root Canal<\/span>\r\n <span class=\"lc-st__service-name\">Periodontology<\/span>\r\n <\/div>\r\n\r\n <\/div>\r\n\r\n <\/article>\r\n\r\n\r\n\r\n <!-- ===================================================\r\n SLIDE 05 \u2014 IMPLANT DENTISTRY\r\n =================================================== -->\r\n\r\n <article\r\n class=\"lc-st__slide lc-st__service\"\r\n data-slide=\"5\"\r\n aria-hidden=\"true\"\r\n >\r\n\r\n <div class=\"lc-st__visual\">\r\n <img loading=\"lazy\" decoding=\"async\"\r\n src=\"assets\/services\/implants.webp\"\r\n width=\"1600\"\r\n height=\"2000\"\r\n alt=\"\"\r\n aria-hidden=\"true\"\r\n onerror=\"this.style.display='none'\"\r\n >\r\n <\/div>\r\n\r\n\r\n <div class=\"lc-st__content\">\r\n\r\n <p class=\"lc-st__panel-number\">\r\n 05 \/ 05 \u00b7 Dental\r\n <\/p>\r\n\r\n\r\n <h3 class=\"lc-st__panel-title\">\r\n Implant <em>Dentistry.<\/em>\r\n <\/h3>\r\n\r\n\r\n <p class=\"lc-st__panel-desc\">\r\n Implant-based options for individual, multiple or full-arch\r\n tooth replacement after appropriate clinical assessment.\r\n <\/p>\r\n\r\n\r\n <div class=\"lc-st__services\">\r\n <span class=\"lc-st__service-name\">Dental Implant<\/span>\r\n <span class=\"lc-st__service-name\">All-on-4<\/span>\r\n <span class=\"lc-st__service-name\">All-on-6<\/span>\r\n <span class=\"lc-st__service-name\">Same Day Teeth<\/span>\r\n <span class=\"lc-st__service-name\">Custom Implants<\/span>\r\n <span class=\"lc-st__service-name\">Zygomatic Implants<\/span>\r\n <span class=\"lc-st__service-name\">Toronto Dental Systems<\/span>\r\n <\/div>\r\n\r\n <\/div>\r\n\r\n <\/article>\r\n\r\n\r\n\r\n <!-- progress -->\r\n <div class=\"lc-st__progress\" aria-hidden=\"true\">\r\n <span class=\"lc-st__dot is-active\"><\/span>\r\n <span class=\"lc-st__dot\"><\/span>\r\n <span class=\"lc-st__dot\"><\/span>\r\n <span class=\"lc-st__dot\"><\/span>\r\n <span class=\"lc-st__dot\"><\/span>\r\n <span class=\"lc-st__dot\"><\/span>\r\n <\/div>\r\n\r\n\r\n <\/div>\r\n\r\n\r\n <div\r\n class=\"lc-st__jumpveil\"\r\n aria-hidden=\"true\"\r\n ><\/div>\r\n\r\n\r\n<\/section>\r\n\r\n\r\n<!-- =========================================================\r\nNEXT SECTION: BEFORE & AFTER\r\n========================================================= -->\r\n\r\n\r\n<noscript>\r\n<style>\r\n#lamina-service-track{\r\n height:auto !important;\r\n}\r\n#lamina-service-track .lc-st__camera{\r\n position:relative !important;\r\n height:auto !important;\r\n overflow:visible !important;\r\n}\r\n#lamina-service-track .lc-st__slide{\r\n position:relative !important;\r\n min-height:100vh !important;\r\n opacity:1 !important;\r\n visibility:visible !important;\r\n filter:none !important;\r\n transform:none !important;\r\n pointer-events:auto !important;\r\n}\r\n#lamina-service-track .lc-st__progress,\r\n#lamina-service-track .lc-st__jumpveil{\r\n display:none !important;\r\n}\r\n<\/style>\r\n<\/noscript>\r\n\r\n\r\n<script>\r\n(() => {\r\n\r\n const wrapper =\r\n document.getElementById(\r\n 'lamina-service-track'\r\n );\r\n\r\n\r\n if (\r\n !wrapper ||\r\n wrapper.dataset.laminaTrackReady === 'true'\r\n ) return;\r\n\r\n\r\n wrapper.dataset.laminaTrackReady =\r\n 'true';\r\n\r\n\r\n const slides =\r\n [\r\n ...wrapper.querySelectorAll(\r\n '.lc-st__slide'\r\n )\r\n ];\r\n\r\n\r\n const tiles =\r\n [\r\n ...wrapper.querySelectorAll(\r\n '[data-target-slide]'\r\n )\r\n ];\r\n\r\n\r\n const dots =\r\n [\r\n ...wrapper.querySelectorAll(\r\n '.lc-st__dot'\r\n )\r\n ];\r\n\r\n\r\n const jumpVeil =\r\n wrapper.querySelector(\r\n '.lc-st__jumpveil'\r\n );\r\n\r\n\r\n const reducedMotion =\r\n window.matchMedia(\r\n '(prefers-reduced-motion: reduce)'\r\n ).matches;\r\n\r\n\r\n const phoneQuery =\r\n window.matchMedia(\r\n '(max-width: 700px)'\r\n );\r\n\r\n\r\n let phoneMode =\r\n phoneQuery.matches;\r\n\r\n\r\n if (\r\n !slides.length\r\n ) return;\r\n\r\n\r\n let activeIndex =\r\n 0;\r\n\r\n\r\n let ticking =\r\n false;\r\n\r\n\r\n let transitionTimer =\r\n null;\r\n\r\n\r\n \/*\r\n Same geometry model as the supplied reference:\r\n - wrapper's top relative to viewport\r\n - total scrollable distance = wrapper height - viewport height\r\n *\/\r\n const mobileDepthGroups = () => {\r\n if (!phoneMode) return [];\r\n\r\n return [\r\n wrapper.querySelector('.lc-st__intro-head'),\r\n wrapper.querySelector('.lc-st__tiles'),\r\n ...slides.slice(1).flatMap(slide => [\r\n slide.querySelector('.lc-st__visual'),\r\n slide.querySelector('.lc-st__content')\r\n ])\r\n ].filter(Boolean);\r\n };\r\n\r\n\r\n function smoothstep(value){\r\n const t = Math.max(0,Math.min(1,value));\r\n return t*t*(3-2*t);\r\n }\r\n\r\n\r\n function setMobileDepth(element,blur,opacity,y){\r\n element.style.setProperty('--lc-mobile-depth-blur',blur.toFixed(2)+'px');\r\n element.style.setProperty('--lc-mobile-depth-opacity',opacity.toFixed(3));\r\n element.style.setProperty('--lc-mobile-depth-y',y.toFixed(2)+'px');\r\n }\r\n\r\n\r\n function updateMobileDepth(){\r\n if (!phoneMode) return;\r\n\r\n const vh = window.innerHeight || document.documentElement.clientHeight;\r\n\r\n mobileDepthGroups().forEach(element => {\r\n const rect = element.getBoundingClientRect();\r\n const center = rect.top + rect.height*.5;\r\n const isMedia = element.classList.contains('lc-st__visual');\r\n\r\n const entry = center > vh*.76\r\n ? smoothstep((center-vh*.76)\/Math.max(1,vh*.22))\r\n : 0;\r\n\r\n const exit = center < vh*.08\r\n ? smoothstep((vh*.08-center)\/Math.max(1,vh*.23))\r\n : 0;\r\n\r\n const depth = Math.max(entry,exit);\r\n const maxBlur = isMedia ? 2.0 : 2.45;\r\n const blur = reducedMotion ? 0 : maxBlur*depth;\r\n const opacity = 1-(reducedMotion ? .08 : .14)*depth;\r\n const y = reducedMotion ? 0 : entry*4-exit*2;\r\n\r\n setMobileDepth(element,blur,opacity,y);\r\n });\r\n }\r\n\r\n\r\n function syncPhoneSlides(){\r\n if (!phoneMode) return;\r\n\r\n slides.forEach((slide,index) => {\r\n slide.classList.remove('is-transitioning-out');\r\n slide.setAttribute('aria-hidden','false');\r\n if ('inert' in slide) slide.inert=false;\r\n if (index>0) slide.classList.remove('is-active');\r\n });\r\n }\r\n\r\n\r\n function updatePhoneCurrentChapter(){\r\n if (!phoneMode) return;\r\n\r\n const vh = window.innerHeight || document.documentElement.clientHeight;\r\n const focal = vh*.44;\r\n let bestIndex=0;\r\n let bestDistance=Infinity;\r\n\r\n slides.forEach((slide,index) => {\r\n const rect=slide.getBoundingClientRect();\r\n const distance=Math.abs((rect.top+Math.min(rect.height,vh)*.35)-focal);\r\n if (distance<bestDistance){bestDistance=distance;bestIndex=index;}\r\n });\r\n\r\n activeIndex=bestIndex;\r\n slides.forEach((slide,index)=>slide.classList.toggle('is-mobile-current',index===bestIndex));\r\n updateMobileDepth();\r\n }\r\n\r\n\r\n function metrics(){\r\n\r\n const rect =\r\n wrapper.getBoundingClientRect();\r\n\r\n\r\n const viewportHeight =\r\n window.innerHeight ||\r\n document.documentElement.clientHeight;\r\n\r\n\r\n return {\r\n rect,\r\n distance:\r\n Math.max(\r\n 1,\r\n rect.height -\r\n viewportHeight\r\n ),\r\n top:\r\n window.scrollY +\r\n rect.top\r\n };\r\n\r\n }\r\n\r\n\r\n function setActiveSlide(\r\n index,\r\n force = false\r\n ){\r\n\r\n const safeIndex =\r\n Math.max(\r\n 0,\r\n Math.min(\r\n slides.length - 1,\r\n index\r\n )\r\n );\r\n\r\n\r\n if (phoneMode){\r\n activeIndex=safeIndex;\r\n syncPhoneSlides();\r\n slides.forEach((slide,slideIndex)=>slide.classList.toggle('is-mobile-current',slideIndex===safeIndex));\r\n updateMobileDepth();\r\n return;\r\n }\r\n\r\n\r\n if (\r\n !force &&\r\n safeIndex === activeIndex\r\n ) return;\r\n\r\n\r\n const previous =\r\n slides[activeIndex];\r\n\r\n\r\n const next =\r\n slides[safeIndex];\r\n\r\n\r\n window.clearTimeout(\r\n transitionTimer\r\n );\r\n\r\n\r\n if (\r\n previous &&\r\n previous !== next\r\n ){\r\n\r\n previous.classList.add(\r\n 'is-transitioning-out'\r\n );\r\n\r\n }\r\n\r\n\r\n activeIndex =\r\n safeIndex;\r\n\r\n\r\n slides.forEach(\r\n (\r\n slide,\r\n slideIndex\r\n ) => {\r\n\r\n const active =\r\n slideIndex ===\r\n safeIndex;\r\n\r\n\r\n slide.classList.toggle(\r\n 'is-active',\r\n active\r\n );\r\n\r\n\r\n slide.setAttribute(\r\n 'aria-hidden',\r\n active\r\n ? 'false'\r\n : 'true'\r\n );\r\n\r\n\r\n if (\r\n 'inert' in slide\r\n ){\r\n\r\n slide.inert =\r\n !active;\r\n\r\n }\r\n\r\n }\r\n );\r\n\r\n\r\n dots.forEach(\r\n (\r\n dot,\r\n dotIndex\r\n ) => {\r\n\r\n dot.classList.toggle(\r\n 'is-active',\r\n dotIndex ===\r\n safeIndex\r\n );\r\n\r\n }\r\n );\r\n\r\n\r\n transitionTimer =\r\n window.setTimeout(\r\n () => {\r\n\r\n slides.forEach(\r\n slide => {\r\n\r\n slide.classList.remove(\r\n 'is-transitioning-out'\r\n );\r\n\r\n }\r\n );\r\n\r\n },\r\n reducedMotion\r\n ? 20\r\n : 1500\r\n );\r\n\r\n }\r\n\r\n\r\n \/*\r\n CORE SCROLL MAPPING.\r\n\r\n Important detail:\r\n while the wrapper is still ENTERING the viewport,\r\n rect.top is positive, therefore progress is negative and clamps to 0.\r\n\r\n The intro slide cannot advance until rect.top reaches 0 \u2014\r\n meaning the sticky 100svh camera has first reached its fully centered,\r\n pinned position.\r\n *\/\r\n function update(){\r\n\r\n ticking =\r\n false;\r\n\r\n\r\n if (phoneMode){\r\n updatePhoneCurrentChapter();\r\n return;\r\n }\r\n\r\n\r\n const {\r\n rect,\r\n distance\r\n } =\r\n metrics();\r\n\r\n\r\n let progress =\r\n -rect.top \/\r\n distance;\r\n\r\n\r\n progress =\r\n Math.max(\r\n 0,\r\n Math.min(\r\n 1,\r\n progress\r\n )\r\n );\r\n\r\n\r\n const index =\r\n Math.min(\r\n slides.length - 1,\r\n Math.floor(\r\n progress *\r\n slides.length\r\n )\r\n );\r\n\r\n\r\n setActiveSlide(\r\n index\r\n );\r\n\r\n }\r\n\r\n\r\n function requestUpdate(){\r\n\r\n if (\r\n ticking\r\n ) return;\r\n\r\n\r\n ticking =\r\n true;\r\n\r\n\r\n window.requestAnimationFrame(\r\n update\r\n );\r\n\r\n }\r\n\r\n\r\n \/*\r\n Direct selector click:\r\n calculate the center of the target slide's scroll segment using\r\n the same master-track geometry.\r\n\r\n The page position changes underneath a neutral blur veil, so the\r\n user sees one direct dreamy transition instead of watching all\r\n intermediate slides flash past.\r\n *\/\r\n function jumpToSlide(\r\n index\r\n ){\r\n\r\n const safeIndex =\r\n Math.max(\r\n 0,\r\n Math.min(\r\n slides.length - 1,\r\n Number(index)\r\n )\r\n );\r\n\r\n\r\n if (phoneMode){\r\n const targetSlide=slides[safeIndex];\r\n if (targetSlide){\r\n targetSlide.scrollIntoView({\r\n behavior:reducedMotion ? 'auto' : 'smooth',\r\n block:'start'\r\n });\r\n }\r\n return;\r\n }\r\n\r\n\r\n const {\r\n distance,\r\n top\r\n } =\r\n metrics();\r\n\r\n\r\n const targetProgress =\r\n (\r\n safeIndex +\r\n .5\r\n ) \/\r\n slides.length;\r\n\r\n\r\n const targetY =\r\n top +\r\n targetProgress *\r\n distance;\r\n\r\n\r\n if (\r\n reducedMotion\r\n ){\r\n\r\n window.scrollTo({\r\n top:targetY,\r\n behavior:'auto'\r\n });\r\n\r\n\r\n setActiveSlide(\r\n safeIndex,\r\n true\r\n );\r\n\r\n\r\n return;\r\n }\r\n\r\n\r\n jumpVeil.classList.add(\r\n 'is-active'\r\n );\r\n\r\n\r\n window.setTimeout(\r\n () => {\r\n\r\n \/*\r\n Instant reposition while the page is optically blurred.\r\n *\/\r\n window.scrollTo({\r\n top:targetY,\r\n behavior:'auto'\r\n });\r\n\r\n\r\n setActiveSlide(\r\n safeIndex,\r\n true\r\n );\r\n\r\n\r\n window.requestAnimationFrame(\r\n () => {\r\n\r\n window.requestAnimationFrame(\r\n () => {\r\n\r\n jumpVeil.classList.remove(\r\n 'is-active'\r\n );\r\n\r\n }\r\n );\r\n\r\n }\r\n );\r\n\r\n },\r\n 440\r\n );\r\n\r\n }\r\n\r\n\r\n tiles.forEach(\r\n tile => {\r\n\r\n tile.addEventListener(\r\n 'click',\r\n () => {\r\n\r\n jumpToSlide(\r\n tile.dataset.targetSlide\r\n );\r\n\r\n }\r\n );\r\n\r\n }\r\n );\r\n\r\n\r\n window.addEventListener(\r\n 'scroll',\r\n requestUpdate,\r\n {\r\n passive:true\r\n }\r\n );\r\n\r\n\r\n window.addEventListener(\r\n 'resize',\r\n requestUpdate\r\n );\r\n\r\n\r\n const syncResponsiveMode=()=>{\r\n const nextPhoneMode=phoneQuery.matches;\r\n\r\n if (nextPhoneMode===phoneMode){\r\n requestUpdate();\r\n return;\r\n }\r\n\r\n phoneMode=nextPhoneMode;\r\n\r\n if (phoneMode){\r\n syncPhoneSlides();\r\n }else{\r\n slides.forEach(slide=>{\r\n slide.classList.remove('is-mobile-current');\r\n });\r\n }\r\n\r\n requestUpdate();\r\n };\r\n\r\n\r\n if (phoneQuery.addEventListener){\r\n phoneQuery.addEventListener('change',syncResponsiveMode);\r\n }else{\r\n phoneQuery.addListener(syncResponsiveMode);\r\n }\r\n\r\n\r\n if (phoneMode) syncPhoneSlides();\r\n\r\n\r\n setActiveSlide(\r\n 0,\r\n true\r\n );\r\n\r\n\r\n requestUpdate();\r\n\r\n})();\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-6884ca6 e-con-full e-flex e-con e-parent\" data-id=\"6884ca6\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-a486b4b elementor-widget elementor-widget-html\" data-id=\"a486b4b\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- =========================================================\r\nLAMINA CLINIC \u2014 SECTION 04\r\nREAL CASES \/ BEFORE & AFTER\r\nV6 \u2014 DESKTOP PRESERVED + MOBILE CASE REEL + DISTANT EXIT FOCUS\r\n\r\nReplace placeholder images and metadata only with clinic-approved,\r\nconsented and verified case material.\r\n========================================================= -->\r\n\r\n<style>\r\n@import url('https:\/\/fonts.googleapis.com\/css2?family=Cormorant+Garamond:ital,wght@0,400;0,500;1,400&family=Manrope:wght@400;500;600&display=swap');\r\n\r\n#lamina-real-cases{\r\n --aubergine:#2B142F;\r\n --plum:#5F2468;\r\n --title-purple:#7A3F86;\r\n --orchid:#94709A;\r\n --lilac:#C5B2C8;\r\n --ivory:#F7F2EA;\r\n --ivory-2:#F1EAE5;\r\n --stone:#E8E1E4;\r\n --champagne:#D8C4A1;\r\n --ink:#171317;\r\n --ease:cubic-bezier(.16,.70,.18,1);\r\n\r\n position:relative;\r\n width:100%;\r\n background:\r\n radial-gradient(70% 46% at 94% 3%,rgba(216,196,161,.10),transparent 70%),\r\n linear-gradient(180deg,#F7F2EA 0%,#F5EFE8 100%);\r\n color:var(--aubergine);\r\n font-family:\"Manrope\",system-ui,-apple-system,BlinkMacSystemFont,\"Segoe UI\",sans-serif;\r\n}\r\n\r\n#lamina-real-cases *,\r\n#lamina-real-cases *::before,\r\n#lamina-real-cases *::after{box-sizing:border-box}\r\n\r\n#lamina-real-cases button{font:inherit}\r\n#lamina-real-cases ::selection{background:var(--plum);color:var(--ivory)}\r\n\r\n.lc-case__mobile-intro{display:none}\r\n\r\n.lc-case__stage{\r\n width:min(100%,1600px);\r\n margin:0 auto;\r\n padding:110px clamp(24px,5.5vw,96px);\r\n}\r\n\r\n.lc-case__layout{\r\n display:grid;\r\n grid-template-columns:minmax(0,.40fr) minmax(0,.60fr);\r\n gap:clamp(48px,6vw,110px);\r\n align-items:start;\r\n}\r\n\r\n.lc-case__editorial{max-width:530px}\r\n\r\n.lc-case__eyebrow{\r\n margin:0 0 18px;\r\n color:var(--plum);\r\n font-size:9px;\r\n line-height:1;\r\n font-weight:600;\r\n letter-spacing:.20em;\r\n text-transform:uppercase;\r\n}\r\n\r\n.lc-case__title{\r\n margin:0;\r\n max-width:8.5ch;\r\n color:var(--aubergine);\r\n font-family:\"Cormorant Garamond\",Georgia,serif;\r\n font-size:clamp(62px,5.5vw,102px);\r\n line-height:.86;\r\n font-weight:400;\r\n letter-spacing:-.052em;\r\n}\r\n\r\n.lc-case__title em{\r\n color:var(--title-purple);\r\n font-style:italic;\r\n font-weight:400;\r\n}\r\n\r\n.lc-case__lead{\r\n margin:clamp(27px,3vh,36px) 0 0;\r\n max-width:43ch;\r\n color:rgba(23,19,23,.68);\r\n font-size:clamp(14px,1vw,17px);\r\n line-height:1.76;\r\n}\r\n\r\n.lc-case__disclaimer{\r\n margin:22px 0 0;\r\n max-width:47ch;\r\n color:rgba(43,20,47,.48);\r\n font-size:10px;\r\n line-height:1.65;\r\n}\r\n\r\n.lc-case__filters{\r\n display:flex;\r\n align-items:center;\r\n gap:22px;\r\n margin-top:clamp(30px,4vh,44px);\r\n}\r\n\r\n.lc-case__filter{\r\n position:relative;\r\n appearance:none;\r\n padding:4px 0 8px;\r\n border:0;\r\n background:none;\r\n color:rgba(43,20,47,.46);\r\n font-size:9px;\r\n line-height:1;\r\n font-weight:600;\r\n letter-spacing:.14em;\r\n text-transform:uppercase;\r\n cursor:pointer;\r\n transition:color .45s ease;\r\n}\r\n\r\n.lc-case__filter::after{\r\n content:\"\";\r\n position:absolute;\r\n left:0;right:0;bottom:0;\r\n height:1px;\r\n background:var(--plum);\r\n transform:scaleX(0);\r\n transform-origin:0 50%;\r\n transition:transform .55s var(--ease);\r\n}\r\n\r\n.lc-case__filter.is-active{color:var(--plum)}\r\n.lc-case__filter.is-active::after{transform:scaleX(1)}\r\n.lc-case__filter:focus-visible{outline:1px solid rgba(95,36,104,.48);outline-offset:5px}\r\n\r\n\/* Hard override against Elementor\/global pink hover states. *\/\r\n#lamina-real-cases .lc-case__filter{\r\n color:rgba(43,20,47,.46) !important;\r\n background:transparent !important;\r\n border-color:transparent !important;\r\n box-shadow:none !important;\r\n}\r\n\r\n#lamina-real-cases .lc-case__filter:hover,\r\n#lamina-real-cases .lc-case__filter:focus,\r\n#lamina-real-cases .lc-case__filter:focus-visible,\r\n#lamina-real-cases .lc-case__filter:active{\r\n color:var(--plum) !important;\r\n background:transparent !important;\r\n border-color:transparent !important;\r\n box-shadow:none !important;\r\n}\r\n\r\n#lamina-real-cases .lc-case__filter.is-active{\r\n color:var(--plum) !important;\r\n}\r\n\r\n.lc-case__meta-shell{\r\n margin-top:clamp(40px,5vh,60px);\r\n padding-top:20px;\r\n border-top:1px solid rgba(216,196,161,.72);\r\n}\r\n\r\n.lc-case__meta{\r\n min-height:112px;\r\n transition:\r\n opacity .76s var(--ease),\r\n transform .82s var(--ease);\r\n}\r\n\r\n.lc-case__meta.is-changing{\r\n opacity:.12;\r\n transform:translate3d(0,6px,0);\r\n}\r\n\r\n.lc-case__meta-top{\r\n display:flex;\r\n align-items:center;\r\n justify-content:space-between;\r\n gap:18px;\r\n margin-bottom:14px;\r\n}\r\n\r\n.lc-case__meta-category,\r\n.lc-case__meta-count{\r\n color:var(--plum);\r\n font-size:8px;\r\n line-height:1;\r\n font-weight:600;\r\n letter-spacing:.14em;\r\n text-transform:uppercase;\r\n}\r\n\r\n.lc-case__meta-treatment{\r\n margin:0;\r\n color:var(--aubergine);\r\n font-family:\"Cormorant Garamond\",Georgia,serif;\r\n font-size:clamp(28px,2.2vw,40px);\r\n line-height:1;\r\n font-weight:500;\r\n letter-spacing:-.025em;\r\n}\r\n\r\n.lc-case__meta-follow{\r\n margin:9px 0 0;\r\n color:rgba(23,19,23,.55);\r\n font-size:10px;\r\n line-height:1.5;\r\n}\r\n\r\n.lc-case__visual{min-width:0}\r\n.lc-case__case-list{display:grid;gap:26px}\r\n\r\n.lc-case__card{\r\n position:relative;\r\n width:100%;\r\n padding:clamp(14px,1.3vw,20px);\r\n border:1px solid rgba(43,20,47,.055);\r\n border-radius:24px;\r\n background:\r\n linear-gradient(145deg,rgba(255,255,255,.46),rgba(232,225,228,.74)),\r\n var(--ivory-2);\r\n box-shadow:\r\n 0 22px 60px rgba(43,20,47,.07),\r\n 0 2px 8px rgba(43,20,47,.025);\r\n transform-origin:center center;\r\n}\r\n\r\n.lc-case__comparison{\r\n display:grid;\r\n grid-template-columns:1fr 1fr;\r\n gap:10px;\r\n}\r\n\r\n.lc-case__photo{\r\n position:relative;\r\n overflow:hidden;\r\n min-width:0;\r\n aspect-ratio:4\/5;\r\n border-radius:16px;\r\n background:linear-gradient(145deg,#E8E1E4,#F1EAE5 55%,#C5B2C8);\r\n}\r\n\r\n.lc-case__photo img{\r\n width:100%;\r\n height:100%;\r\n display:block;\r\n object-fit:cover;\r\n object-position:center;\r\n}\r\n\r\n.lc-case__photo.is-missing::before{\r\n content:\"Clinic-approved case image\";\r\n position:absolute;\r\n inset:0;\r\n display:grid;\r\n place-items:center;\r\n padding:24px;\r\n color:rgba(43,20,47,.42);\r\n font-size:9px;\r\n font-weight:600;\r\n letter-spacing:.10em;\r\n text-align:center;\r\n text-transform:uppercase;\r\n}\r\n\r\n.lc-case__photo-label{\r\n position:absolute;\r\n z-index:2;\r\n left:12px;\r\n bottom:12px;\r\n padding:7px 9px;\r\n background:rgba(247,242,234,.90);\r\n color:var(--aubergine);\r\n font-size:7px;\r\n line-height:1;\r\n font-weight:600;\r\n letter-spacing:.14em;\r\n text-transform:uppercase;\r\n}\r\n\r\n.lc-case__card-foot{\r\n display:flex;\r\n align-items:center;\r\n justify-content:space-between;\r\n gap:18px;\r\n padding:15px 3px 2px;\r\n}\r\n\r\n.lc-case__card-type{\r\n color:var(--plum);\r\n font-size:8px;\r\n line-height:1;\r\n font-weight:600;\r\n letter-spacing:.13em;\r\n text-transform:uppercase;\r\n}\r\n\r\n.lc-case__card-code{\r\n color:rgba(43,20,47,.40);\r\n font-size:8px;\r\n line-height:1;\r\n font-weight:600;\r\n letter-spacing:.11em;\r\n text-transform:uppercase;\r\n}\r\n\r\n\r\n.lc-case__mobile-progress{\r\n display:none;\r\n}\r\n\r\n.lc-case__mobile-progress-track{\r\n position:relative;\r\n width:100%;\r\n height:1px;\r\n overflow:hidden;\r\n background:rgba(43,20,47,.14);\r\n}\r\n\r\n.lc-case__mobile-progress-fill{\r\n position:absolute;\r\n inset:0;\r\n background:var(--plum);\r\n transform:scaleX(var(--mobile-progress,0));\r\n transform-origin:0 50%;\r\n will-change:transform;\r\n}\r\n\r\n\/* Enhanced scrollytelling *\/\r\n#lamina-real-cases.is-enhanced{min-height:100vh}\r\n\r\n#lamina-real-cases.is-enhanced .lc-case__stage{\r\n position:sticky;\r\n top:0;\r\n width:100%;\r\n max-width:none;\r\n height:100vh;\r\n height:100svh;\r\n margin:0;\r\n padding:clamp(72px,7.5vh,100px) clamp(24px,5.5vw,96px);\r\n display:flex;\r\n align-items:center;\r\n overflow:hidden;\r\n}\r\n\r\n#lamina-real-cases.is-enhanced .lc-case__stage-inner{\r\n width:min(100%,1600px);\r\n margin:0 auto;\r\n transition:\r\n opacity .55s ease,\r\n transform .72s var(--ease),\r\n filter .55s ease;\r\n}\r\n\r\n#lamina-real-cases.is-enhanced .lc-case__layout{\r\n grid-template-columns:minmax(0,.39fr) minmax(0,.61fr);\r\n height:min(780px,84svh);\r\n align-items:stretch;\r\n}\r\n\r\n#lamina-real-cases.is-enhanced .lc-case__editorial{\r\n display:flex;\r\n flex-direction:column;\r\n justify-content:center;\r\n}\r\n\r\n#lamina-real-cases.is-enhanced .lc-case__visual{\r\n position:relative;\r\n height:100%;\r\n overflow:hidden;\r\n}\r\n\r\n#lamina-real-cases.is-enhanced .lc-case__case-list{\r\n position:absolute;\r\n inset:0;\r\n display:block;\r\n}\r\n\r\n#lamina-real-cases.is-enhanced .lc-case__card{\r\n --case-blur:0px;\r\n\r\n position:absolute;\r\n left:50%;\r\n top:50%;\r\n width:min(78%,760px);\r\n margin:0;\r\n transform:translate3d(-50%,-50%,0) scale(1);\r\n opacity:0;\r\n filter:none;\r\n pointer-events:none;\r\n will-change:transform,opacity;\r\n backface-visibility:hidden;\r\n -webkit-backface-visibility:hidden;\r\n}\r\n\r\n#lamina-real-cases.is-enhanced .lc-case__card > .lc-case__comparison,\r\n#lamina-real-cases.is-enhanced .lc-case__card > .lc-case__card-foot{\r\n filter:blur(var(--case-blur));\r\n will-change:filter;\r\n transform:translateZ(0);\r\n}\r\n\r\n#lamina-real-cases.is-enhanced .lc-case__card.is-interactive{pointer-events:auto}\r\n\r\n#lamina-real-cases.is-enhanced .lc-case__visual{\r\n transition:\r\n opacity .32s ease;\r\n}\r\n\r\n#lamina-real-cases.is-enhanced .lc-case__stage.is-filtering .lc-case__visual{\r\n opacity:.28;\r\n}\r\n\r\n#lamina-real-cases.is-enhanced .lc-case__stage.is-entry .lc-case__stage-inner{\r\n opacity:.96;\r\n transform:translate3d(0,4px,0);\r\n}\r\n\r\n#lamina-real-cases.is-enhanced .lc-case__stage.is-exit .lc-case__stage-inner{\r\n opacity:1;\r\n transform:none;\r\n}\r\n\r\n\/* =========================================================\r\n V6 \u2014 MOBILE \/ COMPACT TABLET CASE REEL\r\n Normal vertical page flow + native horizontal case browsing.\r\n Desktop scrollytelling remains unchanged above 1024px.\r\n ========================================================= *\/\r\n\r\n@media (max-width:1024px){\r\n\r\n #lamina-real-cases.is-mobile-reel{\r\n height:auto !important;\r\n min-height:0 !important;\r\n }\r\n\r\n #lamina-real-cases.is-mobile-reel .lc-case__mobile-intro{\r\n display:block;\r\n padding:\r\n clamp(70px,8vh,86px)\r\n clamp(20px,4.2vw,42px)\r\n 38px;\r\n }\r\n\r\n #lamina-real-cases.is-mobile-reel .lc-case__desktop-intro{\r\n display:none;\r\n }\r\n\r\n #lamina-real-cases.is-mobile-reel .lc-case__mobile-intro .lc-case__title{\r\n max-width:8.3ch;\r\n }\r\n\r\n #lamina-real-cases.is-mobile-reel .lc-case__mobile-intro .lc-case__lead{\r\n margin-top:22px;\r\n max-width:36ch;\r\n }\r\n\r\n #lamina-real-cases.is-mobile-reel .lc-case__mobile-intro .lc-case__disclaimer{\r\n margin-top:18px;\r\n max-width:44ch;\r\n }\r\n\r\n #lamina-real-cases.is-mobile-reel .lc-case__filters{\r\n margin-top:24px;\r\n gap:20px;\r\n flex-wrap:nowrap;\r\n\r\n overflow-x:auto;\r\n overscroll-behavior-inline:contain;\r\n scrollbar-width:none;\r\n\r\n margin-inline:\r\n calc(-1 * clamp(20px,4.2vw,42px));\r\n\r\n padding-inline:\r\n clamp(20px,4.2vw,42px);\r\n\r\n -webkit-overflow-scrolling:touch;\r\n }\r\n\r\n #lamina-real-cases.is-mobile-reel .lc-case__filters::-webkit-scrollbar{\r\n display:none;\r\n }\r\n\r\n #lamina-real-cases.is-mobile-reel .lc-case__filter{\r\n flex:0 0 auto;\r\n min-height:44px;\r\n padding:0 0 7px;\r\n display:inline-flex;\r\n align-items:center;\r\n white-space:nowrap;\r\n }\r\n\r\n #lamina-real-cases.is-mobile-reel .lc-case__stage{\r\n position:relative !important;\r\n top:auto !important;\r\n width:100%;\r\n max-width:none;\r\n height:auto !important;\r\n min-height:0 !important;\r\n margin:0;\r\n padding:0 0 clamp(78px,9vh,104px);\r\n display:block;\r\n overflow:visible;\r\n }\r\n\r\n #lamina-real-cases.is-mobile-reel .lc-case__stage-inner{\r\n width:100%;\r\n height:auto !important;\r\n margin:0;\r\n transform:none;\r\n opacity:1;\r\n }\r\n\r\n #lamina-real-cases.is-mobile-reel .lc-case__layout{\r\n display:flex;\r\n flex-direction:column;\r\n height:auto !important;\r\n gap:0;\r\n }\r\n\r\n #lamina-real-cases.is-mobile-reel .lc-case__visual{\r\n order:1;\r\n position:relative;\r\n height:auto !important;\r\n min-height:0;\r\n overflow:visible;\r\n transition:opacity .20s ease;\r\n }\r\n\r\n #lamina-real-cases.is-mobile-reel .lc-case__stage.is-filtering .lc-case__visual{\r\n opacity:.56;\r\n }\r\n\r\n #lamina-real-cases.is-mobile-reel .lc-case__editorial{\r\n order:2;\r\n width:100%;\r\n max-width:none;\r\n margin:0;\r\n padding-inline:\r\n clamp(\r\n 20px,\r\n 4.2vw,\r\n 42px\r\n );\r\n }\r\n\r\n #lamina-real-cases.is-mobile-reel .lc-case__case-list{\r\n --reel-pad:\r\n max(\r\n clamp(20px,4.2vw,42px),\r\n env(safe-area-inset-left)\r\n );\r\n\r\n position:relative !important;\r\n inset:auto !important;\r\n\r\n display:flex !important;\r\n align-items:flex-start;\r\n gap:14px;\r\n\r\n width:100%;\r\n overflow-x:auto;\r\n overflow-y:visible;\r\n\r\n padding:\r\n 8px\r\n var(--reel-pad)\r\n 22px;\r\n\r\n scroll-padding-inline-start:var(--reel-pad);\r\n scroll-snap-type:x mandatory;\r\n\r\n overscroll-behavior-inline:contain;\r\n scrollbar-width:none;\r\n -webkit-overflow-scrolling:touch;\r\n\r\n \/*\r\n Native gesture arbitration:\r\n horizontal motion browses cases;\r\n vertical movement continues the page.\r\n *\/\r\n touch-action:pan-x pan-y;\r\n }\r\n\r\n #lamina-real-cases.is-mobile-reel .lc-case__case-list::-webkit-scrollbar{\r\n display:none;\r\n }\r\n\r\n #lamina-real-cases.is-mobile-reel .lc-case__card{\r\n --case-blur:0px;\r\n\r\n position:relative !important;\r\n left:auto !important;\r\n top:auto !important;\r\n\r\n flex:0 0 clamp(270px,84vw,335px);\r\n width:auto !important;\r\n margin:0;\r\n\r\n scroll-snap-align:start;\r\n scroll-snap-stop:normal;\r\n\r\n padding:9px;\r\n border-radius:20px;\r\n\r\n opacity:.80;\r\n transform:scale(.99);\r\n transform-origin:center center;\r\n\r\n pointer-events:auto !important;\r\n\r\n box-shadow:\r\n 0 16px 38px rgba(43,20,47,.055),\r\n 0 2px 7px rgba(43,20,47,.02);\r\n\r\n transition:\r\n opacity .28s ease,\r\n transform .34s var(--ease);\r\n\r\n will-change:auto;\r\n }\r\n\r\n #lamina-real-cases.is-mobile-reel .lc-case__card.is-mobile-active{\r\n opacity:1;\r\n transform:scale(1);\r\n }\r\n\r\n #lamina-real-cases.is-mobile-reel .lc-case__card.is-mobile-hidden{\r\n display:none !important;\r\n }\r\n\r\n #lamina-real-cases.is-mobile-reel .lc-case__card > .lc-case__comparison,\r\n #lamina-real-cases.is-mobile-reel .lc-case__card > .lc-case__card-foot{\r\n filter:none !important;\r\n }\r\n\r\n #lamina-real-cases.is-mobile-reel .lc-case__comparison{\r\n gap:7px;\r\n }\r\n\r\n #lamina-real-cases.is-mobile-reel .lc-case__photo{\r\n border-radius:13px;\r\n }\r\n\r\n #lamina-real-cases.is-mobile-reel\r\n .lc-case__card[data-mobile-layout=\"stacked\"]\r\n .lc-case__comparison{\r\n grid-template-columns:1fr;\r\n }\r\n\r\n \/*\r\n Hair source assets are declared 4:3.\r\n Preserve that honest source geometry instead of the old 16:9 crop.\r\n *\/\r\n #lamina-real-cases.is-mobile-reel\r\n .lc-case__card[data-mobile-layout=\"stacked\"]\r\n .lc-case__photo{\r\n aspect-ratio:4 \/ 3;\r\n }\r\n\r\n #lamina-real-cases.is-mobile-reel\r\n .lc-case__card[data-mobile-layout=\"side\"]\r\n .lc-case__comparison{\r\n grid-template-columns:1fr 1fr;\r\n }\r\n\r\n #lamina-real-cases.is-mobile-reel\r\n .lc-case__card[data-mobile-layout=\"side\"]\r\n .lc-case__photo{\r\n aspect-ratio:4 \/ 5;\r\n }\r\n\r\n #lamina-real-cases.is-mobile-reel .lc-case__photo img{\r\n object-position:\r\n var(\r\n --mobile-object-position,\r\n center\r\n );\r\n }\r\n\r\n #lamina-real-cases.is-mobile-reel .lc-case__card-foot{\r\n padding:11px 3px 1px;\r\n }\r\n\r\n #lamina-real-cases.is-mobile-reel .lc-case__meta-shell{\r\n display:block !important;\r\n margin:22px 0 0;\r\n padding-top:16px;\r\n border-top:1px solid rgba(216,196,161,.66);\r\n }\r\n\r\n #lamina-real-cases.is-mobile-reel .lc-case__meta{\r\n min-height:108px;\r\n filter:blur(0);\r\n transition:\r\n opacity .52s var(--ease),\r\n transform .52s var(--ease),\r\n filter .52s var(--ease);\r\n }\r\n\r\n #lamina-real-cases.is-mobile-reel .lc-case__meta.is-changing{\r\n opacity:0;\r\n transform:translate3d(0,4px,0);\r\n filter:blur(2px);\r\n }\r\n\r\n #lamina-real-cases.is-mobile-reel .lc-case__meta-treatment{\r\n margin-top:0;\r\n }\r\n\r\n #lamina-real-cases.is-mobile-reel .lc-case__mobile-progress{\r\n display:block;\r\n margin-top:20px;\r\n padding-bottom:\r\n max(\r\n 0px,\r\n env(safe-area-inset-bottom)\r\n );\r\n }\r\n\r\n}\r\n\r\n\/* Compact tablets use a wider reel: roughly 1.7\u20132.2 cases visible. *\/\r\n@media (min-width:768px) and (max-width:1024px){\r\n\r\n #lamina-real-cases.is-mobile-reel .lc-case__mobile-intro{\r\n padding-bottom:42px;\r\n }\r\n\r\n #lamina-real-cases.is-mobile-reel .lc-case__card{\r\n flex-basis:clamp(360px,48vw,500px);\r\n }\r\n\r\n #lamina-real-cases.is-mobile-reel .lc-case__case-list{\r\n gap:16px;\r\n }\r\n\r\n #lamina-real-cases.is-mobile-reel .lc-case__editorial{\r\n padding-inline:\r\n clamp(28px,4.2vw,48px);\r\n }\r\n\r\n}\r\n\r\n\/* Phone-specific art direction. *\/\r\n@media (max-width:767px){\r\n\r\n #lamina-real-cases.is-mobile-reel .lc-case__mobile-intro{\r\n padding:68px 20px 32px;\r\n }\r\n\r\n #lamina-real-cases.is-mobile-reel .lc-case__mobile-intro .lc-case__title{\r\n max-width:8.2ch;\r\n font-size:clamp(50px,14vw,66px);\r\n }\r\n\r\n #lamina-real-cases.is-mobile-reel .lc-case__mobile-intro .lc-case__lead{\r\n margin-top:22px;\r\n }\r\n\r\n #lamina-real-cases.is-mobile-reel .lc-case__filters{\r\n margin-inline:-20px;\r\n padding-inline:20px;\r\n gap:18px;\r\n }\r\n\r\n #lamina-real-cases.is-mobile-reel .lc-case__case-list{\r\n --reel-pad:\r\n max(\r\n 20px,\r\n env(safe-area-inset-left)\r\n );\r\n\r\n gap:14px;\r\n }\r\n\r\n #lamina-real-cases.is-mobile-reel .lc-case__editorial{\r\n padding-inline:20px;\r\n }\r\n\r\n}\r\n\r\n\/* Short landscape screens keep the reel in normal flow.\r\n Reduce visual width rather than forcing portrait proportions. *\/\r\n@media (max-width:1024px) and (max-height:520px) and (orientation:landscape){\r\n\r\n #lamina-real-cases.is-mobile-reel .lc-case__card{\r\n flex-basis:clamp(270px,44vw,390px);\r\n }\r\n\r\n}\r\n\r\n@media (prefers-reduced-motion:reduce) and (min-width:1025px){\r\n\r\n #lamina-real-cases{\r\n height:auto !important;\r\n }\r\n\r\n #lamina-real-cases .lc-case__stage{\r\n position:relative !important;\r\n top:auto !important;\r\n height:auto !important;\r\n min-height:0 !important;\r\n overflow:visible !important;\r\n }\r\n\r\n #lamina-real-cases .lc-case__layout{\r\n display:block !important;\r\n height:auto !important;\r\n }\r\n\r\n #lamina-real-cases .lc-case__desktop-intro{\r\n display:block !important;\r\n margin-bottom:38px;\r\n }\r\n\r\n #lamina-real-cases .lc-case__visual{\r\n height:auto !important;\r\n overflow:visible !important;\r\n }\r\n\r\n #lamina-real-cases .lc-case__case-list{\r\n position:relative !important;\r\n inset:auto !important;\r\n display:grid !important;\r\n gap:22px !important;\r\n }\r\n\r\n #lamina-real-cases .lc-case__card{\r\n position:relative !important;\r\n left:auto !important;\r\n top:auto !important;\r\n width:100% !important;\r\n opacity:1 !important;\r\n filter:none !important;\r\n transform:none !important;\r\n pointer-events:auto !important;\r\n }\r\n\r\n #lamina-real-cases .lc-case__card > .lc-case__comparison,\r\n #lamina-real-cases .lc-case__card > .lc-case__card-foot{\r\n filter:none !important;\r\n }\r\n\r\n #lamina-real-cases .lc-case__meta-shell{\r\n display:none !important;\r\n }\r\n\r\n}\r\n\r\n@media (prefers-reduced-motion:reduce) and (max-width:1024px){\r\n\r\n #lamina-real-cases.is-mobile-reel .lc-case__card,\r\n #lamina-real-cases.is-mobile-reel .lc-case__meta,\r\n #lamina-real-cases .lc-case__exit-blur{\r\n transition:none !important;\r\n filter:none !important;\r\n }\r\n\r\n #lamina-real-cases.is-mobile-reel .lc-case__card{\r\n transform:none !important;\r\n }\r\n\r\n}\r\n\r\n\/* =========================================================\r\n V4 \u2014 READABLE TYPOGRAPHY PASS\r\n General Lamina rule:\r\n - no important UI \/ metadata text at tiny 7\u20139px sizes\r\n - body\/supporting copy stays comfortably readable\r\n - mobile receives its own readability floor\r\n ========================================================= *\/\r\n\r\n\/* Section intro *\/\r\n#lamina-real-cases .lc-case__eyebrow{\r\n font-size:clamp(11px,.72vw,13px) !important;\r\n line-height:1.2 !important;\r\n letter-spacing:.17em !important;\r\n}\r\n\r\n#lamina-real-cases .lc-case__lead{\r\n font-size:clamp(16px,1.02vw,18px) !important;\r\n line-height:1.72 !important;\r\n}\r\n\r\n#lamina-real-cases .lc-case__disclaimer{\r\n font-size:clamp(12px,.78vw,13px) !important;\r\n line-height:1.62 !important;\r\n}\r\n\r\n\/* Filters *\/\r\n#lamina-real-cases .lc-case__filter{\r\n font-size:clamp(11px,.72vw,12px) !important;\r\n line-height:1.15 !important;\r\n letter-spacing:.11em !important;\r\n}\r\n\r\n\/* Dynamic metadata *\/\r\n#lamina-real-cases .lc-case__meta-category,\r\n#lamina-real-cases .lc-case__meta-count{\r\n font-size:clamp(11px,.72vw,12px) !important;\r\n line-height:1.15 !important;\r\n letter-spacing:.11em !important;\r\n}\r\n\r\n#lamina-real-cases .lc-case__meta-treatment{\r\n font-size:clamp(31px,2.25vw,42px) !important;\r\n line-height:1.02 !important;\r\n}\r\n\r\n#lamina-real-cases .lc-case__meta-follow{\r\n font-size:clamp(12px,.78vw,13px) !important;\r\n line-height:1.55 !important;\r\n}\r\n\r\n\/* Case cards *\/\r\n#lamina-real-cases .lc-case__photo.is-missing::before{\r\n font-size:11px !important;\r\n line-height:1.45 !important;\r\n letter-spacing:.08em !important;\r\n}\r\n\r\n#lamina-real-cases .lc-case__photo-label{\r\n font-size:10px !important;\r\n line-height:1.1 !important;\r\n letter-spacing:.11em !important;\r\n}\r\n\r\n#lamina-real-cases .lc-case__card-type,\r\n#lamina-real-cases .lc-case__card-code{\r\n font-size:10.5px !important;\r\n line-height:1.15 !important;\r\n letter-spacing:.09em !important;\r\n}\r\n\r\n\/* Tablet *\/\r\n@media (max-width:1024px){\r\n\r\n #lamina-real-cases .lc-case__lead{\r\n font-size:16px !important;\r\n }\r\n\r\n #lamina-real-cases .lc-case__disclaimer{\r\n font-size:12px !important;\r\n }\r\n\r\n #lamina-real-cases .lc-case__filter,\r\n #lamina-real-cases .lc-case__meta-category,\r\n #lamina-real-cases .lc-case__meta-count{\r\n font-size:11px !important;\r\n }\r\n\r\n #lamina-real-cases .lc-case__meta-follow{\r\n font-size:12px !important;\r\n }\r\n\r\n #lamina-real-cases .lc-case__photo-label{\r\n font-size:10px !important;\r\n }\r\n\r\n #lamina-real-cases .lc-case__card-type,\r\n #lamina-real-cases .lc-case__card-code{\r\n font-size:10px !important;\r\n }\r\n\r\n}\r\n\r\n\/* Mobile \u2014 explicit readability floor *\/\r\n@media (max-width:760px){\r\n\r\n #lamina-real-cases .lc-case__eyebrow{\r\n font-size:11px !important;\r\n line-height:1.2 !important;\r\n }\r\n\r\n #lamina-real-cases .lc-case__lead{\r\n font-size:15px !important;\r\n line-height:1.64 !important;\r\n }\r\n\r\n #lamina-real-cases .lc-case__disclaimer{\r\n font-size:12px !important;\r\n line-height:1.58 !important;\r\n }\r\n\r\n #lamina-real-cases .lc-case__filter{\r\n font-size:11px !important;\r\n line-height:1.15 !important;\r\n }\r\n\r\n #lamina-real-cases .lc-case__meta-category,\r\n #lamina-real-cases .lc-case__meta-count{\r\n font-size:10.5px !important;\r\n line-height:1.15 !important;\r\n }\r\n\r\n #lamina-real-cases.is-enhanced .lc-case__meta-treatment{\r\n font-size:31px !important;\r\n line-height:1.02 !important;\r\n }\r\n\r\n #lamina-real-cases .lc-case__meta-follow{\r\n font-size:11.5px !important;\r\n line-height:1.5 !important;\r\n }\r\n\r\n #lamina-real-cases .lc-case__photo-label{\r\n font-size:10px !important;\r\n }\r\n\r\n #lamina-real-cases .lc-case__card-type,\r\n #lamina-real-cases .lc-case__card-code{\r\n font-size:10px !important;\r\n line-height:1.15 !important;\r\n }\r\n\r\n}\r\n\r\n\r\n\r\n\/* =========================================================\r\n V5 \u2014 LAMINA SOFT DISTANT-ONLY ONE-WAY BLUR\r\n Permanent site language:\r\n - downward scroll only\r\n - nearby\/current\/incoming content stays sharp\r\n - blur begins only when content is far into the upper viewport\r\n - no opacity fade\r\n - desktop max \u2248 2.35px\r\n - mobile max \u2248 1.45px\r\n ========================================================= *\/\r\n\r\n.lc-case__title-line{\r\n display:block;\r\n}\r\n\r\n#lamina-real-cases .lc-case__exit-blur{\r\n --lc-section-exit-blur:0px;\r\n filter:blur(var(--lc-section-exit-blur));\r\n transform-origin:center center;\r\n}\r\n\r\n#lamina-real-cases .lc-case__exit-blur:focus-within{\r\n filter:none !important;\r\n}\r\n\r\n\r\n<\/style>\r\n\r\n<section id=\"lamina-real-cases\" aria-labelledby=\"lamina-real-cases-title\">\r\n\r\n <div class=\"lc-case__mobile-intro\">\r\n <p class=\"lc-case__eyebrow lc-case__exit-blur\" data-exit-layer=\"eyebrow\">04 \u2014 REAL CASES<\/p>\r\n\r\n <h2 class=\"lc-case__title\" id=\"lamina-real-cases-title-mobile\">\r\n <span class=\"lc-case__title-line lc-case__exit-blur\" data-exit-layer=\"headline\">Results are personal.<\/span>\r\n <span class=\"lc-case__title-line lc-case__exit-blur\" data-exit-layer=\"headline\"><em>The details matter.<\/em><\/span>\r\n <\/h2>\r\n\r\n <p class=\"lc-case__lead lc-case__exit-blur\" data-exit-layer=\"copy\">\r\n Explore selected treatment cases across hair restoration and dental aesthetics.\r\n Each case reflects an individual treatment plan, starting point and follow-up period.\r\n <\/p>\r\n\r\n <p class=\"lc-case__disclaimer lc-case__exit-blur\" data-exit-layer=\"ui\">\r\n Individual outcomes vary. Treatment suitability and expected outcomes can only be assessed following clinical evaluation.\r\n <\/p>\r\n\r\n <div class=\"lc-case__filters lc-case__exit-blur\" data-exit-layer=\"ui\" data-filter-group=\"mobile\" aria-label=\"Filter real cases\">\r\n <button class=\"lc-case__filter is-active\" type=\"button\" data-filter=\"all\" aria-pressed=\"true\">All<\/button>\r\n <button class=\"lc-case__filter\" type=\"button\" data-filter=\"hair\" aria-pressed=\"false\">Hair<\/button>\r\n <button class=\"lc-case__filter\" type=\"button\" data-filter=\"browbeard\" aria-pressed=\"false\">Brow & Beard<\/button>\r\n <button class=\"lc-case__filter\" type=\"button\" data-filter=\"dental\" aria-pressed=\"false\">Dental<\/button>\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"lc-case__stage\">\r\n <div class=\"lc-case__stage-inner\">\r\n <div class=\"lc-case__layout\">\r\n\r\n <aside class=\"lc-case__editorial\">\r\n <div class=\"lc-case__desktop-intro\">\r\n <p class=\"lc-case__eyebrow lc-case__exit-blur\" data-exit-layer=\"eyebrow\">04 \u2014 REAL CASES<\/p>\r\n\r\n <h2 class=\"lc-case__title\" id=\"lamina-real-cases-title\">\r\n <span class=\"lc-case__title-line lc-case__exit-blur\" data-exit-layer=\"headline\">Results are personal.<\/span>\r\n <span class=\"lc-case__title-line lc-case__exit-blur\" data-exit-layer=\"headline\"><em>The details matter.<\/em><\/span>\r\n <\/h2>\r\n\r\n <p class=\"lc-case__lead lc-case__exit-blur\" data-exit-layer=\"copy\">\r\n Explore selected treatment cases across hair restoration and dental aesthetics.\r\n Each case reflects an individual treatment plan, starting point and follow-up period.\r\n <\/p>\r\n\r\n <p class=\"lc-case__disclaimer lc-case__exit-blur\" data-exit-layer=\"ui\">\r\n Individual outcomes vary. Treatment suitability and expected outcomes can only be assessed following clinical evaluation.\r\n <\/p>\r\n\r\n <div class=\"lc-case__filters lc-case__exit-blur\" data-exit-layer=\"ui\" data-filter-group=\"desktop\" aria-label=\"Filter real cases\">\r\n <button class=\"lc-case__filter is-active\" type=\"button\" data-filter=\"all\" aria-pressed=\"true\">All<\/button>\r\n <button class=\"lc-case__filter\" type=\"button\" data-filter=\"hair\" aria-pressed=\"false\">Hair<\/button>\r\n <button class=\"lc-case__filter\" type=\"button\" data-filter=\"browbeard\" aria-pressed=\"false\">Brow & Beard<\/button>\r\n <button class=\"lc-case__filter\" type=\"button\" data-filter=\"dental\" aria-pressed=\"false\">Dental<\/button>\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"lc-case__meta-shell lc-case__exit-blur\" data-exit-layer=\"metadata\" aria-live=\"polite\">\r\n <div class=\"lc-case__meta\">\r\n <div class=\"lc-case__meta-top\">\r\n <span class=\"lc-case__meta-category\">Hair Restoration<\/span>\r\n <span class=\"lc-case__meta-count\">01 \/ 08<\/span>\r\n <\/div>\r\n\r\n <h3 class=\"lc-case__meta-treatment\">Hair restoration case<\/h3>\r\n\r\n <p class=\"lc-case__meta-follow\">\r\n Verified follow-up details to be supplied by Lamina Clinic.\r\n <\/p>\r\n <\/div>\r\n <\/div>\r\n\r\n <div\r\n class=\"lc-case__mobile-progress lc-case__exit-blur\"\r\n data-exit-layer=\"ui\"\r\n aria-hidden=\"true\"\r\n >\r\n <div class=\"lc-case__mobile-progress-track\">\r\n <span class=\"lc-case__mobile-progress-fill\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <\/aside>\r\n\r\n <div class=\"lc-case__visual lc-case__exit-blur\" data-exit-layer=\"media\">\r\n <div class=\"lc-case__case-list\" role=\"region\" tabindex=\"0\" aria-label=\"Real treatment cases. Swipe horizontally to browse.\">\r\n\r\n <article class=\"lc-case__card\" data-case-id=\"hair-01\" data-category=\"hair\" data-layout=\"stacked\" aria-label=\"Hair restoration case 01\">\r\n <div class=\"lc-case__comparison\">\r\n <figure class=\"lc-case__photo\">\r\n <img loading=\"lazy\" src=\"assets\/results\/hair-01-before.webp\" width=\"1200\" height=\"900\" alt=\"Before treatment image for hair restoration case 01\" loading=\"lazy\" decoding=\"async\" onerror=\"this.parentElement.classList.add('is-missing');this.remove();\">\r\n <figcaption class=\"lc-case__photo-label\">Before<\/figcaption>\r\n <\/figure>\r\n <figure class=\"lc-case__photo\">\r\n <img loading=\"lazy\" src=\"assets\/results\/hair-01-after.webp\" width=\"1200\" height=\"900\" alt=\"After treatment image for hair restoration case 01\" loading=\"lazy\" decoding=\"async\" onerror=\"this.parentElement.classList.add('is-missing');this.remove();\">\r\n <figcaption class=\"lc-case__photo-label\">After<\/figcaption>\r\n <\/figure>\r\n <\/div>\r\n <footer class=\"lc-case__card-foot\">\r\n <span class=\"lc-case__card-type\">Hair Restoration<\/span>\r\n <span class=\"lc-case__card-code\">Case 01<\/span>\r\n <\/footer>\r\n <\/article>\r\n\r\n <article class=\"lc-case__card\" data-case-id=\"hair-02\" data-category=\"hair\" data-layout=\"stacked\" aria-label=\"Hair restoration case 02\">\r\n <div class=\"lc-case__comparison\">\r\n <figure class=\"lc-case__photo\">\r\n <img loading=\"lazy\" src=\"assets\/results\/hair-02-before.webp\" width=\"1200\" height=\"900\" alt=\"Before treatment image for hair restoration case 02\" loading=\"lazy\" decoding=\"async\" onerror=\"this.parentElement.classList.add('is-missing');this.remove();\">\r\n <figcaption class=\"lc-case__photo-label\">Before<\/figcaption>\r\n <\/figure>\r\n <figure class=\"lc-case__photo\">\r\n <img loading=\"lazy\" src=\"assets\/results\/hair-02-after.webp\" width=\"1200\" height=\"900\" alt=\"After treatment image for hair restoration case 02\" loading=\"lazy\" decoding=\"async\" onerror=\"this.parentElement.classList.add('is-missing');this.remove();\">\r\n <figcaption class=\"lc-case__photo-label\">After<\/figcaption>\r\n <\/figure>\r\n <\/div>\r\n <footer class=\"lc-case__card-foot\">\r\n <span class=\"lc-case__card-type\">Hair Restoration<\/span>\r\n <span class=\"lc-case__card-code\">Case 02<\/span>\r\n <\/footer>\r\n <\/article>\r\n\r\n <article class=\"lc-case__card\" data-case-id=\"hair-03\" data-category=\"hair\" data-layout=\"stacked\" aria-label=\"Hair restoration case 03\">\r\n <div class=\"lc-case__comparison\">\r\n <figure class=\"lc-case__photo\">\r\n <img loading=\"lazy\" src=\"assets\/results\/hair-03-before.webp\" width=\"1200\" height=\"900\" alt=\"Before treatment image for hair restoration case 03\" loading=\"lazy\" decoding=\"async\" onerror=\"this.parentElement.classList.add('is-missing');this.remove();\">\r\n <figcaption class=\"lc-case__photo-label\">Before<\/figcaption>\r\n <\/figure>\r\n <figure class=\"lc-case__photo\">\r\n <img loading=\"lazy\" src=\"assets\/results\/hair-03-after.webp\" width=\"1200\" height=\"900\" alt=\"After treatment image for hair restoration case 03\" loading=\"lazy\" decoding=\"async\" onerror=\"this.parentElement.classList.add('is-missing');this.remove();\">\r\n <figcaption class=\"lc-case__photo-label\">After<\/figcaption>\r\n <\/figure>\r\n <\/div>\r\n <footer class=\"lc-case__card-foot\">\r\n <span class=\"lc-case__card-type\">Hair Restoration<\/span>\r\n <span class=\"lc-case__card-code\">Case 03<\/span>\r\n <\/footer>\r\n <\/article>\r\n\r\n <article class=\"lc-case__card\" data-case-id=\"beard-04\" data-category=\"browbeard\" data-layout=\"side\" aria-label=\"Beard restoration case 04\">\r\n <div class=\"lc-case__comparison\">\r\n <figure class=\"lc-case__photo\">\r\n <img loading=\"lazy\" src=\"assets\/results\/beard-04-before.webp\" width=\"1000\" height=\"1250\" alt=\"Before treatment image for beard restoration case 04\" loading=\"lazy\" decoding=\"async\" onerror=\"this.parentElement.classList.add('is-missing');this.remove();\">\r\n <figcaption class=\"lc-case__photo-label\">Before<\/figcaption>\r\n <\/figure>\r\n <figure class=\"lc-case__photo\">\r\n <img loading=\"lazy\" src=\"assets\/results\/beard-04-after.webp\" width=\"1000\" height=\"1250\" alt=\"After treatment image for beard restoration case 04\" loading=\"lazy\" decoding=\"async\" onerror=\"this.parentElement.classList.add('is-missing');this.remove();\">\r\n <figcaption class=\"lc-case__photo-label\">After<\/figcaption>\r\n <\/figure>\r\n <\/div>\r\n <footer class=\"lc-case__card-foot\">\r\n <span class=\"lc-case__card-type\">Brow & Beard<\/span>\r\n <span class=\"lc-case__card-code\">Case 04<\/span>\r\n <\/footer>\r\n <\/article>\r\n\r\n <article class=\"lc-case__card\" data-case-id=\"brow-05\" data-category=\"browbeard\" data-layout=\"side\" aria-label=\"Eyebrow restoration case 05\">\r\n <div class=\"lc-case__comparison\">\r\n <figure class=\"lc-case__photo\">\r\n <img loading=\"lazy\" src=\"assets\/results\/brow-05-before.webp\" width=\"1000\" height=\"1250\" alt=\"Before treatment image for eyebrow restoration case 05\" loading=\"lazy\" decoding=\"async\" onerror=\"this.parentElement.classList.add('is-missing');this.remove();\">\r\n <figcaption class=\"lc-case__photo-label\">Before<\/figcaption>\r\n <\/figure>\r\n <figure class=\"lc-case__photo\">\r\n <img loading=\"lazy\" src=\"assets\/results\/brow-05-after.webp\" width=\"1000\" height=\"1250\" alt=\"After treatment image for eyebrow restoration case 05\" loading=\"lazy\" decoding=\"async\" onerror=\"this.parentElement.classList.add('is-missing');this.remove();\">\r\n <figcaption class=\"lc-case__photo-label\">After<\/figcaption>\r\n <\/figure>\r\n <\/div>\r\n <footer class=\"lc-case__card-foot\">\r\n <span class=\"lc-case__card-type\">Brow & Beard<\/span>\r\n <span class=\"lc-case__card-code\">Case 05<\/span>\r\n <\/footer>\r\n <\/article>\r\n\r\n <article class=\"lc-case__card\" data-case-id=\"dental-06\" data-category=\"dental\" data-layout=\"side\" aria-label=\"Dental aesthetics case 08\">\r\n <div class=\"lc-case__comparison\">\r\n <figure class=\"lc-case__photo\">\r\n <img loading=\"lazy\" src=\"assets\/results\/dental-08-before.webp\" width=\"1000\" height=\"1250\" alt=\"Before treatment image for dental aesthetics case 04\" loading=\"lazy\" decoding=\"async\" onerror=\"this.parentElement.classList.add('is-missing');this.remove();\">\r\n <figcaption class=\"lc-case__photo-label\">Before<\/figcaption>\r\n <\/figure>\r\n <figure class=\"lc-case__photo\">\r\n <img loading=\"lazy\" src=\"assets\/results\/dental-08-after.webp\" width=\"1000\" height=\"1250\" alt=\"After treatment image for dental aesthetics case 04\" loading=\"lazy\" decoding=\"async\" onerror=\"this.parentElement.classList.add('is-missing');this.remove();\">\r\n <figcaption class=\"lc-case__photo-label\">After<\/figcaption>\r\n <\/figure>\r\n <\/div>\r\n <footer class=\"lc-case__card-foot\">\r\n <span class=\"lc-case__card-type\">Dental Aesthetics<\/span>\r\n <span class=\"lc-case__card-code\">Case 06<\/span>\r\n <\/footer>\r\n <\/article>\r\n\r\n <article class=\"lc-case__card\" data-case-id=\"dental-07\" data-category=\"dental\" data-layout=\"side\" aria-label=\"Dental aesthetics case 07\">\r\n <div class=\"lc-case__comparison\">\r\n <figure class=\"lc-case__photo\">\r\n <img loading=\"lazy\" src=\"assets\/results\/dental-07-before.webp\" width=\"1000\" height=\"1250\" alt=\"Before treatment image for dental aesthetics case 05\" loading=\"lazy\" decoding=\"async\" onerror=\"this.parentElement.classList.add('is-missing');this.remove();\">\r\n <figcaption class=\"lc-case__photo-label\">Before<\/figcaption>\r\n <\/figure>\r\n <figure class=\"lc-case__photo\">\r\n <img loading=\"lazy\" src=\"assets\/results\/dental-07-after.webp\" width=\"1000\" height=\"1250\" alt=\"After treatment image for dental aesthetics case 05\" loading=\"lazy\" decoding=\"async\" onerror=\"this.parentElement.classList.add('is-missing');this.remove();\">\r\n <figcaption class=\"lc-case__photo-label\">After<\/figcaption>\r\n <\/figure>\r\n <\/div>\r\n <footer class=\"lc-case__card-foot\">\r\n <span class=\"lc-case__card-type\">Dental Aesthetics<\/span>\r\n <span class=\"lc-case__card-code\">Case 07<\/span>\r\n <\/footer>\r\n <\/article>\r\n\r\n <article class=\"lc-case__card\" data-case-id=\"dental-08\" data-category=\"dental\" data-layout=\"side\" aria-label=\"Dental aesthetics case 08\">\r\n <div class=\"lc-case__comparison\">\r\n <figure class=\"lc-case__photo\">\r\n <img loading=\"lazy\" src=\"assets\/results\/dental-06-before.webp\" width=\"1000\" height=\"1250\" alt=\"Before treatment image for dental aesthetics case 06\" loading=\"lazy\" decoding=\"async\" onerror=\"this.parentElement.classList.add('is-missing');this.remove();\">\r\n <figcaption class=\"lc-case__photo-label\">Before<\/figcaption>\r\n <\/figure>\r\n <figure class=\"lc-case__photo\">\r\n <img loading=\"lazy\" src=\"assets\/results\/dental-06-after.webp\" width=\"1000\" height=\"1250\" alt=\"After treatment image for dental aesthetics case 06\" loading=\"lazy\" decoding=\"async\" onerror=\"this.parentElement.classList.add('is-missing');this.remove();\">\r\n <figcaption class=\"lc-case__photo-label\">After<\/figcaption>\r\n <\/figure>\r\n <\/div>\r\n <footer class=\"lc-case__card-foot\">\r\n <span class=\"lc-case__card-type\">Dental Aesthetics<\/span>\r\n <span class=\"lc-case__card-code\">Case 08<\/span>\r\n <\/footer>\r\n <\/article>\r\n\r\n <\/div>\r\n <\/div>\r\n\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n<\/section>\r\n\r\n<script>\r\n(() => {\r\n\r\n const root =\r\n document.getElementById(\r\n 'lamina-real-cases'\r\n );\r\n\r\n\r\n if (\r\n !root ||\r\n root.dataset.realCasesReady ===\r\n 'true'\r\n ) return;\r\n\r\n\r\n root.dataset.realCasesReady =\r\n 'true';\r\n\r\n\r\n \/* =======================================================\r\n SHARED DOM \/ DATA\r\n ======================================================= *\/\r\n\r\n const stage =\r\n root.querySelector(\r\n '.lc-case__stage'\r\n );\r\n\r\n\r\n const caseList =\r\n root.querySelector(\r\n '.lc-case__case-list'\r\n );\r\n\r\n\r\n const cards =\r\n [\r\n ...root.querySelectorAll(\r\n '.lc-case__card'\r\n )\r\n ];\r\n\r\n\r\n const filterButtons =\r\n [\r\n ...root.querySelectorAll(\r\n '.lc-case__filter'\r\n )\r\n ];\r\n\r\n\r\n const meta =\r\n root.querySelector(\r\n '.lc-case__meta'\r\n );\r\n\r\n\r\n const metaCategory =\r\n root.querySelector(\r\n '.lc-case__meta-category'\r\n );\r\n\r\n\r\n const metaCount =\r\n root.querySelector(\r\n '.lc-case__meta-count'\r\n );\r\n\r\n\r\n const metaTreatment =\r\n root.querySelector(\r\n '.lc-case__meta-treatment'\r\n );\r\n\r\n\r\n const metaFollow =\r\n root.querySelector(\r\n '.lc-case__meta-follow'\r\n );\r\n\r\n\r\n const mobileProgressFill =\r\n root.querySelector(\r\n '.lc-case__mobile-progress-fill'\r\n );\r\n\r\n\r\n const reducedMotion =\r\n window.matchMedia(\r\n '(prefers-reduced-motion: reduce)'\r\n );\r\n\r\n\r\n const mobileModeQuery =\r\n window.matchMedia(\r\n '(max-width:1024px)'\r\n );\r\n\r\n\r\n const caseData =\r\n [\r\n {\r\n caseId:'hair-01',\r\n category:'hair',\r\n categoryLabel:'Hair Restoration',\r\n treatment:'Hair restoration case',\r\n followUp:null,\r\n layout:'stacked',\r\n mobileLayout:'stacked',\r\n beforePositionMobile:null,\r\n afterPositionMobile:null\r\n },\r\n\r\n {\r\n caseId:'hair-02',\r\n category:'hair',\r\n categoryLabel:'Hair Restoration',\r\n treatment:'Hair restoration case',\r\n followUp:null,\r\n layout:'stacked',\r\n mobileLayout:'stacked',\r\n beforePositionMobile:null,\r\n afterPositionMobile:null\r\n },\r\n\r\n {\r\n caseId:'hair-03',\r\n category:'hair',\r\n categoryLabel:'Hair Restoration',\r\n treatment:'Hair restoration case',\r\n followUp:null,\r\n layout:'stacked',\r\n mobileLayout:'stacked',\r\n beforePositionMobile:null,\r\n afterPositionMobile:null\r\n },\r\n\r\n {\r\n caseId:'beard-04',\r\n category:'browbeard',\r\n categoryLabel:'Brow & Beard',\r\n treatment:'Beard restoration case',\r\n followUp:null,\r\n layout:'side',\r\n mobileLayout:'side',\r\n beforePositionMobile:null,\r\n afterPositionMobile:null\r\n },\r\n\r\n {\r\n caseId:'brow-05',\r\n category:'browbeard',\r\n categoryLabel:'Brow & Beard',\r\n treatment:'Eyebrow restoration case',\r\n followUp:null,\r\n layout:'side',\r\n mobileLayout:'side',\r\n beforePositionMobile:null,\r\n afterPositionMobile:null\r\n },\r\n\r\n {\r\n caseId:'dental-06',\r\n category:'dental',\r\n categoryLabel:'Dental Aesthetics',\r\n treatment:'Dental aesthetics case',\r\n followUp:null,\r\n layout:'side',\r\n mobileLayout:'side',\r\n beforePositionMobile:null,\r\n afterPositionMobile:null\r\n },\r\n\r\n {\r\n caseId:'dental-07',\r\n category:'dental',\r\n categoryLabel:'Dental Aesthetics',\r\n treatment:'Dental aesthetics case',\r\n followUp:null,\r\n layout:'side',\r\n mobileLayout:'side',\r\n beforePositionMobile:null,\r\n afterPositionMobile:null\r\n },\r\n\r\n {\r\n caseId:'dental-08',\r\n category:'dental',\r\n categoryLabel:'Dental Aesthetics',\r\n treatment:'Dental aesthetics case',\r\n followUp:null,\r\n layout:'side',\r\n mobileLayout:'side',\r\n beforePositionMobile:null,\r\n afterPositionMobile:null\r\n }\r\n ];\r\n\r\n\r\n if (\r\n !stage ||\r\n !caseList ||\r\n !cards.length\r\n ) return;\r\n\r\n\r\n const cardById =\r\n new Map(\r\n cards.map(\r\n card => [\r\n card.dataset.caseId,\r\n card\r\n ]\r\n )\r\n );\r\n\r\n\r\n let activeFilter =\r\n 'all';\r\n\r\n\r\n let visibleCases =\r\n caseData.slice();\r\n\r\n\r\n let activeCaseId =\r\n caseData[0].caseId;\r\n\r\n\r\n let activeMetaIndex =\r\n -1;\r\n\r\n\r\n let metaTimer =\r\n null;\r\n\r\n\r\n let filterTimer =\r\n null;\r\n\r\n\r\n let mode =\r\n null;\r\n\r\n\r\n let sectionNear =\r\n true;\r\n\r\n\r\n function clamp(\r\n value,\r\n min,\r\n max\r\n ){\r\n\r\n return Math.min(\r\n max,\r\n Math.max(\r\n min,\r\n value\r\n )\r\n );\r\n\r\n }\r\n\r\n\r\n function lerp(\r\n a,\r\n b,\r\n t\r\n ){\r\n\r\n return (\r\n a +\r\n (\r\n b -\r\n a\r\n ) *\r\n t\r\n );\r\n\r\n }\r\n\r\n\r\n function visibleIndexForId(\r\n caseId\r\n ){\r\n\r\n return visibleCases.findIndex(\r\n item =>\r\n item.caseId ===\r\n caseId\r\n );\r\n\r\n }\r\n\r\n\r\n function caseForId(\r\n caseId\r\n ){\r\n\r\n return caseData.find(\r\n item =>\r\n item.caseId ===\r\n caseId\r\n );\r\n\r\n }\r\n\r\n\r\n function syncFilterButtons(){\r\n\r\n filterButtons.forEach(\r\n button => {\r\n\r\n const active =\r\n button.dataset.filter ===\r\n activeFilter;\r\n\r\n\r\n button.classList.toggle(\r\n 'is-active',\r\n active\r\n );\r\n\r\n\r\n button.setAttribute(\r\n 'aria-pressed',\r\n active\r\n ? 'true'\r\n : 'false'\r\n );\r\n\r\n }\r\n );\r\n\r\n }\r\n\r\n\r\n function setMobileProgress(\r\n index\r\n ){\r\n\r\n if (\r\n !mobileProgressFill\r\n ) return;\r\n\r\n\r\n const denominator =\r\n Math.max(\r\n 1,\r\n visibleCases.length -\r\n 1\r\n );\r\n\r\n\r\n const progress =\r\n visibleCases.length <=\r\n 1\r\n ? 1\r\n : clamp(\r\n index \/\r\n denominator,\r\n 0,\r\n 1\r\n );\r\n\r\n\r\n mobileProgressFill.style.setProperty(\r\n '--mobile-progress',\r\n progress.toFixed(\r\n 4\r\n )\r\n );\r\n\r\n }\r\n\r\n\r\n function commitMetadata(\r\n index\r\n ){\r\n\r\n const current =\r\n visibleCases[\r\n index\r\n ];\r\n\r\n\r\n if (\r\n !current ||\r\n !meta\r\n ) return;\r\n\r\n\r\n activeMetaIndex =\r\n index;\r\n\r\n\r\n if (\r\n metaCategory\r\n ){\r\n\r\n metaCategory.textContent =\r\n current.categoryLabel;\r\n\r\n }\r\n\r\n\r\n if (\r\n metaCount\r\n ){\r\n\r\n metaCount.textContent =\r\n String(\r\n index +\r\n 1\r\n ).padStart(\r\n 2,\r\n '0'\r\n ) +\r\n ' \/ ' +\r\n String(\r\n visibleCases.length\r\n ).padStart(\r\n 2,\r\n '0'\r\n );\r\n\r\n }\r\n\r\n\r\n if (\r\n metaTreatment\r\n ){\r\n\r\n metaTreatment.textContent =\r\n current.treatment;\r\n\r\n }\r\n\r\n\r\n if (\r\n metaFollow\r\n ){\r\n\r\n metaFollow.textContent =\r\n current.followUp ||\r\n 'Verified follow-up details to be supplied by Lamina Clinic.';\r\n\r\n }\r\n\r\n\r\n setMobileProgress(\r\n index\r\n );\r\n\r\n }\r\n\r\n\r\n function setMetadata(\r\n index,\r\n immediate =\r\n false\r\n ){\r\n\r\n if (\r\n index ===\r\n activeMetaIndex &&\r\n !immediate\r\n ) return;\r\n\r\n\r\n const current =\r\n visibleCases[\r\n index\r\n ];\r\n\r\n\r\n if (\r\n !current ||\r\n !meta\r\n ) return;\r\n\r\n\r\n window.clearTimeout(\r\n metaTimer\r\n );\r\n\r\n\r\n if (\r\n immediate ||\r\n reducedMotion.matches\r\n ){\r\n\r\n meta.classList.remove(\r\n 'is-changing'\r\n );\r\n\r\n\r\n commitMetadata(\r\n index\r\n );\r\n\r\n\r\n return;\r\n\r\n }\r\n\r\n\r\n meta.classList.add(\r\n 'is-changing'\r\n );\r\n\r\n\r\n metaTimer =\r\n window.setTimeout(\r\n () => {\r\n\r\n commitMetadata(\r\n index\r\n );\r\n\r\n\r\n requestAnimationFrame(\r\n () => {\r\n\r\n meta.classList.remove(\r\n 'is-changing'\r\n );\r\n\r\n }\r\n );\r\n\r\n },\r\n mode ===\r\n 'mobile'\r\n ? 165\r\n : 190\r\n );\r\n\r\n }\r\n\r\n\r\n \/* =======================================================\r\n EXIT FOCUS \u2014 ONE VERTICAL-SCROLL CONTROLLER\r\n Mobile reel logic never drives this.\r\n ======================================================= *\/\r\n\r\n const exitTargets =\r\n [\r\n ...root.querySelectorAll(\r\n '[data-exit-layer]'\r\n )\r\n ];\r\n\r\n\r\n let exitMetrics =\r\n [];\r\n\r\n\r\n let exitTicking =\r\n false;\r\n\r\n\r\n let previousWindowY =\r\n window.scrollY;\r\n\r\n\r\n let scrollDirection =\r\n 0;\r\n\r\n\r\n const exitProgressByElement =\r\n new WeakMap();\r\n\r\n\r\n function exitConfigFor(\r\n type,\r\n compact\r\n ){\r\n\r\n const desktop =\r\n {\r\n eyebrow:{\r\n start:.24,\r\n full:-.10,\r\n blur:2.35\r\n },\r\n headline:{\r\n start:.22,\r\n full:-.12,\r\n blur:2.35\r\n },\r\n copy:{\r\n start:.18,\r\n full:-.15,\r\n blur:2.05\r\n },\r\n ui:{\r\n start:.14,\r\n full:-.17,\r\n blur:1.65\r\n },\r\n metadata:{\r\n start:.10,\r\n full:-.20,\r\n blur:1.55\r\n },\r\n media:{\r\n start:.055,\r\n full:-.24,\r\n blur:1.75\r\n }\r\n };\r\n\r\n\r\n const mobile =\r\n {\r\n eyebrow:{\r\n start:.15,\r\n full:-.11,\r\n blur:1.45\r\n },\r\n headline:{\r\n start:.13,\r\n full:-.13,\r\n blur:1.45\r\n },\r\n copy:{\r\n start:.09,\r\n full:-.16,\r\n blur:1.20\r\n },\r\n ui:{\r\n start:.06,\r\n full:-.18,\r\n blur:1.00\r\n },\r\n metadata:{\r\n start:.015,\r\n full:-.21,\r\n blur:1.00\r\n },\r\n media:{\r\n \/*\r\n The medical comparison remains sharp the longest.\r\n It only begins to soften once its center is already\r\n above the viewport's top edge.\r\n *\/\r\n start:-.035,\r\n full:-.27,\r\n blur:1.45\r\n }\r\n };\r\n\r\n\r\n const set =\r\n compact\r\n ? mobile\r\n : desktop;\r\n\r\n\r\n return (\r\n set[\r\n type\r\n ] ||\r\n set.copy\r\n );\r\n\r\n }\r\n\r\n\r\n function smootherstep(\r\n value\r\n ){\r\n\r\n const t =\r\n clamp(\r\n value,\r\n 0,\r\n 1\r\n );\r\n\r\n\r\n return (\r\n t *\r\n t *\r\n t *\r\n (\r\n t *\r\n (\r\n t *\r\n 6 -\r\n 15\r\n ) +\r\n 10\r\n )\r\n );\r\n\r\n }\r\n\r\n\r\n function measureExitFocus(){\r\n\r\n const currentY =\r\n window.scrollY;\r\n\r\n\r\n const stageRect =\r\n stage.getBoundingClientRect();\r\n\r\n\r\n const desktopSticky =\r\n mode ===\r\n 'desktop';\r\n\r\n\r\n exitMetrics =\r\n exitTargets.map(\r\n element => {\r\n\r\n const rect =\r\n element.getBoundingClientRect();\r\n\r\n\r\n const insideStage =\r\n desktopSticky &&\r\n stage.contains(\r\n element\r\n );\r\n\r\n\r\n return {\r\n element,\r\n type:\r\n element.dataset.exitLayer ||\r\n 'copy',\r\n insideStage,\r\n stageCenterOffset:\r\n insideStage\r\n ? (\r\n rect.top -\r\n stageRect.top +\r\n rect.height *\r\n .5\r\n )\r\n : 0,\r\n documentCenterY:\r\n insideStage\r\n ? 0\r\n : (\r\n currentY +\r\n rect.top +\r\n rect.height *\r\n .5\r\n )\r\n };\r\n\r\n }\r\n );\r\n\r\n }\r\n\r\n\r\n function clearExitFocus(){\r\n\r\n exitTargets.forEach(\r\n element => {\r\n\r\n exitProgressByElement.set(\r\n element,\r\n 0\r\n );\r\n\r\n\r\n element.style.setProperty(\r\n '--lc-section-exit-blur',\r\n '0px'\r\n );\r\n\r\n }\r\n );\r\n\r\n }\r\n\r\n\r\n function renderExitFocus(){\r\n\r\n exitTicking =\r\n false;\r\n\r\n\r\n if (\r\n reducedMotion.matches ||\r\n !sectionNear\r\n ){\r\n\r\n clearExitFocus();\r\n return;\r\n\r\n }\r\n\r\n\r\n const currentY =\r\n window.scrollY;\r\n\r\n\r\n const delta =\r\n currentY -\r\n previousWindowY;\r\n\r\n\r\n if (\r\n delta >\r\n 2\r\n ){\r\n\r\n scrollDirection =\r\n 1;\r\n\r\n }else if(\r\n delta <\r\n -2\r\n ){\r\n\r\n scrollDirection =\r\n -1;\r\n\r\n }\r\n\r\n\r\n previousWindowY =\r\n currentY;\r\n\r\n\r\n const viewportHeight =\r\n Math.max(\r\n 1,\r\n window.innerHeight ||\r\n document.documentElement.clientHeight\r\n );\r\n\r\n\r\n const compact =\r\n mode ===\r\n 'mobile';\r\n\r\n\r\n const stageTop =\r\n mode ===\r\n 'desktop'\r\n ? stage.getBoundingClientRect().top\r\n : 0;\r\n\r\n\r\n const holdMedia =\r\n root.dataset.mobileReelTouch ===\r\n 'true';\r\n\r\n\r\n exitMetrics.forEach(\r\n item => {\r\n\r\n const config =\r\n exitConfigFor(\r\n item.type,\r\n compact\r\n );\r\n\r\n\r\n const focused =\r\n item.element.matches(\r\n ':focus-within'\r\n );\r\n\r\n\r\n if (\r\n focused ||\r\n (\r\n holdMedia &&\r\n item.type ===\r\n 'media'\r\n )\r\n ){\r\n\r\n exitProgressByElement.set(\r\n item.element,\r\n 0\r\n );\r\n\r\n\r\n item.element.style.setProperty(\r\n '--lc-section-exit-blur',\r\n '0px'\r\n );\r\n\r\n\r\n return;\r\n\r\n }\r\n\r\n\r\n const centerY =\r\n item.insideStage\r\n ? (\r\n stageTop +\r\n item.stageCenterOffset\r\n )\r\n : (\r\n item.documentCenterY -\r\n currentY\r\n );\r\n\r\n\r\n const startY =\r\n viewportHeight *\r\n config.start;\r\n\r\n\r\n const fullY =\r\n viewportHeight *\r\n config.full;\r\n\r\n\r\n const geometric =\r\n centerY <\r\n startY\r\n ? smootherstep(\r\n (\r\n startY -\r\n centerY\r\n ) \/\r\n Math.max(\r\n 1,\r\n startY -\r\n fullY\r\n )\r\n )\r\n : 0;\r\n\r\n\r\n const previous =\r\n exitProgressByElement.get(\r\n item.element\r\n ) ||\r\n 0;\r\n\r\n\r\n let target =\r\n previous;\r\n\r\n\r\n if (\r\n scrollDirection >\r\n 0\r\n ){\r\n\r\n \/*\r\n Scrolling DOWN:\r\n leaving content may become softer.\r\n *\/\r\n target =\r\n geometric;\r\n\r\n }else if(\r\n scrollDirection <\r\n 0\r\n ){\r\n\r\n \/*\r\n Scrolling UP:\r\n returning content immediately begins refocusing;\r\n it can never become softer from stale down-scroll state.\r\n *\/\r\n target =\r\n Math.min(\r\n previous,\r\n geometric\r\n );\r\n\r\n }else if(\r\n previous ===\r\n 0\r\n ){\r\n\r\n \/*\r\n Initial page load \/ resize:\r\n avoid unexpectedly blurring content before direction exists.\r\n *\/\r\n target =\r\n 0;\r\n\r\n }\r\n\r\n\r\n exitProgressByElement.set(\r\n item.element,\r\n target\r\n );\r\n\r\n\r\n item.element.style.setProperty(\r\n '--lc-section-exit-blur',\r\n (\r\n config.blur *\r\n target\r\n ).toFixed(\r\n 2\r\n ) +\r\n 'px'\r\n );\r\n\r\n }\r\n );\r\n\r\n }\r\n\r\n\r\n function requestExitFocus(){\r\n\r\n if (\r\n exitTicking\r\n ) return;\r\n\r\n\r\n exitTicking =\r\n true;\r\n\r\n\r\n requestAnimationFrame(\r\n renderExitFocus\r\n );\r\n\r\n }\r\n\r\n\r\n \/* =======================================================\r\n DESKTOP CONTROLLER \u2014 ORIGINAL CASE-WHEEL BEHAVIOR\r\n ======================================================= *\/\r\n\r\n let desktopTicking =\r\n false;\r\n\r\n\r\n let desktopSectionTop =\r\n 0;\r\n\r\n\r\n let viewportHeight =\r\n Math.max(\r\n 1,\r\n window.innerHeight\r\n );\r\n\r\n\r\n let entryDistance =\r\n viewportHeight *\r\n .42;\r\n\r\n\r\n let caseDistance =\r\n viewportHeight *\r\n .78;\r\n\r\n\r\n let exitDistance =\r\n viewportHeight *\r\n .72;\r\n\r\n\r\n let scrollDistance =\r\n 1;\r\n\r\n\r\n let caseStart =\r\n 0;\r\n\r\n\r\n let caseEnd =\r\n 0;\r\n\r\n\r\n function cardState(\r\n delta\r\n ){\r\n\r\n const distance =\r\n Math.abs(\r\n delta\r\n );\r\n\r\n\r\n const isOlderAbove =\r\n delta <\r\n 0;\r\n\r\n\r\n if (\r\n distance >=\r\n 2.55\r\n ){\r\n\r\n return {\r\n y:\r\n delta >\r\n 0\r\n ? 112\r\n : -112,\r\n scale:.64,\r\n opacity:0,\r\n blur:\r\n isOlderAbove\r\n ? 2.35\r\n : 0,\r\n interactive:false\r\n };\r\n\r\n }\r\n\r\n\r\n if (\r\n distance >=\r\n 1\r\n ){\r\n\r\n const t =\r\n clamp(\r\n distance -\r\n 1,\r\n 0,\r\n 1\r\n );\r\n\r\n\r\n return {\r\n y:\r\n Math.sign(\r\n delta\r\n ) *\r\n lerp(\r\n 60,\r\n 101,\r\n t\r\n ),\r\n scale:\r\n lerp(\r\n .80,\r\n .67,\r\n t\r\n ),\r\n opacity:\r\n lerp(\r\n .38,\r\n .11,\r\n t\r\n ),\r\n blur:\r\n isOlderAbove\r\n ? lerp(\r\n 1.05,\r\n 2.35,\r\n t\r\n )\r\n : 0,\r\n interactive:false\r\n };\r\n\r\n }\r\n\r\n\r\n const blurProgress =\r\n isOlderAbove &&\r\n distance >\r\n .58\r\n ? clamp(\r\n (\r\n distance -\r\n .58\r\n ) \/\r\n .42,\r\n 0,\r\n 1\r\n )\r\n : 0;\r\n\r\n\r\n const easedBlur =\r\n smootherstep(\r\n blurProgress\r\n );\r\n\r\n\r\n return {\r\n y:\r\n delta *\r\n 60,\r\n scale:\r\n lerp(\r\n 1,\r\n .80,\r\n distance\r\n ),\r\n opacity:\r\n lerp(\r\n 1,\r\n .38,\r\n distance\r\n ),\r\n blur:\r\n isOlderAbove\r\n ? 1.05 *\r\n easedBlur\r\n : 0,\r\n interactive:\r\n distance <\r\n .34\r\n };\r\n\r\n }\r\n\r\n\r\n function measureDesktop(){\r\n\r\n viewportHeight =\r\n Math.max(\r\n 1,\r\n window.innerHeight ||\r\n document.documentElement.clientHeight\r\n );\r\n\r\n\r\n entryDistance =\r\n viewportHeight *\r\n .42;\r\n\r\n\r\n caseDistance =\r\n viewportHeight *\r\n .78;\r\n\r\n\r\n exitDistance =\r\n viewportHeight *\r\n .72;\r\n\r\n\r\n const progression =\r\n Math.max(\r\n 0,\r\n visibleCases.length -\r\n 1\r\n ) *\r\n caseDistance;\r\n\r\n\r\n scrollDistance =\r\n entryDistance +\r\n progression +\r\n exitDistance;\r\n\r\n\r\n root.style.height =\r\n (\r\n viewportHeight +\r\n scrollDistance\r\n ) +\r\n 'px';\r\n\r\n\r\n const rect =\r\n root.getBoundingClientRect();\r\n\r\n\r\n desktopSectionTop =\r\n window.scrollY +\r\n rect.top;\r\n\r\n\r\n caseStart =\r\n entryDistance;\r\n\r\n\r\n caseEnd =\r\n entryDistance +\r\n progression;\r\n\r\n\r\n measureExitFocus();\r\n\r\n }\r\n\r\n\r\n function renderDesktop(){\r\n\r\n desktopTicking =\r\n false;\r\n\r\n\r\n if (\r\n mode !==\r\n 'desktop' ||\r\n !sectionNear\r\n ) return;\r\n\r\n\r\n const localScroll =\r\n clamp(\r\n window.scrollY -\r\n desktopSectionTop,\r\n 0,\r\n scrollDistance\r\n );\r\n\r\n\r\n const entryProgress =\r\n clamp(\r\n localScroll \/\r\n Math.max(\r\n 1,\r\n entryDistance\r\n ),\r\n 0,\r\n 1\r\n );\r\n\r\n\r\n const exitProgress =\r\n caseEnd <=\r\n 0\r\n ? 0\r\n : clamp(\r\n (\r\n localScroll -\r\n caseEnd\r\n ) \/\r\n Math.max(\r\n 1,\r\n exitDistance\r\n ),\r\n 0,\r\n 1\r\n );\r\n\r\n\r\n stage.classList.toggle(\r\n 'is-entry',\r\n entryProgress <\r\n .98\r\n );\r\n\r\n\r\n stage.classList.toggle(\r\n 'is-exit',\r\n exitProgress >\r\n .02\r\n );\r\n\r\n\r\n let casePosition =\r\n 0;\r\n\r\n\r\n if (\r\n visibleCases.length >\r\n 1\r\n ){\r\n\r\n casePosition =\r\n clamp(\r\n (\r\n localScroll -\r\n caseStart\r\n ) \/\r\n caseDistance,\r\n 0,\r\n visibleCases.length -\r\n 1\r\n );\r\n\r\n }\r\n\r\n\r\n cards.forEach(\r\n card => {\r\n\r\n const dataIndex =\r\n visibleCases.findIndex(\r\n item =>\r\n item.caseId ===\r\n card.dataset.caseId\r\n );\r\n\r\n\r\n if (\r\n dataIndex <\r\n 0\r\n ){\r\n\r\n card.style.opacity =\r\n '0';\r\n\r\n\r\n card.style.pointerEvents =\r\n 'none';\r\n\r\n\r\n card.style.setProperty(\r\n '--case-blur',\r\n '0px'\r\n );\r\n\r\n\r\n card.setAttribute(\r\n 'aria-hidden',\r\n 'true'\r\n );\r\n\r\n\r\n return;\r\n\r\n }\r\n\r\n\r\n const delta =\r\n dataIndex -\r\n casePosition;\r\n\r\n\r\n const state =\r\n cardState(\r\n delta\r\n );\r\n\r\n\r\n card.style.transform =\r\n 'translate3d(-50%,calc(-50% + ' +\r\n state.y.toFixed(\r\n 3\r\n ) +\r\n '%),0) scale(' +\r\n state.scale.toFixed(\r\n 4\r\n ) +\r\n ')';\r\n\r\n\r\n card.style.opacity =\r\n state.opacity.toFixed(\r\n 4\r\n );\r\n\r\n\r\n card.style.setProperty(\r\n '--case-blur',\r\n Math.min(\r\n state.blur,\r\n 2.35\r\n ).toFixed(\r\n 2\r\n ) +\r\n 'px'\r\n );\r\n\r\n\r\n card.style.zIndex =\r\n String(\r\n Math.max(\r\n 1,\r\n 100 -\r\n Math.round(\r\n Math.abs(\r\n delta\r\n ) *\r\n 20\r\n )\r\n )\r\n );\r\n\r\n\r\n card.classList.toggle(\r\n 'is-interactive',\r\n state.interactive\r\n );\r\n\r\n\r\n card.setAttribute(\r\n 'aria-hidden',\r\n state.opacity <\r\n .08\r\n ? 'true'\r\n : 'false'\r\n );\r\n\r\n }\r\n );\r\n\r\n\r\n const nearest =\r\n clamp(\r\n Math.round(\r\n casePosition\r\n ),\r\n 0,\r\n Math.max(\r\n 0,\r\n visibleCases.length -\r\n 1\r\n )\r\n );\r\n\r\n\r\n const nearestCase =\r\n visibleCases[\r\n nearest\r\n ];\r\n\r\n\r\n if (\r\n nearestCase\r\n ){\r\n\r\n activeCaseId =\r\n nearestCase.caseId;\r\n\r\n }\r\n\r\n\r\n setMetadata(\r\n nearest\r\n );\r\n\r\n }\r\n\r\n\r\n function requestDesktopRender(){\r\n\r\n if (\r\n desktopTicking ||\r\n mode !==\r\n 'desktop'\r\n ) return;\r\n\r\n\r\n desktopTicking =\r\n true;\r\n\r\n\r\n requestAnimationFrame(\r\n renderDesktop\r\n );\r\n\r\n }\r\n\r\n\r\n function clearDesktopCardInlineState(){\r\n\r\n cards.forEach(\r\n card => {\r\n\r\n card.style.removeProperty(\r\n 'transform'\r\n );\r\n\r\n\r\n card.style.removeProperty(\r\n 'opacity'\r\n );\r\n\r\n\r\n card.style.removeProperty(\r\n 'pointer-events'\r\n );\r\n\r\n\r\n card.style.removeProperty(\r\n 'z-index'\r\n );\r\n\r\n\r\n card.style.setProperty(\r\n '--case-blur',\r\n '0px'\r\n );\r\n\r\n\r\n card.classList.remove(\r\n 'is-interactive'\r\n );\r\n\r\n }\r\n );\r\n\r\n }\r\n\r\n\r\n function initDesktop(\r\n preserveCase =\r\n true\r\n ){\r\n\r\n mode =\r\n 'desktop';\r\n\r\n\r\n root.classList.remove(\r\n 'is-mobile-reel'\r\n );\r\n\r\n\r\n root.classList.add(\r\n 'is-enhanced'\r\n );\r\n\r\n\r\n root.setAttribute(\r\n 'aria-labelledby',\r\n 'lamina-real-cases-title'\r\n );\r\n\r\n\r\n cards.forEach(\r\n card => {\r\n\r\n card.classList.remove(\r\n 'is-mobile-active',\r\n 'is-mobile-hidden'\r\n );\r\n\r\n\r\n card.removeAttribute(\r\n 'data-mobile-layout'\r\n );\r\n\r\n\r\n card.style.removeProperty(\r\n '--mobile-object-position'\r\n );\r\n\r\n\r\n card.style.removeProperty(\r\n 'display'\r\n );\r\n\r\n }\r\n );\r\n\r\n\r\n measureDesktop();\r\n\r\n\r\n if (\r\n preserveCase &&\r\n visibleCases.length\r\n ){\r\n\r\n const index =\r\n Math.max(\r\n 0,\r\n visibleIndexForId(\r\n activeCaseId\r\n )\r\n );\r\n\r\n\r\n const rootRect =\r\n root.getBoundingClientRect();\r\n\r\n\r\n const sectionVisible =\r\n rootRect.bottom >\r\n 0 &&\r\n rootRect.top <\r\n viewportHeight;\r\n\r\n\r\n if (\r\n sectionVisible\r\n ){\r\n\r\n window.scrollTo(\r\n {\r\n top:\r\n desktopSectionTop +\r\n caseStart +\r\n index *\r\n caseDistance +\r\n 1,\r\n behavior:'auto'\r\n }\r\n );\r\n\r\n }\r\n\r\n }\r\n\r\n\r\n renderDesktop();\r\n\r\n\r\n measureExitFocus();\r\n\r\n\r\n requestExitFocus();\r\n\r\n }\r\n\r\n\r\n function destroyDesktop(){\r\n\r\n root.classList.remove(\r\n 'is-enhanced'\r\n );\r\n\r\n\r\n root.style.height =\r\n '';\r\n\r\n\r\n stage.classList.remove(\r\n 'is-entry',\r\n 'is-exit',\r\n 'is-filtering'\r\n );\r\n\r\n\r\n clearDesktopCardInlineState();\r\n\r\n }\r\n\r\n\r\n \/* =======================================================\r\n MOBILE \/ COMPACT TABLET CONTROLLER \u2014 CASE REEL\r\n ======================================================= *\/\r\n\r\n let mobileScrollTicking =\r\n false;\r\n\r\n\r\n let mobileSnapOffsets =\r\n [];\r\n\r\n\r\n let mobileActiveIndex =\r\n 0;\r\n\r\n\r\n let mobileRailPadding =\r\n 0;\r\n\r\n\r\n let mobilePointerHeld =\r\n false;\r\n\r\n\r\n function applyMobileCardPresentation(){\r\n\r\n cards.forEach(\r\n card => {\r\n\r\n const data =\r\n caseForId(\r\n card.dataset.caseId\r\n );\r\n\r\n\r\n if (\r\n !data\r\n ) return;\r\n\r\n\r\n card.dataset.mobileLayout =\r\n data.mobileLayout ||\r\n data.layout ||\r\n 'side';\r\n\r\n\r\n const images =\r\n [\r\n ...card.querySelectorAll(\r\n '.lc-case__photo img'\r\n )\r\n ];\r\n\r\n\r\n images.forEach(\r\n (\r\n image,\r\n index\r\n ) => {\r\n\r\n const position =\r\n index ===\r\n 0\r\n ? data.beforePositionMobile\r\n : data.afterPositionMobile;\r\n\r\n\r\n if (\r\n position\r\n ){\r\n\r\n image.style.setProperty(\r\n '--mobile-object-position',\r\n position\r\n );\r\n\r\n }else{\r\n\r\n image.style.removeProperty(\r\n '--mobile-object-position'\r\n );\r\n\r\n }\r\n\r\n }\r\n );\r\n\r\n }\r\n );\r\n\r\n }\r\n\r\n\r\n function applyMobileVisibility(){\r\n\r\n const visibleIds =\r\n new Set(\r\n visibleCases.map(\r\n item =>\r\n item.caseId\r\n )\r\n );\r\n\r\n\r\n cards.forEach(\r\n card => {\r\n\r\n const visible =\r\n visibleIds.has(\r\n card.dataset.caseId\r\n );\r\n\r\n\r\n card.classList.toggle(\r\n 'is-mobile-hidden',\r\n !visible\r\n );\r\n\r\n\r\n card.setAttribute(\r\n 'aria-hidden',\r\n visible\r\n ? 'false'\r\n : 'true'\r\n );\r\n\r\n\r\n if (\r\n !visible\r\n ){\r\n\r\n card.classList.remove(\r\n 'is-mobile-active'\r\n );\r\n\r\n\r\n card.removeAttribute(\r\n 'aria-current'\r\n );\r\n\r\n }\r\n\r\n }\r\n );\r\n\r\n }\r\n\r\n\r\n function cacheMobileSnapOffsets(){\r\n\r\n const style =\r\n window.getComputedStyle(\r\n caseList\r\n );\r\n\r\n\r\n mobileRailPadding =\r\n parseFloat(\r\n style.paddingInlineStart ||\r\n style.paddingLeft ||\r\n '0'\r\n ) ||\r\n 0;\r\n\r\n\r\n mobileSnapOffsets =\r\n visibleCases\r\n .map(\r\n item => {\r\n\r\n const card =\r\n cardById.get(\r\n item.caseId\r\n );\r\n\r\n\r\n if (\r\n !card ||\r\n card.classList.contains(\r\n 'is-mobile-hidden'\r\n )\r\n ){\r\n\r\n return null;\r\n\r\n }\r\n\r\n\r\n return {\r\n caseId:\r\n item.caseId,\r\n left:\r\n Math.max(\r\n 0,\r\n card.offsetLeft -\r\n mobileRailPadding\r\n )\r\n };\r\n\r\n }\r\n )\r\n .filter(\r\n Boolean\r\n );\r\n\r\n }\r\n\r\n\r\n function nearestMobileIndex(){\r\n\r\n if (\r\n !mobileSnapOffsets.length\r\n ) return 0;\r\n\r\n\r\n const current =\r\n caseList.scrollLeft;\r\n\r\n\r\n let nearest =\r\n 0;\r\n\r\n\r\n let nearestDistance =\r\n Infinity;\r\n\r\n\r\n mobileSnapOffsets.forEach(\r\n (\r\n item,\r\n index\r\n ) => {\r\n\r\n const distance =\r\n Math.abs(\r\n current -\r\n item.left\r\n );\r\n\r\n\r\n if (\r\n distance <\r\n nearestDistance\r\n ){\r\n\r\n nearestDistance =\r\n distance;\r\n\r\n\r\n nearest =\r\n index;\r\n\r\n }\r\n\r\n }\r\n );\r\n\r\n\r\n return nearest;\r\n\r\n }\r\n\r\n\r\n function setMobileActive(\r\n index,\r\n immediateMeta =\r\n false\r\n ){\r\n\r\n const safeIndex =\r\n clamp(\r\n index,\r\n 0,\r\n Math.max(\r\n 0,\r\n visibleCases.length -\r\n 1\r\n )\r\n );\r\n\r\n\r\n mobileActiveIndex =\r\n safeIndex;\r\n\r\n\r\n const current =\r\n visibleCases[\r\n safeIndex\r\n ];\r\n\r\n\r\n if (\r\n !current\r\n ) return;\r\n\r\n\r\n activeCaseId =\r\n current.caseId;\r\n\r\n\r\n cards.forEach(\r\n card => {\r\n\r\n const active =\r\n card.dataset.caseId ===\r\n activeCaseId;\r\n\r\n\r\n card.classList.toggle(\r\n 'is-mobile-active',\r\n active\r\n );\r\n\r\n\r\n if (\r\n active\r\n ){\r\n\r\n card.setAttribute(\r\n 'aria-current',\r\n 'true'\r\n );\r\n\r\n }else{\r\n\r\n card.removeAttribute(\r\n 'aria-current'\r\n );\r\n\r\n }\r\n\r\n }\r\n );\r\n\r\n\r\n setMetadata(\r\n safeIndex,\r\n immediateMeta\r\n );\r\n\r\n }\r\n\r\n\r\n function renderMobileScroll(){\r\n\r\n mobileScrollTicking =\r\n false;\r\n\r\n\r\n if (\r\n mode !==\r\n 'mobile'\r\n ) return;\r\n\r\n\r\n const nearest =\r\n nearestMobileIndex();\r\n\r\n\r\n if (\r\n nearest !==\r\n mobileActiveIndex\r\n ){\r\n\r\n setMobileActive(\r\n nearest\r\n );\r\n\r\n }\r\n\r\n }\r\n\r\n\r\n function requestMobileScrollRender(){\r\n\r\n if (\r\n mobileScrollTicking ||\r\n mode !==\r\n 'mobile'\r\n ) return;\r\n\r\n\r\n mobileScrollTicking =\r\n true;\r\n\r\n\r\n requestAnimationFrame(\r\n renderMobileScroll\r\n );\r\n\r\n }\r\n\r\n\r\n function scrollMobileToIndex(\r\n index,\r\n behavior =\r\n 'auto'\r\n ){\r\n\r\n const safeIndex =\r\n clamp(\r\n index,\r\n 0,\r\n Math.max(\r\n 0,\r\n mobileSnapOffsets.length -\r\n 1\r\n )\r\n );\r\n\r\n\r\n const target =\r\n mobileSnapOffsets[\r\n safeIndex\r\n ];\r\n\r\n\r\n if (\r\n !target\r\n ) return;\r\n\r\n\r\n caseList.scrollTo(\r\n {\r\n left:\r\n target.left,\r\n behavior:\r\n reducedMotion.matches\r\n ? 'auto'\r\n : behavior\r\n }\r\n );\r\n\r\n\r\n setMobileActive(\r\n safeIndex,\r\n behavior ===\r\n 'auto'\r\n );\r\n\r\n }\r\n\r\n\r\n function handleMobileKeydown(\r\n event\r\n ){\r\n\r\n if (\r\n mode !==\r\n 'mobile'\r\n ) return;\r\n\r\n\r\n let target =\r\n null;\r\n\r\n\r\n if (\r\n event.key ===\r\n 'ArrowRight'\r\n ){\r\n\r\n target =\r\n mobileActiveIndex +\r\n 1;\r\n\r\n }else if(\r\n event.key ===\r\n 'ArrowLeft'\r\n ){\r\n\r\n target =\r\n mobileActiveIndex -\r\n 1;\r\n\r\n }else if(\r\n event.key ===\r\n 'Home'\r\n ){\r\n\r\n target =\r\n 0;\r\n\r\n }else if(\r\n event.key ===\r\n 'End'\r\n ){\r\n\r\n target =\r\n visibleCases.length -\r\n 1;\r\n\r\n }else{\r\n\r\n return;\r\n\r\n }\r\n\r\n\r\n event.preventDefault();\r\n\r\n\r\n scrollMobileToIndex(\r\n target,\r\n 'smooth'\r\n );\r\n\r\n }\r\n\r\n\r\n function beginMobileTouch(){\r\n\r\n if (\r\n mode !==\r\n 'mobile'\r\n ) return;\r\n\r\n\r\n mobilePointerHeld =\r\n true;\r\n\r\n\r\n root.dataset.mobileReelTouch =\r\n 'true';\r\n\r\n\r\n requestExitFocus();\r\n\r\n }\r\n\r\n\r\n function endMobileTouch(){\r\n\r\n if (\r\n !mobilePointerHeld\r\n ) return;\r\n\r\n\r\n mobilePointerHeld =\r\n false;\r\n\r\n\r\n delete root.dataset.mobileReelTouch;\r\n\r\n\r\n requestExitFocus();\r\n\r\n }\r\n\r\n\r\n function initMobile(\r\n preserveCase =\r\n true\r\n ){\r\n\r\n mode =\r\n 'mobile';\r\n\r\n\r\n root.classList.remove(\r\n 'is-enhanced'\r\n );\r\n\r\n\r\n root.classList.add(\r\n 'is-mobile-reel'\r\n );\r\n\r\n\r\n root.style.height =\r\n '';\r\n\r\n\r\n root.setAttribute(\r\n 'aria-labelledby',\r\n 'lamina-real-cases-title-mobile'\r\n );\r\n\r\n\r\n stage.classList.remove(\r\n 'is-entry',\r\n 'is-exit'\r\n );\r\n\r\n\r\n clearDesktopCardInlineState();\r\n\r\n\r\n applyMobileCardPresentation();\r\n\r\n\r\n applyMobileVisibility();\r\n\r\n\r\n caseList.addEventListener(\r\n 'scroll',\r\n requestMobileScrollRender,\r\n {\r\n passive:true\r\n }\r\n );\r\n\r\n\r\n caseList.addEventListener(\r\n 'keydown',\r\n handleMobileKeydown\r\n );\r\n\r\n\r\n caseList.addEventListener(\r\n 'pointerdown',\r\n beginMobileTouch,\r\n {\r\n passive:true\r\n }\r\n );\r\n\r\n\r\n window.addEventListener(\r\n 'pointerup',\r\n endMobileTouch,\r\n {\r\n passive:true\r\n }\r\n );\r\n\r\n\r\n window.addEventListener(\r\n 'pointercancel',\r\n endMobileTouch,\r\n {\r\n passive:true\r\n }\r\n );\r\n\r\n\r\n requestAnimationFrame(\r\n () => {\r\n\r\n cacheMobileSnapOffsets();\r\n\r\n\r\n let targetIndex =\r\n preserveCase\r\n ? visibleIndexForId(\r\n activeCaseId\r\n )\r\n : 0;\r\n\r\n\r\n if (\r\n targetIndex <\r\n 0\r\n ){\r\n\r\n targetIndex =\r\n 0;\r\n\r\n }\r\n\r\n\r\n scrollMobileToIndex(\r\n targetIndex,\r\n 'auto'\r\n );\r\n\r\n\r\n measureExitFocus();\r\n\r\n\r\n requestExitFocus();\r\n\r\n }\r\n );\r\n\r\n }\r\n\r\n\r\n function destroyMobile(){\r\n\r\n caseList.removeEventListener(\r\n 'scroll',\r\n requestMobileScrollRender\r\n );\r\n\r\n\r\n caseList.removeEventListener(\r\n 'keydown',\r\n handleMobileKeydown\r\n );\r\n\r\n\r\n caseList.removeEventListener(\r\n 'pointerdown',\r\n beginMobileTouch\r\n );\r\n\r\n\r\n window.removeEventListener(\r\n 'pointerup',\r\n endMobileTouch\r\n );\r\n\r\n\r\n window.removeEventListener(\r\n 'pointercancel',\r\n endMobileTouch\r\n );\r\n\r\n\r\n delete root.dataset.mobileReelTouch;\r\n\r\n\r\n root.classList.remove(\r\n 'is-mobile-reel'\r\n );\r\n\r\n\r\n root.style.height =\r\n '';\r\n\r\n\r\n cards.forEach(\r\n card => {\r\n\r\n card.classList.remove(\r\n 'is-mobile-active',\r\n 'is-mobile-hidden'\r\n );\r\n\r\n\r\n card.removeAttribute(\r\n 'aria-current'\r\n );\r\n\r\n\r\n card.removeAttribute(\r\n 'data-mobile-layout'\r\n );\r\n\r\n\r\n card.style.removeProperty(\r\n 'display'\r\n );\r\n\r\n\r\n card.querySelectorAll(\r\n '.lc-case__photo img'\r\n ).forEach(\r\n image => {\r\n\r\n image.style.removeProperty(\r\n '--mobile-object-position'\r\n );\r\n\r\n }\r\n );\r\n\r\n }\r\n );\r\n\r\n }\r\n\r\n\r\n \/* =======================================================\r\n REDUCED-MOTION DESKTOP STATIC MODE\r\n ======================================================= *\/\r\n\r\n function initStaticDesktop(){\r\n\r\n mode =\r\n 'static';\r\n\r\n\r\n destroyDesktop();\r\n\r\n\r\n root.setAttribute(\r\n 'aria-labelledby',\r\n 'lamina-real-cases-title'\r\n );\r\n\r\n\r\n const visibleIds =\r\n new Set(\r\n visibleCases.map(\r\n item =>\r\n item.caseId\r\n )\r\n );\r\n\r\n\r\n cards.forEach(\r\n card => {\r\n\r\n const visible =\r\n visibleIds.has(\r\n card.dataset.caseId\r\n );\r\n\r\n\r\n card.style.display =\r\n visible\r\n ? ''\r\n : 'none';\r\n\r\n\r\n card.setAttribute(\r\n 'aria-hidden',\r\n visible\r\n ? 'false'\r\n : 'true'\r\n );\r\n\r\n }\r\n );\r\n\r\n\r\n const index =\r\n Math.max(\r\n 0,\r\n visibleIndexForId(\r\n activeCaseId\r\n )\r\n );\r\n\r\n\r\n setMetadata(\r\n index,\r\n true\r\n );\r\n\r\n\r\n clearExitFocus();\r\n\r\n }\r\n\r\n\r\n function destroyStaticDesktop(){\r\n\r\n cards.forEach(\r\n card => {\r\n\r\n card.style.removeProperty(\r\n 'display'\r\n );\r\n\r\n }\r\n );\r\n\r\n }\r\n\r\n\r\n \/* =======================================================\r\n SHARED FILTER CONTROLLER\r\n ======================================================= *\/\r\n\r\n function applyFilter(\r\n filter\r\n ){\r\n\r\n if (\r\n filter ===\r\n activeFilter\r\n ) return;\r\n\r\n\r\n const nextCases =\r\n caseData.filter(\r\n item =>\r\n filter ===\r\n 'all' ||\r\n item.category ===\r\n filter\r\n );\r\n\r\n\r\n if (\r\n !nextCases.length\r\n ) return;\r\n\r\n\r\n window.clearTimeout(\r\n filterTimer\r\n );\r\n\r\n\r\n const previousCaseId =\r\n activeCaseId;\r\n\r\n\r\n activeFilter =\r\n filter;\r\n\r\n\r\n visibleCases =\r\n nextCases;\r\n\r\n\r\n syncFilterButtons();\r\n\r\n\r\n activeMetaIndex =\r\n -1;\r\n\r\n\r\n \/*\r\n MOBILE:\r\n vertical page position is never touched.\r\n The reel softens briefly, data is switched in place,\r\n then horizontal position resets\/preserves inside the reel only.\r\n *\/\r\n if (\r\n mode ===\r\n 'mobile'\r\n ){\r\n\r\n stage.classList.add(\r\n 'is-filtering'\r\n );\r\n\r\n\r\n const preservedIndex =\r\n visibleIndexForId(\r\n previousCaseId\r\n );\r\n\r\n\r\n const targetIndex =\r\n preservedIndex >=\r\n 0\r\n ? preservedIndex\r\n : 0;\r\n\r\n\r\n filterTimer =\r\n window.setTimeout(\r\n () => {\r\n\r\n activeCaseId =\r\n visibleCases[\r\n targetIndex\r\n ].caseId;\r\n\r\n\r\n applyMobileVisibility();\r\n\r\n\r\n requestAnimationFrame(\r\n () => {\r\n\r\n cacheMobileSnapOffsets();\r\n\r\n\r\n scrollMobileToIndex(\r\n targetIndex,\r\n 'auto'\r\n );\r\n\r\n\r\n requestAnimationFrame(\r\n () => {\r\n\r\n stage.classList.remove(\r\n 'is-filtering'\r\n );\r\n\r\n }\r\n );\r\n\r\n }\r\n );\r\n\r\n },\r\n 150\r\n );\r\n\r\n\r\n return;\r\n\r\n }\r\n\r\n\r\n \/*\r\n DESKTOP:\r\n preserve the existing scrollytelling behavior.\r\n Filtering re-measures the sticky progression and returns to\r\n the first case in the selected filtered set.\r\n *\/\r\n activeCaseId =\r\n visibleCases[0].caseId;\r\n\r\n\r\n if (\r\n mode ===\r\n 'desktop'\r\n ){\r\n\r\n stage.classList.add(\r\n 'is-filtering'\r\n );\r\n\r\n\r\n filterTimer =\r\n window.setTimeout(\r\n () => {\r\n\r\n measureDesktop();\r\n\r\n\r\n window.scrollTo(\r\n {\r\n top:\r\n desktopSectionTop +\r\n caseStart +\r\n 1,\r\n behavior:'auto'\r\n }\r\n );\r\n\r\n\r\n renderDesktop();\r\n\r\n\r\n requestAnimationFrame(\r\n () => {\r\n\r\n requestAnimationFrame(\r\n () => {\r\n\r\n stage.classList.remove(\r\n 'is-filtering'\r\n );\r\n\r\n }\r\n );\r\n\r\n }\r\n );\r\n\r\n },\r\n 180\r\n );\r\n\r\n\r\n return;\r\n\r\n }\r\n\r\n\r\n initStaticDesktop();\r\n\r\n }\r\n\r\n\r\n filterButtons.forEach(\r\n button => {\r\n\r\n button.addEventListener(\r\n 'click',\r\n () => {\r\n\r\n applyFilter(\r\n button.dataset.filter ||\r\n 'all'\r\n );\r\n\r\n }\r\n );\r\n\r\n }\r\n );\r\n\r\n\r\n \/* =======================================================\r\n MODE MANAGER \u2014 EXACTLY ONE NAVIGATION ENGINE\r\n ======================================================= *\/\r\n\r\n function resolveMode(){\r\n\r\n if (\r\n mobileModeQuery.matches\r\n ){\r\n\r\n return 'mobile';\r\n\r\n }\r\n\r\n\r\n if (\r\n reducedMotion.matches\r\n ){\r\n\r\n return 'static';\r\n\r\n }\r\n\r\n\r\n return 'desktop';\r\n\r\n }\r\n\r\n\r\n function switchMode(){\r\n\r\n const nextMode =\r\n resolveMode();\r\n\r\n\r\n if (\r\n nextMode ===\r\n mode\r\n ){\r\n\r\n if (\r\n nextMode ===\r\n 'desktop'\r\n ){\r\n\r\n measureDesktop();\r\n\r\n\r\n requestDesktopRender();\r\n\r\n }else if(\r\n nextMode ===\r\n 'mobile'\r\n ){\r\n\r\n applyMobileCardPresentation();\r\n\r\n\r\n applyMobileVisibility();\r\n\r\n\r\n requestAnimationFrame(\r\n () => {\r\n\r\n cacheMobileSnapOffsets();\r\n\r\n\r\n const preserved =\r\n Math.max(\r\n 0,\r\n visibleIndexForId(\r\n activeCaseId\r\n )\r\n );\r\n\r\n\r\n scrollMobileToIndex(\r\n preserved,\r\n 'auto'\r\n );\r\n\r\n }\r\n );\r\n\r\n }\r\n\r\n\r\n measureExitFocus();\r\n\r\n\r\n requestExitFocus();\r\n\r\n\r\n return;\r\n\r\n }\r\n\r\n\r\n const preserveCase =\r\n Boolean(\r\n activeCaseId\r\n );\r\n\r\n\r\n if (\r\n mode ===\r\n 'desktop'\r\n ){\r\n\r\n destroyDesktop();\r\n\r\n }else if(\r\n mode ===\r\n 'mobile'\r\n ){\r\n\r\n destroyMobile();\r\n\r\n }else if(\r\n mode ===\r\n 'static'\r\n ){\r\n\r\n destroyStaticDesktop();\r\n\r\n }\r\n\r\n\r\n if (\r\n nextMode ===\r\n 'mobile'\r\n ){\r\n\r\n initMobile(\r\n preserveCase\r\n );\r\n\r\n }else if(\r\n nextMode ===\r\n 'desktop'\r\n ){\r\n\r\n initDesktop(\r\n preserveCase\r\n );\r\n\r\n }else{\r\n\r\n initStaticDesktop();\r\n\r\n }\r\n\r\n\r\n syncFilterButtons();\r\n\r\n }\r\n\r\n\r\n \/* =======================================================\r\n SHARED OBSERVERS \/ WINDOW SCROLL\r\n ======================================================= *\/\r\n\r\n if (\r\n 'IntersectionObserver' in window\r\n ){\r\n\r\n const sectionObserver =\r\n new IntersectionObserver(\r\n entries => {\r\n\r\n entries.forEach(\r\n entry => {\r\n\r\n sectionNear =\r\n entry.isIntersecting;\r\n\r\n\r\n if (\r\n sectionNear\r\n ){\r\n\r\n measureExitFocus();\r\n\r\n\r\n requestExitFocus();\r\n\r\n\r\n if (\r\n mode ===\r\n 'desktop'\r\n ){\r\n\r\n requestDesktopRender();\r\n\r\n }\r\n\r\n }else{\r\n\r\n clearExitFocus();\r\n\r\n }\r\n\r\n }\r\n );\r\n\r\n },\r\n {\r\n rootMargin:'140px 0px 140px 0px',\r\n threshold:0\r\n }\r\n );\r\n\r\n\r\n sectionObserver.observe(\r\n root\r\n );\r\n\r\n }\r\n\r\n\r\n \/*\r\n One vertical window-scroll path:\r\n - desktop mode additionally renders the desktop case wheel;\r\n - mobile mode only updates exit-focus depth.\r\n *\/\r\n window.addEventListener(\r\n 'scroll',\r\n () => {\r\n\r\n requestExitFocus();\r\n\r\n\r\n if (\r\n mode ===\r\n 'desktop'\r\n ){\r\n\r\n requestDesktopRender();\r\n\r\n }\r\n\r\n },\r\n {\r\n passive:true\r\n }\r\n );\r\n\r\n\r\n let resizeTimer =\r\n null;\r\n\r\n\r\n window.addEventListener(\r\n 'resize',\r\n () => {\r\n\r\n window.clearTimeout(\r\n resizeTimer\r\n );\r\n\r\n\r\n resizeTimer =\r\n window.setTimeout(\r\n () => {\r\n\r\n switchMode();\r\n\r\n },\r\n 120\r\n );\r\n\r\n },\r\n {\r\n passive:true\r\n }\r\n );\r\n\r\n\r\n mobileModeQuery.addEventListener?.(\r\n 'change',\r\n switchMode\r\n );\r\n\r\n\r\n reducedMotion.addEventListener?.(\r\n 'change',\r\n switchMode\r\n );\r\n\r\n\r\n \/* =======================================================\r\n BELOW-FOLD NEIGHBOR PREPARATION\r\n ======================================================= *\/\r\n\r\n if (\r\n 'IntersectionObserver' in window\r\n ){\r\n\r\n const preloadObserver =\r\n new IntersectionObserver(\r\n entries => {\r\n\r\n entries.forEach(\r\n entry => {\r\n\r\n if (\r\n !entry.isIntersecting\r\n ) return;\r\n\r\n\r\n visibleCases\r\n .slice(\r\n 0,\r\n 3\r\n )\r\n .forEach(\r\n item => {\r\n\r\n const card =\r\n cardById.get(\r\n item.caseId\r\n );\r\n\r\n\r\n card?.querySelectorAll(\r\n 'img'\r\n ).forEach(\r\n image => {\r\n\r\n \/*\r\n Do not invent responsive asset URLs.\r\n When real srcset variants are generated,\r\n they can be added directly to the markup.\r\n *\/\r\n image.loading =\r\n 'eager';\r\n\r\n\r\n image.decode?.().catch(\r\n () => {}\r\n );\r\n\r\n }\r\n );\r\n\r\n }\r\n );\r\n\r\n\r\n preloadObserver.disconnect();\r\n\r\n }\r\n );\r\n\r\n },\r\n {\r\n rootMargin:'760px 0px 760px 0px',\r\n threshold:0\r\n }\r\n );\r\n\r\n\r\n preloadObserver.observe(\r\n root\r\n );\r\n\r\n }\r\n\r\n\r\n \/* =======================================================\r\n INITIALIZE\r\n ======================================================= *\/\r\n\r\n syncFilterButtons();\r\n\r\n\r\n switchMode();\r\n\r\n})();\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-14bb824 e-con-full e-flex e-con e-parent\" data-id=\"14bb824\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-d2d41eb elementor-widget elementor-widget-html\" data-id=\"d2d41eb\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- =========================================================\r\nLAMINA CLINIC \u2014 SECTION 05\r\nMEDICAL TEAM \u2014 KINETIC PORTRAIT RIBBON\r\nV6 \u2014 LAMINA TITLE SYSTEM \/ ACTUAL OPTICAL TITLE FIX\r\n\r\nKeeps the existing dark editorial visual direction.\r\nChanges the gallery interaction from carousel-like navigation to:\r\nDIRECT DRAG + FLICK MOMENTUM + MAGNETIC SETTLE +\r\nVELOCITY-REACTIVE INNER IMAGE MOTION + PROXIMITY FOCUS + RESTRAINED OFF-FOCUS CARD BLUR.\r\n\r\nGLOBAL LAMINA FOCUS-DEPTH RULE:\r\nUPCOMING CONTENT: SOFT -> SHARP\r\nLEAVING CONTENT: SHARP -> SOFT\r\n\r\nPROTOTYPE CONTENT:\r\n- Doctor names and current source roles are provisional.\r\n- Replace placeholder portrait paths with clinic-approved originals.\r\n- Dr. Mohammed Issa's source label \"Surgeries\" is NOT used as a title.\r\n========================================================= -->\r\n\r\n<style>\r\n@import url('https:\/\/fonts.googleapis.com\/css2?family=Cormorant+Garamond:ital,wght@0,400;0,500;1,400&family=Manrope:wght@400;500;600&display=swap');\r\n\r\n#lamina-doctor-gallery{\r\n --aubergine:#2B142F;\r\n --aubergine-2:#241128;\r\n --aubergine-3:#311635;\r\n --aubergine-4:#381B3D;\r\n --plum:#5F2468;\r\n --orchid:#94709A;\r\n --lilac:#C5B2C8;\r\n --ivory:#F7F2EA;\r\n --ease:cubic-bezier(.16,.70,.18,1);\r\n --soft:cubic-bezier(.22,1,.36,1);\r\n\r\n \/*\r\n LAMINA PROJECT RULE:\r\n Elementor's global accent must never leak into custom sections.\r\n *\/\r\n --e-global-color-primary:#2B142F;\r\n --e-global-color-secondary:#94709A;\r\n --e-global-color-text:#F7F2EA;\r\n --e-global-color-accent:#5F2468;\r\n\r\n position:relative;\r\n width:100%;\r\n overflow:hidden;\r\n\r\n background:\r\n radial-gradient(52% 42% at 90% 8%,rgba(148,112,154,.08),transparent 72%),\r\n radial-gradient(42% 36% at 8% 90%,rgba(95,36,104,.10),transparent 74%),\r\n linear-gradient(145deg,#311635 0%,#2B142F 54%,#241128 100%);\r\n\r\n color:var(--ivory);\r\n font-family:\"Manrope\",system-ui,-apple-system,BlinkMacSystemFont,\"Segoe UI\",sans-serif;\r\n}\r\n\r\n#lamina-doctor-gallery *,\r\n#lamina-doctor-gallery *::before,\r\n#lamina-doctor-gallery *::after{\r\n box-sizing:border-box;\r\n}\r\n\r\n#lamina-doctor-gallery a,\r\n#lamina-doctor-gallery button{\r\n font:inherit;\r\n}\r\n\r\n#lamina-doctor-gallery ::selection{\r\n background:var(--plum);\r\n color:var(--ivory);\r\n}\r\n\r\n.ldg__shell{\r\n width:min(100%,1640px);\r\n margin:0 auto;\r\n padding:\r\n clamp(82px,8.5vh,118px)\r\n clamp(24px,4.2vw,78px)\r\n clamp(92px,10vh,132px);\r\n}\r\n\r\n\/* =========================================================\r\n HEADER\r\n ========================================================= *\/\r\n\r\n.ldg__head{\r\n display:grid;\r\n grid-template-columns:minmax(0,.62fr) minmax(280px,.38fr);\r\n gap:clamp(48px,7vw,116px);\r\n align-items:end;\r\n min-height:clamp(220px,29vh,320px);\r\n margin-bottom:clamp(40px,5vh,62px);\r\n}\r\n\r\n.ldg__eyebrow{\r\n margin:0 0 16px;\r\n color:var(--lilac);\r\n font-size:clamp(11px,.72vw,13px);\r\n line-height:1.2;\r\n font-weight:600;\r\n letter-spacing:.17em;\r\n text-transform:uppercase;\r\n}\r\n\r\n.ldg__title{\r\n margin:0;\r\n\r\n \/*\r\n Hard optical correction:\r\n - pull the first line left enough to eliminate the fake gutter\r\n - tighten the upright stack\r\n - bring the accent phrase much closer to the main block\r\n *\/\r\n width:min(100%,8.78ch);\r\n max-width:none;\r\n overflow:visible;\r\n\r\n color:var(--ivory);\r\n\r\n font-family:\"Cormorant Garamond\",Georgia,serif;\r\n font-size:clamp(72px,7vw,128px);\r\n line-height:1;\r\n font-weight:400;\r\n letter-spacing:-.050em;\r\n\r\n text-wrap:balance;\r\n}\r\n\r\n.ldg__title-line{\r\n display:block;\r\n position:relative;\r\n width:max-content;\r\n max-width:100%;\r\n\r\n line-height:.845;\r\n\r\n padding-block:\r\n 0\r\n .030em;\r\n\r\n margin:0;\r\n\r\n overflow:visible;\r\n}\r\n\r\n\/* Remove the apparent dead space before \u201cThe\u201d. *\/\r\n.ldg__title-line:first-child{\r\n margin-inline-start:-.092em;\r\n}\r\n\r\n.ldg__title-line:nth-child(2){\r\n margin-inline-start:-.018em;\r\n}\r\n\r\n.ldg__title-line + .ldg__title-line{\r\n margin-top:-.112em;\r\n}\r\n\r\n.ldg__title-line--accent{\r\n \/*\r\n Accent should read as the continuation of the title,\r\n not as a separated block.\r\n *\/\r\n margin-top:-.006em !important;\r\n\r\n padding-block:\r\n 0\r\n .056em;\r\n\r\n color:#A77DAE;\r\n\r\n font-style:italic;\r\n font-weight:400;\r\n letter-spacing:-.034em;\r\n line-height:.885;\r\n}\r\n\r\n\/*\r\n Keep slight italic overhang protection,\r\n but not enough to create a fake left gutter.\r\n*\/\r\n.ldg__title-line--accent{\r\n padding-inline:\r\n 0\r\n .034em;\r\n\r\n margin-inline-start:-.040em;\r\n}\r\n\r\n.ldg__intro{\r\n margin:0 0 10px;\r\n max-width:36ch;\r\n color:rgba(247,242,234,.68);\r\n font-size:clamp(16px,1.02vw,18px);\r\n line-height:1.68;\r\n}\r\n\r\n.ldg__micro{\r\n margin:18px 0 0;\r\n color:rgba(197,178,200,.72);\r\n font-size:11px;\r\n line-height:1.2;\r\n font-weight:600;\r\n letter-spacing:.13em;\r\n text-transform:uppercase;\r\n}\r\n\r\n\/* =========================================================\r\n ORIENTATION \/ PROGRESS\r\n No arrows. Informational only.\r\n ========================================================= *\/\r\n\r\n.ldg__orientation{\r\n display:grid;\r\n grid-template-columns:auto minmax(150px,300px) auto;\r\n gap:18px;\r\n align-items:center;\r\n margin-bottom:18px;\r\n}\r\n\r\n.ldg__count{\r\n color:rgba(247,242,234,.78);\r\n font-size:12px;\r\n line-height:1;\r\n font-weight:600;\r\n letter-spacing:.12em;\r\n white-space:nowrap;\r\n}\r\n\r\n.ldg__progress{\r\n position:relative;\r\n width:100%;\r\n height:1px;\r\n overflow:hidden;\r\n background:rgba(247,242,234,.14);\r\n}\r\n\r\n.ldg__progress-fill{\r\n position:absolute;\r\n inset:0;\r\n background:rgba(197,178,200,.86);\r\n transform:scaleX(0);\r\n transform-origin:0 50%;\r\n will-change:transform;\r\n}\r\n\r\n.ldg__drag-cue{\r\n color:rgba(197,178,200,.56);\r\n font-size:11px;\r\n line-height:1;\r\n font-weight:600;\r\n letter-spacing:.12em;\r\n text-transform:uppercase;\r\n white-space:nowrap;\r\n}\r\n\r\n\/* =========================================================\r\n KINETIC PORTRAIT RIBBON\r\n ========================================================= *\/\r\n\r\n.ldg__bleed{\r\n margin-right:calc(50% - 50vw);\r\n}\r\n\r\n.ldg__viewport{\r\n position:relative;\r\n width:100%;\r\n overflow:hidden;\r\n\r\n cursor:grab;\r\n touch-action:pan-y;\r\n overscroll-behavior-x:contain;\r\n\r\n outline:none;\r\n}\r\n\r\n.ldg__viewport.is-dragging{\r\n cursor:grabbing;\r\n}\r\n\r\n.ldg__viewport:focus-visible{\r\n outline:1px solid rgba(197,178,200,.36);\r\n outline-offset:6px;\r\n}\r\n\r\n.ldg__ribbon{\r\n display:flex;\r\n align-items:flex-start;\r\n gap:clamp(16px,1.35vw,22px);\r\n width:max-content;\r\n\r\n padding-right:max(24px,calc(50vw - 50%));\r\n\r\n transform:translate3d(0,0,0);\r\n will-change:transform;\r\n}\r\n\r\n.ldg__doctor{\r\n --focus:0;\r\n --doctor-opacity:.54;\r\n --doctor-scale:.975;\r\n --doctor-blur:2.2px;\r\n --name-opacity:.52;\r\n --meta-opacity:.56;\r\n --img-x:0px;\r\n --img-scale:1.035;\r\n\r\n flex:0 0 clamp(250px,20.5vw,350px);\r\n min-width:0;\r\n\r\n opacity:var(--doctor-opacity);\r\n filter:blur(var(--doctor-blur));\r\n transform:scale(var(--doctor-scale));\r\n transform-origin:center top;\r\n\r\n transition:\r\n opacity .28s linear,\r\n filter .34s var(--ease),\r\n transform .32s var(--ease);\r\n}\r\n\r\n.ldg__doctor.is-nearest{\r\n pointer-events:auto;\r\n}\r\n\r\n.ldg__portrait{\r\n position:relative;\r\n overflow:hidden;\r\n\r\n width:100%;\r\n height:clamp(390px,47vh,520px);\r\n border-radius:10px;\r\n\r\n background:\r\n radial-gradient(58% 46% at 50% 30%,rgba(148,112,154,.16),transparent 68%),\r\n linear-gradient(145deg,#381B3D,#241128);\r\n}\r\n\r\n.ldg__portrait img{\r\n position:absolute;\r\n left:-2.5%;\r\n top:-2.5%;\r\n\r\n width:105%;\r\n height:105%;\r\n\r\n display:block;\r\n object-fit:cover;\r\n object-position:var(--doctor-pos,50% 18%);\r\n\r\n transform:\r\n translate3d(var(--img-x),0,0)\r\n scale(var(--img-scale));\r\n\r\n filter:\r\n saturate(var(--img-saturation,1))\r\n contrast(1)\r\n brightness(var(--img-brightness,.98));\r\n\r\n transition:\r\n transform .28s var(--ease),\r\n filter .30s ease;\r\n\r\n will-change:transform;\r\n user-select:none;\r\n pointer-events:none;\r\n}\r\n\r\n.ldg__portrait::after{\r\n content:\"\";\r\n position:absolute;\r\n inset:0;\r\n pointer-events:none;\r\n\r\n background:\r\n linear-gradient(\r\n 180deg,\r\n rgba(43,20,47,.08),\r\n rgba(43,20,47,.02) 56%,\r\n rgba(43,20,47,.18)\r\n );\r\n\r\n opacity:var(--overlay-opacity,.56);\r\n transition:opacity .28s ease;\r\n}\r\n\r\n.ldg__portrait.is-missing::before{\r\n content:\"Clinic-approved doctor portrait\";\r\n position:absolute;\r\n z-index:2;\r\n inset:0;\r\n\r\n display:grid;\r\n place-items:center;\r\n padding:28px;\r\n\r\n color:rgba(247,242,234,.48);\r\n font-size:12px;\r\n line-height:1.5;\r\n font-weight:600;\r\n letter-spacing:.10em;\r\n text-transform:uppercase;\r\n text-align:center;\r\n}\r\n\r\n#lamina-doctor-gallery:not(.is-ribbon-moving) .ldg__doctor:hover{\r\n --img-scale:1.045;\r\n}\r\n\r\n#lamina-doctor-gallery.is-ribbon-moving .ldg__doctor:hover{\r\n --img-scale:1.035;\r\n}\r\n\r\n.ldg__doctor-info{\r\n padding:17px 1px 0;\r\n}\r\n\r\n.ldg__doctor-meta{\r\n opacity:var(--meta-opacity);\r\n transition:opacity .28s linear;\r\n}\r\n\r\n.ldg__index{\r\n display:block;\r\n margin-bottom:8px;\r\n color:var(--lilac);\r\n font-size:11px;\r\n line-height:1;\r\n font-weight:600;\r\n letter-spacing:.13em;\r\n}\r\n\r\n.ldg__name{\r\n margin:0;\r\n\r\n color:var(--ivory);\r\n opacity:var(--name-opacity);\r\n\r\n font-family:\"Cormorant Garamond\",Georgia,serif;\r\n font-size:clamp(31px,2.5vw,42px);\r\n line-height:.98;\r\n font-weight:500;\r\n letter-spacing:-.025em;\r\n\r\n transition:opacity .28s linear;\r\n}\r\n\r\n.ldg__category{\r\n margin:9px 0 0;\r\n color:rgba(197,178,200,.82);\r\n font-size:11px;\r\n line-height:1.25;\r\n font-weight:600;\r\n letter-spacing:.11em;\r\n text-transform:uppercase;\r\n}\r\n\r\n.ldg__role{\r\n margin:6px 0 0;\r\n min-height:1.45em;\r\n color:rgba(247,242,234,.68);\r\n font-size:13px;\r\n line-height:1.45;\r\n}\r\n\r\n.ldg__proof{\r\n margin:8px 0 0;\r\n min-height:1.5em;\r\n color:rgba(247,242,234,.46);\r\n font-size:12px;\r\n line-height:1.5;\r\n}\r\n\r\n.ldg__profile{\r\n position:relative;\r\n display:inline-flex;\r\n align-items:center;\r\n gap:7px;\r\n\r\n margin-top:15px;\r\n\r\n color:rgba(247,242,234,.64);\r\n font-size:11px;\r\n line-height:1.2;\r\n font-weight:600;\r\n letter-spacing:.10em;\r\n text-transform:uppercase;\r\n text-decoration:none;\r\n\r\n transition:\r\n color .42s ease,\r\n opacity .42s ease;\r\n}\r\n\r\n.ldg__profile .ldg__arrow{\r\n transition:transform .5s var(--ease);\r\n}\r\n\r\n.ldg__profile,\r\n.ldg__profile:visited{\r\n color:rgba(247,242,234,.64) !important;\r\n background:transparent !important;\r\n}\r\n\r\n.ldg__profile:hover,\r\n.ldg__profile:focus,\r\n.ldg__profile:focus-visible,\r\n.ldg__profile:active{\r\n color:#F7F2EA !important;\r\n background:transparent !important;\r\n}\r\n\r\n.ldg__profile:hover .ldg__arrow,\r\n.ldg__profile:focus-visible .ldg__arrow{\r\n transform:translate3d(4px,0,0);\r\n}\r\n\r\n.ldg__profile:focus-visible{\r\n outline:1px solid rgba(197,178,200,.48);\r\n outline-offset:6px;\r\n}\r\n\r\n\/* =========================================================\r\n PROJECT-WIDE LAMINA FOCUS-DEPTH UTILITY\r\n Entrance: soft -> sharp.\r\n Exit: sharp -> soft.\r\n ========================================================= *\/\r\n\r\n#lamina-doctor-gallery [data-focus-layer]{\r\n --lamina-focus-blur:0px;\r\n --lamina-focus-opacity:1;\r\n --lamina-focus-y:0px;\r\n\r\n filter:blur(var(--lamina-focus-blur));\r\n opacity:var(--lamina-focus-opacity);\r\n\r\n \/*\r\n This transform is deliberately applied only to bounded focus layers,\r\n never the ribbon or doctor-card positioning transform.\r\n *\/\r\n translate:0 var(--lamina-focus-y);\r\n}\r\n\r\n#lamina-doctor-gallery [data-focus-layer=\"ui\"]:focus-visible,\r\n#lamina-doctor-gallery [data-focus-layer=\"ui\"]:focus-within{\r\n filter:none !important;\r\n opacity:1 !important;\r\n translate:0 0 !important;\r\n}\r\n\r\n#lamina-doctor-gallery[data-lamina-focus-media-hold=\"true\"] [data-focus-layer=\"media\"],\r\n#lamina-doctor-gallery[data-lamina-focus-media-hold=\"true\"] [data-focus-layer=\"metadata\"]{\r\n filter:none !important;\r\n opacity:1 !important;\r\n translate:0 0 !important;\r\n}\r\n\r\n\r\n\r\n.ldg__ribbon-stage{\r\n position:relative;\r\n}\r\n\r\n.ldg__nav{\r\n position:absolute;\r\n top:clamp(150px,18vw,240px);\r\n z-index:18;\r\n\r\n width:54px;\r\n height:54px;\r\n\r\n display:grid;\r\n place-items:center;\r\n\r\n border:1px solid rgba(247,242,234,.42) !important;\r\n border-radius:999px;\r\n\r\n background:rgba(43,20,47,.88) !important;\r\n color:#F7F2EA !important;\r\n\r\n box-shadow:\r\n 0 14px 34px rgba(0,0,0,.28),\r\n inset 0 0 0 1px rgba(247,242,234,.055);\r\n\r\n cursor:pointer;\r\n appearance:none !important;\r\n -webkit-appearance:none !important;\r\n\r\n opacity:.96;\r\n\r\n transition:\r\n background-color .42s ease,\r\n border-color .42s ease,\r\n color .42s ease,\r\n opacity .32s ease,\r\n transform .42s var(--ease),\r\n box-shadow .42s ease;\r\n}\r\n\r\n.ldg__nav--prev{\r\n left:clamp(8px,1.2vw,18px);\r\n}\r\n\r\n.ldg__nav--next{\r\n right:clamp(8px,1.2vw,18px);\r\n}\r\n\r\n.ldg__nav:hover,\r\n.ldg__nav:focus,\r\n.ldg__nav:focus-visible,\r\n.ldg__nav:active{\r\n background:rgba(95,36,104,.94) !important;\r\n border-color:rgba(247,242,234,.68) !important;\r\n color:#F7F2EA !important;\r\n\r\n box-shadow:\r\n 0 16px 38px rgba(0,0,0,.32),\r\n inset 0 0 0 1px rgba(247,242,234,.08) !important;\r\n\r\n transform:translate3d(0,-1px,0);\r\n outline:none !important;\r\n}\r\n\r\n.ldg__nav:focus-visible{\r\n outline:2px solid rgba(197,178,200,.82) !important;\r\n outline-offset:4px !important;\r\n}\r\n\r\n.ldg__nav[disabled]{\r\n opacity:.34;\r\n cursor:default;\r\n}\r\n\r\n.ldg__nav svg{\r\n width:18px;\r\n height:18px;\r\n display:block;\r\n stroke:currentColor;\r\n stroke-width:2.15;\r\n fill:none;\r\n overflow:visible;\r\n}\r\n\r\n@media (min-width:761px) and (max-width:1180px){\r\n\r\n .ldg__title{\r\n width:min(100%,8.62ch);\r\n font-size:clamp(68px,8vw,104px);\r\n }\r\n\r\n .ldg__title-line{\r\n line-height:.85;\r\n padding-block:\r\n 0\r\n .036em;\r\n }\r\n\r\n .ldg__title-line:first-child{\r\n margin-inline-start:-.078em;\r\n }\r\n\r\n .ldg__title-line:nth-child(2){\r\n margin-inline-start:-.014em;\r\n }\r\n\r\n .ldg__title-line + .ldg__title-line{\r\n margin-top:-.100em;\r\n }\r\n\r\n .ldg__title-line--accent{\r\n margin-top:0 !important;\r\n padding-block:\r\n 0\r\n .064em;\r\n margin-inline-start:-.034em;\r\n }\r\n\r\n}\r\n\r\n@media (max-width:760px){\r\n\r\n .ldg__nav{\r\n width:48px;\r\n height:48px;\r\n top:clamp(140px,34vw,220px);\r\n }\r\n\r\n .ldg__nav--prev{\r\n left:8px;\r\n }\r\n\r\n .ldg__nav--next{\r\n right:8px;\r\n }\r\n\r\n}\r\n\r\n\/* =========================================================\r\n MOBILE\r\n ========================================================= *\/\r\n\r\n@media (max-width:760px){\r\n\r\n .ldg__shell{\r\n padding:72px 20px 84px;\r\n }\r\n\r\n .ldg__head{\r\n display:block;\r\n min-height:0;\r\n margin-bottom:36px;\r\n }\r\n\r\n .ldg__title{\r\n width:min(100%,7.84ch);\r\n max-width:none;\r\n overflow:visible;\r\n\r\n font-size:clamp(58px,15.8vw,76px);\r\n line-height:1;\r\n letter-spacing:-.046em;\r\n }\r\n\r\n .ldg__title-line{\r\n line-height:.86;\r\n\r\n padding-block:\r\n 0\r\n .040em;\r\n }\r\n\r\n .ldg__title-line:first-child{\r\n margin-inline-start:-.072em;\r\n }\r\n\r\n .ldg__title-line:nth-child(2){\r\n margin-inline-start:-.012em;\r\n }\r\n\r\n .ldg__title-line + .ldg__title-line{\r\n margin-top:-.090em;\r\n }\r\n\r\n .ldg__title-line--accent{\r\n margin-top:0 !important;\r\n\r\n padding-block:\r\n 0\r\n .070em;\r\n\r\n padding-inline:\r\n 0\r\n .040em;\r\n\r\n letter-spacing:-.032em;\r\n line-height:.89;\r\n margin-inline-start:-.032em;\r\n }\r\n\r\n .ldg__intro{\r\n margin-top:22px;\r\n font-size:15px;\r\n line-height:1.62;\r\n max-width:34ch;\r\n }\r\n\r\n .ldg__orientation{\r\n grid-template-columns:auto minmax(100px,1fr);\r\n gap:16px;\r\n margin-bottom:14px;\r\n }\r\n\r\n .ldg__drag-cue{\r\n display:none;\r\n }\r\n\r\n .ldg__count{\r\n font-size:11px;\r\n }\r\n\r\n .ldg__ribbon{\r\n gap:14px;\r\n padding-right:22vw;\r\n }\r\n\r\n .ldg__doctor{\r\n flex-basis:75vw;\r\n }\r\n\r\n .ldg__portrait{\r\n height:clamp(390px,46svh,500px);\r\n }\r\n\r\n .ldg__index{\r\n font-size:11px;\r\n }\r\n\r\n .ldg__name{\r\n font-size:clamp(32px,9vw,40px);\r\n }\r\n\r\n .ldg__category{\r\n font-size:11px;\r\n }\r\n\r\n .ldg__role{\r\n font-size:13px;\r\n }\r\n\r\n .ldg__proof{\r\n font-size:12px;\r\n }\r\n\r\n .ldg__profile{\r\n font-size:11px;\r\n }\r\n\r\n}\r\n\r\n@media (max-width:420px){\r\n\r\n .ldg__title{\r\n width:min(100%,7.72ch);\r\n font-size:clamp(54px,15.3vw,66px);\r\n }\r\n\r\n .ldg__title-line:first-child{\r\n margin-inline-start:-.064em;\r\n }\r\n\r\n .ldg__title-line:nth-child(2){\r\n margin-inline-start:-.010em;\r\n }\r\n\r\n .ldg__title-line + .ldg__title-line{\r\n margin-top:-.080em;\r\n }\r\n\r\n .ldg__title-line--accent{\r\n margin-top:0 !important;\r\n margin-inline-start:-.030em;\r\n }\r\n\r\n}\r\n\r\n\/* =========================================================\r\n REDUCED MOTION\r\n ========================================================= *\/\r\n\r\n@media (prefers-reduced-motion:reduce){\r\n\r\n #lamina-doctor-gallery [data-focus-layer]{\r\n filter:none !important;\r\n translate:0 0 !important;\r\n }\r\n\r\n #lamina-doctor-gallery .ldg__doctor,\r\n #lamina-doctor-gallery .ldg__portrait img,\r\n #lamina-doctor-gallery .ldg__doctor-meta,\r\n #lamina-doctor-gallery .ldg__name{\r\n transition:none !important;\r\n }\r\n\r\n}\r\n<\/style>\r\n\r\n\r\n<section\r\n id=\"lamina-doctor-gallery\"\r\n aria-labelledby=\"lamina-doctor-gallery-title\"\r\n data-lamina-focus-section\r\n data-focus-profile=\"medical-team\"\r\n>\r\n\r\n <div class=\"ldg__shell\">\r\n\r\n <header class=\"ldg__head\">\r\n\r\n <div>\r\n <p\r\n class=\"ldg__eyebrow\"\r\n data-focus-layer=\"heading\"\r\n >\r\n 05 \u2014 MEDICAL TEAM\r\n <\/p>\r\n\r\n <h2\r\n class=\"ldg__title\"\r\n id=\"lamina-doctor-gallery-title\"\r\n >\r\n <span class=\"ldg__title-line\" data-focus-layer=\"heading\">The people<\/span>\r\n <span class=\"ldg__title-line\" data-focus-layer=\"heading\">behind<\/span>\r\n <span class=\"ldg__title-line ldg__title-line--accent\" data-focus-layer=\"heading\">your care.<\/span>\r\n <\/h2>\r\n <\/div>\r\n\r\n <div>\r\n <p\r\n class=\"ldg__intro\"\r\n data-focus-layer=\"copy\"\r\n >\r\n Explore the medical professionals behind Lamina\u2019s hair restoration and dental care.\r\n <\/p>\r\n\r\n <p\r\n class=\"ldg__micro\"\r\n data-focus-layer=\"ui\"\r\n >\r\n Istanbul \u00b7 Medical Team\r\n <\/p>\r\n <\/div>\r\n\r\n <\/header>\r\n\r\n\r\n <div\r\n class=\"ldg__orientation\"\r\n data-focus-layer=\"ui\"\r\n >\r\n\r\n <span\r\n class=\"ldg__count\"\r\n aria-live=\"polite\"\r\n >\r\n 01 \/ 05\r\n <\/span>\r\n\r\n <div\r\n class=\"ldg__progress\"\r\n aria-hidden=\"true\"\r\n >\r\n <span class=\"ldg__progress-fill\"><\/span>\r\n <\/div>\r\n\r\n <span\r\n class=\"ldg__drag-cue\"\r\n aria-hidden=\"true\"\r\n >\r\n Drag \/ Swipe\r\n <\/span>\r\n\r\n <\/div>\r\n\r\n\r\n <div class=\"ldg__bleed\">\r\n\r\n <div class=\"ldg__ribbon-stage\">\r\n\r\n <button\r\n class=\"ldg__nav ldg__nav--prev\"\r\n type=\"button\"\r\n aria-label=\"Show previous doctor\"\r\n data-nav=\"prev\"\r\n >\r\n <svg viewBox=\"0 0 20 20\" aria-hidden=\"true\">\r\n <path d=\"M11.75 4.75L6.5 10l5.25 5.25\"><\/path>\r\n <\/svg>\r\n <\/button>\r\n\r\n <button\r\n class=\"ldg__nav ldg__nav--next\"\r\n type=\"button\"\r\n aria-label=\"Show next doctor\"\r\n data-nav=\"next\"\r\n >\r\n <svg viewBox=\"0 0 20 20\" aria-hidden=\"true\">\r\n <path d=\"M8.25 4.75L13.5 10l-5.25 5.25\"><\/path>\r\n <\/svg>\r\n <\/button>\r\n\r\n <div\r\n class=\"ldg__viewport\"\r\n role=\"region\"\r\n aria-label=\"Lamina Clinic medical team. Drag horizontally to explore doctors.\"\r\n tabindex=\"0\"\r\n >\r\n\r\n <div class=\"ldg__ribbon\">\r\n\r\n\r\n <article\r\n class=\"ldg__doctor is-nearest\"\r\n data-index=\"0\"\r\n data-parallax-strength=\".70\"\r\n data-position-desktop=\"50% 18%\"\r\n data-position-tablet=\"50% 16%\"\r\n data-position-mobile=\"50% 14%\"\r\n >\r\n\r\n <figure\r\n class=\"ldg__portrait\"\r\n data-focus-layer=\"media\"\r\n >\r\n <img\r\n src=\"assets\/doctors\/dr-serkan.webp\"\r\n width=\"1400\"\r\n height=\"1750\"\r\n loading=\"eager\"\r\n decoding=\"async\"\r\n alt=\"Dr. Serkan at Lamina Clinic\"\r\n onerror=\"this.parentElement.classList.add('is-missing');this.remove();\"\r\n >\r\n <\/figure>\r\n\r\n <div class=\"ldg__doctor-info\">\r\n\r\n <div\r\n class=\"ldg__doctor-meta\"\r\n data-focus-layer=\"metadata\"\r\n >\r\n <span class=\"ldg__index\">01<\/span>\r\n <h3 class=\"ldg__name\">Dr. Serkan<\/h3>\r\n <p class=\"ldg__category\">Hair Restoration<\/p>\r\n <p class=\"ldg__role\">Hair Transplant<\/p>\r\n <p class=\"ldg__proof\">One verified professional fact may appear here once confirmed.<\/p>\r\n <\/div>\r\n\r\n <a\r\n class=\"ldg__profile\"\r\n data-focus-layer=\"ui\"\r\n href=\"#\"\r\n data-placeholder-link\r\n >\r\n View profile <span class=\"ldg__arrow\" aria-hidden=\"true\">\u2192<\/span>\r\n <\/a>\r\n\r\n <\/div>\r\n\r\n <\/article>\r\n\r\n\r\n <article\r\n class=\"ldg__doctor\"\r\n data-index=\"1\"\r\n data-parallax-strength=\"1\"\r\n data-position-desktop=\"50% 17%\"\r\n data-position-tablet=\"50% 15%\"\r\n data-position-mobile=\"50% 13%\"\r\n >\r\n\r\n <figure\r\n class=\"ldg__portrait\"\r\n data-focus-layer=\"media\"\r\n >\r\n <img\r\n src=\"assets\/doctors\/dr-leyla-hasaneyn.webp\"\r\n width=\"1400\"\r\n height=\"1750\"\r\n loading=\"eager\"\r\n decoding=\"async\"\r\n alt=\"Dr. Leyla Hasaneyn at Lamina Clinic\"\r\n onerror=\"this.parentElement.classList.add('is-missing');this.remove();\"\r\n >\r\n <\/figure>\r\n\r\n <div class=\"ldg__doctor-info\">\r\n\r\n <div\r\n class=\"ldg__doctor-meta\"\r\n data-focus-layer=\"metadata\"\r\n >\r\n <span class=\"ldg__index\">02<\/span>\r\n <h3 class=\"ldg__name\">Dr. Leyla Hasaneyn<\/h3>\r\n <p class=\"ldg__category\">Dental Aesthetics<\/p>\r\n <p class=\"ldg__role\">Registered Dentist<\/p>\r\n <p class=\"ldg__proof\">One verified professional fact may appear here once confirmed.<\/p>\r\n <\/div>\r\n\r\n <a\r\n class=\"ldg__profile\"\r\n data-focus-layer=\"ui\"\r\n href=\"#\"\r\n data-placeholder-link\r\n >\r\n View profile <span class=\"ldg__arrow\" aria-hidden=\"true\">\u2192<\/span>\r\n <\/a>\r\n\r\n <\/div>\r\n\r\n <\/article>\r\n\r\n\r\n <article\r\n class=\"ldg__doctor\"\r\n data-index=\"2\"\r\n data-parallax-strength=\".90\"\r\n data-position-desktop=\"50% 17%\"\r\n data-position-tablet=\"50% 15%\"\r\n data-position-mobile=\"50% 13%\"\r\n >\r\n\r\n <figure\r\n class=\"ldg__portrait\"\r\n data-focus-layer=\"media\"\r\n >\r\n <img\r\n src=\"assets\/doctors\/dr-uyeys-koyara.webp\"\r\n width=\"1400\"\r\n height=\"1750\"\r\n loading=\"eager\"\r\n decoding=\"async\"\r\n alt=\"Dr. Uyeys Koyara at Lamina Clinic\"\r\n onerror=\"this.parentElement.classList.add('is-missing');this.remove();\"\r\n >\r\n <\/figure>\r\n\r\n <div class=\"ldg__doctor-info\">\r\n\r\n <div\r\n class=\"ldg__doctor-meta\"\r\n data-focus-layer=\"metadata\"\r\n >\r\n <span class=\"ldg__index\">03<\/span>\r\n <h3 class=\"ldg__name\">Dr. Uyeys Koyara<\/h3>\r\n <p class=\"ldg__category\">Dental Aesthetics<\/p>\r\n <p class=\"ldg__role\">Registered Dentist<\/p>\r\n <p class=\"ldg__proof\">One verified professional fact may appear here once confirmed.<\/p>\r\n <\/div>\r\n\r\n <a\r\n class=\"ldg__profile\"\r\n data-focus-layer=\"ui\"\r\n href=\"#\"\r\n data-placeholder-link\r\n >\r\n View profile <span class=\"ldg__arrow\" aria-hidden=\"true\">\u2192<\/span>\r\n <\/a>\r\n\r\n <\/div>\r\n\r\n <\/article>\r\n\r\n\r\n <article\r\n class=\"ldg__doctor\"\r\n data-index=\"3\"\r\n data-parallax-strength=\".80\"\r\n data-position-desktop=\"50% 17%\"\r\n data-position-tablet=\"50% 15%\"\r\n data-position-mobile=\"50% 13%\"\r\n >\r\n\r\n <figure\r\n class=\"ldg__portrait\"\r\n data-focus-layer=\"media\"\r\n >\r\n <img\r\n src=\"assets\/doctors\/dr-lin-makki.webp\"\r\n width=\"1400\"\r\n height=\"1750\"\r\n loading=\"eager\"\r\n decoding=\"async\"\r\n alt=\"Dr. Lin MAKKi at Lamina Clinic\"\r\n onerror=\"this.parentElement.classList.add('is-missing');this.remove();\"\r\n >\r\n <\/figure>\r\n\r\n <div class=\"ldg__doctor-info\">\r\n\r\n <div\r\n class=\"ldg__doctor-meta\"\r\n data-focus-layer=\"metadata\"\r\n >\r\n <span class=\"ldg__index\">04<\/span>\r\n <h3 class=\"ldg__name\">Dr. Lin MAKKi<\/h3>\r\n <p class=\"ldg__category\">Dental Aesthetics<\/p>\r\n <p class=\"ldg__role\">Registered Dentist<\/p>\r\n <p class=\"ldg__proof\">One verified professional fact may appear here once confirmed.<\/p>\r\n <\/div>\r\n\r\n <a\r\n class=\"ldg__profile\"\r\n data-focus-layer=\"ui\"\r\n href=\"#\"\r\n data-placeholder-link\r\n >\r\n View profile <span class=\"ldg__arrow\" aria-hidden=\"true\">\u2192<\/span>\r\n <\/a>\r\n\r\n <\/div>\r\n\r\n <\/article>\r\n\r\n\r\n <article\r\n class=\"ldg__doctor\"\r\n data-index=\"4\"\r\n data-parallax-strength=\".45\"\r\n data-position-desktop=\"52% 18%\"\r\n data-position-tablet=\"52% 16%\"\r\n data-position-mobile=\"52% 14%\"\r\n >\r\n\r\n <figure\r\n class=\"ldg__portrait\"\r\n data-focus-layer=\"media\"\r\n >\r\n <img loading=\"lazy\"\r\n src=\"assets\/doctors\/dr-mohammed-issa.webp\"\r\n width=\"1400\"\r\n height=\"1750\"\r\n loading=\"lazy\"\r\n decoding=\"async\"\r\n alt=\"Dr. Mohammed Issa at Lamina Clinic\"\r\n onerror=\"this.parentElement.classList.add('is-missing');this.remove();\"\r\n >\r\n <\/figure>\r\n\r\n <div class=\"ldg__doctor-info\">\r\n\r\n <div\r\n class=\"ldg__doctor-meta\"\r\n data-focus-layer=\"metadata\"\r\n >\r\n <span class=\"ldg__index\">05<\/span>\r\n <h3 class=\"ldg__name\">Dr. Mohammed Issa<\/h3>\r\n <p class=\"ldg__category\">Role to be confirmed<\/p>\r\n <p class=\"ldg__role\">Professional title pending verification<\/p>\r\n <p class=\"ldg__proof\">One verified professional fact may appear here once confirmed.<\/p>\r\n <\/div>\r\n\r\n <a\r\n class=\"ldg__profile\"\r\n data-focus-layer=\"ui\"\r\n href=\"#\"\r\n data-placeholder-link\r\n >\r\n View profile <span class=\"ldg__arrow\" aria-hidden=\"true\">\u2192<\/span>\r\n <\/a>\r\n\r\n <\/div>\r\n\r\n <\/article>\r\n\r\n\r\n <\/div>\r\n\r\n <\/div>\r\n\r\n <\/div>\r\n\r\n <\/div>\r\n\r\n <\/div>\r\n\r\n<\/section>\r\n\r\n\r\n<script>\r\n(() => {\r\n\r\n const root =\r\n document.getElementById(\r\n 'lamina-doctor-gallery'\r\n );\r\n\r\n\r\n if (\r\n !root ||\r\n root.dataset.kineticRibbonReady ===\r\n 'true'\r\n ) return;\r\n\r\n\r\n root.dataset.kineticRibbonReady =\r\n 'true';\r\n\r\n\r\n const viewport =\r\n root.querySelector(\r\n '.ldg__viewport'\r\n );\r\n\r\n\r\n const ribbon =\r\n root.querySelector(\r\n '.ldg__ribbon'\r\n );\r\n\r\n\r\n const cards =\r\n [\r\n ...root.querySelectorAll(\r\n '.ldg__doctor'\r\n )\r\n ];\r\n\r\n\r\n const count =\r\n root.querySelector(\r\n '.ldg__count'\r\n );\r\n\r\n\r\n const progressFill =\r\n root.querySelector(\r\n '.ldg__progress-fill'\r\n );\r\n\r\n\r\n const prevButton =\r\n root.querySelector(\r\n '[data-nav=\"prev\"]'\r\n );\r\n\r\n\r\n const nextButton =\r\n root.querySelector(\r\n '[data-nav=\"next\"]'\r\n );\r\n\r\n\r\n const reducedMotion =\r\n window.matchMedia(\r\n '(prefers-reduced-motion: reduce)'\r\n );\r\n\r\n\r\n if (\r\n !viewport ||\r\n !ribbon ||\r\n cards.length !== 5\r\n ) return;\r\n\r\n\r\n \/* =======================================================\r\n DOCTOR CROP NORMALIZATION\r\n ======================================================= *\/\r\n\r\n function viewportMode(){\r\n\r\n if (\r\n window.innerWidth <= 760\r\n ) return 'mobile';\r\n\r\n\r\n if (\r\n window.innerWidth <= 1080\r\n ) return 'tablet';\r\n\r\n\r\n return 'desktop';\r\n\r\n }\r\n\r\n\r\n function applyPortraitPositions(){\r\n\r\n const mode =\r\n viewportMode();\r\n\r\n\r\n cards.forEach(\r\n card => {\r\n\r\n const position =\r\n mode ===\r\n 'mobile'\r\n ? card.dataset.positionMobile\r\n : mode ===\r\n 'tablet'\r\n ? card.dataset.positionTablet\r\n : card.dataset.positionDesktop;\r\n\r\n\r\n card.style.setProperty(\r\n '--doctor-pos',\r\n position ||\r\n '50% 18%'\r\n );\r\n\r\n }\r\n );\r\n\r\n }\r\n\r\n\r\n \/* =======================================================\r\n PROJECT-WIDE LAMINA FOCUS-DEPTH CONTROLLER\r\n One singleton for entrance + exit focus across future sections.\r\n ======================================================= *\/\r\n\r\n if (\r\n !window.LaminaFocusDepth\r\n ){\r\n\r\n window.LaminaFocusDepth =\r\n (() => {\r\n\r\n const sectionStates =\r\n new Set();\r\n\r\n\r\n const reducedQuery =\r\n window.matchMedia(\r\n '(prefers-reduced-motion: reduce)'\r\n );\r\n\r\n\r\n let ticking =\r\n false;\r\n\r\n\r\n let previousScrollY =\r\n window.scrollY;\r\n\r\n\r\n let direction =\r\n 0;\r\n\r\n\r\n const directionThreshold =\r\n 3;\r\n\r\n\r\n const desktop =\r\n {\r\n focalTop:.20,\r\n focalBottom:.72,\r\n entryFar:.93,\r\n exitFar:-.14,\r\n\r\n heading:{\r\n entryBlur:5,\r\n exitBlur:4.4,\r\n opacityMin:.78,\r\n entryShift:6,\r\n exitShift:-3\r\n },\r\n\r\n copy:{\r\n entryBlur:3.5,\r\n exitBlur:3.2,\r\n opacityMin:.84,\r\n entryShift:5,\r\n exitShift:-2\r\n },\r\n\r\n ui:{\r\n entryBlur:2,\r\n exitBlur:2.1,\r\n opacityMin:.86,\r\n entryShift:3,\r\n exitShift:-1\r\n },\r\n\r\n metadata:{\r\n entryBlur:2.5,\r\n exitBlur:2.5,\r\n opacityMin:.84,\r\n entryShift:4,\r\n exitShift:-2\r\n },\r\n\r\n media:{\r\n entryBlur:3,\r\n exitBlur:3.4,\r\n opacityMin:.80,\r\n entryShift:5,\r\n exitShift:-2\r\n }\r\n };\r\n\r\n\r\n const mobile =\r\n {\r\n focalTop:.12,\r\n focalBottom:.80,\r\n entryFar:.96,\r\n exitFar:-.16,\r\n\r\n heading:{\r\n entryBlur:3.2,\r\n exitBlur:3.1,\r\n opacityMin:.82,\r\n entryShift:4,\r\n exitShift:-2\r\n },\r\n\r\n copy:{\r\n entryBlur:2,\r\n exitBlur:2.2,\r\n opacityMin:.88,\r\n entryShift:3,\r\n exitShift:-1\r\n },\r\n\r\n ui:{\r\n entryBlur:1.25,\r\n exitBlur:1.35,\r\n opacityMin:.90,\r\n entryShift:2,\r\n exitShift:-1\r\n },\r\n\r\n metadata:{\r\n entryBlur:1.6,\r\n exitBlur:1.75,\r\n opacityMin:.88,\r\n entryShift:2,\r\n exitShift:-1\r\n },\r\n\r\n media:{\r\n entryBlur:2.25,\r\n exitBlur:2.35,\r\n opacityMin:.84,\r\n entryShift:3,\r\n exitShift:-1\r\n }\r\n };\r\n\r\n\r\n function clamp(\r\n value,\r\n min,\r\n max\r\n ){\r\n\r\n return Math.min(\r\n max,\r\n Math.max(\r\n min,\r\n value\r\n )\r\n );\r\n\r\n }\r\n\r\n\r\n function smootherstep(\r\n value\r\n ){\r\n\r\n const t =\r\n clamp(\r\n value,\r\n 0,\r\n 1\r\n );\r\n\r\n\r\n return (\r\n t *\r\n t *\r\n t *\r\n (\r\n t *\r\n (\r\n t *\r\n 6 -\r\n 15\r\n ) +\r\n 10\r\n )\r\n );\r\n\r\n }\r\n\r\n\r\n function measure(\r\n state\r\n ){\r\n\r\n const sectionRect =\r\n state.section.getBoundingClientRect();\r\n\r\n\r\n state.layers =\r\n [\r\n ...state.section.querySelectorAll(\r\n '[data-focus-layer]'\r\n )\r\n ].map(\r\n element => {\r\n\r\n const rect =\r\n element.getBoundingClientRect();\r\n\r\n\r\n return {\r\n element,\r\n type:\r\n element.dataset.focusLayer ||\r\n 'copy',\r\n centerOffset:\r\n rect.top -\r\n sectionRect.top +\r\n rect.height *\r\n .5\r\n };\r\n\r\n }\r\n );\r\n\r\n }\r\n\r\n\r\n function applyLayer(\r\n item,\r\n entryProgress,\r\n exitProgress,\r\n config,\r\n reduced\r\n ){\r\n\r\n const depth =\r\n Math.max(\r\n entryProgress,\r\n exitProgress\r\n );\r\n\r\n\r\n let blur =\r\n entryProgress >=\r\n exitProgress\r\n ? (\r\n config.entryBlur *\r\n entryProgress\r\n )\r\n : (\r\n config.exitBlur *\r\n exitProgress\r\n );\r\n\r\n\r\n let opacity =\r\n 1 -\r\n (\r\n 1 -\r\n config.opacityMin\r\n ) *\r\n depth;\r\n\r\n\r\n let shift =\r\n entryProgress >=\r\n exitProgress\r\n ? (\r\n config.entryShift *\r\n entryProgress\r\n )\r\n : (\r\n config.exitShift *\r\n exitProgress\r\n );\r\n\r\n\r\n if (\r\n reduced\r\n ){\r\n\r\n blur =\r\n 0;\r\n\r\n\r\n shift =\r\n 0;\r\n\r\n\r\n opacity =\r\n 1 -\r\n .15 *\r\n depth;\r\n\r\n }\r\n\r\n\r\n item.element.style.setProperty(\r\n '--lamina-focus-blur',\r\n blur.toFixed(\r\n 2\r\n ) +\r\n 'px'\r\n );\r\n\r\n\r\n item.element.style.setProperty(\r\n '--lamina-focus-opacity',\r\n opacity.toFixed(\r\n 3\r\n )\r\n );\r\n\r\n\r\n item.element.style.setProperty(\r\n '--lamina-focus-y',\r\n shift.toFixed(\r\n 2\r\n ) +\r\n 'px'\r\n );\r\n\r\n }\r\n\r\n\r\n function updateSection(\r\n state,\r\n viewportHeight,\r\n compact\r\n ){\r\n\r\n if (\r\n !state.near\r\n ) return;\r\n\r\n\r\n const sectionRect =\r\n state.section.getBoundingClientRect();\r\n\r\n\r\n const config =\r\n compact\r\n ? mobile\r\n : desktop;\r\n\r\n\r\n const focalTop =\r\n viewportHeight *\r\n config.focalTop;\r\n\r\n\r\n const focalBottom =\r\n viewportHeight *\r\n config.focalBottom;\r\n\r\n\r\n const entryFar =\r\n viewportHeight *\r\n config.entryFar;\r\n\r\n\r\n const exitFar =\r\n viewportHeight *\r\n config.exitFar;\r\n\r\n\r\n const holdMedia =\r\n state.section.dataset.laminaFocusMediaHold ===\r\n 'true';\r\n\r\n\r\n state.layers.forEach(\r\n item => {\r\n\r\n const layerConfig =\r\n config[\r\n item.type\r\n ] ||\r\n config.copy;\r\n\r\n\r\n const focused =\r\n item.element.matches(\r\n ':focus-visible'\r\n ) ||\r\n item.element.matches(\r\n ':focus-within'\r\n );\r\n\r\n\r\n if (\r\n focused ||\r\n (\r\n holdMedia &&\r\n (\r\n item.type ===\r\n 'media' ||\r\n item.type ===\r\n 'metadata'\r\n )\r\n )\r\n ){\r\n\r\n applyLayer(\r\n item,\r\n 0,\r\n 0,\r\n layerConfig,\r\n reducedQuery.matches\r\n );\r\n\r\n\r\n return;\r\n\r\n }\r\n\r\n\r\n const centerY =\r\n sectionRect.top +\r\n item.centerOffset;\r\n\r\n\r\n \/*\r\n UPCOMING \/ BELOW:\r\n meaningful blur exists only below the lower focal boundary.\r\n *\/\r\n const entryProgress =\r\n centerY >\r\n focalBottom\r\n ? smootherstep(\r\n (\r\n centerY -\r\n focalBottom\r\n ) \/\r\n Math.max(\r\n 1,\r\n entryFar -\r\n focalBottom\r\n )\r\n )\r\n : 0;\r\n\r\n\r\n \/*\r\n PASSED \/ ABOVE:\r\n blur begins only after content has moved above the upper\r\n focal boundary. This is the existing Lamina exit-focus rule.\r\n *\/\r\n const exitProgress =\r\n centerY <\r\n focalTop\r\n ? smootherstep(\r\n (\r\n focalTop -\r\n centerY\r\n ) \/\r\n Math.max(\r\n 1,\r\n focalTop -\r\n exitFar\r\n )\r\n )\r\n : 0;\r\n\r\n\r\n applyLayer(\r\n item,\r\n entryProgress,\r\n exitProgress,\r\n layerConfig,\r\n reducedQuery.matches\r\n );\r\n\r\n }\r\n );\r\n\r\n }\r\n\r\n\r\n function update(){\r\n\r\n ticking =\r\n false;\r\n\r\n\r\n const currentScrollY =\r\n window.scrollY;\r\n\r\n\r\n const delta =\r\n currentScrollY -\r\n previousScrollY;\r\n\r\n\r\n if (\r\n delta >\r\n directionThreshold\r\n ){\r\n\r\n direction =\r\n 1;\r\n\r\n }else if(\r\n delta <\r\n -directionThreshold\r\n ){\r\n\r\n direction =\r\n -1;\r\n\r\n }\r\n\r\n\r\n previousScrollY =\r\n currentScrollY;\r\n\r\n\r\n const viewportHeight =\r\n Math.max(\r\n 1,\r\n window.innerHeight ||\r\n document.documentElement.clientHeight\r\n );\r\n\r\n\r\n const compact =\r\n window.innerWidth <=\r\n 760;\r\n\r\n\r\n sectionStates.forEach(\r\n state => {\r\n\r\n state.direction =\r\n direction;\r\n\r\n\r\n updateSection(\r\n state,\r\n viewportHeight,\r\n compact\r\n );\r\n\r\n }\r\n );\r\n\r\n }\r\n\r\n\r\n function requestUpdate(){\r\n\r\n if (\r\n ticking\r\n ) return;\r\n\r\n\r\n ticking =\r\n true;\r\n\r\n\r\n requestAnimationFrame(\r\n update\r\n );\r\n\r\n }\r\n\r\n\r\n const intersectionObserver =\r\n 'IntersectionObserver' in window\r\n ? new IntersectionObserver(\r\n entries => {\r\n\r\n entries.forEach(\r\n entry => {\r\n\r\n const state =\r\n entry.target.__laminaFocusDepthState;\r\n\r\n\r\n if (\r\n !state\r\n ) return;\r\n\r\n\r\n state.near =\r\n entry.isIntersecting;\r\n\r\n\r\n if (\r\n state.near\r\n ){\r\n\r\n measure(\r\n state\r\n );\r\n\r\n\r\n requestUpdate();\r\n\r\n }\r\n\r\n }\r\n );\r\n\r\n },\r\n {\r\n rootMargin:'110% 0px 110% 0px',\r\n threshold:0\r\n }\r\n )\r\n : null;\r\n\r\n\r\n const resizeObserver =\r\n 'ResizeObserver' in window\r\n ? new ResizeObserver(\r\n entries => {\r\n\r\n entries.forEach(\r\n entry => {\r\n\r\n const state =\r\n entry.target.__laminaFocusDepthState;\r\n\r\n\r\n if (\r\n state\r\n ){\r\n\r\n measure(\r\n state\r\n );\r\n\r\n }\r\n\r\n }\r\n );\r\n\r\n\r\n requestUpdate();\r\n\r\n }\r\n )\r\n : null;\r\n\r\n\r\n function register(\r\n section\r\n ){\r\n\r\n if (\r\n !section ||\r\n section.__laminaFocusDepthState\r\n ) return;\r\n\r\n\r\n const state =\r\n {\r\n section,\r\n near:true,\r\n direction:0,\r\n layers:[]\r\n };\r\n\r\n\r\n section.__laminaFocusDepthState =\r\n state;\r\n\r\n\r\n sectionStates.add(\r\n state\r\n );\r\n\r\n\r\n measure(\r\n state\r\n );\r\n\r\n\r\n intersectionObserver?.observe(\r\n section\r\n );\r\n\r\n\r\n resizeObserver?.observe(\r\n section\r\n );\r\n\r\n\r\n requestUpdate();\r\n\r\n }\r\n\r\n\r\n function remeasure(){\r\n\r\n sectionStates.forEach(\r\n state => {\r\n\r\n measure(\r\n state\r\n );\r\n\r\n }\r\n );\r\n\r\n\r\n requestUpdate();\r\n\r\n }\r\n\r\n\r\n window.addEventListener(\r\n 'scroll',\r\n requestUpdate,\r\n {\r\n passive:true\r\n }\r\n );\r\n\r\n\r\n let resizeTimer =\r\n null;\r\n\r\n\r\n window.addEventListener(\r\n 'resize',\r\n () => {\r\n\r\n window.clearTimeout(\r\n resizeTimer\r\n );\r\n\r\n\r\n resizeTimer =\r\n window.setTimeout(\r\n remeasure,\r\n 120\r\n );\r\n\r\n },\r\n {\r\n passive:true\r\n }\r\n );\r\n\r\n\r\n return {\r\n register,\r\n requestUpdate,\r\n remeasure\r\n };\r\n\r\n })();\r\n\r\n }\r\n\r\n\r\n window.LaminaFocusDepth.register(\r\n root\r\n );\r\n\r\n\r\n \/* =======================================================\r\n KINETIC RIBBON STATE\r\n ======================================================= *\/\r\n\r\n let anchors =\r\n [];\r\n\r\n\r\n let minX =\r\n 0;\r\n\r\n\r\n let maxX =\r\n 0;\r\n\r\n\r\n let focalX =\r\n 0;\r\n\r\n\r\n let currentX =\r\n 0;\r\n\r\n\r\n let nearestIndex =\r\n 0;\r\n\r\n\r\n let previousMotionX =\r\n 0;\r\n\r\n\r\n let smoothedVelocity =\r\n 0;\r\n\r\n\r\n let motionFrame =\r\n 0;\r\n\r\n\r\n let motionActive =\r\n false;\r\n\r\n\r\n let gsapInstance =\r\n null;\r\n\r\n\r\n let draggableInstance =\r\n null;\r\n\r\n\r\n let usingGsap =\r\n false;\r\n\r\n\r\n let suppressClickUntil =\r\n 0;\r\n\r\n\r\n let pointerStartX =\r\n 0;\r\n\r\n\r\n let pointerStartY =\r\n 0;\r\n\r\n\r\n let pointerMoved =\r\n false;\r\n\r\n\r\n let wheelSettleTimer =\r\n null;\r\n\r\n\r\n let fallbackTweenFrame =\r\n 0;\r\n\r\n\r\n function clamp(\r\n value,\r\n min,\r\n max\r\n ){\r\n\r\n return Math.min(\r\n max,\r\n Math.max(\r\n min,\r\n value\r\n )\r\n );\r\n\r\n }\r\n\r\n\r\n function lerp(\r\n a,\r\n b,\r\n t\r\n ){\r\n\r\n return (\r\n a +\r\n (\r\n b -\r\n a\r\n ) *\r\n t\r\n );\r\n\r\n }\r\n\r\n\r\n function nearestAnchorIndex(\r\n value\r\n ){\r\n\r\n let bestIndex =\r\n 0;\r\n\r\n\r\n let bestDistance =\r\n Infinity;\r\n\r\n\r\n anchors.forEach(\r\n (\r\n anchor,\r\n index\r\n ) => {\r\n\r\n const distance =\r\n Math.abs(\r\n value -\r\n anchor\r\n );\r\n\r\n\r\n if (\r\n distance <\r\n bestDistance\r\n ){\r\n\r\n bestDistance =\r\n distance;\r\n\r\n\r\n bestIndex =\r\n index;\r\n\r\n }\r\n\r\n }\r\n );\r\n\r\n\r\n return bestIndex;\r\n\r\n }\r\n\r\n\r\n function nearestAnchorValue(\r\n value\r\n ){\r\n\r\n return (\r\n anchors[\r\n nearestAnchorIndex(\r\n value\r\n )\r\n ] ??\r\n 0\r\n );\r\n\r\n }\r\n\r\n\r\n function readRibbonX(){\r\n\r\n if (\r\n usingGsap &&\r\n gsapInstance\r\n ){\r\n\r\n return Number(\r\n gsapInstance.getProperty(\r\n ribbon,\r\n 'x'\r\n )\r\n ) || 0;\r\n\r\n }\r\n\r\n\r\n return currentX;\r\n\r\n }\r\n\r\n\r\n function updateNavState(){\r\n\r\n if (\r\n !prevButton ||\r\n !nextButton\r\n ) return;\r\n\r\n\r\n prevButton.disabled =\r\n nearestIndex <= 0;\r\n\r\n\r\n nextButton.disabled =\r\n nearestIndex >= cards.length - 1;\r\n\r\n }\r\n\r\n\r\n function writeRibbonX(\r\n value\r\n ){\r\n\r\n currentX =\r\n clamp(\r\n value,\r\n minX,\r\n maxX\r\n );\r\n\r\n\r\n if (\r\n usingGsap &&\r\n gsapInstance\r\n ){\r\n\r\n gsapInstance.set(\r\n ribbon,\r\n {\r\n x:currentX\r\n }\r\n );\r\n\r\n }else{\r\n\r\n ribbon.style.transform =\r\n 'translate3d(' +\r\n currentX.toFixed(\r\n 3\r\n ) +\r\n 'px,0,0)';\r\n\r\n }\r\n\r\n }\r\n\r\n\r\n function measureGeometry(\r\n preserveIndex =\r\n true\r\n ){\r\n\r\n const oldIndex =\r\n nearestIndex;\r\n\r\n\r\n const viewportWidth =\r\n Math.max(\r\n 1,\r\n viewport.clientWidth\r\n );\r\n\r\n\r\n const compact =\r\n window.innerWidth <=\r\n 760;\r\n\r\n\r\n focalX =\r\n viewportWidth *\r\n (\r\n compact\r\n ? .48\r\n : .30\r\n );\r\n\r\n\r\n anchors =\r\n cards.map(\r\n card => {\r\n\r\n return (\r\n focalX -\r\n (\r\n card.offsetLeft +\r\n card.offsetWidth *\r\n .5\r\n )\r\n );\r\n\r\n }\r\n );\r\n\r\n\r\n maxX =\r\n anchors[0];\r\n\r\n\r\n minX =\r\n anchors[\r\n anchors.length -\r\n 1\r\n ];\r\n\r\n\r\n const targetIndex =\r\n preserveIndex\r\n ? clamp(\r\n oldIndex,\r\n 0,\r\n cards.length -\r\n 1\r\n )\r\n : 0;\r\n\r\n\r\n const target =\r\n anchors[\r\n targetIndex\r\n ];\r\n\r\n\r\n writeRibbonX(\r\n target\r\n );\r\n\r\n\r\n previousMotionX =\r\n currentX;\r\n\r\n\r\n updateVisualState(\r\n true\r\n );\r\n\r\n\r\n draggableInstance?.applyBounds?.(\r\n {\r\n minX,\r\n maxX\r\n }\r\n );\r\n\r\n\r\n draggableInstance?.update?.(\r\n true\r\n );\r\n\r\n\r\n window.LaminaFocusDepth?.remeasure?.();\r\n\r\n }\r\n\r\n\r\n function startMotion(){\r\n\r\n if (\r\n motionActive\r\n ) return;\r\n\r\n\r\n motionActive =\r\n true;\r\n\r\n\r\n root.classList.add(\r\n 'is-ribbon-moving'\r\n );\r\n\r\n\r\n previousMotionX =\r\n readRibbonX();\r\n\r\n\r\n motionFrame =\r\n requestAnimationFrame(\r\n motionLoop\r\n );\r\n\r\n }\r\n\r\n\r\n function endMotion(){\r\n\r\n motionActive =\r\n false;\r\n\r\n\r\n cancelAnimationFrame(\r\n motionFrame\r\n );\r\n\r\n\r\n motionFrame =\r\n 0;\r\n\r\n\r\n smoothedVelocity =\r\n 0;\r\n\r\n\r\n cards.forEach(\r\n card => {\r\n\r\n card.style.setProperty(\r\n '--img-x',\r\n '0px'\r\n );\r\n\r\n\r\n card.style.setProperty(\r\n '--img-saturation',\r\n '1'\r\n );\r\n\r\n }\r\n );\r\n\r\n\r\n root.classList.remove(\r\n 'is-ribbon-moving'\r\n );\r\n\r\n\r\n delete root.dataset.laminaFocusMediaHold;\r\n\r\n\r\n window.LaminaFocusDepth?.requestUpdate?.();\r\n\r\n\r\n updateVisualState(\r\n true\r\n );\r\n\r\n }\r\n\r\n\r\n function motionLoop(){\r\n\r\n if (\r\n !motionActive\r\n ) return;\r\n\r\n\r\n currentX =\r\n readRibbonX();\r\n\r\n\r\n const rawVelocity =\r\n currentX -\r\n previousMotionX;\r\n\r\n\r\n previousMotionX =\r\n currentX;\r\n\r\n\r\n smoothedVelocity =\r\n lerp(\r\n smoothedVelocity,\r\n rawVelocity,\r\n .16\r\n );\r\n\r\n\r\n if (\r\n Math.abs(\r\n smoothedVelocity\r\n ) <\r\n .015\r\n ){\r\n\r\n smoothedVelocity =\r\n 0;\r\n\r\n }\r\n\r\n\r\n updateVisualState(\r\n false\r\n );\r\n\r\n\r\n motionFrame =\r\n requestAnimationFrame(\r\n motionLoop\r\n );\r\n\r\n }\r\n\r\n\r\n function updateVisualState(\r\n forceStill\r\n ){\r\n\r\n const viewportRect =\r\n viewport.getBoundingClientRect();\r\n\r\n\r\n const compact =\r\n window.innerWidth <=\r\n 760;\r\n\r\n\r\n const focusRange =\r\n Math.max(\r\n compact\r\n ? 230\r\n : 300,\r\n viewportRect.width *\r\n (\r\n compact\r\n ? .62\r\n : .48\r\n )\r\n );\r\n\r\n\r\n const velocityReference =\r\n compact\r\n ? 18\r\n : 24;\r\n\r\n\r\n const normalizedVelocity =\r\n forceStill\r\n ? 0\r\n : clamp(\r\n smoothedVelocity \/\r\n velocityReference,\r\n -1,\r\n 1\r\n );\r\n\r\n\r\n let bestIndex =\r\n 0;\r\n\r\n\r\n let bestDistance =\r\n Infinity;\r\n\r\n\r\n cards.forEach(\r\n (\r\n card,\r\n index\r\n ) => {\r\n\r\n const center =\r\n currentX +\r\n card.offsetLeft +\r\n card.offsetWidth *\r\n .5;\r\n\r\n\r\n const distance =\r\n Math.abs(\r\n center -\r\n focalX\r\n );\r\n\r\n\r\n if (\r\n distance <\r\n bestDistance\r\n ){\r\n\r\n bestDistance =\r\n distance;\r\n\r\n\r\n bestIndex =\r\n index;\r\n\r\n }\r\n\r\n\r\n const proximity =\r\n clamp(\r\n 1 -\r\n distance \/\r\n focusRange,\r\n 0,\r\n 1\r\n );\r\n\r\n\r\n const opacity =\r\n .52 +\r\n proximity *\r\n .48;\r\n\r\n\r\n const scale =\r\n .975 +\r\n proximity *\r\n .025;\r\n\r\n\r\n const doctorBlur =\r\n (\r\n compact\r\n ? 1.5\r\n : 2.2\r\n ) *\r\n Math.pow(\r\n 1 -\r\n proximity,\r\n 1.18\r\n );\r\n\r\n\r\n const nameOpacity =\r\n .48 +\r\n proximity *\r\n .52;\r\n\r\n\r\n const metaOpacity =\r\n .52 +\r\n proximity *\r\n .48;\r\n\r\n\r\n const overlayOpacity =\r\n .62 -\r\n proximity *\r\n .34;\r\n\r\n\r\n card.style.setProperty(\r\n '--focus',\r\n proximity.toFixed(\r\n 4\r\n )\r\n );\r\n\r\n\r\n card.style.setProperty(\r\n '--doctor-opacity',\r\n opacity.toFixed(\r\n 3\r\n )\r\n );\r\n\r\n\r\n card.style.setProperty(\r\n '--doctor-scale',\r\n scale.toFixed(\r\n 4\r\n )\r\n );\r\n\r\n\r\n card.style.setProperty(\r\n '--doctor-blur',\r\n doctorBlur.toFixed(\r\n 2\r\n ) +\r\n 'px'\r\n );\r\n\r\n\r\n card.style.setProperty(\r\n '--name-opacity',\r\n nameOpacity.toFixed(\r\n 3\r\n )\r\n );\r\n\r\n\r\n card.style.setProperty(\r\n '--meta-opacity',\r\n metaOpacity.toFixed(\r\n 3\r\n )\r\n );\r\n\r\n\r\n card.style.setProperty(\r\n '--overlay-opacity',\r\n overlayOpacity.toFixed(\r\n 3\r\n )\r\n );\r\n\r\n\r\n const strength =\r\n Number(\r\n card.dataset.parallaxStrength ||\r\n 1\r\n );\r\n\r\n\r\n const maxParallax =\r\n (\r\n compact\r\n ? 6\r\n : 12\r\n ) *\r\n strength;\r\n\r\n\r\n const imageOffset =\r\n -normalizedVelocity *\r\n maxParallax;\r\n\r\n\r\n const imageScale =\r\n 1.035 +\r\n Math.abs(\r\n normalizedVelocity\r\n ) *\r\n .004;\r\n\r\n\r\n const saturation =\r\n 1 -\r\n Math.abs(\r\n normalizedVelocity\r\n ) *\r\n .045;\r\n\r\n\r\n card.style.setProperty(\r\n '--img-x',\r\n imageOffset.toFixed(\r\n 2\r\n ) +\r\n 'px'\r\n );\r\n\r\n\r\n card.style.setProperty(\r\n '--img-scale',\r\n imageScale.toFixed(\r\n 4\r\n )\r\n );\r\n\r\n\r\n card.style.setProperty(\r\n '--img-saturation',\r\n saturation.toFixed(\r\n 3\r\n )\r\n );\r\n\r\n }\r\n );\r\n\r\n\r\n nearestIndex =\r\n bestIndex;\r\n\r\n\r\n cards.forEach(\r\n (\r\n card,\r\n index\r\n ) => {\r\n\r\n card.classList.toggle(\r\n 'is-nearest',\r\n index ===\r\n nearestIndex\r\n );\r\n\r\n\r\n card.setAttribute(\r\n 'aria-current',\r\n index ===\r\n nearestIndex\r\n ? 'true'\r\n : 'false'\r\n );\r\n\r\n }\r\n );\r\n\r\n\r\n if (\r\n count\r\n ){\r\n\r\n count.textContent =\r\n String(\r\n nearestIndex +\r\n 1\r\n ).padStart(\r\n 2,\r\n '0'\r\n ) +\r\n ' \/ ' +\r\n String(\r\n cards.length\r\n ).padStart(\r\n 2,\r\n '0'\r\n );\r\n\r\n }\r\n\r\n\r\n const denominator =\r\n maxX -\r\n minX;\r\n\r\n\r\n const progress =\r\n denominator ===\r\n 0\r\n ? 0\r\n : clamp(\r\n (\r\n maxX -\r\n currentX\r\n ) \/\r\n denominator,\r\n 0,\r\n 1\r\n );\r\n\r\n\r\n if (\r\n progressFill\r\n ){\r\n\r\n progressFill.style.transform =\r\n 'scaleX(' +\r\n progress.toFixed(\r\n 4\r\n ) +\r\n ')';\r\n\r\n }\r\n\r\n\r\n updateNavState();\r\n\r\n }\r\n\r\n\r\n \/* =======================================================\r\n GSAP LOADING \/ REUSE\r\n Reuse existing global GSAP if present.\r\n Load only missing pieces when necessary.\r\n ======================================================= *\/\r\n\r\n function loadScriptOnce(\r\n src,\r\n test\r\n ){\r\n\r\n if (\r\n test()\r\n ){\r\n\r\n return Promise.resolve(\r\n true\r\n );\r\n\r\n }\r\n\r\n\r\n const existing =\r\n [\r\n ...document.scripts\r\n ].find(\r\n script =>\r\n script.src ===\r\n src\r\n );\r\n\r\n\r\n if (\r\n existing\r\n ){\r\n\r\n return new Promise(\r\n resolve => {\r\n\r\n existing.addEventListener(\r\n 'load',\r\n () => resolve(\r\n test()\r\n ),\r\n {\r\n once:true\r\n }\r\n );\r\n\r\n\r\n existing.addEventListener(\r\n 'error',\r\n () => resolve(\r\n false\r\n ),\r\n {\r\n once:true\r\n }\r\n );\r\n\r\n }\r\n );\r\n\r\n }\r\n\r\n\r\n return new Promise(\r\n resolve => {\r\n\r\n const script =\r\n document.createElement(\r\n 'script'\r\n );\r\n\r\n\r\n script.src =\r\n src;\r\n\r\n\r\n script.async =\r\n true;\r\n\r\n\r\n script.onload =\r\n () => resolve(\r\n test()\r\n );\r\n\r\n\r\n script.onerror =\r\n () => resolve(\r\n false\r\n );\r\n\r\n\r\n document.head.appendChild(\r\n script\r\n );\r\n\r\n }\r\n );\r\n\r\n }\r\n\r\n\r\n async function ensureKineticGsap(){\r\n\r\n let gsapReady =\r\n Boolean(\r\n window.gsap\r\n );\r\n\r\n\r\n if (\r\n !gsapReady\r\n ){\r\n\r\n gsapReady =\r\n await loadScriptOnce(\r\n 'https:\/\/cdn.jsdelivr.net\/npm\/gsap@3.13.0\/dist\/gsap.min.js',\r\n () => Boolean(\r\n window.gsap\r\n )\r\n );\r\n\r\n }\r\n\r\n\r\n if (\r\n !gsapReady\r\n ){\r\n\r\n return false;\r\n\r\n }\r\n\r\n\r\n const version =\r\n window.gsap.version ||\r\n '3.13.0';\r\n\r\n\r\n let draggableReady =\r\n Boolean(\r\n window.Draggable\r\n );\r\n\r\n\r\n if (\r\n !draggableReady\r\n ){\r\n\r\n draggableReady =\r\n await loadScriptOnce(\r\n 'https:\/\/cdn.jsdelivr.net\/npm\/gsap@' +\r\n version +\r\n '\/dist\/Draggable.min.js',\r\n () => Boolean(\r\n window.Draggable\r\n )\r\n );\r\n\r\n }\r\n\r\n\r\n let inertiaReady =\r\n Boolean(\r\n window.InertiaPlugin\r\n );\r\n\r\n\r\n if (\r\n !inertiaReady\r\n ){\r\n\r\n inertiaReady =\r\n await loadScriptOnce(\r\n 'https:\/\/cdn.jsdelivr.net\/npm\/gsap@' +\r\n version +\r\n '\/dist\/InertiaPlugin.min.js',\r\n () => Boolean(\r\n window.InertiaPlugin\r\n )\r\n );\r\n\r\n }\r\n\r\n\r\n if (\r\n !draggableReady ||\r\n !inertiaReady\r\n ){\r\n\r\n return false;\r\n\r\n }\r\n\r\n\r\n window.gsap.registerPlugin(\r\n window.Draggable,\r\n window.InertiaPlugin\r\n );\r\n\r\n\r\n return true;\r\n\r\n }\r\n\r\n\r\n \/* =======================================================\r\n GSAP DRAGGABLE ENGINE\r\n ======================================================= *\/\r\n\r\n function killGsapMotion(){\r\n\r\n if (\r\n !usingGsap ||\r\n !gsapInstance\r\n ) return;\r\n\r\n\r\n gsapInstance.killTweensOf(\r\n ribbon\r\n );\r\n\r\n\r\n draggableInstance?.tween?.kill?.();\r\n\r\n }\r\n\r\n\r\n function focusDoctorGsap(\r\n index\r\n ){\r\n\r\n const safeIndex =\r\n clamp(\r\n index,\r\n 0,\r\n cards.length -\r\n 1\r\n );\r\n\r\n\r\n killGsapMotion();\r\n\r\n\r\n const target =\r\n anchors[\r\n safeIndex\r\n ];\r\n\r\n\r\n const distance =\r\n Math.abs(\r\n readRibbonX() -\r\n target\r\n );\r\n\r\n\r\n const duration =\r\n clamp(\r\n .70 +\r\n distance \/\r\n 1600,\r\n .70,\r\n .95\r\n );\r\n\r\n\r\n startMotion();\r\n\r\n\r\n gsapInstance.to(\r\n ribbon,\r\n {\r\n x:target,\r\n duration:\r\n reducedMotion.matches\r\n ? .01\r\n : duration,\r\n ease:'power3.inOut',\r\n overwrite:'auto',\r\n\r\n onUpdate(){\r\n\r\n currentX =\r\n readRibbonX();\r\n\r\n\r\n draggableInstance?.update?.(\r\n true\r\n );\r\n\r\n },\r\n\r\n onComplete(){\r\n\r\n currentX =\r\n target;\r\n\r\n\r\n draggableInstance?.update?.(\r\n true\r\n );\r\n\r\n\r\n endMotion();\r\n\r\n }\r\n }\r\n );\r\n\r\n }\r\n\r\n\r\n function initGsapDraggable(){\r\n\r\n gsapInstance =\r\n window.gsap;\r\n\r\n\r\n usingGsap =\r\n true;\r\n\r\n\r\n writeRibbonX(\r\n anchors[\r\n nearestIndex\r\n ]\r\n );\r\n\r\n\r\n const draggable =\r\n window.Draggable.create(\r\n ribbon,\r\n {\r\n type:'x',\r\n\r\n bounds:{\r\n minX,\r\n maxX\r\n },\r\n\r\n edgeResistance:.88,\r\n\r\n inertia:\r\n reducedMotion.matches\r\n ? false\r\n : true,\r\n\r\n allowNativeTouchScrolling:true,\r\n\r\n dragClickables:false,\r\n\r\n cursor:'grab',\r\n\r\n activeCursor:'grabbing',\r\n\r\n minimumMovement:3,\r\n\r\n snap:{\r\n x(\r\n endValue\r\n ){\r\n\r\n return nearestAnchorValue(\r\n endValue\r\n );\r\n\r\n }\r\n },\r\n\r\n onPress(){\r\n\r\n killGsapMotion();\r\n\r\n\r\n pointerMoved =\r\n false;\r\n\r\n\r\n pointerStartX =\r\n this.pointerX ||\r\n 0;\r\n\r\n\r\n pointerStartY =\r\n this.pointerY ||\r\n 0;\r\n\r\n\r\n root.dataset.laminaFocusMediaHold =\r\n 'true';\r\n\r\n\r\n viewport.classList.add(\r\n 'is-dragging'\r\n );\r\n\r\n\r\n startMotion();\r\n\r\n\r\n window.LaminaFocusDepth?.requestUpdate?.();\r\n\r\n },\r\n\r\n onDragStart(){\r\n\r\n pointerMoved =\r\n true;\r\n\r\n },\r\n\r\n onDrag(){\r\n\r\n currentX =\r\n this.x;\r\n\r\n\r\n const dx =\r\n Math.abs(\r\n (\r\n this.pointerX ||\r\n 0\r\n ) -\r\n pointerStartX\r\n );\r\n\r\n\r\n const dy =\r\n Math.abs(\r\n (\r\n this.pointerY ||\r\n 0\r\n ) -\r\n pointerStartY\r\n );\r\n\r\n\r\n if (\r\n dx >\r\n 6 ||\r\n dy >\r\n 6\r\n ){\r\n\r\n pointerMoved =\r\n true;\r\n\r\n }\r\n\r\n },\r\n\r\n onRelease(){\r\n\r\n viewport.classList.remove(\r\n 'is-dragging'\r\n );\r\n\r\n\r\n if (\r\n pointerMoved\r\n ){\r\n\r\n suppressClickUntil =\r\n performance.now() +\r\n 260;\r\n\r\n }\r\n\r\n\r\n if (\r\n reducedMotion.matches\r\n ){\r\n\r\n focusDoctorGsap(\r\n nearestAnchorIndex(\r\n this.x\r\n )\r\n );\r\n\r\n }\r\n\r\n },\r\n\r\n onThrowUpdate(){\r\n\r\n currentX =\r\n this.x;\r\n\r\n\r\n startMotion();\r\n\r\n },\r\n\r\n onThrowComplete(){\r\n\r\n currentX =\r\n this.x;\r\n\r\n\r\n const settledIndex =\r\n nearestAnchorIndex(\r\n currentX\r\n );\r\n\r\n\r\n const exact =\r\n anchors[\r\n settledIndex\r\n ];\r\n\r\n\r\n gsapInstance.set(\r\n ribbon,\r\n {\r\n x:exact\r\n }\r\n );\r\n\r\n\r\n currentX =\r\n exact;\r\n\r\n\r\n this.update(\r\n true\r\n );\r\n\r\n\r\n endMotion();\r\n\r\n }\r\n }\r\n )[\r\n 0\r\n ];\r\n\r\n\r\n draggableInstance =\r\n draggable;\r\n\r\n\r\n updateVisualState(\r\n true\r\n );\r\n\r\n }\r\n\r\n\r\n \/* =======================================================\r\n NATIVE FALLBACK ENGINE\r\n Used only if GSAP \/ plugins cannot load.\r\n ======================================================= *\/\r\n\r\n let fallbackDragging =\r\n false;\r\n\r\n\r\n let fallbackPointerId =\r\n null;\r\n\r\n\r\n let fallbackStartPointerX =\r\n 0;\r\n\r\n\r\n let fallbackStartPointerY =\r\n 0;\r\n\r\n\r\n let fallbackStartX =\r\n 0;\r\n\r\n\r\n let fallbackLastPointerX =\r\n 0;\r\n\r\n\r\n let fallbackLastTime =\r\n 0;\r\n\r\n\r\n let fallbackVelocity =\r\n 0;\r\n\r\n\r\n function stopFallbackTween(){\r\n\r\n cancelAnimationFrame(\r\n fallbackTweenFrame\r\n );\r\n\r\n\r\n fallbackTweenFrame =\r\n 0;\r\n\r\n }\r\n\r\n\r\n function animateFallbackTo(\r\n target,\r\n duration =\r\n 760\r\n ){\r\n\r\n stopFallbackTween();\r\n\r\n\r\n const start =\r\n currentX;\r\n\r\n\r\n const distance =\r\n target -\r\n start;\r\n\r\n\r\n const startTime =\r\n performance.now();\r\n\r\n\r\n startMotion();\r\n\r\n\r\n function frame(\r\n now\r\n ){\r\n\r\n const t =\r\n clamp(\r\n (\r\n now -\r\n startTime\r\n ) \/\r\n duration,\r\n 0,\r\n 1\r\n );\r\n\r\n\r\n const eased =\r\n t <\r\n .5\r\n ? 4 *\r\n t *\r\n t *\r\n t\r\n : 1 -\r\n Math.pow(\r\n -2 *\r\n t +\r\n 2,\r\n 3\r\n ) \/\r\n 2;\r\n\r\n\r\n writeRibbonX(\r\n start +\r\n distance *\r\n eased\r\n );\r\n\r\n\r\n if (\r\n t <\r\n 1\r\n ){\r\n\r\n fallbackTweenFrame =\r\n requestAnimationFrame(\r\n frame\r\n );\r\n\r\n }else{\r\n\r\n writeRibbonX(\r\n target\r\n );\r\n\r\n\r\n endMotion();\r\n\r\n }\r\n\r\n }\r\n\r\n\r\n fallbackTweenFrame =\r\n requestAnimationFrame(\r\n frame\r\n );\r\n\r\n }\r\n\r\n\r\n function fallbackFocusDoctor(\r\n index\r\n ){\r\n\r\n const safeIndex =\r\n clamp(\r\n index,\r\n 0,\r\n cards.length -\r\n 1\r\n );\r\n\r\n\r\n animateFallbackTo(\r\n anchors[\r\n safeIndex\r\n ],\r\n reducedMotion.matches\r\n ? 1\r\n : 780\r\n );\r\n\r\n }\r\n\r\n\r\n function resistedX(\r\n value\r\n ){\r\n\r\n if (\r\n value >\r\n maxX\r\n ){\r\n\r\n return (\r\n maxX +\r\n (\r\n value -\r\n maxX\r\n ) *\r\n .12\r\n );\r\n\r\n }\r\n\r\n\r\n if (\r\n value <\r\n minX\r\n ){\r\n\r\n return (\r\n minX +\r\n (\r\n value -\r\n minX\r\n ) *\r\n .12\r\n );\r\n\r\n }\r\n\r\n\r\n return value;\r\n\r\n }\r\n\r\n\r\n function initFallbackDrag(){\r\n\r\n viewport.addEventListener(\r\n 'pointerdown',\r\n event => {\r\n\r\n if (\r\n event.button !==\r\n undefined &&\r\n event.button !==\r\n 0\r\n ) return;\r\n\r\n\r\n if (\r\n event.target.closest(\r\n 'a,button'\r\n )\r\n ) return;\r\n\r\n\r\n stopFallbackTween();\r\n\r\n\r\n fallbackDragging =\r\n true;\r\n\r\n\r\n fallbackPointerId =\r\n event.pointerId;\r\n\r\n\r\n fallbackStartPointerX =\r\n event.clientX;\r\n\r\n\r\n fallbackStartPointerY =\r\n event.clientY;\r\n\r\n\r\n fallbackStartX =\r\n currentX;\r\n\r\n\r\n fallbackLastPointerX =\r\n event.clientX;\r\n\r\n\r\n fallbackLastTime =\r\n performance.now();\r\n\r\n\r\n fallbackVelocity =\r\n 0;\r\n\r\n\r\n pointerMoved =\r\n false;\r\n\r\n\r\n root.dataset.laminaFocusMediaHold =\r\n 'true';\r\n\r\n\r\n viewport.classList.add(\r\n 'is-dragging'\r\n );\r\n\r\n\r\n viewport.setPointerCapture?.(\r\n event.pointerId\r\n );\r\n\r\n\r\n startMotion();\r\n\r\n\r\n window.LaminaFocusDepth?.requestUpdate?.();\r\n\r\n }\r\n );\r\n\r\n\r\n viewport.addEventListener(\r\n 'pointermove',\r\n event => {\r\n\r\n if (\r\n !fallbackDragging ||\r\n event.pointerId !==\r\n fallbackPointerId\r\n ) return;\r\n\r\n\r\n const dx =\r\n event.clientX -\r\n fallbackStartPointerX;\r\n\r\n\r\n const dy =\r\n event.clientY -\r\n fallbackStartPointerY;\r\n\r\n\r\n if (\r\n !pointerMoved &&\r\n Math.abs(\r\n dy\r\n ) >\r\n Math.abs(\r\n dx\r\n ) +\r\n 5\r\n ){\r\n\r\n \/*\r\n Vertical gesture wins. Never trap page scroll.\r\n *\/\r\n fallbackDragging =\r\n false;\r\n\r\n\r\n viewport.classList.remove(\r\n 'is-dragging'\r\n );\r\n\r\n\r\n delete root.dataset.laminaFocusMediaHold;\r\n\r\n\r\n endMotion();\r\n\r\n\r\n return;\r\n\r\n }\r\n\r\n\r\n if (\r\n Math.abs(\r\n dx\r\n ) >\r\n 5\r\n ){\r\n\r\n pointerMoved =\r\n true;\r\n\r\n }\r\n\r\n\r\n if (\r\n !pointerMoved\r\n ) return;\r\n\r\n\r\n const now =\r\n performance.now();\r\n\r\n\r\n const dt =\r\n Math.max(\r\n 1,\r\n now -\r\n fallbackLastTime\r\n );\r\n\r\n\r\n fallbackVelocity =\r\n (\r\n event.clientX -\r\n fallbackLastPointerX\r\n ) \/\r\n dt;\r\n\r\n\r\n fallbackLastPointerX =\r\n event.clientX;\r\n\r\n\r\n fallbackLastTime =\r\n now;\r\n\r\n\r\n writeRibbonX(\r\n resistedX(\r\n fallbackStartX +\r\n dx\r\n )\r\n );\r\n\r\n },\r\n {\r\n passive:true\r\n }\r\n );\r\n\r\n\r\n function releaseFallback(\r\n event\r\n ){\r\n\r\n if (\r\n !fallbackDragging ||\r\n event.pointerId !==\r\n fallbackPointerId\r\n ) return;\r\n\r\n\r\n fallbackDragging =\r\n false;\r\n\r\n\r\n viewport.classList.remove(\r\n 'is-dragging'\r\n );\r\n\r\n\r\n viewport.releasePointerCapture?.(\r\n event.pointerId\r\n );\r\n\r\n\r\n if (\r\n pointerMoved\r\n ){\r\n\r\n suppressClickUntil =\r\n performance.now() +\r\n 260;\r\n\r\n }\r\n\r\n\r\n \/*\r\n Restrained momentum prediction.\r\n Heavy enough to feel physical; capped so small flicks do not\r\n shoot across all five doctors.\r\n *\/\r\n const projected =\r\n clamp(\r\n currentX +\r\n fallbackVelocity *\r\n (\r\n reducedMotion.matches\r\n ? 0\r\n : 260\r\n ),\r\n minX,\r\n maxX\r\n );\r\n\r\n\r\n const target =\r\n nearestAnchorValue(\r\n projected\r\n );\r\n\r\n\r\n animateFallbackTo(\r\n target,\r\n reducedMotion.matches\r\n ? 1\r\n : clamp(\r\n 620 +\r\n Math.abs(\r\n target -\r\n currentX\r\n ) *\r\n .28,\r\n 620,\r\n 1100\r\n )\r\n );\r\n\r\n }\r\n\r\n\r\n viewport.addEventListener(\r\n 'pointerup',\r\n releaseFallback\r\n );\r\n\r\n\r\n viewport.addEventListener(\r\n 'pointercancel',\r\n releaseFallback\r\n );\r\n\r\n }\r\n\r\n\r\n \/* =======================================================\r\n HORIZONTAL TRACKPAD SUPPORT\r\n Only horizontal-dominant gestures are handled.\r\n Normal vertical wheel movement is never intercepted.\r\n ======================================================= *\/\r\n\r\n viewport.addEventListener(\r\n 'wheel',\r\n event => {\r\n\r\n if (\r\n Math.abs(\r\n event.deltaX\r\n ) <=\r\n Math.abs(\r\n event.deltaY\r\n ) *\r\n 1.15\r\n ){\r\n\r\n return;\r\n\r\n }\r\n\r\n\r\n \/*\r\n This prevents only the horizontal browser pan.\r\n Vertical wheel scrolling remains untouched.\r\n *\/\r\n event.preventDefault();\r\n\r\n\r\n if (\r\n usingGsap\r\n ){\r\n\r\n killGsapMotion();\r\n\r\n }else{\r\n\r\n stopFallbackTween();\r\n\r\n }\r\n\r\n\r\n root.dataset.laminaFocusMediaHold =\r\n 'true';\r\n\r\n\r\n startMotion();\r\n\r\n\r\n const nextX =\r\n clamp(\r\n readRibbonX() -\r\n event.deltaX,\r\n minX,\r\n maxX\r\n );\r\n\r\n\r\n writeRibbonX(\r\n nextX\r\n );\r\n\r\n\r\n draggableInstance?.update?.(\r\n true\r\n );\r\n\r\n\r\n window.clearTimeout(\r\n wheelSettleTimer\r\n );\r\n\r\n\r\n wheelSettleTimer =\r\n window.setTimeout(\r\n () => {\r\n\r\n const targetIndex =\r\n nearestAnchorIndex(\r\n readRibbonX()\r\n );\r\n\r\n\r\n if (\r\n usingGsap\r\n ){\r\n\r\n focusDoctorGsap(\r\n targetIndex\r\n );\r\n\r\n }else{\r\n\r\n fallbackFocusDoctor(\r\n targetIndex\r\n );\r\n\r\n }\r\n\r\n },\r\n 110\r\n );\r\n\r\n },\r\n {\r\n passive:false\r\n }\r\n );\r\n\r\n\r\n \/* =======================================================\r\n CLICK-TO-FOCUS\r\n ======================================================= *\/\r\n\r\n cards.forEach(\r\n (\r\n card,\r\n index\r\n ) => {\r\n\r\n card.addEventListener(\r\n 'click',\r\n event => {\r\n\r\n if (\r\n event.target.closest(\r\n 'a,button'\r\n )\r\n ) return;\r\n\r\n\r\n if (\r\n performance.now() <\r\n suppressClickUntil\r\n ) return;\r\n\r\n\r\n if (\r\n usingGsap\r\n ){\r\n\r\n focusDoctorGsap(\r\n index\r\n );\r\n\r\n }else{\r\n\r\n fallbackFocusDoctor(\r\n index\r\n );\r\n\r\n }\r\n\r\n }\r\n );\r\n\r\n }\r\n );\r\n\r\n\r\n \/* =======================================================\r\n SIDE ARROWS \u2014 secondary navigation only\r\n ======================================================= *\/\r\n\r\n prevButton?.addEventListener(\r\n 'click',\r\n () => {\r\n\r\n const target =\r\n clamp(\r\n nearestIndex - 1,\r\n 0,\r\n cards.length - 1\r\n );\r\n\r\n\r\n if (\r\n usingGsap\r\n ){\r\n\r\n focusDoctorGsap(\r\n target\r\n );\r\n\r\n }else{\r\n\r\n fallbackFocusDoctor(\r\n target\r\n );\r\n\r\n }\r\n\r\n }\r\n );\r\n\r\n\r\n nextButton?.addEventListener(\r\n 'click',\r\n () => {\r\n\r\n const target =\r\n clamp(\r\n nearestIndex + 1,\r\n 0,\r\n cards.length - 1\r\n );\r\n\r\n\r\n if (\r\n usingGsap\r\n ){\r\n\r\n focusDoctorGsap(\r\n target\r\n );\r\n\r\n }else{\r\n\r\n fallbackFocusDoctor(\r\n target\r\n );\r\n\r\n }\r\n\r\n }\r\n );\r\n\r\n\r\n \/* =======================================================\r\n KEYBOARD\r\n ======================================================= *\/\r\n\r\n viewport.addEventListener(\r\n 'keydown',\r\n event => {\r\n\r\n let target =\r\n null;\r\n\r\n\r\n if (\r\n event.key ===\r\n 'ArrowRight'\r\n ){\r\n\r\n target =\r\n nearestIndex +\r\n 1;\r\n\r\n }else if(\r\n event.key ===\r\n 'ArrowLeft'\r\n ){\r\n\r\n target =\r\n nearestIndex -\r\n 1;\r\n\r\n }else if(\r\n event.key ===\r\n 'Home'\r\n ){\r\n\r\n target =\r\n 0;\r\n\r\n }else if(\r\n event.key ===\r\n 'End'\r\n ){\r\n\r\n target =\r\n cards.length -\r\n 1;\r\n\r\n }else{\r\n\r\n return;\r\n\r\n }\r\n\r\n\r\n event.preventDefault();\r\n\r\n\r\n const safe =\r\n clamp(\r\n target,\r\n 0,\r\n cards.length -\r\n 1\r\n );\r\n\r\n\r\n if (\r\n usingGsap\r\n ){\r\n\r\n focusDoctorGsap(\r\n safe\r\n );\r\n\r\n }else{\r\n\r\n fallbackFocusDoctor(\r\n safe\r\n );\r\n\r\n }\r\n\r\n }\r\n );\r\n\r\n\r\n \/* =======================================================\r\n PROFILE PLACEHOLDERS\r\n ======================================================= *\/\r\n\r\n [\r\n ...root.querySelectorAll(\r\n '[data-placeholder-link]'\r\n )\r\n ].forEach(\r\n link => {\r\n\r\n link.addEventListener(\r\n 'click',\r\n event => {\r\n\r\n if (\r\n link.getAttribute(\r\n 'href'\r\n ) ===\r\n '#'\r\n ){\r\n\r\n event.preventDefault();\r\n\r\n }\r\n\r\n }\r\n );\r\n\r\n }\r\n );\r\n\r\n\r\n \/* =======================================================\r\n APPROACH PRELOAD\r\n ======================================================= *\/\r\n\r\n if (\r\n 'IntersectionObserver' in window\r\n ){\r\n\r\n const preloadObserver =\r\n new IntersectionObserver(\r\n entries => {\r\n\r\n entries.forEach(\r\n entry => {\r\n\r\n if (\r\n !entry.isIntersecting\r\n ) return;\r\n\r\n\r\n cards\r\n .slice(\r\n 0,\r\n 4\r\n )\r\n .forEach(\r\n card => {\r\n\r\n const img =\r\n card.querySelector(\r\n 'img'\r\n );\r\n\r\n\r\n if (\r\n img &&\r\n img.loading ===\r\n 'lazy'\r\n ){\r\n\r\n img.loading =\r\n 'eager';\r\n\r\n }\r\n\r\n }\r\n );\r\n\r\n\r\n preloadObserver.disconnect();\r\n\r\n }\r\n );\r\n\r\n },\r\n {\r\n rootMargin:'900px 0px 900px 0px',\r\n threshold:0\r\n }\r\n );\r\n\r\n\r\n preloadObserver.observe(\r\n root\r\n );\r\n\r\n }\r\n\r\n\r\n \/* =======================================================\r\n RESIZE \/ BREAKPOINT RE-MEASURE\r\n Preserve current doctor identity.\r\n ======================================================= *\/\r\n\r\n let resizeTimer =\r\n null;\r\n\r\n\r\n window.addEventListener(\r\n 'resize',\r\n () => {\r\n\r\n window.clearTimeout(\r\n resizeTimer\r\n );\r\n\r\n\r\n resizeTimer =\r\n window.setTimeout(\r\n () => {\r\n\r\n if (\r\n usingGsap\r\n ){\r\n\r\n killGsapMotion();\r\n\r\n }else{\r\n\r\n stopFallbackTween();\r\n\r\n }\r\n\r\n\r\n applyPortraitPositions();\r\n\r\n\r\n measureGeometry(\r\n true\r\n );\r\n\r\n\r\n window.LaminaFocusDepth?.remeasure?.();\r\n\r\n },\r\n 130\r\n );\r\n\r\n },\r\n {\r\n passive:true\r\n }\r\n );\r\n\r\n\r\n \/* =======================================================\r\n INITIALIZE\r\n ======================================================= *\/\r\n\r\n async function init(){\r\n\r\n applyPortraitPositions();\r\n\r\n\r\n \/*\r\n Wait one frame so fonts \/ responsive layout have valid geometry.\r\n Intrinsic image dimensions already reserve space.\r\n *\/\r\n await new Promise(\r\n resolve =>\r\n requestAnimationFrame(\r\n () =>\r\n requestAnimationFrame(\r\n resolve\r\n )\r\n )\r\n );\r\n\r\n\r\n measureGeometry(\r\n false\r\n );\r\n\r\n\r\n updateVisualState(\r\n true\r\n );\r\n\r\n\r\n updateNavState();\r\n\r\n\r\n const gsapReady =\r\n await ensureKineticGsap();\r\n\r\n\r\n if (\r\n gsapReady\r\n ){\r\n\r\n initGsapDraggable();\r\n\r\n }else{\r\n\r\n usingGsap =\r\n false;\r\n\r\n\r\n initFallbackDrag();\r\n\r\n }\r\n\r\n\r\n \/*\r\n Keep the first doctor locked to its real editorial anchor.\r\n *\/\r\n if (\r\n usingGsap\r\n ){\r\n\r\n gsapInstance.set(\r\n ribbon,\r\n {\r\n x:anchors[0]\r\n }\r\n );\r\n\r\n\r\n draggableInstance?.update?.(\r\n true\r\n );\r\n\r\n }else{\r\n\r\n writeRibbonX(\r\n anchors[0]\r\n );\r\n\r\n }\r\n\r\n\r\n currentX =\r\n anchors[0];\r\n\r\n\r\n nearestIndex =\r\n 0;\r\n\r\n\r\n previousMotionX =\r\n currentX;\r\n\r\n\r\n updateVisualState(\r\n true\r\n );\r\n\r\n\r\n window.LaminaFocusDepth?.remeasure?.();\r\n\r\n }\r\n\r\n\r\n init();\r\n\r\n})();\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-555dc83 e-con-full e-flex e-con e-parent\" data-id=\"555dc83\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-9660cb1 elementor-widget elementor-widget-html\" data-id=\"9660cb1\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- =========================================================\r\nLAMINA CLINIC \u2014 SECTION 06\r\nTREATMENT PLANNING\r\nCOMPLETE REBUILD FROM ZERO\r\nCONCEPT: THE TREATMENT PATH TREE\r\nV9: WIDER TREE \/ LARGER CLINICAL MEDIA\r\n\r\nCore idea:\r\nONE ORGANIZED TREATMENT JOURNEY.\r\nTHE TREE DRAWS ITSELF INTO PLACE ON ENTRANCE.\r\n\r\nProduction note:\r\nMedia regions below are intentionally neutral placeholders.\r\nReplace only with Lamina-approved, anonymised clinical assets.\r\nNo borrowed clinic media, patient identifiers, active QR codes,\r\nfabricated clinical metrics, or fake software interfaces.\r\n========================================================= -->\r\n\r\n<style>\r\n@import url('https:\/\/fonts.googleapis.com\/css2?family=Cormorant+Garamond:ital,wght@0,400;0,500&family=Manrope:wght@400;500;600&display=swap');\r\n\r\n#lamina-treatment-path-tree{\r\n --pt-ivory:#F7F2EA;\r\n --pt-ivory-2:#F3ECE8;\r\n --pt-ivory-3:#EEE7E7;\r\n --pt-stone:#E8E1E4;\r\n --pt-aubergine:#2B142F;\r\n --pt-plum:#5F2468;\r\n --pt-orchid:#94709A;\r\n --pt-lilac:#C5B2C8;\r\n --pt-champagne:#D8C4A1;\r\n --pt-line:rgba(95,36,104,.23);\r\n --pt-rule:rgba(43,20,47,.10);\r\n --pt-ease:cubic-bezier(.16,.70,.18,1);\r\n\r\n \/*\r\n Shared geometric stage.\r\n Intro, selector and Tree now resolve around the same true center axis.\r\n *\/\r\n --pt-stage-width:1480px;\r\n\r\n position:relative;\r\n width:100%;\r\n overflow:hidden;\r\n\r\n background:var(--pt-ivory);\r\n color:var(--pt-aubergine);\r\n\r\n font-family:\"Manrope\",system-ui,-apple-system,BlinkMacSystemFont,\"Segoe UI\",sans-serif;\r\n\r\n -webkit-tap-highlight-color:rgba(95,36,104,.08);\r\n}\r\n\r\n#lamina-treatment-path-tree *,\r\n#lamina-treatment-path-tree *::before,\r\n#lamina-treatment-path-tree *::after{\r\n box-sizing:border-box;\r\n}\r\n\r\n#lamina-treatment-path-tree ::selection{\r\n background:var(--pt-plum);\r\n color:var(--pt-ivory);\r\n}\r\n\r\n\/* =========================================================\r\n PERMANENT LAMINA \/ ELEMENTOR COLOR PROTECTION\r\n Brand-sensitive interactive states only.\r\n ========================================================= *\/\r\n\r\n#lamina-treatment-path-tree a,\r\n#lamina-treatment-path-tree a:link,\r\n#lamina-treatment-path-tree a:visited,\r\n#lamina-treatment-path-tree a:hover,\r\n#lamina-treatment-path-tree a:focus,\r\n#lamina-treatment-path-tree a:focus-visible,\r\n#lamina-treatment-path-tree a:active,\r\n#lamina-treatment-path-tree button,\r\n#lamina-treatment-path-tree button:hover,\r\n#lamina-treatment-path-tree button:focus,\r\n#lamina-treatment-path-tree button:focus-visible,\r\n#lamina-treatment-path-tree button:active{\r\n color:var(--pt-aubergine) !important;\r\n text-decoration-color:var(--pt-plum) !important;\r\n}\r\n\r\n#lamina-treatment-path-tree .pt__path,\r\n#lamina-treatment-path-tree .pt__path:hover,\r\n#lamina-treatment-path-tree .pt__path:focus,\r\n#lamina-treatment-path-tree .pt__path:focus-visible,\r\n#lamina-treatment-path-tree .pt__path:active{\r\n background-color:transparent !important;\r\n border-color:transparent !important;\r\n box-shadow:none !important;\r\n}\r\n\r\n#lamina-treatment-path-tree .pt__path[aria-pressed=\"false\"],\r\n#lamina-treatment-path-tree .pt__path[aria-pressed=\"false\"]:hover,\r\n#lamina-treatment-path-tree .pt__path[aria-pressed=\"false\"]:focus,\r\n#lamina-treatment-path-tree .pt__path[aria-pressed=\"false\"]:focus-visible,\r\n#lamina-treatment-path-tree .pt__path[aria-pressed=\"false\"]:active{\r\n color:var(--pt-orchid) !important;\r\n}\r\n\r\n#lamina-treatment-path-tree .pt__path[aria-pressed=\"true\"],\r\n#lamina-treatment-path-tree .pt__path[aria-pressed=\"true\"]:hover,\r\n#lamina-treatment-path-tree .pt__path[aria-pressed=\"true\"]:focus,\r\n#lamina-treatment-path-tree .pt__path[aria-pressed=\"true\"]:focus-visible,\r\n#lamina-treatment-path-tree .pt__path[aria-pressed=\"true\"]:active{\r\n color:var(--pt-aubergine) !important;\r\n}\r\n\r\n#lamina-treatment-path-tree .pt__path::after{\r\n background-color:var(--pt-plum) !important;\r\n}\r\n\r\n#lamina-treatment-path-tree .pt__cta,\r\n#lamina-treatment-path-tree .pt__cta:link,\r\n#lamina-treatment-path-tree .pt__cta:visited,\r\n#lamina-treatment-path-tree .pt__cta:hover,\r\n#lamina-treatment-path-tree .pt__cta:focus,\r\n#lamina-treatment-path-tree .pt__cta:focus-visible,\r\n#lamina-treatment-path-tree .pt__cta:active{\r\n color:var(--pt-aubergine) !important;\r\n background:transparent !important;\r\n border-color:transparent !important;\r\n box-shadow:none !important;\r\n}\r\n\r\n#lamina-treatment-path-tree .pt__path:focus-visible,\r\n#lamina-treatment-path-tree .pt__cta:focus-visible{\r\n outline-color:rgba(95,36,104,.44) !important;\r\n}\r\n\r\n\/* =========================================================\r\n SECTION \/ INTRO\r\n Normal document flow. No sticky\/pinning.\r\n ========================================================= *\/\r\n\r\n.pt__inner{\r\n width:min(100%,1680px);\r\n margin-inline:auto;\r\n\r\n padding:\r\n clamp(72px,8vh,102px)\r\n clamp(22px,3vw,58px)\r\n clamp(96px,10vh,136px);\r\n}\r\n\r\n.pt__intro{\r\n width:min(100%,var(--pt-stage-width));\r\n margin-inline:auto;\r\n\r\n display:grid;\r\n grid-template-columns:repeat(2,minmax(0,1fr));\r\n gap:0;\r\n align-items:center;\r\n}\r\n\r\n.pt__intro-left,\r\n.pt__intro-right{\r\n min-width:0;\r\n width:100%;\r\n}\r\n\r\n\/*\r\n Optical centering:\r\n each intro block is centered inside one half of the exact same stage\r\n used by the Tree. This removes the previous left-heavy composition.\r\n*\/\r\n.pt__intro-left{\r\n max-width:590px;\r\n justify-self:center;\r\n}\r\n\r\n.pt__intro-right{\r\n max-width:470px;\r\n justify-self:center;\r\n align-self:center;\r\n padding-inline-start:0;\r\n}\r\n\r\n.pt__eyebrow{\r\n margin:0 0 18px;\r\n\r\n color:rgba(95,36,104,.84);\r\n\r\n font-size:clamp(11px,.72vw,13px);\r\n line-height:1.2;\r\n font-weight:600;\r\n letter-spacing:.17em;\r\n text-transform:uppercase;\r\n}\r\n\r\n.pt__title{\r\n margin:0;\r\n\r\n max-width:11.4ch;\r\n overflow:visible;\r\n\r\n color:var(--pt-aubergine);\r\n\r\n font-family:\"Cormorant Garamond\",Georgia,serif;\r\n font-size:clamp(62px,5vw,88px);\r\n line-height:1;\r\n font-weight:400;\r\n letter-spacing:-.046em;\r\n}\r\n\r\n.pt__title-mask{\r\n display:block;\r\n overflow:visible;\r\n padding-bottom:.085em;\r\n}\r\n\r\n.pt__title-mask + .pt__title-mask{\r\n margin-top:-.055em;\r\n}\r\n\r\n.pt__title-line{\r\n display:block;\r\n width:max-content;\r\n max-width:100%;\r\n\r\n line-height:.90;\r\n\r\n will-change:transform, opacity, filter;\r\n}\r\n\r\n.pt__title-line--accent{\r\n margin-top:.045em;\r\n\r\n padding-inline-end:.05em;\r\n padding-bottom:.08em;\r\n\r\n color:#94709A;\r\n\r\n font-style:italic;\r\n font-weight:400;\r\n letter-spacing:-.038em;\r\n line-height:.92;\r\n}\r\n\r\n.pt__support{\r\n margin:0;\r\n\r\n max-width:36ch;\r\n\r\n color:rgba(43,20,47,.64);\r\n\r\n font-size:clamp(16px,1.02vw,18px);\r\n line-height:1.76;\r\n}\r\n\r\n\/* =========================================================\r\n SELECTOR \u2014 BETWEEN INTRO AND TREE\r\n ========================================================= *\/\r\n\r\n.pt__selector-wrap{\r\n width:min(100%,var(--pt-stage-width));\r\n margin-inline:auto;\r\n\r\n display:flex;\r\n justify-content:center;\r\n\r\n margin-top:clamp(36px,4.8vh,58px);\r\n}\r\n\r\n.pt__selector{\r\n display:flex;\r\n align-items:center;\r\n justify-content:center;\r\n gap:clamp(52px,7vw,106px);\r\n\r\n padding-inline:10px;\r\n}\r\n\r\n.pt__path{\r\n position:relative;\r\n\r\n display:inline-flex;\r\n align-items:center;\r\n justify-content:center;\r\n\r\n min-height:44px;\r\n padding:0 0 10px;\r\n\r\n border:0;\r\n border-radius:0;\r\n\r\n background:transparent;\r\n color:var(--pt-orchid);\r\n\r\n font-size:clamp(12px,.82vw,14px);\r\n line-height:1.2;\r\n font-weight:600;\r\n letter-spacing:.11em;\r\n text-transform:uppercase;\r\n\r\n cursor:pointer;\r\n\r\n transition:\r\n color .34s ease,\r\n opacity .34s ease;\r\n}\r\n\r\n.pt__path::after{\r\n content:\"\";\r\n\r\n position:absolute;\r\n\r\n inset-inline-start:50%;\r\n inset-block-end:0;\r\n\r\n width:clamp(28px,2.8vw,42px);\r\n height:1px;\r\n\r\n background:var(--pt-plum);\r\n\r\n transform:\r\n translateX(-50%)\r\n scaleX(0);\r\n\r\n transform-origin:50% 50%;\r\n\r\n transition:\r\n transform .50s var(--pt-ease);\r\n}\r\n\r\n[dir=\"rtl\"] .pt__path::after{\r\n transform:\r\n translateX(50%)\r\n scaleX(0);\r\n}\r\n\r\n.pt__path[aria-pressed=\"true\"]::after{\r\n transform:\r\n translateX(-50%)\r\n scaleX(1);\r\n}\r\n\r\n[dir=\"rtl\"] .pt__path[aria-pressed=\"true\"]::after{\r\n transform:\r\n translateX(50%)\r\n scaleX(1);\r\n}\r\n\r\n.pt__path:focus-visible{\r\n outline:1px solid rgba(95,36,104,.38);\r\n outline-offset:6px;\r\n}\r\n\r\n\/* =========================================================\r\n TREE\r\n ========================================================= *\/\r\n\r\n.pt__tree{\r\n position:relative;\r\n\r\n width:min(100%,var(--pt-stage-width));\r\n margin:\r\n clamp(56px,6.6vh,82px)\r\n auto\r\n 0;\r\n\r\n padding:\r\n 18px\r\n 0\r\n 8px;\r\n}\r\n\r\n.pt__tree::before{\r\n content:\"\";\r\n\r\n position:absolute;\r\n inset:\r\n 0\r\n 0\r\n auto\r\n 0;\r\n\r\n height:1px;\r\n background:linear-gradient(\r\n 90deg,\r\n rgba(95,36,104,0),\r\n rgba(95,36,104,.10) 18%,\r\n rgba(95,36,104,.06) 82%,\r\n rgba(95,36,104,0)\r\n );\r\n\r\n pointer-events:none;\r\n}\r\n\r\n\/* Desktop central spine. *\/\r\n.pt__spine{\r\n position:absolute;\r\n z-index:1;\r\n\r\n inset-block:18px 18px;\r\n inset-inline-start:50%;\r\n\r\n width:1px;\r\n margin-inline-start:-.5px;\r\n\r\n background:rgba(95,36,104,.14);\r\n\r\n transform-origin:50% 0;\r\n pointer-events:none;\r\n will-change:transform, opacity;\r\n overflow:visible;\r\n}\r\n\r\n.pt__spine::after{\r\n content:\"\";\r\n\r\n position:absolute;\r\n inset:0;\r\n\r\n background:linear-gradient(\r\n 180deg,\r\n rgba(216,196,161,.96) 0%,\r\n rgba(149,112,154,.92) 32%,\r\n rgba(95,36,104,.98) 100%\r\n );\r\n\r\n transform-origin:50% 0;\r\n transform:scaleY(var(--pt-spine-progress,0));\r\n\r\n box-shadow:\r\n 0 0 10px rgba(149,112,154,.18),\r\n 0 0 16px rgba(216,196,161,.08);\r\n\r\n will-change:transform;\r\n}\r\n\r\n.pt__step{\r\n --pt-branch-length:98px;\r\n\r\n position:relative;\r\n z-index:2;\r\n\r\n display:grid;\r\n grid-template-columns:minmax(0,1fr) 128px minmax(0,1fr);\r\n align-items:center;\r\n\r\n min-height:clamp(188px,22vh,236px);\r\n\r\n isolation:isolate;\r\n}\r\n\r\n.pt__step + .pt__step{\r\n margin-top:clamp(22px,3vh,34px);\r\n}\r\n\r\n.pt__step--visual{\r\n min-height:clamp(320px,36vh,410px);\r\n}\r\n\r\n.pt__step-content{\r\n position:relative;\r\n z-index:3;\r\n\r\n width:min(100%,540px);\r\n\r\n padding-block:18px;\r\n\r\n transition:\r\n opacity .28s ease,\r\n transform .58s var(--pt-ease),\r\n filter .52s ease;\r\n will-change:transform, opacity, filter;\r\n}\r\n\r\n.pt__step--left .pt__step-content{\r\n grid-column:1;\r\n justify-self:end;\r\n\r\n padding-inline-end:clamp(20px,2.2vw,38px);\r\n\r\n text-align:start;\r\n}\r\n\r\n.pt__step--right .pt__step-content{\r\n grid-column:3;\r\n justify-self:start;\r\n\r\n padding-inline-start:clamp(20px,2.2vw,38px);\r\n\r\n text-align:start;\r\n}\r\n\r\n\/* Straight branch. *\/\r\n.pt__branch{\r\n position:absolute;\r\n z-index:2;\r\n\r\n inset-block-start:50%;\r\n\r\n width:var(--pt-branch-length);\r\n height:1px;\r\n\r\n background:var(--pt-line);\r\n\r\n transform-origin:0 50%;\r\n pointer-events:none;\r\n}\r\n\r\n.pt__step--left .pt__branch{\r\n inset-inline-end:50%;\r\n\r\n transform-origin:100% 50%;\r\n}\r\n\r\n.pt__step--right .pt__branch{\r\n inset-inline-start:50%;\r\n\r\n transform-origin:0 50%;\r\n}\r\n\r\n\/* Tiny node. *\/\r\n.pt__node{\r\n position:absolute;\r\n z-index:4;\r\n\r\n inset-inline-start:50%;\r\n inset-block-start:50%;\r\n\r\n width:8px;\r\n height:8px;\r\n\r\n border:\r\n 1px solid rgba(95,36,104,.56);\r\n border-radius:50%;\r\n\r\n background:var(--pt-ivory);\r\n\r\n transform:translate(-50%,-50%);\r\n\r\n box-shadow:\r\n 0 0 0 3px rgba(247,242,234,.92);\r\n\r\n pointer-events:none;\r\n}\r\n\r\n[dir=\"rtl\"] .pt__node{\r\n transform:translate(50%,-50%);\r\n}\r\n\r\n.pt__branch,\r\n.pt__node,\r\n.pt__media,\r\n.pt__share-thumb{\r\n transition:\r\n opacity .34s ease,\r\n filter .52s ease,\r\n border-color .34s ease,\r\n box-shadow .42s ease,\r\n background-color .34s ease;\r\n}\r\n\r\n.pt__step:hover .pt__branch,\r\n.pt__step:focus-within .pt__branch{\r\n background:rgba(95,36,104,.34);\r\n}\r\n\r\n.pt__step:hover .pt__node,\r\n.pt__step:focus-within .pt__node{\r\n background:var(--pt-plum);\r\n border-color:var(--pt-plum);\r\n\r\n box-shadow:\r\n 0 0 0 3px rgba(247,242,234,.96),\r\n 0 0 0 5px rgba(95,36,104,.10);\r\n}\r\n\r\n.pt__step:hover .pt__media,\r\n.pt__step:hover .pt__share-thumb,\r\n.pt__step:focus-within .pt__media,\r\n.pt__step:focus-within .pt__share-thumb{\r\n border-color:rgba(95,36,104,.12);\r\n box-shadow:0 20px 48px rgba(43,20,47,.042);\r\n}\r\n\r\n.pt__step:hover,\r\n.pt__step:focus-within{\r\n --pt-passed-blur:0px !important;\r\n --pt-passed-opacity:1 !important;\r\n}\r\n\r\n\/* Mobile segmented spine support; hidden on desktop. *\/\r\n.pt__mobile-spine{\r\n display:none;\r\n}\r\n\r\n\/* =========================================================\r\n STEP TYPOGRAPHY\r\n ========================================================= *\/\r\n\r\n.pt__step-kicker{\r\n display:block;\r\n\r\n color:rgba(95,36,104,.72);\r\n\r\n font-size:clamp(10.5px,.68vw,12px);\r\n line-height:1.2;\r\n font-weight:600;\r\n letter-spacing:.14em;\r\n text-transform:uppercase;\r\n}\r\n\r\n.pt__step-title{\r\n margin:10px 0 0;\r\n\r\n max-width:12.8ch;\r\n\r\n color:var(--pt-aubergine);\r\n\r\n font-family:\"Cormorant Garamond\",Georgia,serif;\r\n font-size:clamp(30px,2.5vw,42px);\r\n line-height:.98;\r\n font-weight:500;\r\n letter-spacing:-.026em;\r\n}\r\n\r\n.pt__step-copy{\r\n margin:13px 0 0;\r\n\r\n max-width:36ch;\r\n\r\n color:rgba(43,20,47,.61);\r\n\r\n font-size:clamp(13.5px,.86vw,15px);\r\n line-height:1.60;\r\n}\r\n\r\n\/* =========================================================\r\n MEDIA \u2014 only where the story needs it\r\n ========================================================= *\/\r\n\r\n.pt__media{\r\n position:relative;\r\n\r\n overflow:hidden;\r\n\r\n margin-top:18px;\r\n\r\n border:\r\n 1px solid rgba(43,20,47,.07);\r\n border-radius:10px;\r\n\r\n background:\r\n linear-gradient(\r\n 145deg,\r\n rgba(232,225,228,.74),\r\n rgba(247,242,234,.94)\r\n );\r\n\r\n box-shadow:\r\n 0 14px 44px rgba(43,20,47,.026);\r\n}\r\n\r\n.pt__media::before{\r\n content:\"\";\r\n\r\n position:absolute;\r\n\r\n inset:11%;\r\n\r\n border:\r\n 1px solid rgba(95,36,104,.085);\r\n}\r\n\r\n.pt__media-caption{\r\n position:absolute;\r\n z-index:2;\r\n\r\n inset-inline-start:12px;\r\n inset-block-end:10px;\r\n\r\n max-width:26ch;\r\n\r\n color:rgba(43,20,47,.40);\r\n\r\n font-size:11px;\r\n line-height:1.40;\r\n font-weight:500;\r\n letter-spacing:.03em;\r\n}\r\n\r\n.pt__share-media{\r\n display:grid;\r\n grid-template-columns:repeat(2,minmax(0,1fr));\r\n gap:8px;\r\n\r\n margin-top:16px;\r\n}\r\n\r\n.pt__share-thumb{\r\n position:relative;\r\n\r\n aspect-ratio:4 \/ 3;\r\n\r\n overflow:hidden;\r\n\r\n border:\r\n 1px solid rgba(43,20,47,.07);\r\n border-radius:9px;\r\n\r\n background:\r\n linear-gradient(\r\n 145deg,\r\n rgba(232,225,228,.78),\r\n rgba(247,242,234,.94)\r\n );\r\n}\r\n\r\n.pt__share-thumb::before{\r\n content:\"\";\r\n\r\n position:absolute;\r\n\r\n inset:14%;\r\n\r\n border:\r\n 1px solid rgba(95,36,104,.08);\r\n}\r\n\r\n.pt__share-label{\r\n position:absolute;\r\n\r\n inset-inline-start:9px;\r\n inset-block-end:8px;\r\n\r\n color:rgba(43,20,47,.42);\r\n\r\n font-size:10px;\r\n line-height:1;\r\n font-weight:600;\r\n letter-spacing:.09em;\r\n text-transform:uppercase;\r\n}\r\n\r\n.pt__plan-media{\r\n min-height:238px;\r\n}\r\n\r\n.pt__visual-media{\r\n min-height:350px;\r\n\r\n background:\r\n linear-gradient(\r\n 145deg,\r\n rgba(197,178,200,.20),\r\n rgba(247,242,234,.72)\r\n );\r\n}\r\n\r\n.pt__visual-media::after{\r\n content:\"\";\r\n\r\n position:absolute;\r\n\r\n inset:\r\n 21%\r\n 18%;\r\n\r\n border:\r\n 1px solid rgba(43,20,47,.075);\r\n}\r\n\r\n\/* Step 03 is the largest visual moment. *\/\r\n.pt__step--visual .pt__step-content{\r\n width:min(100%,620px);\r\n}\r\n\r\n.pt__step--visual .pt__step-title{\r\n max-width:13.5ch;\r\n}\r\n\r\n\/* Step 04 is typography-led. *\/\r\n.pt__step--confirm .pt__step-content{\r\n padding-block:28px;\r\n}\r\n\r\n.pt__step--confirm .pt__step-title{\r\n max-width:12.8ch;\r\n font-size:clamp(32px,2.55vw,44px);\r\n}\r\n\r\n\/* =========================================================\r\n BELOW TREE \u2014 CLARIFICATION \/ CTA\r\n ========================================================= *\/\r\n\r\n.pt__closing{\r\n width:min(100%,1180px);\r\n margin:\r\n clamp(58px,7vh,84px)\r\n auto\r\n 0;\r\n\r\n padding-top:24px;\r\n\r\n border-top:\r\n 1px solid var(--pt-rule);\r\n\r\n display:grid;\r\n grid-template-columns:minmax(0,.68fr) minmax(220px,.32fr);\r\n gap:clamp(32px,5vw,72px);\r\n align-items:start;\r\n}\r\n\r\n.pt__clarification{\r\n margin:0;\r\n\r\n max-width:64ch;\r\n\r\n color:rgba(43,20,47,.56);\r\n\r\n font-size:clamp(12.5px,.78vw,13px);\r\n line-height:1.62;\r\n}\r\n\r\n.pt__cta-wrap{\r\n text-align:end;\r\n}\r\n\r\n.pt__cta{\r\n position:relative;\r\n\r\n display:inline-flex;\r\n align-items:center;\r\n gap:10px;\r\n\r\n min-height:44px;\r\n padding:4px 0;\r\n\r\n color:var(--pt-aubergine);\r\n\r\n font-size:clamp(11px,.74vw,12px);\r\n line-height:1.2;\r\n font-weight:600;\r\n letter-spacing:.10em;\r\n text-transform:uppercase;\r\n text-decoration:none;\r\n}\r\n\r\n.pt__cta::after{\r\n content:\"\";\r\n\r\n position:absolute;\r\n\r\n inset-inline:0;\r\n inset-block-end:2px;\r\n\r\n height:1px;\r\n\r\n background:rgba(95,36,104,.44);\r\n\r\n transform:scaleX(.52);\r\n transform-origin:0 50%;\r\n\r\n transition:\r\n transform .52s var(--pt-ease),\r\n background .36s ease;\r\n}\r\n\r\n[dir=\"rtl\"] .pt__cta::after{\r\n transform-origin:100% 50%;\r\n}\r\n\r\n.pt__cta:hover::after,\r\n.pt__cta:focus-visible::after{\r\n transform:scaleX(1);\r\n background:var(--pt-plum);\r\n}\r\n\r\n.pt__cta:focus-visible{\r\n outline:1px solid rgba(95,36,104,.38);\r\n outline-offset:5px;\r\n}\r\n\r\n\/* =========================================================\r\n PATH SWITCH\r\n Skeleton stays. Only content\/media cross-transition.\r\n ========================================================= *\/\r\n\r\n.pt__dynamic{\r\n transition:\r\n opacity .22s ease,\r\n transform .48s var(--pt-ease),\r\n clip-path .48s var(--pt-ease);\r\n}\r\n\r\n#lamina-treatment-path-tree.is-path-switching .pt__dynamic{\r\n opacity:.12;\r\n transform:translate3d(0,4px,0);\r\n}\r\n\r\n#lamina-treatment-path-tree.is-path-switching .pt__media,\r\n#lamina-treatment-path-tree.is-path-switching .pt__share-media{\r\n clip-path:inset(5% 0 0 0);\r\n}\r\n\r\n\/* =========================================================\r\n DESKTOP SIGNATURE ENTRANCE\r\n The tree draws once. Then complete stillness.\r\n ========================================================= *\/\r\n\r\n\/* Intro *\/\r\n#lamina-treatment-path-tree.has-desktop-entry .pt__eyebrow{\r\n opacity:0;\r\n transform:translate3d(0,10px,0);\r\n --pt-entry-blur:3px;\r\n}\r\n\r\n#lamina-treatment-path-tree.has-desktop-entry .pt__title-line{\r\n opacity:0;\r\n transform:translate3d(0,104%,0);\r\n --pt-entry-blur:4.5px;\r\n}\r\n\r\n#lamina-treatment-path-tree.has-desktop-entry .pt__support,\r\n#lamina-treatment-path-tree.has-desktop-entry .pt__selector-wrap{\r\n opacity:0;\r\n transform:translate3d(0,12px,0);\r\n --pt-entry-blur:4px;\r\n}\r\n\r\n\/* Tree skeleton\/content *\/\r\n#lamina-treatment-path-tree.has-desktop-entry .pt__spine{\r\n opacity:.28;\r\n transform:scaleY(0);\r\n}\r\n\r\n#lamina-treatment-path-tree.has-desktop-entry .pt__spine::after{\r\n opacity:0;\r\n}\r\n\r\n#lamina-treatment-path-tree.has-desktop-entry .pt__branch{\r\n opacity:.25;\r\n transform:scaleX(0);\r\n}\r\n\r\n#lamina-treatment-path-tree.has-desktop-entry .pt__node{\r\n opacity:0;\r\n transform:\r\n translate(-50%,-50%)\r\n scale(.56);\r\n filter:blur(1.2px);\r\n}\r\n\r\n[dir=\"rtl\"] #lamina-treatment-path-tree.has-desktop-entry .pt__node{\r\n transform:\r\n translate(50%,-50%)\r\n scale(.56);\r\n}\r\n\r\n#lamina-treatment-path-tree.has-desktop-entry .pt__step-content{\r\n opacity:0;\r\n transform:translate3d(0,14px,0);\r\n filter:blur(4px);\r\n}\r\n\r\n#lamina-treatment-path-tree.has-desktop-entry .pt__media,\r\n#lamina-treatment-path-tree.has-desktop-entry .pt__share-media{\r\n clip-path:inset(10% 0 10% 0);\r\n opacity:.26;\r\n filter:blur(4.5px);\r\n}\r\n\r\n\/* Intro entrance *\/\r\n#lamina-treatment-path-tree.has-desktop-entry.is-desktop-entered .pt__eyebrow{\r\n opacity:1;\r\n transform:none;\r\n --pt-entry-blur:0px;\r\n\r\n transition:\r\n opacity .50s var(--pt-ease) .03s,\r\n transform .58s var(--pt-ease) .03s,\r\n filter .54s ease .03s;\r\n}\r\n\r\n#lamina-treatment-path-tree.has-desktop-entry.is-desktop-entered .pt__title-line{\r\n opacity:1;\r\n transform:none;\r\n --pt-entry-blur:0px;\r\n\r\n transition:\r\n opacity .70s var(--pt-ease),\r\n transform .86s cubic-bezier(.12,.82,.18,1),\r\n filter .60s ease;\r\n}\r\n\r\n#lamina-treatment-path-tree.has-desktop-entry.is-desktop-entered\r\n.pt__title-mask:nth-child(1) .pt__title-line{\r\n transition-delay:.06s;\r\n}\r\n\r\n#lamina-treatment-path-tree.has-desktop-entry.is-desktop-entered\r\n.pt__title-mask:nth-child(2) .pt__title-line{\r\n transition-delay:.16s;\r\n}\r\n\r\n#lamina-treatment-path-tree.has-desktop-entry.is-desktop-entered .pt__support{\r\n opacity:1;\r\n transform:none;\r\n --pt-entry-blur:0px;\r\n\r\n transition:\r\n opacity .62s var(--pt-ease) .22s,\r\n transform .66s var(--pt-ease) .22s,\r\n filter .62s ease .22s;\r\n}\r\n\r\n#lamina-treatment-path-tree.has-desktop-entry.is-desktop-entered .pt__selector-wrap{\r\n opacity:1;\r\n transform:none;\r\n --pt-entry-blur:0px;\r\n\r\n transition:\r\n opacity .60s var(--pt-ease) .28s,\r\n transform .64s var(--pt-ease) .28s,\r\n filter .58s ease .28s;\r\n}\r\n\r\n\/* Spine *\/\r\n#lamina-treatment-path-tree.has-desktop-entry.is-desktop-entered .pt__spine{\r\n opacity:1;\r\n transform:scaleY(1);\r\n\r\n transition:\r\n transform 1.00s cubic-bezier(.18,.82,.20,1) .36s,\r\n opacity .40s ease .36s;\r\n}\r\n\r\n#lamina-treatment-path-tree.has-desktop-entry.is-desktop-entered .pt__spine::after{\r\n opacity:1;\r\n transition:\r\n opacity .44s ease .72s;\r\n}\r\n\r\n\/* Branch \/ node \/ content timing. *\/\r\n#lamina-treatment-path-tree.has-desktop-entry.is-desktop-entered .pt__step{\r\n --pt-enter-delay:.54s;\r\n}\r\n\r\n#lamina-treatment-path-tree.has-desktop-entry.is-desktop-entered .pt__step:nth-of-type(2){\r\n --pt-enter-delay:.70s;\r\n}\r\n\r\n#lamina-treatment-path-tree.has-desktop-entry.is-desktop-entered .pt__step:nth-of-type(3){\r\n --pt-enter-delay:.86s;\r\n}\r\n\r\n#lamina-treatment-path-tree.has-desktop-entry.is-desktop-entered .pt__step:nth-of-type(4){\r\n --pt-enter-delay:1.02s;\r\n}\r\n\r\n#lamina-treatment-path-tree.has-desktop-entry.is-desktop-entered .pt__branch{\r\n opacity:1;\r\n transform:scaleX(1);\r\n\r\n transition:\r\n transform .46s cubic-bezier(.16,.78,.18,1)\r\n var(--pt-enter-delay),\r\n opacity .34s ease\r\n var(--pt-enter-delay);\r\n}\r\n\r\n#lamina-treatment-path-tree.has-desktop-entry.is-desktop-entered .pt__node{\r\n opacity:1;\r\n transform:\r\n translate(-50%,-50%)\r\n scale(1);\r\n filter:blur(0);\r\n\r\n transition:\r\n opacity .34s ease\r\n calc(var(--pt-enter-delay) + .08s),\r\n transform .42s cubic-bezier(.18,.84,.18,1)\r\n calc(var(--pt-enter-delay) + .08s),\r\n filter .34s ease\r\n calc(var(--pt-enter-delay) + .08s);\r\n}\r\n\r\n[dir=\"rtl\"] #lamina-treatment-path-tree.has-desktop-entry.is-desktop-entered .pt__node{\r\n transform:\r\n translate(50%,-50%)\r\n scale(1);\r\n}\r\n\r\n#lamina-treatment-path-tree.has-desktop-entry.is-desktop-entered .pt__step-content{\r\n opacity:1;\r\n transform:none;\r\n filter:blur(0);\r\n\r\n transition:\r\n opacity .60s var(--pt-ease)\r\n calc(var(--pt-enter-delay) + .14s),\r\n transform .68s var(--pt-ease)\r\n calc(var(--pt-enter-delay) + .14s),\r\n filter .56s ease\r\n calc(var(--pt-enter-delay) + .14s);\r\n}\r\n\r\n#lamina-treatment-path-tree.has-desktop-entry.is-desktop-entered .pt__media,\r\n#lamina-treatment-path-tree.has-desktop-entry.is-desktop-entered .pt__share-media{\r\n clip-path:inset(0);\r\n opacity:1;\r\n filter:blur(0);\r\n\r\n transition:\r\n clip-path .72s var(--pt-ease)\r\n calc(var(--pt-enter-delay) + .18s),\r\n opacity .48s ease\r\n calc(var(--pt-enter-delay) + .18s),\r\n filter .56s ease\r\n calc(var(--pt-enter-delay) + .18s);\r\n}\r\n\r\n\/*\r\n JS removes has-desktop-entry after ~2.25s.\r\n No drift, parallax, pulse or breathing remains.\r\n*\/\r\n\r\n\/* =========================================================\r\n TABLET\r\n ========================================================= *\/\r\n\r\n@media (min-width:768px) and (max-width:1099px){\r\n\r\n .pt__inner{\r\n padding-block:72px 104px;\r\n }\r\n\r\n .pt__intro{\r\n width:min(100%,var(--pt-stage-width));\r\n grid-template-columns:repeat(2,minmax(0,1fr));\r\n gap:0;\r\n align-items:center;\r\n }\r\n\r\n .pt__intro-left{\r\n max-width:500px;\r\n justify-self:center;\r\n }\r\n\r\n .pt__intro-right{\r\n max-width:400px;\r\n justify-self:center;\r\n align-self:center;\r\n padding-inline-start:0;\r\n }\r\n\r\n .pt__tree{\r\n width:min(100%,1040px);\r\n margin-top:58px;\r\n }\r\n\r\n .pt__step{\r\n --pt-branch-length:76px;\r\n grid-template-columns:minmax(0,1fr) 96px minmax(0,1fr);\r\n }\r\n\r\n .pt__step-content{\r\n width:min(100%,420px);\r\n }\r\n\r\n .pt__step--visual .pt__step-content{\r\n width:min(100%,480px);\r\n }\r\n\r\n .pt__plan-media{\r\n min-height:220px;\r\n }\r\n\r\n .pt__visual-media{\r\n min-height:310px;\r\n }\r\n\r\n}\r\n\r\n\/* =========================================================\r\n MOBILE \u2014 SINGLE-SIDED TREATMENT TREE\r\n Spine left, content right, natural page flow.\r\n ========================================================= *\/\r\n\r\n@media (max-width:767px){\r\n\r\n .pt__inner{\r\n padding:\r\n 58px\r\n 20px\r\n 78px;\r\n }\r\n\r\n .pt__intro{\r\n display:block;\r\n width:100%;\r\n }\r\n\r\n .pt__intro-left,\r\n .pt__intro-right{\r\n width:100%;\r\n max-width:none;\r\n justify-self:auto;\r\n }\r\n\r\n .pt__intro-right{\r\n align-self:auto;\r\n padding-inline-start:0;\r\n }\r\n\r\n .pt__eyebrow{\r\n margin-bottom:13px;\r\n font-size:11px;\r\n }\r\n\r\n .pt__title{\r\n max-width:10.6ch;\r\n\r\n font-size:clamp(48px,13.8vw,60px);\r\n line-height:1;\r\n }\r\n\r\n .pt__title-mask{\r\n padding-bottom:.095em;\r\n }\r\n\r\n .pt__title-mask + .pt__title-mask{\r\n margin-top:-.045em;\r\n }\r\n\r\n .pt__title-line{\r\n line-height:.91;\r\n }\r\n\r\n .pt__title-line--accent{\r\n margin-top:.04em;\r\n padding-bottom:.10em;\r\n line-height:.93;\r\n }\r\n\r\n .pt__support{\r\n margin-top:20px;\r\n\r\n max-width:35ch;\r\n\r\n font-size:15px;\r\n line-height:1.66;\r\n }\r\n\r\n .pt__selector-wrap{\r\n justify-content:flex-start;\r\n\r\n margin-top:24px;\r\n }\r\n\r\n .pt__selector{\r\n width:100%;\r\n\r\n justify-content:flex-start;\r\n gap:26px;\r\n\r\n padding-inline:0;\r\n }\r\n\r\n .pt__path{\r\n min-height:44px;\r\n\r\n font-size:11px;\r\n }\r\n\r\n .pt__tree{\r\n width:100%;\r\n margin-top:30px;\r\n\r\n padding-block:0;\r\n }\r\n\r\n \/* Hide full desktop spine. Segments create one continuous mobile spine. *\/\r\n .pt__spine{\r\n display:none;\r\n }\r\n\r\n .pt__step{\r\n --pt-mobile-spine-x:28px;\r\n --pt-mobile-content-x:58px;\r\n --pt-mobile-branch:24px;\r\n\r\n position:relative;\r\n\r\n display:block;\r\n\r\n min-height:0;\r\n\r\n padding-inline-start:var(--pt-mobile-content-x);\r\n padding-block:26px 44px;\r\n }\r\n\r\n .pt__step + .pt__step{\r\n margin-top:0;\r\n }\r\n\r\n .pt__step--visual{\r\n min-height:0;\r\n }\r\n\r\n .pt__step-content,\r\n .pt__step--left .pt__step-content,\r\n .pt__step--right .pt__step-content{\r\n width:100%;\r\n max-width:none;\r\n\r\n padding:0;\r\n\r\n text-align:start;\r\n\r\n justify-self:auto;\r\n }\r\n\r\n \/* Continuous segmented mobile spine. *\/\r\n .pt__mobile-spine{\r\n position:absolute;\r\n z-index:1;\r\n\r\n display:block;\r\n\r\n inset-inline-start:var(--pt-mobile-spine-x);\r\n inset-block-start:0;\r\n\r\n width:1px;\r\n height:100%;\r\n\r\n background:var(--pt-line);\r\n\r\n transform-origin:50% 0;\r\n }\r\n\r\n .pt__step:first-of-type .pt__mobile-spine{\r\n inset-block-start:50%;\r\n height:50%;\r\n }\r\n\r\n .pt__step:last-of-type .pt__mobile-spine{\r\n height:50%;\r\n }\r\n\r\n .pt__branch,\r\n .pt__step--left .pt__branch,\r\n .pt__step--right .pt__branch{\r\n inset-inline-start:var(--pt-mobile-spine-x);\r\n inset-inline-end:auto;\r\n\r\n inset-block-start:50%;\r\n\r\n width:var(--pt-mobile-branch);\r\n\r\n transform-origin:0 50%;\r\n }\r\n\r\n .pt__node,\r\n [dir=\"rtl\"] .pt__node{\r\n inset-inline-start:var(--pt-mobile-spine-x);\r\n inset-block-start:50%;\r\n\r\n transform:\r\n translate(-50%,-50%);\r\n }\r\n\r\n [dir=\"rtl\"] .pt__node{\r\n transform:\r\n translate(50%,-50%);\r\n }\r\n\r\n .pt__step-kicker{\r\n font-size:10.5px;\r\n }\r\n\r\n .pt__step-title,\r\n .pt__step--confirm .pt__step-title{\r\n max-width:14ch;\r\n\r\n font-size:clamp(29px,8.8vw,38px);\r\n line-height:.98;\r\n }\r\n\r\n .pt__step-copy{\r\n max-width:34ch;\r\n\r\n font-size:14.5px;\r\n line-height:1.58;\r\n }\r\n\r\n .pt__share-media{\r\n gap:8px;\r\n margin-top:15px;\r\n }\r\n\r\n .pt__plan-media{\r\n min-height:250px;\r\n }\r\n\r\n .pt__visual-media{\r\n min-height:330px;\r\n }\r\n\r\n .pt__step--visual .pt__step-content{\r\n width:100%;\r\n }\r\n\r\n .pt__step--confirm .pt__step-content{\r\n padding-block:0;\r\n }\r\n\r\n .pt__closing{\r\n display:block;\r\n\r\n margin-top:34px;\r\n padding-top:20px;\r\n }\r\n\r\n .pt__clarification{\r\n max-width:36ch;\r\n\r\n font-size:12.5px;\r\n line-height:1.56;\r\n }\r\n\r\n .pt__cta-wrap{\r\n margin-top:18px;\r\n\r\n text-align:start;\r\n }\r\n\r\n .pt__cta{\r\n min-height:44px;\r\n\r\n font-size:11px;\r\n }\r\n\r\n \/* Mobile intro prep. *\/\r\n #lamina-treatment-path-tree.has-mobile-entry .pt__eyebrow{\r\n opacity:0;\r\n transform:translate3d(0,7px,0);\r\n }\r\n\r\n #lamina-treatment-path-tree.has-mobile-entry .pt__title-line{\r\n opacity:.24;\r\n transform:translate3d(0,88%,0);\r\n --pt-entry-blur:.5px;\r\n }\r\n\r\n #lamina-treatment-path-tree.has-mobile-entry .pt__support,\r\n #lamina-treatment-path-tree.has-mobile-entry .pt__selector-wrap{\r\n opacity:0;\r\n transform:translate3d(0,7px,0);\r\n }\r\n\r\n #lamina-treatment-path-tree.has-mobile-entry.is-mobile-intro-entered .pt__eyebrow,\r\n #lamina-treatment-path-tree.has-mobile-entry.is-mobile-intro-entered .pt__support,\r\n #lamina-treatment-path-tree.has-mobile-entry.is-mobile-intro-entered .pt__selector-wrap{\r\n opacity:1;\r\n transform:none;\r\n\r\n transition:\r\n opacity .52s var(--pt-ease),\r\n transform .52s var(--pt-ease);\r\n }\r\n\r\n #lamina-treatment-path-tree.has-mobile-entry.is-mobile-intro-entered .pt__support{\r\n transition-delay:.14s;\r\n }\r\n\r\n #lamina-treatment-path-tree.has-mobile-entry.is-mobile-intro-entered .pt__selector-wrap{\r\n transition-delay:.22s;\r\n }\r\n\r\n #lamina-treatment-path-tree.has-mobile-entry.is-mobile-intro-entered .pt__title-line{\r\n opacity:1;\r\n transform:none;\r\n --pt-entry-blur:0px;\r\n\r\n transition:\r\n opacity .58s var(--pt-ease),\r\n transform .64s var(--pt-ease),\r\n filter .38s ease;\r\n }\r\n\r\n #lamina-treatment-path-tree.has-mobile-entry.is-mobile-intro-entered\r\n .pt__title-mask:nth-child(1) .pt__title-line{\r\n transition-delay:.04s;\r\n }\r\n\r\n #lamina-treatment-path-tree.has-mobile-entry.is-mobile-intro-entered\r\n .pt__title-mask:nth-child(2) .pt__title-line{\r\n transition-delay:.12s;\r\n }\r\n\r\n \/* Per-step mobile prep. *\/\r\n #lamina-treatment-path-tree.has-mobile-entry .pt__step[data-mobile-ready=\"false\"] .pt__mobile-spine{\r\n transform:scaleY(0);\r\n }\r\n\r\n #lamina-treatment-path-tree.has-mobile-entry .pt__step[data-mobile-ready=\"false\"] .pt__branch{\r\n transform:scaleX(0);\r\n }\r\n\r\n #lamina-treatment-path-tree.has-mobile-entry .pt__step[data-mobile-ready=\"false\"] .pt__node{\r\n opacity:0;\r\n transform:\r\n translate(-50%,-50%)\r\n scale(.65);\r\n }\r\n\r\n [dir=\"rtl\"] #lamina-treatment-path-tree.has-mobile-entry .pt__step[data-mobile-ready=\"false\"] .pt__node{\r\n transform:\r\n translate(50%,-50%)\r\n scale(.65);\r\n }\r\n\r\n #lamina-treatment-path-tree.has-mobile-entry .pt__step[data-mobile-ready=\"false\"] .pt__step-content{\r\n opacity:.10;\r\n transform:translate3d(0,10px,0);\r\n }\r\n\r\n #lamina-treatment-path-tree.has-mobile-entry .pt__step[data-mobile-ready=\"false\"] .pt__media,\r\n #lamina-treatment-path-tree.has-mobile-entry .pt__step[data-mobile-ready=\"false\"] .pt__share-media{\r\n opacity:.30;\r\n clip-path:inset(7% 0 7% 0);\r\n }\r\n\r\n #lamina-treatment-path-tree.has-mobile-entry .pt__step[data-mobile-ready=\"true\"] .pt__mobile-spine{\r\n transform:scaleY(1);\r\n\r\n transition:\r\n transform .52s var(--pt-ease);\r\n }\r\n\r\n #lamina-treatment-path-tree.has-mobile-entry .pt__step[data-mobile-ready=\"true\"] .pt__branch{\r\n transform:scaleX(1);\r\n\r\n transition:\r\n transform .36s var(--pt-ease) .08s;\r\n }\r\n\r\n #lamina-treatment-path-tree.has-mobile-entry .pt__step[data-mobile-ready=\"true\"] .pt__node{\r\n opacity:1;\r\n transform:\r\n translate(-50%,-50%)\r\n scale(1);\r\n\r\n transition:\r\n opacity .30s ease .14s,\r\n transform .34s var(--pt-ease) .14s;\r\n }\r\n\r\n [dir=\"rtl\"] #lamina-treatment-path-tree.has-mobile-entry .pt__step[data-mobile-ready=\"true\"] .pt__node{\r\n transform:\r\n translate(50%,-50%)\r\n scale(1);\r\n }\r\n\r\n #lamina-treatment-path-tree.has-mobile-entry .pt__step[data-mobile-ready=\"true\"] .pt__step-content{\r\n opacity:1;\r\n transform:none;\r\n\r\n transition:\r\n opacity .48s var(--pt-ease) .18s,\r\n transform .52s var(--pt-ease) .18s;\r\n }\r\n\r\n #lamina-treatment-path-tree.has-mobile-entry .pt__step[data-mobile-ready=\"true\"] .pt__media,\r\n #lamina-treatment-path-tree.has-mobile-entry .pt__step[data-mobile-ready=\"true\"] .pt__share-media{\r\n opacity:1;\r\n clip-path:inset(0);\r\n\r\n transition:\r\n opacity .44s ease .22s,\r\n clip-path .52s var(--pt-ease) .22s;\r\n }\r\n\r\n}\r\n\r\n\/* =========================================================\r\n SHORT LANDSCAPE MOBILE\r\n ========================================================= *\/\r\n\r\n@media (max-width:767px) and (orientation:landscape) and (max-height:520px){\r\n\r\n .pt__inner{\r\n padding-block:46px 62px;\r\n }\r\n\r\n .pt__title{\r\n font-size:44px;\r\n max-width:9ch;\r\n }\r\n\r\n .pt__support{\r\n font-size:14px;\r\n }\r\n\r\n .pt__step{\r\n padding-block:22px 34px;\r\n }\r\n\r\n .pt__visual-media{\r\n min-height:240px;\r\n }\r\n\r\n}\r\n\r\n\/* =========================================================\r\n LAMINA PASSED-CONTENT DEPTH\r\n\r\n Current and upcoming content stays sharp.\r\n Only content that has been scrolled past \/ moved above the reading\r\n zone receives a small amount of distance-based blur.\r\n\r\n Scrolling back automatically removes that blur because the effect\r\n is calculated from current viewport geometry, not scroll direction.\r\n ========================================================= *\/\r\n\r\n#lamina-treatment-path-tree [data-exit-layer]{\r\n --pt-entry-blur:0px;\r\n --pt-passed-blur:0px;\r\n --pt-passed-opacity:1;\r\n\r\n filter:\r\n blur(\r\n calc(\r\n var(--pt-entry-blur) +\r\n var(--pt-passed-blur)\r\n )\r\n );\r\n\r\n opacity:var(--pt-passed-opacity);\r\n\r\n will-change:filter, opacity;\r\n}\r\n\r\n#lamina-treatment-path-tree [data-exit-layer]:hover,\r\n#lamina-treatment-path-tree [data-exit-layer]:focus-within{\r\n --pt-passed-blur:0px !important;\r\n --pt-passed-opacity:1 !important;\r\n}\r\n\r\n#lamina-treatment-path-tree .pt__step:focus-within .pt__step-content,\r\n#lamina-treatment-path-tree .pt__step:focus-within .pt__media,\r\n#lamina-treatment-path-tree .pt__step:focus-within .pt__share-media{\r\n filter:none !important;\r\n opacity:1 !important;\r\n}\r\n\r\n\/* =========================================================\r\n REDUCED MOTION\r\n ========================================================= *\/\r\n\r\n@media (prefers-reduced-motion:reduce){\r\n\r\n #lamina-treatment-path-tree.has-desktop-entry .pt__eyebrow,\r\n #lamina-treatment-path-tree.has-desktop-entry .pt__title-line,\r\n #lamina-treatment-path-tree.has-desktop-entry .pt__support,\r\n #lamina-treatment-path-tree.has-desktop-entry .pt__selector-wrap,\r\n #lamina-treatment-path-tree.has-desktop-entry .pt__step-content,\r\n #lamina-treatment-path-tree.has-mobile-entry .pt__eyebrow,\r\n #lamina-treatment-path-tree.has-mobile-entry .pt__title-line,\r\n #lamina-treatment-path-tree.has-mobile-entry .pt__support,\r\n #lamina-treatment-path-tree.has-mobile-entry .pt__selector-wrap,\r\n #lamina-treatment-path-tree.has-mobile-entry .pt__step-content{\r\n opacity:1 !important;\r\n transform:none !important;\r\n filter:none !important;\r\n transition:none !important;\r\n }\r\n\r\n #lamina-treatment-path-tree.has-desktop-entry .pt__spine,\r\n #lamina-treatment-path-tree.has-desktop-entry .pt__branch,\r\n #lamina-treatment-path-tree.has-mobile-entry .pt__mobile-spine,\r\n #lamina-treatment-path-tree.has-mobile-entry .pt__branch{\r\n transform:none !important;\r\n transition:none !important;\r\n }\r\n\r\n #lamina-treatment-path-tree .pt__spine::after{\r\n transform:scaleY(1) !important;\r\n transition:none !important;\r\n }\r\n\r\n #lamina-treatment-path-tree.has-desktop-entry .pt__node,\r\n #lamina-treatment-path-tree.has-mobile-entry .pt__node,\r\n [dir=\"rtl\"] #lamina-treatment-path-tree.has-desktop-entry .pt__node,\r\n [dir=\"rtl\"] #lamina-treatment-path-tree.has-mobile-entry .pt__node{\r\n opacity:1 !important;\r\n transform:translate(-50%,-50%) !important;\r\n transition:none !important;\r\n }\r\n\r\n [dir=\"rtl\"] #lamina-treatment-path-tree.has-desktop-entry .pt__node,\r\n [dir=\"rtl\"] #lamina-treatment-path-tree.has-mobile-entry .pt__node{\r\n transform:translate(50%,-50%) !important;\r\n }\r\n\r\n #lamina-treatment-path-tree.has-desktop-entry .pt__media,\r\n #lamina-treatment-path-tree.has-desktop-entry .pt__share-media,\r\n #lamina-treatment-path-tree.has-mobile-entry .pt__media,\r\n #lamina-treatment-path-tree.has-mobile-entry .pt__share-media{\r\n opacity:1 !important;\r\n clip-path:none !important;\r\n transition:none !important;\r\n }\r\n\r\n #lamina-treatment-path-tree .pt__dynamic{\r\n transition:none !important;\r\n }\r\n\r\n #lamina-treatment-path-tree [data-exit-layer]{\r\n --pt-entry-blur:0px !important;\r\n --pt-passed-blur:0px !important;\r\n --pt-passed-opacity:1 !important;\r\n\r\n filter:none !important;\r\n opacity:1 !important;\r\n }\r\n\r\n}\r\n<\/style>\r\n\r\n\r\n<section\r\n id=\"lamina-treatment-path-tree\"\r\n aria-labelledby=\"lamina-treatment-path-tree-title\"\r\n data-lamina-focus-section\r\n>\r\n\r\n <div class=\"pt__inner\">\r\n\r\n\r\n <!-- =================================================\r\n INTRO\r\n ================================================= -->\r\n\r\n <div class=\"pt__intro\">\r\n\r\n <div class=\"pt__intro-left\">\r\n\r\n <p\r\n class=\"pt__eyebrow\"\r\n data-exit-layer=\"eyebrow\"\r\n >\r\n 06 \u2014 TREATMENT PLANNING\r\n <\/p>\r\n\r\n <h2\r\n class=\"pt__title\"\r\n id=\"lamina-treatment-path-tree-title\"\r\n >\r\n\r\n <span class=\"pt__title-mask\">\r\n <span\r\n class=\"pt__title-line\"\r\n data-exit-layer=\"headline\"\r\n >\r\n See the plan\r\n <\/span>\r\n <\/span>\r\n\r\n <span class=\"pt__title-mask\">\r\n <span\r\n class=\"pt__title-line pt__title-line--accent\"\r\n data-exit-layer=\"headline\"\r\n >\r\n before treatment begins.\r\n <\/span>\r\n <\/span>\r\n\r\n <\/h2>\r\n\r\n <\/div>\r\n\r\n\r\n <div class=\"pt__intro-right\">\r\n\r\n <p\r\n class=\"pt__support\"\r\n data-exit-layer=\"copy\"\r\n >\r\n Your first assessment can begin before you travel. Share the relevant information, photos or X-rays, receive a personalised preliminary plan and, for suitable dental cases, explore digital treatment visualisation before your final clinical examination.\r\n <\/p>\r\n\r\n <\/div>\r\n\r\n <\/div>\r\n\r\n\r\n <!-- =================================================\r\n PATH SELECTOR\r\n ================================================= -->\r\n\r\n <div\r\n class=\"pt__selector-wrap\"\r\n data-exit-layer=\"ui\"\r\n >\r\n\r\n <div\r\n class=\"pt__selector\"\r\n role=\"group\"\r\n aria-label=\"Choose treatment planning pathway\"\r\n >\r\n\r\n <button\r\n class=\"pt__path\"\r\n type=\"button\"\r\n data-path=\"dental\"\r\n aria-pressed=\"true\"\r\n >\r\n Dental\r\n <\/button>\r\n\r\n <button\r\n class=\"pt__path\"\r\n type=\"button\"\r\n data-path=\"hair\"\r\n aria-pressed=\"false\"\r\n >\r\n Hair Restoration\r\n <\/button>\r\n\r\n <\/div>\r\n\r\n <\/div>\r\n\r\n\r\n <!-- =================================================\r\n TREATMENT PATH TREE\r\n ================================================= -->\r\n\r\n <div\r\n class=\"pt__tree\"\r\n aria-live=\"polite\"\r\n >\r\n\r\n <div\r\n class=\"pt__spine\"\r\n aria-hidden=\"true\"\r\n ><\/div>\r\n\r\n\r\n <!-- STEP 01 -->\r\n\r\n <article\r\n class=\"pt__step pt__step--left\"\r\n data-step=\"1\"\r\n data-exit-layer=\"step\"\r\n >\r\n\r\n <span\r\n class=\"pt__mobile-spine\"\r\n aria-hidden=\"true\"\r\n ><\/span>\r\n\r\n <span\r\n class=\"pt__branch\"\r\n aria-hidden=\"true\"\r\n ><\/span>\r\n\r\n <span\r\n class=\"pt__node\"\r\n aria-hidden=\"true\"\r\n ><\/span>\r\n\r\n\r\n <div class=\"pt__step-content\">\r\n\r\n <div class=\"pt__dynamic\">\r\n\r\n <span class=\"pt__step-kicker\">\r\n 01 \u2014 SHARE YOUR CASE\r\n <\/span>\r\n\r\n <h3\r\n class=\"pt__step-title\"\r\n data-bind=\"step1Title\"\r\n >\r\n Begin with relevant information.\r\n <\/h3>\r\n\r\n <p\r\n class=\"pt__step-copy\"\r\n data-bind=\"step1Copy\"\r\n >\r\n Relevant photos and\/or existing X-rays can help begin the preliminary assessment.\r\n <\/p>\r\n\r\n <\/div>\r\n\r\n\r\n <div\r\n class=\"pt__share-media pt__dynamic\"\r\n aria-hidden=\"true\"\r\n >\r\n\r\n <div class=\"pt__share-thumb\">\r\n <span\r\n class=\"pt__share-label\"\r\n data-bind=\"step1MediaA\"\r\n >\r\n Photo\r\n <\/span>\r\n <\/div>\r\n\r\n <div class=\"pt__share-thumb\">\r\n <span\r\n class=\"pt__share-label\"\r\n data-bind=\"step1MediaB\"\r\n >\r\n X-ray\r\n <\/span>\r\n <\/div>\r\n\r\n <\/div>\r\n\r\n <\/div>\r\n\r\n <\/article>\r\n\r\n\r\n <!-- STEP 02 -->\r\n\r\n <article\r\n class=\"pt__step pt__step--right\"\r\n data-step=\"2\"\r\n data-exit-layer=\"step\"\r\n >\r\n\r\n <span\r\n class=\"pt__mobile-spine\"\r\n aria-hidden=\"true\"\r\n ><\/span>\r\n\r\n <span\r\n class=\"pt__branch\"\r\n aria-hidden=\"true\"\r\n ><\/span>\r\n\r\n <span\r\n class=\"pt__node\"\r\n aria-hidden=\"true\"\r\n ><\/span>\r\n\r\n\r\n <div class=\"pt__step-content\">\r\n\r\n <div class=\"pt__dynamic\">\r\n\r\n <span\r\n class=\"pt__step-kicker\"\r\n data-bind=\"step2Kicker\"\r\n >\r\n 02 \u2014 PRELIMINARY PLAN\r\n <\/span>\r\n\r\n <h3\r\n class=\"pt__step-title\"\r\n data-bind=\"step2Title\"\r\n >\r\n Turn information into a proposed direction.\r\n <\/h3>\r\n\r\n <p\r\n class=\"pt__step-copy\"\r\n data-bind=\"step2Copy\"\r\n >\r\n The case is reviewed and a personalised preliminary treatment plan can be prepared.\r\n <\/p>\r\n\r\n <\/div>\r\n\r\n\r\n <div\r\n class=\"pt__media pt__plan-media pt__dynamic\"\r\n aria-hidden=\"true\"\r\n >\r\n\r\n <span\r\n class=\"pt__media-caption\"\r\n data-bind=\"step2Media\"\r\n >\r\n Treatment-plan visual \u2014 replace with approved Lamina asset.\r\n <\/span>\r\n\r\n <\/div>\r\n\r\n <\/div>\r\n\r\n <\/article>\r\n\r\n\r\n <!-- STEP 03 -->\r\n\r\n <article\r\n class=\"pt__step pt__step--left pt__step--visual\"\r\n data-step=\"3\"\r\n data-exit-layer=\"step\"\r\n >\r\n\r\n <span\r\n class=\"pt__mobile-spine\"\r\n aria-hidden=\"true\"\r\n ><\/span>\r\n\r\n <span\r\n class=\"pt__branch\"\r\n aria-hidden=\"true\"\r\n ><\/span>\r\n\r\n <span\r\n class=\"pt__node\"\r\n aria-hidden=\"true\"\r\n ><\/span>\r\n\r\n\r\n <div class=\"pt__step-content\">\r\n\r\n <div class=\"pt__dynamic\">\r\n\r\n <span\r\n class=\"pt__step-kicker\"\r\n data-bind=\"step3Kicker\"\r\n >\r\n 03 \u2014 VISUALISE\r\n <\/span>\r\n\r\n <h3\r\n class=\"pt__step-title\"\r\n data-bind=\"step3Title\"\r\n >\r\n Understand the proposed treatment.\r\n <\/h3>\r\n\r\n <p\r\n class=\"pt__step-copy\"\r\n data-bind=\"step3Copy\"\r\n >\r\n Where appropriate, digital \/ 3D treatment visualisation can help explain the proposed dental treatment.\r\n <\/p>\r\n\r\n <\/div>\r\n\r\n\r\n <div\r\n class=\"pt__media pt__visual-media pt__dynamic\"\r\n aria-hidden=\"true\"\r\n >\r\n\r\n <span\r\n class=\"pt__media-caption\"\r\n data-bind=\"step3Media\"\r\n >\r\n 3D visualisation \u2014 replace with approved Lamina media.\r\n <\/span>\r\n\r\n <\/div>\r\n\r\n <\/div>\r\n\r\n <\/article>\r\n\r\n\r\n <!-- STEP 04 -->\r\n\r\n <article\r\n class=\"pt__step pt__step--right pt__step--confirm\"\r\n data-step=\"4\"\r\n data-exit-layer=\"step\"\r\n >\r\n\r\n <span\r\n class=\"pt__mobile-spine\"\r\n aria-hidden=\"true\"\r\n ><\/span>\r\n\r\n <span\r\n class=\"pt__branch\"\r\n aria-hidden=\"true\"\r\n ><\/span>\r\n\r\n <span\r\n class=\"pt__node\"\r\n aria-hidden=\"true\"\r\n ><\/span>\r\n\r\n\r\n <div class=\"pt__step-content\">\r\n\r\n <div class=\"pt__dynamic\">\r\n\r\n <span class=\"pt__step-kicker\">\r\n 04 \u2014 IN-CLINIC CONFIRMATION\r\n <\/span>\r\n\r\n <h3\r\n class=\"pt__step-title\"\r\n data-bind=\"step4Title\"\r\n >\r\n Final confirmation happens in person.\r\n <\/h3>\r\n\r\n <p\r\n class=\"pt__step-copy\"\r\n data-bind=\"step4Copy\"\r\n >\r\n Your treatment plan is confirmed following the necessary clinical examination and updated diagnostics where required.\r\n <\/p>\r\n\r\n <\/div>\r\n\r\n <\/div>\r\n\r\n <\/article>\r\n\r\n <\/div>\r\n\r\n\r\n <!-- =================================================\r\n CLINICAL CLARIFICATION \/ CTA\r\n ================================================= -->\r\n\r\n <div class=\"pt__closing\">\r\n\r\n <p\r\n class=\"pt__clarification\"\r\n data-exit-layer=\"copy\"\r\n >\r\n Preliminary planning does not replace the required in-clinic examination. Your final treatment plan is confirmed by the clinical team after the appropriate assessment.\r\n <\/p>\r\n\r\n <div\r\n class=\"pt__cta-wrap\"\r\n data-exit-layer=\"ui\"\r\n >\r\n\r\n <a\r\n class=\"pt__cta\"\r\n href=\"#start-your-assessment\"\r\n >\r\n Start your assessment\r\n <span aria-hidden=\"true\">\u2192<\/span>\r\n <\/a>\r\n\r\n <\/div>\r\n\r\n <\/div>\r\n\r\n <\/div>\r\n\r\n<\/section>\r\n\r\n\r\n<script>\r\n(() => {\r\n\r\n const root =\r\n document.getElementById(\r\n 'lamina-treatment-path-tree'\r\n );\r\n\r\n\r\n if (\r\n !root ||\r\n root.dataset.pathTreeReady ===\r\n 'true'\r\n ) return;\r\n\r\n\r\n root.dataset.pathTreeReady =\r\n 'true';\r\n\r\n\r\n const desktopQuery =\r\n window.matchMedia(\r\n '(min-width:768px)'\r\n );\r\n\r\n\r\n const mobileQuery =\r\n window.matchMedia(\r\n '(max-width:767px)'\r\n );\r\n\r\n\r\n const reducedMotion =\r\n window.matchMedia(\r\n '(prefers-reduced-motion: reduce)'\r\n );\r\n\r\n\r\n const pathButtons =\r\n [\r\n ...root.querySelectorAll(\r\n '[data-path]'\r\n )\r\n ];\r\n\r\n\r\n const bindTargets =\r\n [\r\n ...root.querySelectorAll(\r\n '[data-bind]'\r\n )\r\n ];\r\n\r\n\r\n const steps =\r\n [\r\n ...root.querySelectorAll(\r\n '[data-step]'\r\n )\r\n ];\r\n\r\n\r\n const tree =\r\n root.querySelector(\r\n '.pt__tree'\r\n );\r\n\r\n\r\n const spine =\r\n root.querySelector(\r\n '.pt__spine'\r\n );\r\n\r\n\r\n function clamp(\r\n value,\r\n min,\r\n max\r\n ){\r\n\r\n return Math.min(\r\n max,\r\n Math.max(\r\n min,\r\n value\r\n )\r\n );\r\n\r\n }\r\n\r\n\r\n let spineTicking =\r\n false;\r\n\r\n\r\n function updateSpineFill(){\r\n\r\n spineTicking =\r\n false;\r\n\r\n\r\n if (\r\n !tree ||\r\n !spine\r\n ) return;\r\n\r\n\r\n if (\r\n !desktopQuery.matches\r\n ){\r\n\r\n spine.style.setProperty(\r\n '--pt-spine-progress',\r\n '1'\r\n );\r\n\r\n\r\n return;\r\n\r\n }\r\n\r\n\r\n const rect =\r\n tree.getBoundingClientRect();\r\n\r\n\r\n const vh =\r\n Math.max(\r\n 1,\r\n window.innerHeight ||\r\n document.documentElement.clientHeight\r\n );\r\n\r\n\r\n \/*\r\n Loading-like fill:\r\n starts once the tree moves meaningfully into view\r\n and completes close to the end of the tree journey.\r\n *\/\r\n const startLine =\r\n vh * 0.78;\r\n\r\n\r\n const totalDistance =\r\n rect.height +\r\n vh * 0.14;\r\n\r\n\r\n const travelled =\r\n startLine -\r\n rect.top;\r\n\r\n\r\n const progress =\r\n clamp(\r\n travelled \/\r\n Math.max(\r\n 1,\r\n totalDistance\r\n ),\r\n 0,\r\n 1\r\n );\r\n\r\n\r\n spine.style.setProperty(\r\n '--pt-spine-progress',\r\n progress.toFixed(\r\n 4\r\n )\r\n );\r\n\r\n }\r\n\r\n\r\n function requestSpineFillUpdate(){\r\n\r\n if (\r\n spineTicking\r\n ) return;\r\n\r\n\r\n spineTicking =\r\n true;\r\n\r\n\r\n requestAnimationFrame(\r\n updateSpineFill\r\n );\r\n\r\n }\r\n\r\n\r\n \/* =======================================================\r\n CONTENT MODEL\r\n Tree skeleton never changes.\r\n ======================================================= *\/\r\n\r\n const pathData =\r\n {\r\n\r\n dental:{\r\n step1Title:\r\n 'Begin with relevant information.',\r\n\r\n step1Copy:\r\n 'Relevant photos and\/or existing X-rays can help begin the preliminary assessment.',\r\n\r\n step1MediaA:\r\n 'Photo',\r\n\r\n step1MediaB:\r\n 'X-ray',\r\n\r\n step2Kicker:\r\n '02 \u2014 PRELIMINARY PLAN',\r\n\r\n step2Title:\r\n 'Turn information into a proposed direction.',\r\n\r\n step2Copy:\r\n 'The case is reviewed and a personalised preliminary treatment plan can be prepared.',\r\n\r\n step2Media:\r\n 'Treatment-plan visual \u2014 replace with approved Lamina asset.',\r\n\r\n step3Kicker:\r\n '03 \u2014 VISUALISE',\r\n\r\n step3Title:\r\n 'Understand the proposed treatment.',\r\n\r\n step3Copy:\r\n 'Where appropriate, digital \/ 3D treatment visualisation can help explain the proposed dental treatment.',\r\n\r\n step3Media:\r\n '3D visualisation \u2014 replace with approved Lamina media.',\r\n\r\n step4Title:\r\n 'Final confirmation happens in person.',\r\n\r\n step4Copy:\r\n 'Your treatment plan is confirmed following the necessary clinical examination and updated diagnostics where required.'\r\n },\r\n\r\n\r\n hair:{\r\n step1Title:\r\n 'Start with the right views.',\r\n\r\n step1Copy:\r\n 'Relevant photographs and treatment information can help the clinical team begin understanding your case before travel.',\r\n\r\n step1MediaA:\r\n 'Scalp view',\r\n\r\n step1MediaB:\r\n 'Hair view',\r\n\r\n step2Kicker:\r\n '02 \u2014 CASE REVIEW',\r\n\r\n step2Title:\r\n 'Understand the starting point.',\r\n\r\n step2Copy:\r\n 'The supplied information is reviewed to better understand your concerns and treatment goals.',\r\n\r\n step2Media:\r\n 'Case-review material \u2014 replace with approved Lamina asset.',\r\n\r\n step3Kicker:\r\n '03 \u2014 PRELIMINARY DIRECTION',\r\n\r\n step3Title:\r\n 'Shape the treatment direction.',\r\n\r\n step3Copy:\r\n 'A preliminary treatment direction can be discussed before you arrive.',\r\n\r\n step3Media:\r\n 'Hair planning \/ consultation media \u2014 replace with approved Lamina asset.',\r\n\r\n step4Title:\r\n 'Final planning happens in person.',\r\n\r\n step4Copy:\r\n 'The final treatment plan and design are confirmed following the required face-to-face clinical assessment.'\r\n }\r\n\r\n };\r\n\r\n\r\n let activePath =\r\n 'dental';\r\n\r\n\r\n let switchToken =\r\n 0;\r\n\r\n\r\n let switchTimerA =\r\n null;\r\n\r\n\r\n let switchTimerB =\r\n null;\r\n\r\n\r\n function setBoundContent(\r\n data\r\n ){\r\n\r\n bindTargets.forEach(\r\n target => {\r\n\r\n const key =\r\n target.dataset.bind;\r\n\r\n\r\n if (\r\n !(key in data)\r\n ) return;\r\n\r\n\r\n target.textContent =\r\n data[\r\n key\r\n ];\r\n\r\n }\r\n );\r\n\r\n }\r\n\r\n\r\n function setPath(\r\n nextPath\r\n ){\r\n\r\n if (\r\n !pathData[\r\n nextPath\r\n ] ||\r\n nextPath ===\r\n activePath\r\n ) return;\r\n\r\n\r\n activePath =\r\n nextPath;\r\n\r\n\r\n const token =\r\n ++switchToken;\r\n\r\n\r\n pathButtons.forEach(\r\n button => {\r\n\r\n button.setAttribute(\r\n 'aria-pressed',\r\n button.dataset.path ===\r\n activePath\r\n ? 'true'\r\n : 'false'\r\n );\r\n\r\n }\r\n );\r\n\r\n\r\n window.clearTimeout(\r\n switchTimerA\r\n );\r\n\r\n\r\n window.clearTimeout(\r\n switchTimerB\r\n );\r\n\r\n\r\n if (\r\n reducedMotion.matches\r\n ){\r\n\r\n root.classList.remove(\r\n 'is-path-switching'\r\n );\r\n\r\n\r\n setBoundContent(\r\n pathData[\r\n activePath\r\n ]\r\n );\r\n\r\n\r\n return;\r\n\r\n }\r\n\r\n\r\n \/*\r\n Skeleton remains fully assembled.\r\n Only content\/media transition.\r\n Current page position is untouched.\r\n Latest selection wins.\r\n *\/\r\n root.classList.add(\r\n 'is-path-switching'\r\n );\r\n\r\n\r\n switchTimerA =\r\n window.setTimeout(\r\n () => {\r\n\r\n if (\r\n token !==\r\n switchToken\r\n ) return;\r\n\r\n\r\n setBoundContent(\r\n pathData[\r\n activePath\r\n ]\r\n );\r\n\r\n\r\n root.classList.remove(\r\n 'is-path-switching'\r\n );\r\n\r\n },\r\n 145\r\n );\r\n\r\n\r\n switchTimerB =\r\n window.setTimeout(\r\n () => {\r\n\r\n if (\r\n token !==\r\n switchToken\r\n ) return;\r\n\r\n\r\n root.classList.remove(\r\n 'is-path-switching'\r\n );\r\n\r\n },\r\n 560\r\n );\r\n\r\n }\r\n\r\n\r\n pathButtons.forEach(\r\n button => {\r\n\r\n button.addEventListener(\r\n 'click',\r\n () => {\r\n\r\n setPath(\r\n button.dataset.path\r\n );\r\n\r\n }\r\n );\r\n\r\n }\r\n );\r\n\r\n\r\n \/* =======================================================\r\n DESKTOP \/ TABLET TREE ENTRANCE\r\n Plays once per page load.\r\n ======================================================= *\/\r\n\r\n let desktopEntrancePlayed =\r\n false;\r\n\r\n\r\n let desktopEntranceObserver =\r\n null;\r\n\r\n\r\n let desktopCleanupTimer =\r\n null;\r\n\r\n\r\n function cleanupDesktopEntrance(){\r\n\r\n window.clearTimeout(\r\n desktopCleanupTimer\r\n );\r\n\r\n\r\n desktopCleanupTimer =\r\n window.setTimeout(\r\n () => {\r\n\r\n \/*\r\n Remove all entrance-prep styles after completion.\r\n Tree becomes completely still.\r\n *\/\r\n root.classList.remove(\r\n 'has-desktop-entry'\r\n );\r\n\r\n },\r\n 2440\r\n );\r\n\r\n }\r\n\r\n\r\n function initDesktopEntrance(){\r\n\r\n desktopEntranceObserver?.disconnect();\r\n\r\n\r\n desktopEntranceObserver =\r\n null;\r\n\r\n\r\n if (\r\n !desktopQuery.matches ||\r\n reducedMotion.matches ||\r\n desktopEntrancePlayed ||\r\n !(\r\n 'IntersectionObserver' in window\r\n )\r\n ){\r\n\r\n return;\r\n\r\n }\r\n\r\n\r\n root.classList.add(\r\n 'has-desktop-entry'\r\n );\r\n\r\n\r\n desktopEntranceObserver =\r\n new IntersectionObserver(\r\n entries => {\r\n\r\n entries.forEach(\r\n entry => {\r\n\r\n if (\r\n !entry.isIntersecting\r\n ) return;\r\n\r\n\r\n desktopEntrancePlayed =\r\n true;\r\n\r\n\r\n requestAnimationFrame(\r\n () => {\r\n\r\n root.classList.add(\r\n 'is-desktop-entered'\r\n );\r\n\r\n\r\n cleanupDesktopEntrance();\r\n\r\n }\r\n );\r\n\r\n\r\n desktopEntranceObserver.disconnect();\r\n\r\n }\r\n );\r\n\r\n },\r\n {\r\n \/*\r\n Trigger while approximately 20% of the section has entered.\r\n *\/\r\n rootMargin:'0px 0px -20% 0px',\r\n threshold:.02\r\n }\r\n );\r\n\r\n\r\n desktopEntranceObserver.observe(\r\n root\r\n );\r\n\r\n }\r\n\r\n\r\n \/* =======================================================\r\n MOBILE ENTRANCE\r\n Intro once; steps enter individually as they approach.\r\n No continuous progress mapping.\r\n ======================================================= *\/\r\n\r\n let mobileIntroPlayed =\r\n false;\r\n\r\n\r\n let mobileIntroObserver =\r\n null;\r\n\r\n\r\n let mobileStepObserver =\r\n null;\r\n\r\n\r\n function revealAllMobileSteps(){\r\n\r\n steps.forEach(\r\n step => {\r\n\r\n step.dataset.mobileReady =\r\n 'true';\r\n\r\n }\r\n );\r\n\r\n }\r\n\r\n\r\n function initMobileEntrance(){\r\n\r\n mobileIntroObserver?.disconnect();\r\n mobileStepObserver?.disconnect();\r\n\r\n\r\n mobileIntroObserver =\r\n null;\r\n\r\n\r\n mobileStepObserver =\r\n null;\r\n\r\n\r\n root.classList.remove(\r\n 'has-mobile-entry'\r\n );\r\n\r\n\r\n if (\r\n !mobileQuery.matches ||\r\n reducedMotion.matches ||\r\n !(\r\n 'IntersectionObserver' in window\r\n )\r\n ){\r\n\r\n revealAllMobileSteps();\r\n\r\n\r\n return;\r\n\r\n }\r\n\r\n\r\n root.classList.add(\r\n 'has-mobile-entry'\r\n );\r\n\r\n\r\n if (\r\n !mobileIntroPlayed\r\n ){\r\n\r\n mobileIntroObserver =\r\n new IntersectionObserver(\r\n entries => {\r\n\r\n entries.forEach(\r\n entry => {\r\n\r\n if (\r\n !entry.isIntersecting\r\n ) return;\r\n\r\n\r\n mobileIntroPlayed =\r\n true;\r\n\r\n\r\n root.classList.add(\r\n 'is-mobile-intro-entered'\r\n );\r\n\r\n\r\n mobileIntroObserver.disconnect();\r\n\r\n }\r\n );\r\n\r\n },\r\n {\r\n rootMargin:'0px 0px -18% 0px',\r\n threshold:.02\r\n }\r\n );\r\n\r\n\r\n mobileIntroObserver.observe(\r\n root\r\n );\r\n\r\n }else{\r\n\r\n root.classList.add(\r\n 'is-mobile-intro-entered'\r\n );\r\n\r\n }\r\n\r\n\r\n \/*\r\n Existing entered steps stay entered across path changes.\r\n Upcoming steps animate once as they approach.\r\n *\/\r\n steps.forEach(\r\n step => {\r\n\r\n if (\r\n step.dataset.mobileReady !==\r\n 'true'\r\n ){\r\n\r\n step.dataset.mobileReady =\r\n 'false';\r\n\r\n }\r\n\r\n }\r\n );\r\n\r\n\r\n mobileStepObserver =\r\n new IntersectionObserver(\r\n entries => {\r\n\r\n entries.forEach(\r\n entry => {\r\n\r\n if (\r\n !entry.isIntersecting\r\n ) return;\r\n\r\n\r\n entry.target.dataset.mobileReady =\r\n 'true';\r\n\r\n\r\n mobileStepObserver.unobserve(\r\n entry.target\r\n );\r\n\r\n }\r\n );\r\n\r\n },\r\n {\r\n rootMargin:'0px 0px -18% 0px',\r\n threshold:.04\r\n }\r\n );\r\n\r\n\r\n steps.forEach(\r\n step => {\r\n\r\n if (\r\n step.dataset.mobileReady ===\r\n 'true'\r\n ) return;\r\n\r\n\r\n mobileStepObserver.observe(\r\n step\r\n );\r\n\r\n }\r\n );\r\n\r\n }\r\n\r\n\r\n \/* =======================================================\r\n SECTION 06 \u2014 PASSED-CONTENT DEPTH\r\n\r\n This controller is intentionally scoped to this section so it\r\n cannot be skipped or overridden by a differently-versioned\r\n page-level LaminaFocusDepth singleton.\r\n\r\n Behavior:\r\n - upcoming content = sharp\r\n - current reading content = sharp\r\n - once content moves above the focal band, it starts softening\r\n - the farther it moves upward, the slightly stronger the blur\r\n - scrolling back reverses the geometry and restores sharpness\r\n\r\n The effect begins while the passed content is STILL VISIBLE.\r\n ======================================================= *\/\r\n\r\n const passedBlurLayers =\r\n [\r\n ...root.querySelectorAll(\r\n '[data-exit-layer]'\r\n )\r\n ];\r\n\r\n\r\n const passedBlurProfiles =\r\n {\r\n\r\n desktop:{\r\n\r\n eyebrow:{\r\n start:.42,\r\n full:.04,\r\n blur:1.8,\r\n opacityMin:.97\r\n },\r\n\r\n headline:{\r\n start:.44,\r\n full:.03,\r\n blur:2.2,\r\n opacityMin:.97\r\n },\r\n\r\n copy:{\r\n start:.40,\r\n full:.02,\r\n blur:1.65,\r\n opacityMin:.98\r\n },\r\n\r\n ui:{\r\n start:.37,\r\n full:.00,\r\n blur:1.25,\r\n opacityMin:.985\r\n },\r\n\r\n step:{\r\n \/*\r\n A tree step begins softening once its center rises above\r\n ~46% of the viewport \u2014 while it is still clearly visible.\r\n *\/\r\n start:.46,\r\n full:.02,\r\n blur:2.05,\r\n opacityMin:.98\r\n }\r\n\r\n },\r\n\r\n mobile:{\r\n\r\n eyebrow:{\r\n start:.39,\r\n full:.03,\r\n blur:1.45,\r\n opacityMin:.975\r\n },\r\n\r\n headline:{\r\n start:.41,\r\n full:.02,\r\n blur:1.75,\r\n opacityMin:.975\r\n },\r\n\r\n copy:{\r\n start:.37,\r\n full:.01,\r\n blur:1.25,\r\n opacityMin:.985\r\n },\r\n\r\n ui:{\r\n start:.34,\r\n full:0,\r\n blur:.95,\r\n opacityMin:.99\r\n },\r\n\r\n step:{\r\n start:.43,\r\n full:.01,\r\n blur:1.60,\r\n opacityMin:.985\r\n }\r\n\r\n }\r\n\r\n };\r\n\r\n\r\n let passedBlurTicking =\r\n false;\r\n\r\n\r\n let passedBlurNear =\r\n true;\r\n\r\n\r\n function passedBlurClamp(\r\n value,\r\n min,\r\n max\r\n ){\r\n\r\n return Math.min(\r\n max,\r\n Math.max(\r\n min,\r\n value\r\n )\r\n );\r\n\r\n }\r\n\r\n\r\n function passedBlurEase(\r\n value\r\n ){\r\n\r\n const t =\r\n passedBlurClamp(\r\n value,\r\n 0,\r\n 1\r\n );\r\n\r\n\r\n return (\r\n t *\r\n t *\r\n (\r\n 3 -\r\n 2 *\r\n t\r\n )\r\n );\r\n\r\n }\r\n\r\n\r\n function updatePassedBlur(){\r\n\r\n passedBlurTicking =\r\n false;\r\n\r\n\r\n if (\r\n !passedBlurNear\r\n ) return;\r\n\r\n\r\n const vh =\r\n Math.max(\r\n 1,\r\n window.innerHeight ||\r\n document.documentElement.clientHeight\r\n );\r\n\r\n\r\n const set =\r\n window.innerWidth <\r\n 768\r\n ? passedBlurProfiles.mobile\r\n : passedBlurProfiles.desktop;\r\n\r\n\r\n passedBlurLayers.forEach(\r\n element => {\r\n\r\n const type =\r\n element.dataset.exitLayer ||\r\n 'copy';\r\n\r\n\r\n const profile =\r\n set[\r\n type\r\n ] ||\r\n set.copy;\r\n\r\n\r\n const rect =\r\n element.getBoundingClientRect();\r\n\r\n\r\n const center =\r\n rect.top +\r\n rect.height *\r\n .5;\r\n\r\n\r\n const startY =\r\n vh *\r\n profile.start;\r\n\r\n\r\n const fullY =\r\n vh *\r\n profile.full;\r\n\r\n\r\n \/*\r\n Above startY = it has begun leaving the focal reading zone.\r\n At \/ below startY = perfectly sharp.\r\n *\/\r\n let progress =\r\n center <\r\n startY\r\n ? (\r\n startY -\r\n center\r\n ) \/\r\n Math.max(\r\n 1,\r\n startY -\r\n fullY\r\n )\r\n : 0;\r\n\r\n\r\n progress =\r\n passedBlurEase(\r\n progress\r\n );\r\n\r\n\r\n const interactive =\r\n element.matches(\r\n ':hover, :focus-within'\r\n );\r\n\r\n\r\n if (\r\n interactive\r\n ){\r\n\r\n progress =\r\n 0;\r\n\r\n }\r\n\r\n\r\n const blur =\r\n reducedMotion.matches\r\n ? 0\r\n : (\r\n profile.blur *\r\n progress\r\n );\r\n\r\n\r\n const opacity =\r\n reducedMotion.matches\r\n ? 1\r\n : (\r\n 1 -\r\n (\r\n 1 -\r\n profile.opacityMin\r\n ) *\r\n progress\r\n );\r\n\r\n\r\n element.style.setProperty(\r\n '--pt-passed-blur',\r\n blur.toFixed(\r\n 2\r\n ) +\r\n 'px'\r\n );\r\n\r\n\r\n element.style.setProperty(\r\n '--pt-passed-opacity',\r\n opacity.toFixed(\r\n 3\r\n )\r\n );\r\n\r\n }\r\n );\r\n\r\n }\r\n\r\n\r\n function requestPassedBlurUpdate(){\r\n\r\n if (\r\n passedBlurTicking\r\n ) return;\r\n\r\n\r\n passedBlurTicking =\r\n true;\r\n\r\n\r\n requestAnimationFrame(\r\n updatePassedBlur\r\n );\r\n\r\n }\r\n\r\n\r\n const passedBlurObserver =\r\n 'IntersectionObserver' in window\r\n ? new IntersectionObserver(\r\n entries => {\r\n\r\n entries.forEach(\r\n entry => {\r\n\r\n passedBlurNear =\r\n entry.isIntersecting;\r\n\r\n\r\n if (\r\n passedBlurNear\r\n ){\r\n\r\n requestPassedBlurUpdate();\r\n\r\n }\r\n\r\n }\r\n );\r\n\r\n },\r\n {\r\n rootMargin:'110% 0px 110% 0px',\r\n threshold:0\r\n }\r\n )\r\n : null;\r\n\r\n\r\n passedBlurObserver?.observe(\r\n root\r\n );\r\n\r\n\r\n window.addEventListener(\r\n 'scroll',\r\n requestPassedBlurUpdate,\r\n {\r\n passive:true\r\n }\r\n );\r\n\r\n\r\n window.addEventListener(\r\n 'resize',\r\n requestPassedBlurUpdate,\r\n {\r\n passive:true\r\n }\r\n );\r\n\r\n\r\n \/* =======================================================\r\n MODE \/ MOTION MANAGEMENT\r\n ======================================================= *\/\r\n\r\n function resetEntranceClasses(){\r\n\r\n root.classList.remove(\r\n 'has-desktop-entry',\r\n 'is-desktop-entered',\r\n 'has-mobile-entry'\r\n );\r\n\r\n }\r\n\r\n\r\n function handleModeChange(){\r\n\r\n desktopEntranceObserver?.disconnect();\r\n mobileIntroObserver?.disconnect();\r\n mobileStepObserver?.disconnect();\r\n\r\n\r\n resetEntranceClasses();\r\n\r\n\r\n if (\r\n reducedMotion.matches\r\n ){\r\n\r\n revealAllMobileSteps();\r\n\r\n\r\n root.classList.add(\r\n 'is-mobile-intro-entered'\r\n );\r\n\r\n\r\n requestPassedBlurUpdate();\r\n\r\n\r\n return;\r\n\r\n }\r\n\r\n\r\n if (\r\n mobileQuery.matches\r\n ){\r\n\r\n initMobileEntrance();\r\n\r\n }else{\r\n\r\n initDesktopEntrance();\r\n\r\n }\r\n\r\n\r\n requestPassedBlurUpdate();\r\n requestSpineFillUpdate();\r\n\r\n }\r\n\r\n\r\n desktopQuery.addEventListener?.(\r\n 'change',\r\n handleModeChange\r\n );\r\n\r\n\r\n mobileQuery.addEventListener?.(\r\n 'change',\r\n handleModeChange\r\n );\r\n\r\n\r\n reducedMotion.addEventListener?.(\r\n 'change',\r\n handleModeChange\r\n );\r\n\r\n\r\n window.addEventListener(\r\n 'scroll',\r\n requestSpineFillUpdate,\r\n {\r\n passive:true\r\n }\r\n );\r\n\r\n\r\n window.addEventListener(\r\n 'resize',\r\n requestSpineFillUpdate,\r\n {\r\n passive:true\r\n }\r\n );\r\n\r\n\r\n \/* =======================================================\r\n INITIALIZE\r\n ======================================================= *\/\r\n\r\n setBoundContent(\r\n pathData.dental\r\n );\r\n\r\n\r\n if (\r\n reducedMotion.matches\r\n ){\r\n\r\n revealAllMobileSteps();\r\n\r\n }else if(\r\n mobileQuery.matches\r\n ){\r\n\r\n initMobileEntrance();\r\n\r\n }else{\r\n\r\n initDesktopEntrance();\r\n\r\n }\r\n\r\n\r\n requestSpineFillUpdate();\r\n requestPassedBlurUpdate();\r\n\r\n})();\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-63f3db3 e-con-full e-flex e-con e-parent\" data-id=\"63f3db3\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-48a225e elementor-widget elementor-widget-html\" data-id=\"48a225e\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- =========================================================\r\nLAMINA CLINIC \u2014 SECTION 07\r\nYOUR ISTANBUL STAY\r\nCONCEPT: THE ISTANBUL STAY INDEX\r\nV1 \u2014 DARK \/ IMAGE-LED \/ EDITORIAL \/ HOSPITALITY-INSPIRED\r\n\r\nLOCKED LAMINA RULES APPLIED:\r\n- two-part editorial title system\r\n- no Elementor pink\r\n- no sticky \/ no scroll hijack\r\n- no cards \/ no icons \/ no carousel\r\n- active hotel controls stay sharp\r\n- passed content softly blurs only after it is scrolled away\r\n- mobile is independently art-directed\r\n- no fake hotel facts or unverified branch details\r\n\r\nPRODUCTION NOTE:\r\nHotel names below are the working names supplied by Lamina.\r\nExact commercial names \/ branches must be verified before publication.\r\nImage URLs are intentionally blank until Lamina-approved hotel media is supplied.\r\n========================================================= -->\r\n\r\n<style>\r\n@import url('https:\/\/fonts.googleapis.com\/css2?family=Cormorant+Garamond:ital,wght@0,400;0,500;1,400&family=Manrope:wght@400;500;600&display=swap');\r\n\r\n#lamina-istanbul-stay{\r\n --lis-aubergine:#2B142F;\r\n --lis-aubergine-2:#241128;\r\n --lis-aubergine-3:#311635;\r\n --lis-aubergine-4:#341738;\r\n --lis-ink:#171317;\r\n --lis-ivory:#F7F2EA;\r\n --lis-lilac:#C5B2C8;\r\n --lis-orchid:#94709A;\r\n --lis-plum:#5F2468;\r\n --lis-champagne:#D8C4A1;\r\n --lis-rule:rgba(247,242,234,.13);\r\n --lis-rule-soft:rgba(247,242,234,.08);\r\n --lis-ease:cubic-bezier(.16,.70,.18,1);\r\n --lis-stage:1560px;\r\n\r\n --e-global-color-primary:#F7F2EA;\r\n --e-global-color-secondary:#94709A;\r\n --e-global-color-text:#F7F2EA;\r\n --e-global-color-accent:#5F2468;\r\n\r\n position:relative;\r\n width:100%;\r\n overflow:hidden;\r\n\r\n background:\r\n radial-gradient(48% 38% at 86% 10%,rgba(148,112,154,.07),transparent 74%),\r\n linear-gradient(150deg,var(--lis-aubergine-3) 0%,var(--lis-aubergine) 58%,var(--lis-aubergine-2) 100%);\r\n\r\n color:var(--lis-ivory);\r\n font-family:\"Manrope\",system-ui,-apple-system,BlinkMacSystemFont,\"Segoe UI\",sans-serif;\r\n\r\n -webkit-tap-highlight-color:rgba(95,36,104,.10);\r\n}\r\n\r\n#lamina-istanbul-stay *,\r\n#lamina-istanbul-stay *::before,\r\n#lamina-istanbul-stay *::after{\r\n box-sizing:border-box;\r\n}\r\n\r\n#lamina-istanbul-stay ::selection{\r\n background:var(--lis-plum);\r\n color:var(--lis-ivory);\r\n}\r\n\r\n\/* =========================================================\r\n ELEMENTOR \/ THEME COLOR PROTECTION\r\n ========================================================= *\/\r\n#lamina-istanbul-stay a,\r\n#lamina-istanbul-stay a:link,\r\n#lamina-istanbul-stay a:visited,\r\n#lamina-istanbul-stay a:hover,\r\n#lamina-istanbul-stay a:focus,\r\n#lamina-istanbul-stay a:focus-visible,\r\n#lamina-istanbul-stay a:active,\r\n#lamina-istanbul-stay button,\r\n#lamina-istanbul-stay button:hover,\r\n#lamina-istanbul-stay button:focus,\r\n#lamina-istanbul-stay button:focus-visible,\r\n#lamina-istanbul-stay button:active{\r\n font:inherit;\r\n text-decoration-color:var(--lis-plum) !important;\r\n}\r\n\r\n#lamina-istanbul-stay .lis__hotel-btn,\r\n#lamina-istanbul-stay .lis__hotel-btn:visited,\r\n#lamina-istanbul-stay .lis__hotel-btn:hover,\r\n#lamina-istanbul-stay .lis__hotel-btn:focus,\r\n#lamina-istanbul-stay .lis__hotel-btn:focus-visible,\r\n#lamina-istanbul-stay .lis__hotel-btn:active{\r\n background:transparent !important;\r\n border-color:transparent !important;\r\n box-shadow:none !important;\r\n}\r\n\r\n#lamina-istanbul-stay .lis__hotel-btn{\r\n color:rgba(247,242,234,.58) !important;\r\n}\r\n\r\n#lamina-istanbul-stay .lis__hotel-btn:hover,\r\n#lamina-istanbul-stay .lis__hotel-btn:focus-visible{\r\n color:rgba(247,242,234,.86) !important;\r\n}\r\n\r\n#lamina-istanbul-stay .lis__hotel-btn[aria-pressed=\"true\"],\r\n#lamina-istanbul-stay .lis__hotel-btn[aria-pressed=\"true\"]:hover,\r\n#lamina-istanbul-stay .lis__hotel-btn[aria-pressed=\"true\"]:focus,\r\n#lamina-istanbul-stay .lis__hotel-btn[aria-pressed=\"true\"]:focus-visible,\r\n#lamina-istanbul-stay .lis__hotel-btn[aria-pressed=\"true\"]:active{\r\n color:var(--lis-ivory) !important;\r\n}\r\n\r\n#lamina-istanbul-stay .lis__hotel-btn:focus-visible{\r\n outline:1px solid rgba(197,178,200,.72) !important;\r\n outline-offset:5px !important;\r\n}\r\n\r\n#lamina-istanbul-stay .lis__hotel-btn::before,\r\n#lamina-istanbul-stay .lis__hotel-btn::after{\r\n background-color:var(--lis-plum) !important;\r\n}\r\n\r\n\/* =========================================================\r\n SHELL\r\n ========================================================= *\/\r\n.lis__shell{\r\n width:min(100%,1720px);\r\n margin-inline:auto;\r\n padding:\r\n clamp(78px,8.5vh,112px)\r\n clamp(22px,3.4vw,66px)\r\n clamp(94px,10vh,132px);\r\n}\r\n\r\n\/* =========================================================\r\n INTRO\r\n ========================================================= *\/\r\n.lis__intro{\r\n width:min(100%,var(--lis-stage));\r\n margin-inline:auto;\r\n\r\n display:grid;\r\n grid-template-columns:minmax(0,.56fr) minmax(280px,.34fr);\r\n justify-content:space-between;\r\n gap:clamp(72px,9vw,150px);\r\n align-items:end;\r\n\r\n margin-bottom:clamp(46px,5.5vh,68px);\r\n}\r\n\r\n.lis__eyebrow{\r\n margin:0 0 16px;\r\n\r\n color:rgba(197,178,200,.82);\r\n\r\n font-size:clamp(11px,.70vw,13px);\r\n line-height:1.2;\r\n font-weight:600;\r\n letter-spacing:.17em;\r\n text-transform:uppercase;\r\n}\r\n\r\n.lis__title{\r\n margin:0;\r\n max-width:8.8ch;\r\n overflow:visible;\r\n\r\n font-family:\"Cormorant Garamond\",Georgia,serif;\r\n font-size:clamp(68px,6vw,108px);\r\n line-height:1;\r\n font-weight:400;\r\n letter-spacing:-.050em;\r\n}\r\n\r\n.lis__title-line{\r\n display:block;\r\n width:max-content;\r\n max-width:100%;\r\n line-height:.88;\r\n}\r\n\r\n.lis__title-line + .lis__title-line{\r\n margin-top:-.045em;\r\n}\r\n\r\n.lis__title-line--accent{\r\n margin-top:.035em !important;\r\n padding-inline-end:.055em;\r\n padding-bottom:.075em;\r\n\r\n color:var(--lis-orchid);\r\n\r\n font-style:italic;\r\n letter-spacing:-.038em;\r\n line-height:.92;\r\n}\r\n\r\n.lis__support-wrap{\r\n max-width:42ch;\r\n justify-self:end;\r\n}\r\n\r\n.lis__support{\r\n margin:0;\r\n\r\n color:rgba(247,242,234,.76);\r\n\r\n font-size:clamp(15px,1vw,18px);\r\n line-height:1.72;\r\n}\r\n\r\n.lis__micro{\r\n margin:18px 0 0;\r\n\r\n color:rgba(197,178,200,.56);\r\n\r\n font-size:11px;\r\n line-height:1.2;\r\n font-weight:600;\r\n letter-spacing:.14em;\r\n text-transform:uppercase;\r\n}\r\n\r\n\/* =========================================================\r\n HOSPITALITY STAGE\r\n ========================================================= *\/\r\n.lis__stage{\r\n width:min(100%,var(--lis-stage));\r\n margin-inline:auto;\r\n\r\n display:grid;\r\n grid-template-columns:minmax(0,1fr) minmax(260px,24%);\r\n gap:clamp(30px,3.5vw,58px);\r\n align-items:stretch;\r\n}\r\n\r\n.lis__visual{\r\n position:relative;\r\n min-width:0;\r\n}\r\n\r\n.lis__visual-frame{\r\n position:relative;\r\n overflow:hidden;\r\n\r\n width:100%;\r\n aspect-ratio:1.72 \/ 1;\r\n min-height:clamp(430px,51vh,620px);\r\n max-height:650px;\r\n\r\n background:\r\n radial-gradient(70% 70% at 56% 36%,rgba(148,112,154,.16),transparent 68%),\r\n linear-gradient(145deg,#3B1C40 0%,#27132C 68%,#1F101F 100%);\r\n\r\n border:1px solid rgba(247,242,234,.055);\r\n}\r\n\r\n.lis__visual-frame::before{\r\n content:\"\";\r\n\r\n position:absolute;\r\n inset:0;\r\n z-index:1;\r\n\r\n pointer-events:none;\r\n\r\n background:\r\n linear-gradient(180deg,rgba(43,20,47,.02),rgba(43,20,47,.18));\r\n}\r\n\r\n.lis__image-layer{\r\n position:absolute;\r\n inset:0;\r\n\r\n width:100%;\r\n height:100%;\r\n\r\n opacity:0;\r\n\r\n clip-path:inset(0 0 8% 0);\r\n\r\n transform:scale(1.008);\r\n\r\n will-change:opacity, transform, clip-path;\r\n}\r\n\r\n.lis__image-layer.is-current{\r\n opacity:1;\r\n clip-path:inset(0);\r\n transform:scale(1);\r\n}\r\n\r\n.lis__image-layer img{\r\n width:100%;\r\n height:100%;\r\n display:block;\r\n\r\n object-fit:cover;\r\n object-position:var(--lis-object-position,50% 50%);\r\n\r\n user-select:none;\r\n pointer-events:none;\r\n}\r\n\r\n.lis__image-layer.is-fallback{\r\n display:grid;\r\n place-items:center;\r\n}\r\n\r\n.lis__fallback-inner{\r\n position:absolute;\r\n inset:11%;\r\n\r\n border:1px solid rgba(247,242,234,.08);\r\n}\r\n\r\n.lis__fallback-copy{\r\n position:relative;\r\n z-index:2;\r\n\r\n width:min(78%,560px);\r\n\r\n color:rgba(247,242,234,.42);\r\n\r\n text-align:center;\r\n}\r\n\r\n.lis__fallback-kicker{\r\n display:block;\r\n margin-bottom:12px;\r\n\r\n color:rgba(197,178,200,.62);\r\n\r\n font-size:11px;\r\n font-weight:600;\r\n letter-spacing:.14em;\r\n text-transform:uppercase;\r\n}\r\n\r\n.lis__fallback-title{\r\n display:block;\r\n\r\n font-family:\"Cormorant Garamond\",Georgia,serif;\r\n font-size:clamp(34px,3.2vw,52px);\r\n line-height:.98;\r\n font-weight:400;\r\n letter-spacing:-.03em;\r\n}\r\n\r\n.lis__caption{\r\n position:absolute;\r\n z-index:4;\r\n inset-inline-start:18px;\r\n inset-block-end:16px;\r\n\r\n max-width:68%;\r\n\r\n color:rgba(247,242,234,.84);\r\n\r\n font-size:11px;\r\n line-height:1.35;\r\n font-weight:600;\r\n letter-spacing:.12em;\r\n text-transform:uppercase;\r\n}\r\n\r\n.lis__caption span{\r\n color:rgba(197,178,200,.62);\r\n}\r\n\r\n\/* =========================================================\r\n HOTEL INDEX\r\n ========================================================= *\/\r\n.lis__index{\r\n display:flex;\r\n flex-direction:column;\r\n justify-content:stretch;\r\n min-width:0;\r\n}\r\n\r\n.lis__hotel-btn{\r\n position:relative;\r\n\r\n flex:1 1 0;\r\n\r\n display:grid;\r\n grid-template-columns:34px minmax(0,1fr);\r\n gap:14px;\r\n align-items:center;\r\n\r\n width:100%;\r\n min-height:68px;\r\n padding:\r\n clamp(15px,2.1vh,24px)\r\n 0;\r\n\r\n border:0;\r\n border-bottom:1px solid var(--lis-rule) !important;\r\n border-radius:0 !important;\r\n\r\n cursor:pointer;\r\n appearance:none;\r\n\r\n text-align:start;\r\n\r\n transition:\r\n color .42s ease,\r\n opacity .42s ease,\r\n border-color .42s ease;\r\n}\r\n\r\n.lis__hotel-btn:first-child{\r\n border-top:1px solid var(--lis-rule) !important;\r\n}\r\n\r\n.lis__hotel-btn::before{\r\n content:\"\";\r\n\r\n position:absolute;\r\n\r\n inset-inline-start:0;\r\n inset-block-start:50%;\r\n\r\n width:0;\r\n height:1px;\r\n\r\n opacity:0;\r\n\r\n transform:translateY(-50%);\r\n\r\n transition:\r\n width .50s var(--lis-ease),\r\n opacity .34s ease;\r\n}\r\n\r\n.lis__hotel-btn[aria-pressed=\"true\"]::before{\r\n width:24px;\r\n opacity:1;\r\n}\r\n\r\n.lis__hotel-btn[aria-pressed=\"true\"]{\r\n border-bottom-color:rgba(247,242,234,.23) !important;\r\n}\r\n\r\n.lis__hotel-no{\r\n color:rgba(197,178,200,.60);\r\n\r\n font-size:10.5px;\r\n line-height:1;\r\n font-weight:600;\r\n letter-spacing:.12em;\r\n\r\n transition:color .38s ease;\r\n}\r\n\r\n.lis__hotel-btn[aria-pressed=\"true\"] .lis__hotel-no{\r\n color:var(--lis-orchid);\r\n}\r\n\r\n.lis__hotel-name{\r\n font-family:\"Cormorant Garamond\",Georgia,serif;\r\n font-size:clamp(25px,1.9vw,33px);\r\n line-height:1;\r\n font-weight:400;\r\n letter-spacing:-.022em;\r\n}\r\n\r\n.lis__hotel-verify{\r\n display:block;\r\n margin-top:5px;\r\n\r\n color:rgba(197,178,200,.40);\r\n\r\n font-family:\"Manrope\",sans-serif;\r\n font-size:10px;\r\n line-height:1.25;\r\n font-weight:500;\r\n letter-spacing:.06em;\r\n text-transform:uppercase;\r\n}\r\n\r\n\/* =========================================================\r\n LOGISTICS STRIP\r\n ========================================================= *\/\r\n.lis__logistics{\r\n width:min(100%,var(--lis-stage));\r\n margin:\r\n clamp(46px,5.5vh,66px)\r\n auto\r\n 0;\r\n\r\n border-top:1px solid var(--lis-rule);\r\n border-bottom:1px solid var(--lis-rule);\r\n\r\n display:grid;\r\n grid-template-columns:repeat(3,minmax(0,1fr));\r\n}\r\n\r\n.lis__logistics-item{\r\n position:relative;\r\n padding:\r\n clamp(28px,3.8vh,42px)\r\n clamp(24px,2.8vw,42px)\r\n clamp(30px,4.1vh,46px);\r\n\r\n min-width:0;\r\n}\r\n\r\n.lis__logistics-item + .lis__logistics-item{\r\n border-inline-start:1px solid var(--lis-rule);\r\n}\r\n\r\n.lis__logistics-kicker{\r\n display:block;\r\n margin-bottom:14px;\r\n\r\n color:rgba(197,178,200,.62);\r\n\r\n font-size:clamp(11.5px,.78vw,13px);\r\n line-height:1.2;\r\n font-weight:600;\r\n letter-spacing:.135em;\r\n text-transform:uppercase;\r\n}\r\n\r\n.lis__logistics-title{\r\n margin:0;\r\n\r\n color:var(--lis-ivory);\r\n\r\n font-family:\"Cormorant Garamond\",Georgia,serif;\r\n font-size:clamp(28px,2.2vw,37px);\r\n line-height:.98;\r\n font-weight:400;\r\n letter-spacing:-.025em;\r\n}\r\n\r\n.lis__logistics-copy{\r\n margin:13px 0 0;\r\n\r\n max-width:42ch;\r\n\r\n color:rgba(247,242,234,.63);\r\n\r\n font-size:clamp(13px,.88vw,15px);\r\n line-height:1.62;\r\n}\r\n\r\n\/* =========================================================\r\n ENTRY \/ FOCUS LAYERS\r\n ========================================================= *\/\r\n#lamina-istanbul-stay [data-lis-depth]{\r\n --lis-entry-blur:0px;\r\n --lis-passed-blur:0px;\r\n --lis-depth-opacity:1;\r\n\r\n filter:\r\n blur(\r\n calc(\r\n var(--lis-entry-blur) +\r\n var(--lis-passed-blur)\r\n )\r\n );\r\n\r\n opacity:var(--lis-depth-opacity);\r\n\r\n will-change:filter, opacity;\r\n}\r\n\r\n#lamina-istanbul-stay [data-lis-depth]:hover,\r\n#lamina-istanbul-stay [data-lis-depth]:focus-within{\r\n --lis-passed-blur:0px !important;\r\n --lis-depth-opacity:1 !important;\r\n}\r\n\r\n\/* =========================================================\r\n DESKTOP ENTRANCE \u2014 ONCE\r\n ========================================================= *\/\r\n#lamina-istanbul-stay.has-entry .lis__eyebrow{\r\n opacity:0;\r\n transform:translate3d(0,8px,0);\r\n --lis-entry-blur:2.8px;\r\n}\r\n\r\n#lamina-istanbul-stay.has-entry .lis__title-line{\r\n opacity:0;\r\n transform:translate3d(0,102%,0);\r\n --lis-entry-blur:4px;\r\n}\r\n\r\n#lamina-istanbul-stay.has-entry .lis__support-wrap{\r\n opacity:0;\r\n transform:translate3d(0,10px,0);\r\n --lis-entry-blur:3px;\r\n}\r\n\r\n#lamina-istanbul-stay.has-entry .lis__visual-frame{\r\n clip-path:inset(0 0 100% 0);\r\n}\r\n\r\n#lamina-istanbul-stay.has-entry .lis__visual-frame .lis__image-layer,\r\n#lamina-istanbul-stay.has-entry .lis__visual-frame .lis__fallback-copy,\r\n#lamina-istanbul-stay.has-entry .lis__visual-frame .lis__fallback-inner{\r\n transform:translate3d(0,14px,0) scale(1.012);\r\n}\r\n\r\n#lamina-istanbul-stay.has-entry .lis__hotel-btn{\r\n opacity:.15;\r\n transform:translate3d(0,10px,0);\r\n}\r\n\r\n#lamina-istanbul-stay.has-entry .lis__logistics{\r\n clip-path:inset(0 100% 0 0);\r\n}\r\n\r\n#lamina-istanbul-stay.has-entry .lis__logistics-item{\r\n opacity:0;\r\n transform:translate3d(0,8px,0);\r\n}\r\n\r\n#lamina-istanbul-stay.has-entry.is-entered .lis__eyebrow{\r\n opacity:1;\r\n transform:none;\r\n --lis-entry-blur:0px;\r\n\r\n transition:\r\n opacity .48s var(--lis-ease) .03s,\r\n transform .54s var(--lis-ease) .03s,\r\n filter .45s ease .03s;\r\n}\r\n\r\n#lamina-istanbul-stay.has-entry.is-entered .lis__title-line{\r\n opacity:1;\r\n transform:none;\r\n --lis-entry-blur:0px;\r\n\r\n transition:\r\n opacity .62s var(--lis-ease),\r\n transform .78s cubic-bezier(.12,.82,.18,1),\r\n filter .52s ease;\r\n}\r\n\r\n#lamina-istanbul-stay.has-entry.is-entered\r\n.lis__title-line:nth-child(1){\r\n transition-delay:.07s;\r\n}\r\n\r\n#lamina-istanbul-stay.has-entry.is-entered\r\n.lis__title-line:nth-child(2){\r\n transition-delay:.15s;\r\n}\r\n\r\n#lamina-istanbul-stay.has-entry.is-entered .lis__support-wrap{\r\n opacity:1;\r\n transform:none;\r\n --lis-entry-blur:0px;\r\n\r\n transition:\r\n opacity .56s var(--lis-ease) .20s,\r\n transform .60s var(--lis-ease) .20s,\r\n filter .50s ease .20s;\r\n}\r\n\r\n#lamina-istanbul-stay.has-entry.is-entered .lis__visual-frame{\r\n clip-path:inset(0);\r\n\r\n transition:\r\n clip-path 1.00s cubic-bezier(.16,.76,.20,1) .27s;\r\n}\r\n\r\n#lamina-istanbul-stay.has-entry.is-entered .lis__visual-frame .lis__image-layer,\r\n#lamina-istanbul-stay.has-entry.is-entered .lis__visual-frame .lis__fallback-copy,\r\n#lamina-istanbul-stay.has-entry.is-entered .lis__visual-frame .lis__fallback-inner{\r\n transform:none;\r\n\r\n transition:\r\n transform 1.00s cubic-bezier(.16,.76,.20,1) .27s;\r\n}\r\n\r\n#lamina-istanbul-stay.has-entry.is-entered .lis__hotel-btn{\r\n opacity:1;\r\n transform:none;\r\n\r\n transition:\r\n opacity .48s var(--lis-ease),\r\n transform .54s var(--lis-ease);\r\n}\r\n\r\n#lamina-istanbul-stay.has-entry.is-entered .lis__hotel-btn:nth-child(1){\r\n transition-delay:.48s;\r\n}\r\n\r\n#lamina-istanbul-stay.has-entry.is-entered .lis__hotel-btn:nth-child(2){\r\n transition-delay:.55s;\r\n}\r\n\r\n#lamina-istanbul-stay.has-entry.is-entered .lis__hotel-btn:nth-child(3){\r\n transition-delay:.62s;\r\n}\r\n\r\n#lamina-istanbul-stay.has-entry.is-entered .lis__hotel-btn:nth-child(4){\r\n transition-delay:.69s;\r\n}\r\n\r\n#lamina-istanbul-stay.has-entry.is-entered .lis__hotel-btn:nth-child(5){\r\n transition-delay:.76s;\r\n}\r\n\r\n#lamina-istanbul-stay.has-entry.is-entered .lis__logistics{\r\n clip-path:inset(0);\r\n\r\n transition:\r\n clip-path .62s var(--lis-ease) .78s;\r\n}\r\n\r\n#lamina-istanbul-stay.has-entry.is-entered .lis__logistics-item{\r\n opacity:1;\r\n transform:none;\r\n\r\n transition:\r\n opacity .50s var(--lis-ease),\r\n transform .54s var(--lis-ease);\r\n}\r\n\r\n#lamina-istanbul-stay.has-entry.is-entered .lis__logistics-item:nth-child(1){\r\n transition-delay:.84s;\r\n}\r\n#lamina-istanbul-stay.has-entry.is-entered .lis__logistics-item:nth-child(2){\r\n transition-delay:.91s;\r\n}\r\n#lamina-istanbul-stay.has-entry.is-entered .lis__logistics-item:nth-child(3){\r\n transition-delay:.98s;\r\n}\r\n\r\n\/* =========================================================\r\n IMAGE CHANGE\r\n ========================================================= *\/\r\n.lis__image-layer.is-transitioning-in{\r\n opacity:1;\r\n clip-path:inset(0);\r\n transform:scale(1);\r\n\r\n transition:\r\n opacity .64s ease,\r\n clip-path .70s var(--lis-ease),\r\n transform .72s var(--lis-ease);\r\n}\r\n\r\n.lis__image-layer.is-transitioning-out{\r\n opacity:0;\r\n clip-path:inset(0 0 5% 0);\r\n transform:scale(1.004);\r\n\r\n transition:\r\n opacity .58s ease,\r\n clip-path .62s var(--lis-ease),\r\n transform .62s var(--lis-ease);\r\n}\r\n\r\n\/* =========================================================\r\n TABLET\r\n ========================================================= *\/\r\n@media (min-width:900px) and (max-width:1180px){\r\n\r\n .lis__shell{\r\n padding-inline:30px;\r\n }\r\n\r\n .lis__intro{\r\n grid-template-columns:minmax(0,.54fr) minmax(300px,.38fr);\r\n gap:48px;\r\n }\r\n\r\n .lis__stage{\r\n grid-template-columns:minmax(0,1fr) minmax(245px,29%);\r\n gap:28px;\r\n }\r\n\r\n .lis__visual-frame{\r\n min-height:430px;\r\n }\r\n\r\n .lis__hotel-name{\r\n font-size:clamp(23px,2.4vw,29px);\r\n }\r\n\r\n}\r\n\r\n\/* =========================================================\r\n MOBILE \/ PORTRAIT TABLET \u2014 \u201cTHE STAY EDITION\u201d\r\n ========================================================= *\/\r\n@media (max-width:899px){\r\n\r\n .lis__shell{\r\n padding:\r\n 66px\r\n 20px\r\n 84px;\r\n }\r\n\r\n .lis__intro{\r\n display:block;\r\n width:100%;\r\n margin-bottom:30px;\r\n }\r\n\r\n .lis__title{\r\n max-width:8ch;\r\n font-size:clamp(52px,14.2vw,66px);\r\n }\r\n\r\n .lis__title-line{\r\n line-height:.90;\r\n }\r\n\r\n .lis__title-line + .lis__title-line{\r\n margin-top:-.04em;\r\n }\r\n\r\n .lis__support-wrap{\r\n max-width:36ch;\r\n margin-top:20px;\r\n justify-self:auto;\r\n }\r\n\r\n .lis__support{\r\n font-size:15px;\r\n line-height:1.65;\r\n }\r\n\r\n .lis__micro{\r\n margin-top:15px;\r\n }\r\n\r\n .lis__stage{\r\n display:block;\r\n width:100%;\r\n }\r\n\r\n .lis__visual-frame{\r\n width:100%;\r\n\r\n aspect-ratio:5 \/ 6;\r\n min-height:0;\r\n max-height:none;\r\n }\r\n\r\n .lis__caption{\r\n inset-inline:14px;\r\n inset-block-end:13px;\r\n max-width:78%;\r\n }\r\n\r\n .lis__index{\r\n margin-top:20px;\r\n }\r\n\r\n .lis__hotel-btn{\r\n min-height:48px;\r\n padding:\r\n 12px\r\n 0;\r\n\r\n grid-template-columns:34px minmax(0,1fr);\r\n }\r\n\r\n .lis__hotel-name{\r\n font-size:clamp(24px,7vw,31px);\r\n }\r\n\r\n .lis__hotel-verify{\r\n font-size:10px;\r\n }\r\n\r\n .lis__logistics{\r\n display:block;\r\n\r\n width:100%;\r\n\r\n margin-top:34px;\r\n\r\n border-bottom:0;\r\n }\r\n\r\n .lis__logistics-item{\r\n padding:\r\n 25px\r\n 0\r\n 28px;\r\n }\r\n\r\n .lis__logistics-item + .lis__logistics-item{\r\n border-inline-start:0;\r\n border-top:1px solid var(--lis-rule);\r\n }\r\n\r\n .lis__logistics-title{\r\n font-size:clamp(29px,8vw,36px);\r\n }\r\n\r\n .lis__logistics-copy{\r\n font-size:14px;\r\n line-height:1.58;\r\n }\r\n\r\n \/*\r\n Mobile entrance:\r\n header + image first, index quickly follows.\r\n Lower logistics rows enter independently through IO.\r\n *\/\r\n #lamina-istanbul-stay.has-entry .lis__logistics{\r\n clip-path:none;\r\n }\r\n\r\n #lamina-istanbul-stay.has-entry .lis__logistics-item{\r\n opacity:1;\r\n transform:none;\r\n }\r\n\r\n #lamina-istanbul-stay.has-mobile-rows\r\n .lis__logistics-item[data-mobile-ready=\"false\"]{\r\n opacity:.10;\r\n transform:translate3d(0,8px,0);\r\n }\r\n\r\n #lamina-istanbul-stay.has-mobile-rows\r\n .lis__logistics-item[data-mobile-ready=\"true\"]{\r\n opacity:1;\r\n transform:none;\r\n\r\n transition:\r\n opacity .48s var(--lis-ease),\r\n transform .52s var(--lis-ease);\r\n }\r\n\r\n}\r\n\r\n\/* =========================================================\r\n SHORT DESKTOP\r\n ========================================================= *\/\r\n@media (min-width:900px) and (max-height:700px){\r\n\r\n .lis__shell{\r\n padding-block:62px 78px;\r\n }\r\n\r\n .lis__intro{\r\n margin-bottom:34px;\r\n }\r\n\r\n .lis__title{\r\n font-size:clamp(62px,5.4vw,88px);\r\n }\r\n\r\n .lis__visual-frame{\r\n min-height:370px;\r\n max-height:430px;\r\n }\r\n\r\n .lis__hotel-btn{\r\n min-height:58px;\r\n padding-block:11px;\r\n }\r\n\r\n .lis__hotel-name{\r\n font-size:clamp(22px,1.8vw,28px);\r\n }\r\n\r\n .lis__logistics{\r\n margin-top:36px;\r\n }\r\n\r\n .lis__logistics-item{\r\n padding-block:22px 26px;\r\n }\r\n\r\n}\r\n\r\n\/* =========================================================\r\n SMALL MOBILE\r\n ========================================================= *\/\r\n@media (max-width:420px){\r\n\r\n .lis__shell{\r\n padding-inline:18px;\r\n }\r\n\r\n .lis__title{\r\n max-width:7.7ch;\r\n font-size:clamp(50px,14vw,62px);\r\n }\r\n\r\n .lis__hotel-name{\r\n font-size:clamp(23px,6.8vw,29px);\r\n }\r\n\r\n}\r\n\r\n\/* =========================================================\r\n RTL\r\n ========================================================= *\/\r\n[dir=\"rtl\"] #lamina-istanbul-stay .lis__intro,\r\n[dir=\"rtl\"] #lamina-istanbul-stay .lis__stage,\r\n[dir=\"rtl\"] #lamina-istanbul-stay .lis__logistics{\r\n direction:rtl;\r\n}\r\n\r\n[dir=\"rtl\"] #lamina-istanbul-stay .lis__hotel-btn,\r\n[dir=\"rtl\"] #lamina-istanbul-stay .lis__support,\r\n[dir=\"rtl\"] #lamina-istanbul-stay .lis__logistics-item{\r\n text-align:start;\r\n}\r\n\r\n\/* =========================================================\r\n REDUCED MOTION\r\n ========================================================= *\/\r\n@media (prefers-reduced-motion:reduce){\r\n\r\n #lamina-istanbul-stay *,\r\n #lamina-istanbul-stay *::before,\r\n #lamina-istanbul-stay *::after{\r\n scroll-behavior:auto !important;\r\n }\r\n\r\n #lamina-istanbul-stay [data-lis-depth]{\r\n --lis-entry-blur:0px !important;\r\n --lis-passed-blur:0px !important;\r\n --lis-depth-opacity:1 !important;\r\n\r\n filter:none !important;\r\n opacity:1 !important;\r\n }\r\n\r\n #lamina-istanbul-stay.has-entry .lis__eyebrow,\r\n #lamina-istanbul-stay.has-entry .lis__title-line,\r\n #lamina-istanbul-stay.has-entry .lis__support-wrap,\r\n #lamina-istanbul-stay.has-entry .lis__hotel-btn,\r\n #lamina-istanbul-stay.has-entry .lis__logistics-item{\r\n opacity:1 !important;\r\n transform:none !important;\r\n transition:none !important;\r\n }\r\n\r\n #lamina-istanbul-stay.has-entry .lis__visual-frame,\r\n #lamina-istanbul-stay.has-entry .lis__logistics{\r\n clip-path:none !important;\r\n transition:none !important;\r\n }\r\n\r\n #lamina-istanbul-stay .lis__image-layer{\r\n transition:opacity .12s linear !important;\r\n transform:none !important;\r\n clip-path:none !important;\r\n }\r\n\r\n}\r\n<\/style>\r\n\r\n<section\r\n id=\"lamina-istanbul-stay\"\r\n aria-labelledby=\"lamina-istanbul-stay-title\"\r\n data-lamina-focus-section\r\n>\r\n\r\n <div class=\"lis__shell\">\r\n\r\n <header class=\"lis__intro\">\r\n\r\n <div>\r\n <p\r\n class=\"lis__eyebrow\"\r\n data-lis-depth=\"eyebrow\"\r\n >\r\n 07 \u2014 YOUR ISTANBUL STAY\r\n <\/p>\r\n\r\n <h2\r\n class=\"lis__title\"\r\n id=\"lamina-istanbul-stay-title\"\r\n >\r\n <span\r\n class=\"lis__title-line\"\r\n data-lis-depth=\"headline\"\r\n >\r\n Your stay,\r\n <\/span>\r\n\r\n <span\r\n class=\"lis__title-line lis__title-line--accent\"\r\n data-lis-depth=\"headline\"\r\n >\r\n considered.\r\n <\/span>\r\n <\/h2>\r\n <\/div>\r\n\r\n <div\r\n class=\"lis__support-wrap\"\r\n data-lis-depth=\"copy\"\r\n >\r\n <p class=\"lis__support\">\r\n From arrival to accommodation and clinic visits, Lamina can help coordinate the practical parts of your stay in Istanbul around your treatment.\r\n <\/p>\r\n\r\n <p class=\"lis__micro\">\r\n ARRIVAL \u00b7 STAY \u00b7 CLINIC\r\n <\/p>\r\n <\/div>\r\n\r\n <\/header>\r\n\r\n <div class=\"lis__stage\">\r\n\r\n <div\r\n class=\"lis__visual\"\r\n data-lis-depth=\"media\"\r\n >\r\n\r\n <div\r\n class=\"lis__visual-frame\"\r\n aria-live=\"polite\"\r\n >\r\n\r\n <div\r\n class=\"lis__image-layer is-current is-fallback\"\r\n data-image-layer=\"current\"\r\n >\r\n <div class=\"lis__fallback-inner\" aria-hidden=\"true\"><\/div>\r\n\r\n <div class=\"lis__fallback-copy\">\r\n <span class=\"lis__fallback-kicker\">Partner stay imagery<\/span>\r\n <span class=\"lis__fallback-title\">Lamina-approved hotel photography to be supplied.<\/span>\r\n <\/div>\r\n <\/div>\r\n\r\n <div\r\n class=\"lis__image-layer\"\r\n data-image-layer=\"incoming\"\r\n ><\/div>\r\n\r\n <p class=\"lis__caption\">\r\n <span>PARTNER STAY<\/span>\r\n <br>\r\n <strong data-active-hotel-name>Ramada Alibeyk\u00f6y<\/strong>\r\n <\/p>\r\n\r\n <\/div>\r\n\r\n <\/div>\r\n\r\n <div\r\n class=\"lis__index\"\r\n role=\"group\"\r\n aria-label=\"Lamina partner hotel options\"\r\n data-lis-depth=\"ui\"\r\n >\r\n\r\n <button\r\n class=\"lis__hotel-btn\"\r\n type=\"button\"\r\n data-hotel-index=\"0\"\r\n aria-pressed=\"true\"\r\n >\r\n <span class=\"lis__hotel-no\">01<\/span>\r\n <span>\r\n <span class=\"lis__hotel-name\">Ramada Alibeyk\u00f6y<\/span>\r\n <span class=\"lis__hotel-verify\">Working name \u00b7 verify property<\/span>\r\n <\/span>\r\n <\/button>\r\n\r\n <button\r\n class=\"lis__hotel-btn\"\r\n type=\"button\"\r\n data-hotel-index=\"1\"\r\n aria-pressed=\"false\"\r\n >\r\n <span class=\"lis__hotel-no\">02<\/span>\r\n <span>\r\n <span class=\"lis__hotel-name\">Rixos Hotel<\/span>\r\n <span class=\"lis__hotel-verify\">Working name \u00b7 verify property<\/span>\r\n <\/span>\r\n <\/button>\r\n\r\n <button\r\n class=\"lis__hotel-btn\"\r\n type=\"button\"\r\n data-hotel-index=\"2\"\r\n aria-pressed=\"false\"\r\n >\r\n <span class=\"lis__hotel-no\">03<\/span>\r\n <span>\r\n <span class=\"lis__hotel-name\">Taksim Gonen Hotel<\/span>\r\n <span class=\"lis__hotel-verify\">Working name \u00b7 verify property<\/span>\r\n <\/span>\r\n <\/button>\r\n\r\n <button\r\n class=\"lis__hotel-btn\"\r\n type=\"button\"\r\n data-hotel-index=\"3\"\r\n aria-pressed=\"false\"\r\n >\r\n <span class=\"lis__hotel-no\">04<\/span>\r\n <span>\r\n <span class=\"lis__hotel-name\">Holiday Inn Hotel<\/span>\r\n <span class=\"lis__hotel-verify\">Working name \u00b7 verify property<\/span>\r\n <\/span>\r\n <\/button>\r\n\r\n <button\r\n class=\"lis__hotel-btn\"\r\n type=\"button\"\r\n data-hotel-index=\"4\"\r\n aria-pressed=\"false\"\r\n >\r\n <span class=\"lis__hotel-no\">05<\/span>\r\n <span>\r\n <span class=\"lis__hotel-name\">Movinbik Hotel<\/span>\r\n <span class=\"lis__hotel-verify\">Working name \u00b7 verify property<\/span>\r\n <\/span>\r\n <\/button>\r\n\r\n <\/div>\r\n\r\n <\/div>\r\n\r\n <div class=\"lis__logistics\">\r\n\r\n <article\r\n class=\"lis__logistics-item\"\r\n data-lis-depth=\"copy\"\r\n data-mobile-ready=\"false\"\r\n >\r\n <span class=\"lis__logistics-kicker\">01 \u2014 ARRIVAL<\/span>\r\n\r\n <h3 class=\"lis__logistics-title\">\r\n Your arrival can be coordinated.\r\n <\/h3>\r\n\r\n <p class=\"lis__logistics-copy\">\r\n VIP transfer support can help connect the airport with the accommodation arrangements applicable to your visit.\r\n <\/p>\r\n <\/article>\r\n\r\n <article\r\n class=\"lis__logistics-item\"\r\n data-lis-depth=\"copy\"\r\n data-mobile-ready=\"false\"\r\n >\r\n <span class=\"lis__logistics-kicker\">02 \u2014 STAY<\/span>\r\n\r\n <h3 class=\"lis__logistics-title\">\r\n Choose from Lamina\u2019s partner stay options.\r\n <\/h3>\r\n\r\n <p class=\"lis__logistics-copy\">\r\n Accommodation can be coordinated through Lamina\u2019s partner hotel relationships according to the patient\u2019s treatment arrangement and availability.\r\n <\/p>\r\n <\/article>\r\n\r\n <article\r\n class=\"lis__logistics-item\"\r\n data-lis-depth=\"copy\"\r\n data-mobile-ready=\"false\"\r\n >\r\n <span class=\"lis__logistics-kicker\">03 \u2014 CLINIC<\/span>\r\n\r\n <h3 class=\"lis__logistics-title\">\r\n Keep treatment at the centre of the visit.\r\n <\/h3>\r\n\r\n <p class=\"lis__logistics-copy\">\r\n Clinic-visit transportation and international-patient support can be coordinated around the planned treatment schedule where applicable.\r\n <\/p>\r\n <\/article>\r\n\r\n <\/div>\r\n\r\n <\/div>\r\n\r\n<\/section>\r\n\r\n<script>\r\n(() => {\r\n\r\n const root =\r\n document.getElementById(\r\n 'lamina-istanbul-stay'\r\n );\r\n\r\n\r\n if (\r\n !root ||\r\n root.dataset.stayIndexReady ===\r\n 'true'\r\n ) return;\r\n\r\n\r\n root.dataset.stayIndexReady =\r\n 'true';\r\n\r\n\r\n const reducedMotion =\r\n window.matchMedia(\r\n '(prefers-reduced-motion: reduce)'\r\n );\r\n\r\n\r\n const compactQuery =\r\n window.matchMedia(\r\n '(max-width:899px)'\r\n );\r\n\r\n\r\n const hotelButtons =\r\n [\r\n ...root.querySelectorAll(\r\n '[data-hotel-index]'\r\n )\r\n ];\r\n\r\n\r\n const currentLayer =\r\n root.querySelector(\r\n '[data-image-layer=\"current\"]'\r\n );\r\n\r\n\r\n const incomingLayer =\r\n root.querySelector(\r\n '[data-image-layer=\"incoming\"]'\r\n );\r\n\r\n\r\n const activeHotelName =\r\n root.querySelector(\r\n '[data-active-hotel-name]'\r\n );\r\n\r\n\r\n const logisticsRows =\r\n [\r\n ...root.querySelectorAll(\r\n '.lis__logistics-item'\r\n )\r\n ];\r\n\r\n\r\n const hotels =\r\n [\r\n {\r\n id:'ramada-alibeykoy',\r\n index:0,\r\n workingName:'Ramada Alibeyk\u00f6y',\r\n verifiedOfficialName:'',\r\n location:'',\r\n image:'',\r\n imageWidth:0,\r\n imageHeight:0,\r\n objectPositionDesktop:'50% 50%',\r\n objectPositionTablet:'50% 50%',\r\n objectPositionMobile:'50% 50%',\r\n alt:'',\r\n verificationStatus:'verify-official-property'\r\n },\r\n {\r\n id:'rixos',\r\n index:1,\r\n workingName:'Rixos Hotel',\r\n verifiedOfficialName:'',\r\n location:'',\r\n image:'',\r\n imageWidth:0,\r\n imageHeight:0,\r\n objectPositionDesktop:'50% 50%',\r\n objectPositionTablet:'50% 50%',\r\n objectPositionMobile:'50% 50%',\r\n alt:'',\r\n verificationStatus:'verify-official-property'\r\n },\r\n {\r\n id:'taksim-gonen',\r\n index:2,\r\n workingName:'Taksim Gonen Hotel',\r\n verifiedOfficialName:'',\r\n location:'',\r\n image:'',\r\n imageWidth:0,\r\n imageHeight:0,\r\n objectPositionDesktop:'50% 50%',\r\n objectPositionTablet:'50% 50%',\r\n objectPositionMobile:'50% 50%',\r\n alt:'',\r\n verificationStatus:'verify-official-property'\r\n },\r\n {\r\n id:'holiday-inn',\r\n index:3,\r\n workingName:'Holiday Inn Hotel',\r\n verifiedOfficialName:'',\r\n location:'',\r\n image:'',\r\n imageWidth:0,\r\n imageHeight:0,\r\n objectPositionDesktop:'50% 50%',\r\n objectPositionTablet:'50% 50%',\r\n objectPositionMobile:'50% 50%',\r\n alt:'',\r\n verificationStatus:'verify-official-property'\r\n },\r\n {\r\n id:'movinbik',\r\n index:4,\r\n workingName:'Movinbik Hotel',\r\n verifiedOfficialName:'',\r\n location:'',\r\n image:'',\r\n imageWidth:0,\r\n imageHeight:0,\r\n objectPositionDesktop:'50% 50%',\r\n objectPositionTablet:'50% 50%',\r\n objectPositionMobile:'50% 50%',\r\n alt:'',\r\n verificationStatus:'verify-official-property'\r\n }\r\n ];\r\n\r\n\r\n let activeHotelIndex =\r\n 0;\r\n\r\n\r\n let previewHotelIndex =\r\n null;\r\n\r\n\r\n let transitionToken =\r\n 0;\r\n\r\n\r\n let entryPlayed =\r\n false;\r\n\r\n\r\n let entryObserver =\r\n null;\r\n\r\n\r\n let mobileRowsObserver =\r\n null;\r\n\r\n\r\n function clamp(\r\n value,\r\n min,\r\n max\r\n ){\r\n\r\n return Math.min(\r\n max,\r\n Math.max(\r\n min,\r\n value\r\n )\r\n );\r\n\r\n }\r\n\r\n\r\n function getObjectPosition(\r\n hotel\r\n ){\r\n\r\n if (\r\n window.innerWidth <=\r\n 899\r\n ){\r\n\r\n return (\r\n hotel.objectPositionMobile ||\r\n '50% 50%'\r\n );\r\n\r\n }\r\n\r\n\r\n if (\r\n window.innerWidth <=\r\n 1180\r\n ){\r\n\r\n return (\r\n hotel.objectPositionTablet ||\r\n hotel.objectPositionDesktop ||\r\n '50% 50%'\r\n );\r\n\r\n }\r\n\r\n\r\n return (\r\n hotel.objectPositionDesktop ||\r\n '50% 50%'\r\n );\r\n\r\n }\r\n\r\n\r\n function renderFallback(\r\n layer,\r\n hotel\r\n ){\r\n\r\n layer.className =\r\n 'lis__image-layer is-fallback';\r\n\r\n\r\n layer.innerHTML =\r\n '<div class=\"lis__fallback-inner\" aria-hidden=\"true\"><\/div>' +\r\n '<div class=\"lis__fallback-copy\">' +\r\n '<span class=\"lis__fallback-kicker\">Partner stay imagery<\/span>' +\r\n '<span class=\"lis__fallback-title\">' +\r\n hotel.workingName +\r\n '<\/span>' +\r\n '<\/div>';\r\n\r\n }\r\n\r\n\r\n function renderImage(\r\n layer,\r\n hotel\r\n ){\r\n\r\n layer.className =\r\n 'lis__image-layer';\r\n\r\n\r\n layer.innerHTML =\r\n '';\r\n\r\n\r\n if (\r\n !hotel.image\r\n ){\r\n\r\n renderFallback(\r\n layer,\r\n hotel\r\n );\r\n\r\n\r\n return Promise.resolve(\r\n false\r\n );\r\n\r\n }\r\n\r\n\r\n return new Promise(\r\n resolve => {\r\n\r\n const image =\r\n new Image();\r\n\r\n\r\n image.decoding =\r\n 'async';\r\n\r\n\r\n image.alt =\r\n hotel.alt ||\r\n hotel.workingName;\r\n\r\n\r\n if (\r\n hotel.imageWidth >\r\n 0\r\n ){\r\n\r\n image.width =\r\n hotel.imageWidth;\r\n\r\n }\r\n\r\n\r\n if (\r\n hotel.imageHeight >\r\n 0\r\n ){\r\n\r\n image.height =\r\n hotel.imageHeight;\r\n\r\n }\r\n\r\n\r\n image.style.setProperty(\r\n '--lis-object-position',\r\n getObjectPosition(\r\n hotel\r\n )\r\n );\r\n\r\n\r\n image.onload =\r\n async () => {\r\n\r\n try{\r\n await image.decode?.();\r\n }catch(_error){\r\n \/* decode() may reject after a successful load in some browsers *\/\r\n }\r\n\r\n\r\n layer.appendChild(\r\n image\r\n );\r\n\r\n\r\n resolve(\r\n true\r\n );\r\n\r\n };\r\n\r\n\r\n image.onerror =\r\n () => {\r\n\r\n resolve(\r\n false\r\n );\r\n\r\n };\r\n\r\n\r\n image.src =\r\n hotel.image;\r\n\r\n }\r\n );\r\n\r\n }\r\n\r\n\r\n function updateButtonState(\r\n visualIndex\r\n ){\r\n\r\n hotelButtons.forEach(\r\n (\r\n button,\r\n index\r\n ) => {\r\n\r\n button.setAttribute(\r\n 'aria-pressed',\r\n index ===\r\n visualIndex\r\n ? 'true'\r\n : 'false'\r\n );\r\n\r\n }\r\n );\r\n\r\n }\r\n\r\n\r\n async function showHotel(\r\n index,\r\n {\r\n commit =\r\n true\r\n } =\r\n {}\r\n ){\r\n\r\n const safeIndex =\r\n clamp(\r\n Number(\r\n index\r\n ) || 0,\r\n 0,\r\n hotels.length - 1\r\n );\r\n\r\n\r\n const hotel =\r\n hotels[\r\n safeIndex\r\n ];\r\n\r\n\r\n const token =\r\n ++transitionToken;\r\n\r\n\r\n updateButtonState(\r\n safeIndex\r\n );\r\n\r\n\r\n activeHotelName.textContent =\r\n hotel.workingName;\r\n\r\n\r\n if (\r\n commit\r\n ){\r\n\r\n activeHotelIndex =\r\n safeIndex;\r\n\r\n }\r\n\r\n\r\n const hasImage =\r\n await renderImage(\r\n incomingLayer,\r\n hotel\r\n );\r\n\r\n\r\n if (\r\n token !==\r\n transitionToken\r\n ) return;\r\n\r\n\r\n \/*\r\n If no approved hotel image is supplied yet,\r\n still allow the editorial fallback to transition.\r\n *\/\r\n if (\r\n !hasImage\r\n ){\r\n\r\n incomingLayer.classList.add(\r\n 'is-fallback'\r\n );\r\n\r\n }\r\n\r\n\r\n if (\r\n reducedMotion.matches\r\n ){\r\n\r\n currentLayer.innerHTML =\r\n incomingLayer.innerHTML;\r\n\r\n\r\n currentLayer.className =\r\n incomingLayer.className +\r\n ' is-current';\r\n\r\n\r\n incomingLayer.innerHTML =\r\n '';\r\n\r\n\r\n incomingLayer.className =\r\n 'lis__image-layer';\r\n\r\n\r\n return;\r\n\r\n }\r\n\r\n\r\n incomingLayer.classList.add(\r\n 'is-transitioning-in'\r\n );\r\n\r\n\r\n currentLayer.classList.add(\r\n 'is-transitioning-out'\r\n );\r\n\r\n\r\n window.setTimeout(\r\n () => {\r\n\r\n if (\r\n token !==\r\n transitionToken\r\n ) return;\r\n\r\n\r\n currentLayer.innerHTML =\r\n incomingLayer.innerHTML;\r\n\r\n\r\n currentLayer.className =\r\n incomingLayer.className\r\n .replace(\r\n 'is-transitioning-in',\r\n ''\r\n )\r\n .trim() +\r\n ' is-current';\r\n\r\n\r\n incomingLayer.innerHTML =\r\n '';\r\n\r\n\r\n incomingLayer.className =\r\n 'lis__image-layer';\r\n\r\n },\r\n 720\r\n );\r\n\r\n }\r\n\r\n\r\n hotelButtons.forEach(\r\n (\r\n button,\r\n index\r\n ) => {\r\n\r\n button.addEventListener(\r\n 'click',\r\n () => {\r\n\r\n previewHotelIndex =\r\n null;\r\n\r\n\r\n showHotel(\r\n index,\r\n {\r\n commit:true\r\n }\r\n );\r\n\r\n }\r\n );\r\n\r\n\r\n button.addEventListener(\r\n 'focus',\r\n () => {\r\n\r\n showHotel(\r\n index,\r\n {\r\n commit:false\r\n }\r\n );\r\n\r\n }\r\n );\r\n\r\n }\r\n );\r\n\r\n\r\n \/*\r\n Fine-pointer hover preview:\r\n temporary only. Pointer leave restores locked active hotel.\r\n *\/\r\n if (\r\n window.matchMedia(\r\n '(hover:hover) and (pointer:fine)'\r\n ).matches\r\n ){\r\n\r\n hotelButtons.forEach(\r\n (\r\n button,\r\n index\r\n ) => {\r\n\r\n button.addEventListener(\r\n 'mouseenter',\r\n () => {\r\n\r\n previewHotelIndex =\r\n index;\r\n\r\n\r\n showHotel(\r\n index,\r\n {\r\n commit:false\r\n }\r\n );\r\n\r\n }\r\n );\r\n\r\n\r\n button.addEventListener(\r\n 'mouseleave',\r\n () => {\r\n\r\n if (\r\n previewHotelIndex !==\r\n index\r\n ) return;\r\n\r\n\r\n previewHotelIndex =\r\n null;\r\n\r\n\r\n showHotel(\r\n activeHotelIndex,\r\n {\r\n commit:false\r\n }\r\n );\r\n\r\n }\r\n );\r\n\r\n }\r\n );\r\n\r\n }\r\n\r\n\r\n \/* =======================================================\r\n ENTRANCE \u2014 ONCE\r\n ======================================================= *\/\r\n\r\n function cleanupEntrance(){\r\n\r\n window.setTimeout(\r\n () => {\r\n\r\n root.classList.remove(\r\n 'has-entry'\r\n );\r\n\r\n },\r\n 2050\r\n );\r\n\r\n }\r\n\r\n\r\n function initEntrance(){\r\n\r\n entryObserver?.disconnect();\r\n\r\n\r\n if (\r\n reducedMotion.matches ||\r\n entryPlayed ||\r\n !(\r\n 'IntersectionObserver' in window\r\n )\r\n ){\r\n\r\n return;\r\n\r\n }\r\n\r\n\r\n root.classList.add(\r\n 'has-entry'\r\n );\r\n\r\n\r\n entryObserver =\r\n new IntersectionObserver(\r\n entries => {\r\n\r\n entries.forEach(\r\n entry => {\r\n\r\n if (\r\n !entry.isIntersecting\r\n ) return;\r\n\r\n\r\n entryPlayed =\r\n true;\r\n\r\n\r\n requestAnimationFrame(\r\n () => {\r\n\r\n root.classList.add(\r\n 'is-entered'\r\n );\r\n\r\n\r\n cleanupEntrance();\r\n\r\n }\r\n );\r\n\r\n\r\n entryObserver.disconnect();\r\n\r\n }\r\n );\r\n\r\n },\r\n {\r\n rootMargin:'0px 0px -18% 0px',\r\n threshold:.02\r\n }\r\n );\r\n\r\n\r\n entryObserver.observe(\r\n root\r\n );\r\n\r\n }\r\n\r\n\r\n \/* =======================================================\r\n MOBILE LOGISTICS ENTRANCE\r\n ======================================================= *\/\r\n\r\n function initMobileRows(){\r\n\r\n mobileRowsObserver?.disconnect();\r\n\r\n\r\n root.classList.remove(\r\n 'has-mobile-rows'\r\n );\r\n\r\n\r\n if (\r\n !compactQuery.matches ||\r\n reducedMotion.matches ||\r\n !(\r\n 'IntersectionObserver' in window\r\n )\r\n ){\r\n\r\n logisticsRows.forEach(\r\n row => {\r\n\r\n row.dataset.mobileReady =\r\n 'true';\r\n\r\n }\r\n );\r\n\r\n\r\n return;\r\n\r\n }\r\n\r\n\r\n root.classList.add(\r\n 'has-mobile-rows'\r\n );\r\n\r\n\r\n mobileRowsObserver =\r\n new IntersectionObserver(\r\n entries => {\r\n\r\n entries.forEach(\r\n entry => {\r\n\r\n if (\r\n !entry.isIntersecting\r\n ) return;\r\n\r\n\r\n entry.target.dataset.mobileReady =\r\n 'true';\r\n\r\n\r\n mobileRowsObserver.unobserve(\r\n entry.target\r\n );\r\n\r\n }\r\n );\r\n\r\n },\r\n {\r\n rootMargin:'0px 0px -18% 0px',\r\n threshold:.04\r\n }\r\n );\r\n\r\n\r\n logisticsRows.forEach(\r\n row => {\r\n\r\n if (\r\n row.dataset.mobileReady !==\r\n 'true'\r\n ){\r\n\r\n row.dataset.mobileReady =\r\n 'false';\r\n\r\n }\r\n\r\n\r\n mobileRowsObserver.observe(\r\n row\r\n );\r\n\r\n }\r\n );\r\n\r\n }\r\n\r\n\r\n \/* =======================================================\r\n PASSED-CONTENT DEPTH\r\n Current \/ upcoming content stays sharp.\r\n Only genuinely passed content softens.\r\n ======================================================= *\/\r\n\r\n const depthLayers =\r\n [\r\n ...root.querySelectorAll(\r\n '[data-lis-depth]'\r\n )\r\n ];\r\n\r\n\r\n const depthProfiles =\r\n {\r\n\r\n desktop:{\r\n\r\n eyebrow:{\r\n start:.30,\r\n full:-.12,\r\n blur:2.4,\r\n opacityMin:.96\r\n },\r\n\r\n headline:{\r\n start:.28,\r\n full:-.15,\r\n blur:3.6,\r\n opacityMin:.95\r\n },\r\n\r\n copy:{\r\n start:.23,\r\n full:-.17,\r\n blur:2.0,\r\n opacityMin:.97\r\n },\r\n\r\n ui:{\r\n start:.14,\r\n full:-.20,\r\n blur:1.65,\r\n opacityMin:.98\r\n },\r\n\r\n media:{\r\n start:.08,\r\n full:-.24,\r\n blur:2.35,\r\n opacityMin:.985\r\n }\r\n\r\n },\r\n\r\n mobile:{\r\n\r\n eyebrow:{\r\n start:.22,\r\n full:-.14,\r\n blur:1.65,\r\n opacityMin:.97\r\n },\r\n\r\n headline:{\r\n start:.20,\r\n full:-.16,\r\n blur:2.4,\r\n opacityMin:.97\r\n },\r\n\r\n copy:{\r\n start:.15,\r\n full:-.18,\r\n blur:1.35,\r\n opacityMin:.98\r\n },\r\n\r\n ui:{\r\n start:.10,\r\n full:-.21,\r\n blur:1.05,\r\n opacityMin:.985\r\n },\r\n\r\n media:{\r\n start:.06,\r\n full:-.24,\r\n blur:1.55,\r\n opacityMin:.99\r\n }\r\n\r\n }\r\n\r\n };\r\n\r\n\r\n let depthTicking =\r\n false;\r\n\r\n\r\n function smoothstep(\r\n value\r\n ){\r\n\r\n const t =\r\n clamp(\r\n value,\r\n 0,\r\n 1\r\n );\r\n\r\n\r\n return (\r\n t *\r\n t *\r\n (\r\n 3 -\r\n 2 *\r\n t\r\n )\r\n );\r\n\r\n }\r\n\r\n\r\n function updateDepth(){\r\n\r\n depthTicking =\r\n false;\r\n\r\n\r\n const vh =\r\n Math.max(\r\n 1,\r\n window.innerHeight ||\r\n document.documentElement.clientHeight\r\n );\r\n\r\n\r\n const set =\r\n compactQuery.matches\r\n ? depthProfiles.mobile\r\n : depthProfiles.desktop;\r\n\r\n\r\n depthLayers.forEach(\r\n element => {\r\n\r\n const type =\r\n element.dataset.lisDepth ||\r\n 'copy';\r\n\r\n\r\n const config =\r\n set[\r\n type\r\n ] ||\r\n set.copy;\r\n\r\n\r\n const rect =\r\n element.getBoundingClientRect();\r\n\r\n\r\n const center =\r\n rect.top +\r\n rect.height *\r\n .5;\r\n\r\n\r\n const startY =\r\n vh *\r\n config.start;\r\n\r\n\r\n const fullY =\r\n vh *\r\n config.full;\r\n\r\n\r\n let progress =\r\n center <\r\n startY\r\n ? (\r\n startY -\r\n center\r\n ) \/\r\n Math.max(\r\n 1,\r\n startY -\r\n fullY\r\n )\r\n : 0;\r\n\r\n\r\n progress =\r\n smoothstep(\r\n progress\r\n );\r\n\r\n\r\n const activeInteraction =\r\n element.matches(\r\n ':hover, :focus-within'\r\n );\r\n\r\n\r\n if (\r\n activeInteraction\r\n ){\r\n\r\n progress =\r\n 0;\r\n\r\n }\r\n\r\n\r\n const blur =\r\n reducedMotion.matches\r\n ? 0\r\n : (\r\n config.blur *\r\n progress\r\n );\r\n\r\n\r\n const opacity =\r\n reducedMotion.matches\r\n ? 1\r\n : (\r\n 1 -\r\n (\r\n 1 -\r\n config.opacityMin\r\n ) *\r\n progress\r\n );\r\n\r\n\r\n element.style.setProperty(\r\n '--lis-passed-blur',\r\n blur.toFixed(\r\n 2\r\n ) +\r\n 'px'\r\n );\r\n\r\n\r\n element.style.setProperty(\r\n '--lis-depth-opacity',\r\n opacity.toFixed(\r\n 3\r\n )\r\n );\r\n\r\n }\r\n );\r\n\r\n }\r\n\r\n\r\n function requestDepthUpdate(){\r\n\r\n if (\r\n depthTicking\r\n ) return;\r\n\r\n\r\n depthTicking =\r\n true;\r\n\r\n\r\n requestAnimationFrame(\r\n updateDepth\r\n );\r\n\r\n }\r\n\r\n\r\n window.addEventListener(\r\n 'scroll',\r\n requestDepthUpdate,\r\n {\r\n passive:true\r\n }\r\n );\r\n\r\n\r\n window.addEventListener(\r\n 'resize',\r\n requestDepthUpdate,\r\n {\r\n passive:true\r\n }\r\n );\r\n\r\n\r\n function handleModeChange(){\r\n\r\n initMobileRows();\r\n requestDepthUpdate();\r\n\r\n }\r\n\r\n\r\n compactQuery.addEventListener?.(\r\n 'change',\r\n handleModeChange\r\n );\r\n\r\n\r\n reducedMotion.addEventListener?.(\r\n 'change',\r\n () => {\r\n\r\n initMobileRows();\r\n requestDepthUpdate();\r\n\r\n }\r\n );\r\n\r\n\r\n \/* =======================================================\r\n INITIALIZE\r\n ======================================================= *\/\r\n\r\n updateButtonState(\r\n activeHotelIndex\r\n );\r\n\r\n\r\n renderFallback(\r\n currentLayer,\r\n hotels[\r\n activeHotelIndex\r\n ]\r\n );\r\n\r\n\r\n currentLayer.classList.add(\r\n 'is-current'\r\n );\r\n\r\n\r\n activeHotelName.textContent =\r\n hotels[\r\n activeHotelIndex\r\n ].workingName;\r\n\r\n\r\n initEntrance();\r\n initMobileRows();\r\n requestDepthUpdate();\r\n\r\n})();\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-9140c1e e-con-full e-flex e-con e-parent\" data-id=\"9140c1e\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-25a19a6 elementor-widget elementor-widget-html\" data-id=\"25a19a6\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- =========================================================\r\nLAMINA CLINIC \u2014 SECTION 08\r\nFAQ \/ DECISION SUPPORT\r\nCONCEPT: THE DECISION LEDGER\r\nV1 \u2014 FINAL \/ LOCKED-RULE AUDITED\r\n\r\nDESIGN:\r\nLIGHT \/ EDITORIAL \/ CALM \/ HIGH-CONFIDENCE \/ CONVERSION-AWARE\r\n\r\nIMPORTANT:\r\n- This is NOT a generic accordion.\r\n- No cards, rounded FAQ boxes, icon circles, glassmorphism or decorative shapes.\r\n- Mobile is independently art-directed.\r\n- Current\/upcoming content stays sharp.\r\n- Only genuinely passed content softly blurs.\r\n- Exact operational\/medical details remain cautious where Lamina confirmation is still required.\r\n========================================================= -->\r\n\r\n<style>\r\n@import url('https:\/\/fonts.googleapis.com\/css2?family=Cormorant+Garamond:ital,wght@0,400;0,500;1,400&family=Manrope:wght@400;500;600&display=swap');\r\n\r\n#lamina-decision-faq{\r\n --df-ivory:#F7F2EA;\r\n --df-ivory-2:#F3ECE8;\r\n --df-stone:#E8E1E4;\r\n --df-aubergine:#2B142F;\r\n --df-plum:#5F2468;\r\n --df-orchid:#94709A;\r\n --df-lilac:#C5B2C8;\r\n --df-champagne:#D8C4A1;\r\n --df-rule:rgba(43,20,47,.12);\r\n --df-rule-strong:rgba(43,20,47,.18);\r\n --df-ease:cubic-bezier(.16,.70,.18,1);\r\n --df-stage:1540px;\r\n\r\n --e-global-color-primary:#2B142F;\r\n --e-global-color-secondary:#94709A;\r\n --e-global-color-text:#2B142F;\r\n --e-global-color-accent:#5F2468;\r\n\r\n position:relative;\r\n width:100%;\r\n overflow:hidden;\r\n\r\n background:\r\n radial-gradient(42% 34% at 5% 8%,rgba(197,178,200,.10),transparent 72%),\r\n var(--df-ivory);\r\n\r\n color:var(--df-aubergine);\r\n\r\n font-family:\"Manrope\",system-ui,-apple-system,BlinkMacSystemFont,\"Segoe UI\",sans-serif;\r\n\r\n -webkit-tap-highlight-color:rgba(95,36,104,.08);\r\n}\r\n\r\n#lamina-decision-faq *,\r\n#lamina-decision-faq *::before,\r\n#lamina-decision-faq *::after{\r\n box-sizing:border-box;\r\n}\r\n\r\n#lamina-decision-faq ::selection{\r\n background:var(--df-plum);\r\n color:var(--df-ivory);\r\n}\r\n\r\n\/* =========================================================\r\n ELEMENTOR \/ THEME PINK PROTECTION \u2014 SECTION SCOPED\r\n ========================================================= *\/\r\n\r\n#lamina-decision-faq a,\r\n#lamina-decision-faq a:link,\r\n#lamina-decision-faq a:visited,\r\n#lamina-decision-faq a:hover,\r\n#lamina-decision-faq a:focus,\r\n#lamina-decision-faq a:focus-visible,\r\n#lamina-decision-faq a:active,\r\n#lamina-decision-faq button,\r\n#lamina-decision-faq button:hover,\r\n#lamina-decision-faq button:focus,\r\n#lamina-decision-faq button:focus-visible,\r\n#lamina-decision-faq button:active{\r\n text-decoration-color:var(--df-plum) !important;\r\n}\r\n\r\n#lamina-decision-faq .df__category,\r\n#lamina-decision-faq .df__category:visited,\r\n#lamina-decision-faq .df__category:hover,\r\n#lamina-decision-faq .df__category:focus,\r\n#lamina-decision-faq .df__category:focus-visible,\r\n#lamina-decision-faq .df__category:active,\r\n#lamina-decision-faq .df__question-button,\r\n#lamina-decision-faq .df__question-button:visited,\r\n#lamina-decision-faq .df__question-button:hover,\r\n#lamina-decision-faq .df__question-button:focus,\r\n#lamina-decision-faq .df__question-button:focus-visible,\r\n#lamina-decision-faq .df__question-button:active{\r\n background-color:transparent !important;\r\n box-shadow:none !important;\r\n border-color:transparent !important;\r\n}\r\n\r\n#lamina-decision-faq .df__category{\r\n color:var(--df-orchid) !important;\r\n}\r\n\r\n#lamina-decision-faq .df__category:hover,\r\n#lamina-decision-faq .df__category:focus-visible,\r\n#lamina-decision-faq .df__category[aria-pressed=\"true\"]{\r\n color:var(--df-aubergine) !important;\r\n}\r\n\r\n#lamina-decision-faq .df__category::after{\r\n background-color:var(--df-plum) !important;\r\n}\r\n\r\n#lamina-decision-faq .df__question-button{\r\n color:var(--df-aubergine) !important;\r\n}\r\n\r\n#lamina-decision-faq .df__question-button:hover,\r\n#lamina-decision-faq .df__question-button:focus-visible{\r\n color:var(--df-plum) !important;\r\n}\r\n\r\n#lamina-decision-faq .df__faq-row.is-open .df__question-button{\r\n color:var(--df-aubergine) !important;\r\n}\r\n\r\n#lamina-decision-faq .df__disclosure::before,\r\n#lamina-decision-faq .df__disclosure::after{\r\n background-color:var(--df-aubergine) !important;\r\n}\r\n\r\n#lamina-decision-faq .df__faq-row.is-open .df__disclosure::before,\r\n#lamina-decision-faq .df__faq-row.is-open .df__disclosure::after,\r\n#lamina-decision-faq .df__question-button:hover .df__disclosure::before,\r\n#lamina-decision-faq .df__question-button:hover .df__disclosure::after,\r\n#lamina-decision-faq .df__question-button:focus-visible .df__disclosure::before,\r\n#lamina-decision-faq .df__question-button:focus-visible .df__disclosure::after{\r\n background-color:var(--df-plum) !important;\r\n}\r\n\r\n#lamina-decision-faq .df__bridge-link,\r\n#lamina-decision-faq .df__bridge-link:link,\r\n#lamina-decision-faq .df__bridge-link:visited,\r\n#lamina-decision-faq .df__bridge-link:hover,\r\n#lamina-decision-faq .df__bridge-link:focus,\r\n#lamina-decision-faq .df__bridge-link:focus-visible,\r\n#lamina-decision-faq .df__bridge-link:active{\r\n color:var(--df-aubergine) !important;\r\n background:transparent !important;\r\n border-color:transparent !important;\r\n box-shadow:none !important;\r\n}\r\n\r\n#lamina-decision-faq .df__bridge-link::after{\r\n background-color:var(--df-plum) !important;\r\n}\r\n\r\n#lamina-decision-faq .df__category:focus-visible,\r\n#lamina-decision-faq .df__question-button:focus-visible,\r\n#lamina-decision-faq .df__bridge-link:focus-visible{\r\n outline:1px solid rgba(95,36,104,.58) !important;\r\n outline-offset:5px !important;\r\n}\r\n\r\n\/* =========================================================\r\n SHELL\r\n ========================================================= *\/\r\n\r\n.df__shell{\r\n width:min(100%,1700px);\r\n margin-inline:auto;\r\n\r\n padding:\r\n clamp(82px,9vh,118px)\r\n clamp(22px,3.5vw,66px)\r\n clamp(98px,10vh,138px);\r\n}\r\n\r\n.df__layout{\r\n width:min(100%,var(--df-stage));\r\n margin-inline:auto;\r\n\r\n display:grid;\r\n grid-template-columns:minmax(300px,.35fr) minmax(0,.65fr);\r\n gap:clamp(70px,8vw,142px);\r\n align-items:start;\r\n}\r\n\r\n\/* =========================================================\r\n LEFT EDITORIAL COLUMN\r\n ========================================================= *\/\r\n\r\n.df__editorial{\r\n min-width:0;\r\n}\r\n\r\n.df__eyebrow{\r\n margin:0 0 17px;\r\n\r\n color:rgba(95,36,104,.76);\r\n\r\n font-size:clamp(11px,.70vw,13px);\r\n line-height:1.2;\r\n font-weight:600;\r\n letter-spacing:.17em;\r\n text-transform:uppercase;\r\n}\r\n\r\n.df__title{\r\n margin:0;\r\n\r\n max-width:8.4ch;\r\n overflow:visible;\r\n\r\n color:var(--df-aubergine);\r\n\r\n font-family:\"Cormorant Garamond\",Georgia,serif;\r\n font-size:clamp(58px,4.8vw,86px);\r\n line-height:1;\r\n font-weight:400;\r\n letter-spacing:-.050em;\r\n}\r\n\r\n.df__title-line{\r\n display:block;\r\n width:max-content;\r\n max-width:100%;\r\n\r\n line-height:.90;\r\n}\r\n\r\n.df__title-line + .df__title-line{\r\n margin-top:-.045em;\r\n}\r\n\r\n.df__title-line--accent{\r\n margin-top:.038em !important;\r\n\r\n padding-inline-end:.055em;\r\n padding-bottom:.085em;\r\n\r\n color:var(--df-orchid);\r\n\r\n font-style:italic;\r\n letter-spacing:-.038em;\r\n line-height:.93;\r\n}\r\n\r\n.df__support{\r\n margin:clamp(24px,3vh,34px) 0 0;\r\n\r\n max-width:36ch;\r\n\r\n color:rgba(43,20,47,.64);\r\n\r\n font-size:clamp(15px,1vw,17px);\r\n line-height:1.70;\r\n}\r\n\r\n.df__context{\r\n margin:clamp(34px,4vh,48px) 0 0;\r\n\r\n color:rgba(43,20,47,.52);\r\n\r\n font-size:13px;\r\n line-height:1.55;\r\n}\r\n\r\n.df__bridge{\r\n margin-top:13px;\r\n}\r\n\r\n.df__bridge-link{\r\n position:relative;\r\n\r\n display:inline-flex;\r\n align-items:center;\r\n\r\n min-height:44px;\r\n padding:4px 0 7px;\r\n\r\n color:var(--df-aubergine);\r\n\r\n font-size:11.5px;\r\n line-height:1.2;\r\n font-weight:600;\r\n letter-spacing:.10em;\r\n text-transform:uppercase;\r\n text-decoration:none;\r\n}\r\n\r\n.df__bridge-link::after{\r\n content:\"\";\r\n\r\n position:absolute;\r\n inset-inline:0;\r\n inset-block-end:2px;\r\n\r\n height:1px;\r\n\r\n opacity:.55;\r\n\r\n transform:scaleX(.58);\r\n transform-origin:0 50%;\r\n\r\n transition:\r\n transform .48s var(--df-ease),\r\n opacity .36s ease;\r\n}\r\n\r\n[dir=\"rtl\"] .df__bridge-link::after{\r\n transform-origin:100% 50%;\r\n}\r\n\r\n.df__bridge-link:hover::after,\r\n.df__bridge-link:focus-visible::after{\r\n transform:scaleX(1);\r\n opacity:1;\r\n}\r\n\r\n\/* =========================================================\r\n LEDGER\r\n ========================================================= *\/\r\n\r\n.df__ledger{\r\n min-width:0;\r\n}\r\n\r\n.df__categories{\r\n display:grid;\r\n grid-template-columns:repeat(3,max-content);\r\n justify-content:start;\r\n gap:clamp(30px,3.5vw,58px);\r\n\r\n min-height:44px;\r\n\r\n margin-bottom:18px;\r\n}\r\n\r\n.df__category{\r\n position:relative;\r\n\r\n display:inline-flex;\r\n align-items:center;\r\n\r\n min-height:44px;\r\n padding:0 0 9px;\r\n\r\n border:0;\r\n border-radius:0;\r\n\r\n appearance:none;\r\n cursor:pointer;\r\n\r\n color:var(--df-orchid);\r\n\r\n font-family:\"Manrope\",sans-serif;\r\n font-size:11.5px;\r\n line-height:1.2;\r\n font-weight:600;\r\n letter-spacing:.12em;\r\n text-transform:uppercase;\r\n\r\n transition:\r\n color .32s ease,\r\n opacity .32s ease;\r\n}\r\n\r\n.df__category::after{\r\n content:\"\";\r\n\r\n position:absolute;\r\n\r\n inset-inline-start:0;\r\n inset-block-end:0;\r\n\r\n width:32px;\r\n height:1px;\r\n\r\n transform:scaleX(0);\r\n transform-origin:0 50%;\r\n\r\n transition:\r\n transform .44s var(--df-ease);\r\n}\r\n\r\n[dir=\"rtl\"] .df__category::after{\r\n transform-origin:100% 50%;\r\n}\r\n\r\n.df__category[aria-pressed=\"true\"]::after{\r\n transform:scaleX(1);\r\n}\r\n\r\n.df__ledger-frame{\r\n position:relative;\r\n\r\n border-top:1px solid var(--df-rule-strong);\r\n border-bottom:1px solid var(--df-rule);\r\n}\r\n\r\n.df__rows{\r\n position:relative;\r\n\r\n transition:\r\n opacity .24s ease,\r\n transform .40s var(--df-ease);\r\n}\r\n\r\n.df__ledger.is-switching .df__rows{\r\n opacity:.16;\r\n transform:translate3d(0,4px,0);\r\n}\r\n\r\n.df__faq-row{\r\n position:relative;\r\n\r\n border-bottom:1px solid var(--df-rule);\r\n}\r\n\r\n.df__faq-row:last-child{\r\n border-bottom:0;\r\n}\r\n\r\n.df__question-button{\r\n display:grid;\r\n grid-template-columns:52px minmax(0,1fr) 34px;\r\n gap:clamp(17px,2vw,26px);\r\n align-items:center;\r\n\r\n width:100%;\r\n min-height:88px;\r\n\r\n padding:\r\n clamp(24px,2.5vh,31px)\r\n 0;\r\n\r\n border:0;\r\n border-radius:0;\r\n\r\n appearance:none;\r\n cursor:pointer;\r\n\r\n text-align:start;\r\n\r\n transition:\r\n color .34s ease,\r\n opacity .34s ease;\r\n}\r\n\r\n.df__number{\r\n align-self:start;\r\n\r\n padding-top:.47em;\r\n\r\n color:rgba(95,36,104,.62);\r\n\r\n font-size:11px;\r\n line-height:1;\r\n font-weight:600;\r\n letter-spacing:.13em;\r\n\r\n transition:\r\n color .32s ease,\r\n opacity .32s ease;\r\n}\r\n\r\n.df__faq-row.is-open .df__number{\r\n color:var(--df-plum);\r\n}\r\n\r\n.df__question-text{\r\n display:block;\r\n\r\n max-width:24ch;\r\n\r\n color:inherit;\r\n\r\n font-family:\"Cormorant Garamond\",Georgia,serif;\r\n font-size:clamp(30px,2.4vw,41px);\r\n line-height:1.02;\r\n font-weight:400;\r\n letter-spacing:-.028em;\r\n}\r\n\r\n.df__disclosure{\r\n position:relative;\r\n\r\n justify-self:end;\r\n\r\n width:20px;\r\n height:20px;\r\n\r\n flex:0 0 auto;\r\n}\r\n\r\n.df__disclosure::before,\r\n.df__disclosure::after{\r\n content:\"\";\r\n\r\n position:absolute;\r\n inset-inline-start:50%;\r\n inset-block-start:50%;\r\n\r\n width:14px;\r\n height:1px;\r\n\r\n transform:translate(-50%,-50%);\r\n\r\n transition:\r\n opacity .34s ease,\r\n background-color .34s ease;\r\n}\r\n\r\n[dir=\"rtl\"] .df__disclosure::before,\r\n[dir=\"rtl\"] .df__disclosure::after{\r\n transform:translate(50%,-50%);\r\n}\r\n\r\n.df__disclosure::after{\r\n width:1px;\r\n height:14px;\r\n}\r\n\r\n.df__faq-row.is-open .df__disclosure::after{\r\n opacity:0;\r\n}\r\n\r\n\/* CSS grid 0fr -> 1fr: natural height, no fixed answer heights. *\/\r\n.df__answer-wrap{\r\n display:grid;\r\n grid-template-rows:0fr;\r\n\r\n transition:\r\n grid-template-rows .54s var(--df-ease);\r\n}\r\n\r\n.df__faq-row.is-open .df__answer-wrap{\r\n grid-template-rows:1fr;\r\n}\r\n\r\n.df__answer-inner{\r\n min-height:0;\r\n overflow:hidden;\r\n}\r\n\r\n.df__answer{\r\n margin:0;\r\n\r\n max-width:62ch;\r\n\r\n padding:\r\n 0\r\n 38px\r\n 0\r\n calc(52px + clamp(17px,2vw,26px));\r\n\r\n color:rgba(43,20,47,.64);\r\n\r\n font-size:clamp(14px,.92vw,16px);\r\n line-height:1.70;\r\n\r\n opacity:0;\r\n transform:translate3d(0,7px,0);\r\n\r\n transition:\r\n opacity .42s ease,\r\n transform .50s var(--df-ease),\r\n padding-bottom .48s var(--df-ease);\r\n}\r\n\r\n.df__faq-row.is-open .df__answer{\r\n padding-bottom:clamp(25px,3vh,34px);\r\n\r\n opacity:1;\r\n transform:none;\r\n\r\n transition:\r\n opacity .48s ease .05s,\r\n transform .54s var(--df-ease) .03s,\r\n padding-bottom .54s var(--df-ease);\r\n}\r\n\r\n\/* =========================================================\r\n MOBILE-ONLY CTA BRIDGE\r\n ========================================================= *\/\r\n\r\n.df__mobile-bridge{\r\n display:none;\r\n}\r\n\r\n\/* =========================================================\r\n LAMINA PASSED-CONTENT DEPTH\r\n Upcoming\/current = sharp.\r\n Only genuinely passed content softens.\r\n ========================================================= *\/\r\n\r\n#lamina-decision-faq [data-df-depth]{\r\n --df-entry-blur:0px;\r\n --df-passed-blur:0px;\r\n --df-depth-opacity:1;\r\n\r\n filter:\r\n blur(\r\n calc(\r\n var(--df-entry-blur) +\r\n var(--df-passed-blur)\r\n )\r\n );\r\n\r\n opacity:var(--df-depth-opacity);\r\n\r\n will-change:filter,opacity;\r\n}\r\n\r\n#lamina-decision-faq [data-df-depth]:hover,\r\n#lamina-decision-faq [data-df-depth]:focus-within{\r\n --df-passed-blur:0px !important;\r\n --df-depth-opacity:1 !important;\r\n}\r\n\r\n\/* =========================================================\r\n ONE-TIME DESKTOP ENTRANCE\r\n ========================================================= *\/\r\n\r\n#lamina-decision-faq.has-entry .df__eyebrow{\r\n opacity:0;\r\n transform:translate3d(0,7px,0);\r\n --df-entry-blur:2px;\r\n}\r\n\r\n#lamina-decision-faq.has-entry .df__title-line{\r\n opacity:0;\r\n transform:translate3d(0,98%,0);\r\n --df-entry-blur:3.5px;\r\n}\r\n\r\n#lamina-decision-faq.has-entry .df__support,\r\n#lamina-decision-faq.has-entry .df__context,\r\n#lamina-decision-faq.has-entry .df__bridge{\r\n opacity:0;\r\n transform:translate3d(0,8px,0);\r\n --df-entry-blur:2px;\r\n}\r\n\r\n#lamina-decision-faq.has-entry .df__categories{\r\n opacity:0;\r\n transform:translate3d(0,7px,0);\r\n --df-entry-blur:1.4px;\r\n}\r\n\r\n#lamina-decision-faq.has-entry .df__ledger-frame{\r\n clip-path:inset(0 100% 0 0);\r\n}\r\n\r\n#lamina-decision-faq.has-entry .df__faq-row{\r\n opacity:.20;\r\n transform:translate3d(0,8px,0);\r\n}\r\n\r\n#lamina-decision-faq.has-entry.is-entered .df__eyebrow{\r\n opacity:1;\r\n transform:none;\r\n --df-entry-blur:0px;\r\n\r\n transition:\r\n opacity .44s var(--df-ease) .03s,\r\n transform .50s var(--df-ease) .03s,\r\n filter .42s ease .03s;\r\n}\r\n\r\n#lamina-decision-faq.has-entry.is-entered .df__title-line{\r\n opacity:1;\r\n transform:none;\r\n --df-entry-blur:0px;\r\n\r\n transition:\r\n opacity .58s var(--df-ease),\r\n transform .70s cubic-bezier(.12,.82,.18,1),\r\n filter .46s ease;\r\n}\r\n\r\n#lamina-decision-faq.has-entry.is-entered\r\n.df__title-line:nth-child(1){\r\n transition-delay:.05s;\r\n}\r\n\r\n#lamina-decision-faq.has-entry.is-entered\r\n.df__title-line:nth-child(2){\r\n transition-delay:.13s;\r\n}\r\n\r\n#lamina-decision-faq.has-entry.is-entered .df__support{\r\n opacity:1;\r\n transform:none;\r\n --df-entry-blur:0px;\r\n\r\n transition:\r\n opacity .52s var(--df-ease) .18s,\r\n transform .56s var(--df-ease) .18s,\r\n filter .45s ease .18s;\r\n}\r\n\r\n#lamina-decision-faq.has-entry.is-entered .df__context{\r\n opacity:1;\r\n transform:none;\r\n --df-entry-blur:0px;\r\n\r\n transition:\r\n opacity .48s var(--df-ease) .26s,\r\n transform .54s var(--df-ease) .26s,\r\n filter .42s ease .26s;\r\n}\r\n\r\n#lamina-decision-faq.has-entry.is-entered .df__bridge{\r\n opacity:1;\r\n transform:none;\r\n --df-entry-blur:0px;\r\n\r\n transition:\r\n opacity .48s var(--df-ease) .31s,\r\n transform .54s var(--df-ease) .31s,\r\n filter .42s ease .31s;\r\n}\r\n\r\n#lamina-decision-faq.has-entry.is-entered .df__categories{\r\n opacity:1;\r\n transform:none;\r\n --df-entry-blur:0px;\r\n\r\n transition:\r\n opacity .50s var(--df-ease) .23s,\r\n transform .54s var(--df-ease) .23s,\r\n filter .42s ease .23s;\r\n}\r\n\r\n#lamina-decision-faq.has-entry.is-entered .df__ledger-frame{\r\n clip-path:inset(0);\r\n\r\n transition:\r\n clip-path .60s var(--df-ease) .30s;\r\n}\r\n\r\n#lamina-decision-faq.has-entry.is-entered .df__faq-row{\r\n opacity:1;\r\n transform:none;\r\n\r\n transition:\r\n opacity .45s var(--df-ease),\r\n transform .50s var(--df-ease);\r\n}\r\n\r\n#lamina-decision-faq.has-entry.is-entered .df__faq-row:nth-child(1){transition-delay:.38s;}\r\n#lamina-decision-faq.has-entry.is-entered .df__faq-row:nth-child(2){transition-delay:.44s;}\r\n#lamina-decision-faq.has-entry.is-entered .df__faq-row:nth-child(3){transition-delay:.50s;}\r\n#lamina-decision-faq.has-entry.is-entered .df__faq-row:nth-child(4){transition-delay:.56s;}\r\n#lamina-decision-faq.has-entry.is-entered .df__faq-row:nth-child(5){transition-delay:.62s;}\r\n\r\n\/* =========================================================\r\n TABLET\r\n ========================================================= *\/\r\n\r\n@media (min-width:900px) and (max-width:1180px){\r\n\r\n .df__shell{\r\n padding-inline:30px;\r\n }\r\n\r\n .df__layout{\r\n grid-template-columns:minmax(270px,.36fr) minmax(0,.64fr);\r\n gap:54px;\r\n }\r\n\r\n .df__title{\r\n font-size:clamp(56px,6vw,75px);\r\n }\r\n\r\n .df__question-text{\r\n font-size:clamp(29px,3.2vw,36px);\r\n }\r\n\r\n}\r\n\r\n\/* =========================================================\r\n PORTRAIT TABLET + MOBILE\r\n ========================================================= *\/\r\n\r\n@media (max-width:899px){\r\n\r\n .df__shell{\r\n padding:\r\n 64px\r\n 20px\r\n 84px;\r\n }\r\n\r\n .df__layout{\r\n display:block;\r\n width:100%;\r\n }\r\n\r\n .df__editorial{\r\n max-width:100%;\r\n }\r\n\r\n .df__title{\r\n max-width:8.2ch;\r\n\r\n font-size:clamp(48px,13.8vw,60px);\r\n line-height:1;\r\n }\r\n\r\n .df__title-line{\r\n line-height:.91;\r\n }\r\n\r\n .df__title-line + .df__title-line{\r\n margin-top:-.038em;\r\n }\r\n\r\n .df__title-line--accent{\r\n margin-top:.035em !important;\r\n padding-bottom:.09em;\r\n }\r\n\r\n .df__support{\r\n max-width:36ch;\r\n\r\n margin-top:20px;\r\n\r\n font-size:15px;\r\n line-height:1.65;\r\n }\r\n\r\n .df__context,\r\n .df__bridge{\r\n display:none;\r\n }\r\n\r\n .df__ledger{\r\n margin-top:30px;\r\n }\r\n\r\n .df__categories{\r\n display:grid;\r\n grid-template-columns:repeat(3,minmax(0,1fr));\r\n gap:8px;\r\n\r\n margin-bottom:14px;\r\n }\r\n\r\n .df__category{\r\n justify-content:flex-start;\r\n\r\n min-width:0;\r\n min-height:44px;\r\n\r\n padding-inline:0;\r\n\r\n font-size:11px;\r\n letter-spacing:.085em;\r\n }\r\n\r\n .df__category::after{\r\n width:26px;\r\n }\r\n\r\n .df__question-button{\r\n grid-template-columns:minmax(0,1fr) 30px;\r\n grid-template-areas:\r\n \"number control\"\r\n \"question control\";\r\n\r\n gap:\r\n 9px\r\n 16px;\r\n\r\n min-height:0;\r\n\r\n padding:\r\n 24px\r\n 0\r\n 25px;\r\n }\r\n\r\n .df__number{\r\n grid-area:number;\r\n\r\n padding-top:0;\r\n\r\n font-size:10.5px;\r\n }\r\n\r\n .df__question-text{\r\n grid-area:question;\r\n\r\n max-width:17ch;\r\n\r\n font-size:clamp(27px,8.3vw,34px);\r\n line-height:1.07;\r\n }\r\n\r\n .df__disclosure{\r\n grid-area:control;\r\n\r\n align-self:center;\r\n }\r\n\r\n .df__answer{\r\n max-width:none;\r\n\r\n padding:\r\n 0\r\n 36px\r\n 0\r\n 0;\r\n\r\n font-size:14.5px;\r\n line-height:1.65;\r\n }\r\n\r\n .df__faq-row.is-open .df__answer{\r\n padding-bottom:28px;\r\n }\r\n\r\n .df__mobile-bridge{\r\n display:block;\r\n\r\n margin-top:38px;\r\n padding-top:24px;\r\n\r\n border-top:1px solid var(--df-rule);\r\n }\r\n\r\n .df__mobile-bridge-copy{\r\n margin:0;\r\n\r\n max-width:31ch;\r\n\r\n color:rgba(43,20,47,.58);\r\n\r\n font-size:14px;\r\n line-height:1.60;\r\n }\r\n\r\n .df__mobile-bridge .df__bridge{\r\n display:block;\r\n margin-top:11px;\r\n }\r\n\r\n \/* Mobile below-fold rows reveal only as they approach. *\/\r\n #lamina-decision-faq.has-mobile-row-entry\r\n .df__faq-row[data-mobile-ready=\"false\"]{\r\n opacity:.12;\r\n transform:translate3d(0,7px,0);\r\n }\r\n\r\n #lamina-decision-faq.has-mobile-row-entry\r\n .df__faq-row[data-mobile-ready=\"true\"]{\r\n opacity:1;\r\n transform:none;\r\n\r\n transition:\r\n opacity .42s var(--df-ease),\r\n transform .48s var(--df-ease);\r\n }\r\n\r\n}\r\n\r\n\/* Narrow phones: deliberate 2-row category layout, no tiny labels. *\/\r\n@media (max-width:390px){\r\n\r\n .df__categories{\r\n grid-template-columns:repeat(2,minmax(0,1fr));\r\n }\r\n\r\n .df__category:last-child{\r\n grid-column:1 \/ -1;\r\n }\r\n\r\n}\r\n\r\n\/* Short landscape \/ desktop *\/\r\n@media (min-width:900px) and (max-height:700px){\r\n\r\n .df__shell{\r\n padding-block:62px 78px;\r\n }\r\n\r\n .df__layout{\r\n gap:58px;\r\n }\r\n\r\n .df__title{\r\n font-size:clamp(54px,4.4vw,70px);\r\n }\r\n\r\n .df__question-button{\r\n padding-block:20px;\r\n }\r\n\r\n .df__question-text{\r\n font-size:clamp(27px,2.1vw,34px);\r\n }\r\n\r\n}\r\n\r\n\/* =========================================================\r\n RTL\r\n ========================================================= *\/\r\n\r\n[dir=\"rtl\"] #lamina-decision-faq{\r\n direction:rtl;\r\n}\r\n\r\n[dir=\"rtl\"] #lamina-decision-faq .df__question-button,\r\n[dir=\"rtl\"] #lamina-decision-faq .df__support,\r\n[dir=\"rtl\"] #lamina-decision-faq .df__answer,\r\n[dir=\"rtl\"] #lamina-decision-faq .df__mobile-bridge-copy{\r\n text-align:start;\r\n}\r\n\r\n\/* =========================================================\r\n REDUCED MOTION\r\n ========================================================= *\/\r\n\r\n@media (prefers-reduced-motion:reduce){\r\n\r\n #lamina-decision-faq [data-df-depth]{\r\n --df-entry-blur:0px !important;\r\n --df-passed-blur:0px !important;\r\n --df-depth-opacity:1 !important;\r\n\r\n filter:none !important;\r\n opacity:1 !important;\r\n }\r\n\r\n #lamina-decision-faq.has-entry .df__eyebrow,\r\n #lamina-decision-faq.has-entry .df__title-line,\r\n #lamina-decision-faq.has-entry .df__support,\r\n #lamina-decision-faq.has-entry .df__context,\r\n #lamina-decision-faq.has-entry .df__bridge,\r\n #lamina-decision-faq.has-entry .df__categories,\r\n #lamina-decision-faq.has-entry .df__faq-row{\r\n opacity:1 !important;\r\n transform:none !important;\r\n transition:none !important;\r\n }\r\n\r\n #lamina-decision-faq.has-entry .df__ledger-frame{\r\n clip-path:none !important;\r\n transition:none !important;\r\n }\r\n\r\n #lamina-decision-faq .df__rows,\r\n #lamina-decision-faq .df__answer-wrap,\r\n #lamina-decision-faq .df__answer,\r\n #lamina-decision-faq .df__category::after,\r\n #lamina-decision-faq .df__bridge-link::after{\r\n transition:none !important;\r\n }\r\n\r\n #lamina-decision-faq.has-mobile-row-entry\r\n .df__faq-row{\r\n opacity:1 !important;\r\n transform:none !important;\r\n }\r\n\r\n}\r\n<\/style>\r\n\r\n<section\r\n id=\"lamina-decision-faq\"\r\n aria-labelledby=\"lamina-decision-faq-title\"\r\n data-lamina-focus-section\r\n>\r\n\r\n <div class=\"df__shell\">\r\n\r\n <div class=\"df__layout\">\r\n\r\n <aside class=\"df__editorial\">\r\n\r\n <p\r\n class=\"df__eyebrow\"\r\n data-df-depth=\"eyebrow\"\r\n >\r\n 08 \u2014 BEFORE YOU DECIDE\r\n <\/p>\r\n\r\n <h2\r\n class=\"df__title\"\r\n id=\"lamina-decision-faq-title\"\r\n >\r\n <span\r\n class=\"df__title-line\"\r\n data-df-depth=\"headline\"\r\n >\r\n Questions,\r\n <\/span>\r\n\r\n <span\r\n class=\"df__title-line df__title-line--accent\"\r\n data-df-depth=\"headline\"\r\n >\r\n answered clearly.\r\n <\/span>\r\n <\/h2>\r\n\r\n <p\r\n class=\"df__support\"\r\n data-df-depth=\"copy\"\r\n >\r\n Planning treatment abroad comes with practical questions. Here are the answers to the things patients usually want to understand before taking the next step.\r\n <\/p>\r\n\r\n <p\r\n class=\"df__context\"\r\n data-df-depth=\"copy\"\r\n >\r\n Still unsure?<br>\r\n You can send your case directly to the Lamina team.\r\n <\/p>\r\n\r\n <div\r\n class=\"df__bridge\"\r\n data-df-depth=\"ui\"\r\n >\r\n <a\r\n class=\"df__bridge-link\"\r\n href=\"#start-your-assessment\"\r\n >\r\n Start your assessment \u2192\r\n <\/a>\r\n <\/div>\r\n\r\n <\/aside>\r\n\r\n <div class=\"df__ledger\">\r\n\r\n <div\r\n class=\"df__categories\"\r\n role=\"group\"\r\n aria-label=\"Choose FAQ category\"\r\n data-df-depth=\"ui\"\r\n >\r\n <button\r\n class=\"df__category\"\r\n type=\"button\"\r\n data-faq-category=\"general\"\r\n aria-pressed=\"true\"\r\n >\r\n General\r\n <\/button>\r\n\r\n <button\r\n class=\"df__category\"\r\n type=\"button\"\r\n data-faq-category=\"dental\"\r\n aria-pressed=\"false\"\r\n >\r\n Dental\r\n <\/button>\r\n\r\n <button\r\n class=\"df__category\"\r\n type=\"button\"\r\n data-faq-category=\"hair\"\r\n aria-pressed=\"false\"\r\n >\r\n Hair Restoration\r\n <\/button>\r\n <\/div>\r\n\r\n <div\r\n class=\"df__ledger-frame\"\r\n data-df-depth=\"ui\"\r\n >\r\n <div\r\n class=\"df__rows\"\r\n data-faq-rows\r\n aria-live=\"polite\"\r\n >\r\n <!-- Progressive no-JS fallback: General FAQ -->\r\n <article\r\n class=\"df__faq-row is-open\"\r\n data-faq-id=\"general-01\"\r\n data-mobile-ready=\"true\"\r\n data-df-depth=\"row\"\r\n >\r\n <button\r\n class=\"df__question-button\"\r\n type=\"button\"\r\n id=\"faq-general-01-button\"\r\n aria-expanded=\"true\"\r\n aria-controls=\"faq-general-01-answer\"\r\n >\r\n <span class=\"df__number\">01<\/span>\r\n <span\r\n class=\"df__question-text\"\r\n role=\"heading\"\r\n aria-level=\"3\"\r\n >\r\n Can my assessment begin before I travel?\r\n <\/span>\r\n <span\r\n class=\"df__disclosure\"\r\n aria-hidden=\"true\"\r\n ><\/span>\r\n <\/button>\r\n\r\n <div\r\n class=\"df__answer-wrap\"\r\n id=\"faq-general-01-answer\"\r\n role=\"region\"\r\n aria-labelledby=\"faq-general-01-button\"\r\n aria-hidden=\"false\"\r\n >\r\n <div class=\"df__answer-inner\">\r\n <p class=\"df__answer\">\r\n Yes. The initial process can begin with the relevant information, photographs or X-rays where appropriate. This can help the clinic understand the case and prepare the next steps before your visit. The final treatment plan is confirmed after the required in-clinic assessment.\r\n <\/p>\r\n <\/div>\r\n <\/div>\r\n <\/article>\r\n\r\n <article\r\n class=\"df__faq-row\"\r\n data-faq-id=\"general-02\"\r\n data-mobile-ready=\"true\"\r\n data-df-depth=\"row\"\r\n >\r\n <button\r\n class=\"df__question-button\"\r\n type=\"button\"\r\n id=\"faq-general-02-button\"\r\n aria-expanded=\"false\"\r\n aria-controls=\"faq-general-02-answer\"\r\n >\r\n <span class=\"df__number\">02<\/span>\r\n <span class=\"df__question-text\" role=\"heading\" aria-level=\"3\">\r\n Does Lamina support international patients?\r\n <\/span>\r\n <span class=\"df__disclosure\" aria-hidden=\"true\"><\/span>\r\n <\/button>\r\n\r\n <div\r\n class=\"df__answer-wrap\"\r\n id=\"faq-general-02-answer\"\r\n role=\"region\"\r\n aria-labelledby=\"faq-general-02-button\"\r\n aria-hidden=\"true\"\r\n >\r\n <div class=\"df__answer-inner\">\r\n <p class=\"df__answer\">\r\n Yes. Lamina can provide international-patient support around treatment planning, communication, accommodation options and transfer coordination according to the patient\u2019s individual arrangement.\r\n <\/p>\r\n <\/div>\r\n <\/div>\r\n <\/article>\r\n\r\n <article\r\n class=\"df__faq-row\"\r\n data-faq-id=\"general-03\"\r\n data-mobile-ready=\"true\"\r\n data-df-depth=\"row\"\r\n >\r\n <button\r\n class=\"df__question-button\"\r\n type=\"button\"\r\n id=\"faq-general-03-button\"\r\n aria-expanded=\"false\"\r\n aria-controls=\"faq-general-03-answer\"\r\n >\r\n <span class=\"df__number\">03<\/span>\r\n <span class=\"df__question-text\" role=\"heading\" aria-level=\"3\">\r\n Can Lamina help with my hotel and transfers?\r\n <\/span>\r\n <span class=\"df__disclosure\" aria-hidden=\"true\"><\/span>\r\n <\/button>\r\n\r\n <div\r\n class=\"df__answer-wrap\"\r\n id=\"faq-general-03-answer\"\r\n role=\"region\"\r\n aria-labelledby=\"faq-general-03-button\"\r\n aria-hidden=\"true\"\r\n >\r\n <div class=\"df__answer-inner\">\r\n <p class=\"df__answer\">\r\n Lamina works with partner hotel options in Istanbul and can assist with transfer coordination around the visit. The exact accommodation and transportation arrangements should be confirmed as part of the individual treatment offer.\r\n <\/p>\r\n <\/div>\r\n <\/div>\r\n <\/article>\r\n\r\n <article\r\n class=\"df__faq-row\"\r\n data-faq-id=\"general-04\"\r\n data-mobile-ready=\"true\"\r\n data-df-depth=\"row\"\r\n >\r\n <button\r\n class=\"df__question-button\"\r\n type=\"button\"\r\n id=\"faq-general-04-button\"\r\n aria-expanded=\"false\"\r\n aria-controls=\"faq-general-04-answer\"\r\n >\r\n <span class=\"df__number\">04<\/span>\r\n <span class=\"df__question-text\" role=\"heading\" aria-level=\"3\">\r\n Is the plan I receive before travel final?\r\n <\/span>\r\n <span class=\"df__disclosure\" aria-hidden=\"true\"><\/span>\r\n <\/button>\r\n\r\n <div\r\n class=\"df__answer-wrap\"\r\n id=\"faq-general-04-answer\"\r\n role=\"region\"\r\n aria-labelledby=\"faq-general-04-button\"\r\n aria-hidden=\"true\"\r\n >\r\n <div class=\"df__answer-inner\">\r\n <p class=\"df__answer\">\r\n No. Pre-travel planning is preliminary. The final treatment plan is confirmed by the clinical team after the appropriate in-person examination and any updated diagnostic information required.\r\n <\/p>\r\n <\/div>\r\n <\/div>\r\n <\/article>\r\n\r\n <article\r\n class=\"df__faq-row\"\r\n data-faq-id=\"general-05\"\r\n data-mobile-ready=\"true\"\r\n data-df-depth=\"row\"\r\n >\r\n <button\r\n class=\"df__question-button\"\r\n type=\"button\"\r\n id=\"faq-general-05-button\"\r\n aria-expanded=\"false\"\r\n aria-controls=\"faq-general-05-answer\"\r\n >\r\n <span class=\"df__number\">05<\/span>\r\n <span class=\"df__question-text\" role=\"heading\" aria-level=\"3\">\r\n What happens after I send my case?\r\n <\/span>\r\n <span class=\"df__disclosure\" aria-hidden=\"true\"><\/span>\r\n <\/button>\r\n\r\n <div\r\n class=\"df__answer-wrap\"\r\n id=\"faq-general-05-answer\"\r\n role=\"region\"\r\n aria-labelledby=\"faq-general-05-button\"\r\n aria-hidden=\"true\"\r\n >\r\n <div class=\"df__answer-inner\">\r\n <p class=\"df__answer\">\r\n The information you provide can be reviewed so the appropriate next steps can be discussed with you. Lamina should confirm the exact communication process and expected response time before this wording is finalized.\r\n <\/p>\r\n <\/div>\r\n <\/div>\r\n <\/article>\r\n <\/div>\r\n <\/div>\r\n\r\n <div\r\n class=\"df__mobile-bridge\"\r\n data-df-depth=\"ui\"\r\n >\r\n <p class=\"df__mobile-bridge-copy\">\r\n Still unsure about your case? Start with an initial assessment.\r\n <\/p>\r\n\r\n <div class=\"df__bridge\">\r\n <a\r\n class=\"df__bridge-link\"\r\n href=\"#start-your-assessment\"\r\n >\r\n Start your assessment \u2192\r\n <\/a>\r\n <\/div>\r\n <\/div>\r\n\r\n <\/div>\r\n\r\n <\/div>\r\n\r\n <\/div>\r\n\r\n<\/section>\r\n\r\n<script>\r\n(() => {\r\n\r\n const root =\r\n document.getElementById(\r\n 'lamina-decision-faq'\r\n );\r\n\r\n\r\n if (\r\n !root ||\r\n root.dataset.decisionFaqReady ===\r\n 'true'\r\n ) return;\r\n\r\n\r\n root.dataset.decisionFaqReady =\r\n 'true';\r\n\r\n\r\n const reducedMotion =\r\n window.matchMedia(\r\n '(prefers-reduced-motion: reduce)'\r\n );\r\n\r\n\r\n const mobileQuery =\r\n window.matchMedia(\r\n '(max-width:899px)'\r\n );\r\n\r\n\r\n const categoryButtons =\r\n [\r\n ...root.querySelectorAll(\r\n '[data-faq-category]'\r\n )\r\n ];\r\n\r\n\r\n const rowsHost =\r\n root.querySelector(\r\n '[data-faq-rows]'\r\n );\r\n\r\n\r\n const faqGroups =\r\n {\r\n\r\n general:[\r\n {\r\n id:'general-01',\r\n number:'01',\r\n question:'Can my assessment begin before I travel?',\r\n answer:'Yes. The initial process can begin with the relevant information, photographs or X-rays where appropriate. This can help the clinic understand the case and prepare the next steps before your visit. The final treatment plan is confirmed after the required in-clinic assessment.',\r\n verificationStatus:'safe-current-copy',\r\n schemaEligible:false,\r\n enabled:true\r\n },\r\n {\r\n id:'general-02',\r\n number:'02',\r\n question:'Does Lamina support international patients?',\r\n answer:'Yes. Lamina can provide international-patient support around treatment planning, communication, accommodation options and transfer coordination according to the patient\u2019s individual arrangement.',\r\n verificationStatus:'safe-current-copy',\r\n schemaEligible:false,\r\n enabled:true\r\n },\r\n {\r\n id:'general-03',\r\n number:'03',\r\n question:'Can Lamina help with my hotel and transfers?',\r\n answer:'Lamina works with partner hotel options in Istanbul and can assist with transfer coordination around the visit. The exact accommodation and transportation arrangements should be confirmed as part of the individual treatment offer.',\r\n verificationStatus:'safe-current-copy',\r\n schemaEligible:false,\r\n enabled:true\r\n },\r\n {\r\n id:'general-04',\r\n number:'04',\r\n question:'Is the plan I receive before travel final?',\r\n answer:'No. Pre-travel planning is preliminary. The final treatment plan is confirmed by the clinical team after the appropriate in-person examination and any updated diagnostic information required.',\r\n verificationStatus:'safe-current-copy',\r\n schemaEligible:false,\r\n enabled:true\r\n },\r\n {\r\n id:'general-05',\r\n number:'05',\r\n question:'What happens after I send my case?',\r\n answer:'The information you provide can be reviewed so the appropriate next steps can be discussed with you. Lamina should confirm the exact communication process and expected response time before this wording is finalized.',\r\n verificationStatus:'needs-clinic-process-confirmation',\r\n schemaEligible:false,\r\n enabled:true\r\n }\r\n ],\r\n\r\n\r\n dental:[\r\n {\r\n id:'dental-01',\r\n number:'01',\r\n question:'What should I send for a dental assessment?',\r\n answer:'Relevant photographs and existing dental X-rays can help begin a preliminary assessment where appropriate. The clinic should provide the exact image and document requirements for each case.',\r\n verificationStatus:'needs-submission-format-confirmation',\r\n schemaEligible:false,\r\n enabled:true\r\n },\r\n {\r\n id:'dental-02',\r\n number:'02',\r\n question:'Can I see the proposed dental treatment before I travel?',\r\n answer:'For suitable cases, digital \/ 3D treatment visualisation can help explain the proposed dental treatment before final clinical confirmation.',\r\n verificationStatus:'safe-current-copy',\r\n schemaEligible:false,\r\n enabled:true\r\n },\r\n {\r\n id:'dental-03',\r\n number:'03',\r\n question:'Is the digital visualisation a guarantee of the final result?',\r\n answer:'No. Digital visualisation is a planning and communication tool. Individual treatment outcomes vary, and the final treatment approach is confirmed following clinical examination.',\r\n verificationStatus:'safe-current-copy',\r\n schemaEligible:false,\r\n enabled:true\r\n },\r\n {\r\n id:'dental-04',\r\n number:'04',\r\n question:'Can my dental treatment plan change after I arrive?',\r\n answer:'Yes. A preliminary plan may change after the clinical team performs the required examination and reviews updated diagnostic information.',\r\n verificationStatus:'safe-current-copy',\r\n schemaEligible:false,\r\n enabled:true\r\n },\r\n {\r\n id:'dental-05',\r\n number:'05',\r\n question:'How long will I need to stay in Istanbul?',\r\n answer:'The required stay depends on the treatment being considered and the individual clinical plan. Lamina should confirm the expected visit duration after reviewing the case.',\r\n verificationStatus:'needs-case-specific-confirmation',\r\n schemaEligible:false,\r\n enabled:true\r\n }\r\n ],\r\n\r\n\r\n hair:[\r\n {\r\n id:'hair-01',\r\n number:'01',\r\n question:'Can my hair restoration assessment begin before I travel?',\r\n answer:'Yes. Relevant photographs and treatment information can help the clinic begin understanding the case and discuss a preliminary treatment direction before the in-person assessment.',\r\n verificationStatus:'safe-current-copy',\r\n schemaEligible:false,\r\n enabled:true\r\n },\r\n {\r\n id:'hair-02',\r\n number:'02',\r\n question:'What photos should I send?',\r\n answer:'The clinical team should provide the exact photo requirements needed for assessment. Avoid publishing specific angles until Lamina confirms the preferred submission format.',\r\n verificationStatus:'needs-photo-format-confirmation',\r\n schemaEligible:false,\r\n enabled:true\r\n },\r\n {\r\n id:'hair-03',\r\n number:'03',\r\n question:'Can the final treatment plan change after I arrive?',\r\n answer:'Yes. The final treatment plan and design are confirmed following the required face-to-face clinical assessment.',\r\n verificationStatus:'safe-current-copy',\r\n schemaEligible:false,\r\n enabled:true\r\n },\r\n {\r\n id:'hair-04',\r\n number:'04',\r\n question:'Can you confirm the number of grafts before I travel?',\r\n answer:'Any estimate discussed before travel should be treated as preliminary. The final treatment requirements depend on the in-person clinical assessment.',\r\n verificationStatus:'requires-clinic-process-confirmation',\r\n schemaEligible:false,\r\n enabled:false\r\n },\r\n {\r\n id:'hair-05',\r\n number:'04',\r\n question:'How long should I stay in Istanbul?',\r\n answer:'The appropriate stay depends on the treatment plan and the clinic\u2019s scheduling requirements. The expected visit length should be confirmed after the case is reviewed.',\r\n verificationStatus:'needs-case-specific-confirmation',\r\n schemaEligible:false,\r\n enabled:true\r\n }\r\n ]\r\n\r\n };\r\n\r\n\r\n let activeFaqCategory =\r\n 'general';\r\n\r\n\r\n let openFaqId =\r\n 'general-01';\r\n\r\n\r\n let categorySwitchToken =\r\n 0;\r\n\r\n\r\n let introPlayed =\r\n false;\r\n\r\n\r\n let introObserver =\r\n null;\r\n\r\n\r\n let mobileRowObserver =\r\n null;\r\n\r\n\r\n let depthTicking =\r\n false;\r\n\r\n\r\n function escapeHTML(\r\n value\r\n ){\r\n\r\n return String(\r\n value\r\n )\r\n .replaceAll(\r\n '&',\r\n '&'\r\n )\r\n .replaceAll(\r\n '<',\r\n '<'\r\n )\r\n .replaceAll(\r\n '>',\r\n '>'\r\n )\r\n .replaceAll(\r\n '\"',\r\n '"'\r\n )\r\n .replaceAll(\r\n \"'\",\r\n '''\r\n );\r\n\r\n }\r\n\r\n\r\n function enabledFaqs(\r\n category\r\n ){\r\n\r\n return (\r\n faqGroups[\r\n category\r\n ] ||\r\n []\r\n ).filter(\r\n item =>\r\n item.enabled !==\r\n false\r\n );\r\n\r\n }\r\n\r\n\r\n function renderRows(\r\n category\r\n ){\r\n\r\n const items =\r\n enabledFaqs(\r\n category\r\n );\r\n\r\n\r\n rowsHost.innerHTML =\r\n items.map(\r\n item => {\r\n\r\n const isOpen =\r\n item.id ===\r\n openFaqId;\r\n\r\n\r\n const safeId =\r\n escapeHTML(\r\n item.id\r\n );\r\n\r\n\r\n return `\r\n <article\r\n class=\"df__faq-row${isOpen ? ' is-open' : ''}\"\r\n data-faq-id=\"${safeId}\"\r\n data-mobile-ready=\"false\"\r\n data-df-depth=\"row\"\r\n >\r\n <button\r\n class=\"df__question-button\"\r\n type=\"button\"\r\n id=\"faq-${safeId}-button\"\r\n aria-expanded=\"${isOpen ? 'true' : 'false'}\"\r\n aria-controls=\"faq-${safeId}-answer\"\r\n >\r\n <span class=\"df__number\">${escapeHTML(item.number)}<\/span>\r\n\r\n <span\r\n class=\"df__question-text\"\r\n role=\"heading\"\r\n aria-level=\"3\"\r\n >\r\n ${escapeHTML(item.question)}\r\n <\/span>\r\n\r\n <span\r\n class=\"df__disclosure\"\r\n aria-hidden=\"true\"\r\n ><\/span>\r\n <\/button>\r\n\r\n <div\r\n class=\"df__answer-wrap\"\r\n id=\"faq-${safeId}-answer\"\r\n role=\"region\"\r\n aria-labelledby=\"faq-${safeId}-button\"\r\n aria-hidden=\"${isOpen ? 'false' : 'true'}\"\r\n >\r\n <div class=\"df__answer-inner\">\r\n <p class=\"df__answer\">\r\n ${escapeHTML(item.answer)}\r\n <\/p>\r\n <\/div>\r\n <\/div>\r\n <\/article>\r\n `;\r\n\r\n }\r\n ).join(\r\n ''\r\n );\r\n\r\n\r\n bindFaqButtons();\r\n initMobileRows();\r\n refreshDepthLayers();\r\n\r\n }\r\n\r\n\r\n function setOpenFaq(\r\n nextId\r\n ){\r\n\r\n openFaqId =\r\n nextId;\r\n\r\n\r\n const rows =\r\n [\r\n ...rowsHost.querySelectorAll(\r\n '.df__faq-row'\r\n )\r\n ];\r\n\r\n\r\n rows.forEach(\r\n row => {\r\n\r\n const isOpen =\r\n row.dataset.faqId ===\r\n openFaqId;\r\n\r\n\r\n row.classList.toggle(\r\n 'is-open',\r\n isOpen\r\n );\r\n\r\n\r\n const button =\r\n row.querySelector(\r\n '.df__question-button'\r\n );\r\n\r\n\r\n const answer =\r\n row.querySelector(\r\n '.df__answer-wrap'\r\n );\r\n\r\n\r\n button?.setAttribute(\r\n 'aria-expanded',\r\n isOpen\r\n ? 'true'\r\n : 'false'\r\n );\r\n\r\n\r\n answer?.setAttribute(\r\n 'aria-hidden',\r\n isOpen\r\n ? 'false'\r\n : 'true'\r\n );\r\n\r\n }\r\n );\r\n\r\n\r\n requestDepthUpdate();\r\n\r\n }\r\n\r\n\r\n function bindFaqButtons(){\r\n\r\n rowsHost\r\n .querySelectorAll(\r\n '.df__question-button'\r\n )\r\n .forEach(\r\n button => {\r\n\r\n button.addEventListener(\r\n 'click',\r\n () => {\r\n\r\n const row =\r\n button.closest(\r\n '.df__faq-row'\r\n );\r\n\r\n\r\n if (\r\n !row\r\n ) return;\r\n\r\n\r\n const id =\r\n row.dataset.faqId;\r\n\r\n\r\n const isOpen =\r\n row.classList.contains(\r\n 'is-open'\r\n );\r\n\r\n\r\n \/*\r\n One-open-at-a-time ledger.\r\n Clicking the open row may close it.\r\n *\/\r\n setOpenFaq(\r\n isOpen\r\n ? ''\r\n : id\r\n );\r\n\r\n }\r\n );\r\n\r\n }\r\n );\r\n\r\n }\r\n\r\n\r\n function setCategory(\r\n nextCategory\r\n ){\r\n\r\n if (\r\n !faqGroups[\r\n nextCategory\r\n ] ||\r\n nextCategory ===\r\n activeFaqCategory\r\n ) return;\r\n\r\n\r\n activeFaqCategory =\r\n nextCategory;\r\n\r\n\r\n const token =\r\n ++categorySwitchToken;\r\n\r\n\r\n categoryButtons.forEach(\r\n button => {\r\n\r\n button.setAttribute(\r\n 'aria-pressed',\r\n button.dataset.faqCategory ===\r\n activeFaqCategory\r\n ? 'true'\r\n : 'false'\r\n );\r\n\r\n }\r\n );\r\n\r\n\r\n const items =\r\n enabledFaqs(\r\n activeFaqCategory\r\n );\r\n\r\n\r\n openFaqId =\r\n items[\r\n 0\r\n ]?.id ||\r\n '';\r\n\r\n\r\n if (\r\n reducedMotion.matches\r\n ){\r\n\r\n root.classList.remove(\r\n 'is-category-switching'\r\n );\r\n\r\n\r\n root\r\n .querySelector(\r\n '.df__ledger'\r\n )\r\n ?.classList.remove(\r\n 'is-switching'\r\n );\r\n\r\n\r\n renderRows(\r\n activeFaqCategory\r\n );\r\n\r\n\r\n return;\r\n\r\n }\r\n\r\n\r\n const ledger =\r\n root.querySelector(\r\n '.df__ledger'\r\n );\r\n\r\n\r\n ledger?.classList.add(\r\n 'is-switching'\r\n );\r\n\r\n\r\n window.setTimeout(\r\n () => {\r\n\r\n if (\r\n token !==\r\n categorySwitchToken\r\n ) return;\r\n\r\n\r\n renderRows(\r\n activeFaqCategory\r\n );\r\n\r\n\r\n requestAnimationFrame(\r\n () => {\r\n\r\n if (\r\n token !==\r\n categorySwitchToken\r\n ) return;\r\n\r\n\r\n ledger?.classList.remove(\r\n 'is-switching'\r\n );\r\n\r\n }\r\n );\r\n\r\n },\r\n 135\r\n );\r\n\r\n }\r\n\r\n\r\n categoryButtons.forEach(\r\n button => {\r\n\r\n button.addEventListener(\r\n 'click',\r\n () => {\r\n\r\n setCategory(\r\n button.dataset.faqCategory\r\n );\r\n\r\n }\r\n );\r\n\r\n }\r\n );\r\n\r\n\r\n \/* =======================================================\r\n ONE-TIME SECTION ENTRANCE\r\n ======================================================= *\/\r\n\r\n function initEntrance(){\r\n\r\n introObserver?.disconnect();\r\n\r\n\r\n if (\r\n reducedMotion.matches ||\r\n introPlayed ||\r\n !(\r\n 'IntersectionObserver' in\r\n window\r\n )\r\n ){\r\n\r\n return;\r\n\r\n }\r\n\r\n\r\n root.classList.add(\r\n 'has-entry'\r\n );\r\n\r\n\r\n introObserver =\r\n new IntersectionObserver(\r\n entries => {\r\n\r\n entries.forEach(\r\n entry => {\r\n\r\n if (\r\n !entry.isIntersecting\r\n ) return;\r\n\r\n\r\n introPlayed =\r\n true;\r\n\r\n\r\n requestAnimationFrame(\r\n () => {\r\n\r\n root.classList.add(\r\n 'is-entered'\r\n );\r\n\r\n\r\n window.setTimeout(\r\n () => {\r\n\r\n root.classList.remove(\r\n 'has-entry'\r\n );\r\n\r\n },\r\n 1750\r\n );\r\n\r\n }\r\n );\r\n\r\n\r\n introObserver.disconnect();\r\n\r\n }\r\n );\r\n\r\n },\r\n {\r\n rootMargin:'0px 0px -18% 0px',\r\n threshold:.02\r\n }\r\n );\r\n\r\n\r\n introObserver.observe(\r\n root\r\n );\r\n\r\n }\r\n\r\n\r\n \/* =======================================================\r\n MOBILE BELOW-FOLD FAQ ROW ENTRY\r\n ======================================================= *\/\r\n\r\n function initMobileRows(){\r\n\r\n mobileRowObserver?.disconnect();\r\n\r\n\r\n root.classList.remove(\r\n 'has-mobile-row-entry'\r\n );\r\n\r\n\r\n const rows =\r\n [\r\n ...rowsHost.querySelectorAll(\r\n '.df__faq-row'\r\n )\r\n ];\r\n\r\n\r\n if (\r\n !mobileQuery.matches ||\r\n reducedMotion.matches ||\r\n !(\r\n 'IntersectionObserver' in\r\n window\r\n )\r\n ){\r\n\r\n rows.forEach(\r\n row => {\r\n\r\n row.dataset.mobileReady =\r\n 'true';\r\n\r\n }\r\n );\r\n\r\n\r\n return;\r\n\r\n }\r\n\r\n\r\n root.classList.add(\r\n 'has-mobile-row-entry'\r\n );\r\n\r\n\r\n mobileRowObserver =\r\n new IntersectionObserver(\r\n entries => {\r\n\r\n entries.forEach(\r\n entry => {\r\n\r\n if (\r\n !entry.isIntersecting\r\n ) return;\r\n\r\n\r\n entry.target.dataset.mobileReady =\r\n 'true';\r\n\r\n\r\n mobileRowObserver.unobserve(\r\n entry.target\r\n );\r\n\r\n }\r\n );\r\n\r\n },\r\n {\r\n rootMargin:'0px 0px -16% 0px',\r\n threshold:.03\r\n }\r\n );\r\n\r\n\r\n rows.forEach(\r\n row => {\r\n\r\n const rect =\r\n row.getBoundingClientRect();\r\n\r\n\r\n \/*\r\n Keep the immediately visible reading area ready.\r\n Lower rows resolve slightly before reaching it.\r\n *\/\r\n if (\r\n rect.top <\r\n window.innerHeight *\r\n .86\r\n ){\r\n\r\n row.dataset.mobileReady =\r\n 'true';\r\n\r\n }else{\r\n\r\n row.dataset.mobileReady =\r\n 'false';\r\n\r\n\r\n mobileRowObserver.observe(\r\n row\r\n );\r\n\r\n }\r\n\r\n }\r\n );\r\n\r\n }\r\n\r\n\r\n \/* =======================================================\r\n LAMINA PASSED-CONTENT DEPTH\r\n Clarified project behavior:\r\n current\/upcoming = sharp\r\n genuinely scrolled-away = gently blurred\r\n reverse scroll = immediate refocus by geometry\r\n ======================================================= *\/\r\n\r\n let depthLayers =\r\n [];\r\n\r\n\r\n const depthProfiles =\r\n {\r\n\r\n desktop:{\r\n\r\n eyebrow:{\r\n start:.25,\r\n full:-.13,\r\n blur:2.5,\r\n opacityMin:.97\r\n },\r\n\r\n headline:{\r\n start:.23,\r\n full:-.15,\r\n blur:3.7,\r\n opacityMin:.96\r\n },\r\n\r\n copy:{\r\n start:.18,\r\n full:-.17,\r\n blur:1.9,\r\n opacityMin:.98\r\n },\r\n\r\n ui:{\r\n start:.13,\r\n full:-.19,\r\n blur:1.35,\r\n opacityMin:.985\r\n },\r\n\r\n row:{\r\n start:.10,\r\n full:-.21,\r\n blur:1.75,\r\n opacityMin:.985\r\n }\r\n\r\n },\r\n\r\n\r\n mobile:{\r\n\r\n eyebrow:{\r\n start:.19,\r\n full:-.14,\r\n blur:1.65,\r\n opacityMin:.98\r\n },\r\n\r\n headline:{\r\n start:.17,\r\n full:-.16,\r\n blur:2.35,\r\n opacityMin:.975\r\n },\r\n\r\n copy:{\r\n start:.13,\r\n full:-.18,\r\n blur:1.25,\r\n opacityMin:.985\r\n },\r\n\r\n ui:{\r\n start:.09,\r\n full:-.20,\r\n blur:.90,\r\n opacityMin:.99\r\n },\r\n\r\n row:{\r\n start:.07,\r\n full:-.22,\r\n blur:1.15,\r\n opacityMin:.99\r\n }\r\n\r\n }\r\n\r\n };\r\n\r\n\r\n function clamp(\r\n value,\r\n min,\r\n max\r\n ){\r\n\r\n return Math.min(\r\n max,\r\n Math.max(\r\n min,\r\n value\r\n )\r\n );\r\n\r\n }\r\n\r\n\r\n function smoothstep(\r\n value\r\n ){\r\n\r\n const t =\r\n clamp(\r\n value,\r\n 0,\r\n 1\r\n );\r\n\r\n\r\n return (\r\n t *\r\n t *\r\n (\r\n 3 -\r\n 2 *\r\n t\r\n )\r\n );\r\n\r\n }\r\n\r\n\r\n function refreshDepthLayers(){\r\n\r\n depthLayers =\r\n [\r\n ...root.querySelectorAll(\r\n '[data-df-depth]'\r\n )\r\n ];\r\n\r\n\r\n requestDepthUpdate();\r\n\r\n }\r\n\r\n\r\n function updateDepth(){\r\n\r\n depthTicking =\r\n false;\r\n\r\n\r\n const viewportHeight =\r\n Math.max(\r\n 1,\r\n window.innerHeight ||\r\n document.documentElement.clientHeight\r\n );\r\n\r\n\r\n const set =\r\n mobileQuery.matches\r\n ? depthProfiles.mobile\r\n : depthProfiles.desktop;\r\n\r\n\r\n depthLayers.forEach(\r\n element => {\r\n\r\n const type =\r\n element.dataset.dfDepth ||\r\n 'copy';\r\n\r\n\r\n const config =\r\n set[\r\n type\r\n ] ||\r\n set.copy;\r\n\r\n\r\n const rect =\r\n element.getBoundingClientRect();\r\n\r\n\r\n const center =\r\n rect.top +\r\n rect.height *\r\n .5;\r\n\r\n\r\n const startY =\r\n viewportHeight *\r\n config.start;\r\n\r\n\r\n const fullY =\r\n viewportHeight *\r\n config.full;\r\n\r\n\r\n let progress =\r\n center <\r\n startY\r\n ? (\r\n startY -\r\n center\r\n ) \/\r\n Math.max(\r\n 1,\r\n startY -\r\n fullY\r\n )\r\n : 0;\r\n\r\n\r\n progress =\r\n smoothstep(\r\n progress\r\n );\r\n\r\n\r\n const interacting =\r\n element.matches(\r\n ':hover, :focus-within'\r\n );\r\n\r\n\r\n if (\r\n interacting\r\n ){\r\n\r\n progress =\r\n 0;\r\n\r\n }\r\n\r\n\r\n const blur =\r\n reducedMotion.matches\r\n ? 0\r\n : (\r\n config.blur *\r\n progress\r\n );\r\n\r\n\r\n const opacity =\r\n reducedMotion.matches\r\n ? 1\r\n : (\r\n 1 -\r\n (\r\n 1 -\r\n config.opacityMin\r\n ) *\r\n progress\r\n );\r\n\r\n\r\n element.style.setProperty(\r\n '--df-passed-blur',\r\n blur.toFixed(\r\n 2\r\n ) +\r\n 'px'\r\n );\r\n\r\n\r\n element.style.setProperty(\r\n '--df-depth-opacity',\r\n opacity.toFixed(\r\n 3\r\n )\r\n );\r\n\r\n }\r\n );\r\n\r\n }\r\n\r\n\r\n function requestDepthUpdate(){\r\n\r\n if (\r\n depthTicking\r\n ) return;\r\n\r\n\r\n depthTicking =\r\n true;\r\n\r\n\r\n requestAnimationFrame(\r\n updateDepth\r\n );\r\n\r\n }\r\n\r\n\r\n window.addEventListener(\r\n 'scroll',\r\n requestDepthUpdate,\r\n {\r\n passive:true\r\n }\r\n );\r\n\r\n\r\n window.addEventListener(\r\n 'resize',\r\n () => {\r\n\r\n initMobileRows();\r\n requestDepthUpdate();\r\n\r\n },\r\n {\r\n passive:true\r\n }\r\n );\r\n\r\n\r\n mobileQuery.addEventListener?.(\r\n 'change',\r\n () => {\r\n\r\n initMobileRows();\r\n requestDepthUpdate();\r\n\r\n }\r\n );\r\n\r\n\r\n reducedMotion.addEventListener?.(\r\n 'change',\r\n () => {\r\n\r\n initMobileRows();\r\n requestDepthUpdate();\r\n\r\n }\r\n );\r\n\r\n\r\n \/* =======================================================\r\n INITIALIZE\r\n ======================================================= *\/\r\n\r\n bindFaqButtons();\r\n refreshDepthLayers();\r\n initEntrance();\r\n initMobileRows();\r\n\r\n})();\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-73fd12c e-con-full e-flex e-con e-parent\" data-id=\"73fd12c\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-26f710a elementor-widget elementor-widget-html\" data-id=\"26f710a\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- =========================================================\r\nLAMINA CLINIC \u2014 SECTION 09\r\nFINAL CASE SUBMISSION \/ CONSULTATION\r\nCONCEPT: START FROM HOME\r\nV1 \u2014 FINAL \/ LOCKED-RULE AUDITED\r\n\r\nDARK \/ INTIMATE \/ PREMIUM \/ HIGH-CONVERSION \/ MEDICALLY CAREFUL\r\n\r\nPRODUCTION INTEGRATION REQUIRED BEFORE LAUNCH:\r\n1. Replace {{LAMINA_SECURE_CASE_ENDPOINT}} with the secure server-side case endpoint.\r\n2. Replace {{LAMINA_SECURE_NONCE}} with a real CSRF\/nonces implementation.\r\n3. Replace {{PRIVACY_NOTICE_URL}} with the legally approved Privacy Notice URL.\r\n4. Replace {{THANK_YOU_URL}} with the real post-success destination.\r\n5. Replace the development consent wording with legally reviewed text.\r\n6. Enforce all upload limits, MIME validation, storage access control,\r\n rate limiting, spam protection and sanitization server-side.\r\n7. Do not send patient files or sensitive health data to analytics.\r\n\r\nThe front-end will NOT fake a successful lead when these integrations\r\nare missing. Successful redirect\/tracking occurs only after a real\r\nbackend-confirmed successful response.\r\n========================================================= -->\r\n\r\n<style>\r\n@import url('https:\/\/fonts.googleapis.com\/css2?family=Cormorant+Garamond:ital,wght@0,400;0,500;1,400&family=Manrope:wght@400;500;600&display=swap');\r\n\r\n#lamina-case-submission{\r\n --s09-aubergine:#2B142F;\r\n --s09-aubergine-2:#241128;\r\n --s09-aubergine-3:#311635;\r\n --s09-aubergine-4:#35193A;\r\n --s09-ink:#171317;\r\n --s09-ivory:#F7F2EA;\r\n --s09-lilac:#C5B2C8;\r\n --s09-orchid:#94709A;\r\n --s09-plum:#5F2468;\r\n --s09-champagne:#D8C4A1;\r\n --s09-rule:rgba(247,242,234,.13);\r\n --s09-rule-strong:rgba(247,242,234,.22);\r\n --s09-error:#F0A5A5;\r\n --s09-ease:cubic-bezier(.16,.70,.18,1);\r\n --s09-stage:1560px;\r\n\r\n --e-global-color-primary:#F7F2EA;\r\n --e-global-color-secondary:#94709A;\r\n --e-global-color-text:#F7F2EA;\r\n --e-global-color-accent:#5F2468;\r\n\r\n position:relative;\r\n width:100%;\r\n overflow:hidden;\r\n\r\n background:\r\n radial-gradient(48% 38% at 82% 4%,rgba(148,112,154,.08),transparent 72%),\r\n linear-gradient(150deg,var(--s09-aubergine-3) 0%,var(--s09-aubergine) 60%,var(--s09-aubergine-2) 100%);\r\n\r\n color:var(--s09-ivory);\r\n\r\n font-family:\"Manrope\",system-ui,-apple-system,BlinkMacSystemFont,\"Segoe UI\",sans-serif;\r\n\r\n -webkit-tap-highlight-color:rgba(95,36,104,.10);\r\n}\r\n\r\n#lamina-case-submission *,\r\n#lamina-case-submission *::before,\r\n#lamina-case-submission *::after{\r\n box-sizing:border-box;\r\n}\r\n\r\n#lamina-case-submission ::selection{\r\n background:var(--s09-plum);\r\n color:var(--s09-ivory);\r\n}\r\n\r\n\/* =========================================================\r\n ELEMENTOR \/ THEME PINK PROTECTION\r\n ========================================================= *\/\r\n#lamina-case-submission a,\r\n#lamina-case-submission a:link,\r\n#lamina-case-submission a:visited,\r\n#lamina-case-submission a:hover,\r\n#lamina-case-submission a:focus,\r\n#lamina-case-submission a:focus-visible,\r\n#lamina-case-submission a:active,\r\n#lamina-case-submission button,\r\n#lamina-case-submission button:hover,\r\n#lamina-case-submission button:focus,\r\n#lamina-case-submission button:focus-visible,\r\n#lamina-case-submission button:active,\r\n#lamina-case-submission button:disabled{\r\n font:inherit;\r\n text-decoration-color:var(--s09-plum) !important;\r\n}\r\n\r\n#lamina-case-submission button,\r\n#lamina-case-submission input,\r\n#lamina-case-submission textarea,\r\n#lamina-case-submission select{\r\n font:inherit;\r\n}\r\n\r\n#lamina-case-submission .s09__choice,\r\n#lamina-case-submission .s09__choice:hover,\r\n#lamina-case-submission .s09__choice:focus,\r\n#lamina-case-submission .s09__choice:focus-visible,\r\n#lamina-case-submission .s09__choice:active,\r\n#lamina-case-submission .s09__button,\r\n#lamina-case-submission .s09__button:hover,\r\n#lamina-case-submission .s09__button:focus,\r\n#lamina-case-submission .s09__button:focus-visible,\r\n#lamina-case-submission .s09__button:active,\r\n#lamina-case-submission .s09__back,\r\n#lamina-case-submission .s09__back:hover,\r\n#lamina-case-submission .s09__back:focus,\r\n#lamina-case-submission .s09__back:focus-visible,\r\n#lamina-case-submission .s09__back:active,\r\n#lamina-case-submission .s09__remove,\r\n#lamina-case-submission .s09__remove:hover,\r\n#lamina-case-submission .s09__remove:focus,\r\n#lamina-case-submission .s09__remove:focus-visible,\r\n#lamina-case-submission .s09__remove:active{\r\n box-shadow:none !important;\r\n}\r\n\r\n#lamina-case-submission .s09__choice{\r\n color:var(--s09-ivory) !important;\r\n background:transparent !important;\r\n border-color:var(--s09-rule) !important;\r\n}\r\n\r\n#lamina-case-submission .s09__choice:hover,\r\n#lamina-case-submission .s09__choice:focus-visible,\r\n#lamina-case-submission .s09__choice.is-selected{\r\n color:var(--s09-ivory) !important;\r\n background-color:rgba(95,36,104,.12) !important;\r\n border-color:rgba(197,178,200,.46) !important;\r\n}\r\n\r\n#lamina-case-submission .s09__button{\r\n color:var(--s09-aubergine) !important;\r\n background-color:var(--s09-ivory) !important;\r\n border-color:var(--s09-ivory) !important;\r\n}\r\n\r\n#lamina-case-submission .s09__button:hover,\r\n#lamina-case-submission .s09__button:focus-visible{\r\n color:var(--s09-aubergine) !important;\r\n background-color:var(--s09-lilac) !important;\r\n border-color:var(--s09-lilac) !important;\r\n}\r\n\r\n#lamina-case-submission .s09__button:disabled{\r\n color:rgba(43,20,47,.56) !important;\r\n background-color:rgba(247,242,234,.54) !important;\r\n border-color:rgba(247,242,234,.22) !important;\r\n}\r\n\r\n#lamina-case-submission .s09__back,\r\n#lamina-case-submission .s09__remove{\r\n color:rgba(247,242,234,.72) !important;\r\n background:transparent !important;\r\n border-color:transparent !important;\r\n}\r\n\r\n#lamina-case-submission .s09__back:hover,\r\n#lamina-case-submission .s09__back:focus-visible,\r\n#lamina-case-submission .s09__remove:hover,\r\n#lamina-case-submission .s09__remove:focus-visible{\r\n color:var(--s09-ivory) !important;\r\n}\r\n\r\n#lamina-case-submission .s09__privacy-link,\r\n#lamina-case-submission .s09__privacy-link:link,\r\n#lamina-case-submission .s09__privacy-link:visited,\r\n#lamina-case-submission .s09__privacy-link:hover,\r\n#lamina-case-submission .s09__privacy-link:focus,\r\n#lamina-case-submission .s09__privacy-link:focus-visible,\r\n#lamina-case-submission .s09__privacy-link:active{\r\n color:var(--s09-ivory) !important;\r\n text-decoration-color:rgba(197,178,200,.52) !important;\r\n}\r\n\r\n#lamina-case-submission input,\r\n#lamina-case-submission textarea,\r\n#lamina-case-submission select{\r\n color:var(--s09-ivory) !important;\r\n background-color:transparent !important;\r\n border-color:var(--s09-rule) !important;\r\n outline-color:transparent !important;\r\n caret-color:var(--s09-ivory);\r\n}\r\n\r\n#lamina-case-submission input:focus,\r\n#lamina-case-submission textarea:focus,\r\n#lamina-case-submission select:focus{\r\n color:var(--s09-ivory) !important;\r\n background-color:transparent !important;\r\n border-color:var(--s09-orchid) !important;\r\n box-shadow:none !important;\r\n outline:0 !important;\r\n}\r\n\r\n#lamina-case-submission input[type=\"radio\"],\r\n#lamina-case-submission input[type=\"checkbox\"]{\r\n accent-color:var(--s09-plum) !important;\r\n}\r\n\r\n#lamina-case-submission input:-webkit-autofill,\r\n#lamina-case-submission input:-webkit-autofill:hover,\r\n#lamina-case-submission input:-webkit-autofill:focus,\r\n#lamina-case-submission textarea:-webkit-autofill,\r\n#lamina-case-submission select:-webkit-autofill{\r\n -webkit-text-fill-color:var(--s09-ivory) !important;\r\n -webkit-box-shadow:0 0 0 1000px var(--s09-aubergine) inset !important;\r\n transition:background-color 9999s ease-out 0s;\r\n}\r\n\r\n#lamina-case-submission .s09__choice:focus-visible,\r\n#lamina-case-submission .s09__button:focus-visible,\r\n#lamina-case-submission .s09__back:focus-visible,\r\n#lamina-case-submission .s09__remove:focus-visible,\r\n#lamina-case-submission .s09__privacy-link:focus-visible,\r\n#lamina-case-submission .s09__upload-label:focus-within{\r\n outline:1px solid rgba(197,178,200,.78) !important;\r\n outline-offset:5px !important;\r\n}\r\n\r\n\/* =========================================================\r\n SHELL \/ DESKTOP LAYOUT\r\n ========================================================= *\/\r\n.s09__shell{\r\n width:min(100%,1720px);\r\n margin-inline:auto;\r\n\r\n padding:\r\n clamp(82px,9vh,118px)\r\n clamp(22px,3.5vw,66px)\r\n clamp(100px,10vh,140px);\r\n}\r\n\r\n.s09__layout{\r\n width:min(100%,var(--s09-stage));\r\n margin-inline:auto;\r\n\r\n display:grid;\r\n grid-template-columns:minmax(320px,.40fr) minmax(0,.60fr);\r\n gap:clamp(78px,8vw,148px);\r\n align-items:start;\r\n}\r\n\r\n\/* =========================================================\r\n EDITORIAL INTRO\r\n ========================================================= *\/\r\n.s09__editorial{\r\n min-width:0;\r\n padding-top:5px;\r\n}\r\n\r\n.s09__eyebrow{\r\n margin:0 0 17px;\r\n\r\n color:rgba(197,178,200,.76);\r\n\r\n font-size:clamp(11px,.70vw,13px);\r\n line-height:1.2;\r\n font-weight:600;\r\n letter-spacing:.17em;\r\n text-transform:uppercase;\r\n}\r\n\r\n.s09__title{\r\n margin:0;\r\n\r\n max-width:8.2ch;\r\n overflow:visible;\r\n\r\n color:var(--s09-ivory);\r\n\r\n font-family:\"Cormorant Garamond\",Georgia,serif;\r\n font-size:clamp(64px,5.2vw,96px);\r\n line-height:1;\r\n font-weight:400;\r\n letter-spacing:-.050em;\r\n}\r\n\r\n.s09__title-line{\r\n display:block;\r\n width:max-content;\r\n max-width:100%;\r\n\r\n line-height:.90;\r\n}\r\n\r\n.s09__title-line + .s09__title-line{\r\n margin-top:-.048em;\r\n}\r\n\r\n.s09__title-line--accent{\r\n margin-top:.040em !important;\r\n\r\n padding-inline-end:.055em;\r\n padding-bottom:.080em;\r\n\r\n color:var(--s09-orchid);\r\n\r\n font-style:italic;\r\n letter-spacing:-.038em;\r\n line-height:.93;\r\n}\r\n\r\n.s09__support{\r\n margin:clamp(25px,3vh,34px) 0 0;\r\n\r\n max-width:38ch;\r\n\r\n color:rgba(247,242,234,.70);\r\n\r\n font-size:clamp(15px,1vw,17px);\r\n line-height:1.70;\r\n}\r\n\r\n.s09__quiet-line{\r\n margin:clamp(29px,3.6vh,42px) 0 0;\r\n\r\n max-width:32ch;\r\n\r\n color:rgba(197,178,200,.58);\r\n\r\n font-size:13px;\r\n line-height:1.58;\r\n}\r\n\r\n.s09__clinical{\r\n margin:clamp(34px,4.2vh,50px) 0 0;\r\n\r\n max-width:42ch;\r\n\r\n color:rgba(247,242,234,.60);\r\n\r\n font-size:13.5px;\r\n line-height:1.62;\r\n}\r\n\r\n\/* =========================================================\r\n FORM ENVIRONMENT \u2014 NO WHITE CARD\r\n ========================================================= *\/\r\n.s09__form-wrap{\r\n min-width:0;\r\n}\r\n\r\n.s09__form{\r\n width:100%;\r\n margin:0;\r\n}\r\n\r\n.s09__intake-label{\r\n margin:0 0 15px;\r\n\r\n color:rgba(197,178,200,.64);\r\n\r\n font-size:11px;\r\n line-height:1.2;\r\n font-weight:600;\r\n letter-spacing:.15em;\r\n text-transform:uppercase;\r\n}\r\n\r\n\/* =========================================================\r\n PROGRESS\r\n ========================================================= *\/\r\n.s09__progress{\r\n margin-bottom:clamp(34px,4.8vh,56px);\r\n}\r\n\r\n.s09__progress-top{\r\n display:flex;\r\n justify-content:space-between;\r\n gap:20px;\r\n align-items:baseline;\r\n\r\n margin-bottom:13px;\r\n}\r\n\r\n.s09__progress-current{\r\n color:var(--s09-ivory);\r\n\r\n font-size:11px;\r\n line-height:1.2;\r\n font-weight:600;\r\n letter-spacing:.12em;\r\n}\r\n\r\n.s09__progress-accessible{\r\n position:absolute !important;\r\n width:1px !important;\r\n height:1px !important;\r\n padding:0 !important;\r\n margin:-1px !important;\r\n overflow:hidden !important;\r\n clip:rect(0,0,0,0) !important;\r\n white-space:nowrap !important;\r\n border:0 !important;\r\n}\r\n\r\n.s09__progress-labels{\r\n display:grid;\r\n grid-template-columns:repeat(5,minmax(0,1fr));\r\n gap:12px;\r\n}\r\n\r\n.s09__progress-item{\r\n color:rgba(247,242,234,.34);\r\n\r\n font-size:10.5px;\r\n line-height:1.25;\r\n font-weight:600;\r\n letter-spacing:.08em;\r\n text-transform:uppercase;\r\n\r\n transition:\r\n color .40s ease,\r\n opacity .40s ease;\r\n}\r\n\r\n.s09__progress-item.is-complete{\r\n color:rgba(197,178,200,.66);\r\n}\r\n\r\n.s09__progress-item.is-active{\r\n color:var(--s09-ivory);\r\n}\r\n\r\n.s09__progress-track{\r\n position:relative;\r\n\r\n height:1px;\r\n margin-top:14px;\r\n\r\n overflow:hidden;\r\n\r\n background:rgba(247,242,234,.14);\r\n}\r\n\r\n.s09__progress-fill{\r\n position:absolute;\r\n inset-block:0;\r\n inset-inline-start:0;\r\n\r\n width:var(--s09-progress,0%);\r\n background:var(--s09-orchid);\r\n\r\n transform-origin:0 50%;\r\n\r\n transition:\r\n width .52s var(--s09-ease);\r\n}\r\n\r\n[dir=\"rtl\"] #lamina-case-submission .s09__progress-fill{\r\n inset-inline-start:auto;\r\n inset-inline-end:0;\r\n}\r\n\r\n\/* =========================================================\r\n STEP STRUCTURE\r\n ========================================================= *\/\r\n.s09__step{\r\n min-width:0;\r\n}\r\n\r\n.s09__step[hidden]{\r\n display:none !important;\r\n}\r\n\r\n.s09__step-kicker{\r\n margin:0 0 11px;\r\n\r\n color:rgba(197,178,200,.62);\r\n\r\n font-size:11px;\r\n line-height:1.2;\r\n font-weight:600;\r\n letter-spacing:.13em;\r\n text-transform:uppercase;\r\n}\r\n\r\n.s09__step-title{\r\n margin:0;\r\n\r\n max-width:16ch;\r\n\r\n color:var(--s09-ivory);\r\n\r\n font-family:\"Cormorant Garamond\",Georgia,serif;\r\n font-size:clamp(38px,3.2vw,52px);\r\n line-height:.98;\r\n font-weight:400;\r\n letter-spacing:-.032em;\r\n}\r\n\r\n.s09__step-support{\r\n margin:15px 0 0;\r\n\r\n max-width:56ch;\r\n\r\n color:rgba(247,242,234,.62);\r\n\r\n font-size:14.5px;\r\n line-height:1.65;\r\n}\r\n\r\n.s09__step-body{\r\n margin-top:clamp(28px,3.6vh,42px);\r\n}\r\n\r\n\/* Progressive JS enhancement: actions are hidden in base\/no-JS form. *\/\r\n.s09__step-actions{\r\n display:none;\r\n}\r\n\r\n#lamina-case-submission.is-enhanced .s09__step-actions{\r\n display:flex;\r\n justify-content:space-between;\r\n align-items:center;\r\n gap:18px;\r\n\r\n margin-top:clamp(30px,4vh,46px);\r\n}\r\n\r\n.s09__step.is-leaving{\r\n opacity:0;\r\n transform:translate3d(0,-6px,0);\r\n\r\n transition:\r\n opacity .18s ease,\r\n transform .22s var(--s09-ease);\r\n}\r\n\r\n.s09__step.is-entering{\r\n opacity:0;\r\n transform:translate3d(0,8px,0);\r\n}\r\n\r\n.s09__step.is-entering.is-entered{\r\n opacity:1;\r\n transform:none;\r\n\r\n transition:\r\n opacity .38s ease,\r\n transform .44s var(--s09-ease);\r\n}\r\n\r\n\/* =========================================================\r\n TREATMENT CHOICES\r\n ========================================================= *\/\r\n.s09__choice-group{\r\n border:0;\r\n padding:0;\r\n margin:0;\r\n min-width:0;\r\n}\r\n\r\n.s09__choice-grid{\r\n display:grid;\r\n grid-template-columns:repeat(2,minmax(0,1fr));\r\n gap:0;\r\n\r\n border-top:1px solid var(--s09-rule);\r\n border-bottom:1px solid var(--s09-rule);\r\n}\r\n\r\n.s09__choice-wrap{\r\n position:relative;\r\n min-width:0;\r\n}\r\n\r\n.s09__choice-wrap + .s09__choice-wrap{\r\n border-inline-start:1px solid var(--s09-rule);\r\n}\r\n\r\n.s09__choice-input{\r\n position:absolute;\r\n inline-size:1px;\r\n block-size:1px;\r\n opacity:0;\r\n pointer-events:none;\r\n}\r\n\r\n.s09__choice{\r\n display:flex;\r\n flex-direction:column;\r\n justify-content:center;\r\n\r\n width:100%;\r\n min-height:150px;\r\n\r\n padding:\r\n 28px\r\n clamp(24px,3vw,42px);\r\n\r\n border:1px solid transparent;\r\n border-radius:0;\r\n\r\n cursor:pointer;\r\n\r\n text-align:start;\r\n\r\n transition:\r\n color .44s ease,\r\n background-color .44s ease,\r\n border-color .44s ease;\r\n}\r\n\r\n.s09__choice-name{\r\n display:block;\r\n\r\n color:inherit;\r\n\r\n font-family:\"Cormorant Garamond\",Georgia,serif;\r\n font-size:clamp(31px,2.7vw,43px);\r\n line-height:.98;\r\n font-weight:400;\r\n letter-spacing:-.028em;\r\n}\r\n\r\n.s09__choice-copy{\r\n display:block;\r\n\r\n margin-top:10px;\r\n\r\n max-width:34ch;\r\n\r\n color:rgba(247,242,234,.54);\r\n\r\n font-size:13px;\r\n line-height:1.55;\r\n}\r\n\r\n.s09__choice-input:checked + .s09__choice{\r\n background-color:rgba(95,36,104,.12) !important;\r\n border-color:rgba(197,178,200,.46) !important;\r\n}\r\n\r\n.s09__choice-input:focus-visible + .s09__choice{\r\n outline:1px solid rgba(197,178,200,.78);\r\n outline-offset:5px;\r\n}\r\n\r\n\/* =========================================================\r\n FIELDS\r\n ========================================================= *\/\r\n.s09__field-grid{\r\n display:grid;\r\n grid-template-columns:repeat(2,minmax(0,1fr));\r\n gap:\r\n 28px\r\n clamp(26px,3.2vw,48px);\r\n}\r\n\r\n.s09__field{\r\n min-width:0;\r\n}\r\n\r\n.s09__field--full{\r\n grid-column:1 \/ -1;\r\n}\r\n\r\n.s09__label{\r\n display:block;\r\n\r\n margin-bottom:7px;\r\n\r\n color:rgba(197,178,200,.72);\r\n\r\n font-size:11px;\r\n line-height:1.2;\r\n font-weight:600;\r\n letter-spacing:.095em;\r\n text-transform:uppercase;\r\n}\r\n\r\n.s09__label-note{\r\n color:rgba(197,178,200,.44);\r\n font-weight:500;\r\n letter-spacing:.02em;\r\n text-transform:none;\r\n}\r\n\r\n.s09__input,\r\n.s09__select,\r\n.s09__textarea{\r\n width:100%;\r\n\r\n border:\r\n 0\r\n 0\r\n 1px\r\n 0;\r\n\r\n border-style:solid;\r\n\r\n border-radius:0;\r\n\r\n padding:\r\n 10px\r\n 0\r\n 12px;\r\n\r\n color:var(--s09-ivory);\r\n\r\n font-size:clamp(16px,1.08vw,18px);\r\n line-height:1.45;\r\n\r\n appearance:none;\r\n\r\n transition:\r\n border-color .40s ease,\r\n color .40s ease;\r\n}\r\n\r\n.s09__select{\r\n padding-inline-end:34px;\r\n\r\n background-image:\r\n linear-gradient(45deg,transparent 50%,rgba(247,242,234,.62) 50%),\r\n linear-gradient(135deg,rgba(247,242,234,.62) 50%,transparent 50%);\r\n\r\n background-position:\r\n calc(100% - 14px) 52%,\r\n calc(100% - 9px) 52%;\r\n\r\n background-size:\r\n 5px 5px,\r\n 5px 5px;\r\n\r\n background-repeat:no-repeat;\r\n}\r\n\r\n[dir=\"rtl\"] #lamina-case-submission .s09__select{\r\n background-position:\r\n 14px 52%,\r\n 9px 52%;\r\n\r\n padding-inline:\r\n 34px\r\n 0;\r\n}\r\n\r\n.s09__select option{\r\n color:var(--s09-ink);\r\n background:var(--s09-ivory);\r\n}\r\n\r\n.s09__textarea{\r\n min-height:132px;\r\n max-height:320px;\r\n resize:vertical;\r\n\r\n border:1px solid var(--s09-rule) !important;\r\n\r\n padding:\r\n 16px\r\n 17px;\r\n\r\n line-height:1.58;\r\n}\r\n\r\n.s09__input::placeholder,\r\n.s09__textarea::placeholder{\r\n color:rgba(247,242,234,.32);\r\n opacity:1;\r\n}\r\n\r\n.s09__error{\r\n min-height:1.3em;\r\n margin:7px 0 0;\r\n\r\n color:var(--s09-error);\r\n\r\n font-size:12.5px;\r\n line-height:1.45;\r\n}\r\n\r\n.s09__field[aria-invalid=\"true\"] .s09__label{\r\n color:var(--s09-error);\r\n}\r\n\r\n.s09__field[aria-invalid=\"true\"] .s09__input,\r\n.s09__field[aria-invalid=\"true\"] .s09__select,\r\n.s09__field[aria-invalid=\"true\"] .s09__textarea{\r\n border-color:var(--s09-error) !important;\r\n}\r\n\r\n\/* =========================================================\r\n CASE INTEREST CHOICES\r\n ========================================================= *\/\r\n.s09__interest-list{\r\n display:flex;\r\n flex-wrap:wrap;\r\n gap:\r\n 10px\r\n 18px;\r\n\r\n margin-bottom:30px;\r\n}\r\n\r\n.s09__interest-option{\r\n position:relative;\r\n}\r\n\r\n.s09__interest-option input{\r\n position:absolute;\r\n inline-size:1px;\r\n block-size:1px;\r\n opacity:0;\r\n}\r\n\r\n.s09__interest-option label{\r\n display:inline-flex;\r\n align-items:center;\r\n\r\n min-height:44px;\r\n\r\n padding:\r\n 8px\r\n 0;\r\n\r\n border-bottom:1px solid rgba(247,242,234,.16);\r\n\r\n color:rgba(247,242,234,.62);\r\n\r\n cursor:pointer;\r\n\r\n font-size:12px;\r\n line-height:1.25;\r\n font-weight:600;\r\n letter-spacing:.075em;\r\n text-transform:uppercase;\r\n\r\n transition:\r\n color .36s ease,\r\n border-color .36s ease;\r\n}\r\n\r\n.s09__interest-option input:checked + label{\r\n color:var(--s09-ivory);\r\n border-color:var(--s09-orchid);\r\n}\r\n\r\n.s09__interest-option input:focus-visible + label{\r\n outline:1px solid rgba(197,178,200,.78);\r\n outline-offset:4px;\r\n}\r\n\r\n\/* =========================================================\r\n FILE UPLOAD\r\n ========================================================= *\/\r\n.s09__upload{\r\n margin-top:30px;\r\n}\r\n\r\n.s09__upload-label{\r\n position:relative;\r\n\r\n display:flex;\r\n justify-content:space-between;\r\n gap:24px;\r\n align-items:center;\r\n\r\n min-height:82px;\r\n\r\n padding:\r\n 18px\r\n 0;\r\n\r\n border-top:1px solid var(--s09-rule);\r\n border-bottom:1px solid var(--s09-rule);\r\n\r\n cursor:pointer;\r\n}\r\n\r\n.s09__upload-title{\r\n color:var(--s09-ivory);\r\n\r\n font-family:\"Cormorant Garamond\",Georgia,serif;\r\n font-size:clamp(27px,2.3vw,36px);\r\n line-height:1;\r\n letter-spacing:-.025em;\r\n}\r\n\r\n.s09__upload-meta{\r\n display:block;\r\n margin-top:7px;\r\n\r\n color:rgba(197,178,200,.52);\r\n\r\n font-size:12px;\r\n line-height:1.45;\r\n}\r\n\r\n.s09__upload-plus{\r\n flex:0 0 auto;\r\n\r\n color:var(--s09-orchid);\r\n\r\n font-size:28px;\r\n line-height:1;\r\n font-weight:300;\r\n}\r\n\r\n.s09__file-input{\r\n position:absolute;\r\n inline-size:1px;\r\n block-size:1px;\r\n opacity:0;\r\n pointer-events:none;\r\n}\r\n\r\n.s09__file-previews{\r\n display:grid;\r\n grid-template-columns:repeat(3,minmax(0,1fr));\r\n gap:12px;\r\n\r\n margin-top:16px;\r\n}\r\n\r\n.s09__file-preview{\r\n min-width:0;\r\n\r\n border-bottom:1px solid var(--s09-rule);\r\n\r\n padding-bottom:10px;\r\n}\r\n\r\n.s09__file-thumb{\r\n position:relative;\r\n overflow:hidden;\r\n\r\n width:100%;\r\n aspect-ratio:4 \/ 3;\r\n\r\n background:rgba(247,242,234,.055);\r\n}\r\n\r\n.s09__file-thumb img{\r\n width:100%;\r\n height:100%;\r\n display:block;\r\n\r\n object-fit:cover;\r\n}\r\n\r\n.s09__file-pdf{\r\n width:100%;\r\n height:100%;\r\n\r\n display:grid;\r\n place-items:center;\r\n\r\n color:rgba(197,178,200,.66);\r\n\r\n font-size:12px;\r\n font-weight:600;\r\n letter-spacing:.12em;\r\n}\r\n\r\n.s09__file-row{\r\n display:flex;\r\n justify-content:space-between;\r\n gap:10px;\r\n align-items:center;\r\n\r\n margin-top:8px;\r\n}\r\n\r\n.s09__file-name{\r\n min-width:0;\r\n overflow:hidden;\r\n text-overflow:ellipsis;\r\n white-space:nowrap;\r\n\r\n color:rgba(247,242,234,.62);\r\n\r\n font-size:11.5px;\r\n line-height:1.3;\r\n}\r\n\r\n.s09__remove{\r\n flex:0 0 auto;\r\n\r\n min-width:44px;\r\n min-height:44px;\r\n\r\n padding:0;\r\n\r\n border:0;\r\n\r\n cursor:pointer;\r\n\r\n font-size:11px;\r\n letter-spacing:.06em;\r\n text-transform:uppercase;\r\n}\r\n\r\n\/* =========================================================\r\n REVIEW\r\n ========================================================= *\/\r\n.s09__review{\r\n border-top:1px solid var(--s09-rule);\r\n}\r\n\r\n.s09__review-row{\r\n display:grid;\r\n grid-template-columns:160px minmax(0,1fr) 58px;\r\n gap:22px;\r\n align-items:start;\r\n\r\n padding:\r\n 20px\r\n 0;\r\n\r\n border-bottom:1px solid var(--s09-rule);\r\n}\r\n\r\n.s09__review-label{\r\n color:rgba(197,178,200,.56);\r\n\r\n font-size:10.5px;\r\n line-height:1.35;\r\n font-weight:600;\r\n letter-spacing:.10em;\r\n text-transform:uppercase;\r\n}\r\n\r\n.s09__review-value{\r\n color:rgba(247,242,234,.82);\r\n\r\n font-size:14.5px;\r\n line-height:1.55;\r\n}\r\n\r\n.s09__review-edit{\r\n min-width:44px;\r\n min-height:44px;\r\n\r\n padding:0;\r\n\r\n border:0;\r\n\r\n color:rgba(247,242,234,.58);\r\n background:transparent;\r\n\r\n cursor:pointer;\r\n\r\n font-size:10.5px;\r\n line-height:1.2;\r\n letter-spacing:.08em;\r\n text-transform:uppercase;\r\n}\r\n\r\n.s09__review-edit:hover,\r\n.s09__review-edit:focus-visible{\r\n color:var(--s09-ivory);\r\n}\r\n\r\n.s09__consent{\r\n margin-top:28px;\r\n\r\n display:grid;\r\n grid-template-columns:44px minmax(0,1fr);\r\n gap:11px;\r\n align-items:start;\r\n}\r\n\r\n.s09__consent-control{\r\n display:grid;\r\n place-items:center;\r\n\r\n width:44px;\r\n height:44px;\r\n}\r\n\r\n.s09__consent-control input{\r\n width:19px;\r\n height:19px;\r\n margin:0;\r\n}\r\n\r\n.s09__consent-copy{\r\n margin:0;\r\n padding-top:9px;\r\n\r\n color:rgba(247,242,234,.62);\r\n\r\n font-size:13.5px;\r\n line-height:1.62;\r\n}\r\n\r\n.s09__privacy-link{\r\n text-underline-offset:3px;\r\n}\r\n\r\n.s09__legal-warning{\r\n margin:10px 0 0 55px;\r\n\r\n color:rgba(197,178,200,.44);\r\n\r\n font-size:11.5px;\r\n line-height:1.48;\r\n}\r\n\r\n\/* =========================================================\r\n BUTTONS\r\n ========================================================= *\/\r\n.s09__button{\r\n display:inline-flex;\r\n align-items:center;\r\n justify-content:center;\r\n\r\n min-width:174px;\r\n min-height:52px;\r\n\r\n padding:\r\n 0\r\n 23px;\r\n\r\n border:1px solid var(--s09-ivory);\r\n border-radius:6px;\r\n\r\n cursor:pointer;\r\n\r\n font-size:11.5px;\r\n line-height:1.2;\r\n font-weight:600;\r\n letter-spacing:.09em;\r\n text-transform:uppercase;\r\n\r\n transition:\r\n color .50s ease,\r\n background-color .50s ease,\r\n border-color .50s ease;\r\n}\r\n\r\n.s09__back{\r\n display:inline-flex;\r\n align-items:center;\r\n justify-content:flex-start;\r\n\r\n min-width:44px;\r\n min-height:44px;\r\n\r\n padding:0;\r\n\r\n border:0;\r\n\r\n cursor:pointer;\r\n\r\n font-size:11px;\r\n line-height:1.2;\r\n font-weight:600;\r\n letter-spacing:.09em;\r\n text-transform:uppercase;\r\n\r\n transition:color .40s ease;\r\n}\r\n\r\n.s09__submit-status{\r\n min-height:1.5em;\r\n margin:15px 0 0;\r\n\r\n color:rgba(247,242,234,.64);\r\n\r\n font-size:13px;\r\n line-height:1.5;\r\n}\r\n\r\n.s09__submit-status.is-error{\r\n color:var(--s09-error);\r\n}\r\n\r\n\/* =========================================================\r\n NO-JS MESSAGE\r\n ========================================================= *\/\r\n.s09__noscript{\r\n margin:\r\n 0\r\n 0\r\n 26px;\r\n\r\n padding:\r\n 14px\r\n 0;\r\n\r\n border-top:1px solid var(--s09-rule);\r\n border-bottom:1px solid var(--s09-rule);\r\n\r\n color:rgba(247,242,234,.66);\r\n\r\n font-size:13px;\r\n line-height:1.55;\r\n}\r\n\r\n\/* =========================================================\r\n LAMINA PASSED-CONTENT DEPTH\r\n Active form step deliberately does NOT receive this filter.\r\n ========================================================= *\/\r\n#lamina-case-submission [data-s09-depth]{\r\n --s09-entry-blur:0px;\r\n --s09-passed-blur:0px;\r\n --s09-depth-opacity:1;\r\n\r\n filter:\r\n blur(\r\n calc(\r\n var(--s09-entry-blur) +\r\n var(--s09-passed-blur)\r\n )\r\n );\r\n\r\n opacity:var(--s09-depth-opacity);\r\n\r\n will-change:filter,opacity;\r\n}\r\n\r\n#lamina-case-submission [data-s09-depth]:hover,\r\n#lamina-case-submission [data-s09-depth]:focus-within{\r\n --s09-passed-blur:0px !important;\r\n --s09-depth-opacity:1 !important;\r\n}\r\n\r\n\/* =========================================================\r\n ONE-TIME SECTION ENTRANCE\r\n ========================================================= *\/\r\n#lamina-case-submission.has-entry .s09__eyebrow{\r\n opacity:0;\r\n transform:translate3d(0,8px,0);\r\n --s09-entry-blur:2.4px;\r\n}\r\n\r\n#lamina-case-submission.has-entry .s09__title-line{\r\n opacity:0;\r\n transform:translate3d(0,100%,0);\r\n --s09-entry-blur:4px;\r\n}\r\n\r\n#lamina-case-submission.has-entry .s09__support,\r\n#lamina-case-submission.has-entry .s09__quiet-line,\r\n#lamina-case-submission.has-entry .s09__clinical{\r\n opacity:0;\r\n transform:translate3d(0,9px,0);\r\n --s09-entry-blur:2.4px;\r\n}\r\n\r\n#lamina-case-submission.has-entry .s09__progress{\r\n opacity:.14;\r\n transform:translate3d(0,6px,0);\r\n}\r\n\r\n#lamina-case-submission.has-entry .s09__progress-fill{\r\n width:0 !important;\r\n}\r\n\r\n#lamina-case-submission.has-entry .s09__intake-label,\r\n#lamina-case-submission.has-entry .s09__step-title,\r\n#lamina-case-submission.has-entry .s09__step-support,\r\n#lamina-case-submission.has-entry .s09__choice-wrap{\r\n opacity:0;\r\n transform:translate3d(0,8px,0);\r\n}\r\n\r\n#lamina-case-submission.has-entry.is-entered .s09__eyebrow{\r\n opacity:1;\r\n transform:none;\r\n --s09-entry-blur:0px;\r\n\r\n transition:\r\n opacity .44s var(--s09-ease) .03s,\r\n transform .50s var(--s09-ease) .03s,\r\n filter .42s ease .03s;\r\n}\r\n\r\n#lamina-case-submission.has-entry.is-entered .s09__title-line{\r\n opacity:1;\r\n transform:none;\r\n --s09-entry-blur:0px;\r\n\r\n transition:\r\n opacity .58s var(--s09-ease),\r\n transform .70s cubic-bezier(.12,.82,.18,1),\r\n filter .46s ease;\r\n}\r\n\r\n#lamina-case-submission.has-entry.is-entered .s09__title-line:nth-child(1){\r\n transition-delay:.07s;\r\n}\r\n\r\n#lamina-case-submission.has-entry.is-entered .s09__title-line:nth-child(2){\r\n transition-delay:.15s;\r\n}\r\n\r\n#lamina-case-submission.has-entry.is-entered .s09__support{\r\n opacity:1;\r\n transform:none;\r\n --s09-entry-blur:0px;\r\n\r\n transition:\r\n opacity .50s var(--s09-ease) .20s,\r\n transform .54s var(--s09-ease) .20s,\r\n filter .44s ease .20s;\r\n}\r\n\r\n#lamina-case-submission.has-entry.is-entered .s09__quiet-line{\r\n opacity:1;\r\n transform:none;\r\n --s09-entry-blur:0px;\r\n\r\n transition:\r\n opacity .48s var(--s09-ease) .27s,\r\n transform .52s var(--s09-ease) .27s,\r\n filter .42s ease .27s;\r\n}\r\n\r\n#lamina-case-submission.has-entry.is-entered .s09__clinical{\r\n opacity:1;\r\n transform:none;\r\n --s09-entry-blur:0px;\r\n\r\n transition:\r\n opacity .48s var(--s09-ease) .34s,\r\n transform .52s var(--s09-ease) .34s,\r\n filter .42s ease .34s;\r\n}\r\n\r\n#lamina-case-submission.has-entry.is-entered .s09__progress{\r\n opacity:1;\r\n transform:none;\r\n\r\n transition:\r\n opacity .50s var(--s09-ease) .23s,\r\n transform .54s var(--s09-ease) .23s;\r\n}\r\n\r\n#lamina-case-submission.has-entry.is-entered .s09__intake-label,\r\n#lamina-case-submission.has-entry.is-entered .s09__step-title,\r\n#lamina-case-submission.has-entry.is-entered .s09__step-support{\r\n opacity:1;\r\n transform:none;\r\n\r\n transition:\r\n opacity .48s var(--s09-ease),\r\n transform .54s var(--s09-ease);\r\n}\r\n\r\n#lamina-case-submission.has-entry.is-entered .s09__intake-label{\r\n transition-delay:.34s;\r\n}\r\n\r\n#lamina-case-submission.has-entry.is-entered .s09__step-title{\r\n transition-delay:.39s;\r\n}\r\n\r\n#lamina-case-submission.has-entry.is-entered .s09__step-support{\r\n transition-delay:.44s;\r\n}\r\n\r\n#lamina-case-submission.has-entry.is-entered .s09__choice-wrap{\r\n opacity:1;\r\n transform:none;\r\n\r\n transition:\r\n opacity .50s var(--s09-ease),\r\n transform .56s var(--s09-ease);\r\n}\r\n\r\n#lamina-case-submission.has-entry.is-entered .s09__choice-wrap:nth-child(1){\r\n transition-delay:.50s;\r\n}\r\n\r\n#lamina-case-submission.has-entry.is-entered .s09__choice-wrap:nth-child(2){\r\n transition-delay:.57s;\r\n}\r\n\r\n\/* =========================================================\r\n TABLET\r\n ========================================================= *\/\r\n@media (min-width:960px) and (max-width:1180px){\r\n .s09__shell{\r\n padding-inline:30px;\r\n }\r\n\r\n .s09__layout{\r\n grid-template-columns:minmax(290px,.38fr) minmax(0,.62fr);\r\n gap:58px;\r\n }\r\n\r\n .s09__title{\r\n font-size:clamp(60px,6vw,80px);\r\n }\r\n\r\n .s09__field-grid{\r\n column-gap:30px;\r\n }\r\n}\r\n\r\n\/* =========================================================\r\n MOBILE \/ PORTRAIT TABLET \u2014 PRIVATE INTAKE\r\n ========================================================= *\/\r\n@media (max-width:959px){\r\n .s09__shell{\r\n padding:\r\n 62px\r\n 20px\r\n 84px;\r\n }\r\n\r\n .s09__layout{\r\n display:block;\r\n width:100%;\r\n }\r\n\r\n .s09__editorial{\r\n padding-top:0;\r\n }\r\n\r\n .s09__title{\r\n max-width:8.2ch;\r\n\r\n font-size:clamp(48px,13.8vw,60px);\r\n }\r\n\r\n .s09__title-line{\r\n line-height:.91;\r\n }\r\n\r\n .s09__title-line + .s09__title-line{\r\n margin-top:-.035em;\r\n }\r\n\r\n .s09__title-line--accent{\r\n margin-top:.034em !important;\r\n padding-bottom:.09em;\r\n }\r\n\r\n .s09__support{\r\n margin-top:19px;\r\n max-width:36ch;\r\n\r\n font-size:15px;\r\n line-height:1.65;\r\n }\r\n\r\n .s09__quiet-line{\r\n display:none;\r\n }\r\n\r\n .s09__clinical{\r\n margin-top:19px;\r\n\r\n font-size:13px;\r\n line-height:1.58;\r\n }\r\n\r\n .s09__form-wrap{\r\n margin-top:28px;\r\n }\r\n\r\n .s09__progress{\r\n margin-bottom:30px;\r\n }\r\n\r\n .s09__progress-labels{\r\n gap:6px;\r\n }\r\n\r\n .s09__progress-item{\r\n font-size:9.8px;\r\n letter-spacing:.045em;\r\n }\r\n\r\n .s09__step-title{\r\n max-width:15ch;\r\n\r\n font-size:clamp(34px,9.4vw,43px);\r\n }\r\n\r\n .s09__step-support{\r\n font-size:14px;\r\n }\r\n\r\n .s09__step-body{\r\n margin-top:28px;\r\n }\r\n\r\n .s09__choice-grid{\r\n display:block;\r\n }\r\n\r\n .s09__choice-wrap + .s09__choice-wrap{\r\n border-inline-start:0;\r\n border-top:1px solid var(--s09-rule);\r\n }\r\n\r\n .s09__choice{\r\n min-height:92px;\r\n\r\n padding:\r\n 22px\r\n 0;\r\n }\r\n\r\n .s09__choice-name{\r\n font-size:clamp(31px,9vw,40px);\r\n }\r\n\r\n .s09__choice-copy{\r\n max-width:31ch;\r\n\r\n font-size:13px;\r\n }\r\n\r\n .s09__field-grid{\r\n display:block;\r\n }\r\n\r\n .s09__field + .s09__field{\r\n margin-top:24px;\r\n }\r\n\r\n .s09__input,\r\n .s09__select,\r\n .s09__textarea{\r\n font-size:16px;\r\n }\r\n\r\n .s09__textarea{\r\n min-height:122px;\r\n }\r\n\r\n .s09__interest-list{\r\n gap:\r\n 7px\r\n 15px;\r\n }\r\n\r\n .s09__upload-label{\r\n min-height:78px;\r\n }\r\n\r\n .s09__file-previews{\r\n grid-template-columns:repeat(2,minmax(0,1fr));\r\n }\r\n\r\n .s09__review-row{\r\n grid-template-columns:1fr 52px;\r\n grid-template-areas:\r\n \"label edit\"\r\n \"value edit\";\r\n\r\n gap:\r\n 6px\r\n 14px;\r\n }\r\n\r\n .s09__review-label{\r\n grid-area:label;\r\n }\r\n\r\n .s09__review-value{\r\n grid-area:value;\r\n }\r\n\r\n .s09__review-edit{\r\n grid-area:edit;\r\n align-self:center;\r\n }\r\n\r\n .s09__consent-copy{\r\n font-size:13.5px;\r\n }\r\n\r\n .s09__legal-warning{\r\n margin-inline-start:55px;\r\n }\r\n\r\n #lamina-case-submission.is-enhanced .s09__step-actions{\r\n margin-top:32px;\r\n }\r\n\r\n .s09__button{\r\n min-height:54px;\r\n min-width:164px;\r\n }\r\n\r\n .s09__step.is-entering.is-entered{\r\n transition-duration:.34s;\r\n }\r\n}\r\n\r\n@media (max-width:420px){\r\n .s09__shell{\r\n padding-inline:18px;\r\n }\r\n\r\n .s09__progress-labels{\r\n grid-template-columns:repeat(5,1fr);\r\n }\r\n\r\n .s09__progress-item span{\r\n display:none;\r\n }\r\n\r\n .s09__button{\r\n min-width:154px;\r\n }\r\n\r\n .s09__file-previews{\r\n gap:10px;\r\n }\r\n}\r\n\r\n\/* =========================================================\r\n RTL\r\n ========================================================= *\/\r\n[dir=\"rtl\"] #lamina-case-submission{\r\n direction:rtl;\r\n}\r\n\r\n[dir=\"rtl\"] #lamina-case-submission .s09__choice,\r\n[dir=\"rtl\"] #lamina-case-submission .s09__support,\r\n[dir=\"rtl\"] #lamina-case-submission .s09__clinical,\r\n[dir=\"rtl\"] #lamina-case-submission .s09__quiet-line,\r\n[dir=\"rtl\"] #lamina-case-submission .s09__field,\r\n[dir=\"rtl\"] #lamina-case-submission .s09__review,\r\n[dir=\"rtl\"] #lamina-case-submission .s09__consent-copy{\r\n text-align:start;\r\n}\r\n\r\n\/* =========================================================\r\n REDUCED MOTION\r\n ========================================================= *\/\r\n@media (prefers-reduced-motion:reduce){\r\n #lamina-case-submission [data-s09-depth]{\r\n --s09-entry-blur:0px !important;\r\n --s09-passed-blur:0px !important;\r\n --s09-depth-opacity:1 !important;\r\n\r\n filter:none !important;\r\n opacity:1 !important;\r\n }\r\n\r\n #lamina-case-submission.has-entry .s09__eyebrow,\r\n #lamina-case-submission.has-entry .s09__title-line,\r\n #lamina-case-submission.has-entry .s09__support,\r\n #lamina-case-submission.has-entry .s09__quiet-line,\r\n #lamina-case-submission.has-entry .s09__clinical,\r\n #lamina-case-submission.has-entry .s09__progress,\r\n #lamina-case-submission.has-entry .s09__intake-label,\r\n #lamina-case-submission.has-entry .s09__step-title,\r\n #lamina-case-submission.has-entry .s09__step-support,\r\n #lamina-case-submission.has-entry .s09__choice-wrap,\r\n #lamina-case-submission .s09__step{\r\n opacity:1 !important;\r\n transform:none !important;\r\n filter:none !important;\r\n transition:none !important;\r\n }\r\n\r\n #lamina-case-submission .s09__progress-fill,\r\n #lamina-case-submission .s09__choice,\r\n #lamina-case-submission .s09__button,\r\n #lamina-case-submission .s09__answer{\r\n transition:none !important;\r\n }\r\n}\r\n<\/style>\r\n\r\n<section\r\n id=\"lamina-case-submission\"\r\n aria-labelledby=\"lamina-case-submission-title\"\r\n data-lamina-focus-section\r\n>\r\n <div class=\"s09__shell\">\r\n\r\n <div class=\"s09__layout\">\r\n\r\n <header class=\"s09__editorial\">\r\n\r\n <p\r\n class=\"s09__eyebrow\"\r\n data-s09-depth=\"eyebrow\"\r\n >\r\n 09 \u2014 START FROM HOME\r\n <\/p>\r\n\r\n <h2\r\n class=\"s09__title\"\r\n id=\"lamina-case-submission-title\"\r\n >\r\n <span\r\n class=\"s09__title-line\"\r\n data-s09-depth=\"headline\"\r\n >\r\n Tell us\r\n <\/span>\r\n\r\n <span\r\n class=\"s09__title-line s09__title-line--accent\"\r\n data-s09-depth=\"headline\"\r\n >\r\n what you\u2019re<br>considering.\r\n <\/span>\r\n <\/h2>\r\n\r\n <p\r\n class=\"s09__support\"\r\n data-s09-depth=\"copy\"\r\n >\r\n Choose the treatment area you\u2019re interested in and share the information you already have. Lamina can use it to begin the conversation and guide you toward the appropriate next step.\r\n <\/p>\r\n\r\n <p\r\n class=\"s09__quiet-line\"\r\n data-s09-depth=\"copy\"\r\n >\r\n Your first step does not need to start in Istanbul.\r\n <\/p>\r\n\r\n <p\r\n class=\"s09__clinical\"\r\n data-s09-depth=\"copy\"\r\n >\r\n Information submitted online supports an initial review only. Final treatment decisions are made following the appropriate clinical assessment.\r\n <\/p>\r\n\r\n <\/header>\r\n\r\n <div class=\"s09__form-wrap\">\r\n\r\n <form\r\n class=\"s09__form\"\r\n id=\"lamina-case-form\"\r\n method=\"post\"\r\n action=\"{{LAMINA_SECURE_CASE_ENDPOINT}}\"\r\n enctype=\"multipart\/form-data\"\r\n novalidate\r\n data-thank-you-url=\"{{THANK_YOU_URL}}\"\r\n >\r\n\r\n <input\r\n type=\"hidden\"\r\n name=\"_lamina_nonce\"\r\n value=\"{{LAMINA_SECURE_NONCE}}\"\r\n >\r\n\r\n <input type=\"hidden\" name=\"utm_source\" value=\"\">\r\n <input type=\"hidden\" name=\"utm_medium\" value=\"\">\r\n <input type=\"hidden\" name=\"utm_campaign\" value=\"\">\r\n <input type=\"hidden\" name=\"utm_content\" value=\"\">\r\n <input type=\"hidden\" name=\"utm_term\" value=\"\">\r\n <input type=\"hidden\" name=\"gclid\" value=\"\">\r\n <input type=\"hidden\" name=\"fbclid\" value=\"\">\r\n <input type=\"hidden\" name=\"landing_page\" value=\"\">\r\n <input type=\"hidden\" name=\"referrer\" value=\"\">\r\n <input type=\"hidden\" name=\"language\" value=\"\">\r\n <input type=\"hidden\" name=\"discipline\" value=\"\">\r\n <input type=\"hidden\" name=\"consent_version\" value=\"development-placeholder-v1\">\r\n <input type=\"hidden\" name=\"consent_timestamp\" value=\"\">\r\n\r\n <div\r\n aria-hidden=\"true\"\r\n style=\"position:absolute;inline-size:1px;block-size:1px;overflow:hidden;clip-path:inset(50%);\"\r\n >\r\n <label>\r\n Leave this field empty\r\n <input\r\n type=\"text\"\r\n name=\"website_confirm\"\r\n tabindex=\"-1\"\r\n autocomplete=\"off\"\r\n >\r\n <\/label>\r\n <\/div>\r\n\r\n <p\r\n class=\"s09__intake-label\"\r\n data-s09-depth=\"ui\"\r\n >\r\n INITIAL ASSESSMENT\r\n <\/p>\r\n\r\n <div\r\n class=\"s09__progress\"\r\n data-s09-depth=\"ui\"\r\n >\r\n <div class=\"s09__progress-top\">\r\n <span\r\n class=\"s09__progress-current\"\r\n data-progress-count\r\n >\r\n 01 \/ 05\r\n <\/span>\r\n\r\n <span\r\n class=\"s09__progress-accessible\"\r\n aria-live=\"polite\"\r\n data-progress-accessible\r\n >\r\n Step 1 of 5: Treatment area.\r\n <\/span>\r\n <\/div>\r\n\r\n <div\r\n class=\"s09__progress-labels\"\r\n aria-hidden=\"true\"\r\n >\r\n <div class=\"s09__progress-item is-active\" data-progress-item=\"1\">\r\n 01 <span>Treatment<\/span>\r\n <\/div>\r\n <div class=\"s09__progress-item\" data-progress-item=\"2\">\r\n 02 <span>Details<\/span>\r\n <\/div>\r\n <div class=\"s09__progress-item\" data-progress-item=\"3\">\r\n 03 <span>Case<\/span>\r\n <\/div>\r\n <div class=\"s09__progress-item\" data-progress-item=\"4\">\r\n 04 <span>Files<\/span>\r\n <\/div>\r\n <div class=\"s09__progress-item\" data-progress-item=\"5\">\r\n 05 <span>Send<\/span>\r\n <\/div>\r\n <\/div>\r\n\r\n <div\r\n class=\"s09__progress-track\"\r\n aria-hidden=\"true\"\r\n >\r\n <div\r\n class=\"s09__progress-fill\"\r\n data-progress-fill\r\n ><\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n <noscript>\r\n <p class=\"s09__noscript\">\r\n JavaScript is unavailable. The full intake remains below in one linear form. Complete only the Hair or Dental case fields that match the treatment area you select.\r\n <\/p>\r\n <\/noscript>\r\n\r\n <!-- ==================================================\r\n STEP 01 \u2014 TREATMENT AREA\r\n ================================================== -->\r\n <section\r\n class=\"s09__step\"\r\n data-form-step=\"1\"\r\n aria-labelledby=\"s09-step-1-title\"\r\n >\r\n <p class=\"s09__step-kicker\">01 \u2014 TREATMENT AREA<\/p>\r\n\r\n <h3\r\n class=\"s09__step-title\"\r\n id=\"s09-step-1-title\"\r\n tabindex=\"-1\"\r\n >\r\n What would you like us to look at?\r\n <\/h3>\r\n\r\n <p class=\"s09__step-support\">\r\n Choose the area you\u2019re considering. You do not need to know the exact treatment yet.\r\n <\/p>\r\n\r\n <div class=\"s09__step-body\">\r\n <fieldset class=\"s09__choice-group\">\r\n <legend class=\"s09__progress-accessible\">\r\n Choose one treatment area\r\n <\/legend>\r\n\r\n <div class=\"s09__choice-grid\">\r\n\r\n <div class=\"s09__choice-wrap\">\r\n <input\r\n class=\"s09__choice-input\"\r\n type=\"radio\"\r\n name=\"treatment_area\"\r\n id=\"s09-discipline-hair\"\r\n value=\"hair\"\r\n required\r\n >\r\n\r\n <label\r\n class=\"s09__choice\"\r\n for=\"s09-discipline-hair\"\r\n >\r\n <span class=\"s09__choice-name\">\r\n Hair Restoration\r\n <\/span>\r\n\r\n <span class=\"s09__choice-copy\">\r\n Hairline, density and restoration concerns.\r\n <\/span>\r\n <\/label>\r\n <\/div>\r\n\r\n <div class=\"s09__choice-wrap\">\r\n <input\r\n class=\"s09__choice-input\"\r\n type=\"radio\"\r\n name=\"treatment_area\"\r\n id=\"s09-discipline-dental\"\r\n value=\"dental\"\r\n required\r\n >\r\n\r\n <label\r\n class=\"s09__choice\"\r\n for=\"s09-discipline-dental\"\r\n >\r\n <span class=\"s09__choice-name\">\r\n Dental Aesthetics\r\n <\/span>\r\n\r\n <span class=\"s09__choice-copy\">\r\n Smile, restorative and implant-related treatment enquiries.\r\n <\/span>\r\n <\/label>\r\n <\/div>\r\n\r\n <\/div>\r\n\r\n <p\r\n class=\"s09__error\"\r\n id=\"s09-treatment-area-error\"\r\n data-error-for=\"treatment_area\"\r\n aria-live=\"polite\"\r\n ><\/p>\r\n <\/fieldset>\r\n <\/div>\r\n\r\n <div class=\"s09__step-actions\">\r\n <span aria-hidden=\"true\"><\/span>\r\n\r\n <button\r\n class=\"s09__button\"\r\n type=\"button\"\r\n data-next-step\r\n >\r\n Continue \u2192\r\n <\/button>\r\n <\/div>\r\n <\/section>\r\n\r\n <!-- ==================================================\r\n STEP 02 \u2014 YOUR DETAILS\r\n ================================================== -->\r\n <section\r\n class=\"s09__step\"\r\n data-form-step=\"2\"\r\n aria-labelledby=\"s09-step-2-title\"\r\n >\r\n <p class=\"s09__step-kicker\">02 \u2014 YOUR DETAILS<\/p>\r\n\r\n <h3\r\n class=\"s09__step-title\"\r\n id=\"s09-step-2-title\"\r\n tabindex=\"-1\"\r\n >\r\n How can the Lamina team reach you?\r\n <\/h3>\r\n\r\n <p class=\"s09__step-support\">\r\n Only the essentials for an initial treatment enquiry.\r\n <\/p>\r\n\r\n <div class=\"s09__step-body\">\r\n <div class=\"s09__field-grid\">\r\n\r\n <div class=\"s09__field\" data-field=\"full_name\">\r\n <label class=\"s09__label\" for=\"s09-full-name\">\r\n Full name\r\n <\/label>\r\n\r\n <input\r\n class=\"s09__input\"\r\n id=\"s09-full-name\"\r\n name=\"full_name\"\r\n type=\"text\"\r\n autocomplete=\"name\"\r\n required\r\n aria-describedby=\"s09-full-name-error\"\r\n >\r\n\r\n <p\r\n class=\"s09__error\"\r\n id=\"s09-full-name-error\"\r\n data-error-for=\"full_name\"\r\n aria-live=\"polite\"\r\n ><\/p>\r\n <\/div>\r\n\r\n <div class=\"s09__field\" data-field=\"country\">\r\n <label class=\"s09__label\" for=\"s09-country\">\r\n Country \/ region\r\n <\/label>\r\n\r\n <select\r\n class=\"s09__select\"\r\n id=\"s09-country\"\r\n name=\"country\"\r\n autocomplete=\"country-name\"\r\n required\r\n aria-describedby=\"s09-country-error\"\r\n >\r\n <option value=\"\">Select country or region<\/option>\r\n <option value=\"AF\">Afghanistan<\/option>\r\n <option value=\"AL\">Albania<\/option>\r\n <option value=\"DZ\">Algeria<\/option>\r\n <option value=\"AS\">American Samoa<\/option>\r\n <option value=\"AD\">Andorra<\/option>\r\n <option value=\"AO\">Angola<\/option>\r\n <option value=\"AI\">Anguilla<\/option>\r\n <option value=\"AQ\">Antarctica<\/option>\r\n <option value=\"AG\">Antigua and Barbuda<\/option>\r\n <option value=\"AR\">Argentina<\/option>\r\n <option value=\"AM\">Armenia<\/option>\r\n <option value=\"AW\">Aruba<\/option>\r\n <option value=\"AU\">Australia<\/option>\r\n <option value=\"AT\">Austria<\/option>\r\n <option value=\"AZ\">Azerbaijan<\/option>\r\n <option value=\"BS\">Bahamas<\/option>\r\n <option value=\"BH\">Bahrain<\/option>\r\n <option value=\"BD\">Bangladesh<\/option>\r\n <option value=\"BB\">Barbados<\/option>\r\n <option value=\"BY\">Belarus<\/option>\r\n <option value=\"BE\">Belgium<\/option>\r\n <option value=\"BZ\">Belize<\/option>\r\n <option value=\"BJ\">Benin<\/option>\r\n <option value=\"BM\">Bermuda<\/option>\r\n <option value=\"BT\">Bhutan<\/option>\r\n <option value=\"BO\">Bolivia, Plurinational State of<\/option>\r\n <option value=\"BQ\">Bonaire, Sint Eustatius and Saba<\/option>\r\n <option value=\"BA\">Bosnia and Herzegovina<\/option>\r\n <option value=\"BW\">Botswana<\/option>\r\n <option value=\"BV\">Bouvet Island<\/option>\r\n <option value=\"BR\">Brazil<\/option>\r\n <option value=\"IO\">British Indian Ocean Territory<\/option>\r\n <option value=\"BN\">Brunei Darussalam<\/option>\r\n <option value=\"BG\">Bulgaria<\/option>\r\n <option value=\"BF\">Burkina Faso<\/option>\r\n <option value=\"BI\">Burundi<\/option>\r\n <option value=\"CV\">Cabo Verde<\/option>\r\n <option value=\"KH\">Cambodia<\/option>\r\n <option value=\"CM\">Cameroon<\/option>\r\n <option value=\"CA\">Canada<\/option>\r\n <option value=\"KY\">Cayman Islands<\/option>\r\n <option value=\"CF\">Central African Republic<\/option>\r\n <option value=\"TD\">Chad<\/option>\r\n <option value=\"CL\">Chile<\/option>\r\n <option value=\"CN\">China<\/option>\r\n <option value=\"CX\">Christmas Island<\/option>\r\n <option value=\"CC\">Cocos (Keeling) Islands<\/option>\r\n <option value=\"CO\">Colombia<\/option>\r\n <option value=\"KM\">Comoros<\/option>\r\n <option value=\"CG\">Congo<\/option>\r\n <option value=\"CD\">Congo, The Democratic Republic of the<\/option>\r\n <option value=\"CK\">Cook Islands<\/option>\r\n <option value=\"CR\">Costa Rica<\/option>\r\n <option value=\"HR\">Croatia<\/option>\r\n <option value=\"CU\">Cuba<\/option>\r\n <option value=\"CW\">Cura\u00e7ao<\/option>\r\n <option value=\"CY\">Cyprus<\/option>\r\n <option value=\"CZ\">Czechia<\/option>\r\n <option value=\"CI\">C\u00f4te d'Ivoire<\/option>\r\n <option value=\"DK\">Denmark<\/option>\r\n <option value=\"DJ\">Djibouti<\/option>\r\n <option value=\"DM\">Dominica<\/option>\r\n <option value=\"DO\">Dominican Republic<\/option>\r\n <option value=\"EC\">Ecuador<\/option>\r\n <option value=\"EG\">Egypt<\/option>\r\n <option value=\"SV\">El Salvador<\/option>\r\n <option value=\"GQ\">Equatorial Guinea<\/option>\r\n <option value=\"ER\">Eritrea<\/option>\r\n <option value=\"EE\">Estonia<\/option>\r\n <option value=\"SZ\">Eswatini<\/option>\r\n <option value=\"ET\">Ethiopia<\/option>\r\n <option value=\"FK\">Falkland Islands (Malvinas)<\/option>\r\n <option value=\"FO\">Faroe Islands<\/option>\r\n <option value=\"FJ\">Fiji<\/option>\r\n <option value=\"FI\">Finland<\/option>\r\n <option value=\"FR\">France<\/option>\r\n <option value=\"GF\">French Guiana<\/option>\r\n <option value=\"PF\">French Polynesia<\/option>\r\n <option value=\"TF\">French Southern Territories<\/option>\r\n <option value=\"GA\">Gabon<\/option>\r\n <option value=\"GM\">Gambia<\/option>\r\n <option value=\"GE\">Georgia<\/option>\r\n <option value=\"DE\">Germany<\/option>\r\n <option value=\"GH\">Ghana<\/option>\r\n <option value=\"GI\">Gibraltar<\/option>\r\n <option value=\"GR\">Greece<\/option>\r\n <option value=\"GL\">Greenland<\/option>\r\n <option value=\"GD\">Grenada<\/option>\r\n <option value=\"GP\">Guadeloupe<\/option>\r\n <option value=\"GU\">Guam<\/option>\r\n <option value=\"GT\">Guatemala<\/option>\r\n <option value=\"GG\">Guernsey<\/option>\r\n <option value=\"GN\">Guinea<\/option>\r\n <option value=\"GW\">Guinea-Bissau<\/option>\r\n <option value=\"GY\">Guyana<\/option>\r\n <option value=\"HT\">Haiti<\/option>\r\n <option value=\"HM\">Heard Island and McDonald Islands<\/option>\r\n <option value=\"VA\">Holy See (Vatican City State)<\/option>\r\n <option value=\"HN\">Honduras<\/option>\r\n <option value=\"HK\">Hong Kong<\/option>\r\n <option value=\"HU\">Hungary<\/option>\r\n <option value=\"IS\">Iceland<\/option>\r\n <option value=\"IN\">India<\/option>\r\n <option value=\"ID\">Indonesia<\/option>\r\n <option value=\"IR\">Iran, Islamic Republic of<\/option>\r\n <option value=\"IQ\">Iraq<\/option>\r\n <option value=\"IE\">Ireland<\/option>\r\n <option value=\"IM\">Isle of Man<\/option>\r\n <option value=\"IL\">Israel<\/option>\r\n <option value=\"IT\">Italy<\/option>\r\n <option value=\"JM\">Jamaica<\/option>\r\n <option value=\"JP\">Japan<\/option>\r\n <option value=\"JE\">Jersey<\/option>\r\n <option value=\"JO\">Jordan<\/option>\r\n <option value=\"KZ\">Kazakhstan<\/option>\r\n <option value=\"KE\">Kenya<\/option>\r\n <option value=\"KI\">Kiribati<\/option>\r\n <option value=\"KP\">Korea, Democratic People's Republic of<\/option>\r\n <option value=\"KR\">Korea, Republic of<\/option>\r\n <option value=\"KW\">Kuwait<\/option>\r\n <option value=\"KG\">Kyrgyzstan<\/option>\r\n <option value=\"LA\">Lao People's Democratic Republic<\/option>\r\n <option value=\"LV\">Latvia<\/option>\r\n <option value=\"LB\">Lebanon<\/option>\r\n <option value=\"LS\">Lesotho<\/option>\r\n <option value=\"LR\">Liberia<\/option>\r\n <option value=\"LY\">Libya<\/option>\r\n <option value=\"LI\">Liechtenstein<\/option>\r\n <option value=\"LT\">Lithuania<\/option>\r\n <option value=\"LU\">Luxembourg<\/option>\r\n <option value=\"MO\">Macao<\/option>\r\n <option value=\"MG\">Madagascar<\/option>\r\n <option value=\"MW\">Malawi<\/option>\r\n <option value=\"MY\">Malaysia<\/option>\r\n <option value=\"MV\">Maldives<\/option>\r\n <option value=\"ML\">Mali<\/option>\r\n <option value=\"MT\">Malta<\/option>\r\n <option value=\"MH\">Marshall Islands<\/option>\r\n <option value=\"MQ\">Martinique<\/option>\r\n <option value=\"MR\">Mauritania<\/option>\r\n <option value=\"MU\">Mauritius<\/option>\r\n <option value=\"YT\">Mayotte<\/option>\r\n <option value=\"MX\">Mexico<\/option>\r\n <option value=\"FM\">Micronesia, Federated States of<\/option>\r\n <option value=\"MD\">Moldova, Republic of<\/option>\r\n <option value=\"MC\">Monaco<\/option>\r\n <option value=\"MN\">Mongolia<\/option>\r\n <option value=\"ME\">Montenegro<\/option>\r\n <option value=\"MS\">Montserrat<\/option>\r\n <option value=\"MA\">Morocco<\/option>\r\n <option value=\"MZ\">Mozambique<\/option>\r\n <option value=\"MM\">Myanmar<\/option>\r\n <option value=\"NA\">Namibia<\/option>\r\n <option value=\"NR\">Nauru<\/option>\r\n <option value=\"NP\">Nepal<\/option>\r\n <option value=\"NL\">Netherlands<\/option>\r\n <option value=\"NC\">New Caledonia<\/option>\r\n <option value=\"NZ\">New Zealand<\/option>\r\n <option value=\"NI\">Nicaragua<\/option>\r\n <option value=\"NE\">Niger<\/option>\r\n <option value=\"NG\">Nigeria<\/option>\r\n <option value=\"NU\">Niue<\/option>\r\n <option value=\"NF\">Norfolk Island<\/option>\r\n <option value=\"MK\">North Macedonia<\/option>\r\n <option value=\"MP\">Northern Mariana Islands<\/option>\r\n <option value=\"NO\">Norway<\/option>\r\n <option value=\"OM\">Oman<\/option>\r\n <option value=\"PK\">Pakistan<\/option>\r\n <option value=\"PW\">Palau<\/option>\r\n <option value=\"PS\">Palestine, State of<\/option>\r\n <option value=\"PA\">Panama<\/option>\r\n <option value=\"PG\">Papua New Guinea<\/option>\r\n <option value=\"PY\">Paraguay<\/option>\r\n <option value=\"PE\">Peru<\/option>\r\n <option value=\"PH\">Philippines<\/option>\r\n <option value=\"PN\">Pitcairn<\/option>\r\n <option value=\"PL\">Poland<\/option>\r\n <option value=\"PT\">Portugal<\/option>\r\n <option value=\"PR\">Puerto Rico<\/option>\r\n <option value=\"QA\">Qatar<\/option>\r\n <option value=\"RO\">Romania<\/option>\r\n <option value=\"RU\">Russian Federation<\/option>\r\n <option value=\"RW\">Rwanda<\/option>\r\n <option value=\"RE\">R\u00e9union<\/option>\r\n <option value=\"BL\">Saint Barth\u00e9lemy<\/option>\r\n <option value=\"SH\">Saint Helena, Ascension and Tristan da Cunha<\/option>\r\n <option value=\"KN\">Saint Kitts and Nevis<\/option>\r\n <option value=\"LC\">Saint Lucia<\/option>\r\n <option value=\"MF\">Saint Martin (French part)<\/option>\r\n <option value=\"PM\">Saint Pierre and Miquelon<\/option>\r\n <option value=\"VC\">Saint Vincent and the Grenadines<\/option>\r\n <option value=\"WS\">Samoa<\/option>\r\n <option value=\"SM\">San Marino<\/option>\r\n <option value=\"ST\">Sao Tome and Principe<\/option>\r\n <option value=\"SA\">Saudi Arabia<\/option>\r\n <option value=\"SN\">Senegal<\/option>\r\n <option value=\"RS\">Serbia<\/option>\r\n <option value=\"SC\">Seychelles<\/option>\r\n <option value=\"SL\">Sierra Leone<\/option>\r\n <option value=\"SG\">Singapore<\/option>\r\n <option value=\"SX\">Sint Maarten (Dutch part)<\/option>\r\n <option value=\"SK\">Slovakia<\/option>\r\n <option value=\"SI\">Slovenia<\/option>\r\n <option value=\"SB\">Solomon Islands<\/option>\r\n <option value=\"SO\">Somalia<\/option>\r\n <option value=\"ZA\">South Africa<\/option>\r\n <option value=\"GS\">South Georgia and the South Sandwich Islands<\/option>\r\n <option value=\"SS\">South Sudan<\/option>\r\n <option value=\"ES\">Spain<\/option>\r\n <option value=\"LK\">Sri Lanka<\/option>\r\n <option value=\"SD\">Sudan<\/option>\r\n <option value=\"SR\">Suriname<\/option>\r\n <option value=\"SJ\">Svalbard and Jan Mayen<\/option>\r\n <option value=\"SE\">Sweden<\/option>\r\n <option value=\"CH\">Switzerland<\/option>\r\n <option value=\"SY\">Syrian Arab Republic<\/option>\r\n <option value=\"TW\">Taiwan, Province of China<\/option>\r\n <option value=\"TJ\">Tajikistan<\/option>\r\n <option value=\"TZ\">Tanzania, United Republic of<\/option>\r\n <option value=\"TH\">Thailand<\/option>\r\n <option value=\"TL\">Timor-Leste<\/option>\r\n <option value=\"TG\">Togo<\/option>\r\n <option value=\"TK\">Tokelau<\/option>\r\n <option value=\"TO\">Tonga<\/option>\r\n <option value=\"TT\">Trinidad and Tobago<\/option>\r\n <option value=\"TN\">Tunisia<\/option>\r\n <option value=\"TM\">Turkmenistan<\/option>\r\n <option value=\"TC\">Turks and Caicos Islands<\/option>\r\n <option value=\"TV\">Tuvalu<\/option>\r\n <option value=\"TR\">T\u00fcrkiye<\/option>\r\n <option value=\"UG\">Uganda<\/option>\r\n <option value=\"UA\">Ukraine<\/option>\r\n <option value=\"AE\">United Arab Emirates<\/option>\r\n <option value=\"GB\">United Kingdom<\/option>\r\n <option value=\"US\">United States<\/option>\r\n <option value=\"UM\">United States Minor Outlying Islands<\/option>\r\n <option value=\"UY\">Uruguay<\/option>\r\n <option value=\"UZ\">Uzbekistan<\/option>\r\n <option value=\"VU\">Vanuatu<\/option>\r\n <option value=\"VE\">Venezuela, Bolivarian Republic of<\/option>\r\n <option value=\"VN\">Viet Nam<\/option>\r\n <option value=\"VG\">Virgin Islands, British<\/option>\r\n <option value=\"VI\">Virgin Islands, U.S.<\/option>\r\n <option value=\"WF\">Wallis and Futuna<\/option>\r\n <option value=\"EH\">Western Sahara<\/option>\r\n <option value=\"YE\">Yemen<\/option>\r\n <option value=\"ZM\">Zambia<\/option>\r\n <option value=\"ZW\">Zimbabwe<\/option>\r\n <option value=\"AX\">\u00c5land Islands<\/option>\r\n <\/select>\r\n\r\n <p\r\n class=\"s09__error\"\r\n id=\"s09-country-error\"\r\n data-error-for=\"country\"\r\n aria-live=\"polite\"\r\n ><\/p>\r\n <\/div>\r\n\r\n <div class=\"s09__field\" data-field=\"phone\">\r\n <label class=\"s09__label\" for=\"s09-phone\">\r\n WhatsApp \/ phone\r\n <\/label>\r\n\r\n <input\r\n class=\"s09__input\"\r\n id=\"s09-phone\"\r\n name=\"phone\"\r\n type=\"tel\"\r\n autocomplete=\"tel\"\r\n inputmode=\"tel\"\r\n placeholder=\"+\"\r\n required\r\n aria-describedby=\"s09-phone-error\"\r\n >\r\n\r\n <p\r\n class=\"s09__error\"\r\n id=\"s09-phone-error\"\r\n data-error-for=\"phone\"\r\n aria-live=\"polite\"\r\n ><\/p>\r\n <\/div>\r\n\r\n <div class=\"s09__field\" data-field=\"email\">\r\n <label class=\"s09__label\" for=\"s09-email\">\r\n Email\r\n <span class=\"s09__label-note\">optional<\/span>\r\n <\/label>\r\n\r\n <input\r\n class=\"s09__input\"\r\n id=\"s09-email\"\r\n name=\"email\"\r\n type=\"email\"\r\n autocomplete=\"email\"\r\n aria-describedby=\"s09-email-error\"\r\n >\r\n\r\n <p\r\n class=\"s09__error\"\r\n id=\"s09-email-error\"\r\n data-error-for=\"email\"\r\n aria-live=\"polite\"\r\n ><\/p>\r\n <\/div>\r\n\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"s09__step-actions\">\r\n <button\r\n class=\"s09__back\"\r\n type=\"button\"\r\n data-back-step\r\n >\r\n Back\r\n <\/button>\r\n\r\n <button\r\n class=\"s09__button\"\r\n type=\"button\"\r\n data-next-step\r\n >\r\n Continue \u2192\r\n <\/button>\r\n <\/div>\r\n <\/section>\r\n\r\n <!-- ==================================================\r\n STEP 03 \u2014 YOUR CASE\r\n ================================================== -->\r\n <section\r\n class=\"s09__step\"\r\n data-form-step=\"3\"\r\n aria-labelledby=\"s09-step-3-title\"\r\n >\r\n <p class=\"s09__step-kicker\">03 \u2014 YOUR CASE<\/p>\r\n\r\n <h3\r\n class=\"s09__step-title\"\r\n id=\"s09-step-3-title\"\r\n tabindex=\"-1\"\r\n >\r\n Tell us what you\u2019re considering.\r\n <\/h3>\r\n\r\n <p class=\"s09__step-support\">\r\n You do not need to diagnose yourself. Choose the closest option, or select \u201cNot sure yet.\u201d\r\n <\/p>\r\n\r\n <div class=\"s09__step-body\">\r\n\r\n <div\r\n data-case-branch=\"hair\"\r\n >\r\n <fieldset class=\"s09__choice-group\">\r\n <legend class=\"s09__label\">\r\n What are you considering?\r\n <\/legend>\r\n\r\n <div class=\"s09__interest-list\">\r\n <div class=\"s09__interest-option\">\r\n <input type=\"radio\" name=\"hair_interest\" id=\"s09-hair-fue\" value=\"FUE\">\r\n <label for=\"s09-hair-fue\">FUE<\/label>\r\n <\/div>\r\n\r\n <div class=\"s09__interest-option\">\r\n <input type=\"radio\" name=\"hair_interest\" id=\"s09-hair-dhi\" value=\"DHI\">\r\n <label for=\"s09-hair-dhi\">DHI<\/label>\r\n <\/div>\r\n\r\n <div class=\"s09__interest-option\">\r\n <input type=\"radio\" name=\"hair_interest\" id=\"s09-hair-sapphire\" value=\"Sapphire FUE\">\r\n <label for=\"s09-hair-sapphire\">Sapphire FUE<\/label>\r\n <\/div>\r\n\r\n <div class=\"s09__interest-option\">\r\n <input type=\"radio\" name=\"hair_interest\" id=\"s09-hair-unsure\" value=\"Not sure yet\">\r\n <label for=\"s09-hair-unsure\">Not sure yet<\/label>\r\n <\/div>\r\n <\/div>\r\n <\/fieldset>\r\n <\/div>\r\n\r\n <div\r\n data-case-branch=\"dental\"\r\n >\r\n <fieldset class=\"s09__choice-group\">\r\n <legend class=\"s09__label\">\r\n What are you considering?\r\n <\/legend>\r\n\r\n <div class=\"s09__interest-list\">\r\n <div class=\"s09__interest-option\">\r\n <input type=\"radio\" name=\"dental_interest\" id=\"s09-dental-implants\" value=\"Dental Implants\">\r\n <label for=\"s09-dental-implants\">Dental Implants<\/label>\r\n <\/div>\r\n\r\n <div class=\"s09__interest-option\">\r\n <input type=\"radio\" name=\"dental_interest\" id=\"s09-dental-veneers\" value=\"Veneers\">\r\n <label for=\"s09-dental-veneers\">Veneers<\/label>\r\n <\/div>\r\n\r\n <div class=\"s09__interest-option\">\r\n <input type=\"radio\" name=\"dental_interest\" id=\"s09-dental-smile\" value=\"Smile Design\">\r\n <label for=\"s09-dental-smile\">Smile Design<\/label>\r\n <\/div>\r\n\r\n <div class=\"s09__interest-option\">\r\n <input type=\"radio\" name=\"dental_interest\" id=\"s09-dental-zirconium\" value=\"Zirconium\">\r\n <label for=\"s09-dental-zirconium\">Zirconium<\/label>\r\n <\/div>\r\n\r\n <div class=\"s09__interest-option\">\r\n <input type=\"radio\" name=\"dental_interest\" id=\"s09-dental-unsure\" value=\"Not sure yet\">\r\n <label for=\"s09-dental-unsure\">Not sure yet<\/label>\r\n <\/div>\r\n <\/div>\r\n <\/fieldset>\r\n <\/div>\r\n\r\n <p\r\n class=\"s09__error\"\r\n id=\"s09-case-interest-error\"\r\n data-error-for=\"case_interest\"\r\n aria-live=\"polite\"\r\n ><\/p>\r\n\r\n <div\r\n class=\"s09__field s09__field--full\"\r\n data-field=\"case_note\"\r\n >\r\n <label class=\"s09__label\" for=\"s09-case-note\">\r\n Tell us briefly what you would like to improve\r\n <\/label>\r\n\r\n <textarea\r\n class=\"s09__textarea\"\r\n id=\"s09-case-note\"\r\n name=\"case_note\"\r\n maxlength=\"1000\"\r\n required\r\n placeholder=\"Share anything you think would help us understand what you\u2019re considering.\"\r\n aria-describedby=\"s09-case-note-error\"\r\n ><\/textarea>\r\n\r\n <p\r\n class=\"s09__error\"\r\n id=\"s09-case-note-error\"\r\n data-error-for=\"case_note\"\r\n aria-live=\"polite\"\r\n ><\/p>\r\n <\/div>\r\n\r\n <\/div>\r\n\r\n <div class=\"s09__step-actions\">\r\n <button\r\n class=\"s09__back\"\r\n type=\"button\"\r\n data-back-step\r\n >\r\n Back\r\n <\/button>\r\n\r\n <button\r\n class=\"s09__button\"\r\n type=\"button\"\r\n data-next-step\r\n >\r\n Continue \u2192\r\n <\/button>\r\n <\/div>\r\n <\/section>\r\n\r\n <!-- ==================================================\r\n STEP 04 \u2014 PHOTOS \/ X-RAY\r\n ================================================== -->\r\n <section\r\n class=\"s09__step\"\r\n data-form-step=\"4\"\r\n aria-labelledby=\"s09-step-4-title\"\r\n >\r\n <p class=\"s09__step-kicker\">04 \u2014 PHOTOS \/ X-RAY<\/p>\r\n\r\n <h3\r\n class=\"s09__step-title\"\r\n id=\"s09-step-4-title\"\r\n tabindex=\"-1\"\r\n >\r\n Share what you already have.\r\n <\/h3>\r\n\r\n <p\r\n class=\"s09__step-support\"\r\n data-files-guidance\r\n >\r\n Photos can help the clinic understand your case before you travel. Dental patients may also upload an existing X-ray where relevant.\r\n <\/p>\r\n\r\n <div class=\"s09__step-body\">\r\n\r\n <div class=\"s09__upload\">\r\n <label\r\n class=\"s09__upload-label\"\r\n for=\"s09-files\"\r\n >\r\n <span>\r\n <span class=\"s09__upload-title\">\r\n Add photos \/ X-ray\r\n <\/span>\r\n\r\n <span class=\"s09__upload-meta\">\r\n JPG, PNG, WEBP or PDF. Uploads are optional for this development build.\r\n <\/span>\r\n <\/span>\r\n\r\n <span\r\n class=\"s09__upload-plus\"\r\n aria-hidden=\"true\"\r\n >\r\n +\r\n <\/span>\r\n\r\n <input\r\n class=\"s09__file-input\"\r\n id=\"s09-files\"\r\n name=\"case_files[]\"\r\n type=\"file\"\r\n accept=\"image\/jpeg,image\/png,image\/webp,application\/pdf\"\r\n multiple\r\n aria-describedby=\"s09-file-error\"\r\n >\r\n <\/label>\r\n\r\n <p\r\n class=\"s09__error\"\r\n id=\"s09-file-error\"\r\n data-error-for=\"case_files\"\r\n aria-live=\"polite\"\r\n ><\/p>\r\n\r\n <div\r\n class=\"s09__file-previews\"\r\n data-file-previews\r\n ><\/div>\r\n <\/div>\r\n\r\n <\/div>\r\n\r\n <div class=\"s09__step-actions\">\r\n <button\r\n class=\"s09__back\"\r\n type=\"button\"\r\n data-back-step\r\n >\r\n Back\r\n <\/button>\r\n\r\n <button\r\n class=\"s09__button\"\r\n type=\"button\"\r\n data-next-step\r\n >\r\n Continue \u2192\r\n <\/button>\r\n <\/div>\r\n <\/section>\r\n\r\n <!-- ==================================================\r\n STEP 05 \u2014 REVIEW & SEND\r\n ================================================== -->\r\n <section\r\n class=\"s09__step\"\r\n data-form-step=\"5\"\r\n aria-labelledby=\"s09-step-5-title\"\r\n >\r\n <p class=\"s09__step-kicker\">05 \u2014 REVIEW & SEND<\/p>\r\n\r\n <h3\r\n class=\"s09__step-title\"\r\n id=\"s09-step-5-title\"\r\n tabindex=\"-1\"\r\n >\r\n Ready when you are.\r\n <\/h3>\r\n\r\n <p class=\"s09__step-support\">\r\n Submit your information for an initial review. Lamina will use the details you provide to guide the next conversation about your case.\r\n <\/p>\r\n\r\n <div class=\"s09__step-body\">\r\n\r\n <div class=\"s09__review\">\r\n\r\n <div class=\"s09__review-row\">\r\n <span class=\"s09__review-label\">Treatment area<\/span>\r\n <span class=\"s09__review-value\" data-review=\"discipline\">\u2014<\/span>\r\n <button class=\"s09__review-edit\" type=\"button\" data-edit-step=\"1\">Edit<\/button>\r\n <\/div>\r\n\r\n <div class=\"s09__review-row\">\r\n <span class=\"s09__review-label\">Contact<\/span>\r\n <span class=\"s09__review-value\" data-review=\"contact\">\u2014<\/span>\r\n <button class=\"s09__review-edit\" type=\"button\" data-edit-step=\"2\">Edit<\/button>\r\n <\/div>\r\n\r\n <div class=\"s09__review-row\">\r\n <span class=\"s09__review-label\">Case interest<\/span>\r\n <span class=\"s09__review-value\" data-review=\"interest\">\u2014<\/span>\r\n <button class=\"s09__review-edit\" type=\"button\" data-edit-step=\"3\">Edit<\/button>\r\n <\/div>\r\n\r\n <div class=\"s09__review-row\">\r\n <span class=\"s09__review-label\">Files added<\/span>\r\n <span class=\"s09__review-value\" data-review=\"files\">None<\/span>\r\n <button class=\"s09__review-edit\" type=\"button\" data-edit-step=\"4\">Edit<\/button>\r\n <\/div>\r\n\r\n <\/div>\r\n\r\n <div class=\"s09__consent\">\r\n <div class=\"s09__consent-control\">\r\n <input\r\n id=\"s09-processing-consent\"\r\n name=\"processing_consent\"\r\n type=\"checkbox\"\r\n value=\"yes\"\r\n required\r\n aria-describedby=\"s09-consent-error\"\r\n >\r\n <\/div>\r\n\r\n <p class=\"s09__consent-copy\">\r\n I have read the\r\n <a\r\n class=\"s09__privacy-link\"\r\n href=\"{{PRIVACY_NOTICE_URL}}\"\r\n >\r\n Privacy Notice\r\n <\/a>\r\n and consent to the processing of the information and health-related materials I submit for the purpose of responding to my treatment enquiry.\r\n <\/p>\r\n <\/div>\r\n\r\n <p class=\"s09__legal-warning\">\r\n Development consent placeholder \u2014 replace with legally approved wording before publication.\r\n <\/p>\r\n\r\n <p\r\n class=\"s09__error\"\r\n id=\"s09-consent-error\"\r\n data-error-for=\"processing_consent\"\r\n aria-live=\"polite\"\r\n ><\/p>\r\n\r\n <p\r\n class=\"s09__submit-status\"\r\n data-submit-status\r\n role=\"status\"\r\n aria-live=\"polite\"\r\n ><\/p>\r\n\r\n <\/div>\r\n\r\n <div class=\"s09__step-actions\">\r\n <button\r\n class=\"s09__back\"\r\n type=\"button\"\r\n data-back-step\r\n >\r\n Back\r\n <\/button>\r\n\r\n <button\r\n class=\"s09__button\"\r\n type=\"submit\"\r\n data-submit-button\r\n >\r\n Send my case \u2192\r\n <\/button>\r\n <\/div>\r\n <\/section>\r\n\r\n <\/form>\r\n\r\n <\/div>\r\n\r\n <\/div>\r\n\r\n <\/div>\r\n<\/section>\r\n\r\n<script>\r\n(() => {\r\n\r\n const root =\r\n document.getElementById(\r\n 'lamina-case-submission'\r\n );\r\n\r\n\r\n const form =\r\n document.getElementById(\r\n 'lamina-case-form'\r\n );\r\n\r\n\r\n if (\r\n !root ||\r\n !form ||\r\n root.dataset.caseSubmissionReady ===\r\n 'true'\r\n ) return;\r\n\r\n\r\n root.dataset.caseSubmissionReady =\r\n 'true';\r\n\r\n\r\n root.classList.add(\r\n 'is-enhanced'\r\n );\r\n\r\n\r\n const reducedMotion =\r\n window.matchMedia(\r\n '(prefers-reduced-motion: reduce)'\r\n );\r\n\r\n\r\n const mobileQuery =\r\n window.matchMedia(\r\n '(max-width:959px)'\r\n );\r\n\r\n\r\n const state =\r\n {\r\n discipline:'',\r\n currentStep:1,\r\n contact:{\r\n fullName:'',\r\n country:'',\r\n phone:'',\r\n email:''\r\n },\r\n caseDetails:{\r\n hairInterest:'',\r\n dentalInterest:'',\r\n note:''\r\n },\r\n uploads:[],\r\n consents:{\r\n processing:false\r\n },\r\n submitting:false\r\n };\r\n\r\n\r\n const steps =\r\n [\r\n ...form.querySelectorAll(\r\n '[data-form-step]'\r\n )\r\n ];\r\n\r\n\r\n const progressItems =\r\n [\r\n ...form.querySelectorAll(\r\n '[data-progress-item]'\r\n )\r\n ];\r\n\r\n\r\n const progressCount =\r\n form.querySelector(\r\n '[data-progress-count]'\r\n );\r\n\r\n\r\n const progressAccessible =\r\n form.querySelector(\r\n '[data-progress-accessible]'\r\n );\r\n\r\n\r\n const progressFill =\r\n form.querySelector(\r\n '[data-progress-fill]'\r\n );\r\n\r\n\r\n const disciplineInputs =\r\n [\r\n ...form.querySelectorAll(\r\n 'input[name=\"treatment_area\"]'\r\n )\r\n ];\r\n\r\n\r\n const caseBranches =\r\n [\r\n ...form.querySelectorAll(\r\n '[data-case-branch]'\r\n )\r\n ];\r\n\r\n\r\n const fileInput =\r\n form.querySelector(\r\n '#s09-files'\r\n );\r\n\r\n\r\n const filePreviews =\r\n form.querySelector(\r\n '[data-file-previews]'\r\n );\r\n\r\n\r\n const fileGuidance =\r\n form.querySelector(\r\n '[data-files-guidance]'\r\n );\r\n\r\n\r\n const submitButton =\r\n form.querySelector(\r\n '[data-submit-button]'\r\n );\r\n\r\n\r\n const submitStatus =\r\n form.querySelector(\r\n '[data-submit-status]'\r\n );\r\n\r\n\r\n const MAX_FILES =\r\n 6;\r\n\r\n\r\n const MAX_FILE_BYTES =\r\n 8 *\r\n 1024 *\r\n 1024;\r\n\r\n\r\n const allowedTypes =\r\n new Set([\r\n 'image\/jpeg',\r\n 'image\/png',\r\n 'image\/webp',\r\n 'application\/pdf'\r\n ]);\r\n\r\n\r\n const stepNames =\r\n {\r\n 1:'Treatment area',\r\n 2:'Your details',\r\n 3:'Your case',\r\n 4:'Photos \/ X-ray',\r\n 5:'Review & send'\r\n };\r\n\r\n\r\n let transitionToken =\r\n 0;\r\n\r\n\r\n let entrancePlayed =\r\n false;\r\n\r\n\r\n let entranceObserver =\r\n null;\r\n\r\n\r\n let depthTicking =\r\n false;\r\n\r\n\r\n let depthLayers =\r\n [];\r\n\r\n\r\n function clamp(\r\n value,\r\n min,\r\n max\r\n ){\r\n return Math.min(\r\n max,\r\n Math.max(\r\n min,\r\n value\r\n )\r\n );\r\n }\r\n\r\n\r\n function escapeHTML(\r\n value\r\n ){\r\n return String(\r\n value ?? ''\r\n )\r\n .replaceAll('&','&')\r\n .replaceAll('<','<')\r\n .replaceAll('>','>')\r\n .replaceAll('\"','"')\r\n .replaceAll(\"'\",''');\r\n }\r\n\r\n\r\n function currentStepElement(){\r\n return steps.find(\r\n step =>\r\n Number(\r\n step.dataset.formStep\r\n ) ===\r\n state.currentStep\r\n );\r\n }\r\n\r\n\r\n function updateProgress(){\r\n const percentage =\r\n (\r\n (\r\n state.currentStep -\r\n 1\r\n ) \/\r\n 4\r\n ) *\r\n 100;\r\n\r\n\r\n progressCount.textContent =\r\n String(\r\n state.currentStep\r\n ).padStart(\r\n 2,\r\n '0'\r\n ) +\r\n ' \/ 05';\r\n\r\n\r\n progressAccessible.textContent =\r\n 'Step ' +\r\n state.currentStep +\r\n ' of 5: ' +\r\n stepNames[\r\n state.currentStep\r\n ] +\r\n '.';\r\n\r\n\r\n progressFill.style.setProperty(\r\n '--s09-progress',\r\n percentage +\r\n '%'\r\n );\r\n\r\n\r\n progressItems.forEach(\r\n item => {\r\n const step =\r\n Number(\r\n item.dataset.progressItem\r\n );\r\n\r\n\r\n item.classList.toggle(\r\n 'is-complete',\r\n step <\r\n state.currentStep\r\n );\r\n\r\n\r\n item.classList.toggle(\r\n 'is-active',\r\n step ===\r\n state.currentStep\r\n );\r\n }\r\n );\r\n }\r\n\r\n\r\n function setFieldError(\r\n name,\r\n message\r\n ){\r\n const error =\r\n form.querySelector(\r\n '[data-error-for=\"' +\r\n CSS.escape(\r\n name\r\n ) +\r\n '\"]'\r\n );\r\n\r\n\r\n if (\r\n error\r\n ){\r\n error.textContent =\r\n message || '';\r\n }\r\n\r\n\r\n const field =\r\n form.querySelector(\r\n '[data-field=\"' +\r\n CSS.escape(\r\n name\r\n ) +\r\n '\"]'\r\n );\r\n\r\n\r\n if (\r\n field\r\n ){\r\n field.setAttribute(\r\n 'aria-invalid',\r\n message\r\n ? 'true'\r\n : 'false'\r\n );\r\n }\r\n }\r\n\r\n\r\n function clearStepErrors(\r\n step\r\n ){\r\n step\r\n .querySelectorAll(\r\n '.s09__error'\r\n )\r\n .forEach(\r\n error => {\r\n error.textContent =\r\n '';\r\n }\r\n );\r\n\r\n\r\n step\r\n .querySelectorAll(\r\n '[data-field]'\r\n )\r\n .forEach(\r\n field => {\r\n field.setAttribute(\r\n 'aria-invalid',\r\n 'false'\r\n );\r\n }\r\n );\r\n }\r\n\r\n\r\n function validatePhone(\r\n value\r\n ){\r\n const normalized =\r\n value.replace(\r\n \/[\\s().-]\/g,\r\n ''\r\n );\r\n\r\n\r\n return \/^\\+?[0-9]{7,16}$\/.test(\r\n normalized\r\n );\r\n }\r\n\r\n\r\n function normalizePhone(\r\n value\r\n ){\r\n const cleaned =\r\n String(\r\n value ||\r\n ''\r\n )\r\n .trim()\r\n .replace(\r\n \/[^0-9+]\/g,\r\n ''\r\n );\r\n\r\n\r\n const plus =\r\n cleaned.startsWith(\r\n '+'\r\n )\r\n ? '+'\r\n : '';\r\n\r\n\r\n const digits =\r\n cleaned.replace(\r\n \/\\D\/g,\r\n ''\r\n );\r\n\r\n\r\n return plus + digits;\r\n }\r\n\r\n\r\n function validateStep(\r\n stepNumber\r\n ){\r\n const step =\r\n steps.find(\r\n item =>\r\n Number(\r\n item.dataset.formStep\r\n ) ===\r\n stepNumber\r\n );\r\n\r\n\r\n if (\r\n !step\r\n ) return true;\r\n\r\n\r\n clearStepErrors(\r\n step\r\n );\r\n\r\n\r\n let firstInvalid =\r\n null;\r\n\r\n\r\n function fail(\r\n control,\r\n name,\r\n message\r\n ){\r\n if (\r\n !firstInvalid\r\n ){\r\n firstInvalid =\r\n control;\r\n }\r\n\r\n\r\n setFieldError(\r\n name,\r\n message\r\n );\r\n\r\n\r\n control?.setAttribute(\r\n 'aria-invalid',\r\n 'true'\r\n );\r\n }\r\n\r\n\r\n if (\r\n stepNumber ===\r\n 1\r\n ){\r\n const selected =\r\n disciplineInputs.find(\r\n input =>\r\n input.checked\r\n );\r\n\r\n\r\n if (\r\n !selected\r\n ){\r\n fail(\r\n disciplineInputs[0],\r\n 'treatment_area',\r\n 'Please choose Hair Restoration or Dental Aesthetics.'\r\n );\r\n }\r\n }\r\n\r\n\r\n if (\r\n stepNumber ===\r\n 2\r\n ){\r\n const fullName =\r\n form.elements.full_name;\r\n\r\n\r\n const country =\r\n form.elements.country;\r\n\r\n\r\n const phone =\r\n form.elements.phone;\r\n\r\n\r\n const email =\r\n form.elements.email;\r\n\r\n\r\n if (\r\n !fullName.value.trim()\r\n ){\r\n fail(\r\n fullName,\r\n 'full_name',\r\n 'Please enter your full name.'\r\n );\r\n }\r\n\r\n\r\n if (\r\n !country.value\r\n ){\r\n fail(\r\n country,\r\n 'country',\r\n 'Please select your country or region.'\r\n );\r\n }\r\n\r\n\r\n if (\r\n !phone.value.trim()\r\n ){\r\n fail(\r\n phone,\r\n 'phone',\r\n 'Please enter your WhatsApp or phone number.'\r\n );\r\n }else if(\r\n !validatePhone(\r\n phone.value\r\n )\r\n ){\r\n fail(\r\n phone,\r\n 'phone',\r\n 'Please enter a valid international phone number.'\r\n );\r\n }\r\n\r\n\r\n if (\r\n email.value &&\r\n !email.checkValidity()\r\n ){\r\n fail(\r\n email,\r\n 'email',\r\n 'Please enter a valid email address.'\r\n );\r\n }\r\n }\r\n\r\n\r\n if (\r\n stepNumber ===\r\n 3\r\n ){\r\n const note =\r\n form.elements.case_note;\r\n\r\n\r\n const interest =\r\n state.discipline ===\r\n 'hair'\r\n ? form.querySelector(\r\n 'input[name=\"hair_interest\"]:checked'\r\n )\r\n : form.querySelector(\r\n 'input[name=\"dental_interest\"]:checked'\r\n );\r\n\r\n\r\n if (\r\n !interest\r\n ){\r\n const firstInterest =\r\n state.discipline ===\r\n 'hair'\r\n ? form.querySelector(\r\n 'input[name=\"hair_interest\"]'\r\n )\r\n : form.querySelector(\r\n 'input[name=\"dental_interest\"]'\r\n );\r\n\r\n\r\n fail(\r\n firstInterest,\r\n 'case_interest',\r\n 'Please choose the closest treatment option, or select \u201cNot sure yet.\u201d'\r\n );\r\n }\r\n\r\n\r\n if (\r\n !note.value.trim()\r\n ){\r\n fail(\r\n note,\r\n 'case_note',\r\n 'Please share a short note about what you would like us to review.'\r\n );\r\n }\r\n }\r\n\r\n\r\n if (\r\n stepNumber ===\r\n 5\r\n ){\r\n const consent =\r\n form.elements.processing_consent;\r\n\r\n\r\n if (\r\n !consent.checked\r\n ){\r\n fail(\r\n consent,\r\n 'processing_consent',\r\n 'Please accept the required Privacy Notice consent before sending your case.'\r\n );\r\n }\r\n }\r\n\r\n\r\n if (\r\n firstInvalid\r\n ){\r\n firstInvalid.focus({\r\n preventScroll:true\r\n });\r\n\r\n\r\n const rect =\r\n firstInvalid.getBoundingClientRect();\r\n\r\n\r\n if (\r\n rect.top <\r\n 80 ||\r\n rect.bottom >\r\n window.innerHeight -\r\n 24\r\n ){\r\n firstInvalid.scrollIntoView({\r\n block:'center',\r\n behavior:\r\n reducedMotion.matches\r\n ? 'auto'\r\n : 'smooth'\r\n });\r\n }\r\n\r\n\r\n return false;\r\n }\r\n\r\n\r\n return true;\r\n }\r\n\r\n\r\n function syncStateFromForm(){\r\n const selectedDiscipline =\r\n disciplineInputs.find(\r\n input =>\r\n input.checked\r\n );\r\n\r\n\r\n state.discipline =\r\n selectedDiscipline?.value ||\r\n '';\r\n\r\n\r\n form.elements.discipline.value =\r\n state.discipline;\r\n\r\n\r\n state.contact.fullName =\r\n form.elements.full_name.value.trim();\r\n\r\n\r\n state.contact.country =\r\n form.elements.country.value;\r\n\r\n\r\n state.contact.phone =\r\n form.elements.phone.value.trim();\r\n\r\n\r\n state.contact.email =\r\n form.elements.email.value.trim();\r\n\r\n\r\n state.caseDetails.hairInterest =\r\n form.querySelector(\r\n 'input[name=\"hair_interest\"]:checked'\r\n )?.value ||\r\n '';\r\n\r\n\r\n state.caseDetails.dentalInterest =\r\n form.querySelector(\r\n 'input[name=\"dental_interest\"]:checked'\r\n )?.value ||\r\n '';\r\n\r\n\r\n state.caseDetails.note =\r\n form.elements.case_note.value.trim();\r\n\r\n\r\n state.consents.processing =\r\n form.elements.processing_consent.checked;\r\n }\r\n\r\n\r\n function updateCaseBranch(){\r\n caseBranches.forEach(\r\n branch => {\r\n const relevant =\r\n branch.dataset.caseBranch ===\r\n state.discipline;\r\n\r\n\r\n if (\r\n root.classList.contains(\r\n 'is-enhanced'\r\n )\r\n ){\r\n branch.hidden =\r\n !relevant;\r\n }else{\r\n branch.hidden =\r\n false;\r\n }\r\n\r\n\r\n branch\r\n .querySelectorAll(\r\n 'input'\r\n )\r\n .forEach(\r\n input => {\r\n input.disabled =\r\n root.classList.contains(\r\n 'is-enhanced'\r\n )\r\n ? !relevant\r\n : false;\r\n }\r\n );\r\n }\r\n );\r\n\r\n\r\n if (\r\n state.discipline ===\r\n 'hair'\r\n ){\r\n fileGuidance.textContent =\r\n 'Upload clear photos that show the area you would like us to review. Photos are optional in this initial intake.';\r\n }else if(\r\n state.discipline ===\r\n 'dental'\r\n ){\r\n fileGuidance.textContent =\r\n 'Upload clear dental \/ smile photos and, if available, an existing dental X-ray. An X-ray is not required for this initial intake.';\r\n }else{\r\n fileGuidance.textContent =\r\n 'Photos can help the clinic understand your case before you travel. Dental patients may also upload an existing X-ray where relevant.';\r\n }\r\n }\r\n\r\n\r\n function updateReview(){\r\n syncStateFromForm();\r\n\r\n\r\n const disciplineLabel =\r\n state.discipline ===\r\n 'hair'\r\n ? 'Hair Restoration'\r\n : state.discipline ===\r\n 'dental'\r\n ? 'Dental Aesthetics'\r\n : '\u2014';\r\n\r\n\r\n const countrySelect =\r\n form.elements.country;\r\n\r\n\r\n const countryText =\r\n countrySelect.options[\r\n countrySelect.selectedIndex\r\n ]?.text ||\r\n '';\r\n\r\n\r\n const contactParts =\r\n [\r\n state.contact.fullName,\r\n countryText,\r\n state.contact.phone,\r\n state.contact.email\r\n ].filter(\r\n Boolean\r\n );\r\n\r\n\r\n const interest =\r\n state.discipline ===\r\n 'hair'\r\n ? (\r\n state.caseDetails.hairInterest ||\r\n 'Not specified'\r\n )\r\n : (\r\n state.caseDetails.dentalInterest ||\r\n 'Not specified'\r\n );\r\n\r\n\r\n form.querySelector(\r\n '[data-review=\"discipline\"]'\r\n ).textContent =\r\n disciplineLabel;\r\n\r\n\r\n form.querySelector(\r\n '[data-review=\"contact\"]'\r\n ).textContent =\r\n contactParts.length\r\n ? contactParts.join(' \u00b7 ')\r\n : '\u2014';\r\n\r\n\r\n form.querySelector(\r\n '[data-review=\"interest\"]'\r\n ).textContent =\r\n interest;\r\n\r\n\r\n form.querySelector(\r\n '[data-review=\"files\"]'\r\n ).textContent =\r\n state.uploads.length\r\n ? (\r\n state.uploads.length +\r\n (\r\n state.uploads.length ===\r\n 1\r\n ? ' file'\r\n : ' files'\r\n )\r\n )\r\n : 'None';\r\n }\r\n\r\n\r\n function focusStep(\r\n step\r\n ){\r\n const heading =\r\n step.querySelector(\r\n '.s09__step-title'\r\n );\r\n\r\n\r\n if (\r\n !heading\r\n ) return;\r\n\r\n\r\n heading.focus({\r\n preventScroll:true\r\n });\r\n\r\n\r\n if (\r\n !mobileQuery.matches\r\n ) return;\r\n\r\n\r\n const rect =\r\n heading.getBoundingClientRect();\r\n\r\n\r\n const topLimit =\r\n 88;\r\n\r\n\r\n const bottomLimit =\r\n window.innerHeight *\r\n .70;\r\n\r\n\r\n if (\r\n rect.top <\r\n topLimit ||\r\n rect.bottom >\r\n bottomLimit\r\n ){\r\n heading.scrollIntoView({\r\n block:'start',\r\n behavior:\r\n reducedMotion.matches\r\n ? 'auto'\r\n : 'smooth'\r\n });\r\n }\r\n }\r\n\r\n\r\n function showStep(\r\n nextStep,\r\n {\r\n validateCurrent =\r\n false\r\n } =\r\n {}\r\n ){\r\n nextStep =\r\n clamp(\r\n Number(\r\n nextStep\r\n ),\r\n 1,\r\n 5\r\n );\r\n\r\n\r\n if (\r\n validateCurrent &&\r\n !validateStep(\r\n state.currentStep\r\n )\r\n ){\r\n return;\r\n }\r\n\r\n\r\n syncStateFromForm();\r\n\r\n\r\n if (\r\n state.currentStep ===\r\n 1\r\n ){\r\n updateCaseBranch();\r\n }\r\n\r\n\r\n if (\r\n nextStep ===\r\n 5\r\n ){\r\n updateReview();\r\n }\r\n\r\n\r\n const current =\r\n currentStepElement();\r\n\r\n\r\n const incoming =\r\n steps.find(\r\n step =>\r\n Number(\r\n step.dataset.formStep\r\n ) ===\r\n nextStep\r\n );\r\n\r\n\r\n if (\r\n !incoming ||\r\n incoming ===\r\n current\r\n ){\r\n return;\r\n }\r\n\r\n\r\n const token =\r\n ++transitionToken;\r\n\r\n\r\n document.activeElement?.blur?.();\r\n\r\n\r\n if (\r\n reducedMotion.matches\r\n ){\r\n steps.forEach(\r\n step => {\r\n step.hidden =\r\n step !==\r\n incoming;\r\n }\r\n );\r\n\r\n\r\n state.currentStep =\r\n nextStep;\r\n\r\n\r\n updateProgress();\r\n focusStep(\r\n incoming\r\n );\r\n requestDepthUpdate();\r\n\r\n\r\n return;\r\n }\r\n\r\n\r\n current?.classList.add(\r\n 'is-leaving'\r\n );\r\n\r\n\r\n window.setTimeout(\r\n () => {\r\n if (\r\n token !==\r\n transitionToken\r\n ){\r\n return;\r\n }\r\n\r\n\r\n if (\r\n current\r\n ){\r\n current.hidden =\r\n true;\r\n\r\n\r\n current.classList.remove(\r\n 'is-leaving'\r\n );\r\n }\r\n\r\n\r\n incoming.hidden =\r\n false;\r\n\r\n\r\n incoming.classList.add(\r\n 'is-entering'\r\n );\r\n\r\n\r\n state.currentStep =\r\n nextStep;\r\n\r\n\r\n updateProgress();\r\n\r\n\r\n if (\r\n nextStep ===\r\n 5\r\n ){\r\n updateReview();\r\n }\r\n\r\n\r\n requestAnimationFrame(\r\n () => {\r\n if (\r\n token !==\r\n transitionToken\r\n ){\r\n return;\r\n }\r\n\r\n\r\n incoming.classList.add(\r\n 'is-entered'\r\n );\r\n\r\n\r\n requestAnimationFrame(\r\n () => {\r\n if (\r\n token !==\r\n transitionToken\r\n ){\r\n return;\r\n }\r\n\r\n\r\n incoming.classList.remove(\r\n 'is-entering',\r\n 'is-entered'\r\n );\r\n\r\n\r\n focusStep(\r\n incoming\r\n );\r\n\r\n\r\n requestDepthUpdate();\r\n }\r\n );\r\n }\r\n );\r\n },\r\n 185\r\n );\r\n }\r\n\r\n\r\n disciplineInputs.forEach(\r\n input => {\r\n input.addEventListener(\r\n 'change',\r\n () => {\r\n const previous =\r\n state.discipline;\r\n\r\n\r\n state.discipline =\r\n input.value;\r\n\r\n\r\n form.elements.discipline.value =\r\n state.discipline;\r\n\r\n\r\n if (\r\n previous &&\r\n previous !==\r\n state.discipline\r\n ){\r\n \/*\r\n Prevent stale irrelevant branch data from being submitted.\r\n The hidden branch inputs are disabled by updateCaseBranch().\r\n *\/\r\n updateCaseBranch();\r\n }\r\n\r\n\r\n form\r\n .querySelectorAll(\r\n '.s09__choice'\r\n )\r\n .forEach(\r\n choice => {\r\n const radio =\r\n document.getElementById(\r\n choice.getAttribute(\r\n 'for'\r\n )\r\n );\r\n\r\n\r\n choice.classList.toggle(\r\n 'is-selected',\r\n Boolean(\r\n radio?.checked\r\n )\r\n );\r\n }\r\n );\r\n\r\n\r\n setFieldError(\r\n 'treatment_area',\r\n ''\r\n );\r\n }\r\n );\r\n }\r\n );\r\n\r\n\r\n form\r\n .querySelectorAll(\r\n 'input[name=\"hair_interest\"], input[name=\"dental_interest\"]'\r\n )\r\n .forEach(\r\n input => {\r\n input.addEventListener(\r\n 'change',\r\n () => {\r\n setFieldError(\r\n 'case_interest',\r\n ''\r\n );\r\n }\r\n );\r\n }\r\n );\r\n\r\n\r\n form\r\n .querySelectorAll(\r\n '[data-next-step]'\r\n )\r\n .forEach(\r\n button => {\r\n button.addEventListener(\r\n 'click',\r\n () => {\r\n showStep(\r\n state.currentStep +\r\n 1,\r\n {\r\n validateCurrent:true\r\n }\r\n );\r\n }\r\n );\r\n }\r\n );\r\n\r\n\r\n form\r\n .querySelectorAll(\r\n '[data-back-step]'\r\n )\r\n .forEach(\r\n button => {\r\n button.addEventListener(\r\n 'click',\r\n () => {\r\n showStep(\r\n state.currentStep -\r\n 1\r\n );\r\n }\r\n );\r\n }\r\n );\r\n\r\n\r\n form\r\n .querySelectorAll(\r\n '[data-edit-step]'\r\n )\r\n .forEach(\r\n button => {\r\n button.addEventListener(\r\n 'click',\r\n () => {\r\n showStep(\r\n Number(\r\n button.dataset.editStep\r\n )\r\n );\r\n }\r\n );\r\n }\r\n );\r\n\r\n\r\n \/* =======================================================\r\n FILES\r\n ======================================================= *\/\r\n function fileError(\r\n message\r\n ){\r\n setFieldError(\r\n 'case_files',\r\n message\r\n );\r\n }\r\n\r\n\r\n function revokePreviewURL(\r\n item\r\n ){\r\n if (\r\n item?.previewUrl\r\n ){\r\n URL.revokeObjectURL(\r\n item.previewUrl\r\n );\r\n }\r\n }\r\n\r\n\r\n function rebuildFileInput(){\r\n \/*\r\n DataTransfer is widely available in current desktop\/mobile browsers.\r\n If unavailable, the UI state remains authoritative for the front-end\r\n but the backend integration must verify the actual multipart payload.\r\n *\/\r\n if (\r\n typeof DataTransfer ===\r\n 'undefined'\r\n ){\r\n return;\r\n }\r\n\r\n\r\n const dt =\r\n new DataTransfer();\r\n\r\n\r\n state.uploads.forEach(\r\n item => {\r\n dt.items.add(\r\n item.file\r\n );\r\n }\r\n );\r\n\r\n\r\n fileInput.files =\r\n dt.files;\r\n }\r\n\r\n\r\n function renderFiles(){\r\n filePreviews.innerHTML =\r\n '';\r\n\r\n\r\n state.uploads.forEach(\r\n (\r\n item,\r\n index\r\n ) => {\r\n const article =\r\n document.createElement(\r\n 'article'\r\n );\r\n\r\n\r\n article.className =\r\n 's09__file-preview';\r\n\r\n\r\n const thumb =\r\n document.createElement(\r\n 'div'\r\n );\r\n\r\n\r\n thumb.className =\r\n 's09__file-thumb';\r\n\r\n\r\n if (\r\n item.file.type.startsWith(\r\n 'image\/'\r\n )\r\n ){\r\n const image =\r\n document.createElement(\r\n 'img'\r\n );\r\n\r\n\r\n image.alt =\r\n 'Selected upload preview ' +\r\n (\r\n index +\r\n 1\r\n );\r\n\r\n\r\n image.src =\r\n item.previewUrl;\r\n\r\n\r\n thumb.appendChild(\r\n image\r\n );\r\n }else{\r\n const pdf =\r\n document.createElement(\r\n 'div'\r\n );\r\n\r\n\r\n pdf.className =\r\n 's09__file-pdf';\r\n\r\n\r\n pdf.textContent =\r\n 'PDF';\r\n\r\n\r\n thumb.appendChild(\r\n pdf\r\n );\r\n }\r\n\r\n\r\n const row =\r\n document.createElement(\r\n 'div'\r\n );\r\n\r\n\r\n row.className =\r\n 's09__file-row';\r\n\r\n\r\n const name =\r\n document.createElement(\r\n 'span'\r\n );\r\n\r\n\r\n name.className =\r\n 's09__file-name';\r\n\r\n\r\n name.textContent =\r\n item.file.name;\r\n\r\n\r\n const remove =\r\n document.createElement(\r\n 'button'\r\n );\r\n\r\n\r\n remove.type =\r\n 'button';\r\n\r\n\r\n remove.className =\r\n 's09__remove';\r\n\r\n\r\n remove.textContent =\r\n 'Remove';\r\n\r\n\r\n remove.setAttribute(\r\n 'aria-label',\r\n 'Remove photo or file ' +\r\n (\r\n index +\r\n 1\r\n ) +\r\n ': ' +\r\n item.file.name\r\n );\r\n\r\n\r\n remove.addEventListener(\r\n 'click',\r\n () => {\r\n revokePreviewURL(\r\n state.uploads[\r\n index\r\n ]\r\n );\r\n\r\n\r\n state.uploads.splice(\r\n index,\r\n 1\r\n );\r\n\r\n\r\n rebuildFileInput();\r\n renderFiles();\r\n updateReview();\r\n }\r\n );\r\n\r\n\r\n row.append(\r\n name,\r\n remove\r\n );\r\n\r\n\r\n article.append(\r\n thumb,\r\n row\r\n );\r\n\r\n\r\n filePreviews.appendChild(\r\n article\r\n );\r\n }\r\n );\r\n }\r\n\r\n\r\n fileInput.addEventListener(\r\n 'change',\r\n () => {\r\n fileError(\r\n ''\r\n );\r\n\r\n\r\n const incoming =\r\n [\r\n ...fileInput.files\r\n ];\r\n\r\n\r\n const next =\r\n [\r\n ...state.uploads\r\n ];\r\n\r\n\r\n for (\r\n const file of incoming\r\n ){\r\n if (\r\n next.length >=\r\n MAX_FILES\r\n ){\r\n fileError(\r\n 'Please add no more than ' +\r\n MAX_FILES +\r\n ' files in this development build.'\r\n );\r\n\r\n\r\n break;\r\n }\r\n\r\n\r\n if (\r\n !allowedTypes.has(\r\n file.type\r\n )\r\n ){\r\n fileError(\r\n 'Please use JPG, PNG, WEBP or PDF files.'\r\n );\r\n\r\n\r\n continue;\r\n }\r\n\r\n\r\n if (\r\n file.size >\r\n MAX_FILE_BYTES\r\n ){\r\n fileError(\r\n 'One of the selected files is larger than the current development limit.'\r\n );\r\n\r\n\r\n continue;\r\n }\r\n\r\n\r\n const duplicate =\r\n next.some(\r\n item =>\r\n item.file.name ===\r\n file.name &&\r\n item.file.size ===\r\n file.size &&\r\n item.file.lastModified ===\r\n file.lastModified\r\n );\r\n\r\n\r\n if (\r\n duplicate\r\n ){\r\n continue;\r\n }\r\n\r\n\r\n next.push({\r\n file,\r\n previewUrl:\r\n file.type.startsWith(\r\n 'image\/'\r\n )\r\n ? URL.createObjectURL(\r\n file\r\n )\r\n : ''\r\n });\r\n }\r\n\r\n\r\n state.uploads =\r\n next;\r\n\r\n\r\n rebuildFileInput();\r\n renderFiles();\r\n updateReview();\r\n\r\n\r\n \/*\r\n Non-sensitive analytics hook only.\r\n Filenames, file contents and medical data are NOT emitted.\r\n *\/\r\n window.dataLayer?.push?.({\r\n event:'form_upload_added',\r\n form_name:'lamina_case_submission',\r\n file_count:\r\n state.uploads.length\r\n });\r\n }\r\n );\r\n\r\n\r\n \/* =======================================================\r\n ATTRIBUTION \u2014 NON-SENSITIVE ONLY\r\n ======================================================= *\/\r\n function captureAttribution(){\r\n const params =\r\n new URLSearchParams(\r\n window.location.search\r\n );\r\n\r\n\r\n [\r\n 'utm_source',\r\n 'utm_medium',\r\n 'utm_campaign',\r\n 'utm_content',\r\n 'utm_term',\r\n 'gclid',\r\n 'fbclid'\r\n ].forEach(\r\n key => {\r\n if (\r\n form.elements[\r\n key\r\n ]\r\n ){\r\n form.elements[\r\n key\r\n ].value =\r\n params.get(\r\n key\r\n ) ||\r\n '';\r\n }\r\n }\r\n );\r\n\r\n\r\n form.elements.landing_page.value =\r\n window.location.pathname;\r\n\r\n\r\n try{\r\n if (\r\n document.referrer\r\n ){\r\n const referrerURL =\r\n new URL(\r\n document.referrer\r\n );\r\n\r\n\r\n form.elements.referrer.value =\r\n referrerURL.origin +\r\n referrerURL.pathname;\r\n }else{\r\n form.elements.referrer.value =\r\n '';\r\n }\r\n }catch(_error){\r\n form.elements.referrer.value =\r\n '';\r\n }\r\n\r\n\r\n form.elements.language.value =\r\n document.documentElement.lang ||\r\n navigator.language ||\r\n '';\r\n }\r\n\r\n\r\n \/* =======================================================\r\n SUBMISSION\r\n ======================================================= *\/\r\n function endpointConfigured(){\r\n const action =\r\n form.getAttribute(\r\n 'action'\r\n ) ||\r\n '';\r\n\r\n\r\n return (\r\n action &&\r\n !action.includes(\r\n '{{'\r\n )\r\n );\r\n }\r\n\r\n\r\n function thankYouConfigured(){\r\n const url =\r\n form.dataset.thankYouUrl ||\r\n '';\r\n\r\n\r\n return (\r\n url &&\r\n !url.includes(\r\n '{{'\r\n )\r\n );\r\n }\r\n\r\n\r\n function setSubmitting(\r\n active\r\n ){\r\n state.submitting =\r\n active;\r\n\r\n\r\n submitButton.disabled =\r\n active;\r\n\r\n\r\n submitButton.textContent =\r\n active\r\n ? 'Sending\u2026'\r\n : 'Send my case \u2192';\r\n }\r\n\r\n\r\n form.addEventListener(\r\n 'submit',\r\n async event => {\r\n if (\r\n !root.classList.contains(\r\n 'is-enhanced'\r\n )\r\n ){\r\n return;\r\n }\r\n\r\n\r\n event.preventDefault();\r\n\r\n\r\n if (\r\n state.currentStep !==\r\n 5\r\n ){\r\n return;\r\n }\r\n\r\n\r\n if (\r\n !validateStep(\r\n 5\r\n )\r\n ){\r\n return;\r\n }\r\n\r\n\r\n syncStateFromForm();\r\n updateReview();\r\n\r\n\r\n if (\r\n state.submitting\r\n ){\r\n return;\r\n }\r\n\r\n\r\n submitStatus.classList.remove(\r\n 'is-error'\r\n );\r\n\r\n\r\n if (\r\n !endpointConfigured()\r\n ){\r\n submitStatus.textContent =\r\n 'Secure submission is not connected in this development build. Configure the approved server endpoint before publication.';\r\n\r\n\r\n submitStatus.classList.add(\r\n 'is-error'\r\n );\r\n\r\n\r\n return;\r\n }\r\n\r\n\r\n setSubmitting(\r\n true\r\n );\r\n\r\n\r\n submitStatus.textContent =\r\n 'Sending your case\u2026';\r\n\r\n\r\n try{\r\n const payload =\r\n new FormData(\r\n form\r\n );\r\n\r\n\r\n \/*\r\n Enforce final selected discipline at submission time.\r\n Disabled irrelevant branch inputs are naturally omitted.\r\n *\/\r\n payload.set(\r\n 'discipline',\r\n state.discipline\r\n );\r\n\r\n\r\n payload.set(\r\n 'phone_normalized',\r\n normalizePhone(\r\n state.contact.phone\r\n )\r\n );\r\n\r\n\r\n payload.set(\r\n 'consent_timestamp',\r\n new Date().toISOString()\r\n );\r\n\r\n\r\n const response =\r\n await fetch(\r\n form.action,\r\n {\r\n method:'POST',\r\n body:payload,\r\n credentials:'same-origin',\r\n headers:{\r\n 'X-Requested-With':'XMLHttpRequest'\r\n }\r\n }\r\n );\r\n\r\n\r\n let result =\r\n null;\r\n\r\n\r\n try{\r\n result =\r\n await response.json();\r\n }catch(_error){\r\n result =\r\n null;\r\n }\r\n\r\n\r\n const success =\r\n response.ok &&\r\n result?.success ===\r\n true;\r\n\r\n\r\n if (\r\n !success\r\n ){\r\n throw new Error(\r\n result?.message ||\r\n 'Submission was not confirmed by the server.'\r\n );\r\n }\r\n\r\n\r\n \/*\r\n Conversion event fires ONLY after backend-confirmed success.\r\n Never attach PII, case notes, filenames or health information.\r\n *\/\r\n window.dataLayer?.push?.({\r\n event:'case_submission_success',\r\n form_name:'lamina_case_submission',\r\n discipline:\r\n state.discipline\r\n });\r\n\r\n\r\n submitStatus.textContent =\r\n 'Received \u2014 opening the next step\u2026';\r\n\r\n\r\n if (\r\n thankYouConfigured()\r\n ){\r\n window.location.assign(\r\n form.dataset.thankYouUrl\r\n );\r\n }else{\r\n submitStatus.textContent =\r\n 'Your case was received successfully. Configure the approved Thank You page URL before publication.';\r\n }\r\n }catch(error){\r\n submitStatus.textContent =\r\n 'We couldn\u2019t send your case. Your entered information has been kept. Please try again.';\r\n\r\n\r\n submitStatus.classList.add(\r\n 'is-error'\r\n );\r\n\r\n\r\n console.error(\r\n 'Lamina case submission:',\r\n error\r\n );\r\n }finally{\r\n setSubmitting(\r\n false\r\n );\r\n }\r\n }\r\n );\r\n\r\n\r\n \/* =======================================================\r\n ENTER KEY SAFETY\r\n ======================================================= *\/\r\n form.addEventListener(\r\n 'keydown',\r\n event => {\r\n if (\r\n event.key !==\r\n 'Enter' ||\r\n state.currentStep ===\r\n 5 ||\r\n event.target.matches(\r\n 'textarea, button, [type=\"submit\"]'\r\n )\r\n ){\r\n return;\r\n }\r\n\r\n\r\n \/*\r\n Do not accidentally submit the full form from an intermediate field.\r\n We intentionally do NOT auto-advance here.\r\n *\/\r\n event.preventDefault();\r\n }\r\n );\r\n\r\n\r\n \/* =======================================================\r\n ONE-TIME ENTRANCE\r\n ======================================================= *\/\r\n function initEntrance(){\r\n entranceObserver?.disconnect();\r\n\r\n\r\n if (\r\n reducedMotion.matches ||\r\n entrancePlayed ||\r\n !(\r\n 'IntersectionObserver' in\r\n window\r\n )\r\n ){\r\n return;\r\n }\r\n\r\n\r\n root.classList.add(\r\n 'has-entry'\r\n );\r\n\r\n\r\n entranceObserver =\r\n new IntersectionObserver(\r\n entries => {\r\n entries.forEach(\r\n entry => {\r\n if (\r\n !entry.isIntersecting\r\n ){\r\n return;\r\n }\r\n\r\n\r\n entrancePlayed =\r\n true;\r\n\r\n\r\n requestAnimationFrame(\r\n () => {\r\n root.classList.add(\r\n 'is-entered'\r\n );\r\n\r\n\r\n window.setTimeout(\r\n () => {\r\n root.classList.remove(\r\n 'has-entry'\r\n );\r\n },\r\n 1650\r\n );\r\n }\r\n );\r\n\r\n\r\n entranceObserver.disconnect();\r\n }\r\n );\r\n },\r\n {\r\n rootMargin:'0px 0px -16% 0px',\r\n threshold:.02\r\n }\r\n );\r\n\r\n\r\n entranceObserver.observe(\r\n root\r\n );\r\n }\r\n\r\n\r\n \/* =======================================================\r\n PASSED-CONTENT DEPTH\r\n Only editorial \/ peripheral layers use this.\r\n The active form step is NEVER blurred.\r\n ======================================================= *\/\r\n const depthProfiles =\r\n {\r\n desktop:{\r\n eyebrow:{\r\n start:.24,\r\n full:-.14,\r\n blur:2.4,\r\n opacityMin:.97\r\n },\r\n headline:{\r\n start:.22,\r\n full:-.16,\r\n blur:3.5,\r\n opacityMin:.96\r\n },\r\n copy:{\r\n start:.17,\r\n full:-.18,\r\n blur:1.8,\r\n opacityMin:.98\r\n },\r\n ui:{\r\n start:.11,\r\n full:-.20,\r\n blur:1.25,\r\n opacityMin:.985\r\n }\r\n },\r\n mobile:{\r\n eyebrow:{\r\n start:.17,\r\n full:-.15,\r\n blur:1.4,\r\n opacityMin:.98\r\n },\r\n headline:{\r\n start:.15,\r\n full:-.17,\r\n blur:2.0,\r\n opacityMin:.98\r\n },\r\n copy:{\r\n start:.11,\r\n full:-.19,\r\n blur:1.05,\r\n opacityMin:.985\r\n },\r\n ui:{\r\n start:.07,\r\n full:-.21,\r\n blur:.75,\r\n opacityMin:.99\r\n }\r\n }\r\n };\r\n\r\n\r\n function refreshDepthLayers(){\r\n depthLayers =\r\n [\r\n ...root.querySelectorAll(\r\n '[data-s09-depth]'\r\n )\r\n ];\r\n\r\n\r\n requestDepthUpdate();\r\n }\r\n\r\n\r\n function smoothstep(\r\n value\r\n ){\r\n const t =\r\n clamp(\r\n value,\r\n 0,\r\n 1\r\n );\r\n\r\n\r\n return (\r\n t *\r\n t *\r\n (\r\n 3 -\r\n 2 *\r\n t\r\n )\r\n );\r\n }\r\n\r\n\r\n function updateDepth(){\r\n depthTicking =\r\n false;\r\n\r\n\r\n \/*\r\n Do not spend filter work while user is actively typing inside form.\r\n Active form is not depth-filtered anyway, and this also avoids\r\n unnecessary mobile work while the software keyboard is open.\r\n *\/\r\n if (\r\n form.matches(\r\n ':focus-within'\r\n ) &&\r\n mobileQuery.matches\r\n ){\r\n depthLayers.forEach(\r\n element => {\r\n element.style.setProperty(\r\n '--s09-passed-blur',\r\n '0px'\r\n );\r\n\r\n\r\n element.style.setProperty(\r\n '--s09-depth-opacity',\r\n '1'\r\n );\r\n }\r\n );\r\n\r\n\r\n return;\r\n }\r\n\r\n\r\n const vh =\r\n Math.max(\r\n 1,\r\n window.innerHeight ||\r\n document.documentElement.clientHeight\r\n );\r\n\r\n\r\n const set =\r\n mobileQuery.matches\r\n ? depthProfiles.mobile\r\n : depthProfiles.desktop;\r\n\r\n\r\n depthLayers.forEach(\r\n element => {\r\n const type =\r\n element.dataset.s09Depth ||\r\n 'copy';\r\n\r\n\r\n const config =\r\n set[\r\n type\r\n ] ||\r\n set.copy;\r\n\r\n\r\n const rect =\r\n element.getBoundingClientRect();\r\n\r\n\r\n const center =\r\n rect.top +\r\n rect.height *\r\n .5;\r\n\r\n\r\n const startY =\r\n vh *\r\n config.start;\r\n\r\n\r\n const fullY =\r\n vh *\r\n config.full;\r\n\r\n\r\n let progress =\r\n center <\r\n startY\r\n ? (\r\n startY -\r\n center\r\n ) \/\r\n Math.max(\r\n 1,\r\n startY -\r\n fullY\r\n )\r\n : 0;\r\n\r\n\r\n progress =\r\n smoothstep(\r\n progress\r\n );\r\n\r\n\r\n if (\r\n element.matches(\r\n ':hover, :focus-within'\r\n )\r\n ){\r\n progress =\r\n 0;\r\n }\r\n\r\n\r\n const blur =\r\n reducedMotion.matches\r\n ? 0\r\n : (\r\n config.blur *\r\n progress\r\n );\r\n\r\n\r\n const opacity =\r\n reducedMotion.matches\r\n ? 1\r\n : (\r\n 1 -\r\n (\r\n 1 -\r\n config.opacityMin\r\n ) *\r\n progress\r\n );\r\n\r\n\r\n element.style.setProperty(\r\n '--s09-passed-blur',\r\n blur.toFixed(\r\n 2\r\n ) +\r\n 'px'\r\n );\r\n\r\n\r\n element.style.setProperty(\r\n '--s09-depth-opacity',\r\n opacity.toFixed(\r\n 3\r\n )\r\n );\r\n }\r\n );\r\n }\r\n\r\n\r\n function requestDepthUpdate(){\r\n if (\r\n depthTicking\r\n ){\r\n return;\r\n }\r\n\r\n\r\n depthTicking =\r\n true;\r\n\r\n\r\n requestAnimationFrame(\r\n updateDepth\r\n );\r\n }\r\n\r\n\r\n \/* =======================================================\r\n INITIALIZE PROGRESSIVE FORM\r\n ======================================================= *\/\r\n captureAttribution();\r\n\r\n\r\n steps.forEach(\r\n step => {\r\n step.hidden =\r\n Number(\r\n step.dataset.formStep\r\n ) !==\r\n 1;\r\n }\r\n );\r\n\r\n\r\n updateCaseBranch();\r\n updateProgress();\r\n refreshDepthLayers();\r\n initEntrance();\r\n\r\n\r\n window.addEventListener(\r\n 'scroll',\r\n requestDepthUpdate,\r\n {\r\n passive:true\r\n }\r\n );\r\n\r\n\r\n window.addEventListener(\r\n 'resize',\r\n requestDepthUpdate,\r\n {\r\n passive:true\r\n }\r\n );\r\n\r\n\r\n mobileQuery.addEventListener?.(\r\n 'change',\r\n requestDepthUpdate\r\n );\r\n\r\n\r\n reducedMotion.addEventListener?.(\r\n 'change',\r\n requestDepthUpdate\r\n );\r\n\r\n\r\n \/*\r\n Non-sensitive analytics start event.\r\n It contains no PII or medical content.\r\n *\/\r\n let formStartTracked =\r\n false;\r\n\r\n\r\n form.addEventListener(\r\n 'focusin',\r\n () => {\r\n if (\r\n formStartTracked\r\n ){\r\n return;\r\n }\r\n\r\n\r\n formStartTracked =\r\n true;\r\n\r\n\r\n window.dataLayer?.push?.({\r\n event:'form_started',\r\n form_name:'lamina_case_submission'\r\n });\r\n },\r\n {\r\n once:true\r\n }\r\n );\r\n\r\n})();\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Lamina Clinic \u2014 Section 1 Hero v7 Istanbul \u00b7 T\u00fcrkiye LLamina Consultation EN Dental Aesthetics A smile, refined. Personalised dental aesthetics shaped around proportion, expression and natural confidence. VeneersImplantsSmile DesignZirconium Explore dental \u2198 Hair Restoration Restore naturally. A considered approach to hair restoration, from medical assessment to natural-looking design. DHISapphire FUEFUE Explore hair \u2199 Choose […]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_header_footer","meta":{"footnotes":""},"class_list":["post-11","page","type-page","status-publish","hentry"],"_hostinger_reach_plugin_has_subscription_block":false,"_hostinger_reach_plugin_is_elementor":false,"_links":{"self":[{"href":"https:\/\/laminasmile.com\/fr\/wp-json\/wp\/v2\/pages\/11","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/laminasmile.com\/fr\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/laminasmile.com\/fr\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/laminasmile.com\/fr\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/laminasmile.com\/fr\/wp-json\/wp\/v2\/comments?post=11"}],"version-history":[{"count":130,"href":"https:\/\/laminasmile.com\/fr\/wp-json\/wp\/v2\/pages\/11\/revisions"}],"predecessor-version":[{"id":321,"href":"https:\/\/laminasmile.com\/fr\/wp-json\/wp\/v2\/pages\/11\/revisions\/321"}],"wp:attachment":[{"href":"https:\/\/laminasmile.com\/fr\/wp-json\/wp\/v2\/media?parent=11"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}