:root{--company-bg:#030b12;--company-gold:#d9ad73;--company-cream:#f4e6d1;}
*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;scroll-padding-top:100px;}
body{margin:0;padding-top:78px;background:var(--company-bg);color:var(--company-cream);font-family:"Cormorant Garamond",Georgia,serif;line-height:1.5;}
.menu-toggle{width:38px;height:38px;padding:8px;border:1px solid #53616a;background:transparent;flex-direction:column;justify-content:center;gap:5px;cursor:pointer;}
.menu-toggle span{display:block;width:20px;height:2px;background:var(--company-cream);}
img{max-width:100%;height:auto;}a{color:inherit;}button,input{font:inherit;}
.container{width:min(1240px,calc(100% - 64px));margin-inline:auto;}
.company-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;}
.company-skip{position:fixed;top:8px;left:8px;transform:translateY(-150%);z-index:10000;background:var(--company-cream);color:var(--company-bg);padding:10px 20px;}
.company-skip:focus{transform:none;}
a:focus-visible,summary:focus-visible{outline:2px solid var(--company-gold);outline-offset:6px;}
.company-profile-hero{background:var(--company-bg) url("images/display/v1/company/in-good-company-bg.png.webp") center top/cover no-repeat;}
.company-profile-layout{display:grid;grid-template-columns:44% 56%;align-items:end;min-height:620px;border-bottom:1px solid var(--company-gold);}
.company-profile-copy{position:relative;z-index:1;padding:55px 0 58px;}
.company-back,.company-role,.company-button,.company-profile-nav,.company-card-copy span{font-family:Inter,Arial,sans-serif;font-size:12px;letter-spacing:.16em;text-transform:uppercase;}
.company-back{color:var(--company-gold);text-decoration:none;display:inline-block;margin-bottom:40px;}
.company-name{margin:0 0 12px;line-height:1;}
.company-name img{display:block;width:100%;height:auto;max-height:270px;object-fit:contain;object-position:left center;}
.company-role{color:var(--company-gold);letter-spacing:.28em;margin:16px 0;}
.company-lead{font-size:clamp(23px,2.2vw,31px);line-height:1.35;max-width:540px;margin:24px 0;}
.company-button{display:inline-block;padding:14px 20px;border:1px solid var(--company-gold);text-decoration:none;color:var(--company-gold);letter-spacing:.13em;}
.company-button:hover{background:var(--company-gold);color:var(--company-bg);}
.company-profile-portrait{display:block;width:100%;height:auto;align-self:end;max-height:650px;object-fit:contain;object-position:center bottom;}
.company-biography{display:grid;grid-template-columns:1.4fr 1fr;gap:60px;padding-block:48px;border-bottom:1px solid #80674b;}
.company-biography>div+div{border-left:1px solid #80674b;padding-left:48px;}
.company-biography h2{color:var(--company-gold);font-size:clamp(30px,3vw,43px);font-weight:500;line-height:1.1;margin:0 0 16px;}
.company-biography p{font-size:23px;line-height:1.5;margin:0 0 18px;}
.company-sources{font-size:19px;color:var(--company-gold);margin-top:20px;}
.company-sources summary{cursor:pointer;width:fit-content;}.company-sources ul{padding-left:20px;}.company-sources li{margin-block:10px;}.company-sources a{overflow-wrap:anywhere;}
.company-profile-nav{display:flex;justify-content:space-between;gap:24px;padding-block:28px;color:var(--company-gold);letter-spacing:.1em;}
.company-profile-nav a{text-decoration:none;}
.company-index-hero{padding:70px 0 45px;background:linear-gradient(90deg,rgba(3,11,18,.9),rgba(3,11,18,.35)),url("images/display/v1/company/in-good-company-bg.png.webp") center/cover;}
.company-index-hero h1{font-size:clamp(48px,7vw,88px);line-height:1.05;font-weight:500;margin:24px 0;}
.company-index-hero h1 span{color:var(--company-gold);}
.company-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:28px;padding-block:45px 70px;}
.company-card{display:block;text-decoration:none;border:1px solid #26333e;background:#07111b;transition:border-color .2s;}
.company-card:hover{border-color:var(--company-gold);}
.company-card-picture{aspect-ratio:1/1;background:radial-gradient(ellipse at 65% 50%,#123959,transparent 70%),#030b12;overflow:hidden;}
.company-card-picture img{display:block;width:100%;height:100%;object-fit:contain;object-position:center bottom;}
.company-card-copy{padding:20px;}.company-card-copy h2{font-size:29px;font-weight:500;color:var(--company-gold);line-height:1.15;margin:0 0 12px;}
.company-card-copy p{font-size:19px;line-height:1.4;margin:0 0 18px;}.company-card-copy span{font-size:10px;letter-spacing:.08em;color:var(--company-gold);}
@media(max-width:1100px){.company-grid{grid-template-columns:repeat(3,minmax(0,1fr));}.company-profile-layout{min-height:540px;}.company-profile-copy{padding-block:36px;}.company-back{margin-bottom:30px;}.company-biography{gap:36px;}.company-biography>div+div{padding-left:30px;}}
@media(max-width:800px){.container{width:calc(100% - 40px);}.company-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;}.company-profile-layout{grid-template-columns:1fr;min-height:0;}.company-profile-copy{padding:36px 0 24px;}.company-name{max-width:440px;}.company-name img{max-height:230px;}.company-back{margin-bottom:24px;}.company-profile-portrait{max-height:520px;max-width:560px;margin-inline:auto;}.company-profile-hero{background-position:65% top;}.company-biography{grid-template-columns:1fr;gap:30px;padding-block:36px;}.company-biography>div+div{border-left:0;border-top:1px solid #80674b;padding:30px 0 0;}.company-profile-nav{flex-wrap:wrap;font-size:10px;gap:18px;}.company-profile-nav a{max-width:45%;}.company-profile-nav a:nth-child(2){order:3;width:100%;max-width:none;text-align:center;}.company-index-hero{padding-top:44px;}}
@media(max-width:480px){.company-grid{grid-template-columns:1fr;}.company-card-picture{aspect-ratio:1.1;}.company-card-copy h2{font-size:32px;}.company-biography p{font-size:21px;}.company-role{font-size:10px;letter-spacing:.18em;}.company-button{font-size:10px;padding:13px 15px;}.company-lead{font-size:24px;}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto;}.company-card{transition:none;}}

/* Main directory uses biography portraits as temporary card imagery. */
.company-collection{padding-block:38px 65px;}
.company-collection-heading{display:flex;align-items:baseline;justify-content:space-between;gap:24px;border-bottom:1px solid #80674b;padding-bottom:15px;}
.company-collection-heading h2{margin:0;color:var(--company-gold);font-size:32px;font-weight:500;}
.company-collection-heading p{margin:0;font-size:20px;}
.company-index-page .company-grid{width:100%;margin:0;grid-template-columns:repeat(3,minmax(0,1fr));padding-block:28px 0;}
.company-index-page .company-card{display:flex;flex-direction:column;}
.company-index-page .company-card-copy{flex:1;display:flex;flex-direction:column;}
.company-index-page .company-card-copy h3{font-size:32px;font-weight:500;color:var(--company-gold);line-height:1.15;margin:0 0 12px;}
.company-index-page .company-card-copy span{margin-top:auto;padding-top:10px;}
@media(max-width:850px){.company-index-page .company-grid{grid-template-columns:repeat(2,minmax(0,1fr));}.company-collection-heading{display:block;}.company-collection-heading p{margin-top:8px;}}
@media(max-width:480px){.company-index-page .company-grid{grid-template-columns:1fr;}}

/* Uniform directory frames and independent portrait, wordmark and date layers. */
.company-index-page .company-index-hero h1{font-family:"Bebas Neue",Impact,sans-serif;text-transform:uppercase;font-weight:400;font-size:clamp(48px,7vw,88px);}
.company-index-page .company-collection-heading h2{font-family:"Bebas Neue",Impact,sans-serif;text-transform:uppercase;letter-spacing:.045em;font-weight:400;}
.company-index-page .company-grid{column-gap:38px;row-gap:36px;align-items:start;}
.company-index-page .company-card{display:block;position:relative;padding:0 0 88px;border:0;background:transparent;overflow:visible;min-width:0;}
.company-index-page .company-card-picture{display:block;position:relative;isolation:isolate;width:100%;height:0;padding-top:calc(100% - 2px);aspect-ratio:auto;margin:0;border:1px solid #26333e;overflow:visible;}
.company-index-page .company-card-picture>img{position:absolute;inset:0;display:block;width:100%;height:100%;max-width:none;object-fit:contain;object-position:center bottom;z-index:0;}
.company-index-page .company-card-picture::after{content:"";position:absolute;inset:60% 0 0;background:linear-gradient(transparent,rgba(3,11,18,.8));pointer-events:none;z-index:1;}
.company-index-page .company-card:hover .company-card-picture{border-color:var(--company-gold);}
.company-index-page .company-card-name{position:absolute;z-index:2;margin:0;pointer-events:none;display:flex;align-items:flex-end;}
.company-index-page .company-card-name>img{display:block;object-fit:contain;object-position:left bottom;}
.company-index-page .company-life-dates{position:absolute;top:calc(100% - 82px);left:67%;right:0;margin:0;display:flex;flex-direction:column;align-items:stretch;gap:4px;font-family:Inter,Arial,sans-serif;font-size:9px;line-height:1.3;letter-spacing:0;text-align:right;color:var(--company-cream);}
.company-index-page .company-life-dates>span{white-space:nowrap;}
.company-index-page .company-date-rule{display:block;width:100%;height:1px;background:var(--company-gold);opacity:.65;}
@media(max-width:850px){.company-index-page .company-grid{column-gap:30px;}.company-index-page .company-card-name{height:90px;}.company-index-page .company-life-dates{font-size:8px;}}
@media(max-width:480px){.company-index-page .company-card{padding-bottom:98px;}.company-index-page .company-card-name{left:-4%;bottom:-72px;height:110px;}.company-index-page .company-life-dates{top:calc(100% - 92px);font-size:10px;}}

/* Approved instrument treatment; existing navy backgrounds are retained. */
.company-index-page .company-index-hero h1{font-size:clamp(4rem,8.5vw,9rem);line-height:.8;letter-spacing:.02em;color:var(--company-cream);text-shadow:0 9px 35px rgba(0,0,0,.52);max-width:100%;}

.company-index-page .company-card-picture--breakout>img:not(.company-instrument){top:-5%;height:105%;object-position:center bottom;}

@media(max-width:850px){.company-index-page .company-card-name{height:96px;}.company-index-page .company-index-hero h1{font-size:clamp(3.7rem,8.5vw,6rem);}}
@media(max-width:480px){.company-index-page .company-card-name{height:116px;}.company-index-page .company-index-hero h1{font-size:clamp(2.5rem,8.4vw,4rem);line-height:.9;}}

/* Detailed instrument artwork has its own clipped stage below the portraits. */
.company-index-page .company-instrument-stage{position:absolute;inset:0;overflow:hidden;z-index:0;pointer-events:none;}
.company-index-page .company-instrument-stage img{position:absolute;display:block;max-width:none;opacity:.12;object-position:center;filter:none;}
.company-index-page .company-card-picture>img{z-index:1;}
.company-index-page .company-card-picture::after{z-index:2;}
.company-index-page .company-card-name{z-index:3;}
.company-index-page .company-instrument-stage--guitar img{transform:rotate(9deg);}
.company-index-page .company-instrument-stage--bass img{transform:rotate(8deg);}
.company-index-page .company-instrument-stage--harmonica img{transform:rotate(-14deg);}


.company-index-page .company-instrument-stage--vocals img{transform:rotate(13deg);}
.company-index-page .company-instrument-stage--saxophone img{transform:rotate(10deg);}
/* Alternate sides where the portrait leaves more negative space. */
.company-index-page .company-card[href="company-john-primer.html"] .company-instrument-stage--guitar img,
.company-index-page .company-card[href="company-bob-margolin.html"] .company-instrument-stage--guitar img,
.company-index-page .company-card[href="company-carlos-johnson.html"] .company-instrument-stage--guitar img{left:-24%;right:auto;transform:rotate(9deg);}


/* Engraved instrument family, with original navy backgrounds showing through. */
.company-index-page .company-instrument-stage{mix-blend-mode:screen;}
.company-index-page .company-instrument-stage img{opacity:.14;mix-blend-mode:screen;object-fit:cover;}
.company-index-page .company-instrument-stage--guitar img,
.company-index-page .company-instrument-stage--bass img{width:150%;height:85%;right:-26%;top:-5%;transform:rotate(-12deg);}
.company-index-page .company-instrument-stage--harmonica img{width:135%;height:55%;left:-18%;top:3%;transform:none;object-fit:contain;}
.company-index-page .company-instrument-stage--piano img{width:140%;height:78%;right:-24%;top:-5%;transform:none;object-position:center;}
.company-index-page .company-instrument-stage--drums img{width:150%;height:90%;left:-17%;top:-3%;transform:none;object-position:70% center;}
.company-index-page .company-instrument-stage--vocals img{width:100%;height:100%;right:-28%;top:-5%;transform:rotate(10deg);object-fit:contain;}
.company-index-page .company-instrument-stage--saxophone img{width:105%;height:110%;right:-22%;top:-8%;transform:rotate(8deg);object-fit:contain;}
.company-index-page .company-card[href="company-pinetop-perkins.html"] .company-instrument-stage--piano img{width:140%;right:-24%;top:-5%;}
/* The surname's first visible ivory pixels align to the frame baseline. */
.company-index-page .company-card-name{top:100%;bottom:auto;left:-6%;height:0;width:73%;display:block;}
.company-index-page .company-card-name>img{position:absolute;left:0;top:var(--company-name-offset,-48px);width:100%;height:auto;max-width:none;object-fit:initial;}
@media(max-width:480px){.company-index-page .company-card-name{left:-4%;height:0;}}
