/* SkioSite template collection — v99. Purpose-built page, shared core brand tokens. */
.templates-page{background:#fff}
.templates-page .site-header:not(.is-scrolled){background:linear-gradient(180deg,rgba(5,18,33,.92),rgba(5,18,33,.27) 80%,transparent)}
.templates-page .site-header .desktop-nav [aria-current="page"]{color:#fff;background:rgba(255,255,255,.14)}
.templates-page .mobile-menu-nav [aria-current="page"]{background:rgba(255,255,255,.1);color:#fff}
.templates-page .reveal{opacity:1;transform:none} /* Page intro remains readable even without JS */
.templates-page h1,.templates-page h2,.templates-page h3{margin:0}
.templates-page h2{font-size:clamp(2.2rem,4.4vw,4.3rem)}
.templates-page h3{font-size:clamp(1.2rem,1.8vw,1.55rem)}
.templates-page .section-marker{margin-bottom:20px}
.templates-hero{position:relative;overflow:hidden;background:radial-gradient(circle at 79% 48%,rgba(0,217,255,.12),transparent 37%),linear-gradient(128deg,#071b32 0%,#0b2545 54%,#153e5b 100%);color:white;min-height:680px;display:flex;align-items:center}
.templates-hero-grid{pointer-events:none;position:absolute;inset:0;background-image:linear-gradient(rgba(145,211,236,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(145,211,236,.055) 1px,transparent 1px);background-size:54px 54px;mask-image:linear-gradient(90deg,transparent 15%,#000 95%)}
.templates-hero::after{content:"";position:absolute;width:52vw;height:52vw;min-width:490px;min-height:490px;right:-24%;bottom:-66%;border:1px solid rgba(0,217,255,.25);border-radius:50%;box-shadow:0 0 0 92px rgba(0,217,255,.025),0 0 0 185px rgba(0,217,255,.025);pointer-events:none}
.templates-hero-layout{padding:182px 0 117px;display:grid;grid-template-columns:minmax(0,1fr) 305px;align-items:center;gap:clamp(44px,7vw,110px);position:relative;z-index:1}
.templates-breadcrumb{display:flex;align-items:center;gap:12px;font-size:.68rem;font-weight:600;color:#92acc5;margin-bottom:39px}.templates-breadcrumb a:hover{color:#00d9ff}
.templates-kicker{display:flex;align-items:center;gap:10px;color:#a5d8e9;font:700 .68rem Montserrat,sans-serif;letter-spacing:.19em;text-transform:uppercase;margin-bottom:22px}
.kicker-flare{width:8px;height:8px;background:var(--aqua);border-radius:100%;box-shadow:0 0 0 6px rgba(0,217,255,.12)}
.templates-hero h1{font-size:clamp(3.6rem,6.8vw,6.6rem);line-height:.99;margin:0 0 27px;max-width:830px}
.templates-hero h1 em{font-style:normal;color:var(--aqua)}
.templates-hero-copy>p{max-width:670px;color:#c5d7e7;font-size:1.02rem;line-height:1.78;margin:0 0 30px}
.templates-hero-actions{display:flex;align-items:center;gap:27px;flex-wrap:wrap}
.templates-text-link{display:inline-flex;align-items:center;gap:10px;font:700 .76rem Montserrat,sans-serif;color:#f6fdff;border-bottom:1px solid rgba(255,255,255,.34);padding-bottom:7px;transition:color .2s,border-color .2s}
.templates-text-link:hover{color:var(--aqua);border-color:var(--aqua)}
.templates-hero-notes{display:flex;gap:12px 23px;flex-wrap:wrap;margin-top:49px;font-size:.68rem;letter-spacing:.02em;color:#95b7ca}.templates-hero-notes span{display:flex;align-items:center;gap:8px}.templates-hero-notes span::before{content:"";height:5px;width:5px;border-radius:100%;background:#00d9ff}
.templates-hero-price{padding:34px;background:rgba(255,255,255,.06);border:1px solid rgba(167,226,245,.2);border-radius:20px;backdrop-filter:blur(15px);box-shadow:0 20px 90px rgba(0,9,24,.15);justify-self:end;width:100%}
.templates-hero-price>span{color:#bfdded;text-transform:uppercase;letter-spacing:.16em;font:700 .62rem Montserrat,sans-serif}
.templates-hero-price strong{display:block;font:700 clamp(3.7rem,5.8vw,5.3rem) Montserrat,sans-serif;letter-spacing:-.085em;line-height:1.25;margin:14px 0 0;color:#fff}.templates-hero-price strong sup{font-size:1.2rem;vertical-align:top;position:relative;top:14px;color:var(--aqua)}
.templates-hero-price p{margin:0;color:#bad4e6;font-size:.82rem}.templates-hero-price div{margin:27px 0;height:1px;background:rgba(255,255,255,.15)}.templates-hero-price small{font-size:.8rem;color:#d1e5f0;line-height:1.95}
/* tile gallery */
.templates-collection{padding:105px 0 104px;background:#fff}
.template-section-top{max-width:830px;margin-bottom:45px}
.template-section-top h2{margin-bottom:20px;line-height:1.1}.template-section-top p{max-width:690px;color:#60758a;font-size:.99rem;line-height:1.85;margin:0}
.template-catalog{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.template-tile{border-radius:20px;overflow:hidden;border:1px solid #dce6ee;background:#fff;display:flex;flex-direction:column;transition:transform .2s,border-color .2s,box-shadow .2s;box-shadow:0 6px 28px rgba(5,25,46,.035)}
.template-tile.is-active{border-color:#6a9ba9;box-shadow:0 20px 60px rgba(6,28,53,.1)}.template-tile:hover{transform:translateY(-3px)}
.tile-visual{height:245px;position:relative;overflow:hidden;padding:19px 25px;display:flex;flex-direction:column;justify-content:flex-end}
.tile-window-top{display:flex;align-items:center;gap:5px;position:absolute;top:15px;left:20px;right:20px;font:700 .61rem Montserrat,sans-serif;letter-spacing:.14em}
.tile-window-top i{height:5px;width:5px;border-radius:50%;background:currentColor;opacity:.5}.tile-window-top span{margin-left:auto}
.tile-graphic-kicker{font:700 .57rem Montserrat,sans-serif;letter-spacing:.17em;margin-bottom:10px;position:relative;z-index:2;opacity:.83}
.tile-visual strong{font:700 clamp(1.6rem,2.4vw,2.4rem)/1.1 Montserrat,sans-serif;letter-spacing:-.055em;position:relative;z-index:2}
.homevolt-visual{background:radial-gradient(circle at 87% 18%,rgba(23,222,218,.39),transparent 47%),linear-gradient(145deg,#081a32,#123e68 75%,#022748);color:#f5fcff}
.tile-electric-mark{position:absolute;font-family:Montserrat,sans-serif;font-size:16rem;line-height:1;top:-38px;right:-10px;opacity:.065;transform:rotate(-20deg)}
.tile-graphic-lines{position:absolute;right:12px;bottom:10px;display:grid;gap:7px;transform:rotate(-35deg);opacity:.3}.tile-graphic-lines i{height:4px;width:92px;background:#31e7ff;border-radius:4px}
.liberty-visual{background:radial-gradient(ellipse at 95% 99%,#b9dfde 0%,transparent 42%),linear-gradient(110deg,#f1f3eb,#f8faf7);color:#153e3a}
.liberty-visual .tile-window-top{color:#386b67}.tile-graphic-pill{position:absolute;right:30px;bottom:38px;border:1px solid #a3c9c4;border-radius:50px;padding:7px 14px;font:600 .63rem Inter,sans-serif}.tile-graphic-pill span{margin-left:11px}
.liberty-pipe{position:absolute;right:-18px;top:40px;width:110px;height:130px;border:17px solid rgba(43,145,139,.12);border-radius:60px 60px 0 0;transform:rotate(10deg)}
.summit-visual{background:linear-gradient(125deg,rgba(18,24,27,.6),transparent 69%),linear-gradient(150deg,#26323b,#775445 70%,#d18552);color:#fff}
.summit-visual .tile-window-top{color:#f1d9c9}.tile-summit-motif{position:absolute;right:-30px;bottom:-28px;width:230px;height:185px;background:linear-gradient(150deg,transparent 48%,rgba(255,255,255,.11) 49% 54%,transparent 55%),linear-gradient(30deg,transparent 45%,rgba(255,255,255,.09) 46% 53%,transparent 54%);transform:rotate(-10deg)}
.template-tile-content{display:flex;flex:1;flex-direction:column;padding:27px 24px 24px}
.tile-topline{display:flex;justify-content:space-between;gap:10px;align-items:center;margin-bottom:16px;color:#7c8fa0;font:600 .62rem Montserrat,sans-serif}
.tile-pill{border:1px solid #d6e6ed;border-radius:50px;padding:5px 8px;font-size:.58rem;color:var(--baltic);white-space:nowrap}
.template-tile h3{font-size:1.3rem;margin-bottom:11px}.template-tile-content>p{color:#667c91;font-size:.82rem;line-height:1.7;min-height:58px;margin:0 0 17px}
.tile-feature{border-top:1px solid #e6edf2;padding:17px 0 20px;margin-top:auto;font-size:.79rem;font-weight:600;line-height:1.65;color:#254962;min-height:86px}
.tile-actions{display:grid;grid-template-columns:1fr auto;align-items:stretch;gap:8px}
.tile-actions button{cursor:pointer;border-radius:30px;font:700 .66rem Montserrat,sans-serif;min-height:43px;padding:10px 13px;transition:background-color .2s,color .2s,border-color .2s;text-align:center}
.template-tile-preview{background:#eef4f7;color:var(--prussian);border:1px solid #dbe9f0}.template-tile-preview:hover{background:#dcecf4}
.template-tile-preview[aria-pressed="true"]{background:#e2f5fb;border-color:#7fc5d8}.template-tile-preview span{margin-left:3px}
.template-tile-purchase{background:#0b2545;color:#fff;border:1px solid #0b2545}.template-tile-purchase:hover{background:#245273}
/* live site frame */
.template-showroom{background:#071b32;color:#fff;padding:98px 0 105px;overflow:hidden}
.showroom-intro{display:flex;justify-content:space-between;gap:60px;align-items:flex-end;margin-bottom:41px}
.showroom-intro>div:first-child{max-width:775px}.showroom-intro h2{margin:0 0 18px;font-size:clamp(2.15rem,4.4vw,4.2rem)}
.showroom-intro p{color:#a7c1d5;margin:0;max-width:730px;line-height:1.83;font-size:.94rem}
.showroom-price-label{text-align:right;font:600 .75rem/1.7 Inter,sans-serif;color:#a8c5d8;min-width:170px}.showroom-price-label strong{font:700 1.26rem Montserrat,sans-serif;color:#00d9ff}
.showroom-toolbar{padding:17px 20px;background:#14334e;border:1px solid rgba(200,240,255,.16);border-radius:20px 20px 0 0;display:flex;align-items:center;gap:20px;justify-content:space-between}
.showroom-current{display:flex;align-items:center;gap:12px;min-width:0}.showroom-dot{width:9px;height:9px;flex-shrink:0;background:#00d9ff;box-shadow:0 0 0 5px rgba(0,217,255,.1);border-radius:50%}.showroom-current div{display:grid;min-width:0;gap:2px}.showroom-current small{font-size:.59rem;text-transform:uppercase;letter-spacing:.13em;color:#9fbdd0}.showroom-current strong{font:700 .92rem Montserrat,sans-serif;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.device-switch{display:inline-flex;gap:4px;border-radius:999px;background:rgba(0,12,30,.28);padding:4px;border:1px solid rgba(255,255,255,.14)}.device-button{display:flex;align-items:center;gap:8px;border:0;border-radius:999px;background:transparent;color:#bed4e2;padding:9px 15px;cursor:pointer;font:700 .67rem Montserrat,sans-serif}.device-button.is-active{color:#0b2545;background:#fff}.device-button svg{width:15px;height:15px}
.showroom-external{font:700 .71rem Montserrat,sans-serif;color:#c1e8f5;border-bottom:1px solid rgba(255,255,255,.25);padding-bottom:5px;white-space:nowrap}.showroom-external:hover{color:#fff;border-bottom-color:#fff}
.preview-stage{background:radial-gradient(circle at 50% 24%,#193f5b,#0b253c 75%);border:1px solid rgba(200,240,255,.16);border-top:0;border-radius:0 0 20px 20px;display:flex;justify-content:center;align-items:flex-start;min-height:450px;overflow:hidden;padding:24px 26px 34px;transition:padding .18s ease}
.preview-viewport{position:relative;width:100%;overflow:hidden;background:#fff;box-shadow:0 35px 80px rgba(0,0,0,.4);border:1px solid rgba(255,255,255,.17);border-radius:11px;max-width:100%;min-height:400px}
.preview-stage[data-device="desktop"] .preview-viewport{width:100%;}
.preview-stage iframe{display:block;border:0;background:white}
.preview-stage[data-device="desktop"] iframe{width:1440px;height:900px;transform-origin:0 0;transform:scale(var(--desktop-preview-scale,.7))}
.preview-stage[data-device="mobile"]{padding:38px 22px 48px}.preview-stage[data-device="mobile"] .preview-viewport{width:min(390px,100%);height:745px;min-height:0;border:7px solid #d6e1e9;border-radius:36px;box-shadow:0 0 0 5px rgba(0,0,0,.25),0 32px 70px rgba(0,0,0,.45)}
.preview-stage[data-device="mobile"] iframe{height:100%;width:100%;transform:none}
.showroom-bottom{display:flex;justify-content:space-between;align-items:center;gap:35px;margin-top:22px}.showroom-bottom p{margin:0;font-size:.75rem;color:#a1b9cc;max-width:740px;line-height:1.75}.showroom-bottom p strong{color:#eff8ff}.showroom-bottom p a{color:#7de9fa;text-decoration:underline;text-underline-offset:3px}.showroom-bottom .button{flex-shrink:0}
/* brand edits */
.template-customize{padding:106px 0 88px}
.customize-layout{display:grid;grid-template-columns:minmax(0,.92fr) minmax(0,1fr);align-items:start;gap:clamp(40px,8vw,135px)}
.customize-lead h2{line-height:1.11;max-width:610px;margin-bottom:24px}.customize-lead h2 em{font-style:normal;color:#4a83a4}.customize-lead>p{color:#60788c;line-height:1.85;margin-bottom:29px;max-width:545px}.templates-text-link-dark{color:#113b5c;border-color:#a2c0d2}.templates-text-link-dark:hover{color:#087d99;border-color:#087d99}
.customize-list{display:grid;grid-template-columns:1fr 1fr;gap:2px;background:#dee9f0;border:1px solid #dee9f0}
.customize-list>div{background:#fff;padding:30px 25px 26px;min-height:206px}.customize-list span{display:block;color:#6ba2b4;font:700 .7rem Montserrat,sans-serif;margin-bottom:14px}.customize-list strong{display:block;color:#11324f;font:700 1rem Montserrat,sans-serif;margin-bottom:11px}.customize-list p{color:#647b90;font-size:.82rem;line-height:1.75;margin:0}
.customize-note{padding:19px 23px;margin:39px 0 0;border-radius:12px;background:#f2f7fa;color:#6d8396;font-size:.76rem;line-height:1.8}
/* pricing tiers */
.template-plans{padding:105px 0 115px}
.plan-header{display:flex;align-items:end;justify-content:space-between;gap:55px;margin-bottom:43px}.plan-header>div:first-child{max-width:820px}.plan-header h2{margin-bottom:20px}.plan-header p{color:#60788b;margin:0;line-height:1.82;max-width:720px;font-size:.94rem}.plan-header p strong{color:#0c3556}
.plan-legend{text-align:right;min-width:190px;color:#516a81;font:600 .75rem Montserrat,sans-serif}.plan-legend strong{display:block;font-size:1.55rem;color:#103755;margin-top:6px}.plan-legend small{display:block;font:400 .68rem Inter,sans-serif;margin-top:8px;color:#688094}
.management-plans{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:13px;align-items:stretch}
.management-plan{position:relative;min-width:0;display:flex;flex-direction:column;padding:27px 23px 24px;border:1px solid #d4e2eb;border-radius:17px;background:#fff;box-shadow:0 8px 33px rgba(8,31,54,.025)}
.management-plan-featured{border:1px solid #3486a9;box-shadow:0 18px 45px rgba(3,48,75,.11)}
.plan-popular{position:absolute;top:-13px;right:15px;background:#0b2545;color:#fff;border-radius:50px;padding:5px 12px;text-transform:uppercase;letter-spacing:.08em;font:700 .57rem Montserrat,sans-serif}
.plan-plan-name{display:block;font:700 .92rem Montserrat,sans-serif;color:#18405c;min-height:41px;line-height:1.4}
.plan-amount{display:flex;align-items:baseline;gap:3px;margin:17px 0 8px}.plan-amount strong{font:700 clamp(2.2rem,3.2vw,3.15rem) Montserrat,sans-serif;line-height:1;letter-spacing:-.06em;color:#0a2a46}.plan-amount span{font-size:.75rem;color:#5d7487}
.plan-audience{font-size:.76rem;color:#60778b;line-height:1.65;min-height:60px;margin:3px 0 20px}.management-plan ul{list-style:none;padding:19px 0 7px;margin:0 0 15px;border-top:1px solid #e2ebf1;display:grid;align-content:start;gap:13px}.management-plan li{position:relative;padding-left:18px;font-size:.79rem;color:#47647a;line-height:1.65}.management-plan li::before{content:'✓';font-weight:700;color:#038dab;position:absolute;left:0;top:0}
.plan-select-button{margin-top:auto;padding:13px 7px;display:flex;justify-content:space-between;gap:8px;align-items:center;cursor:pointer;border:0;border-top:1px solid #e2ebf1;background:transparent;color:#063f62;font:700 .7rem Montserrat,sans-serif;text-align:left}.plan-select-button:hover{color:#0785a9}
.plan-custom{border:1px solid #d7e5ee;background:#fff;border-radius:13px;display:flex;justify-content:space-between;align-items:center;gap:24px;margin:18px 0 40px;padding:23px 25px}
.plan-custom strong{font:700 .94rem Montserrat,sans-serif;color:#0b3552}.plan-custom p{font-size:.78rem;color:#667e92;margin:5px 0 0;line-height:1.65}.plan-custom>span{flex-shrink:0;border:1px solid #b8ccd9;border-radius:40px;padding:10px 15px;font:700 .68rem Montserrat,sans-serif;color:#225473}
.template-launch-box{margin-bottom:28px;display:grid;grid-template-columns:47px minmax(0,1fr) auto;gap:22px;align-items:center;padding:32px;background:#e1edf5;border-radius:18px;border:1px solid #cbdfe9}
.launch-icon{width:44px;height:44px;background:#c7e1ed;display:grid;place-items:center;border-radius:13px;color:#0c3e5d}.launch-icon svg{width:22px;height:22px}
.launch-title-row{display:flex;gap:15px;justify-content:space-between;flex-wrap:wrap;align-items:baseline;margin-bottom:11px}.launch-title-row strong{font:700 1.1rem Montserrat,sans-serif;color:#0c3454}.launch-title-row span{font:700 .85rem Montserrat,sans-serif;color:#0f5171}
.template-launch-box p{font-size:.83rem;color:#41647e;line-height:1.8;margin:0 0 9px}.template-launch-box small{font-size:.73rem;color:#72899c}
/* steps + contact */
.template-steps{padding:95px 0 105px}.template-steps h2{margin:0 0 42px}.template-steps-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border-top:1px solid #e0e8ee}
.template-steps-grid article{padding:28px 24px 0;border-left:1px solid #e0e8ee}.template-steps-grid article:first-child{padding-left:0;border-left:0}.template-steps-grid span{display:block;color:#198aa8;font:700 .7rem Montserrat,sans-serif;margin-bottom:31px}.template-steps-grid h3{font-size:1.04rem;line-height:1.4;margin-bottom:11px}.template-steps-grid p{font-size:.83rem;color:#667e92;line-height:1.8;margin:0}
.template-contact{padding:105px 0 125px}.template-contact-layout{display:grid;grid-template-columns:.75fr 1fr;align-items:start;gap:clamp(35px,7vw,105px)}
.template-contact-copy{position:sticky;top:135px}.template-contact-copy h2{margin-bottom:24px}.template-contact-copy>p{color:#bed0de;max-width:480px;line-height:1.85;font-size:.92rem}.template-contact-highlight{border-top:1px solid rgba(255,255,255,.18);margin-top:35px;padding-top:27px;display:flex;flex-direction:column;align-items:flex-start}.template-contact-highlight>span{color:#8faec2;font-size:.7rem;text-transform:uppercase;letter-spacing:.13em}.template-contact-highlight strong{color:#fff;font:700 3.3rem Montserrat,sans-serif;letter-spacing:-.07em;line-height:1.35}.template-contact-highlight small{font-size:.77rem;color:#9cc1d7;line-height:1.65}.template-contact-copy .template-inquiry-disclaimer{font-size:.76rem;margin-top:32px;color:#7795ac}
.template-project-form h3{font-size:1.65rem;margin:0 0 10px}.template-form-kicker{color:#298aa2;font:700 .68rem Montserrat,sans-serif;text-transform:uppercase;letter-spacing:.15em;margin-bottom:12px}.template-project-form .template-form-lead{font-size:.87rem;color:#6c8394;margin:0 0 27px}.template-project-form label>span small{font:400 .72rem Inter,sans-serif;color:#8aa0ae}
.template-setup-included{display:grid;gap:7px;padding:17px 20px;background:#eff7fb;border-radius:12px;border:1px solid #d9e8f0;margin:4px 0 22px}.template-setup-included strong{font:700 .77rem Montserrat,sans-serif;color:#103a58}.template-setup-included small{font:400 .74rem Inter,sans-serif;color:#607b90;line-height:1.6}
.template-project-form .form-footer .button{white-space:normal;min-height:51px;text-align:center}.template-form-shell{min-width:0}.template-request-success{padding:42px;background:#fff;color:#092946;border-radius:20px}.template-request-success[hidden]{display:none}.template-success-icon{display:grid;place-items:center;background:#dff6ee;color:#11643b;border-radius:15px;height:55px;width:55px;font-size:1.4rem;margin-bottom:22px}.template-request-success h3{font-size:2rem;margin-bottom:15px}.template-request-success p{color:#637b90;margin-bottom:25px;line-height:1.8}
@media(max-width:1100px){.management-plans{grid-template-columns:repeat(2,minmax(0,1fr))}.management-plan .plan-audience{min-height:0}.template-launch-box{grid-template-columns:42px 1fr}.template-launch-box .button{grid-column:2;justify-self:start}.template-catalog{gap:12px}.template-tile-content{padding:22px 16px}.tile-actions{grid-template-columns:1fr}.template-tile-content>p{min-height:85px}.tile-feature{min-height:90px}}
@media(max-width:850px){.templates-hero-layout{grid-template-columns:1fr;gap:30px;padding:146px 0 80px}.templates-hero{min-height:0}.templates-hero-price{justify-self:start;max-width:450px}.template-catalog{grid-template-columns:1fr;gap:20px}.template-tile{display:grid;grid-template-columns:minmax(210px,.8fr) 1fr}.tile-visual{height:auto;min-height:240px}.template-tile-content>p,.tile-feature{min-height:0}.tile-actions{grid-template-columns:1fr auto}.showroom-intro{align-items:flex-start}.showroom-bottom{flex-direction:column;align-items:flex-start}.customize-layout{grid-template-columns:1fr;gap:40px}.plan-header{align-items:flex-start;flex-direction:column;gap:23px}.plan-legend{text-align:left}.template-steps-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:26px 0}.template-contact-layout{grid-template-columns:1fr;gap:43px}.template-contact-copy{position:static}.template-contact-highlight{margin-top:25px}.template-contact-copy .template-inquiry-disclaimer{margin-top:20px}}
@media(max-width:650px){.templates-hero h1{font-size:clamp(3.1rem,12vw,4.65rem)}.templates-hero-layout{padding:126px 0 65px}.templates-breadcrumb{margin-bottom:30px}.templates-hero-price{max-width:100%}.templates-hero-notes{margin-top:33px}.templates-collection,.template-showroom,.template-customize,.template-plans,.template-steps,.template-contact{padding-top:73px;padding-bottom:78px}.template-catalog{grid-template-columns:1fr}.template-tile{display:flex;flex-direction:column}.tile-visual{height:220px;min-height:0}.template-tile-content{padding:24px 22px}.tile-actions{grid-template-columns:1fr 1fr}.showroom-intro{flex-direction:column;gap:16px;margin-bottom:28px}.showroom-price-label{text-align:left}.showroom-toolbar{flex-wrap:wrap;gap:17px;padding:17px 16px}.showroom-current{flex-basis:100%}.device-switch{flex:1;justify-content:center}.showroom-external{font-size:.68rem}.preview-stage{padding:13px 12px 19px;min-height:320px}.preview-stage[data-device="mobile"]{padding:23px 10px 31px}.preview-stage[data-device="mobile"] .preview-viewport{height:660px}.showroom-bottom .button{width:100%;white-space:normal}.customize-list{grid-template-columns:1fr}.customize-list>div{min-height:0;padding:23px}.management-plans{grid-template-columns:1fr}.management-plan{padding:26px}.plan-plan-name{min-height:0}.management-plan ul{margin-bottom:16px}.plan-custom{align-items:flex-start;flex-direction:column;gap:15px}.template-launch-box{grid-template-columns:1fr;padding:26px}.template-launch-box .button{grid-column:auto}.template-steps-grid{grid-template-columns:1fr;gap:0}.template-steps-grid article,.template-steps-grid article:first-child{border-left:0;border-bottom:1px solid #e0e8ee;padding:24px 0}.template-steps-grid span{margin-bottom:14px}.template-project-form .form-footer .button{width:100%}}
@media(max-width:410px){.templates-hero-actions .button{width:100%;white-space:normal;text-align:center}.tile-actions{grid-template-columns:1fr}.template-tile-content{padding:22px 19px}.showroom-toolbar{gap:12px}.showroom-external{flex-basis:100%;text-align:center}.template-request-success{padding:25px}}
@media(prefers-reduced-motion:reduce){.template-tile,.templates-text-link,.tile-actions button{transition:none}}


/* v102 — compact showcase, true brand colors & viewport-height sections */
.templates-page .site-header:not(.is-scrolled){background:#0b2545}
.templates-page .templates-collection{padding:clamp(112px,13vh,150px) 0 62px; min-height: min(100svh,920px)}
.templates-page .template-section-top{max-width:none;margin-bottom:25px}
.templates-page .template-section-top h1{font:800 clamp(2rem,3.9vw,3.55rem)/1.03 Montserrat,sans-serif;letter-spacing:-.055em;color:#0b2545;margin-bottom:8px}
.templates-page .template-section-top p{font-size:.86rem;line-height:1.55;color:#60768a}
.templates-page .section-marker{margin-bottom:12px}
.catalog-heading-row{display:flex;align-items:end;justify-content:space-between;gap:15px}
.catalog-plan-link{font:700 .74rem Montserrat,sans-serif;color:#174467;white-space:nowrap;border-bottom:1px solid #8ba7b5;padding-bottom:5px}
.template-catalog{gap:18px}
.template-tile{--brand-primary:#0f2942;--brand-accent:#ffc928;--brand-tint:#f1f6fa;border:1px solid #dfebef;background:var(--brand-tint);border-radius:16px;overflow:hidden}
.template-tile-homevolt{--brand-primary:#0f2942;--brand-accent:#ffc928;--brand-tint:#f1f5f8}
.template-tile-liberty{--brand-primary:#143a66;--brand-accent:#c62828;--brand-tint:#f4f7fc}
.template-tile-summit{--brand-primary:#0b2d5b;--brand-accent:#f97316;--brand-tint:#f4f7fa}
.template-tile.is-active{border-color:var(--brand-primary);box-shadow:0 12px 34px rgba(8,31,54,.12)}
.tile-screenshot{display:block;position:relative;height:clamp(175px,22vh,240px);background:var(--brand-primary);overflow:hidden;isolation:isolate}
.tile-screenshot img{width:100%;height:100%;display:block;object-fit:cover;object-position:50% 0%;transition:transform .5s cubic-bezier(.2,.7,.2,1);transform-origin:top center}
.tile-screenshot:hover img,.tile-screenshot:focus-visible img{transform:scale(1.055)}
.tile-screenshot:after{content:"";position:absolute;inset:40% 0 0;pointer-events:none;background:linear-gradient(transparent,rgba(0,0,0,.18))}
.preview-pill{position:absolute;z-index:2;bottom:13px;right:13px;padding:7px 11px;display:inline-flex;gap:5px;align-items:center;border-radius:999px;background:#fff;color:#0b2545;box-shadow:0 4px 16px rgba(0,0,0,.12);font:700 .65rem Montserrat,sans-serif;transition:background .2s}
.preview-pill svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:2;max-width:0;opacity:0;transform:translateX(-3px);transition:max-width .25s,opacity .2s,transform .25s}
.tile-screenshot:hover .preview-pill,.tile-screenshot:focus-visible .preview-pill{background:var(--brand-accent);color:#fff}
.template-tile-homevolt .tile-screenshot:hover .preview-pill,.template-tile-homevolt .tile-screenshot:focus-visible .preview-pill{color:#0f2942}
.tile-screenshot:hover .preview-pill svg,.tile-screenshot:focus-visible .preview-pill svg{max-width:16px;opacity:1;transform:translateX(0)}
.template-tile-content{padding:18px 20px 19px;gap:0;min-height:188px;border-top:4px solid var(--brand-accent);background:var(--brand-tint)}
.template-tile .tile-title{font:800 1.15rem/1.2 Montserrat,sans-serif;color:var(--brand-primary);letter-spacing:-.025em;margin:0 0 7px}
.template-tile-liberty .tile-title{font-family:Archivo,Montserrat,sans-serif}
.template-tile-summit .tile-title{font-family:'Barlow Semi Condensed',Montserrat,sans-serif;font-size:1.3rem}
.template-tile-content>p{font-size:.78rem;line-height:1.5;min-height:48px;margin:0 0 14px;color:#476174}
.tile-actions{grid-template-columns:1fr 1fr;gap:8px;margin-top:auto}
.tile-actions button{font-size:.66rem;padding:9px 8px;min-height:41px}
.template-tile-preview{color:var(--brand-primary);border-color:rgba(13,41,70,.18);background:#fff}
.template-tile-preview[aria-pressed=true]{background:#fff;border-color:var(--brand-primary)}
.template-tile-purchase{background:var(--brand-primary);border-color:var(--brand-primary);color:#fff}
.template-tile-purchase:hover{background:var(--brand-accent);border-color:var(--brand-accent);color:#fff}
.template-tile-homevolt .template-tile-purchase:hover{color:#0f2942}
/* Fold-aware desktop showroom */
.template-showroom{padding:clamp(30px,4vh,50px) 0;min-height:min(100svh,950px)}
.showroom-intro{align-items:center;margin-bottom:15px;gap:25px}
.showroom-intro h2{font-size:clamp(1.8rem,2.9vw,2.6rem);margin:0}
.showroom-price-label{display:flex;gap:8px;align-items:baseline;white-space:nowrap;font-size:.72rem}
.showroom-price-label strong{font-size:.93rem}
.showroom-template-switch{display:flex;gap:7px;margin:0 0 12px;flex-wrap:wrap}
.showroom-template-button{cursor:pointer;display:inline-flex;align-items:center;gap:8px;border-radius:99px;background:transparent;border:1px solid rgba(255,255,255,.25);color:#dae9f2;padding:9px 17px;font:700 .7rem Montserrat,sans-serif;transition:background .2s,border-color .2s,color .2s}
.showroom-template-button:hover{border-color:rgba(140,239,255,.55);background:rgba(255,255,255,.06)}
.showroom-template-button:focus-visible{outline:2px solid #8cefff;outline-offset:3px}
.showroom-template-button.is-active{border-color:#00d9ff;background:rgba(0,217,255,.14);color:#fff}
/* Uniform SkioSite page-layout glyph, borrowed from the homepage Templates banner. */
.showroom-switch-glyph{display:block;width:17px;height:17px;flex:none;stroke:currentColor;stroke-width:1.25;stroke-linecap:round;stroke-linejoin:round;opacity:.58;transition:opacity .2s}
.showroom-template-button:hover .showroom-switch-glyph,.showroom-template-button.is-active .showroom-switch-glyph{opacity:.92}
.showroom-toolbar{padding:9px 15px;border-radius:12px 12px 0 0;min-height:58px}
.preview-stage{min-height:0;padding:10px 13px 13px;align-items:center}
.preview-viewport{min-height:0;flex-shrink:0;max-width:100%;border-radius:6px}
.preview-stage[data-device=desktop] .preview-viewport{width:auto}
.preview-stage[data-device=mobile]{padding:9px 12px 12px}
.preview-stage[data-device=mobile] .preview-viewport{width:min(320px,100%);height:min(470px,calc(100svh - 395px));min-height:260px;border-width:5px;border-radius:25px}
.showroom-bottom{gap:18px;margin-top:13px}.showroom-bottom p{font-size:.71rem;line-height:1.55}.showroom-bottom .button{min-height:40px;font-size:.67rem}
/* Compact customization and pricing; individual sections stay composed on desktop */
.template-customize{padding:55px 0 48px;min-height:min(100svh,800px);display:flex;flex-direction:column;justify-content:center}
.customize-layout{gap:45px;align-items:center}
.customize-lead h2{font-size:clamp(2.2rem,3.3vw,3.2rem);margin-bottom:17px}.customize-lead>p{font-size:.88rem;line-height:1.65;margin-bottom:18px}
.customize-list{gap:1px}.customize-list>div{min-height:130px;padding:19px 21px}.customize-list>div svg{height:23px;width:23px;stroke:#1790b0;fill:none;stroke-width:1.8;margin-bottom:5px}.customize-list strong{font-size:.89rem;margin-bottom:5px}.customize-list p{font-size:.76rem;line-height:1.5}
.customize-note{margin:19px 0 0;padding:12px 18px;font-size:.72rem;line-height:1.55}
.template-plans{padding:55px 0 55px;min-height:min(100svh,850px);display:flex;flex-direction:column;justify-content:center}
.plan-header{align-items:center;margin-bottom:30px;gap:30px}.plan-header h2{margin:0 0 10px;font-size:clamp(2.1rem,3.5vw,3.2rem)}.plan-header p{font-size:.86rem;line-height:1.6}.plan-legend strong{font-size:1.85rem}
.management-plans{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.management-plan{padding:26px 23px 18px}.plan-plan-name{min-height:26px}.plan-amount{margin:9px 0 5px}.plan-audience{min-height:39px;margin:3px 0 11px}.management-plan ul{margin:0 0 12px;padding:12px 0 5px;gap:6px}.management-plan li{font-size:.74rem;line-height:1.4}
.plan-update-count{display:flex;gap:12px;align-items:center;background:#edf5fa;border-radius:11px;padding:12px 14px;margin:7px 0 13px}.plan-update-count strong{font:800 2.05rem/1 Montserrat,sans-serif;color:#0b2545}.plan-update-count span{font-size:.72rem;line-height:1.4;color:#30556c;max-width:120px;font-weight:600}
.management-plan-featured{border-color:#168cb0;box-shadow:0 15px 46px rgba(0,102,147,.12)}
.plan-update-note{font-size:.73rem;color:#5e7588;line-height:1.5;margin:14px 0 0}.plan-update-note strong{color:#0b2545}
.template-launch-inline{display:flex;align-items:center;gap:14px;padding:16px 20px;margin-top:19px;border:1px solid #cbdfe9;background:#e8f2f8;border-radius:13px;font-size:.76rem;color:#49687e}
.template-launch-inline strong{white-space:nowrap;color:#0b2545;font:700 .82rem Montserrat,sans-serif}
.template-launch-inline span{flex:1}.template-launch-inline button{cursor:pointer;color:#0a4264;border:0;background:none;font:700 .72rem Montserrat,sans-serif;white-space:nowrap}
.template-contact{padding:65px 0 80px}.template-contact-copy h2{font-size:clamp(2.1rem,3.2vw,3.2rem)}
@media(max-width:1100px){.template-tile-content{padding:16px}.tile-actions{grid-template-columns:1fr 1fr}.template-tile-content>p{min-height:60px}.management-plans{grid-template-columns:repeat(3,minmax(0,1fr))}.plan-legend{text-align:right}}
@media(max-width:850px){.templates-page .templates-collection{min-height:0;padding-top:130px}.template-catalog{grid-template-columns:1fr}.template-tile{display:flex;flex-direction:row}.tile-screenshot{width:44%;height:auto;min-height:240px}.template-tile-content{width:56%;padding:19px}.template-tile-content>p{min-height:0}.template-showroom,.template-customize,.template-plans{min-height:0}.showroom-price-label{display:block;text-align:right}.management-plans{grid-template-columns:1fr 1fr}.template-launch-inline{flex-wrap:wrap}}
@media(max-width:650px){.templates-page .templates-collection{padding-top:115px;padding-bottom:45px}.templates-page .template-section-top{margin-bottom:24px}.catalog-heading-row{align-items:start;flex-direction:column}.templates-page .template-section-top h1{font-size:2.45rem}.template-catalog{gap:15px}.template-tile{display:flex;flex-direction:column}.tile-screenshot{width:100%;height:210px;min-height:0}.template-tile-content{width:100%;min-height:0;padding:17px 18px}.template-tile-content>p{min-height:0}.template-showroom,.template-customize,.template-plans{padding-top:47px;padding-bottom:50px}.showroom-intro{align-items:start;flex-direction:column;gap:8px}.showroom-intro h2{font-size:2rem}.showroom-price-label{text-align:left}.showroom-template-switch{gap:6px}.showroom-template-button{font-size:.62rem;padding:8px 10px}.showroom-toolbar{gap:12px;padding:10px}.showroom-current{flex-basis:100%}.preview-stage{padding:8px}.preview-stage[data-device=mobile] .preview-viewport{height:380px;width:min(280px,100%);min-height:280px}.showroom-bottom{flex-direction:column;align-items:start}.showroom-bottom .button{width:100%}.customize-layout{gap:24px}.customize-list{grid-template-columns:1fr 1fr}.customize-list>div{padding:15px 12px;min-height:140px}.template-plans .plan-header{align-items:start;gap:10px;margin-bottom:27px}.management-plans{grid-template-columns:1fr;gap:22px}.plan-audience{min-height:0}.template-launch-inline{align-items:start;flex-direction:column}.template-contact{padding-top:55px;padding-bottom:66px}}
@media(max-width:390px){.tile-actions{grid-template-columns:1fr}.showroom-template-button{padding:8px 7px;font-size:.58rem}.showroom-switch-glyph{width:15px;height:15px}.showroom-external{flex-basis:100%}.catalog-plan-link{font-size:.7rem}}
@media(hover:none){.preview-pill svg{max-width:16px;opacity:1;transform:none}.tile-screenshot:hover img{transform:none}}

/* v102 finishing pass: condensed contact form, no unnecessary full-height blanks */
@media (min-width:851px){
 .templates-page .templates-collection,.templates-page .template-showroom,.templates-page .template-customize,.templates-page .template-plans{min-height:0}
 .template-contact{padding:40px 0 55px}
 .template-contact-layout{gap:clamp(25px,5vw,60px);align-items:center}
 .template-contact-copy{position:static}
 .template-contact-copy>p{line-height:1.6}
 .template-contact-highlight{margin-top:20px;padding-top:17px}
 .template-contact-copy .template-inquiry-disclaimer{margin-top:18px}
 .template-project-form{padding:22px 27px}
 .template-project-form h3{font-size:1.33rem;margin:0 0 19px}
 .template-project-form .form-grid.two{gap:12px}
 .template-project-form .project-form>label,.template-project-form .form-grid label{gap:5px;margin-bottom:10px}
 .template-project-form>label,.template-project-form .form-grid label{margin-bottom:10px;gap:5px}
 .template-project-form input,.template-project-form select,.template-project-form textarea{padding:9px 11px;border-radius:8px}
 .template-project-form textarea{min-height:70px}
 .template-project-form .form-footer{margin-top:8px}
 .template-project-form .form-footer .button{min-height:45px}
 .template-project-form .form-status{margin-top:0}
}
@media (max-width:850px){.template-choice-row{grid-template-columns:1fr 1fr}}
@media (max-width:650px){.template-choice-row{grid-template-columns:1fr}.template-project-form textarea{min-height:105px}}

/* v108: Phone-only simplification. Desktop/tablet showroom and controls stay unchanged. */
.tile-actions .template-tile-mobile-preview{display:none}
@media (max-width:767px){
  .templates-page .template-showroom{display:none}
  .template-tile .tile-actions .template-tile-preview{display:none}
  .template-tile .tile-actions .template-tile-mobile-preview{
    display:inline-flex;align-items:center;justify-content:center;gap:5px;
    min-height:41px;padding:9px 8px;border-radius:30px;
    font:700 .66rem Montserrat,sans-serif;text-align:center;text-decoration:none;
    color:var(--brand-primary);background:#fff;border:1px solid var(--brand-primary);
    transition:background-color .2s,border-color .2s,color .2s;
  }
  .template-tile .tile-actions .template-tile-mobile-preview:hover{
    background:#eef4f7;border-color:var(--brand-primary);
  }
  .template-tile .tile-actions .template-tile-mobile-preview:focus-visible{
    outline:2px solid #00d9ff;outline-offset:3px;
  }
}
@media (prefers-reduced-motion:reduce){
  .template-tile .tile-actions .template-tile-mobile-preview{transition:none}
}

/* v109: Hide repeated Setup & Launch callouts in Ongoing Plans on phones only.
   The $995 Setup & Launch service, desktop layout, and inquiry data remain unchanged. */
@media (max-width:767px){
  .templates-page .template-plans .plan-legend,
  .templates-page .template-plans .template-launch-inline{display:none}
}

/* v110 — Bundled Content Care Requests instead of single-edit allowances. */
.templates-page .plan-update-count span{max-width:none}
.templates-page .plan-update-count span small{display:block;margin-top:3px;color:#58768a;font:500 .68rem/1.35 Inter,sans-serif}

/* v112 — KEYFORGE Locksmith: approved palette/typography and fourth design.
   Gallery is four equal columns on desktop; existing mobile presentation is preserved. */
.template-tile-keyforge{--brand-primary:#17242a;--brand-accent:#f0b429;--brand-tint:#f3f4f0}
.template-tile-keyforge .tile-title{font-family:'IBM Plex Sans Condensed',Montserrat,sans-serif;font-weight:700;text-transform:uppercase;letter-spacing:.025em;font-size:1.25rem}
.template-tile-keyforge .template-tile-content>p{font-family:'Public Sans',Inter,sans-serif;color:#68757a}
.template-tile-keyforge .template-tile-purchase:hover{color:#17242a}
.template-tile-keyforge .tile-screenshot:hover .preview-pill,.template-tile-keyforge .tile-screenshot:focus-visible .preview-pill{color:#17242a}
@media(min-width:1000px){
 .templates-page .template-catalog{grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
 .templates-page .template-tile-content{padding:17px 15px 18px;min-height:200px}
 .templates-page .template-tile .tile-title{font-size:1.05rem}
 .templates-page .template-tile-keyforge .tile-title{font-size:1.16rem}
 .templates-page .template-tile-content>p{font-size:.75rem;line-height:1.5;margin-bottom:12px;min-height:55px}
 .templates-page .tile-screenshot{height:clamp(170px,21vh,222px)}
 .templates-page .tile-actions{grid-template-columns:1fr 1fr}
 .templates-page .tile-actions button{font-size:.61rem;padding:8px 5px}
}
@media(min-width:851px) and (max-width:999px){
 .templates-page .template-catalog{grid-template-columns:repeat(2,minmax(0,1fr))}
 .templates-page .template-tile-content>p{min-height:0}
}


/* v113 — Give all four template designs breathing room on desktop.
   A balanced 2×2 editorial gallery replaces the cramped four-across row.
   Existing mobile-only actions and showroom behavior are unchanged. */
@media (min-width:1180px){
  .templates-page .templates-collection{
    padding-bottom:clamp(40px,5.4vh,65px);
  }
  .templates-page .template-section-top{
    margin-bottom:28px;
  }
  .templates-page .template-catalog{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:24px;
  }
  .templates-page .template-tile{
    display:grid;
    grid-template-columns:minmax(0,.94fr) minmax(0,1.06fr);
    min-height:258px;
    border-radius:19px;
  }
  .templates-page .tile-screenshot{
    width:100%;height:100%;min-height:258px;
  }
  .templates-page .template-tile-content{
    min-width:0;min-height:0;
    padding:25px 24px 23px;
    border-top:0;border-left:4px solid var(--brand-accent);
  }
  .templates-page .template-tile .tile-title{
    font-size:1.27rem;line-height:1.24;margin-bottom:12px;
  }
  .templates-page .template-tile-summit .tile-title{font-size:1.39rem}
  .templates-page .template-tile-keyforge .tile-title{font-size:1.38rem}
  .templates-page .template-tile-content>p{
    font-size:.83rem;line-height:1.65;min-height:0;
    margin-bottom:17px;
  }
  .templates-page .tile-actions{gap:9px}
  .templates-page .tile-actions button{
    font-size:.66rem;min-height:44px;padding:10px 8px;
  }
}
/* Medium desktops retain larger full-width screenshots and readable card copy. */
@media (min-width:851px) and (max-width:1179px){
  .templates-page .template-catalog{
    grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;
  }
  .templates-page .template-tile{min-height:0;border-radius:19px}
  .templates-page .tile-screenshot{height:clamp(195px,25vw,260px)}
  .templates-page .template-tile-content{
    min-height:178px;padding:22px 23px 23px;
  }
  .templates-page .template-tile .tile-title{font-size:1.24rem}
  .templates-page .template-tile-keyforge .tile-title{font-size:1.33rem}
  .templates-page .template-tile-content>p{
    min-height:0;font-size:.82rem;line-height:1.6;
  }
  .templates-page .tile-actions button{font-size:.68rem;min-height:44px;padding:9px 9px}
}
/* Preserve the compact full-gallery view on shorter desktop/laptop screens. */
@media (min-width:1180px) and (max-height:820px){
  .templates-page .template-section-top{margin-bottom:18px}
  .templates-page .template-catalog{gap:18px}
  .templates-page .template-tile{min-height:239px}
  .templates-page .tile-screenshot{min-height:239px}
  .templates-page .template-tile-content{padding:19px 21px 18px}
  .templates-page .template-tile .tile-title{margin-bottom:9px}
  .templates-page .template-tile-content>p{line-height:1.5;margin-bottom:12px}
}


/* v114 — shorter, uncropped desktop template previews. Keep phone layout untouched.
   Display the provided screenshots proportionally instead of zoom-cropping them. */
@media (min-width:851px){
  .templates-page .tile-screenshot{
    background:var(--brand-tint);
  }
  .templates-page .tile-screenshot img{
    object-fit:contain;
    object-position:center top;
  }
  .templates-page .tile-screenshot:hover img,
  .templates-page .tile-screenshot:focus-visible img{transform:none}
}
@media (min-width:1180px){
  .templates-page .template-tile{min-height:220px}
  .templates-page .tile-screenshot{height:220px;min-height:220px}
  .templates-page .template-tile-content{padding:17px 20px 17px}
  .templates-page .template-tile .tile-title{font-size:1.18rem;margin-bottom:8px}
  .templates-page .template-tile-summit .tile-title{font-size:1.28rem}
  .templates-page .template-tile-keyforge .tile-title{font-size:1.27rem}
  .templates-page .template-tile-content>p{font-size:.8rem;line-height:1.5;margin-bottom:11px}
  .templates-page .tile-actions button{min-height:40px;padding:8px 7px}
}
@media (min-width:1180px) and (max-height:820px){
  .templates-page .template-tile{min-height:212px}
  .templates-page .tile-screenshot{height:212px;min-height:212px}
  .templates-page .template-tile-content{padding:14px 18px}
}
@media (min-width:851px) and (max-width:1179px){
  .templates-page .tile-screenshot{height:clamp(180px,19vw,218px)}
}


/* v115 — Prevent template card action labels from wrapping at narrow desktop/tablet widths.
   Give the longer showroom label a little more room without changing the responsive card layout. */
.templates-page .tile-actions > .template-tile-preview,
.templates-page .tile-actions > .template-tile-purchase,
.templates-page .tile-actions > .template-tile-mobile-preview{
  white-space:nowrap;
}
@media (min-width:768px){
  .templates-page .tile-actions{
    grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);
  }
}


/* v116 — Connected, three-step template inquiry journey. */
.templates-page #template-gallery,.templates-page #template-plans,.templates-page #template-inquiry{scroll-margin-top:92px}
.templates-page .template-flow-nav{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-items:stretch;border:1px solid #dbe8f1;border-radius:12px;background:#f3f8fb;margin:0 0 20px;overflow:hidden}
.template-flow-link{display:flex;align-items:center;justify-content:center;gap:11px;padding:12px 10px;border-right:1px solid #dbe8f1;color:#587389;font:700 .73rem/1.25 Montserrat,sans-serif;min-width:0;text-align:center;transition:background .2s,color .2s}
.template-flow-link:last-child{border:0}.template-flow-link .flow-number{display:grid;place-items:center;width:27px;height:27px;flex:none;border:1px solid #bfd3df;border-radius:7px;color:#4e768b;font:700 .66rem Inter,sans-serif}
.template-flow-link.is-current{background:#e3f5f9;color:#093750}.template-flow-link.is-current .flow-number{background:#0b2545;color:#fff;border-color:#0b2545}
.template-flow-link.is-complete{color:#145876}.template-flow-link.is-complete .flow-number{background:#dbf4e9;border-color:#b0dec6;color:#17634c}
.template-flow-link:hover{background:#e7f3f8}.template-flow-link:focus-visible{outline:2px solid #00a3d0;outline-offset:-3px}
.catalog-plan-note{border:0;color:#678397;white-space:normal;text-align:right;font-weight:600}
.templates-page .template-section-top p strong{color:#0b2545}
.templates-page .template-tile.is-chosen{border-color:#167b9a;box-shadow:0 0 0 2px rgba(0,164,194,.19),0 10px 26px rgba(8,31,54,.11)}
.templates-page .template-tile.is-chosen .template-tile-purchase{background:#127391;border-color:#127391}
.templates-page .template-tile.is-chosen .template-tile-purchase:before{content:'✓ ';font-weight:800}
.templates-page .plan-select-button.is-chosen{color:#066e88;font-weight:800}
.templates-page .plan-select-button.is-chosen:before{content:'✓';color:#008a9e}
.templates-page .management-plan.is-chosen{border:2px solid #178fad;box-shadow:0 8px 28px rgba(0,114,145,.14);padding:25px 22px 17px}
.plan-flow-footer{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:17px 0 0;padding:12px 16px;background:#eaf5fa;border:1px solid #d0e6f0;border-radius:12px;font-size:.76rem;color:#426680}
.plan-flow-context{font-weight:600}.plan-unsure-button{cursor:pointer;border:0;background:transparent;color:#145274;font:700 .74rem/1.4 Montserrat,sans-serif;text-align:right}
.plan-unsure-button:hover{color:#008aaa}.plan-unsure-button.is-chosen{color:#008a97}
.launch-next-step{white-space:nowrap;font:700 .73rem Montserrat,sans-serif;color:#185f7b}
.template-package-prices{width:100%;display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:13px 0 17px}
.template-package-prices>div{display:flex;flex-direction:column;gap:1px;min-width:0}
.template-package-prices strong{font-size:clamp(1.6rem,2.7vw,2.6rem);letter-spacing:-.055em;line-height:1.3;overflow-wrap:anywhere}
.template-package-prices strong.template-monthly-price{font-size:clamp(1.05rem,2.1vw,1.6rem);letter-spacing:-.02em;line-height:1.5}
.template-package-choices{display:grid;gap:9px;width:100%;border-top:1px solid rgba(255,255,255,.16);padding:14px 0 18px}
.template-package-choices>div{display:flex;justify-content:space-between;gap:14px;align-items:baseline;font-size:.77rem}
.template-package-choices span{color:#99b6c7}.template-package-choices b{color:#fff;text-align:right;font-weight:650}
.templates-page .template-contact-highlight>small{display:block;margin-top:4px;max-width:400px}
@media(max-width:767px){
 .templates-page .template-flow-nav{margin-bottom:20px}
 .template-flow-link{flex-direction:column;gap:6px;font-size:.59rem;padding:9px 3px}
 .template-flow-link .flow-number{width:24px;height:24px;font-size:.6rem}
 .catalog-plan-note{display:none}
 .plan-flow-footer{align-items:flex-start;flex-direction:column;gap:10px}
 .plan-unsure-button{text-align:left}
 .template-package-prices{gap:8px}
 .template-package-choices>div{flex-direction:column;align-items:start;gap:3px}
 .template-package-choices b{text-align:left}
}
@media(prefers-reduced-motion:reduce){.template-flow-link{transition:none}}

@media(min-width:851px){
 .templates-page .templates-collection{padding-top:clamp(94px,10.5vh,120px);padding-bottom:30px;min-height:0}
 .templates-page .template-flow-nav{margin-bottom:12px}
 .templates-page .template-section-top{margin-bottom:14px}
}

@media(min-width:1180px) and (max-height:820px){
 .templates-page .templates-collection{padding-top:89px;padding-bottom:22px}
 .templates-page .template-flow-nav{margin-bottom:8px}
 .templates-page .template-section-top{margin-bottom:10px}
 .templates-page .template-tile{min-height:205px}
 .templates-page .tile-screenshot{height:205px;min-height:205px}
}

/* v117 — Streamlined choose design, plan and inquiry flow. */
.templates-page #template-gallery,.templates-page #template-plans,.templates-page #template-inquiry{scroll-margin-top:92px}
.templates-page .template-section-top{margin-bottom:20px}
.templates-page .template-catalog{margin-bottom:0}
.templates-page .gallery-customize-note{margin:17px 0 0;padding:13px 18px;background:#f1f7fa;border-left:3px solid #00aacb;border-radius:0 10px 10px 0;color:#426176;font-size:.77rem;line-height:1.55}
.templates-page .gallery-customize-note strong{color:#0b2545}
.templates-page .tile-actions>.template-tile-preview{display:inline-flex;align-items:center;justify-content:center;gap:5px;min-height:40px;padding:8px 7px;border-radius:40px;font:700 .66rem/1.3 Montserrat,sans-serif;white-space:nowrap;text-decoration:none;text-align:center;color:var(--brand-primary);background:transparent;border:1px solid var(--brand-primary);transition:background .2s,color .2s}
.templates-page .tile-actions>.template-tile-preview:hover{background:var(--brand-primary);color:#fff}
.templates-page .tile-actions>.template-tile-preview:focus-visible{outline:2px solid #00cbe5;outline-offset:3px}
.templates-page .tile-actions{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.templates-page .template-form-selection{background:#eff7fa;border:1px solid #d5e7ef;border-radius:13px;display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:12px;margin:0 0 17px}
.template-form-selection>div{display:grid;grid-template-columns:1fr auto;align-items:start;gap:4px 8px;min-width:0}
.template-form-selection>div>span{font:600 .63rem Inter,sans-serif;color:#597c90;grid-column:1}
.template-form-selection>div>strong{grid-column:1;min-width:0;font:700 .75rem/1.35 Montserrat,sans-serif;color:#0c334d;overflow-wrap:anywhere}
.template-form-selection>div>a{grid-column:2;grid-row:1 / 3;font:700 .68rem Montserrat,sans-serif;color:#006e8f;text-decoration:underline;text-underline-offset:3px;white-space:nowrap}
.template-form-selection>div>a:hover{color:#014660}
.templates-page .plan-header{margin-bottom:22px}
.templates-page .template-plans{padding-top:clamp(38px,5vh,60px);padding-bottom:clamp(38px,5vh,60px)}
.templates-page .plan-flow-footer{margin-bottom:10px}
.templates-page .template-contact-highlight{margin-top:15px}
.templates-page .template-contact-copy h2{margin-bottom:14px}
.templates-page .template-project-form .form-grid label{margin-bottom:11px}
@media(max-width:767px){
 .templates-page .tile-actions>.template-tile-preview{display:inline-flex}
 .templates-page .template-plans{padding-top:43px;padding-bottom:46px}
 .templates-page .gallery-customize-note{font-size:.76rem;margin-top:17px}
 .templates-page .template-form-selection{grid-template-columns:1fr;gap:13px}
 .templates-page .template-form-selection>div+div{border-top:1px solid #d2e4ed;padding-top:12px}
}
@media(min-width:851px) and (max-height:820px){.templates-page .templates-collection{padding-top:94px;padding-bottom:28px}}

/* v118 — Website Designs spacing & customization note alignment.
   Keep note in the same .container as the heading and template cards. */
.templates-page .gallery-customize-note{
  box-sizing:border-box;
  width:100%;
  max-width:100%;
  margin:21px 0 0;
  padding:15px 20px;
  border-radius:12px;
  line-height:1.6;
}
@media (min-width:851px){
  .templates-page .templates-collection{
    padding-top:clamp(122px,13vh,145px);
    padding-bottom:clamp(48px,6.5vh,72px);
  }
}
@media (min-width:851px) and (max-height:820px){
  .templates-page .templates-collection{padding-top:122px;padding-bottom:44px}
}
@media (max-width:850px){
  .templates-page .templates-collection{padding-bottom:62px}
}
@media (max-width:650px){
  .templates-page .templates-collection{padding-top:115px;padding-bottom:58px}
  .templates-page .gallery-customize-note{padding:16px 18px;margin-top:20px}
}

/* v119 — Consistent typography rhythm, inner spacing, and CTA alignment for
   all four "Choose your look" cards. Brand palettes and headline fonts stay. */
.templates-page .template-tile-content{
  box-sizing:border-box;
  display:grid;
  grid-template-rows:minmax(2.75rem,auto) minmax(0,1fr) auto;
  align-content:stretch;
  min-width:0;
  column-gap:0;
}
.templates-page .template-tile .tile-title,
.templates-page .template-tile-summit .tile-title,
.templates-page .template-tile-keyforge .tile-title{
  margin:0;
  font-size:1.16rem;
  line-height:1.24;
  align-self:start;
}
.templates-page .template-tile-content > p,
.templates-page .template-tile-keyforge .template-tile-content > p{
  margin:0;
  min-height:0;
  align-self:start;
  font-family:Inter, sans-serif;
  font-size:.79rem;
  font-weight:400;
  line-height:1.52;
  letter-spacing:0;
  color:#486276;
}
.templates-page .template-tile .tile-actions{
  align-self:end;
  align-items:stretch;
  margin:11px 0 0;
  gap:9px;
}
.templates-page .tile-actions > .template-tile-preview,
.templates-page .tile-actions > .template-tile-purchase{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:42px;
  min-width:0;
  padding:8px 9px;
  border-radius:999px;
  font:700 .65rem/1.2 Montserrat,sans-serif;
  gap:5px;
  white-space:nowrap;
  text-align:center;
}
/* Split desktop cards need identical top/title/padding and bottom button rows. */
@media (min-width:1180px){
  .templates-page .template-tile-content{padding:16px 19px}
}
/* On phones, don't reserve unused height above short card descriptions. */
@media (max-width:650px){
  .templates-page .template-tile-content{
    grid-template-rows:auto auto auto;
    row-gap:0;
    padding:18px 19px 19px;
  }
  .templates-page .template-tile .tile-title,
  .templates-page .template-tile-summit .tile-title,
  .templates-page .template-tile-keyforge .tile-title{
    font-size:1.16rem;
    margin-bottom:8px;
  }
  .templates-page .template-tile-content > p,
  .templates-page .template-tile-keyforge .template-tile-content > p{
    font-size:.79rem;
    line-height:1.55;
  }
  .templates-page .template-tile .tile-actions{margin-top:15px}
}

/* v120 — stable, font-independent SVG CTA arrows (including iOS Safari). */
.templates-page .template-action-arrow{
  display:block;
  width:14px;
  height:14px;
  flex:0 0 14px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.9;
  stroke-linecap:round;
  stroke-linejoin:round;
  pointer-events:none;
}
.templates-page .tile-actions .template-action-arrow{width:13px;height:13px;flex-basis:13px}

/* v121 — single-number monthly edit allowances and scalable Pro label */
.templates-page .plan-update-count{min-height:74px;align-items:center;}
.templates-page .plan-update-count strong.plan-edit-unlimited{font:800 clamp(1.15rem,1.6vw,1.42rem)/1.12 Montserrat,sans-serif;letter-spacing:-.035em;overflow-wrap:normal;flex-shrink:0;}
.templates-page .plan-update-count span{min-width:0;}
.templates-page .plan-update-note{max-width:100%;line-height:1.65;}
@media(max-width:1100px){.templates-page .plan-update-count strong.plan-edit-unlimited{font-size:1.15rem}}
@media(max-width:650px){.templates-page .plan-update-count strong.plan-edit-unlimited{font-size:1.35rem}}
/* Keep the selected step headings clear of the fixed site navigation. */
.templates-page #template-plans,
.templates-page #template-inquiry{scroll-margin-top:110px;}
@media(max-width:767px){
  .templates-page #template-plans,
  .templates-page #template-inquiry{scroll-margin-top:88px;}
}


/* v123 — A quieter personalization note keeps the template previews as the focus. */
.templates-page .catalog-heading-row{
  display:grid;grid-template-columns:minmax(0,.93fr) minmax(0,1.07fr);
  align-items:center;gap:clamp(22px,3vw,43px);
}
.templates-page .catalog-heading-row .catalog-intro{min-width:0}
.templates-page .catalog-adapt-card{
  display:grid;grid-template-columns:34px minmax(0,1fr);align-items:start;gap:13px;
  min-width:0;padding:clamp(16px,1.7vw,21px) clamp(18px,2vw,24px);
  background:linear-gradient(110deg,#f0f7fa 0%,#f8fbfd 100%);
  border:1px solid #dce9ef;border-left:3px solid #5cc6d6;
  border-radius:14px;color:#0b2545;box-shadow:none;
}
.templates-page .catalog-adapt-mark{
  display:grid;place-items:center;width:34px;height:34px;
  border:1px solid #c7e0e8;border-radius:9px;background:#e6f3f7;color:#3b7289;
}
.templates-page .catalog-adapt-mark svg{display:block;width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round}
.templates-page .catalog-adapt-card h2{
  font:750 clamp(1.18rem,1.65vw,1.42rem)/1.18 Montserrat,sans-serif;
  letter-spacing:-.035em;margin:0 0 6px;color:#0b2545;
}
.templates-page .catalog-adapt-card p{font-size:.78rem;line-height:1.57;color:#526c80;margin:0;max-width:none}
.templates-page .catalog-adapt-card p strong{color:#0b2545;font-weight:700}
@media(max-width:950px){
 .templates-page .catalog-heading-row{grid-template-columns:1fr;gap:17px;align-items:start}
 .templates-page .catalog-adapt-card{max-width:none}
}
@media(max-width:650px){
 .templates-page .catalog-adapt-card{grid-template-columns:30px minmax(0,1fr);padding:16px 15px;gap:11px}
 .templates-page .catalog-adapt-mark{width:30px;height:30px}
 .templates-page .catalog-adapt-mark svg{width:18px;height:18px}
 .templates-page .catalog-adapt-card h2{font-size:1.2rem}
 .templates-page .catalog-adapt-card p{font-size:.78rem}
}
@media (min-width:1180px) and (max-height:820px){
  /* Keep all four example designs visible within shorter desktop viewports. */
  .templates-page .templates-collection{padding-bottom:20px}
}

/* v126 — Optional design and Content Care selections within inquiry form. */
.templates-page .template-form-selection > div{grid-template-columns:minmax(0,1fr) auto;gap:7px 10px;align-items:center}
.templates-page .template-form-selection > div > label{
  grid-column:1;grid-row:1;margin:0;padding:0;
  font:600 .67rem/1.35 Montserrat,sans-serif;color:#45697f;
}
.templates-page .template-form-selection > div > a{
  grid-column:2;grid-row:1;font:700 .66rem Montserrat,sans-serif;
}
.templates-page .template-form-selection > div > select{
  grid-column:1/-1;grid-row:2;width:100%;min-width:0;min-height:41px;
  border:1px solid #bcd2de;border-radius:9px;background:#fff;
  color:#0b2545;padding:9px 34px 9px 11px;
  font:600 .76rem/1.3 Montserrat,sans-serif;
  cursor:pointer;
}
.templates-page .template-form-selection > div > select:focus-visible{
  outline:2px solid #009bb9;outline-offset:2px;
}
.templates-page .template-form-selection .template-selection-note{
  grid-column:1/-1;margin:1px 0 0;
  font:500 .67rem/1.5 Inter,sans-serif;color:#597c90;
}