/* SNOW Global – industry detail pages. Builds on styles.css (same colours, fonts, buttons, reveals). */
.ph{position:relative;overflow:hidden;color:#fff;background:linear-gradient(160deg,#0c1f66,#050e2b 70%);padding:calc(var(--nav) + 70px) 0 90px}
.ph:before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(60% 70% at 85% 30%,#1747c94d,transparent 70%),repeating-linear-gradient(90deg,#ffffff06 0 1px,transparent 1px 80px)}
.ph .wrap{position:relative;display:grid;grid-template-columns:1.05fr .95fr;gap:64px;align-items:center}
.crumbs{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:0 0 26px;padding:0;font:600 .8rem var(--fb);letter-spacing:.04em;color:#9fb2dc}
.crumbs li+li:before{content:"/";margin-inline-end:8px;color:#ffffff40}
.crumbs a{color:#c9d6f2;text-decoration:none;transition:color 160ms ease}.crumbs [aria-current]{color:var(--gold)}
.ph .tag{color:var(--gold);max-width:none}
.ph h1{font-size:clamp(1.9rem,4vw,3.2rem);color:#fff;margin:0 0 24px}
.ph p{color:#c9d6f2;margin:0 0 16px;font-size:1.04rem;max-width:620px}
.ph .cta{display:flex;flex-wrap:wrap;gap:14px;margin-top:30px}
.pfig{position:relative;margin:0;aspect-ratio:4/3.4;border-radius:26px}
.pfig .im{border-radius:26px;overflow:hidden;box-shadow:0 40px 80px #00000066}
.pfig .im img{will-change:transform}
.pfig:before{content:"";position:absolute;inset:-14px -14px 22px 22px;border:2px solid var(--gold);border-radius:30px;opacity:0;transform:translate(-10px,10px);transition:opacity 700ms var(--ease-out) 500ms,transform 900ms var(--ease-out) 500ms}
.pfig.in:before{opacity:.55;transform:none}
.cats{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;list-style:none;margin:0;padding:0}
.cat{position:relative;display:flex;align-items:center;gap:16px;padding:24px 24px 24px 22px;border-radius:18px;background:#fff;border:1px solid #0c1f661a;box-shadow:0 14px 30px #0c1f6612;overflow:hidden;transition:transform 220ms var(--ease-out),box-shadow 220ms ease,border-color 220ms ease}
.cat:before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:linear-gradient(var(--royal),var(--gold));transform:scaleY(0);transform-origin:top;transition:transform 500ms var(--ease-out)}
.cat.in:before{transform:scaleY(1);transition-delay:calc(var(--i,0)*60ms + 250ms)}
.cat .n{flex:none;display:grid;place-items:center;width:30px;height:30px;border-radius:50%;color:var(--royal);background:var(--tint);transform:scale(.6);opacity:0;transition:transform 500ms var(--ease-out),opacity 400ms ease;transition-delay:calc(var(--i,0)*60ms + 200ms)}.cat .n svg{width:16px;height:16px}.cat.in .n{transform:none;opacity:1}
.cat h3{font:700 .98rem/1.45 var(--fb);text-transform:none;letter-spacing:0;color:var(--ink);margin:0}
.cat.other{grid-column:1/-1;background:linear-gradient(135deg,var(--indigo),var(--royal));border-color:transparent;color:#fff}
.cat.other h3{color:#fff}.cat.other .n{background:var(--gold);color:var(--ink)}
.cat.other:before{background:var(--gold)}

.appr{display:grid;grid-template-columns:1.1fr .9fr;gap:70px;align-items:center}
.appr h2{margin-bottom:6px}.appr p{font-size:1.06rem}
.ctab{position:relative;padding:40px 38px;border-radius:26px;color:#fff;background:linear-gradient(135deg,#071a52,var(--indigo) 55%,var(--royal));box-shadow:0 30px 60px #0c1f6659;overflow:hidden}
.ctab:after{content:"";position:absolute;right:-60px;top:-60px;width:200px;height:200px;border-radius:50%;border:2px solid #e3a02b55;pointer-events:none}
.ctab p{color:#e6edfa!important;font:600 1.12rem/1.6 var(--fb);margin:0 0 26px}
.ctab .meta{margin-top:24px;padding-top:20px;border-top:1px solid #ffffff1f;font-size:.92rem;color:#c9d6f2}
.ctab .meta a{color:#fff;text-decoration:none}.ctab .meta div+div{margin-top:4px}

.pn{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.pn a{position:relative;display:flex;align-items:center;gap:18px;min-height:120px;padding:18px;border-radius:20px;background:#fff;border:1px solid #0c1f661a;text-decoration:none;color:var(--ink);box-shadow:0 14px 30px #0c1f6612;transition:transform 220ms var(--ease-out),box-shadow 220ms ease}
.pn img{width:110px;height:84px;object-fit:cover;border-radius:14px;flex:none}
.pn small{display:block;font:700 .72rem var(--fb);letter-spacing:.12em;text-transform:uppercase;color:var(--golddk);margin-bottom:4px}
.pn b{font:800 1rem/1.3 var(--fd);text-transform:uppercase;letter-spacing:.02em}
.pn .nx{flex-direction:row-reverse;text-align:end}
.pn .ar{flex:none;font-size:1.3rem;color:var(--royal);transition:transform 220ms var(--ease-out)}.pn a>span:last-child{flex:1}

.pc .more{position:absolute;z-index:2;right:16px;top:16px;padding:6px 12px;border-radius:999px;background:#ffffffe6;color:var(--ink);font:700 .7rem var(--fb);letter-spacing:.08em;text-transform:uppercase;opacity:0;transform:translateY(-6px);transition:opacity 200ms ease,transform 220ms var(--ease-out)}
@media(hover:none){.pc .more{opacity:1;transform:none}}

#wipe.hold{visibility:visible;pointer-events:all}#wipe.hold i{transform:none}

@media(hover:hover) and (pointer:fine){
 .crumbs a:hover{color:var(--gold)}
 .cat:hover{transform:translateY(-4px);box-shadow:0 24px 44px #0c1f6626;border-color:#1747c933}
 .pn a:hover{transform:translateY(-4px);box-shadow:0 24px 44px #0c1f6626}
 .pn .pv:hover .ar{transform:translateX(-5px)}.pn .nx:hover .ar{transform:translateX(5px)}
 .pc:hover .more{opacity:1;transform:none}
 .ctab .meta a:hover{color:var(--gold)}
}
@media(max-width:1000px){.cats{grid-template-columns:repeat(2,1fr)}}
@media(max-width:900px){
 .ph{padding:calc(var(--nav) + 40px) 0 70px}
 .ph .wrap,.appr{grid-template-columns:1fr;gap:46px}
  .pfig:before{inset:-10px -10px 16px 16px}
 .ph .cta .btn{flex:1;display:flex;align-items:center;justify-content:center;text-align:center}
}
@media(max-width:620px){.cats{grid-template-columns:1fr;gap:12px}.cat{padding:16px 18px;gap:14px}.pn{grid-template-columns:1fr}.pn img{width:84px;height:68px}.ctab{padding:30px 24px}}
@media(prefers-reduced-motion:reduce){.cat .n{transform:none;opacity:1;transition:none}.pfig:before,.cat:before{transition:none;opacity:1;transform:none}.cat:before{transform:scaleY(1)}}
/* Trade route line, examples note, clickable "Other" card, related links, "What to send us" */
.ph .tline{display:flex;gap:12px;align-items:flex-start;margin:22px 0 0;padding:14px 18px;border-radius:14px;background:#ffffff0f;border:1px solid #e3a02b4d;color:#fff;font-weight:600;font-size:.98rem;max-width:620px}
.ph .tline svg{flex:none;width:22px;height:22px;color:var(--gold);margin-top:1px}
.cat.other{padding:0}
.cat.other a{display:flex;align-items:center;gap:16px;width:100%;padding:24px 24px 24px 22px;color:inherit;text-decoration:none}
.cat.other .go{margin-inline-start:auto;font-size:1.3rem;color:var(--gold);transition:transform 220ms var(--ease-out)}
.rel{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:28px;font-size:.92rem;color:var(--muted)}
.rel span{font-weight:700;margin-inline-end:4px}
.rel a{padding:8px 16px;border-radius:999px;border:1.5px solid #0c1f6633;color:var(--indigo);font-weight:700;text-decoration:none;transition:background-color 160ms ease,color 160ms ease,border-color 160ms ease}
.send{margin-top:30px;padding:26px 28px;border-radius:20px;background:#fff;border:1px solid #0c1f661a;box-shadow:0 14px 30px #0c1f6612}
.send h3{font-size:1rem;letter-spacing:.06em;color:var(--ink);margin:0 0 14px}
.send ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:10px 24px}
.send li{position:relative;padding-inline-start:22px;font-size:.95rem;line-height:1.45;color:var(--text)}
.send li:before{content:"";position:absolute;left:0;top:.5em;width:8px;height:8px;border-radius:50%;background:var(--gold)}
[dir=rtl] .send li:before{left:auto;right:0}
@media(hover:hover) and (pointer:fine){.cat.other:hover .go{transform:translateX(5px)}.rel a:hover{background:var(--indigo);color:#fff;border-color:var(--indigo)}}
@media(max-width:620px){.send ul{grid-template-columns:1fr}.send{padding:22px 20px}.cat.other a{padding:16px 18px;gap:14px}}
.ctab>*{position:relative;z-index:1}.ctab:after{z-index:0;opacity:.6}
@media(max-width:620px){.ctab:after{width:140px;height:140px;right:-70px;top:-70px}}
/* Arabic (right-to-left) */
[dir=rtl] .cat:before{left:auto;right:0}
[dir=rtl] .ph .tline svg,[dir=rtl] .cat.other .go,[dir=rtl] .pn .ar{transform:scaleX(-1)}
[dir=rtl] .pfig:before{inset:-14px 22px 22px -14px;transform:translate(10px,10px)}
[dir=rtl] .pfig.in:before{transform:none}
[dir=rtl] .ctab:after{right:auto;left:-60px}
[dir=rtl] .pc .more{right:auto;left:16px}
@media(hover:hover) and (pointer:fine){[dir=rtl] .cat.other:hover .go{transform:scaleX(-1) translateX(5px)}[dir=rtl] .pn .pv:hover .ar{transform:scaleX(-1) translateX(-5px)}[dir=rtl] .pn .nx:hover .ar{transform:scaleX(-1) translateX(5px)}}
@media(max-width:900px){[dir=rtl] .pfig:before{inset:-10px 16px 16px -10px}}
/* keep photo corners rounded during the reveal animation */
.pfig .im{clip-path:inset(0 0 100% 0 round 26px)}.pfig .im.in{clip-path:inset(0 round 26px)}.pfig .im img{border-radius:inherit}
@media(prefers-reduced-motion:reduce){.pfig .im{clip-path:inset(0 round 26px)}}