.catalog-page{background:var(--background)}
.catalog-header{height:72px;width:min(1400px,calc(100% - 64px));margin:0 auto;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between}
.catalog-header nav{display:flex;align-items:center;gap:28px;font-size:13px;font-weight:650}
.catalog-header nav>a:not(.catalog-contact){color:#414141}
.catalog-header nav>a:not(.catalog-contact):hover{color:var(--primary-ink)}
.catalog-contact{min-height:42px;padding:0 15px}

.catalog-hero{width:min(1400px,calc(100% - 64px));min-height:470px;margin:0 auto;padding:78px 0 70px;display:grid;grid-template-columns:minmax(0,1fr) 290px;align-items:end;gap:80px}
.catalog-eyebrow{margin-bottom:24px;color:var(--primary-ink);font-family:var(--mono);font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.11em}
.catalog-hero-copy h1{max-width:950px;font-size:clamp(56px,6.8vw,96px);line-height:1.1;letter-spacing:-.025em;font-weight:680}
.catalog-hero-copy h1 em{display:inline-block;padding-bottom:.06em;color:var(--primary-ink);font-family:inherit;font-style:italic;font-weight:570;line-height:1.08}
.catalog-hero-copy>p:last-child{max-width:620px;margin-top:28px;color:var(--muted);font-size:17px;line-height:1.6}
.catalog-stat{min-height:270px;border:1px solid #DBC4B9;border-radius:var(--radius-card);overflow:hidden;position:relative;isolation:isolate;color:var(--white);background:var(--dark);box-shadow:0 24px 64px rgba(36,36,36,.17)}
.catalog-stat::after{content:"";position:absolute;inset:0;z-index:1;background:rgba(36,36,36,.72);pointer-events:none}
.catalog-stat>img{width:100%;height:100%;position:absolute;inset:0;object-fit:cover;will-change:transform}
.catalog-stat>div{height:100%;padding:30px;position:relative;z-index:2;display:flex;flex-direction:column;justify-content:flex-end}
.catalog-stat strong{color:var(--accent);font-size:78px;line-height:.92;letter-spacing:-.02em}
.catalog-stat span{margin-top:18px;font-size:16px;font-weight:680}
.catalog-stat i{margin-top:9px;color:#CEC7C2;font-family:var(--mono);font-size:11px;font-style:normal}

.catalog-shell{width:min(1400px,calc(100% - 64px));margin:0 auto 130px}
.catalog-filter{padding:12px;border:1px solid var(--line);border-radius:var(--radius-card);position:sticky;top:12px;z-index:20;display:grid;grid-template-columns:210px minmax(0,1fr);align-items:center;gap:14px;background:rgba(248,250,252,.94);box-shadow:0 14px 38px rgba(68,42,30,.09);backdrop-filter:blur(18px)}
.category-heading{padding:2px 14px 2px 4px;display:flex;flex-direction:column;gap:3px}
.category-heading p{font-size:13px;font-weight:750;letter-spacing:-.015em}
.category-heading span{color:var(--muted);font-size:10px}
.category-list{min-width:0;display:flex;align-items:center;gap:7px;overflow-x:auto;scrollbar-width:none;overscroll-behavior-inline:contain}
.category-list::-webkit-scrollbar{display:none}
.category-button{min-width:max-content;min-height:46px;padding:7px 9px 7px 14px;border:1px solid var(--line);border-radius:var(--radius-control);display:flex;align-items:center;justify-content:center;gap:10px;color:#414141;background:var(--white);transition:color .2s,background .2s,border-color .2s,transform .2s}
.category-button:hover{border-color:#DBC4B9;background:var(--surface-brand);transform:translateY(-1px)}
.category-button.active{color:var(--white);border-color:var(--primary);background:var(--primary)}
.category-button strong{font-size:12px;font-weight:680}
.category-button span{min-width:25px;height:25px;padding:0 7px;border-radius:6px;display:grid;place-items:center;color:inherit;background:var(--surface);font-size:10px;font-weight:720;line-height:1;white-space:nowrap}
.category-button.active span{color:var(--primary-ink);background:var(--white);opacity:1}
.catalog-results{margin-top:22px}

.catalog-toolbar{min-height:108px;padding:20px 0;border-top:1px solid var(--dark);border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:30px}
.catalog-kicker{margin-bottom:5px;color:var(--primary-ink);font-family:var(--mono);font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.1em}
.catalog-toolbar h2{font-size:31px;line-height:1.12;letter-spacing:-.02em}
.catalog-toolbar>div>p:last-child{margin-top:8px;color:var(--muted);font-size:12px}
.catalog-search{width:min(390px,46%);height:48px;padding:0 13px;border:1px solid var(--line-strong);border-radius:var(--radius-control);background:var(--white);display:flex;align-items:center;gap:10px}
.catalog-search b{color:var(--primary-ink);font-size:19px;font-weight:500}
.catalog-search input{width:100%;min-width:0;border:0;outline:0;color:var(--dark);background:transparent;font-size:13px}
.catalog-search input::placeholder{color:#6B6662}
.catalog-search kbd{padding:3px 6px;border:1px solid var(--line);border-radius:4px;color:var(--muted);background:var(--surface);font:10px var(--mono)}
.active-filter{min-height:50px;padding:14px 0;color:var(--muted);font-size:12px}
.active-filter strong{color:var(--dark)}

.template-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:50px 22px}
.template-card{min-width:0}
.template-preview-link{width:100%;padding:0;border:0;display:block;text-align:inherit;background:transparent}
.template-preview-trigger{cursor:zoom-in}
.template-preview{aspect-ratio:1.55;border:1px solid var(--line);border-radius:var(--radius-card);overflow:hidden;position:relative;background:var(--surface-brand);transition:transform .45s var(--ease),box-shadow .45s,border-color .45s}
.template-preview.is-live{padding:15px;background:#FFF0E8 url('/assets/luminous-preview-stage-v3.webp') center/cover no-repeat;border-color:#DBC4B9;box-shadow:0 18px 45px rgba(36,36,36,.12)}
.template-preview.is-live::after{content:"";position:absolute;inset:7px;border:1px solid rgba(255,154,108,.2);border-radius:12px;pointer-events:none}
.template-card:hover .template-preview{border-color:#D9A78E;box-shadow:0 24px 54px rgba(255,107,44,.16)}
.live-site-shot{width:100%;height:100%;border-radius:10px;object-fit:cover;object-position:top center;position:relative;z-index:1;background:var(--white);box-shadow:0 16px 38px rgba(2,9,20,.32)}
.concept-preview{height:100%;padding:28px;position:relative;overflow:hidden;display:flex;flex-direction:column;align-items:flex-start;color:var(--preview-ink);background:var(--preview-bg)}
.concept-preview::before{content:"";width:54%;aspect-ratio:1;border-radius:50%;position:absolute;right:-12%;top:-34%;background:rgba(255,107,44,.12);box-shadow:0 0 0 28px rgba(255,107,44,.06),0 0 0 56px rgba(255,107,44,.035)}
.concept-preview::after{content:"";width:38%;height:3px;position:absolute;left:28px;bottom:28px;background:var(--primary)}
.concept-preview span{font-family:var(--mono);font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.1em}
.concept-preview strong{max-width:76%;margin-top:auto;font-size:clamp(27px,3vw,46px);line-height:1.08;letter-spacing:-.025em;position:relative;z-index:1}
.concept-preview small{margin-top:14px;color:var(--muted);font-size:12px}
.template-meta{padding-top:17px;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:20px;align-items:end}
.template-state{margin-bottom:6px;color:var(--primary-ink)!important;font-family:var(--mono);font-size:10px!important;font-weight:700;text-transform:uppercase;letter-spacing:.07em}
.template-meta h3{margin:0 0 5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:20px;letter-spacing:-.015em}
.template-meta p{color:var(--muted);font-size:12px}
.template-price{font-family:var(--mono);font-size:12px;white-space:nowrap}
.template-actions{margin-top:14px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.template-actions .template-action:only-child{grid-column:1/-1}
.template-action{min-height:44px;padding:0 13px;border:1px solid var(--line-strong);border-radius:var(--radius-control);display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:720;white-space:nowrap;transition:transform .2s,border-color .2s,background .2s}
.template-action:hover{border-color:var(--primary);transform:translateY(-1px)}
.template-action.live{color:var(--white);background:var(--primary);border-color:var(--primary)}

.load-more-wrap{padding-top:60px;text-align:center}
.load-more{min-height:48px;padding:0 22px;border:1px solid var(--line-strong);border-radius:var(--radius-control);color:var(--dark);background:var(--white);font-size:13px;font-weight:720;cursor:pointer}
.load-more:hover{color:var(--white);background:var(--primary);border-color:var(--primary)}
.load-more span{margin-left:18px}
.empty-state{padding:90px 20px;text-align:center;border-bottom:1px solid var(--line)}
.empty-state>span{color:var(--primary-ink);font-size:34px}
.empty-state h3{margin-top:20px;font-size:26px}
.empty-state p{margin-top:9px;color:var(--muted);font-size:14px}
.empty-state .button{margin-top:22px}

.catalog-bottom{width:min(1400px,calc(100% - 64px));margin:0 auto 32px;padding:52px;border-radius:var(--radius-card);color:var(--white);background:var(--primary)}
.catalog-bottom>p{color:#FBE2D6;font-family:var(--mono);font-size:11px;text-transform:uppercase;letter-spacing:.09em}
.catalog-bottom>div{margin-top:22px;display:flex;align-items:end;justify-content:space-between;gap:30px}
.catalog-bottom h2{font-size:clamp(40px,5vw,70px);line-height:1.08;letter-spacing:-.025em}
.circle-link{min-height:50px;padding:0 19px;border-radius:var(--radius-control);color:var(--primary-ink);background:var(--white);display:inline-flex;align-items:center;gap:28px;font-size:13px;font-weight:750;white-space:nowrap}
.catalog-footer{min-height:120px;width:min(1400px,calc(100% - 64px));margin:0 auto;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:30px;color:var(--muted);font-size:11px}
.catalog-footer>span{justify-self:end}

.template-modal{width:min(1240px,calc(100% - 32px));max-height:calc(100dvh - 32px);padding:0;border:0;border-radius:16px;color:var(--dark);background:var(--white);box-shadow:0 38px 110px rgba(36,36,36,.3);overflow:auto}
.template-modal::backdrop{background:rgba(36,36,36,.78);backdrop-filter:blur(8px)}
.template-modal-close{width:42px;height:42px;padding:0;border:1px solid var(--line);border-radius:50%;position:absolute;top:16px;right:16px;z-index:3;display:grid;place-items:center;color:var(--dark);background:var(--white);font-size:24px;line-height:1;cursor:pointer}
.template-modal-layout{min-height:620px;display:grid;grid-template-columns:minmax(0,1.55fr) minmax(310px,.45fr)}
.template-modal-stage{min-width:0;padding:34px;display:grid;place-items:center;background:var(--surface-brand)}
.template-modal-stage img{width:100%;height:auto;max-height:76dvh;border:1px solid var(--line-strong);border-radius:10px;object-fit:contain;background:var(--white);box-shadow:0 22px 58px rgba(36,36,36,.16)}
.template-modal-copy{padding:64px 38px 38px;display:flex;flex-direction:column;align-items:flex-start}
.template-modal-kicker{color:var(--primary-ink);font-family:var(--mono);font-size:10px;font-weight:750;letter-spacing:.1em;text-transform:uppercase}
.template-modal-copy h2{margin-top:22px;font-size:clamp(38px,4vw,58px);line-height:1.08;letter-spacing:-.025em}
.template-modal-copy>p:not(.template-modal-kicker){margin-top:20px;color:var(--muted);font-size:14px;line-height:1.65}
.template-modal-copy>strong{margin-top:28px;font-family:var(--mono);font-size:18px}
.template-modal-copy>div{width:100%;margin-top:auto;padding-top:32px;display:grid;gap:10px}

@media(max-width:1080px){.catalog-filter{display:block}.category-heading{padding:2px 4px 10px;flex-direction:row;justify-content:space-between}.catalog-hero{grid-template-columns:1fr 220px;gap:50px}.catalog-stat{min-height:205px}.template-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}

@media(max-width:760px){
  .catalog-header,.catalog-hero,.catalog-shell,.catalog-bottom,.catalog-footer{width:calc(100% - 36px)}
  .catalog-header{height:66px}.catalog-header nav>a:not(.catalog-contact){display:none}.catalog-contact{min-height:42px}
  .catalog-hero{min-height:0;padding:58px 0 48px;display:block}.catalog-hero-copy h1{font-size:clamp(44px,13vw,61px)}.catalog-hero-copy>p:last-child{font-size:15px}.catalog-stat{min-height:240px;margin-top:34px}.catalog-stat>div{padding:24px}.catalog-stat strong{font-size:56px}.catalog-stat span{margin-top:12px}
  .catalog-shell{margin-bottom:88px}.catalog-filter{top:8px;margin:0 -8px;padding:10px;border-radius:12px}.category-heading{padding:0 4px 9px}.category-heading span{display:none}.category-list{gap:6px;scroll-snap-type:x proximity}.category-button{min-height:43px;padding:6px 8px 6px 12px;scroll-snap-align:start}.catalog-results{margin-top:18px}
  .catalog-toolbar{display:block}.catalog-search{width:100%;margin-top:20px}.template-grid{grid-template-columns:1fr;gap:42px}.template-preview{aspect-ratio:1.35}.concept-preview strong{font-size:34px}.template-meta{grid-template-columns:1fr;gap:10px}.template-price{font-size:13px}.template-action{min-height:46px}
  .catalog-bottom{margin-bottom:18px;padding:34px 28px}.catalog-bottom>div{display:block}.catalog-bottom h2{font-size:42px}.circle-link{margin-top:28px;width:100%;justify-content:space-between}
  .catalog-footer{padding:36px 0;display:block;text-align:center}.catalog-footer p{margin:22px 0}.catalog-footer>span{display:block}
  .template-modal{width:calc(100% - 20px);max-height:calc(100dvh - 20px)}.template-modal-layout{min-height:0;display:block}.template-modal-stage{padding:54px 12px 14px}.template-modal-stage img{max-height:none}.template-modal-copy{padding:26px 22px 24px}.template-modal-copy h2{margin-top:14px;font-size:38px}.template-modal-copy>p:not(.template-modal-kicker){margin-top:14px}.template-modal-copy>strong{margin-top:20px}.template-modal-copy>div{margin-top:26px;padding-top:0;grid-template-columns:1fr 1fr}.template-modal-copy .button{min-width:0;padding-inline:12px}
}



@media(prefers-reduced-motion:no-preference){
  .catalog-stat>img{animation:catalog-stage-drift 11s ease-in-out infinite alternate}
  .template-card:nth-child(-n+4) .template-preview.is-live .live-site-shot{animation:catalog-preview-drift 8s ease-in-out infinite alternate}
}
@keyframes catalog-stage-drift{0%{transform:scale(1.03) translate3d(-1%,0,0)}100%{transform:scale(1.11) translate3d(2%,-1%,0)}}
@keyframes catalog-preview-drift{0%{transform:scale(1.002) translateY(0)}100%{transform:scale(1.025) translateY(-1.5%)}}

@media(hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){.template-card:hover .template-preview{transform:translateY(-4px) scale(1.025)}}
@media(prefers-reduced-motion:no-preference){.template-card:focus-within .template-preview{transform:translateY(-4px) scale(1.025);border-color:#D9A78E;box-shadow:0 24px 54px rgba(255,107,44,.16)}}
@media(prefers-reduced-motion:reduce){.catalog-stat>img,.live-site-shot{animation:none!important}.template-card:hover .template-preview,.template-card:focus-within .template-preview{transform:none}}
