/* =======================
   Cursors
   ======================= */
html {
  cursor: url(https://freight.cargo.site/t/thumbnail/w/24/q/75/i/5a5c05ade6278f2f85a9c30d605de9848819a73e812fe0dd1a8105135f68fecd/active.svg), auto !important;
}
.player, iframe {
  cursor: url(https://freight.cargo.site/t/thumbnail/w/24/q/75/i/5a5c05ade6278f2f85a9c30d605de9848819a73e812fe0dd1a8105135f68fecd/active.svg), auto !important;
  pointer-events: auto !important;
}
a {
  cursor: url(https://freight.cargo.site/t/thumbnail/w/24/q/75/i/d4c01d4c9ad2661be6df51fc76382b30d765ae255319af110c2dddc457a3e33a/auto.svg), pointer !important;
}

/* =======================
   Base
   ======================= */
body { background:#fff; color:#000; }
a:active { opacity:.7; }
.page a.active { opacity:1; }
i, em { font-style: italic; }
b, strong { font-weight: bolder; }
sub, sup { position: relative; vertical-align: baseline; }
sub { top: 0.3em; } sup { top: -0.4em; }
s { text-decoration: line-through; }
img { border:0; padding:0; }
ul, ol { margin:0; padding:0 0 0 1em; }
blockquote { margin:0; padding:0 0 0 2em; }
hr { background: rgba(127,127,127,.2); border:0; height:1px; display:block; }
.content img { float:none; margin-bottom:.5em; }

.gallery_image_caption {
  margin:1.2rem 0 .5rem;
  font-size:1.3rem;
  line-height:1.3;
  color: rgba(41,41,41,0.3);
  /* font-family intentionally omitted so Cargo controls fonts */
}

/* =======================
   Editor styles (Cargo-controlled)
   - no font-family here so the panel settings apply
   ======================= */
[data-predefined-style="true"] bodycopy {
  font-size:1.3rem;
  line-height:1.5;
  color:#000;
  font-style:normal;
  font-weight:500;
	font-family: "Neue Haas Grotesk", Icons;
}
[data-predefined-style="true"] bodycopy a {
  color:#000;
  text-decoration:none;
  border-bottom:0;
  padding-bottom:.1em;
}
bodycopy a.image-link,
bodycopy a.icon-link { border-bottom:0; padding-bottom:0; }

[data-predefined-style="true"] h1 {
  margin:0; padding:0;
  font-size:1.6rem;   /* panel can override */
  line-height:1.2;
  color:#000;
  font-weight:500;    /* panel can override */
	font-family: "Neue Haas Grotesk", Icons;
	font-style: normal;
}
[data-predefined-style="true"] h1 a { color:#000; }

[data-predefined-style="true"] h2 {
  margin:0; padding:0;
  font-size:3.7rem;   /* panel can override */
  line-height:1;
  color:#000;
  font-weight:500;    /* panel can override */
	font-family: "Neue Haas Grotesk", Icons /*!null*/;
	font-style: normal;
}
[data-predefined-style="true"] h2 a { color:#000; border-bottom:1px solid rgb(41,41,41); }

[data-predefined-style="true"] small {
  display:inline-block;
  font-size:1.3rem;    /* panel can override */
  font-weight:700;
  color:#bcbcbc;
	font-family: "Neue Haas Grotesk", Icons;
	font-style: normal;
	line-height: 1.5;
}
[data-predefined-style="true"] small a { color:#bcbcbc; border-bottom-width:0; }

/* =======================
   Layout / container
   ======================= */
[data-css-preset] .page { background-color: initial; }
.mobile .page,
[data-css-preset].mobile .page {
  position:relative; min-height:10px; width:100%; max-width:100%; background:transparent;
}
[data-css-preset] .container { margin-left:auto; margin-right:auto; text-align:left; }
[data-css-preset] body { background:#fff; }
[data-css-preset] .container_width { width:100%; }
[data-css-preset] .content_padding { padding:1rem; }
[data-css-preset] text-limit { display:inline-block; max-width:66rem; }

/* =======================
   Thumbnails
   ======================= */
div[thumbnails] { justify-content:flex-start; }
[data-css-preset] .thumbnails { background:transparent; }
[data-css-preset] .thumbnails_width { width:100%; }
[data-css-preset] [thumbnails-gutter] { margin:1rem; }
[data-css-preset] [responsive-layout] [thumbnails-pad] { padding:.6rem; }
[data-css-preset] [responsive-layout] [thumbnails-gutter] { margin:-1.2rem; }

/* Media container */
.thumbnails .thumb_image { outline:0 solid rgba(0,0,0,.12); outline-offset:-1px; position:relative; }

/* No hover transforms anywhere (kills tilt/scale from themes) */
.thumbnails .thumbnail > a {
  display:block; position:relative; border-radius:0 !important;
  overflow:hidden !important; transform:none !important; transition:none !important;
}
.thumbnails .thumb_image,
.thumbnails .thumb_image img,
.thumbnails .thumb_image video,
.thumbnails picture,
.thumbnails picture img { border-radius:inherit !important; display:block; }

/* Title always visible (desktop: #000 -> #b7b7b7 on hover; mobile: black) */
.thumbnails .thumbnail .title {
  font-family: "Neue Haas Grotesk", Icons;
    position:static;
  margin:2.5rem;
  padding:0;
  background:transparent;
  font-size:1.5rem;
  line-height:1.5;
  font-weight:500;
  text-align:right;
  color: rgba(0, 0, 0, 1);         /* always on & #000 by default */
  opacity:1;                       /* no fade-in */
  pointer-events:auto;
  transition: color .2s ease;
}
.thumbnails .thumbnail:hover .title {
  color:#bcbcbc;                      /* darken on hover (desktop) */
}
@media (max-width:767px){
  .thumbnails .thumbnail .title { color:#000; }  /* mobile: always black */
}

/* Remove any legacy overlay effects */
.thumbnails .thumbnail > a::after { display:none !important; }

/* =======================
   Site Menu (inherits fonts)
   ======================= */
[data-css-preset] #site_menu_button {
  color:#000; line-height:1; font-size:28px; padding:6px; background:transparent;
  position:fixed; top:.6rem; right:.6rem;
}
body.mobile #site_menu_button { margin:-6px; font-size:34px; }
#site_menu_button.custom_icon { width:40px; height:auto; }
#site_menu_button.active { display:none; }

#site_menu {
  background:#000; font-size:20px; font-weight:400;
  padding:20px 30px 90px; max-width:400px; min-width:300px; text-align:left; display:flex; justify-content:flex-start;
}
body.mobile #site_menu { width:100%; }
#site_menu .page-link a { color:rgba(255,255,255,.75); }
#site_menu .set-link > a { color:rgba(255,255,255,.75); font-weight:bold; }
#site_menu a:active { opacity:.7; }
#site_menu a.active { opacity:.4; }
#site_menu .close { display:none; color:rgba(255,255,255,.4); line-height:.85em; font-size:45px; }
body.mobile #site_menu .close { display:block; font-size:50px; line-height:1em; }
#site_menu .break { height:28px; }
#site_menu .indent { margin-left:28px; }

/* =======================
   Shop widget (inherits fonts)
   ======================= */
[data-css-preset] #shop_button {
  color:#000; background:transparent; font-size:40px; font-weight:400; line-height:1;
  position:fixed; padding:6px; top:1.2rem; right:1.2rem;
}
#shop_button.text { font-size:2.2rem; padding:0; line-height:1.2; font-weight:400; }
#shop_button.custom_icon { width:40px; height:auto; }
body.mobile #shop_button:not(.text) { margin:-6px; font-size:46px; }

.shop_product { width:100%; max-width:22rem; position:relative; display:block; }
.shop_product .price { font-weight:400; font-size:1.4rem; line-height:1; color:#000; display:block; margin-bottom:1rem; }
.shop_product .dropdown {
  color:#000; font-size:1.4rem; display:inline-block; width:100%;
  border:1px solid rgba(0,0,0,.2);
  background:white url(https://static.cargo.site/assets/images/select-line-arrows.svg) no-repeat right;
  margin-bottom:1rem; line-height:1.2; padding:.8rem 2.5rem .8rem 1rem;
}
.shop_product .button {
  font-size:1.4rem; background:#000; color:#fff; flex:0 0 50%;
  text-align:left; display:inline-block; line-height:1; padding:.8rem 1rem .9rem;
}

/* =======================
   Quick View
   ======================= */
[data-css-preset] .quick-view { padding:2.5rem; height:100%; width:100%; }
body.mobile .quick-view { width:100%; height:100%; margin:0; }
[data-css-preset] .quick-view-background { background:#000; }

.quick-view-caption {
  transition:100ms opacity ease-in-out;
  position:absolute; bottom:0; left:0; right:0; margin:3.5rem 0; text-align:center;
  font-size:1.3rem; font-weight:400; line-height:1.3;
}
.quick-view-caption span { padding:.5rem 1rem; display:inline-block; background:rgba(0,0,0,.5); color:#fff; }

/* =======================
   Gallery / Wallpaper arrows
   ======================= */
.image-gallery-navigation .left-arrow,
.image-gallery-navigation .right-arrow { height:36px; width:36px; }
.image-gallery-navigation .left-arrow .inner-color,
.image-gallery-navigation .right-arrow .inner-color { stroke:#fff; stroke-width:1.5px; }
.image-gallery-navigation .left-arrow .outer-color,
.image-gallery-navigation .right-arrow .outer-color { stroke:rgba(0,0,0,.6); stroke-width:2.5px; }

.wallpaper-navigation .left-arrow,
.wallpaper-navigation .right-arrow { width:36px; height:36px; }
.wallpaper-navigation .left-arrow .inner-color,
.wallpaper-navigation .right-arrow .inner-color { stroke:#fff; stroke-width:1.5px; }
.wallpaper-navigation .left-arrow .outer-color,
.wallpaper-navigation .right-arrow .outer-color { stroke:rgba(0,0,0,.6); stroke-width:2.5px; }

/* =======================
   Feed
   ======================= */
.feed .content_container .page { border-top:0px dashed rgba(0,0,0,.2); }
.feed .content_container .page_container:first-child .page { border-top:0; }

/* =======================
   Audio player (inherits fonts)
   ======================= */
.audio-player{
  max-width:36rem; height:3.3rem; outline:1px solid rgba(0,0,0,0.15); color:rgba(0,0,0,0.6);
  background:#fff; font-size:1.2rem; line-height:1.3;
  text-align:left; margin:1px 1px 1em 1px;
}
body.mobile .audio-player{ max-width:100%; }
.audio-player .separator{ width:1px; background-color:rgba(0,0,0,0.15); }
.audio-player .button{ background:transparent; cursor:black; }
.audio-player .icon{ fill:#000; padding:30%; width:100%; margin:auto; }
.audio-player .buffer{ background:rgba(0,0,0,0.03); }
.audio-player .progress{ background:rgba(0,0,0,0.1); }
.audio-player .progress-indicator{
  border:1px solid #000; width:1px; height:100%; right:0; position:absolute; cursor:black;
}
.audio-player .note-icon{ height:100%; width:3.8rem; padding:1rem; fill:rgba(0,0,0,0.5); }
.audio-player .current-time{ padding-left:1rem; }
.audio-player .total-time{ padding-right:1rem; }

/* =======================
   Utilities / nav
   ======================= */
.site-nav { display:flex; justify-content:space-between; align-items:center; }
.site-nav a { text-decoration:none; }
.nav-right a { margin-left:15px; }

.desktop-only { display:block; }
.mobile-only { display:none; }
@media (max-width:767px){
  .desktop-only { display:none; }
  .mobile-only { display:block; }
}

/* =======================
   Landing / Hero
   ======================= */
.landing { position:relative; width:100%; height:100vh; overflow:hidden; }
.landing-video { position:absolute; inset:0; width:100%; height:100%; z-index:0; pointer-events:none; }
.landing-overlay {
  position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
  z-index:1; text-align:center; color:#fff;
}
.landing-overlay h1 { font-size:3rem; margin-bottom:1.5rem; }
.enter-button {
  font-size:1.2rem; padding:.8rem 2rem; background:#000; color:#fff; text-decoration:none;
  border-radius:9999px; transition:background .3s, color .3s;
}
.enter-button:hover { background:#ffdd00; color:#000; }

/* Hero video cover */
:root { --nav-height: 0px; }
.home-hero { position:relative; width:100%; height:calc(100vh - var(--nav-height)); overflow:hidden; margin:0; padding:0; background:#000; }
.home-hero__video { position:absolute; inset:0; overflow:hidden; }
.home-hero__iframe {
  position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); border:0; pointer-events:none !important; z-index:0;
  width:100vw; height:56.25vw; min-width:177.78vh; min-height:100vh; will-change:transform; backface-visibility:hidden;
}
.home-hero__overlay-link { position:absolute; inset:0; z-index:2; display:block; text-indent:-9999px; }
@media (max-width:767px){
  .home-hero { height:auto; width:100vw; margin-left:calc(50% - 50vw); margin-right:calc(50% - 50vw); background:#000; }
  .home-hero__video { position:relative; width:100vw; height:0; padding-top:56.25%; overflow:hidden; }
  .home-hero__iframe { position:absolute; top:0; left:0; width:100%; height:100%; min-width:0; min-height:0; transform:none; pointer-events:none !important; }
}

/* Smooth in-page scrolling for #projects */
html { scroll-behavior:smooth; }

/* =======================
   Project pages: center column
   ======================= */
html.is-project .container_width { max-width:1200px; margin-left:auto; margin-right:auto; }
html.is-project .content_padding { padding-left:2rem; padding-right:2rem; }
@media (min-width:1600px){
  html.is-project .container_width { max-width:1320px; }
}

/* Optional: right column content max width on project pages */
html.is-project .content > *:not(.thumbnails):not(.home-hero):not(.gm-ar-tall) {
  max-width: 900px;
  margin-left: auto;
  margin-right: 5vw;
}
@media (max-width: 1024px) {
  html.is-project .content > *:not(.thumbnails):not(.home-hero):not(.gm-ar-tall) {
    max-width: 100%;
    margin-right: 0;
    margin-left: 0;
    padding: 0 1.5rem;
  }
}

/* =======================
   Home: full-bleed thumbnails, no gaps, no transforms
   ======================= */
html.is-home .thumbnails_width { width:100vw !important; }
html.is-home [thumbnails-gutter] {
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}
html.is-home [thumbnails-pad] { padding:0 !important; }
html.is-home .thumbnails .thumbnail { margin:0 !important; }
html.is-home .thumbnails .thumbnail > a,
html.is-home .thumbnails .thumbnail > a:hover {
  transform:none !important; transition:none !important;
}

/* Tall video: centered, rounded, subtle depth, no white bands */
.gm-ar-tall{
  /* tweak this width */
  width: 60%;
  margin: 5rem auto;        /* breathing room above/below and centered */
  position: relative;
  overflow: hidden;
  border-radius: 18px;
  box-shadow: 0 12px 36px rgba(0,0,0,0.08);

  /* reserve the correct tall space without padding tricks */
  /* If your video changed, adjust the numbers below (width / height) */
  aspect-ratio: 1440 / 3148;  /* ~2.5x taller than wide; tune if needed */

  /* make sure no background shows inside the rounded box */
  background: transparent;
}

/* Make the player fill the reserved area perfectly */
.gm-ar-tall iframe{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
  display: block;
  border-radius: inherit;
}

/* Mobile: full-ish width, still centered */
@media (max-width: 767px){
  .gm-ar-tall{
    width: 85%;
    margin: 3rem auto;
    border-radius: 12px;
    box-shadow: 0 8px 24px rgba(0,0,0,0.08);

    
  }
}

/* =======================
   Nav hover color
   ======================= */
.site-nav a {
  color: #000;                    /* default color */
  text-decoration: none;
  transition: color 0.2s ease;    /* smooth fade */
}

.site-nav a:hover {
  color:#bcbcbc;       /* hover color */
}