/* SYN_PORTFOLIO_REDESIGN_V2_20261112 -- Our Work: Monochrome index, image-led glass, pale close */
.syn119-portfolio{--syn119-ink:#f5f5f2;--syn119-copy:#d0d1cd;--syn119-border:rgba(255,255,255,.18);--syn119-card-bg:#111315;--syn119-panel:#17191b}
.syn119-portfolio .syn119-hero{grid-template-columns:minmax(0,1fr) minmax(420px,.95fr)!important;align-items:center!important;gap:clamp(40px,5vw,85px)!important;padding-bottom:clamp(65px,7vw,110px)!important}
.syn119-portfolio .syn119-project-index{position:relative;box-sizing:border-box;width:100%;max-width:760px;justify-self:stretch;overflow:hidden;padding:clamp(20px,2.5vw,34px)!important;border:1px solid rgba(235,239,237,.19)!important;border-radius:30px!important;background:linear-gradient(148deg,rgba(45,47,49,.78),rgba(19,20,22,.89) 62%,rgba(24,25,27,.92))!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.15),inset 0 -1px 0 rgba(0,0,0,.18),0 18px 45px rgba(0,0,0,.24)!important;backdrop-filter:blur(24px) saturate(1.06);-webkit-backdrop-filter:blur(24px) saturate(1.06)}
.syn119-portfolio .syn119-project-index:before{content:"";position:absolute;inset:0 0 auto;height:75px;pointer-events:none;background:linear-gradient(180deg,rgba(255,255,255,.055),transparent)}
.syn119-portfolio .syn119-project-index-head{position:relative;padding:0 6px 22px!important;color:#dfe0dc;font-size:10px;letter-spacing:.16em}
.syn119-portfolio .syn119-project-index-head span:last-child{color:#8e928e}
.syn119-portfolio .syn119-project-index>a{box-sizing:border-box;position:relative;grid-template-columns:37px minmax(0,1fr) 48px 25px!important;gap:12px!important;min-height:67px!important;padding:12px 9px!important;margin:0;border-top:1px solid rgba(245,245,242,.11)!important;border-radius:0;color:#f3f3f0!important;transition:background .25s ease,color .25s ease,padding .25s ease!important}
.syn119-portfolio .syn119-project-index>a:hover,.syn119-portfolio .syn119-project-index>a:focus-visible{padding-left:18px!important;background:linear-gradient(90deg,rgba(248,248,247,.11),rgba(248,248,247,.015))!important;color:white!important;outline:none}
.syn119-portfolio .syn119-project-index>a:focus-visible{box-shadow:inset 0 0 0 2px #f8f8f6}
.syn119-portfolio .syn119-project-index>a strong{font-size:clamp(14px,1.17vw,18px)!important;font-weight:750;letter-spacing:-.022em;line-height:1.15;overflow-wrap:normal;word-break:normal}
.syn119-portfolio .syn119-project-index>a span,.syn119-portfolio .syn119-project-index>a small{font-size:10px!important;color:#aeb2af!important}
.syn119-portfolio .syn119-project-index>a b{font-size:18px;color:#c6c9c6;transition:transform .23s ease}
.syn119-portfolio .syn119-project-index>a:hover b{transform:translate(2px,-2px)}
.syn119-portfolio .syn119-project-index-foot{padding:20px 6px 0!important;border-top:1px solid rgba(245,245,242,.14);color:#a5aba8!important}
/* Replace split image-and-copy layout with a single picture plane. */
.syn119-portfolio .syn119-project-grid{gap:clamp(15px,1.65vw,24px)!important}
.syn119-portfolio .syn119-project-card{position:relative;isolation:isolate;min-height:0;overflow:hidden;border:1px solid rgba(240,243,242,.24)!important;border-radius:29px!important;background:#17191b!important;box-shadow:inset 0 2px 0 rgba(255,255,255,.12),0 15px 34px rgba(0,0,0,.25)!important;transition:transform .35s ease,box-shadow .35s ease,border-color .35s ease!important}
.syn119-portfolio .syn119-project-card:hover,.syn119-portfolio .syn119-project-card:focus-within{transform:translateY(-4px);border-color:rgba(255,255,255,.45)!important;box-shadow:inset 0 2px 0 rgba(255,255,255,.19),0 22px 48px rgba(0,0,0,.34)!important}
.syn119-portfolio .syn119-project-card .syn119-project-link,.syn119-portfolio .syn119-project-card:first-child .syn119-project-link{display:block!important;position:relative;isolation:isolate;box-sizing:border-box;min-height:clamp(475px,41vw,560px)!important;height:100%!important;overflow:hidden;background:#121417;color:#f6f6f2!important;text-decoration:none}
.syn119-portfolio .syn119-project-card:first-child .syn119-project-link{min-height:clamp(525px,43vw,625px)!important}
.syn119-portfolio .syn119-project-card .syn119-project-media,.syn119-portfolio .syn119-project-card:first-child .syn119-project-media{position:absolute!important;inset:0!important;display:block!important;min-height:0!important;width:100%!important;height:100%!important;grid-column:auto!important;grid-row:auto!important;z-index:0;overflow:hidden;border-radius:inherit;background:#191b1d!important}
.syn119-portfolio .syn119-project-card .syn119-project-media>img{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover;filter:saturate(.88) contrast(1.04) brightness(.82)!important;transform:scale(1.015);transition:transform .75s cubic-bezier(.22,.61,.36,1),filter .35s ease!important}
.syn119-portfolio .syn119-project-card:hover .syn119-project-media>img{transform:scale(1.06);filter:saturate(.98) contrast(1.05) brightness(.9)!important}
.syn119-portfolio .syn119-project-media:before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);mask-image:linear-gradient(to bottom,transparent 38%,rgba(0,0,0,.1) 60%,#000 93%);-webkit-mask-image:linear-gradient(to bottom,transparent 38%,rgba(0,0,0,.1) 60%,#000 93%)}
.syn119-portfolio .syn119-project-media:after,.syn119-portfolio .syn119-project-card--taco .syn119-project-media:after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(180deg,rgba(7,8,9,.23) 0%,rgba(7,8,9,.03) 29%,rgba(9,11,13,.25) 54%,rgba(8,9,11,.84) 100%)!important}
.syn119-portfolio .syn119-media-corner{top:22px;left:25px;font-size:10px;z-index:3;color:#f7f7f4}
.syn119-portfolio .syn119-media-location{top:22px;right:25px;bottom:auto;z-index:3;font-size:9px;color:#dededa}
/* Floating graphite glass is neutral; client-specific accent colors do not tint the shell. */
.syn119-portfolio .syn119-project-card .syn119-project-copy,.syn119-portfolio .syn119-project-card:first-child .syn119-project-copy{box-sizing:border-box;position:absolute!important;inset:auto clamp(18px,2vw,30px) clamp(18px,2vw,30px)!important;z-index:4;display:flex!important;flex-direction:column!important;grid-column:auto!important;grid-row:auto!important;justify-content:flex-end!important;min-width:0;width:auto;max-width:none;padding:clamp(22px,2.6vw,35px)!important;border:1px solid rgba(255,255,255,.24);border-radius:24px;background:linear-gradient(150deg,rgba(38,40,42,.83),rgba(19,21,23,.66))!important;box-shadow:inset 0 1px rgba(255,255,255,.17),0 12px 36px rgba(0,0,0,.30)!important;backdrop-filter:blur(21px) saturate(1.07);-webkit-backdrop-filter:blur(21px) saturate(1.07);color:#f4f4f1!important}
.syn119-portfolio .syn119-project-meta{color:#d7d9d6!important;font-size:10px!important}
.syn119-portfolio .syn119-project-copy h3,.syn119-portfolio .syn119-project-card:first-child .syn119-project-copy h3{color:#fff!important;font-size:clamp(34px,3.4vw,50px)!important;line-height:.97!important;letter-spacing:-.055em!important;max-width:100%!important;margin:16px 0 13px!important;overflow-wrap:normal;word-break:normal;text-wrap:balance}
.syn119-portfolio .syn119-project-copy p,.syn119-portfolio .syn119-project-card:first-child .syn119-project-copy p{color:#d2d3d0!important;font-size:clamp(13px,1.02vw,15px)!important;line-height:1.55!important;max-width:60ch!important;-webkit-line-clamp:3;line-clamp:3}
.syn119-portfolio .syn119-project-cta,.syn119-portfolio .syn119-project-card:first-child .syn119-project-cta{margin-top:19px!important;padding-top:16px!important;border-top:1px solid rgba(255,255,255,.18)!important;color:#f4f4f2!important;font-size:10px!important}
.syn119-portfolio .syn119-project-arrow{border-color:rgba(255,255,255,.30);color:#f4f4f2}
.syn119-portfolio .syn119-project-card:hover .syn119-project-arrow{background:#f5f5f2;color:#151719}
.syn119-portfolio .syn119-project-card:first-child .syn119-project-copy{left:clamp(24px,4vw,62px)!important;right:auto!important;bottom:clamp(24px,4vw,50px)!important;width:min(580px,calc(100% - 48px));max-width:calc(100% - 48px)!important;padding:clamp(28px,3vw,43px)!important}
.syn119-portfolio .syn119-project-card:first-child .syn119-project-copy h3{font-size:clamp(54px,6vw,82px)!important;max-width:10ch!important}
.syn119-portfolio .syn119-project-card:first-child .syn119-project-copy p{font-size:16px!important;max-width:42ch!important}
/* Keep graphic-led entries intentionally editorial where no photograph is provided. */
.syn119-portfolio .syn119-project-card--news .syn119-project-media{background:radial-gradient(circle at 75% 22%,#4b3036,#181b1e 57%,#101113)!important}
.syn119-portfolio .syn119-project-card--fragrance .syn119-project-media{background:radial-gradient(circle at 63% 25%,#5a5144,#222326 50%,#111213)!important}
.syn119-portfolio .syn119-project-card--catr .syn119-project-media{background:linear-gradient(135deg,#3d4647,#15191b 65%)!important}
.syn119-portfolio .syn119-news-art,.syn119-portfolio .syn119-fragrance-art{opacity:.85;transform:scale(1.06);transform-origin:50% 25%}
/* Closing CTA uses the same rounded architecture, with a pale premium finish. */
.syn119-portfolio .syn119-final.syn95-portfolio-final{box-sizing:border-box;display:grid!important;grid-template-columns:minmax(120px,.27fr) minmax(0,1fr) minmax(215px,280px)!important;align-items:center!important;gap:clamp(23px,4vw,54px)!important;width:calc(100% - 2 * clamp(18px,4.6vw,75px))!important;max-width:1320px!important;min-height:320px;padding:clamp(38px,4.5vw,64px)!important;margin:clamp(30px,5vw,65px) auto clamp(70px,7vw,110px)!important;border:1px solid rgba(255,255,255,.58)!important;border-radius:32px!important;background:radial-gradient(ellipse at 90% 0%,rgba(255,255,255,.9),transparent 54%),linear-gradient(140deg,#e9e9e6,#d8dbd8)!important;color:#181a1c!important;box-shadow:inset 0 2px 0 rgba(255,255,255,.92),0 18px 42px rgba(0,0,0,.22)!important}
.syn119-portfolio .syn119-final-kicker{align-self:center;gap:14px}
.syn119-portfolio .syn119-final-kicker .syn91-label,.syn119-portfolio .syn119-final-kicker>span:last-child{color:#575b5b!important}
.syn119-portfolio .syn119-final-copy{min-width:0}
.syn119-portfolio .syn119-final-copy h2{font-size:clamp(45px,4.5vw,68px)!important;line-height:1.05!important;letter-spacing:-.055em!important;color:#121416!important;text-wrap:balance}
.syn119-portfolio .syn119-final-copy h2 strong{color:#62666a!important}
.syn119-portfolio .syn119-final-copy p{color:#4e5254!important;max-width:45ch;font-size:clamp(14px,1.1vw,17px)!important;line-height:1.62!important}
.syn119-portfolio .syn119-final>a.syn91-button.primary{box-sizing:border-box;display:flex!important;align-items:center!important;justify-content:space-between!important;align-self:center!important;justify-self:center!important;width:100%!important;max-width:280px!important;min-width:0;min-height:66px;margin:0!important;padding:18px 23px!important;border-radius:18px!important;border:1px solid #25292a!important;background:linear-gradient(145deg,#262a2c,#141617)!important;color:#fff!important;box-shadow:inset 0 1px rgba(255,255,255,.18),0 11px 25px rgba(0,0,0,.16)!important;text-decoration:none}
.syn119-portfolio .syn119-final>a.syn91-button.primary b{color:#fff!important}
.syn119-portfolio .syn119-final>a.syn91-button.primary:hover{transform:translateY(-2px);background:#34383a!important}
.syn119-portfolio .syn119-final>a.syn91-button.primary:focus-visible{outline:3px solid #191b1c;outline-offset:4px}
/* Preserve pale CTA and neutral portfolio glass when the visitor selects light mode. */
html[data-theme="light"] .syn119-portfolio .syn119-project-index{background:linear-gradient(145deg,#333638,#1a1c1f)!important}
html[data-theme="light"] .syn119-portfolio .syn119-project-index-head,html[data-theme="light"] .syn119-portfolio .syn119-project-index-foot{color:#ddd!important}
html[data-theme="light"] .syn119-portfolio .syn119-project-index>a{color:#f7f7f5!important}
/* The cards remain dark in either theme for consistent artwork and legible overlays. */
@media(max-width:1100px){.syn119-portfolio .syn119-hero{grid-template-columns:minmax(0,1fr) minmax(320px,.9fr)!important;gap:32px!important}.syn119-portfolio .syn119-final.syn95-portfolio-final{grid-template-columns:minmax(0,1fr) minmax(0,1.6fr)!important}.syn119-portfolio .syn119-final-kicker{grid-column:1/-1;justify-content:space-between}}
@media(max-width:920px){.syn119-portfolio .syn119-hero{grid-template-columns:minmax(0,1fr)!important}.syn119-portfolio .syn119-project-index{width:100%!important;max-width:none!important}.syn119-portfolio .syn119-project-card:first-child .syn119-project-copy{width:min(520px,calc(100% - 48px))}.syn119-portfolio .syn119-final.syn95-portfolio-final{grid-template-columns:minmax(0,1fr) minmax(215px,265px)!important}.syn119-portfolio .syn119-final-kicker{grid-column:1/-1}}
@media(max-width:720px){.syn119-portfolio .syn119-hero{padding-bottom:60px!important}.syn119-portfolio .syn119-project-index{padding:19px 18px!important;border-radius:23px!important}.syn119-portfolio .syn119-project-index>a{grid-template-columns:25px minmax(0,1fr) 38px 20px!important;gap:7px!important;min-height:59px!important}.syn119-portfolio .syn119-project-index>a strong{font-size:14px!important}.syn119-portfolio .syn119-project-index-head{font-size:9px}.syn119-portfolio .syn119-project-grid{grid-template-columns:minmax(0,1fr)!important}.syn119-portfolio .syn119-project-card .syn119-project-link,.syn119-portfolio .syn119-project-card:first-child .syn119-project-link{display:block!important;min-height:480px!important}.syn119-portfolio .syn119-project-card:first-child .syn119-project-link{min-height:550px!important}.syn119-portfolio .syn119-project-card:first-child .syn119-project-media{position:absolute!important;inset:0!important;height:100%!important;min-height:0!important}.syn119-portfolio .syn119-project-card .syn119-project-copy,.syn119-portfolio .syn119-project-card:first-child .syn119-project-copy{position:absolute!important;inset:auto 17px 17px!important;width:auto!important;max-width:none!important;padding:24px!important;border-radius:20px}.syn119-portfolio .syn119-project-card:first-child .syn119-project-copy h3{font-size:clamp(43px,10vw,60px)!important}.syn119-portfolio .syn119-project-card .syn119-project-copy h3{font-size:clamp(34px,7.8vw,44px)!important}.syn119-portfolio .syn119-project-card .syn119-project-copy p{font-size:13px!important}.syn119-portfolio .syn119-project-card:first-child .syn119-project-copy p{font-size:14px!important}.syn119-portfolio .syn119-final.syn95-portfolio-final{display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:24px!important;width:calc(100% - 36px)!important;padding:36px 29px!important;border-radius:25px!important}.syn119-portfolio .syn119-final-kicker{width:100%;align-self:auto}.syn119-portfolio .syn119-final-copy h2{font-size:clamp(42px,9vw,60px)!important}.syn119-portfolio .syn119-final>a.syn91-button.primary{align-self:center!important;justify-self:center!important;max-width:320px!important;width:100%!important}}
@media(max-width:390px){.syn119-portfolio .syn119-project-index>a strong{font-size:13px!important}.syn119-portfolio .syn119-project-card .syn119-project-link{min-height:460px!important}.syn119-portfolio .syn119-project-card .syn119-project-copy{padding:20px!important}.syn119-portfolio .syn119-final.syn95-portfolio-final{width:calc(100% - 30px)!important;padding:31px 23px!important}}
@media(prefers-reduced-motion:reduce){.syn119-portfolio .syn119-project-card,.syn119-portfolio .syn119-project-media>img,.syn119-portfolio .syn119-project-index>a{transition:none!important}.syn119-portfolio .syn119-project-card:hover,.syn119-portfolio .syn119-project-card:hover .syn119-project-media>img{transform:none!important}}
