.hero{display:block;isolation:isolate;min-height:680px;height:100svh;max-height:1250px;padding:0;background:#f6f5f2;overflow:hidden}
.hero::before{content:"";position:absolute;inset:0;z-index:5;pointer-events:none;opacity:.14;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 240 240' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='t'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.7' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' opacity='.4' filter='url(%23t)'/%3E%3Cg stroke='%23888' stroke-width='.3' opacity='.55'%3E%3Cpath d='M34 52l8 -2m100 90l13 -6m-80 60l1 -8m100 -155l5 1M30 230l-5 -4'/%3E%3C/g%3E%3C/svg%3E")}
.hero-labels{position:absolute;top:20.8%;left:12%;right:12%;display:flex;justify-content:space-between;gap:24px;font-weight:300;font-size:clamp(16px,1.75vw,36px);line-height:1;letter-spacing:-.065em;text-transform:uppercase;color:#727270;z-index:1}
.hero-type{position:absolute;left:11.7%;top:23.4%;width:76.6%;height:55%;overflow:visible;z-index:1}
.hero h1.visually-hidden{position:absolute!important;display:block}
.hero-cutout{position:absolute;z-index:2;bottom:4%;left:53%;transform:translateX(-50%);height:79%;width:43%;margin:0;mask-image:linear-gradient(#000 0%,#000 86%,transparent 100%);-webkit-mask-image:linear-gradient(#000 0%,#000 86%,transparent 100%);pointer-events:none}
.hero-cutout img{height:100%;width:100%;object-fit:contain;object-position:center bottom;filter:grayscale(1) contrast(1.06)}
.hero-identity{position:absolute;left:11.7%;bottom:10.2%;z-index:3;display:flex;align-items:flex-start;gap:13px;color:#646463;text-transform:uppercase;line-height:.99}
.hero-slashes{font:700 clamp(42px,4vw,82px)/.82 Arial,sans-serif;color:#cb242a;letter-spacing:-.1em}
.hero-identity p{margin:0}.hero-editor-name{font-size:clamp(25px,2.6vw,54px);font-weight:500;letter-spacing:-.065em}.hero-editor-role{font-size:clamp(22px,2.2vw,44px);font-weight:400;letter-spacing:-.065em;margin-top:5px!important}.hero-editor-location{font-size:clamp(11px,.8vw,16px);font-weight:400;letter-spacing:.04em;line-height:1.5;margin-top:16px!important}
.hero-scroll{position:absolute;right:12%;bottom:8%;z-index:6;font-size:12px;letter-spacing:.06em;text-transform:uppercase;display:flex;align-items:center;gap:14px;color:#5a5a58}.hero-scroll span{font-size:25px}.hero-scroll:focus-visible{outline:2px solid #c42e35;outline-offset:8px}
@media(max-width:800px){.hero{height:100svh;min-height:700px;max-height:1100px}.hero-labels{left:7%;right:7%;top:21%;font-size:clamp(13px,2.3vw,20px);letter-spacing:-.045em}.hero-type{left:5%;width:90%;top:21%;height:40%}.hero-cutout{left:57%;width:74%;height:68%;bottom:11%}.hero-identity{left:7%;bottom:10%;gap:10px}.hero-editor-name{font-size:clamp(27px,4vw,36px)}.hero-editor-role{font-size:clamp(21px,3.6vw,31px)}.hero-slashes{font-size:44px}.hero-editor-location{font-size:11px;margin-top:12px!important}.hero-scroll{right:7%;bottom:4%}}
@media(max-width:480px){.hero-labels{top:18%;font-size:12px}.hero-type{top:18%;height:34%}.hero-cutout{width:100%;left:54%;height:65%;bottom:13%}.hero-identity{bottom:8%;left:6%;gap:9px}.hero-editor-name{font-size:28px}.hero-editor-role{font-size:23px}.hero-editor-location{font-size:10px}.hero-scroll{bottom:3%;font-size:10px}.hero-slashes{font-size:42px}}
@media(prefers-reduced-motion:reduce){.hero *{animation:none!important}}

/* Final cover artwork: the approved portrait and exact reference composition. */
.hero{
  height:auto!important;
  min-height:0!important;
  max-height:none!important;
  aspect-ratio:1648/927;
  padding:0!important;
  background:#f6f5f2 url("assets/abdallah-accurate-hero.png") center/contain no-repeat!important;
}
.hero::before,
.hero-labels,
.hero-type,
.hero-cutout,
.hero-identity,
.hero-scroll{display:none!important}
