@keyframes syifa-float{0%,to{transform:translateY(0)}50%{transform:translateY(-8px)}}@keyframes syifa-marquee{to{transform:translate(-50%)}}@keyframes syifa-pulse-cta{0%{transform:scale(1);box-shadow:0 0 #9e6b4f8c}70%{transform:scale(1.025);box-shadow:0 0 0 14px #9e6b4f00}to{transform:scale(1);box-shadow:0 0 #9e6b4f00}}.syifa-portfolio-root{--bg:#faf7f2;--bg-card:#fff;--bg-subtle:#f4ece1;--bg-subtle-2:#ede3d5;--ink:#2b1d16;--ink-light:#6e5242;--ink-muted:#967866;--accent:#9e6b4f;--accent-soft:#ebdccb;--line:#6e52421a;--line-card:#6e524214;--shadow-sm:0 4px 18px #2b1d160a;--shadow-md:0 10px 28px #2b1d1612;--shadow-lg:0 18px 40px #2b1d1617;background:var(--bg);color:var(--ink);-webkit-font-smoothing:antialiased;width:100%;min-height:100vh;font-family:Figtree,system-ui,-apple-system,sans-serif;line-height:1.55;position:relative;overflow-x:hidden}html,body{box-sizing:border-box;background:#faf7f2;width:100%;margin:0;padding:0;overflow-x:hidden}*,:before,:after{box-sizing:border-box}.syifa-portfolio-root *{margin:0}html{scroll-behavior:smooth}.syifa-portfolio-root a{color:inherit;text-decoration:none}.syifa-portfolio-root :focus-visible{outline:2px solid var(--accent);outline-offset:3px}.syifa-portfolio-root .c{max-width:1040px;margin:auto;padding:0 5vw}.syifa-portfolio-root h1,.syifa-portfolio-root h2{font-family:Playfair Display,Georgia,serif}.syifa-portfolio-root h2{letter-spacing:-.3px;text-align:center;color:var(--ink);font-size:clamp(1.65rem,3.2vw,2.2rem);line-height:1.2}.syifa-portfolio-root .sub{text-align:center;color:var(--ink-light);max-width:48ch;margin:.35rem auto 1.85rem;font-size:.92rem}.syifa-portfolio-root .btn{background:var(--ink);color:#faf7f2;border:1px solid var(--ink);cursor:pointer;letter-spacing:.2px;border-radius:99px;justify-content:center;align-items:center;padding:10px 22px;font:600 .88rem Figtree,sans-serif;text-decoration:none;transition:transform .2s,background .2s,box-shadow .2s;display:inline-flex}.syifa-portfolio-root .btn:hover{background:#3e2a20;transform:translateY(-2px);box-shadow:0 6px 18px #2b1d161f}.syifa-portfolio-root .btn.out{background:var(--bg-card);color:var(--ink);border:1px solid var(--line);box-shadow:var(--shadow-sm)}.syifa-portfolio-root .btn.out:hover{background:var(--bg-subtle);border-color:var(--accent)}.syifa-portfolio-root .btn-inquire{color:#fff;cursor:pointer;letter-spacing:.2px;background:linear-gradient(135deg,#a87c5f,#7a523c);border:none;border-radius:99px;align-items:center;gap:.55rem;padding:11px 22px;font:600 .9rem Figtree,sans-serif;text-decoration:none;transition:transform .25s,box-shadow .25s;animation:2.2s infinite syifa-pulse-cta;display:inline-flex;box-shadow:0 6px 20px #7a523c47}.syifa-portfolio-root .btn-inquire:hover{animation:none;transform:translateY(-2px)scale(1.03);box-shadow:0 10px 28px #7a523c61}.syifa-portfolio-root .btn-inquire svg{fill:currentColor;width:17px;height:17px;transition:transform .3s}.syifa-portfolio-root .btn-inquire:hover svg{transform:rotate(8deg)scale(1.1)}.syifa-portfolio-root .navbar{z-index:999;-webkit-backdrop-filter:blur(16px);border-bottom:1px solid var(--line);background:#faf7f2f0;justify-content:space-between;align-items:center;padding:.85rem 5vw;transition:all .3s;display:flex;position:fixed;top:0;left:0;right:0}.syifa-portfolio-root .navbar .logo{color:var(--ink);letter-spacing:-.3px;font-family:Playfair Display,Georgia,serif;font-size:1.3rem;font-style:italic;font-weight:700;text-decoration:none}.syifa-portfolio-root .navbar .nav-links{align-items:center;gap:2rem;margin:0;padding:0;list-style:none;display:flex}.syifa-portfolio-root .navbar .nav-links a{color:var(--ink-light);padding:.25rem 0;font-size:.88rem;font-weight:500;text-decoration:none;transition:color .2s;position:relative}.syifa-portfolio-root .navbar .nav-links a:after{content:"";background:var(--accent);width:0;height:2px;transition:width .25s;position:absolute;bottom:0;left:0}.syifa-portfolio-root .navbar .nav-links a:hover{color:var(--ink)}.syifa-portfolio-root .navbar .nav-links a:hover:after{width:100%}.syifa-portfolio-root .nav-cta{background:var(--ink);color:#faf7f2;border-radius:99px;padding:7px 18px;font-size:.82rem;font-weight:600;text-decoration:none;transition:all .2s;display:inline-block}.syifa-portfolio-root .nav-cta:hover{background:#3e2a20;transform:translateY(-1px)}.syifa-portfolio-root .mobile-nav{-webkit-backdrop-filter:blur(20px);z-index:1000;background:#ffffffeb;border:1px solid #9e6b4f38;border-radius:99px;justify-content:space-around;align-items:center;width:90%;max-width:350px;padding:.55rem .85rem;transition:all .3s;display:flex;position:fixed;top:1rem;left:50%;transform:translate(-50%);box-shadow:0 10px 30px #2b1d1614}.syifa-portfolio-root .mobile-nav-item{color:var(--ink-light);border-radius:20px;flex-direction:column;align-items:center;gap:.2rem;padding:.2rem .5rem;font-size:.65rem;font-weight:500;text-decoration:none;transition:all .25s;display:flex;position:relative}.syifa-portfolio-root .mobile-nav-item svg{stroke:currentColor;stroke-width:1.8px;width:18px;height:18px;transition:transform .2s,stroke .2s}.syifa-portfolio-root .mobile-nav-item:hover,.syifa-portfolio-root .mobile-nav-item.active{color:var(--ink);font-weight:700}.syifa-portfolio-root .mobile-nav-item.active svg{stroke:var(--accent);transform:scale(1.1)}.syifa-portfolio-root #home{background:var(--bg);padding:85px 0 25px;position:relative;overflow:hidden}.syifa-portfolio-root #home .c{grid-template-columns:1.15fr .85fr;align-items:center;gap:28px;display:grid}.syifa-portfolio-root .fl{opacity:.45;pointer-events:none;user-select:none;font-size:1.25rem;animation:5s ease-in-out infinite syifa-float;position:absolute}.syifa-portfolio-root .hero-badge{color:var(--ink);letter-spacing:.3px;background:linear-gradient(135deg,#f4ece1,#ebdccb);border:1px solid #9e6b4f33;border-radius:99px;align-items:center;gap:6px;margin-bottom:6px;padding:5px 14px;font-size:.84rem;font-weight:600;display:inline-flex;box-shadow:0 2px 8px #2b1d160a}.syifa-portfolio-root .hi{color:var(--accent);letter-spacing:.5px;text-transform:uppercase;margin-bottom:4px;font-size:.95rem;font-weight:600}.syifa-portfolio-root #home h1{letter-spacing:-.6px;color:var(--ink);margin:2px 0 8px;font-size:clamp(2.3rem,5vw,3.5rem);line-height:1.12}.syifa-portfolio-root .tag{color:var(--ink-light);margin-bottom:18px;font-size:.98rem;font-weight:500}.syifa-portfolio-root .hi-img{width:100%;max-width:255px;margin-left:auto;position:relative}.syifa-portfolio-root .pic{aspect-ratio:4/5;box-shadow:var(--shadow-lg);text-align:center;color:var(--ink-light);background:linear-gradient(160deg,#f5ece2,#e5d4c2);border:1px solid #9e6b4f2e;border-radius:20px;place-items:center;padding:14px;font:italic .95rem Playfair Display,serif;display:grid;overflow:hidden}.syifa-portfolio-root .pic img,.syifa-portfolio-root .ab img,.syifa-portfolio-root .g img{object-fit:cover;width:100%;height:100%}.syifa-portfolio-root .fcard{background:var(--bg-card);border:1px solid var(--line-card);box-shadow:var(--shadow-md);border-radius:14px;min-width:140px;padding:9px 13px;position:absolute;bottom:20px;left:-20px}.syifa-portfolio-root .fcard b{color:var(--ink);font-family:Playfair Display,serif;font-size:.78rem;display:block}.syifa-portfolio-root .fcard strong{color:var(--ink);font:700 1.25rem/1.15 Playfair Display,serif;display:block}.syifa-portfolio-root .fcard small{color:var(--ink-muted);font-size:.68rem;display:block}.syifa-portfolio-root .pills{flex-direction:column;gap:6px;display:flex;position:absolute;top:16px;right:-10px}.syifa-portfolio-root .pills a{background:var(--bg-card);border:1px solid var(--line-card);box-shadow:var(--shadow-sm);color:var(--ink-light);border-radius:10px;padding:6px 11px;font-size:.68rem;line-height:1.2;transition:transform .2s,border-color .2s}.syifa-portfolio-root .pills a:hover{border-color:var(--accent);transform:translate(-3px)}.syifa-portfolio-root .pills b{color:var(--ink);font:700 .92rem Playfair Display,serif;display:block}.syifa-portfolio-root .mq{background:var(--bg-subtle);color:var(--ink);border-top:1px solid var(--line);border-bottom:1px solid var(--line);white-space:nowrap;padding:12px 0;overflow:hidden}.syifa-portfolio-root .mq div{animation:30s linear infinite syifa-marquee;display:inline-flex}.syifa-portfolio-root .mq span{color:var(--ink);opacity:.9;margin:0 22px;font:italic 500 1.05rem Playfair Display,serif}.syifa-portfolio-root section{padding:60px 0}.syifa-portfolio-root .works{flex-wrap:wrap;justify-content:center;gap:16px;display:flex}.syifa-portfolio-root .work{aspect-ratio:9/16;width:180px;box-shadow:var(--shadow-sm);background:#f0e6dc;border:1px solid #9e6b4f29;border-radius:18px;flex-direction:column;justify-content:flex-end;text-decoration:none;transition:transform .25s,box-shadow .25s,border-color .25s;display:flex;position:relative;overflow:hidden}.syifa-portfolio-root .work:hover{box-shadow:var(--shadow-md);border-color:var(--accent);transform:translateY(-5px)}.syifa-portfolio-root .work-img{object-fit:cover;z-index:1;width:100%;height:100%;transition:transform .4s;position:absolute;inset:0}.syifa-portfolio-root .work:hover .work-img{transform:scale(1.05)}.syifa-portfolio-root .work-overlay{z-index:2;box-sizing:border-box;background:linear-gradient(#0000 0%,#1e140f73 40%,#1e140fe0 100%);width:100%;padding:16px 14px 14px;position:relative}.syifa-portfolio-root .work-overlay b{color:#faf7f2;font:600 .95rem/1.25 Playfair Display,serif;display:block}.syifa-portfolio-root .work-overlay small{color:#faf7f2d9;letter-spacing:.2px;margin-top:2px;font-size:.74rem;display:block}.syifa-portfolio-root .work:after{content:"▶";backdrop-filter:blur(8px);width:30px;height:30px;color:var(--ink);z-index:3;background:#ffffffeb;border-radius:50%;place-items:center;font-size:.72rem;transition:transform .2s,background .2s;display:grid;position:absolute;top:12px;right:12px;box-shadow:0 4px 12px #00000029}.syifa-portfolio-root .work:hover:after{background:#fff;transform:scale(1.1)}.syifa-portfolio-root .bb{background:var(--bg-subtle)}.syifa-portfolio-root .bg{grid-template-columns:repeat(auto-fill,minmax(115px,1fr));align-items:center;gap:14px;display:grid}.syifa-portfolio-root .brand-item{aspect-ratio:16/9;background:var(--bg-card);border:1px solid var(--line-card);border-radius:14px;justify-content:center;align-items:center;padding:12px 16px;transition:transform .25s,border-color .25s,box-shadow .25s;display:flex;box-shadow:0 2px 8px #2b1d1608}.syifa-portfolio-root .brand-item:hover{border-color:var(--accent);box-shadow:var(--shadow-sm);transform:translateY(-3px)}.syifa-portfolio-root .brand-item img{object-fit:contain;width:auto;max-width:100%;height:auto;max-height:100%;transition:transform .25s;display:block}.syifa-portfolio-root .brand-item:hover img{transform:scale(1.05)}.syifa-portfolio-root .about{grid-template-columns:.85fr 1.15fr;align-items:center;gap:44px;max-width:940px;margin:auto;display:grid}.syifa-portfolio-root .ab{aspect-ratio:4/5;border:1px solid var(--line-card);box-shadow:var(--shadow-md);color:var(--ink-light);background:linear-gradient(160deg,#f5ece2,#e5d4c2);border-radius:22px;place-items:center;font:italic 1rem Playfair Display,serif;display:grid;overflow:hidden}.syifa-portfolio-root .chip{background:var(--accent-soft);color:var(--ink);letter-spacing:.2px;border-radius:99px;margin-bottom:12px;padding:5px 14px;font-size:.8rem;font-weight:600;display:inline-block}.syifa-portfolio-root .about h2{text-align:left;margin-bottom:12px}.syifa-portfolio-root .about p{color:var(--ink-light);font-size:.95rem;line-height:1.7}.syifa-portfolio-root .about p b{color:var(--ink);font-weight:600}.syifa-portfolio-root .about-measurements{border-top:1px dashed var(--line-card);margin-top:24px;padding-top:18px}.syifa-portfolio-root .about-measurements h3{color:var(--ink);letter-spacing:-.2px;margin-bottom:12px;font-family:Playfair Display,Georgia,serif;font-size:1.05rem;font-weight:700}.syifa-portfolio-root .measurements-grid{grid-template-columns:repeat(2,1fr);gap:0 24px;display:grid}.syifa-portfolio-root .measurement-item{border-bottom:1px solid var(--line-soft);background:0 0;flex-direction:row;justify-content:space-between;align-items:center;gap:6px;min-width:0;padding:7px 4px;display:flex}.syifa-portfolio-root .measurement-label{color:var(--ink-light);white-space:nowrap;flex-shrink:0;font-size:.82rem;font-weight:500}.syifa-portfolio-root .measurement-value{color:var(--ink);text-align:right;white-space:nowrap;font-size:.83rem;font-weight:700}.syifa-portfolio-root .measurement-value.sm{letter-spacing:-.2px;font-size:.73rem;font-weight:600}.syifa-portfolio-root .gal{columns:4 160px;column-gap:12px;margin-top:45px}.syifa-portfolio-root .g{break-inside:avoid;background:var(--bg-subtle);border:1px solid var(--line-card);box-shadow:var(--shadow-sm);border-radius:14px;margin-bottom:12px;transition:transform .25s,box-shadow .25s;display:block;overflow:hidden}.syifa-portfolio-root .g:hover{box-shadow:var(--shadow-md);transform:translateY(-3px)}.syifa-portfolio-root .g img{object-fit:cover;width:100%;height:100%;transition:transform .4s;display:block}.syifa-portfolio-root .g:hover img{transform:scale(1.03)}.syifa-portfolio-root .g.x{display:none}.syifa-portfolio-root .gal.open .g.x{display:block}.syifa-portfolio-root .more{text-align:center;margin-top:20px}.syifa-portfolio-root .cn{background:var(--bg-subtle);color:var(--ink)}.syifa-portfolio-root .cards{grid-template-columns:1fr 1fr;gap:14px;max-width:660px;margin:0 auto 24px;display:grid}.syifa-portfolio-root .cc{background:var(--bg-card);border:1px solid var(--line-card);box-shadow:var(--shadow-sm);border-radius:16px;padding:18px 20px;transition:transform .2s,border-color .2s,box-shadow .2s;display:block}.syifa-portfolio-root .cc small{color:var(--ink-muted);margin-bottom:4px;font-size:.75rem;display:block}.syifa-portfolio-root .cc b{color:var(--ink);font-size:1.02rem}.syifa-portfolio-root a.cc:hover{box-shadow:var(--shadow-md);border-color:var(--accent);transform:translateY(-2px)}.syifa-portfolio-root .fol{flex-wrap:wrap;justify-content:center;gap:12px;display:flex}.syifa-portfolio-root footer{background:var(--bg-subtle-2);color:var(--ink-light);border-top:1px solid var(--line);padding:28px 0;font-size:.84rem}.syifa-portfolio-root footer .c{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:14px;display:flex}.syifa-portfolio-root footer b{color:var(--ink);font:italic 700 1.15rem Playfair Display,serif}.syifa-portfolio-root footer div{gap:16px;display:flex}.syifa-portfolio-root footer a{color:var(--ink-light);transition:color .2s}.syifa-portfolio-root footer a:hover{color:var(--ink);text-decoration:underline}.syifa-portfolio-root footer .btn{padding:8px 18px;font-size:.8rem}@media (width>=769px){.syifa-portfolio-root .mobile-nav{display:none}.syifa-portfolio-root .navbar{display:flex}}@media (width<=768px){.syifa-portfolio-root .navbar{display:none}.syifa-portfolio-root .mobile-nav{display:flex}.syifa-portfolio-root #home{padding-top:108px;padding-bottom:24px}.syifa-portfolio-root .hero-badge{margin-top:6px;margin-bottom:10px}.syifa-portfolio-root section[id]{scroll-margin-top:85px}.syifa-portfolio-root #home .c,.syifa-portfolio-root .about{grid-template-columns:1fr;gap:20px}.syifa-portfolio-root .ab{width:100%;max-width:300px;margin:0 auto}.syifa-portfolio-root .about .chip{width:fit-content;margin:0 auto 12px;display:block}.syifa-portfolio-root .hi-img{max-width:220px;margin:10px auto 0}.syifa-portfolio-root .fcard{min-width:120px;padding:7px 10px;bottom:12px;left:-8px}.syifa-portfolio-root .pills{gap:5px;top:10px;right:-6px}.syifa-portfolio-root .cards{grid-template-columns:1fr}.syifa-portfolio-root .works{gap:12px}.syifa-portfolio-root .work{border-radius:14px;width:calc(50% - 6px)}.syifa-portfolio-root .work-overlay{padding:12px 10px 10px}.syifa-portfolio-root .work-overlay b{font-size:.85rem}.syifa-portfolio-root .work-overlay small{font-size:.7rem}.syifa-portfolio-root .work:after{width:26px;height:26px;font-size:.65rem;top:8px;right:8px}.syifa-portfolio-root .bg{grid-template-columns:repeat(auto-fill,minmax(88px,1fr));gap:10px}.syifa-portfolio-root .brand-item{border-radius:10px;padding:8px 10px}.syifa-portfolio-root .about h2{text-align:center}.syifa-portfolio-root .about-measurements{margin-top:18px;padding-top:14px}.syifa-portfolio-root .measurements-grid{grid-template-columns:repeat(2,1fr);gap:0 12px}.syifa-portfolio-root .measurement-item{gap:4px;padding:6px 2px}.syifa-portfolio-root .measurement-label,.syifa-portfolio-root .measurement-value{font-size:.75rem}.syifa-portfolio-root .measurement-value.sm{letter-spacing:-.3px;font-size:.67rem}}@media (width<=520px){.syifa-portfolio-root .gal{columns:2 140px}}@media (prefers-reduced-motion:reduce){.syifa-portfolio-root .fl,.syifa-portfolio-root .mq div{animation:none}html{scroll-behavior:auto}}
