/* Small overrides kept separate so operational configuration stays obvious. */
.trap { position: absolute !important; left: -9999px !important; }

/* Supplied Infrea Studio mark: a clear, compact signature in the site header. */
.wordmark { display: inline-flex; align-items: center; gap: 10px; }
.site-logo { width: 52px; height: 52px; display: block; flex: 0 0 52px; object-fit: cover; border-radius: 50%; background: var(--ink); border: 1px solid rgba(11,11,11,.18); }
.wordmark-name { font: 800 20px/1 var(--sans); letter-spacing: -1.5px; }
.wordmark-name sup { margin-left: 2px; font: 7px/1 var(--mono); vertical-align: top; }
@media (max-width: 700px) { .site-logo { width: 43px; height: 43px; flex-basis: 43px; }.wordmark-name { font-size: 17px; } }

/* Mobile-first product catalogue */
.products { background: var(--ink); color: var(--paper); overflow: hidden; padding-right: 0; }
.product-heading { padding-right: clamp(20px, 8.3vw, 132px); display: flex; justify-content: space-between; align-items: end; gap: 32px; margin-bottom: 54px; }
.product-heading h2 { font-size: clamp(45px, 6.2vw, 94px); line-height: .92; letter-spacing: -.07em; margin: 18px 0 0; }
.product-heading h2 em { font-family: var(--serif); font-weight: 500; }
.product-heading > p { max-width: 325px; margin: 0; color: #c9c6c0; font-size: 14px; line-height: 1.65; }
.product-rail { display: flex; gap: 16px; overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory; scrollbar-width: none; padding: 0 clamp(20px, 8.3vw, 132px) 18px 0; }
.product-rail::-webkit-scrollbar { display: none; }
.product-card { flex: 0 0 min(340px, 74vw); min-height: 510px; display: flex; flex-direction: column; scroll-snap-align: start; position: relative; padding: 19px; color: var(--ink); }
.product-card-brand { background: #f2594f; }.product-card-web { background: #d3e4e4; }.product-card-print { background: #e7d6bb; }.product-card-social { background: #bdacfd; }
.product-card-top { display: flex; justify-content: space-between; font: 10px var(--mono); text-transform: uppercase; letter-spacing: .06em; }
.product-art { height: 250px; position: relative; overflow: hidden; margin: 14px -2px 0; }
.art-brand b { position: absolute; font-size: 178px; letter-spacing: -.19em; line-height: .75; bottom: 6px; left: 7%; z-index: 1; }.art-brand i { position: absolute; width: 220px; height: 220px; border: 1px solid var(--ink); border-radius: 50%; top: -4px; right: -35px; }.art-brand i:after { content: ""; width: 90px; height: 90px; border: 1px solid var(--ink); position: absolute; left: 61px; top: 62px; transform: rotate(45deg); }
.art-web { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; padding: 25px 8px; }.art-web > span { grid-column: 1/-1; font: 104px/.65 var(--serif); letter-spacing: -.15em; }.art-web > span span { color: var(--red); }.art-web i { display: block; height: 52px; background: var(--ink); }.art-web i:last-child { background: var(--red); }
.art-print { background: var(--ink); color: var(--paper); padding: 27px 20px; display: flex; align-items: end; }.art-print span { position: relative; z-index: 2; font: 48px/.78 var(--serif); font-style: italic; letter-spacing: -.09em; }.art-print i { position: absolute; width: 190px; height: 250px; right: -34px; top: 28px; background: var(--red); transform: rotate(32deg); }
.art-social { display: flex; flex-direction: column; justify-content: space-between; padding: 0 4px 20px; }.art-social b { font: 200px/.7 var(--sans); letter-spacing: -.15em; }.art-social span { text-align: right; font: 31px/.82 var(--serif); font-style: italic; letter-spacing: -.09em; }
.product-card-copy { margin-top: auto; }.product-type { margin: 0; color: rgba(11,11,11,.65); font: 10px var(--mono); text-transform: uppercase; letter-spacing: .06em; }.product-card h3 { margin: 7px 0; font-size: 31px; letter-spacing: -.07em; line-height: 1; }.product-card-copy > p:last-child { max-width: 255px; margin: 0; font-size: 13px; line-height: 1.5; }
.product-open { margin-top: 23px; width: 100%; border: 1px solid var(--ink); color: var(--ink); background: transparent; padding: 13px 0; display: flex; justify-content: space-between; font: 800 11px var(--sans); cursor: pointer; }.product-open:hover { background: var(--ink); color: var(--paper); }.product-open:hover i { color: var(--paper); }
.swipe-prompt { margin: 24px 0 0; padding-right: clamp(20px, 8.3vw, 132px); text-align: right; color: #c9c6c0; font: 10px var(--mono); letter-spacing: .08em; text-transform: uppercase; }.swipe-prompt span { display: inline-block; width: 38px; border-top: 1px solid var(--red); margin: 0 8px 3px 0; }.swipe-prompt b { margin-left: 7px; color: var(--red); }
.product-modal { position: fixed; z-index: 100; inset: 0; display: flex; flex-direction: column; justify-content: space-between; padding: max(22px, env(safe-area-inset-top)) max(22px, env(safe-area-inset-right)) max(22px, env(safe-area-inset-bottom)) max(22px, env(safe-area-inset-left)); background: var(--ink); color: var(--paper); transform: translateY(104%); visibility: hidden; transition: transform .38s cubic-bezier(.22,.7,0,1), visibility 0s linear .38s; overflow: hidden; }
.product-modal.is-open { visibility: visible; transform: none; transition-delay: 0s; }.product-modal:before { content: ""; position: absolute; width: min(100vw,760px); height: min(100vw,760px); border-radius: 50%; background: var(--modal-accent, var(--red)); opacity: .95; right: -27vw; top: -23vw; }.product-modal-close { position: relative; z-index: 3; align-self: flex-end; height: 45px; width: 45px; border-radius: 50%; border: 1px solid var(--paper); background: transparent; color: var(--paper); font: 30px/.8 Arial; cursor: pointer; }.product-modal-close:hover { background: var(--paper); color: var(--ink); }
.product-modal-track { position: relative; z-index: 1; max-width: 650px; margin: auto 0; }.product-modal-number { color: var(--paper); font: 11px var(--mono); letter-spacing: .08em; }.product-modal-card { touch-action: pan-y; }.product-modal-type { margin: clamp(35px,9vh,100px) 0 11px; color: var(--ink); font: 10px var(--mono); letter-spacing: .08em; text-transform: uppercase; }.product-modal h2 { margin: 0; max-width: 700px; font-size: clamp(59px,12vw,136px); letter-spacing: -.09em; line-height: .78; }.product-modal-description { margin: 34px 0 0; max-width: 500px; font-size: clamp(15px,2vw,19px); line-height: 1.55; }.product-modal-includes { margin-top: 30px; display: grid; grid-template-columns: 105px 1fr; gap: 20px; border-top: 1px solid rgba(245,241,234,.55); padding-top: 14px; }.product-modal-includes p { margin: 0; font: 10px var(--mono); text-transform: uppercase; }.product-modal-includes ul { margin: 0; padding: 0; list-style: none; font-size: 13px; line-height: 1.8; }.product-modal-includes li:before { content: "—"; color: var(--red); margin-right: 7px; }.product-modal-note { margin: 22px 0 0; font: 11px/1.55 var(--mono); max-width: 580px; color: #d0cdc7; }.product-modal-cta { display: inline-flex; justify-content: space-between; align-items: center; min-width: 215px; margin-top: 32px; padding: 14px 16px; background: var(--paper); color: var(--ink); font: 800 11px var(--sans); }.product-modal-cta:hover { background: var(--red); color: var(--paper); }.product-modal-cta:hover i { color: var(--paper); }
.product-modal-hint { display: none; }.product-modal-nav { position: relative; z-index: 2; display: flex; align-items: center; gap: 16px; margin: auto 0 0; }.product-modal-nav button { height: 41px; width: 41px; border-radius: 50%; border: 1px solid var(--paper); color: var(--paper); background: transparent; font-size: 18px; cursor: pointer; }.product-modal-nav button:hover { color: var(--ink); background: var(--paper); }.product-dots { display: flex; gap: 7px; }.product-dot { width: 6px; height: 6px; border: 1px solid var(--paper); border-radius: 50%; background: transparent; padding: 0; }.product-dot.is-active { background: var(--paper); }
.mobile-dock { display: none; }

@media (max-width: 700px) {
  body { padding-bottom: 65px; }.site-header { position: sticky; top: 0; background: rgba(245,241,234,.93); backdrop-filter: blur(13px); }.hero { min-height: calc(100svh - 68px); }.hero-art { width: 64vw; height: 64vw; right: -4vw; top: 24%; }.products { padding-top: 74px; padding-bottom: 64px; }.product-heading { display: block; margin-bottom: 38px; padding-right: 20px; }.product-heading > p { margin: 28px 0 0; }.product-rail { gap: 12px; padding-left: 20px; padding-right: 20px; }.product-card { flex-basis: 84vw; min-height: 485px; padding: 17px; }.product-art { height: 220px; }.art-brand b { font-size: 157px; }.product-card h3 { font-size: 29px; }.swipe-prompt { padding-right: 20px; text-align: left; margin-left: 20px; }.product-modal:before { width: 110vw; height: 110vw; right: -45vw; top: -30vw; }.product-modal-type { margin-top: 50px; }.product-modal h2 { max-width: 330px; }.product-modal-description { margin-top: 30px; max-width: 325px; }.product-modal-includes { grid-template-columns: 1fr; gap: 9px; margin-top: 25px; }.product-modal-note { max-width: 310px; }.product-modal-hint { display: flex; gap: 13px; align-items: center; margin: 28px 0 0; color: #bdb9b2; font: 10px var(--mono); text-transform: uppercase; letter-spacing: .06em; }.product-modal-hint span { color: var(--red); font-size: 17px; }.product-modal-nav { margin-top: 25px; }.mobile-dock { position: fixed; display: grid; grid-template-columns: repeat(4,1fr); z-index: 30; bottom: 0; left: 0; right: 0; padding: 12px max(18px, env(safe-area-inset-right)) calc(11px + env(safe-area-inset-bottom)) max(18px, env(safe-area-inset-left)); background: rgba(11,11,11,.96); color: var(--paper); border-top: 1px solid #393939; }.mobile-dock a { text-align: center; font-size: 9px; font-weight: 700; letter-spacing: -.01em; }.mobile-dock a:last-child { color: var(--red); }
}

@media (min-width: 701px) { .products { padding-left: clamp(20px,8.3vw,132px); }.product-modal { padding: 32px clamp(48px,8vw,132px); }.product-modal-track { margin-left: 0; }.product-modal-hint { display: flex; gap: 12px; align-items: center; font: 10px var(--mono); text-transform: uppercase; letter-spacing: .06em; }.product-modal-hint span { color: var(--red); font-size: 18px; } }

/* Floating WhatsApp and call contact launcher */
.quick-contact { position: fixed; z-index: 60; right: 24px; bottom: 24px; display: flex; flex-direction: column; align-items: flex-end; gap: 12px; }
.quick-contact-toggle { display: grid; place-items: center; width: 58px; height: 58px; padding: 0; border: 0; border-radius: 50%; background: var(--red); color: var(--paper); box-shadow: 0 9px 26px rgba(0,0,0,.24); cursor: pointer; transition: transform .2s, background .2s; }
.quick-contact-toggle:hover { background: var(--ink); transform: scale(1.06); }.quick-contact-toggle svg { width: 25px; height: 25px; }.contact-close-icon { display: none; font: 33px/.8 Arial; }.quick-contact.is-open .contact-open-icon { display: none; }.quick-contact.is-open .contact-close-icon { display: block; }
.quick-contact-panel { width: min(300px, calc(100vw - 36px)); padding: 11px; background: var(--ink); color: var(--paper); box-shadow: 0 16px 42px rgba(0,0,0,.25); opacity: 0; visibility: hidden; transform: translateY(10px) scale(.96); transform-origin: bottom right; transition: opacity .18s, transform .18s, visibility 0s linear .18s; }
.quick-contact.is-open .quick-contact-panel { opacity: 1; visibility: visible; transform: none; transition-delay: 0s; }.quick-contact-panel > p { margin: 3px 8px 11px; color: #aaa; font: 10px var(--mono); text-transform: uppercase; letter-spacing: .08em; }
.quick-contact-option { display: grid; grid-template-columns: 40px 1fr 16px; align-items: center; gap: 10px; padding: 11px 8px; transition: background .18s; }.quick-contact-option:hover { background: #292929; }.quick-contact-option b { color: var(--red); font-size: 16px; }.quick-icon { display: grid; place-items: center; width: 39px; height: 39px; border-radius: 50%; color: var(--ink); background: var(--paper); }.whatsapp-option .quick-icon { background: #4bc66c; }.quick-icon svg { width: 20px; height: 20px; }.quick-contact-option strong,.quick-contact-option small { display: block; }.quick-contact-option strong { font-size: 12px; }.quick-contact-option small { color: #b9b6b0; font: 10px var(--mono); margin-top: 2px; }
@media (max-width: 700px) { .quick-contact { right: 15px; bottom: calc(75px + env(safe-area-inset-bottom)); }.quick-contact-toggle { width: 54px; height: 54px; }.quick-contact-panel { width: min(290px, calc(100vw - 30px)); } }

/* Deliberately discreet entry point; Cloudflare Access protects the actual admin route after deployment. */
.admin-mini { position: fixed; z-index: 55; left: 11px; bottom: 10px; color: #77716a; font: 8px var(--mono); letter-spacing: .06em; text-transform: uppercase; opacity: .58; transition: opacity .18s, color .18s; }.admin-mini:hover,.admin-mini:focus-visible { color: var(--red); opacity: 1; }
@media (max-width: 700px) { .admin-mini { bottom: calc(72px + env(safe-area-inset-bottom)); left: 12px; color: #a8a39c; } }

/* Images uploaded from Admin retain the editorial card crop. */
.catalogue-image,.work-image { width: 100%; height: 100%; display: block; object-fit: cover; }.product-art.has-image,.project-visual.has-image { background: var(--ink); }.product-art.has-image:before,.project-visual.has-image:before { content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(180deg, transparent 45%, rgba(0,0,0,.25)); pointer-events: none; }