/* Supreme Gallery – front-end styles (all scoped to .smg) */
.smg{--smg-primary:#172554;--smg-accent:#0891b2;--smg-muted:#64748b;--smg-line:#e2e8f0;color:var(--smg-primary);line-height:1.5}
.smg,.smg *,.smg *::before,.smg *::after{box-sizing:border-box}
.smg a{text-decoration:none;box-shadow:none}
.smg img{display:block;max-width:none}
.smg-icon{flex:none;vertical-align:middle}

/* ---- headers ---- */
.smg-header{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:24px;margin:0 0 48px}
.smg-back{display:inline-flex;align-items:center;gap:8px;margin-bottom:16px;font-weight:600;color:var(--smg-muted);transition:color .2s}
.smg-back:hover,.smg-back:focus{color:var(--smg-accent)}
.smg-page-title{margin:0 0 32px;font-size:clamp(2rem,4vw,3rem);font-weight:900;letter-spacing:-.025em;line-height:1.1;color:var(--smg-primary)}
.smg-header .smg-page-title{margin:0}
.smg-album__meta{margin:8px 0 0;font-weight:500;color:var(--smg-muted)}
.smg-accent-warn{color:#d97706}
.smg-btn{display:inline-flex;align-items:center;gap:8px;padding:12px 24px;border-radius:12px;background:#f1f5f9;color:var(--smg-primary);font-weight:700;transition:background .2s}
.smg-btn:hover,.smg-btn:focus{background:#e2e8f0;color:var(--smg-primary)}

/* ---- category / album cards ---- */
.smg-grid{display:grid;gap:64px 48px;grid-template-columns:repeat(var(--smg-cols,3),minmax(0,1fr));padding:12px 12px 0}
@media (max-width:1024px){.smg-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){.smg-grid{grid-template-columns:minmax(0,1fr);gap:48px}}
.smg-card{display:block;color:inherit}
.smg-stack{position:relative;margin-bottom:32px}
.smg-layer{position:absolute;inset:0;overflow:hidden;border-radius:24px;background:#e2e8f0;box-shadow:0 1px 2px rgba(0,0,0,.08);transition:transform .5s}
.smg-layer img{width:100%;height:100%;object-fit:cover;filter:grayscale(1);transition:filter .4s}
.smg-layer:hover img{filter:none}
.smg-layer--3{transform:translate(12px,12px) rotate(6deg) scale(.95)}
.smg-layer--3 img{opacity:.5}
.smg-layer--2{transform:translate(-8px,-4px) rotate(-3deg)}
.smg-layer--2 img{opacity:.7}
.smg-card:hover .smg-layer--3,.smg-card:focus .smg-layer--3{transform:translate(24px,12px) rotate(12deg) scale(.95)}
.smg-card:hover .smg-layer--2,.smg-card:focus .smg-layer--2{transform:translate(-16px,-4px) rotate(-6deg)}
.smg-cover{position:relative;aspect-ratio:4/3;overflow:hidden;border:4px solid #fff;border-radius:24px;background:#f1f5f9;box-shadow:0 20px 25px -5px rgba(0,0,0,.12),0 8px 10px -6px rgba(0,0,0,.12);transition:transform .5s,box-shadow .5s}
.smg-card:hover .smg-cover,.smg-card:focus .smg-cover{transform:translateY(-12px);box-shadow:0 25px 50px -12px rgba(0,0,0,.3)}
.smg-cover img{width:100%;height:100%;object-fit:cover;transition:transform .7s}
.smg-card:hover .smg-cover img,.smg-card:focus .smg-cover img{transform:scale(1.1)}
.smg-cover__placeholder{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:#94a3b8;background:linear-gradient(135deg,#f1f5f9,#e2e8f0)}
.smg-badge{position:absolute;top:12px;left:12px;display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:999px;background:rgba(255,255,255,.92);color:#b45309;font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.smg-overlay{position:absolute;inset:0;background:linear-gradient(to top,rgba(23,37,84,.9),rgba(23,37,84,.2),transparent);opacity:0;transition:opacity .5s}
.smg-cta{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;opacity:0;transform:translateY(16px);transition:opacity .5s,transform .5s}
.smg-cta span{display:inline-flex;align-items:center;gap:8px;padding:12px 24px;border-radius:999px;background:#fff;color:var(--smg-primary);font-weight:700;letter-spacing:.02em;box-shadow:0 10px 15px -3px rgba(0,0,0,.2)}
.smg-card:hover .smg-overlay,.smg-card:hover .smg-cta,.smg-card:focus .smg-overlay,.smg-card:focus .smg-cta{opacity:1}
.smg-card:hover .smg-cta,.smg-card:focus .smg-cta{transform:none}
.smg-card__body{padding:0 16px;text-align:center}
.smg-card__title{margin:0;font-size:clamp(1.5rem,2.4vw,1.875rem);font-weight:900;letter-spacing:-.02em;line-height:1.2;color:var(--smg-primary);transition:color .3s}
.smg-card:hover .smg-card__title,.smg-card:focus .smg-card__title{color:var(--smg-accent)}
.smg-card__meta{margin-top:12px;font-size:.875rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#94a3b8}
@media (hover:none){.smg-cta,.smg-overlay{display:none}}

/* ---- masonry album ---- */
.smg-masonry{columns:1;column-gap:24px}
@media (min-width:640px){.smg-masonry{columns:2}}
@media (min-width:1024px){.smg-masonry{columns:3}}
@media (min-width:1280px){.smg-masonry{columns:4}}
.smg-item{position:relative;display:block;width:100%;margin:0 0 24px;overflow:hidden;break-inside:avoid;border:1px solid #f1f5f9;border-radius:16px;background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.06)}
.smg-zoom{display:block;overflow:hidden;cursor:zoom-in}
.smg-item img{width:100%;height:auto;transition:transform .5s}
.smg-item:hover img{transform:scale(1.05)}
.smg-actions{position:absolute;left:0;right:0;bottom:0;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px;background:linear-gradient(to top,rgba(0,0,0,.8),transparent);opacity:0;transition:opacity .3s;pointer-events:none}
.smg-actions>*{pointer-events:auto}
.smg-actions__left{display:flex;gap:8px}
.smg-item:hover .smg-actions,.smg-item:focus-within .smg-actions{opacity:1}
@media (hover:none){.smg-actions{opacity:1}}
.smg-round{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;padding:0;border:0;border-radius:50%;background:rgba(255,255,255,.2);color:#fff;box-shadow:0 0 0 1px rgba(255,255,255,.5),0 4px 6px rgba(0,0,0,.2);backdrop-filter:blur(4px);cursor:pointer;transition:background .2s,color .2s,transform .2s}
.smg-round:hover,.smg-round:focus{background:rgba(255,255,255,.4);color:#fff}
.smg-round:active{transform:scale(.92)}
.smg-round--solid{background:#fff;color:var(--smg-primary);box-shadow:0 4px 6px rgba(0,0,0,.2)}
.smg-round--solid:hover,.smg-round--solid:focus{background:var(--smg-accent);color:#fff}
.smg-heart.is-hearted{background:#f43f5e;box-shadow:0 4px 6px rgba(0,0,0,.2)}
.smg-heart.is-hearted:hover{background:#e11d48}
.smg-heart.is-hearted .smg-icon{fill:currentColor}
.smg-heart.is-busy{opacity:.6;pointer-events:none}

/* ---- empty + private states ---- */
.smg-empty{padding:48px 24px;text-align:center;border:1px solid #f1f5f9;border-radius:24px;background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.06)}
.smg-empty__icon{display:flex;align-items:center;justify-content:center;width:80px;height:80px;margin:0 auto 24px;border-radius:50%;background:#f8fafc;color:#cbd5e1}
.smg-empty h3{margin:0 0 8px;font-size:1.5rem;font-weight:700;color:var(--smg-primary)}
.smg-empty p{margin:0;color:var(--smg-muted)}
.smg-lock{max-width:448px;margin:48px auto;padding:40px;text-align:center;border:1px solid #f1f5f9;border-radius:24px;background:#fff;box-shadow:0 25px 50px -12px rgba(0,0,0,.25)}
.smg-lock__icon{display:flex;align-items:center;justify-content:center;width:80px;height:80px;margin:0 auto 24px;border:1px solid #fef3c7;border-radius:50%;background:#fffbeb;color:#f59e0b}
.smg-lock__title{margin:0 0 8px;font-size:1.875rem;font-weight:900;letter-spacing:-.02em;color:var(--smg-primary)}
.smg-lock__text{margin:0 0 24px;color:var(--smg-muted);font-weight:500}
.smg-lock .post-password-form p{margin:0 0 12px}
.smg-lock .post-password-form label{display:block;font-size:0}
.smg-lock .post-password-form input[type=password]{display:block;width:100%;padding:16px 24px;border:1px solid var(--smg-line);border-radius:12px;background:#f8fafc;color:#334155;font-size:1rem;font-weight:700;letter-spacing:.2em;text-align:center}
.smg-lock .post-password-form input[type=password]:focus{outline:0;border-color:var(--smg-accent)}
.smg-lock .post-password-form input[type=submit]{width:100%;padding:16px;border:0;border-radius:12px;background:var(--smg-primary);color:#fff;font-size:.875rem;font-weight:900;letter-spacing:.1em;text-transform:uppercase;cursor:pointer;transition:background .2s}
.smg-lock .post-password-form input[type=submit]:hover{background:var(--smg-accent)}

/* ---- feedback modal ---- */
.smg-modal{position:fixed;inset:0;z-index:100000;display:flex;align-items:center;justify-content:center;padding:16px;background:rgba(0,0,0,.6);backdrop-filter:blur(6px)}
.smg-modal[hidden]{display:none}
.smg-modal__box{width:100%;max-width:512px;overflow:hidden;border-radius:24px;background:#fff;box-shadow:0 25px 50px -12px rgba(0,0,0,.4)}
.smg-modal__head{display:flex;align-items:center;justify-content:space-between;padding:24px 32px;border-bottom:1px solid #f1f5f9}
.smg-modal__head h3{margin:0;font-size:1.5rem;font-weight:900;letter-spacing:-.02em;color:var(--smg-primary)}
.smg-modal__close{padding:4px;border:0;background:none;color:#94a3b8;cursor:pointer}
.smg-modal__close:hover{color:#475569}
.smg-modal__form{padding:32px}
.smg-modal__form label{display:block;margin:0 0 8px;font-size:.75rem;font-weight:900;letter-spacing:.1em;text-transform:uppercase;color:var(--smg-muted)}
.smg-modal__form input[type=text],.smg-modal__form textarea{display:block;width:100%;margin:0 0 24px;padding:12px 16px;border:1px solid var(--smg-line);border-radius:12px;background:#f8fafc;color:#334155;font:inherit;font-weight:500}
.smg-modal__form textarea{resize:none}
.smg-modal__form input:focus,.smg-modal__form textarea:focus{outline:0;border-color:var(--smg-accent)}
.smg-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.smg-modal__status{min-height:1.5em;margin:0 0 12px;font-size:.875rem;font-weight:600}
.smg-modal__status.is-ok{color:#15803d}
.smg-modal__status.is-error{color:#dc2626}
.smg-submit{width:100%;padding:16px;border:0;border-radius:12px;background:var(--smg-primary);color:#fff;font-size:.875rem;font-weight:900;letter-spacing:.1em;text-transform:uppercase;cursor:pointer;transition:background .2s}
.smg-submit:hover{background:var(--smg-accent)}
.smg-submit:disabled{opacity:.6;cursor:wait}
body.smg-noscroll{overflow:hidden}

/* ---- lightbox ---- */
.smg-lightbox{position:fixed;inset:0;z-index:100001;display:flex;align-items:center;justify-content:center;background:rgba(2,6,23,.94)}
.smg-lightbox img{max-width:92vw;max-height:88vh;width:auto;height:auto;object-fit:contain;border-radius:8px;box-shadow:0 25px 50px -12px rgba(0,0,0,.6)}
.smg-lb-btn{position:absolute;display:flex;align-items:center;justify-content:center;width:48px;height:48px;padding:0;border:0;border-radius:50%;background:rgba(255,255,255,.12);color:#fff;font-size:28px;line-height:1;cursor:pointer;transition:background .2s}
.smg-lb-btn:hover{background:rgba(255,255,255,.25)}
.smg-lb-close{top:16px;right:16px}
.smg-lb-prev{left:16px;top:50%;margin-top:-24px}
.smg-lb-next{right:16px;top:50%;margin-top:-24px}
.smg-lb-count{position:absolute;bottom:16px;left:0;right:0;text-align:center;color:rgba(255,255,255,.7);font-size:.875rem;font-weight:600}

/* ---- clean single-album page ---- */
.smg-page,.smg-portfolio,.smg-album{padding:var(--smg-pad-t,48px) var(--smg-pad-r,24px) var(--smg-pad-b,80px) var(--smg-pad-l,24px)}
.smg-page{width:100%}
.smg-page .smg-album{padding:0}
.smg-page__inner{max-width:1280px;margin:0 auto}
.smg-page__title{margin:0 0 24px;font-size:clamp(2rem,4vw,3rem);font-weight:900;letter-spacing:-.025em;line-height:1.1;color:var(--smg-primary,#172554)}

/* Fallback for themes that ignore the template: hide common theme extras on album pages */
body.smg-clean #secondary,
body.smg-clean .sidebar,
body.smg-clean .widget-area,
body.smg-clean .entry-meta,
body.smg-clean .post-meta,
body.smg-clean .entry-footer,
body.smg-clean .post-navigation,
body.smg-clean .comments-area,
body.smg-clean #comments,
body.smg-clean .related-posts,
body.smg-clean .related-post,
body.smg-clean .jp-relatedposts,
body.smg-clean .yarpp-related,
body.smg-clean .author-box{display:none!important}
body.smg-clean #primary,
body.smg-clean .content-area{float:none!important;width:100%!important;max-width:100%!important}

.smg-album__intro{max-width:760px;margin:-16px 0 40px;color:var(--smg-muted)}

/* ---- title banner ---- */
.smg-banner{box-sizing:border-box;width:100%;padding:36px 0;background:#2a4b7f;color:#fff}
.smg-banner--full{position:relative;width:100vw;max-width:100vw;margin-left:calc(50% - 50vw)}
.smg-banner__inner{max-width:1280px;margin:0 auto;padding:0 var(--smg-pad-r,24px) 0 var(--smg-pad-l,24px)}
.smg-banner__title{margin:0;font-size:clamp(1.75rem,3vw,2.4rem);font-weight:700;line-height:1.2;color:inherit}
