/* Minerals page (builds on petroleum.css) */
.pet-hero.min-hero{background:url(/assets/min-hero.jpg) 70% center/cover no-repeat,#0B2545}
@media (orientation:portrait) and (max-width:1024px){
  .pet-hero.min-hero{background:linear-gradient(180deg,rgba(11,37,69,0) 0%,rgba(11,37,69,0) 62%,rgba(11,37,69,.92) 88%,#0B2545 100%) top center/100% calc((100vw - 24px) * 1.25) no-repeat,url(/assets/min-hero-portrait.jpg) top center/100% auto no-repeat,#0B2545}
}
@media (orientation:landscape) and (max-height:500px) and (max-width:950px){
  .pet-hero.min-hero{background-position:85% center}
}

/* Iraq's minerals and industrial commodities: square tiles */
.pet-page .sh>div{max-width:640px}
.pet-page .sh .eb{margin:0 0 14px;max-width:none;font-size:12px;line-height:normal;letter-spacing:2px;color:#CE1126}
.tl-key{display:flex;flex-wrap:wrap;gap:8px 24px;margin:-12px 0 24px;font-size:14px;color:#3D4B5F}
.tl-key span{display:flex;align-items:center;gap:8px}
.tl-key i,.tl-s i{display:block;width:12px;height:12px;border-radius:3px;flex:none}
.tl-key .m i,.tl.m .tl-s i{background:#CE1126}
.tl-key .c i,.tl.c .tl-s i{background:#0B2545}
.tls{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.tl{aspect-ratio:1/1;container-type:inline-size;background:#F6F5F3;border:1px solid #DCDDDF;border-radius:16px;overflow:hidden;transition:border-color .2s,box-shadow .2s}
.tl:hover{border-color:#C3C9D2;box-shadow:0 8px 24px rgba(11,37,69,.08)}
.tl-in{height:100%;box-sizing:border-box;padding:22px 22px 24px;display:flex;flex-direction:column}
.tl-top{display:flex;justify-content:space-between;align-items:flex-start}
.tl-s{display:flex;align-items:center;gap:10px;font-family:Archivo,sans-serif;font-weight:700;font-size:40px;line-height:1;color:#CE1126;letter-spacing:-1px}
.tl-i{font-size:12px;font-weight:600;color:#4E5B6E;padding-top:4px}
.tl h3{margin:auto 0 0;font-size:17px;font-weight:600;line-height:1.25;color:#0B2545}
.tl-f{margin:6px 0 0;font-size:13.5px;line-height:1.55;color:#3D4B5F}
.tl-sh{display:none;margin:4px 0 0;font-size:13px;line-height:1.4;color:#4E5B6E}
/* small tiles: short uses line instead of the full description */
@container (max-width:280px){
  .tl-f{display:none}.tl-sh{display:block}
  .tl-in{padding:16px 16px 18px}
  .tl-s{font-size:32px;gap:8px}
  .tl h3{font-size:15px}
}
@container (max-width:200px){
  .tl-in{padding:14px 14px 15px}
  .tl-s{font-size:26px}.tl-s i{width:10px;height:10px}
  .tl h3{font-size:14px}.tl-sh{font-size:12px}
}
@media (max-width:1100px){.tls{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:640px){.tls{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}}

.sw-img.min-sw img{object-position:50% 50%}
@media (max-width:1100px){.sw-img.min-sw img{object-position:92% 50%}}
@media (orientation:landscape) and (max-height:500px) and (max-width:950px){.sw-img.min-sw img{object-position:92% 50%}}
@media (max-width:639px){.sw-img.min-sw img{object-position:50% 52%}}