:root{--bg:#090b09;--panel:#101310;--text:#f6f3ea;--muted:#aaaDA7;--green:#9bd72f;--line:rgba(255,255,255,.13);--max:1240px}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--text);background:var(--bg);font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;line-height:1.55}a{color:inherit}.wrap{width:min(var(--max),calc(100% - 64px));margin:auto}.site-header{position:absolute;z-index:20;top:0;left:0;right:0;border-bottom:1px solid rgba(255,255,255,.11);background:linear-gradient(to bottom,rgba(0,0,0,.64),rgba(0,0,0,.04))}.nav{height:86px;display:flex;align-items:center;gap:34px}.brand{font-size:1rem;font-weight:950;letter-spacing:.1em;text-decoration:none;white-space:nowrap}.brand span{color:var(--green)}.custom-logo{max-height:48px;width:auto}.nav nav{margin-left:auto}.menu{list-style:none;display:flex;gap:28px;margin:0;padding:0}.menu a{text-decoration:none;font-size:.72rem;font-weight:800;letter-spacing:.13em}.menu a:hover{color:var(--green)}.nav-cta{font-size:.72rem;font-weight:900;letter-spacing:.12em;text-decoration:none;border:1px solid rgba(255,255,255,.4);padding:10px 14px}.hero{position:relative;min-height:100svh;display:flex;align-items:center;background-image:var(--hero);background-size:cover;background-position:center;overflow:hidden}.hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.78) 0%,rgba(0,0,0,.56) 33%,rgba(0,0,0,.16) 66%,rgba(0,0,0,.08) 100%),linear-gradient(0deg,var(--bg) 0%,transparent 25%)}.hero-copy{position:relative;z-index:2;padding-top:95px;margin-left:max(32px,calc((100vw - var(--max))/2));margin-right:auto;width:min(660px,calc(100% - 64px))}.eyebrow{font-size:.7rem;font-weight:900;letter-spacing:.25em;color:var(--green);text-transform:uppercase}.hero h1{font-size:clamp(3.7rem,7vw,7.5rem);line-height:.82;margin:.25em 0 .18em;letter-spacing:-.075em;max-width:720px}.hero h2{font-size:clamp(1.25rem,2.2vw,2rem);font-weight:450;margin:0 0 16px}.hero p{font-size:clamp(1rem,1.4vw,1.14rem);max-width:540px;color:#e3e0d8;margin:0}.buttons{display:flex;flex-wrap:wrap;gap:10px;margin-top:30px}.btn{display:inline-flex;gap:12px;align-items:center;justify-content:center;min-height:48px;padding:0 20px;border:1px solid rgba(255,255,255,.35);text-decoration:none;font-size:.72rem;font-weight:900;letter-spacing:.08em;background:rgba(0,0,0,.28);backdrop-filter:blur(10px)}.btn.primary{background:var(--green);color:#0b0e08;border-color:var(--green)}.scroll-cue{position:absolute;z-index:3;right:34px;bottom:38px;text-decoration:none;font-size:.6rem;font-weight:800;letter-spacing:.2em;writing-mode:vertical-rl;color:#d5d3cd}.scroll-cue span{display:block;width:1px;height:45px;background:var(--green);margin:0 auto 10px}section{padding:110px 0}.story-section{background:radial-gradient(circle at 85% 50%,rgba(155,215,47,.08),transparent 28%)}.intro{display:grid;grid-template-columns:1.25fr .75fr;gap:100px;align-items:center}.intro h2,.section-title{font-size:clamp(2.8rem,5vw,5rem);line-height:.95;margin:.14em 0 .4em;letter-spacing:-.055em}.intro h2 em{font-style:normal;color:var(--green)}.intro p{color:var(--muted);font-size:1.05rem;max-width:680px}.intro .lead{font-size:1.3rem;color:#e4e2dc}.logo-stage{text-align:center}.round-logo{width:min(100%,330px);aspect-ratio:1;object-fit:cover;border-radius:50%;display:block;margin:auto;border:1px solid var(--line);box-shadow:0 35px 90px rgba(0,0,0,.5)}.logo-stage span{display:block;margin-top:20px;font-size:.62rem;letter-spacing:.22em;color:#81847f}.worlds{border-top:1px solid var(--line)}.section-head{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:end}.section-head p{color:var(--muted);max-width:530px;margin:0 0 26px}.pillars{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;margin-top:52px;background:var(--line);border:1px solid var(--line)}.card{min-height:330px;padding:30px;background:#0d100d;display:flex;flex-direction:column}.card small{color:var(--green);font-size:.65rem;letter-spacing:.2em}.card b{display:block;font-size:1.75rem;margin:45px 0 14px;letter-spacing:-.03em}.card p{margin:0;color:var(--muted);font-size:.95rem}.card a{margin-top:auto;text-decoration:none;font-size:.65rem;font-weight:900;letter-spacing:.12em;color:#dfe0da}.card:hover{background:#141814}.card:hover a{color:var(--green)}.band{background:#111411;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.format-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:90px;align-items:center}.format-grid>div>p{color:var(--muted);max-width:430px}.flow{border-top:1px solid var(--line)}.step{display:grid;grid-template-columns:70px 1fr;align-items:center;padding:21px 0;border-bottom:1px solid var(--line)}.step small{color:var(--green);font-size:.65rem;letter-spacing:.2em}.step strong{font-size:clamp(1.25rem,2.2vw,2rem);letter-spacing:.03em}.social{background:linear-gradient(135deg,#0a0c0a,#111610)}.social-inner{display:grid;grid-template-columns:1fr 1fr;gap:90px}.social-inner>div>p{color:var(--muted);max-width:520px}.social-links{border-top:1px solid var(--line)}.channel{display:flex;align-items:center;justify-content:space-between;padding:18px 4px;border-bottom:1px solid var(--line);text-decoration:none;font-size:1rem;font-weight:800}.channel b{color:var(--green)}.channel:hover{padding-left:10px;color:var(--green)}.site-footer{border-top:1px solid var(--line);padding:42px 0;color:#8f918c;font-size:.8rem}.footer-inner{display:grid;grid-template-columns:1fr auto;gap:20px;align-items:end}.footer-inner>div:first-child b{display:block;color:#fff;letter-spacing:.1em}.footer-inner>div:first-child span{display:block;font-size:.62rem;letter-spacing:.16em;margin-top:4px}.footer-links{display:flex;gap:18px}.footer-links .menu{gap:18px}.footer-inner small{grid-column:1/-1;border-top:1px solid var(--line);padding-top:20px}.content-main{padding:140px 0 80px}.content-wrap{max-width:900px}.content-wrap h1{font-size:clamp(2.2rem,5vw,4.2rem);line-height:1.05}.entry-content{font-size:1.08rem;color:#ddd}.entry-content img,.wp-post-image{max-width:100%;height:auto}.post-card{padding:0 0 55px;margin:0 0 55px;border-bottom:1px solid var(--line)}.entry-title a{text-decoration:none}
@media(max-width:900px){.wrap{width:min(var(--max),calc(100% - 36px))}.nav{height:72px}.nav-cta{display:none}.menu{gap:16px}.menu li:nth-child(2),.menu li:nth-child(4){display:none}.hero-copy{margin-left:18px;width:calc(100% - 36px)}.hero{background-position:center}.intro,.section-head,.format-grid,.social-inner{grid-template-columns:1fr;gap:45px}.pillars{grid-template-columns:1fr 1fr}.logo-stage{max-width:330px}.scroll-cue{display:none}}
@media(max-width:560px){.menu li:not(:first-child):not(:last-child){display:none}.hero{min-height:92svh}.hero-shade{background:linear-gradient(90deg,rgba(0,0,0,.78),rgba(0,0,0,.25)),linear-gradient(0deg,var(--bg),transparent 30%)}.hero h1{font-size:clamp(3.2rem,17vw,5rem)}section{padding:78px 0}.pillars{grid-template-columns:1fr}.card{min-height:250px}.footer-inner{grid-template-columns:1fr}.footer-links{flex-wrap:wrap}}


/* BOOMER JOE 1.2 — supplied visual as exact hero artwork */
.hero-design{display:block;position:relative;min-height:0;height:auto;background:none;overflow:hidden;padding:0;}
.hero-design-image{display:block;width:100%;aspect-ratio:1536/1024;background-image:url('../images/hero-design.png');background-repeat:no-repeat;background-position:center top;background-size:100% auto;}
.hero-design .hero-hotspots{position:absolute;inset:0;pointer-events:none;}
.hero-design .hotspot{position:absolute;display:block;pointer-events:auto;}
.hero-design .hotspot-story{left:28%;top:54%;width:14%;height:6%;}
.hero-design .hotspot-youtube{left:42.5%;top:54%;width:12%;height:6%;}
@media(max-width:900px){
 .hero-design{height:100svh;min-height:680px;background:#080b0d;}
 .hero-design-image{position:absolute;inset:0;width:100%;height:100%;aspect-ratio:auto;background-size:auto 100%;background-position:left top;}
 .hero-design .hero-hotspots{display:none;}
}
@media(max-width:560px){
 .hero-design{height:100svh;min-height:620px;}
 .hero-design-image{background-size:auto 100%;background-position:left top;}
}

/* BOOMER JOE 1.3 — responsive treatment of supplied master artwork */
html,body{max-width:100%;overflow-x:hidden}
.home .site-header{display:none!important}
.mobile-topic-grid{display:none}
@media(max-width:900px){
 .hero-design{height:auto;min-height:0;background:#080b0d;padding:0}
 .hero-design-image{position:relative;inset:auto;width:100%;height:auto;aspect-ratio:900/670;background-image:url('../images/hero-mobile.jpg');background-size:100% 100%;background-position:center;background-repeat:no-repeat}
 .hero-design .hero-hotspots{display:none}
 .home .worlds-preview{display:none}
}
@media(max-width:560px){
 .hero-design{height:auto;min-height:0;padding-top:0}
 .hero-design-image{aspect-ratio:900/670;background-size:100% 100%;background-position:center}
 .mobile-topic-grid{display:grid;grid-template-columns:1fr;gap:0;background:#080b0d}
 .mobile-topic{position:relative;display:block;width:100%;aspect-ratio:384/190;overflow:hidden;border-top:1px solid rgba(255,255,255,.12);text-decoration:none;background-size:cover;background-position:center}
 .mobile-topic.road{background-image:url('../images/road.jpg')}
 .mobile-topic.music{background-image:url('../images/music.jpg')}
 .mobile-topic.people{background-image:url('../images/people.jpg')}
 .mobile-topic.second-life{background-image:url('../images/second-life.jpg')}
 .story-section{padding-top:72px}
}


/* BOOMER JOE 1.4 — desktop first-screen composition
   Mobile behavior from 1.3 remains unchanged. */
@media(min-width:901px){
  .hero-design{
    height:82svh;
    min-height:560px;
    background:#080b0d;
    padding:0;
  }
  .hero-design-image{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    aspect-ratio:auto;
    background-image:url('../images/hero-desktop.jpg');
    background-size:cover;
    background-position:center top;
    background-repeat:no-repeat;
  }
  .hero-design .hotspot-story{
    left:28%;
    top:72%;
    width:14%;
    height:8%;
  }
  .hero-design .hotspot-youtube{
    left:42.5%;
    top:72%;
    width:12%;
    height:8%;
  }
  .mobile-topic-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    width:100%;
    height:18svh;
    min-height:130px;
    background:#080b0d;
  }
  .mobile-topic{
    display:block;
    min-width:0;
    height:100%;
    border-top:1px solid rgba(255,255,255,.12);
    border-right:1px solid rgba(255,255,255,.08);
    background-size:cover;
    background-position:center;
    background-repeat:no-repeat;
  }
  .mobile-topic:last-child{border-right:0}
  .mobile-topic.road{background-image:url('../images/road.jpg')}
  .mobile-topic.music{background-image:url('../images/music.jpg')}
  .mobile-topic.people{background-image:url('../images/people.jpg')}
  .mobile-topic.second-life{background-image:url('../images/second-life.jpg')}
}


/* BOOMER JOE 1.5 — desktop viewport balance
   Keep mobile 1.3/1.4 behavior unchanged.
   On desktop, reserve enough of the first viewport for the complete topic cards. */
@media(min-width:901px){
  .hero-design{
    height:75svh;
    min-height:520px;
  }
  .mobile-topic-grid{
    height:25svh;
    min-height:180px;
  }
  .mobile-topic{
    background-size:cover;
    background-position:center center;
  }
}

/* BOOMER JOE 1.6 — true desktop first-viewport fit
   The previous min-heights overrode the 75/25 split on common laptop/desktop viewport heights.
   Remove those constraints on desktop so hero + all four topic cards total exactly 100svh. */
@media (min-width:901px){
  .hero-design{
    height:74svh;
    min-height:0;
  }
  .mobile-topic-grid{
    height:26svh;
    min-height:0;
  }
  .mobile-topic{
    min-height:0;
    background-size:cover;
    background-position:center center;
  }
}

/* Original-photo career flash in the STORY section. */
.career-flash{margin-top:42px;margin-bottom:70px}
.career-flash img{display:block;width:100%;height:auto;border:1px solid var(--line)}
@media(max-width:640px){.career-flash{margin-top:30px;margin-bottom:46px}.career-flash img{width:calc(100% + 32px);max-width:none;margin-left:-16px}}

/* 1.8.1: Real links over the Story and YouTube labels baked into hero art. */
.hero-design .hero-hotspots{display:block;z-index:5;pointer-events:none}
.hero-design .hotspot{z-index:1;pointer-events:auto}
.hero-design .hotspot:focus-visible{outline:3px solid #b9d74e;outline-offset:2px}
@media(min-width:901px){
  .hero-design .hotspot-story-nav{left:41.8%;top:2.5%;width:5.1%;height:7%}
  .hero-design .hotspot-story{left:27.8%;top:72%;width:14%;height:11%}
  .hero-design .hotspot-youtube{left:42.3%;top:72%;width:12%;height:11%}
}
@media(max-width:900px){
  .hero-design .hotspot-story-nav{display:none}
  .hero-design .hotspot-story{left:47.5%;top:70.8%;width:24%;height:9.5%}
  .hero-design .hotspot-youtube{left:72.5%;top:70.8%;width:20%;height:9.5%}
}

/* 1.8.3: The artwork and hit areas share the same intrinsic aspect ratio.
   Background cover previously cropped the artwork without moving the links. */
.hero.hero-design{height:auto;min-height:0;display:block;padding:0;overflow:hidden}
.hero-design .hero-design-image{position:relative;inset:auto;width:100%;height:auto;aspect-ratio:1536 / 750;background-image:url('../images/hero-desktop.jpg');background-size:100% 100%;background-position:center;background-repeat:no-repeat}
.hero-design .hero-hotspots{position:absolute;inset:0;display:block;z-index:5;pointer-events:none}
.hero-design .hotspot{position:absolute;display:block;pointer-events:auto;z-index:6}
.hero-design .hotspot-story-nav{left:42%;top:2.2%;width:5.2%;height:7%}
.hero-design .hotspot-story{left:28%;top:74.4%;width:13.7%;height:7.5%}
.hero-design .hotspot-youtube{left:42.5%;top:74.4%;width:11.7%;height:7.5%}
@media(max-width:900px){
  .hero-design .hero-design-image{aspect-ratio:900 / 670;background-image:url('../images/hero-mobile.jpg')}
  .hero-design .hotspot-story-nav{display:none}
  .hero-design .hotspot-story{left:47.7%;top:71.5%;width:23.3%;height:8.2%}
  .hero-design .hotspot-youtube{left:72.8%;top:71.5%;width:19.5%;height:8.2%}
}

/* 1.8.4: No small Story hotspot remains over the paragraph. */
.hero-design .hotspot-story{display:none}

/* 1.8.5: The verified current theme links only the visible Story button. */
.hero-design .hotspot-story{display:block}
@media(min-width:901px){
  .hero-design .hotspot-story{left:28%;top:74.4%;width:13.7%;height:7.5%}
}
@media(max-width:900px){
  .hero-design .hotspot-story{left:47.7%;top:71.5%;width:23.3%;height:8.2%}
}

/* 1.8.6: More of the STORY and its full Career Flash fits after #story navigation. */
@media(min-width:901px){
  #story.story-section{padding-top:44px;padding-bottom:70px}
  #story .career-flash{width:min(1050px,calc(100% - 64px));margin-top:26px;margin-bottom:0}
}

/* 1.8.7: One compact horizontal photo sequence, controlled by visitor. */
#story .career-flash{position:relative}
#story .career-controls{position:absolute;top:14px;right:14px;z-index:3;display:flex;gap:14px;align-items:center;padding:6px 8px 6px 12px;background:rgba(8,11,9,.86);border:1px solid var(--line)}
#story .career-controls span{color:#d9dda6;font-size:.62rem;font-weight:800;letter-spacing:.12em}
#story .career-controls>div{display:flex;gap:5px}
#story .career-controls button{width:36px;height:36px;border:1px solid #8eaa47;background:#182017;color:#eff5dd;font-size:1.2rem;cursor:pointer}
#story .career-controls button:disabled{opacity:.35;cursor:default}
#story .career-controls button:focus-visible,#story .career-track:focus-visible{outline:2px solid var(--green);outline-offset:2px}
#story .career-track{display:flex;gap:12px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scroll-behavior:smooth;scrollbar-width:thin;scrollbar-color:#799e37 #121712}
#story .career-slide{flex:none;margin:0;scroll-snap-align:start;min-width:0;background:#101410}
#story .career-slide-first{width:100%}
#story .career-slide-photo{width:min(62%,560px)}
#story .career-slide img{display:block;width:100%;height:auto;border:1px solid var(--line)}
#story .career-slide-photo img{height:400px;object-fit:cover;object-position:center}
#story .career-slide figcaption{padding:8px 2px;color:#a4ada0;font-size:.68rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase}
@media(max-width:900px){
 #story .career-controls span{display:none}
 #story .career-controls{top:8px;right:8px}
 #story .career-slide-first{width:100%}
 #story .career-slide-photo{width:82%}
 #story .career-slide-photo img{height:300px}
}

/* 1.8.8: Five-image panels share the same proportions as the opening flash. */
#story .career-slide-five{width:100%}
#story .career-five-images{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;width:100%;aspect-ratio:2 / 1;padding:8px;border:1px solid var(--line)}
#story .career-five-images img{width:100%;height:100%;min-height:0;object-fit:cover;border:1px solid #4d5348}
@media(prefers-reduced-motion:reduce){#story .career-track{scroll-behavior:auto}}

/* 1.8.9: Equal-size photo panels; title stays outside the moving track. */
#story .career-track{aspect-ratio:2400 / 775}
#story .career-slide-panel{width:100%;height:100%;aspect-ratio:2400 / 775}
#story .career-slide-panel img{display:block;width:100%;height:100%;object-fit:contain;border:0}
#story .career-fixed-caption{padding:14px 22px 20px;background:#0c1011;border:1px solid var(--line);border-top:0}
#story .career-fixed-caption span{display:block;color:#b9d74e;font-size:.76rem;letter-spacing:.12em}
#story .career-fixed-caption strong{display:block;margin:6px 0 3px;color:#f2f0e9;font-size:clamp(1.6rem,4vw,3.3rem);line-height:1.05;letter-spacing:-.045em}
#story .career-fixed-caption p{margin:0;color:#c7cbc6;font-size:clamp(.8rem,1.3vw,1rem)}
@media(max-width:600px){#story .career-fixed-caption{padding:11px 13px 16px}}

/* Mobile: undo the older full-bleed offset that clipped the first letters. */
@media(max-width:640px){
  #story .career-flash .career-slide-panel img{width:100%;max-width:100%;margin-left:0}
  #story .career-track{width:100%;max-width:100%}
  #story .career-fixed-caption{overflow-wrap:normal}
}

/* 1.8.17: Clickable areas aligned to the social icons baked into desktop art. */
@media(min-width:901px){
 .hero-design .hotspot-social-youtube{left:73.7%;top:2.1%;width:2.6%;height:7.2%}
 .hero-design .hotspot-social-instagram{left:76.9%;top:2.1%;width:2.6%;height:7.2%}
 .hero-design .hotspot-social-tiktok{left:79.9%;top:2.1%;width:2.6%;height:7.2%}
 .hero-design .hotspot-social-spotify{left:83%;top:2.1%;width:2.6%;height:7.2%}
 .hero-design .hotspot-follow{left:86.4%;top:2.5%;width:9.7%;height:5.8%}
}
@media(max-width:900px){
 .hero-design .hotspot-social-youtube,.hero-design .hotspot-social-instagram,
 .hero-design .hotspot-social-tiktok,.hero-design .hotspot-social-spotify,
 .hero-design .hotspot-follow{display:none}
}

/* 1.8.18: Visible social links beside the artwork's desktop header. */
.hero-design .hero-social-pill,.hero-design .hero-mobile-follow{
 position:absolute;z-index:8;pointer-events:auto;display:flex;align-items:center;justify-content:center;
 min-height:36px;padding:5px 13px;border:1px solid #9bd72f;border-radius:3px;
 background:rgba(8,13,12,.86);color:#f6f3ea;text-decoration:none;
 font-size:12px;font-weight:800;letter-spacing:.06em;line-height:1
}
.hero-design .hero-social-pill:hover,.hero-design .hero-mobile-follow:hover{background:#9bd72f;color:#0b0e08}
.hero-design .hero-social-pill:focus-visible,.hero-design .hero-mobile-follow:focus-visible{outline:3px solid #fff;outline-offset:2px}
@media(min-width:901px){
 .hero-design .hero-facebook{top:11%;right:9%}
 .hero-design .hero-x{top:11%;right:4%}
 .hero-design .hero-mobile-follow{display:none}
}
@media(max-width:900px){
 .hero-design .hero-social-pill{display:none}
 .hero-design .hero-mobile-follow{top:14px;right:14px;min-height:42px;padding:8px 15px}
}

/* 1.8.19: Real desktop header, with all social symbols in one consistent row. */
.hero-design .hero-desktop-nav{display:none}
@media(min-width:901px){
 .hero-design .hotspot-story-nav,.hero-design .hotspot-social-youtube,
 .hero-design .hotspot-social-instagram,.hero-design .hotspot-social-tiktok,
 .hero-design .hotspot-social-spotify,.hero-design .hotspot-follow{display:none}
 .hero-design .hero-desktop-nav{
  position:absolute;z-index:10;top:0;left:36%;right:0;height:11.2%;
  display:flex;align-items:center;justify-content:flex-end;gap:clamp(10px,1.1vw,22px);
  padding:0 clamp(16px,3.8vw,60px) 0 22px;
  background:#19242a;color:#f5f5f3;pointer-events:auto
 }
 .hero-design .hero-nav-items,.hero-design .hero-nav-social{display:flex;align-items:center;white-space:nowrap}
 .hero-design .hero-nav-items{gap:clamp(9px,1.45vw,24px)}
 .hero-design .hero-nav-items a{font-size:clamp(9px,.75vw,12px);font-weight:850;letter-spacing:.045em;text-decoration:none}
 .hero-design .hero-nav-social{gap:clamp(4px,.45vw,8px);border-left:1px solid #879299;padding-left:clamp(9px,1vw,16px)}
 .hero-design .hero-nav-social a,.hero-design .hero-nav-social .pending{width:clamp(22px,2.1vw,32px);height:32px;display:flex;align-items:center;justify-content:center;color:#f5f5f3}
 .hero-design .hero-nav-social svg{width:22px;height:22px;display:block}
 .hero-design .hero-nav-social .pending{opacity:.55}
 .hero-design .hero-nav-follow{border:1px solid #9bd72f;border-radius:3px;padding:10px clamp(12px,1.5vw,25px);font-size:clamp(9px,.75vw,12px);font-weight:850;letter-spacing:.13em;white-space:nowrap;text-decoration:none}
 .hero-design .hero-desktop-nav a:hover{color:#9bd72f}
 .hero-design .hero-desktop-nav a:focus-visible{outline:2px solid #9bd72f;outline-offset:3px}
}
@media(min-width:901px) and (max-width:1100px){
 .hero-design .hero-desktop-nav{left:29%;padding-right:12px;gap:8px}
 .hero-design .hero-nav-items{gap:8px}
}