/* Shutterfly Portfolio – κάρτες + σελίδα ιστορίας (mobile-first) */

/* ---- Κάρτες ---- */
.sfs-grid{--cols:2;--gx:14px;display:flex;flex-wrap:wrap;justify-content:center;gap:26px var(--gx);margin:0;padding:0}
.sfs-grid>.sfs-card{flex:0 0 calc((100% - (var(--cols) - 1) * var(--gx)) / var(--cols));min-width:0}
.sfs-card{display:block;text-decoration:none;color:var(--sfs-ink,#1A1917)}
.sfs-img{display:block;aspect-ratio:4/5;overflow:hidden;background:var(--sfs-panel,#E6E1D8)}
.sfs-img img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .6s ease}
.sfs-ph{display:block;width:100%;height:100%}
.sfs-t{display:block;margin-top:10px;font-family:var(--sfs-serif,Georgia,serif);font-size:1.1rem;line-height:1.25}
.sfs-p{display:block;margin-top:4px;font-family:var(--sfs-sans,system-ui,sans-serif);font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--sfs-sand,#7A5F3C)}
.sfs-empty{text-align:center;color:var(--sfs-muted,#5B554B)}
@media (hover:hover){a.sfs-card:hover .sfs-img img{transform:scale(1.03)}}
@media (min-width:900px){
  .sfs-grid{--gx:28px;gap:48px var(--gx)}
  .sfs-cols-3{--cols:3}
  .sfs-cols-4{--cols:4}
  .sfs-t{font-size:1.3rem}
}

/* ---- Σελίδα ιστορίας ---- */
.sfs-single{padding-bottom:40px;color:var(--sfs-ink,#1A1917)}
.sfs-wrap{width:100%;max-width:1180px;margin:0 auto;padding:0 20px;box-sizing:border-box}
.sfs-narrow{max-width:720px}
.sfs-head{padding-top:40px;padding-bottom:24px;text-align:center}
.sfs-eyebrow{margin:0 0 12px;font-family:var(--sfs-sans,system-ui,sans-serif);font-size:.75rem;letter-spacing:.16em;text-transform:uppercase;color:var(--sfs-sand,#7A5F3C)}
.sfs-single h1{margin:0;padding:0;font-family:var(--sfs-serif,Georgia,serif);font-weight:400;font-size:clamp(2rem,6vw,3.2rem);line-height:1.15}
.sfs-herowrap{text-align:center}
.sfs-hero{display:inline-block;width:auto;max-width:100%;height:auto;max-height:85vh}
.sfs-text{margin-top:32px;font-family:var(--sfs-sans,system-ui,sans-serif);line-height:1.7}
.sfs-filmwrap{margin-top:40px}
.sfs-film{position:relative;aspect-ratio:16/9;background:#000}
.sfs-film iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.sfs-gallery{margin-top:40px}
.sfs-gallery figure{margin:0 0 12px}
.sfs-gallery img{display:block;width:100%;height:auto}
.sfs-cta{margin-top:56px;padding:56px 20px 8px;text-align:center;border-top:1px solid var(--sfs-panel,#E6E1D8)}
.sfs-cta h2{margin:0 0 18px;font-family:var(--sfs-serif,Georgia,serif);font-weight:400;font-size:clamp(1.6rem,4.5vw,2.2rem)}
.sfs-btn{display:inline-block;padding:14px 30px;background:var(--sfs-ink,#1A1917);color:var(--sfs-ivory,#F7F5F1);border:1px solid var(--sfs-ink,#1A1917);border-radius:2px;font-family:var(--sfs-sans,system-ui,sans-serif);font-size:.9rem;letter-spacing:.04em;text-decoration:none}
.sfs-btn:hover{background:var(--sfs-sand,#7A5F3C);border-color:var(--sfs-sand,#7A5F3C);color:#fff}
.sfs-back{font-family:var(--sfs-sans,system-ui,sans-serif);font-size:.85rem;color:var(--sfs-sand,#7A5F3C)}
@media (min-width:900px){
  .sfs-wrap{padding:0 40px}
  .sfs-gallery{column-count:2;column-gap:14px}
  .sfs-gallery figure{break-inside:avoid;margin-bottom:14px}
}
@media (prefers-reduced-motion:reduce){.sfs-img img{transition:none}}

/* ---- Μενού κατηγοριών [sfs_tabs] ---- */
.sfs-tabs{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:6px 18px;margin:0 0 36px;padding:8px 0;font-family:var(--sfs-serif,Georgia,serif);font-size:.95rem;letter-spacing:.14em;text-transform:uppercase}
.sfs-tabs a{padding:10px 2px;color:var(--sfs-ink,#1A1917);text-decoration:none;border-bottom:1px solid transparent}
.sfs-tabs a:hover,.sfs-tabs a.is-active{color:var(--sfs-sand,#7A5F3C);border-bottom-color:var(--sfs-sand,#7A5F3C)}
.sfs-tabs span{color:#CFC8BB}
@media (max-width:420px){.sfs-tabs{gap:6px 12px;font-size:.8rem;letter-spacing:.1em}}

/* ---- Load more ---- */
.sfs-more-wrap{margin:48px 0 0;text-align:center}
.sfs-more{display:inline-block;padding:14px 36px;background:transparent;color:var(--sfs-ink,#1A1917);border:1px solid var(--sfs-ink,#1A1917);border-radius:2px;font-family:var(--sfs-sans,system-ui,sans-serif);font-size:.9rem;letter-spacing:.04em;cursor:pointer}
.sfs-more:hover{background:var(--sfs-sand,#7A5F3C);border-color:var(--sfs-sand,#7A5F3C);color:#fff}
.sfs-more[disabled]{opacity:.5;cursor:default}
