.portfolio-page{--pack-line:#397d62;--pack-mint:#72f1b6;color:#effff6}
.pack-hero{background:radial-gradient(ellipse at 13% 45%,#087549 0,transparent 55%),linear-gradient(125deg,#00583d,#003b2f 65%);overflow:hidden}
.pack-intro{display:grid;grid-template-columns:.85fr 1.15fr;gap:65px;align-items:center;padding:38px 0 32px}
html.almarai .pack-copy h1{font-size:clamp(58px,6.1vw,94px);line-height:1.3;margin:0 0 18px;letter-spacing:-.035em}
.pack-copy em,.pack-collection h2 em{color:var(--pack-mint);font-style:normal}
.pack-copy p{max-width:390px;color:#c2dfd0;font-size:14px;margin:0 0 24px}
.pack-explore{display:inline-flex;align-items:center;gap:32px;border-bottom:1px solid var(--pack-mint);padding-bottom:12px;color:var(--pack-mint);font-size:15px}
.pack-explore span{font-size:25px;transition:transform .25s}.pack-explore:hover span{transform:translateY(4px)}
.pack-facts{display:flex;gap:26px;margin-top:28px;font-size:11px;color:#b9d9c7}.pack-facts span+span{border-right:1px solid var(--pack-line);padding-right:26px}.pack-facts b{display:block;font-size:25px;color:#effff6;line-height:1.5;font-weight:400}
.pack-showcase{position:relative;min-width:0;padding:22px 26px 18px;background:linear-gradient(140deg,#197d54,#006546 60%,#00533e);border:1px solid #419970;border-radius:2px 44px 2px 2px}
.pack-showcase-label{display:flex;justify-content:space-between;font-size:10px;color:#b8efd0;letter-spacing:.07em;margin-bottom:24px}
.pack-stamp{position:absolute;inset:auto auto 63px -26px;color:#72f1b6;font-size:86px;line-height:1;z-index:2;pointer-events:none;transform:rotate(-12deg)}
.pack-feature{display:block;position:relative;width:100%;border:0;padding:0;background:#f3eee1;transform:rotate(-3deg);box-shadow:0 16px 35px #001c2560;cursor:pointer;overflow:hidden}
.pack-feature img{display:block;width:100%;height:auto;aspect-ratio:1.48;object-fit:contain;max-height:380px;transition:transform .5s ease;background:#f4f1e9}
.pack-feature>span{position:absolute;bottom:12px;left:12px;padding:8px 13px;border-radius:20px;background:#003b2feb;color:#eaffef;font-size:10px}
.pack-feature:hover img{transform:scale(1.025)}.pack-feature:focus-visible{outline:3px solid #b8ffd7;outline-offset:6px}
.pack-feature-controls{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-top:30px}.pack-feature-controls small{display:block;font-size:10px;color:#baebce}.pack-feature-controls strong{display:block;font-size:17px;margin-top:4px;font-weight:700}.pack-control-buttons{display:flex;align-items:center;gap:7px}.pack-control-buttons>span{font-size:11px;color:#d3f0df;margin-left:7px}
.pack-control-buttons button{width:37px;height:37px;border:1px solid #6eac8b;border-radius:50%;background:transparent;color:#effff6;font-size:22px;cursor:pointer}.pack-control-buttons button:hover{background:#72f1b6;color:#003b2f}
.pack-hero-foot{display:flex;justify-content:space-between;gap:16px;padding:17px 0;border-top:1px solid var(--pack-line);font-size:11px;color:#b9d9c7}
.pack-collection{padding-top:48px;scroll-margin-top:100px}.pack-collection-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:26px}html.almarai .pack-collection h2{font-size:clamp(28px,3.3vw,46px);line-height:1.5;margin:8px 0 0}.pack-collection-head p{font-size:12px;color:#b9d9c7;margin:0}
.pack-toolbar{display:flex;align-items:center;justify-content:space-between;gap:20px;border-bottom:1px solid var(--pack-line);padding-bottom:20px;margin-bottom:28px}.pack-filters{display:flex;gap:8px;flex-wrap:wrap}.pack-filters button{border:1px solid var(--pack-line);border-radius:30px;padding:10px 15px;background:transparent;color:#e5f9ec;font:inherit;font-size:12px;cursor:pointer;display:flex;align-items:center;gap:14px;transition:background .2s,color .2s}.pack-filters button span{font-size:10px;opacity:.65}.pack-filters button[aria-pressed=true]{background:#72f1b6;border-color:#72f1b6;color:#003b2f}.pack-filters button:hover{border-color:#72f1b6}#pack-results{font-size:11px;color:#b9d9c7;white-space:nowrap}
.pack-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:30px 22px}.pack-card{grid-column:span 4;min-width:0}.pack-card:first-child{grid-column:span 8}.pack-card:nth-child(n+6){grid-column:span 6}.pack-card[hidden]{display:none!important}.pack-grid[data-filtered=true] .pack-card{grid-column:span 6}
.pack-project{width:100%;display:block;text-align:right;border:0;padding:0;background:transparent;color:inherit;cursor:pointer;font:inherit}.pack-image{display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden;background:#e9e8df;border:1px solid #3d7c60;height:270px;isolation:isolate}.pack-image>img{display:block;width:100%;height:100%;object-fit:contain;transition:transform .65s cubic-bezier(.2,.65,.2,1);background:#f7f5ef}
.pack-card:nth-child(-n+2) .pack-image{height:380px}.pack-card:nth-child(n+6) .pack-image{height:390px}.pack-card:nth-child(n+8) .pack-image{height:310px;background:#fff}.pack-card:nth-child(n+8) .pack-image>img{width:auto;max-width:100%;background:#fff}.pack-card[data-brand=alusool] .pack-image>img{max-height:300px}.pack-grid[data-filtered=true] .pack-image{height:350px}
.pack-number{position:absolute;top:12px;right:12px;border:1px solid #003b2f30;background:#ffffffe6;color:#003b2f;border-radius:50%;width:28px;height:28px;font-size:10px;display:grid;place-items:center;direction:ltr}
.pack-open{position:absolute;bottom:16px;left:16px;border-radius:30px;padding:10px 16px;background:#003b2f;color:#b7ffd5;font-size:11px;transform:translateY(60px);opacity:0;transition:transform .3s,opacity .3s;box-shadow:0 5px 15px #00211525}
.pack-caption{display:flex;justify-content:space-between;align-items:center;gap:12px;padding-top:14px}.pack-caption small{font-size:10px;display:block;color:#afd2bf;margin-bottom:5px}.pack-caption strong{display:block;font-size:21px;font-weight:700}.pack-arrow{border:1px solid #467e62;border-radius:50%;width:36px;height:36px;display:grid;place-items:center;color:#72f1b6;font-size:23px;transition:background .2s,color .2s,transform .3s}
.pack-project:hover .pack-open,.pack-project:focus-visible .pack-open{transform:translateY(0);opacity:1}.pack-project:hover .pack-image>img{transform:scale(1.025)}.pack-project:hover .pack-arrow{background:#72f1b6;color:#003b2f;transform:rotate(45deg)}.pack-project:focus-visible{outline:2px solid #72f1b6;outline-offset:6px}
.pack-end{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-top:40px;padding:30px 0 45px;border-top:1px solid var(--pack-line)}.pack-end>span{color:#afd2bf;font-size:12px;line-height:1.9}.pack-end>a{font-size:clamp(20px,2.7vw,37px);color:#72f1b6;display:flex;align-items:center;gap:35px}.pack-end b{font-weight:400;font-size:1.5em}
#pack-dialog{width:min(1200px,94vw);max-width:94vw;max-height:92dvh;margin:auto;padding:0;border:1px solid #559574;border-radius:4px;background:#003b2f;color:#effff6;box-shadow:0 25px 100px #0008;overflow:auto}#pack-dialog::backdrop{background:#001d18e8;backdrop-filter:blur(10px)}.pack-dialog-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:17px 24px;border-bottom:1px solid #37765a;font-size:10px;letter-spacing:.06em}.pack-dialog-head button{background:transparent;color:#effff6;border:1px solid #609c7e;border-radius:25px;padding:8px 14px;font:inherit;font-size:12px;cursor:pointer}.pack-dialog-body{display:grid;grid-template-columns:1.8fr 1fr;direction:ltr}.pack-dialog-image{height:min(70vh,700px);display:grid;place-items:center;background:#f5f3ee;padding:12px}.pack-dialog-image img{width:100%;height:100%;min-height:0;object-fit:contain}.pack-dialog-info{direction:rtl;padding:32px 28px;align-self:center}.pack-dialog-info>small{color:#72f1b6;font-size:11px}html.almarai .pack-dialog-info h2{font-size:29px;line-height:1.6;margin:16px 0}.pack-dialog-info p{font-size:13px;color:#b9d9c7}.pack-dialog-navigation{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:35px;border-top:1px solid #397d62;padding-top:20px}.pack-dialog-navigation button{font:inherit;font-size:11px;background:transparent;border:0;color:#72f1b6;cursor:pointer;padding:10px 0}.pack-dialog-navigation span{font-size:10px;color:#cce8d8}.pack-key-hint{display:block;font-size:10px;color:#b9d9c7;margin-top:16px}.pack-dialog-navigation button:focus-visible,.pack-dialog-head button:focus-visible,.pack-filters button:focus-visible,.pack-control-buttons button:focus-visible{outline:2px solid #b7ffd5;outline-offset:4px}
@keyframes pack-arrive{from{opacity:.3;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}.pack-card.pack-arrive{animation:pack-arrive .45s both}.pack-feature img.pack-swap{animation:pack-arrive .4s both}
@media(min-width:1500px){.pack-image{height:310px}.pack-card:nth-child(-n+2) .pack-image{height:440px}}
@media(max-width:1100px){.pack-intro{gap:32px}.pack-showcase{padding:18px}.pack-stamp{font-size:65px;left:-17px}.pack-card:nth-child(-n+2) .pack-image{height:300px}.pack-image{height:220px}.pack-card:nth-child(n+6) .pack-image{height:330px}.pack-caption strong{font-size:18px}.pack-dialog-body{grid-template-columns:1.4fr 1fr}}
@media(max-width:720px){.pack-intro{grid-template-columns:1fr;gap:30px;padding:26px 0 22px}html.almarai .pack-copy h1{font-size:clamp(49px,12.8vw,72px);margin-bottom:12px}.pack-copy p{font-size:12px;max-width:440px;margin-bottom:16px}.pack-copy .studio-kicker{font-size:11px}.pack-facts{float:left;gap:16px;margin-top:0;font-size:9px}.pack-facts span+span{padding-right:16px}.pack-facts b{font-size:20px}.pack-explore{font-size:12px;gap:18px;padding-bottom:8px}.pack-showcase{margin-inline:5px;padding:16px 18px;border-radius:2px 30px 2px 2px}.pack-showcase-label{font-size:8px;margin-bottom:20px}.pack-feature img{max-height:280px}.pack-feature-controls{padding-top:23px}.pack-feature-controls strong{font-size:15px}.pack-stamp{font-size:58px;left:-15px;bottom:56px}.pack-control-buttons button{width:33px;height:33px}.pack-hero-foot{font-size:9px;padding:14px 0}.pack-collection{padding-top:30px;scroll-margin-top:85px}.pack-collection-head{display:block;margin-bottom:20px}.pack-collection-head p{margin-top:12px;font-size:11px}.pack-toolbar{align-items:flex-start;gap:10px;margin-bottom:22px;padding-bottom:16px}.pack-filters{gap:7px}.pack-filters button{font-size:10px;padding:9px 12px;gap:10px}.pack-filters button span{font-size:9px}#pack-results{font-size:9px;margin-top:10px}.pack-grid{grid-template-columns:1fr;gap:25px}.pack-card,.pack-card:first-child,.pack-card:nth-child(n+6),.pack-grid[data-filtered=true] .pack-card{grid-column:1}.pack-grid .pack-card .pack-image{height:auto;aspect-ratio:1.48}.pack-grid .pack-card:nth-child(2) .pack-image,.pack-grid .pack-card:nth-child(7) .pack-image{aspect-ratio:1.1}.pack-grid .pack-card:nth-child(6) .pack-image{aspect-ratio:.95}.pack-grid .pack-card:nth-child(n+8) .pack-image{aspect-ratio:1.3}.pack-card[data-brand=alusool] .pack-image>img{max-height:240px}.pack-caption{padding-top:12px}.pack-caption strong{font-size:19px}.pack-open{display:none}.pack-arrow{width:32px;height:32px;font-size:21px}.pack-end{display:block;padding-bottom:30px;margin-top:28px}.pack-end>a{margin-top:14px;font-size:25px;justify-content:space-between}.pack-dialog-head{padding:12px 14px;font-size:8px}.pack-dialog-body{grid-template-columns:1fr}.pack-dialog-image{height:42dvh;padding:8px}.pack-dialog-info{padding:18px 20px}html.almarai .pack-dialog-info h2{font-size:23px;margin:8px 0}.pack-dialog-info p{font-size:12px;margin:8px 0}.pack-dialog-navigation{margin-top:17px;padding-top:10px}.pack-key-hint{display:none}}
@media(prefers-reduced-motion:reduce){.portfolio-page *,#pack-dialog *{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* Quegreen art-directed portfolio scenes, all exported at 3:2. */
.portfolio-page .pack-grid .pack-card:nth-child(-n+2){grid-column:span 6}
.portfolio-page .pack-grid .pack-card .pack-image{height:auto;aspect-ratio:3/2;background:#003b2f;border-color:#39845f}
.portfolio-page .pack-grid .pack-card .pack-image>img{width:100%;height:100%;max-height:none;object-fit:contain;background:#003b2f}
.portfolio-page .pack-feature{background:#003b2f}
.portfolio-page .pack-feature img{aspect-ratio:3/2;max-height:none;background:#003b2f}
.pack-signature{position:absolute;left:12px;top:14px;color:#e2ffef;font:8px/1.4 Almarai,sans-serif;letter-spacing:.08em;opacity:.85;text-shadow:0 1px 4px #003b2f;pointer-events:none}
.portfolio-page .pack-number{background:#003b2fcc;border-color:#b2e6c44d;color:#d7f7e4}
.portfolio-page .pack-dialog-image{height:auto;aspect-ratio:3/2;padding:0;background:#002e24;align-self:center}
.portfolio-page .pack-dialog-image img{object-fit:contain}
.portfolio-page .pack-dialog-navigation button:disabled{opacity:.35;cursor:default}
@media(max-width:720px){.portfolio-page .pack-grid .pack-card:nth-child(-n+2){grid-column:1}.pack-signature{font-size:7px;top:12px;left:10px}.portfolio-page .pack-control-buttons button{width:40px;height:40px}}