/* Optical logo sizing: measure visible artwork, preserve original image assets. */
.logo-tile.yacht-interior-products,.brand-story.yacht-interior-products{--logo-width:320px;--logo-relative:90%;--logo-ratio:2005/349;--image-width:108.32918%;--image-height:207.44986%;--image-left:-4.23940%;--image-top:-45.84527%;--story-logo-width:416px}
.logo-tile.yacht-side-services,.brand-story.yacht-side-services{--logo-width:320px;--logo-relative:90%;--logo-ratio:1968/378;--image-width:110.36585%;--image-height:191.53439%;--image-left:-5.03049%;--image-top:-41.53439%;--story-logo-width:416px}
.logo-tile.yacht-teak-decking,.brand-story.yacht-teak-decking{--logo-width:320px;--logo-relative:90%;--logo-ratio:1990/380;--image-width:109.14573%;--image-height:190.52632%;--image-left:-4.72362%;--image-top:-43.15789%;--story-logo-width:416px}
.logo-tile.yacht-flooring-products,.brand-story.yacht-flooring-products{--logo-width:320px;--logo-relative:90%;--logo-ratio:2087/365;--image-width:100.14375%;--image-height:164.10959%;--image-left:-0.09583%;--image-top:-26.02740%;--story-logo-width:416px}
.logo-tile.yacht-rugs,.brand-story.yacht-rugs{--logo-width:189px;--logo-relative:63%;--logo-ratio:1648/771;--image-width:107.64563%;--image-height:115.04540%;--image-left:-3.76214%;--image-top:-7.91180%;--story-logo-width:245.7px}
.logo-tile.royal-yacht-mattresses,.brand-story.royal-yacht-mattresses{--logo-width:210px;--logo-relative:70%;--logo-ratio:1534/790;--image-width:115.64537%;--image-height:112.27848%;--image-left:-7.82269%;--image-top:-4.30380%;--story-logo-width:273px}
.logo-tile.yacht-towels,.brand-story.yacht-towels{--logo-width:230px;--logo-relative:75%;--logo-ratio:1766/891;--image-width:100%;--image-height:100%;--image-left:0;--image-top:0;--story-logo-width:299px}
.logo-tile.yacht-sun-pads,.brand-story.yacht-sun-pads{--logo-width:230px;--logo-relative:75%;--logo-ratio:1553/904;--image-width:103.02640%;--image-height:107.74336%;--image-left:-1.54540%;--image-top:-3.42920%;--story-logo-width:299px}
.logo-tile.yacht-sunshades,.brand-story.yacht-sunshades{--logo-width:210px;--logo-relative:70%;--logo-ratio:1347/709;--image-width:114.03118%;--image-height:144.42877%;--image-left:-7.05271%;--image-top:-25.81100%;--story-logo-width:273px}
.logo-tile.on-site-boat-care,.brand-story.on-site-boat-care{--logo-width:210px;--logo-relative:70%;--logo-ratio:298/166;--image-width:114.09396%;--image-height:102.40964%;--image-left:-7.04698%;--image-top:-0.60241%;--story-logo-width:273px}
.logo-tile.boat-rental-fleet-management,.brand-story.boat-rental-fleet-management{--logo-width:260px;--logo-relative:84%;--logo-ratio:1648/618;--image-width:107.64563%;--image-height:143.52751%;--image-left:-4.42961%;--image-top:-20.22654%;--story-logo-width:338px}
.logo-tile.fuel-pump-covers,.brand-story.fuel-pump-covers{--logo-width:170px;--logo-relative:57%;--logo-ratio:1396/945;--image-width:110.02865%;--image-height:108.35979%;--image-left:-5.15759%;--image-top:-4.02116%;--story-logo-width:221px}
.logo-tile.boat-cooler-cushions,.brand-story.boat-cooler-cushions{--logo-width:122px;--logo-relative:41%;--logo-ratio:584/599;--image-width:109.58904%;--image-height:106.84474%;--image-left:-7.19178%;--image-top:-1.50250%;--story-logo-width:158.6px}
.logo-tile.harbor-and-thread,.brand-story.harbor-and-thread{--logo-width:340px;--logo-relative:92%;--logo-ratio:497/73;--image-width:100.60362%;--image-height:142.46575%;--image-left:-0.60362%;--image-top:-17.80822%;--story-logo-width:442px}
.logo-tile.resort-cushions,.brand-story.resort-cushions{--logo-width:270px;--logo-relative:86%;--logo-ratio:1808/582;--image-width:120.13274%;--image-height:124.39863%;--image-left:-10.73009%;--image-top:-11.16838%;--story-logo-width:351px}
.logo-tile.jetcraft-interiors,.brand-story.jetcraft-interiors{--logo-width:320px;--logo-relative:90%;--logo-ratio:1380/281;--image-width:111.30435%;--image-height:364.41281%;--image-left:-5.72464%;--image-top:-129.53737%;--story-logo-width:416px}

.brand-logo-frame{display:block;position:relative;flex:none;aspect-ratio:var(--logo-ratio);overflow:hidden;background:#fff}
.logo-grid>.logo-tile>.logo-artwork>.brand-logo-frame{width:min(var(--logo-width),var(--logo-relative))}
.logo-grid>.logo-tile>.logo-artwork>.brand-logo-frame>img,
#brand-stories>.brand-story>.story-logo>.brand-logo-frame>img{
 position:absolute;display:block;width:var(--image-width);height:var(--image-height);left:var(--image-left);top:var(--image-top);max-width:none;max-height:none;object-fit:fill;margin:0;
}
#brand-stories>.brand-story>.story-logo{display:flex;align-items:center;justify-content:center;padding:30px 20px;min-width:0}
#brand-stories>.brand-story>.story-logo>.brand-logo-frame{width:min(var(--story-logo-width),var(--logo-relative))}
.logo-grid>.logo-tile>.logo-artwork>.jip-mark{width:min(280px,90%);container-type:inline-size;gap:5%;justify-content:center}
.logo-grid .jip-mark>.jip-monogram{font-size:24cqi;padding-right:5%;line-height:1;flex:none}
.logo-grid .jip-mark>.jip-name{font-size:5.7cqi;letter-spacing:.08em;line-height:1.65}
.logo-grid .jip-mark>.jip-name>strong{font-size:7cqi;letter-spacing:0;font-weight:500}
#brand-stories .story-logo>.jip-mark{width:min(364px,90%);container-type:inline-size;gap:5%;justify-content:center}
#brand-stories .story-logo .jip-monogram{font-size:24cqi;padding-right:5%;line-height:1;flex:none}
#brand-stories .story-logo .jip-name{font-size:5.7cqi;letter-spacing:.08em;line-height:1.65}
#brand-stories .story-logo .jip-name>strong{font-size:7cqi;letter-spacing:0;font-weight:500}

/* Compact directory cards by 20%, retaining logo and URL sizing. */
.logo-grid>.logo-tile{
  height:200px;
  min-height:200px;
  grid-template-rows:minmax(0,1fr) 24px;
  row-gap:8px;
  padding-top:12px;
  padding-bottom:12px;
}
@media(max-width:700px){
  .logo-grid>.logo-tile{height:176px;min-height:176px}
}

/* Requested 15% increase for these two directory logos. */
.logo-grid>.logo-tile.yacht-rugs>.logo-artwork>.brand-logo-frame,
.logo-grid>.logo-tile.harbor-and-thread>.logo-artwork>.brand-logo-frame{
  transform:scale(1.15);
  transform-origin:center;
}

/* Windshield Covers uses the same visible-artwork frame as the other marine brands. */
.logo-tile.yacht-windshield-covers,
.brand-story.yacht-windshield-covers{
  --logo-width:230px;
  --logo-relative:75%;
  --logo-ratio:1499/800;
  --image-width:100%;
  --image-height:100%;
  --image-left:0;
  --image-top:0;
  --story-logo-width:299px;
}
