/* Saga editorial portfolio: large artwork, deliberate reading rhythm. */
.sg-editorial{--sg-green:var(--lime,#c9f31d);--sg-ink:#20251e;--sg-line:#d6d9ce;color:var(--sg-ink);padding-top:40px;padding-bottom:70px}
.sg-editorial *{box-sizing:border-box;min-width:0}
.sg-editorial p{font-size:18px;line-height:1.7;max-width:65ch}
.sg-editorial h1,.sg-editorial h2,.sg-editorial h3{font-weight:500;letter-spacing:-.045em;overflow-wrap:break-word}
.sg-editorial h1{font-size:clamp(52px,7.8vw,116px);line-height:1.04;margin:24px 0 32px}
.sg-editorial h2{font-size:clamp(32px,3.9vw,58px);line-height:1.12;margin:18px 0 26px}
.sg-editorial em{font-family:Georgia,serif;font-weight:400}
.sg-kicker{font-size:14px;letter-spacing:.08em;line-height:1.6;display:block;text-transform:uppercase}
.sg-editorial a{text-decoration:none;color:inherit}
.sg-editorial a:focus-visible,.sg-editorial button:focus-visible{outline:3px solid #647820;outline-offset:6px}
.sg-crumbs{display:flex;flex-wrap:wrap;gap:12px;font-size:16px;margin-bottom:62px;line-height:1.6}
.sg-crumbs a{text-decoration:underline;text-underline-offset:5px}
.sg-case-head{padding-bottom:42px}
.sg-dot{color:#c9f31d}
.sg-case-head .sg-tagline{font-size:clamp(25px,2.8vw,40px);line-height:1.3;max-width:850px;margin:0 0 38px}
.sg-facts{display:grid;grid-template-columns:1fr 1.8fr 1fr;gap:32px;border-top:1px solid var(--sg-ink);padding-top:24px;margin:0}
.sg-facts dt{font-size:15px;color:#555c4d;margin-bottom:10px}
.sg-facts dd{font-size:17px;line-height:1.6;margin:0}
.sg-figure{margin:0}
.sg-figure a{display:block;background:#eef0e8;overflow:hidden;border-radius:5px}
.sg-figure img{display:block;width:100%;height:auto}
.sg-figure figcaption{font-size:15px;line-height:1.5;color:#58604f;margin-top:14px}
.sg-case>.sg-figure img{max-height:880px;object-fit:contain}
.sg-story{display:grid;grid-template-columns:1fr 1.25fr;gap:clamp(32px,6vw,96px);padding:86px 0}
.sg-copy p{margin:0}.sg-copy{align-self:center}
.sg-green{padding:60px;background:var(--sg-green);border-radius:5px;margin:0 0 72px}
.sg-green p{color:#252c18}
.sg-gallery{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:30px}
.sg-gallery .sg-figure:only-child{grid-column:1/-1}
.sg-gallery .sg-figure a{height:auto}
.sg-gallery-long .sg-figure:nth-child(3n+1){grid-column:1/-1}
.sg-system p{margin:20px 0 0}
.sg-deliverables{list-style:none;padding:0;margin:0}
.sg-deliverables li{display:flex;gap:20px;font-size:18px;line-height:1.55;border-bottom:1px solid var(--sg-line);padding:17px 0}
.sg-deliverables li span{color:#607521}
.sg-editorial .sg-note{font-size:16px;color:#58604f}
.sg-cta{background:#252a21;color:#fafbf5;margin-top:90px;padding:60px;display:flex;justify-content:space-between;align-items:center;gap:40px;border-radius:5px}
.sg-cta h2{margin-bottom:0}.sg-cta em{color:var(--sg-green)}
.sg-editorial .sg-button{display:inline-flex;align-items:center;justify-content:center;gap:12px;padding:17px 24px;border:1px solid transparent;border-radius:999px;background:var(--sg-green);color:#20251e;font:inherit;font-size:17px;font-weight:500;line-height:1.4;cursor:pointer;transition:background .2s;flex-shrink:0}
.sg-editorial .sg-button:hover{background:#c1dd4e}
.sg-pagination{display:grid;grid-template-columns:1fr auto 1fr;gap:30px;padding:44px 0;border-bottom:1px solid var(--sg-line);align-items:center}
.sg-pagination a{font-size:clamp(18px,2vw,26px);line-height:1.35}.sg-pagination a:last-child{text-align:right}.sg-pagination span{display:block;font-size:15px;color:#58604f;margin-bottom:10px}
.sg-portfolio-head{padding:32px 0 76px}.sg-portfolio-head>div{display:grid;grid-template-columns:1fr 1fr;gap:60px}.sg-portfolio-head>div p:first-child{font-size:clamp(22px,2.3vw,32px);line-height:1.4}
.sg-section-title{display:flex;justify-content:space-between;align-items:center;gap:20px;border-bottom:1px solid var(--sg-line);margin-bottom:30px;padding-bottom:20px}
.sg-section-title h2{font-size:26px;margin:0;letter-spacing:-.02em}.sg-section-title>span{font-size:16px;white-space:nowrap}
.sg-feature{display:grid;grid-template-columns:1.35fr 1fr;gap:0;background:#edf0e6;margin-bottom:32px;border-radius:7px;overflow:hidden}
.sg-feature-image{display:flex;align-items:center;background:#e7eae0}
.sg-feature-image img{display:block;width:100%;height:auto;aspect-ratio:1.42;object-fit:contain;transition:transform .5s}
.sg-feature-copy{padding:clamp(26px,3.4vw,52px);display:flex;flex-direction:column;align-items:flex-start;justify-content:center}
.sg-feature-copy h3{font-size:clamp(32px,3.5vw,52px);line-height:1.1;margin:18px 0}
.sg-feature-copy p{font-size:16px;margin:0 0 18px}.sg-feature-copy .sg-feature-tagline{font-size:22px;line-height:1.4}
.sg-tags{display:flex;gap:8px;flex-wrap:wrap;list-style:none;padding:0;margin:0 0 30px}.sg-tags li{font-size:14px;line-height:1.4;border:1px solid #c9d0bc;border-radius:30px;padding:7px 12px}
.sg-remaining{margin-top:88px}.sg-tile-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:56px 28px}
.sg-tile-image{position:relative;display:block;border-radius:6px;overflow:hidden;background:#eef0e9}
.sg-tile-image img{display:block;width:100%;aspect-ratio:1.42;height:auto;object-fit:contain;transition:transform .5s}
.sg-tile-image span{position:absolute;right:16px;bottom:16px;background:var(--sg-green);color:#20251e;border-radius:30px;padding:12px 18px;font-size:15px;line-height:1.4}
.sg-tile-image:hover img{transform:scale(1.025)}
.sg-tile h3{font-size:28px;line-height:1.2;margin:22px 0 8px}.sg-tile p{font-size:17px;margin:0}.sg-status{display:inline-block;margin-top:12px;font-size:14px;padding:5px 10px;border:1px solid var(--sg-line);border-radius:30px}
@media(max-width:1000px){.sg-feature{grid-template-columns:1fr 1fr}.sg-feature-copy{padding:28px}.sg-green,.sg-cta{padding:40px}.sg-facts{grid-template-columns:1fr 1.5fr}.sg-facts>div:last-child{grid-column:1/-1}}
@media(max-width:760px){.sg-editorial{padding-top:25px;padding-bottom:40px}.sg-crumbs{margin-bottom:36px}.sg-editorial h1{font-size:clamp(44px,11vw,74px)}.sg-facts,.sg-story,.sg-gallery,.sg-portfolio-head>div,.sg-feature,.sg-tile-grid{grid-template-columns:1fr}.sg-story{padding:54px 0;gap:16px}.sg-green{padding:30px 24px;margin-bottom:44px}.sg-gallery{gap:28px}.sg-cta{padding:34px 24px;flex-direction:column;align-items:flex-start;margin-top:56px;gap:28px}.sg-pagination{grid-template-columns:1fr 1fr;gap:24px}.sg-pagination>a:nth-child(2){grid-column:1/-1;grid-row:2;text-align:center;font-size:18px}.sg-feature-image img{aspect-ratio:auto}.sg-feature-copy{padding:28px}.sg-portfolio-head{padding:20px 0 44px}.sg-portfolio-head>div{gap:20px}.sg-remaining{margin-top:56px}.sg-tile-grid{gap:40px}.sg-tile-image span{font-size:14px;padding:10px 14px;right:12px;bottom:12px}.sg-section-title h2{font-size:23px}.sg-facts{gap:20px}}
@media(prefers-reduced-motion:reduce){.sg-editorial img,.sg-editorial a{transition:none!important;transform:none!important}}
/* Supplied campaign films: playback on request, never autoplay. */
.sg-films{margin:78px 0 0}.sg-film-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:30px}.sg-film{margin:0;min-width:0}.sg-film:only-child{grid-column:1/-1;max-width:860px;width:100%;margin-inline:auto}.sg-film video{display:block;width:100%;height:auto;max-height:760px;background:#17151d;border-radius:5px;object-fit:contain}.sg-film figcaption{padding-top:20px}.sg-film h3{font-size:24px;line-height:1.3;margin:0 0 12px}.sg-film figcaption p{font-size:17px}.sg-film figcaption a{display:inline-block;font-size:16px;margin-top:12px;text-decoration:underline;text-underline-offset:5px}@media(max-width:760px){.sg-films{margin-top:50px}.sg-film-grid{grid-template-columns:1fr;gap:36px}}
/* Portfolio follows the shared Saga page language. */
.sg-portfolio{color:var(--ink);padding-top:0;padding-bottom:0}
.sg-portfolio em{font-family:inherit;font-style:normal;font-weight:inherit}
.sg-portfolio .sg-portfolio-head{display:grid;grid-template-columns:1.05fr .95fr;gap:70px;align-items:end;padding:80px 0 90px}
.sg-portfolio .sg-portfolio-head>div{display:block}
.sg-portfolio .sg-portfolio-head h1{font-size:clamp(4rem,8vw,8rem);line-height:.96;letter-spacing:-.075em;margin:25px 0 0;font-weight:500}
.sg-portfolio .sg-portfolio-head h1 em{background:linear-gradient(transparent 64%,var(--lime) 64%,var(--lime) 94%,transparent 94%);box-decoration-break:clone;-webkit-box-decoration-break:clone}
.sg-portfolio .sg-portfolio-intro{padding-bottom:5px}
.sg-portfolio .sg-portfolio-intro p,.sg-portfolio .sg-portfolio-intro p:first-child{font-size:19px;line-height:1.65;color:var(--muted);max-width:600px}
.sg-portfolio .sg-portfolio-intro p+p{margin-top:20px}
.sg-portfolio .sg-section-title{border-color:var(--line)}
.sg-portfolio .sg-feature{grid-template-columns:1.35fr 1fr;background:transparent;border-radius:5px;margin-bottom:56px;align-items:center;overflow:hidden}
.sg-portfolio .sg-feature-image{display:block;background:transparent;align-self:center}
.sg-portfolio .sg-feature-image img{width:100%;height:auto;aspect-ratio:auto;object-fit:contain;border-radius:5px}
.sg-portfolio .sg-feature-copy{padding:40px 0 40px 44px;background:transparent}
.sg-portfolio .sg-feature-copy h3{font-size:clamp(38px,4.2vw,64px);font-weight:500;letter-spacing:-.055em;line-height:1.05;margin:18px 0 22px}
.sg-portfolio .sg-feature-copy .sg-feature-tagline{font-size:21px;line-height:1.5;color:var(--ink)}
.sg-portfolio .sg-feature-copy p{font-size:17px;color:var(--muted)}
.sg-portfolio .sg-tags{gap:8px;margin-bottom:26px}
.sg-portfolio .sg-tags li{background:transparent;border-color:var(--line);color:var(--muted);font-size:14px}
.sg-portfolio .sg-button{font-size:16px;font-weight:550;padding:15px 26px}
.sg-portfolio .contact{margin-top:100px}
.sg-portfolio .contact h2{font-size:clamp(2.3rem,4.2vw,4rem);line-height:1.08;letter-spacing:-.055em;margin:20px 0 0}
@media(max-width:1000px){.sg-portfolio .sg-portfolio-head{gap:40px}.sg-portfolio .sg-feature-copy{padding:28px 0 28px 30px}.sg-portfolio .sg-feature-copy h3{font-size:38px}}
@media(max-width:760px){.sg-portfolio .sg-portfolio-head{grid-template-columns:1fr;gap:28px;padding:58px 0 60px}.sg-portfolio .sg-portfolio-head h1{font-size:clamp(48px,11vw,76px);line-height:1.02}.sg-portfolio .sg-feature{grid-template-columns:1fr;margin-bottom:48px}.sg-portfolio .sg-feature-copy{padding:26px 0 0}.sg-portfolio .sg-feature-copy h3{font-size:38px}.sg-portfolio .sg-portfolio-intro p,.sg-portfolio .sg-portfolio-intro p:first-child{font-size:18px}.sg-portfolio .contact{margin-top:65px}}
/* Reference proportions: edge-to-edge imagery beside a white text panel. */
.sg-portfolio .sg-feature{grid-template-columns:1.35fr 1fr;align-items:stretch;background:#fff;border-radius:14px;min-height:480px;overflow:hidden}
.sg-portfolio .sg-feature-image{position:relative;align-self:stretch;min-height:100%;background:#fff;overflow:hidden}
.sg-portfolio .sg-feature-image img{position:absolute;inset:0;width:100%;height:100%;aspect-ratio:16/10;object-fit:cover;object-position:center;border-radius:0}
.sg-portfolio .sg-feature-copy{padding:46px 44px;justify-content:center;gap:18px;background:#fff}
.sg-portfolio .sg-feature-copy h3{font-size:clamp(44px,5vw,72px);letter-spacing:-.06em;line-height:1;margin:0}
.sg-portfolio .sg-feature-copy .sg-kicker{margin:0;font-size:14px;font-weight:550}
.sg-portfolio .sg-feature-copy .sg-feature-tagline{font-size:18px;line-height:1.6;color:var(--muted);margin:0}
.sg-portfolio .sg-feature-copy .sg-tags{margin:0;gap:8px}
.sg-portfolio .sg-feature-copy .sg-tags li{background:#f2f2f0;border:0;padding:7px 12px;border-radius:999px;font-size:14px;color:var(--ink)}
.sg-portfolio .sg-feature-copy .sg-button{margin-top:6px}
@media(max-width:1100px){.sg-portfolio .sg-feature-copy{padding:34px 30px}.sg-portfolio .sg-feature-copy h3{font-size:44px}}
@media(max-width:900px){.sg-portfolio .sg-feature{grid-template-columns:1fr;min-height:0}.sg-portfolio .sg-feature-image{min-height:0;aspect-ratio:16/10}.sg-portfolio .sg-feature-copy{padding:30px 24px 34px}.sg-portfolio .sg-feature-copy h3{font-size:clamp(36px,7vw,52px)}}
/* Artwork fills portfolio thumbnails without tinted letterboxing. */
.sg-portfolio .sg-tile-image { background:transparent; border:0; padding:0; }
.sg-portfolio .sg-tile-image img { width:100%; height:auto; aspect-ratio:1.42; object-fit:cover; object-position:center; }
.sg-portfolio .sg-tile-image[href="/work/noor/"] img { object-position:50% 55%; }
.sg-live-link { margin:0 0 36px; }
.ls-showcase{margin:20px 0 0}
.ls-showcase-intro{padding:0 clamp(24px,4vw,60px) 48px;max-width:850px}
.ls-screen-story{display:grid;grid-template-columns:minmax(0,.7fr) minmax(0,1.5fr);gap:48px;align-items:center;padding:56px 0;border-top:1px solid var(--sg-line)}
.ls-screen-story:nth-of-type(even){grid-template-columns:minmax(0,1.5fr) minmax(0,.7fr)}
.ls-screen-story:nth-of-type(even) .ls-screen-copy{order:2}
.ls-screen-copy h3,.ls-design-notes h3{font-size:clamp(28px,3vw,40px);line-height:1.15;margin:18px 0 22px}
.ls-screen-copy p{margin:0;font-size:17px}
.ls-browser{background:#fff;border:1px solid #dfe2e7;border-radius:12px;box-shadow:0 18px 48px #14243c10;overflow:hidden}
.ls-browser-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 18px;background:#eef0f4;font-size:14px;color:#535c6b}
.ls-browser-bar>span:first-child{font-size:10px;letter-spacing:3px;color:#a6aebc}
.ls-browser .sg-figure a{border-radius:0}
.ls-browser .sg-figure img{width:100%;height:auto;object-fit:contain}
.ls-browser figcaption{padding:16px 20px;margin:0;font-size:15px;color:#58604f}
.ls-design-notes{display:grid;grid-template-columns:1fr 1fr;gap:60px;background:#fff;border-radius:12px;padding:clamp(24px,4vw,60px);margin-top:36px}
.ls-design-notes p{font-size:17px}.ls-swatches{display:flex;margin-top:28px;height:62px;border:1px solid #e0e3e8;border-radius:6px;overflow:hidden}.ls-swatches span{flex:1;background:#12368d}.ls-swatches span:nth-child(2){background:#83c5dd}.ls-swatches span:last-child{background:#fff}
.ls-design-notes ol{list-style:none;margin:0;padding:0}.ls-design-notes li{padding:18px 0;border-bottom:1px solid #e0e3e8;font-size:17px}.ls-design-notes li strong{display:block;margin-bottom:6px;font-weight:500}.ls-design-notes li span{color:#58604f;line-height:1.5}
@media(max-width:900px){.ls-screen-story,.ls-screen-story:nth-of-type(even){grid-template-columns:1fr;gap:26px;padding:38px 0}.ls-screen-story:nth-of-type(even) .ls-screen-copy{order:0}.ls-design-notes{grid-template-columns:1fr;gap:36px}.ls-screen-copy{padding-inline:24px}.ls-browser-bar{font-size:12px}.ls-showcase-intro{padding-bottom:30px}}
.sg-portfolio .sg-tile-image[href="/work/loanstate/"] img { object-position:center top; }
/* Shared case-study text rails, including the highlighted approach section. */
.sg-case .sg-story { grid-template-columns:minmax(0,1fr) minmax(0,1.25fr); align-items:start; padding:72px clamp(24px,4vw,60px); gap:clamp(32px,6vw,96px); }
.sg-case .sg-copy { align-self:start; min-width:0; }
.sg-case .sg-story h2 { margin-bottom:0; }
.sg-case .sg-system .sg-copy>p:first-child { margin-top:0; }
.sg-case .sg-system .sg-deliverables { margin-top:28px; }
.sg-case .sg-figure a { background:transparent; }
.sg-case>.sg-figure img { max-height:none; height:auto; object-fit:contain; }
.sg-case-loanstate .sg-gallery { grid-template-columns:1fr; gap:48px; }

@media(max-width:760px){.sg-case .sg-story{grid-template-columns:1fr;padding:40px 24px;gap:24px}.sg-case .sg-green{margin-bottom:40px}.sg-case-loanstate .sg-gallery{gap:32px}}

/* Show the complete Noor identity board within the uniform portfolio tile. */
.sg-portfolio .sg-tile-image[href="/work/noor/"]{background:#342e20}
.sg-portfolio .sg-tile-image[href="/work/noor/"] img{object-fit:cover;object-position:center}
