*{box-sizing:border-box}.templates-page{margin:0;background:#f8faf5;color:#204c3c;font-family:Arial,sans-serif}.morph-hero{height:var(--invimoo-vh,100svh);position:relative}.morph-hero.morph-enabled{height:calc(var(--invimoo-vh,100svh)*2.3)}.morph-stage{height:var(--invimoo-visible-vh,100dvh);min-height:680px;position:sticky;top:0;overflow:hidden;isolation:isolate;background:radial-gradient(ellipse at 50% 55%,#eaf0e280 0%,transparent 56%),#f8faf5}.morph-art{display:none;position:absolute;inset:0;pointer-events:none}.morph-enabled .morph-art{display:block}.morph-card{position:absolute;left:50%;top:50%;width:82px;height:114px;margin-left:-41px;margin-top:-57px;will-change:transform;overflow:hidden;border-radius:7px;border:1px solid #d3ddcb;box-shadow:0 8px 20px #204c3c18;background:#eef2e8}.morph-card img{width:100%;height:100%;object-fit:cover;object-position:top;display:block}.morph-copy{position:absolute;z-index:2;left:50%;top:50%;transform:translate(-50%,-50%);width:min(560px,calc(100% - 40px));text-align:center;will-change:transform;pointer-events:none}.morph-eyebrow{font-size:14px;line-height:1.5;letter-spacing:.075em;margin:0 0 20px;color:#526e5b}.morph-copy h1{font-size:42px;line-height:1.09;letter-spacing:-2.4px;font-weight:400;margin:0}.morph-copy h1 span{display:block}.morph-desc{font-size:16px;line-height:1.7;color:#526e5b;margin:24px auto 0;max-width:360px}.morph-enabled .morph-copy{opacity:0;transition:opacity .8s}.morph-enabled.morph-ready .morph-copy{opacity:1}.morph-static .morph-stage{min-height:680px}.morph-hero.morph-static{height:var(--invimoo-visible-vh,100dvh);min-height:680px}
@media(max-width:760px){.morph-stage{min-height:650px}.morph-card{width:58px;height:82px;margin-left:-29px;margin-top:-41px;border-radius:5px}.morph-copy{width:calc(100% - 40px)}.morph-copy h1{font-size:34px;line-height:1.12;letter-spacing:-1.3px}.morph-eyebrow{font-size:14px;letter-spacing:.04em;margin-bottom:16px}.morph-desc{font-size:16px;margin-top:20px;max-width:300px}.morph-static .morph-stage{min-height:650px}}
@media(prefers-reduced-motion:reduce){.morph-card{will-change:auto}.morph-enabled .morph-copy{transition:none}}

.templates-skip{position:fixed;top:8px;left:8px;transform:translateY(-150%);z-index:10000;padding:12px 16px;background:#fff;color:#204c3c}.templates-skip:focus{transform:none}

/* Curved collection gallery: the native page scroll remains untouched. */
.template-collection{position:relative;isolation:isolate;background:#eef2e8;color:#204c3c;padding:104px 0 36px;overflow:clip;border-top:1px solid #204c3c18}
.collection-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:32px;padding:0 48px;position:relative;z-index:2;max-width:1600px;margin:auto}
.collection-eyebrow{font-size:14px;line-height:1.5;letter-spacing:.09em;color:#526e5b;margin:0 0 14px}
.collection-heading h2{font-size:clamp(40px,4.4vw,68px);line-height:1.05;font-weight:400;letter-spacing:-.055em;margin:0}
.collection-description{font-size:16px;line-height:1.6;color:#526e5b;margin:0 0 2px;max-width:370px}
.collection-viewport{height:clamp(430px,66svh,720px);position:relative;outline-offset:-6px;touch-action:pan-y;cursor:grab;isolation:isolate;margin-top:8px}
.collection-viewport:active{cursor:grabbing}.collection-viewport:focus-visible{outline:2px solid #204c3c}
.collection-grid{position:absolute;inset:0;overflow:hidden;pointer-events:none;opacity:.44;mask-image:linear-gradient(transparent,#000 55%,#000 88%,transparent)}
.collection-grid:before,.collection-grid:after{content:"";position:absolute;left:-50%;width:200%;height:100%;background-image:linear-gradient(#204c3c24 1px,transparent 1px),linear-gradient(90deg,#204c3c24 1px,transparent 1px);background-size:80px 56px;transform:perspective(430px) rotateX(66deg);transform-origin:center bottom;bottom:0}
.collection-grid:after{transform:perspective(430px) rotateX(-66deg);transform-origin:center top;top:0;bottom:auto;opacity:.35}
.collection-canvas{display:none;position:absolute;inset:0;width:100%;height:100%}.collection-webgl .collection-canvas{display:block}
.collection-cards{display:flex;list-style:none;gap:20px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:thin;padding:32px max(24px,calc((100% - 310px)/2));height:100%;margin:0;position:relative;z-index:1;touch-action:pan-x pan-y}
.collection-cards[hidden]{display:none}.collection-cards li{flex:0 0 280px;scroll-snap-align:center;display:flex;align-items:center}.collection-cards a{display:block;color:inherit;text-decoration:none;width:100%}.collection-cards img{width:100%;height:auto;max-height:calc(66svh - 60px);object-fit:contain;display:block;border:1px solid #204c3c33;border-radius:10px;box-shadow:0 12px 32px #204c3c12}.collection-cards a>span{display:block;font-size:16px;margin-top:12px;text-align:center}
.collection-toolbar{display:flex;align-items:flex-end;justify-content:space-between;gap:32px;padding:0 48px;max-width:1600px;margin:0 auto;position:relative;z-index:2}
.collection-selected{appearance:none;border:0;padding:0;background:none;color:inherit;text-align:left;cursor:pointer;max-width:65%}.collection-meta{display:flex;gap:10px;align-items:center;font-size:14px;line-height:1.5;color:#526e5b}.collection-name{font-size:clamp(26px,3.6vw,48px);line-height:1.1;letter-spacing:-.045em;display:flex;align-items:center;gap:24px;margin-top:10px}.collection-name svg{flex:none;width:24px;height:24px;stroke:currentColor;fill:none;stroke-width:1.3;transition:transform .2s}.collection-selected:hover svg{transform:translate(3px,-3px)}.collection-open-label{display:block;font-size:14px;line-height:1.5;color:#526e5b;margin-top:12px}
.collection-navigation{display:flex;align-items:center;gap:24px;flex-shrink:0;padding-bottom:3px}.collection-count{display:flex;align-items:baseline;gap:12px;font-size:14px;color:#526e5b;font-variant-numeric:tabular-nums}.collection-count>span:first-child{font-size:36px;line-height:1;letter-spacing:-.06em;color:#204c3c}.collection-index{display:flex;gap:2px}.collection-index button{width:44px;min-height:44px;border:0;background:none;color:#526e5b;padding:0;position:relative;cursor:pointer}.collection-index button:before{content:"";position:absolute;top:14px;bottom:14px;width:1px;background:#204c3c40;left:50%;transition:transform .2s,background .2s}.collection-index button[aria-pressed=true]:before{background:#204c3c;transform:scaleY(1.7)}.collection-index button span{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.collection-arrows{display:flex;gap:8px}.collection-arrows button{display:grid;place-items:center;width:48px;height:48px;border:1px solid #204c3c40;border-radius:50%;background:transparent;color:#204c3c;cursor:pointer;transition:background .2s,color .2s}.collection-arrows button:hover{background:#204c3c;color:#f8faf5}.collection-arrows svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.4}
.template-collection button:focus-visible,.collection-cards a:focus-visible{outline:2px solid #204c3c;outline-offset:6px}.collection-status{position:absolute;width:1px;height:1px;clip-path:inset(50%);overflow:hidden;margin:0}
.collection-detail{display:grid;grid-template-columns:minmax(0,1fr) minmax(220px,.8fr);gap:48px;align-items:center}.collection-detail>img{display:block;width:auto;max-width:100%;height:auto;max-height:65svh;margin:0 auto;border-radius:8px;border:1px solid #204c3c26}.collection-detail-copy p{font-size:16px;line-height:1.65;color:#526e5b;margin:0 0 20px}.collection-detail-copy h3{font-size:32px;line-height:1.1;letter-spacing:-.04em;margin:0 0 20px;font-weight:400}.collection-detail-copy button{display:inline-flex;align-items:center;min-height:48px;background:#204c3c;border:1px solid #204c3c;color:#fff;padding:0 20px;border-radius:6px;font:inherit;cursor:pointer}.collection-detail-copy button:focus-visible{outline:2px solid #204c3c;outline-offset:5px}
@media(max-width:1000px){.collection-index{display:none}.collection-heading,.collection-toolbar{padding-left:28px;padding-right:28px}}
@media(max-width:760px){.template-collection{padding-top:96px;padding-bottom:36px}.collection-heading{display:block;padding:0 20px}.collection-heading h2{font-size:42px}.collection-description{margin-top:20px;font-size:16px;max-width:310px}.collection-eyebrow{font-size:14px;margin-bottom:12px;letter-spacing:.06em}.collection-viewport{height:clamp(400px,58svh,600px);margin-top:16px}.collection-toolbar{padding:0 20px;gap:20px;align-items:flex-start}.collection-selected{max-width:calc(100% - 112px)}.collection-meta{font-size:14px;gap:6px;flex-wrap:wrap}.collection-name{font-size:28px;gap:10px;align-items:flex-start;line-height:1.08}.collection-name svg{width:20px;height:20px;margin-top:4px}.collection-navigation{flex-direction:column;align-items:flex-end;gap:18px;padding-top:2px}.collection-count>span:first-child{font-size:30px}.collection-arrows button{width:44px;height:44px}.collection-open-label{margin-top:12px}.collection-detail{grid-template-columns:1fr;gap:28px}.collection-detail>img{max-height:48svh}.collection-detail-copy h3{font-size:26px}.collection-cards{padding-left:calc((100% - 260px)/2);padding-right:calc((100% - 260px)/2)}.collection-cards li{flex-basis:260px}}
@media(prefers-reduced-motion:reduce){.template-collection *{transition:none!important;scroll-behavior:auto!important}.collection-grid{display:none}.collection-viewport{cursor:auto}}

@media(max-width:1200px){.collection-index{display:none}}

/* One persistent scene: the hero cards become the collection, not a new gallery. */
.template-flow{position:relative;height:calc(var(--invimoo-vh,100svh)*3.9);isolation:isolate;background:var(--flow-color,#f8faf5)}
.template-flow:not(.flow-static) .morph-hero{position:absolute;inset:0;height:100%!important;z-index:2;pointer-events:none}
.template-flow:not(.flow-static) .morph-stage{height:var(--invimoo-visible-vh,100dvh);min-height:0;background:transparent}
.template-flow.template-shared-ready .morph-art{visibility:hidden}
.template-flow:not(.flow-static) .morph-enabled.morph-ready .morph-copy{opacity:var(--hero-copy-alpha,1);transition:opacity .12s linear}
.template-flow:not(.flow-static) .template-collection{position:absolute;inset:0;height:100%;padding:0;border:0;background:transparent;overflow:visible;z-index:1}
.template-flow:not(.flow-static) .collection-scene{position:sticky;top:0;height:var(--invimoo-visible-vh,100dvh);overflow:clip;isolation:isolate}
.template-flow:not(.flow-static) .collection-viewport{position:absolute;inset:0;height:100%;margin:0;outline-offset:-5px}
.template-flow:not(.flow-static) .collection-heading{position:absolute;left:0;right:0;top:110px;z-index:3;opacity:var(--collection-ui,0);transform:translateY(calc((1 - var(--collection-ui,0))*24px));pointer-events:none}
.template-flow:not(.flow-static) .collection-toolbar{position:absolute;left:0;right:0;bottom:28px;z-index:3;opacity:var(--collection-ui,0);transform:translateY(calc((1 - var(--collection-ui,0))*20px))}
.template-flow:not(.flow-static) .collection-grid{opacity:calc(.44 * var(--handoff,0))}
.template-flow:not(.flow-static) .collection-name{font-size:clamp(26px,3.3vw,44px)}
.template-flow.flow-static{height:auto;background:#f8faf5}
.template-flow.flow-static .morph-hero{position:relative}
.template-flow.flow-static .collection-scene{position:relative}
@media(max-width:760px){.template-flow:not(.flow-static) .collection-heading{top:96px}.template-flow:not(.flow-static) .collection-heading h2{font-size:38px}.template-flow:not(.flow-static) .collection-description{margin-top:12px}.template-flow:not(.flow-static) .collection-toolbar{bottom:24px}.template-flow:not(.flow-static) .collection-name{font-size:26px}}
@media(min-width:761px) and (max-height:650px){.template-flow:not(.flow-static) .collection-heading{top:90px}.template-flow:not(.flow-static) .collection-heading h2{font-size:34px}.template-flow:not(.flow-static) .collection-eyebrow{margin-bottom:6px;font-size:12px}.template-flow:not(.flow-static) .collection-name{font-size:30px}.template-flow:not(.flow-static) .collection-open-label{display:none}.template-flow:not(.flow-static) .collection-toolbar{bottom:16px}}
@media(prefers-reduced-motion:reduce){.template-flow{height:auto}.template-flow .morph-hero{position:relative}.template-flow .collection-scene{position:relative}}

/* Moving card/copy layers must not become browser scroll-anchoring candidates. */
.template-flow,.template-flow *{overflow-anchor:none}

/* Equal frames with a proportional top-aligned crop, never image stretching. */
.morph-card{width:82px;height:calc(82px * 578 / 420);margin-left:-41px;margin-top:calc(-41px * 578 / 420)}.morph-card img{object-fit:cover;object-position:top}
@media(max-width:760px){.morph-card{width:58px;height:calc(58px * 578 / 420);margin-left:-29px;margin-top:calc(-29px * 578 / 420)}}